/* AI PM Console contact forms. Load ONLY on the two form routes and their aliases via Asset Injector Pages. Header, title and footer use body.path-contact; do not enable globally.
   Visual language of the product page (ai-pm-console.css): #f7f7f2 ground, left-aligned editorial column, one mono label form, hairlines, 4px corners, dark button with an arrow.
   Theme rules this file has to beat: .bg-light (!important, white title band), custom.css .contact-form .form-item-name/mail (inline-block 48.5%), .contact-form input[type=submit] (50rem radius, !important), .text-muted (!important). */

/* 01 — Page chrome */
body.path-contact { background:#f7f7f2; color:#272b27; overflow-x:clip; }
body.path-contact .navbar { background:#f7f7f2; border-bottom:1px solid #d6d9cf; }
body.path-contact .site-branding .logo-dark { filter:brightness(0); }
body.path-contact .navbar .btn-primary { background:#272b27; border-color:#272b27; color:#f7f7f2; }

/* 02 — Title: the product's section head. Breadcrumb becomes the mono chapter marker above a left-aligned headline, a hairline closes the head. Same 992px column as the form. */
body.path-contact .title-wrapper,
body.path-contact .title-wrapper.bg-light { background:transparent !important; }
body.path-contact .title-wrapper .container { max-width:1040px; padding:0 24px; text-align:left; }
body.path-contact .title-wrapper .row { margin:0; }
body.path-contact .title-wrapper .row > div { flex:0 0 100%; width:100%; max-width:100%; margin:0; padding:0; }
body.path-contact .region-title { display:flex; flex-direction:column; padding:128px 0 44px; border-bottom:1px solid #d6d9cf; }
body.path-contact .block-page-title-block { max-width:none; margin:0; padding:0; }
body.path-contact h1.title { margin:0; color:#272b27; font:450 64px/1.06 -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif; letter-spacing:-.04em; text-align:left; text-wrap:balance; }
body.path-contact .block-system-breadcrumb-block { display:block; order:-1; margin:0 0 24px; }
body.path-contact .block-system-breadcrumb-block .breadcrumb { display:flex; flex-wrap:wrap; justify-content:flex-start; margin:0; padding:0; background:none; color:#62665f; font:400 11px/1.6 "SFMono-Regular",Consolas,"Liberation Mono",monospace; letter-spacing:.075em; text-transform:uppercase; }
body.path-contact .block-system-breadcrumb-block .breadcrumb-item { display:flex; align-items:center; padding:0; color:#62665f; font:inherit; letter-spacing:inherit; }
body.path-contact .block-system-breadcrumb-block .breadcrumb-item + .breadcrumb-item::before { content:"/"; float:none; padding:0 .7em; color:#62665f; font:inherit; }
body.path-contact .block-system-breadcrumb-block a { display:inline-block; padding:4px 0; color:#62665f; text-decoration:none; transition:color 180ms ease; }
body.path-contact .block-system-breadcrumb-block .breadcrumb-item:last-child a { color:#272b27; }
body.path-contact .block-system-breadcrumb-block a:hover { color:#272b27; text-decoration:underline; text-underline-offset:3px; }
body.path-contact .block-system-breadcrumb-block a:focus-visible { outline:2px solid #5F6C1A; outline-offset:3px; }

/* 03 — Layout */
body.path-contact #main-container { max-width:1040px; padding:48px 24px 112px; }
body.path-contact #content { width:100%; padding-inline:0; }
body.path-contact #main-container > .row { margin-inline:0; }

/* 04 — Form: on desktop the short fields stack on the left (5 of 12) and the right column (7 of 12) holds the subject above the message, which fills the rest of the combined height; acknowledgement and button run full width below. */
form.contact-message-become-a-design-partner-form,
form.contact-message-investor-contact-form { display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); grid-template-rows:auto auto auto 1fr; column-gap:32px; margin:0; font:400 16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif; color:#272b27; }
form.contact-message-become-a-design-partner-form *,
form.contact-message-investor-contact-form *,
form.contact-message-become-a-design-partner-form *::before,
form.contact-message-investor-contact-form *::before,
form.contact-message-become-a-design-partner-form *::after,
form.contact-message-investor-contact-form *::after { box-sizing:border-box; }
form.contact-message-become-a-design-partner-form > *,
form.contact-message-investor-contact-form > * { grid-column:1 / -1; min-width:0; }
form.contact-message-become-a-design-partner-form > input[type=hidden],
form.contact-message-investor-contact-form > input[type=hidden] { display:none !important; }
form.contact-message-become-a-design-partner-form .form-item-name,
form.contact-message-become-a-design-partner-form .form-item-mail,
form.contact-message-investor-contact-form .form-item-name,
form.contact-message-investor-contact-form .form-item-mail { display:block; width:auto; }
form.contact-message-become-a-design-partner-form .form-item-name,
form.contact-message-investor-contact-form .form-item-name { grid-column:1; grid-row:1; }
form.contact-message-become-a-design-partner-form .form-item-mail,
form.contact-message-investor-contact-form .form-item-mail { grid-column:1; grid-row:2; }
form.contact-message-become-a-design-partner-form .field--name-field-company,
form.contact-message-investor-contact-form .field--name-field-company { grid-column:1; grid-row:3; }
form.contact-message-become-a-design-partner-form .field--name-subject,
form.contact-message-investor-contact-form .field--name-subject { grid-column:2; grid-row:1; }
form.contact-message-become-a-design-partner-form .field--name-message,
form.contact-message-investor-contact-form .field--name-message { grid-column:2; grid-row:2 / 5; }
/* The subject sits on the first row, level with the name; the message takes the two rows below it plus a fourth, flexible row that is empty on the left. Grid sizes the three field rows from the left fields alone and gives any extra message height to that row, so resizing the message never spreads the left fields apart.
   The message stretches down its grid area: every wrapper is a flex column, the textarea grows from a 168px base so it never pushes the rows taller. */
form.contact-message-become-a-design-partner-form .field--name-message,
form.contact-message-investor-contact-form .field--name-message,
form.contact-message-become-a-design-partner-form .field--name-message .js-form-item,
form.contact-message-investor-contact-form .field--name-message .js-form-item,
form.contact-message-become-a-design-partner-form .field--name-message .form-textarea-wrapper,
form.contact-message-investor-contact-form .field--name-message .form-textarea-wrapper { display:flex; flex-direction:column; }
form.contact-message-become-a-design-partner-form .field--name-message .js-form-item,
form.contact-message-investor-contact-form .field--name-message .js-form-item,
form.contact-message-become-a-design-partner-form .field--name-message .form-textarea-wrapper,
form.contact-message-investor-contact-form .field--name-message .form-textarea-wrapper { flex:1 1 auto; }
form.contact-message-become-a-design-partner-form .js-form-item,
form.contact-message-investor-contact-form .js-form-item { margin:0 0 28px !important; }
form.contact-message-become-a-design-partner-form .field--widget-string-textfield,
form.contact-message-investor-contact-form .field--widget-string-textfield,
form.contact-message-become-a-design-partner-form .field--widget-string-textarea,
form.contact-message-investor-contact-form .field--widget-string-textarea,
form.contact-message-become-a-design-partner-form .field--widget-boolean-checkbox,
form.contact-message-investor-contact-form .field--widget-boolean-checkbox { margin:0 !important; }

/* Labels: the product's one mono label form. */
form.contact-message-become-a-design-partner-form label,
form.contact-message-investor-contact-form label { display:block; margin:0 0 10px; color:#272b27; font:400 11px/1.6 "SFMono-Regular",Consolas,"Liberation Mono",monospace; letter-spacing:.075em; text-transform:uppercase; }
form.contact-message-become-a-design-partner-form label.form-required::after,
form.contact-message-investor-contact-form label.form-required::after { content:" *"; display:inline; width:auto; height:auto; margin:0; background:none; color:#62665f; vertical-align:baseline; }

/* "Optional" sits on the label row, right-aligned, like the product's split figure labels. */
form.contact-message-become-a-design-partner-form .field--name-field-company .js-form-item,
form.contact-message-investor-contact-form .field--name-field-company .js-form-item { position:relative; }
form.contact-message-become-a-design-partner-form .field--name-field-company .description,
form.contact-message-investor-contact-form .field--name-field-company .description { position:absolute; top:0; right:0; margin:0; color:#62665f !important; font:400 11px/1.6 "SFMono-Regular",Consolas,"Liberation Mono",monospace; letter-spacing:.075em; text-transform:uppercase; }

/* Fields */
form.contact-message-become-a-design-partner-form input[type=text],
form.contact-message-become-a-design-partner-form input[type=email],
form.contact-message-investor-contact-form input[type=text],
form.contact-message-investor-contact-form input[type=email],
form.contact-message-become-a-design-partner-form textarea,
form.contact-message-investor-contact-form textarea { display:block; width:100%; max-width:100%; min-height:52px; margin:0; padding:14px 16px; border:1px solid #868d80; border-radius:4px; background:#fdfdfa; color:#272b27; font:400 16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif; box-shadow:none; outline:2px solid transparent; outline-offset:9px; transition:border-color 180ms cubic-bezier(.2,.8,.2,1), outline-offset 180ms cubic-bezier(.2,.8,.2,1); }
form.contact-message-become-a-design-partner-form textarea,
form.contact-message-investor-contact-form textarea { flex:1 0 auto; height:168px; min-height:168px; resize:vertical; }
form.contact-message-become-a-design-partner-form input::placeholder,
form.contact-message-investor-contact-form input::placeholder,
form.contact-message-become-a-design-partner-form textarea::placeholder,
form.contact-message-investor-contact-form textarea::placeholder { color:#62665f; opacity:1; }
form.contact-message-become-a-design-partner-form input:hover,
form.contact-message-become-a-design-partner-form textarea:hover,
form.contact-message-investor-contact-form input:hover,
form.contact-message-investor-contact-form textarea:hover { border-color:#272b27; }
form.contact-message-become-a-design-partner-form input:focus,
form.contact-message-become-a-design-partner-form textarea:focus,
form.contact-message-investor-contact-form input:focus,
form.contact-message-investor-contact-form textarea:focus { border-color:#272b27; background-color:#fdfdfa; box-shadow:none; }
/* Keyboard focus: the product's ring, arriving a little wide and closing in. */
form.contact-message-become-a-design-partner-form input:focus-visible,
form.contact-message-become-a-design-partner-form textarea:focus-visible,
form.contact-message-become-a-design-partner-form a:focus-visible,
form.contact-message-investor-contact-form input:focus-visible,
form.contact-message-investor-contact-form textarea:focus-visible,
form.contact-message-investor-contact-form a:focus-visible { outline:2px solid #5F6C1A; outline-offset:3px; }
form.contact-message-become-a-design-partner-form input.error,
form.contact-message-become-a-design-partner-form input[aria-invalid=true],
form.contact-message-become-a-design-partner-form textarea.error,
form.contact-message-become-a-design-partner-form textarea[aria-invalid=true],
form.contact-message-investor-contact-form input.error,
form.contact-message-investor-contact-form input[aria-invalid=true],
form.contact-message-investor-contact-form textarea.error,
form.contact-message-investor-contact-form textarea[aria-invalid=true] { border-color:#a82d23; box-shadow:inset 0 0 0 1px #a82d23; }
form.contact-message-become-a-design-partner-form .description,
form.contact-message-investor-contact-form .description { display:block; margin:6px 0 0; color:#62665f !important; font:400 14px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif; }
form.contact-message-become-a-design-partner-form a,
form.contact-message-investor-contact-form a { color:#272b27; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }

/* 05 — Privacy acknowledgement: set off by a hairline, as a remark rather than a field. */
form.contact-message-become-a-design-partner-form .field--name-field-privacy-acknowledgement,
form.contact-message-investor-contact-form .field--name-field-privacy-acknowledgement { margin-top:8px !important; padding-top:28px; border-top:1px solid #d6d9cf; }
form.contact-message-become-a-design-partner-form .field--name-field-privacy-acknowledgement .js-form-item,
form.contact-message-investor-contact-form .field--name-field-privacy-acknowledgement .js-form-item { position:relative; min-height:0; margin-bottom:0 !important; padding-left:34px; }
form.contact-message-become-a-design-partner-form input[type=checkbox],
form.contact-message-investor-contact-form input[type=checkbox] { -webkit-appearance:none; appearance:none; position:absolute; left:0; top:2px; float:none; width:20px; height:20px; margin:0; border:1px solid #868d80; border-radius:3px; background:#fdfdfa no-repeat center / 12px 12px; box-shadow:none; cursor:pointer; transition:background-color 180ms ease, border-color 180ms ease; }
form.contact-message-become-a-design-partner-form input[type=checkbox]:hover,
form.contact-message-investor-contact-form input[type=checkbox]:hover { border-color:#272b27; }
form.contact-message-become-a-design-partner-form input[type=checkbox]:checked,
form.contact-message-investor-contact-form input[type=checkbox]:checked { border-color:#272b27; background-color:#272b27; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.4 6.3 4.9 8.7 9.6 3.4' fill='none' stroke='%23f7f7f2' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
form.contact-message-become-a-design-partner-form input[type=checkbox][aria-invalid=true],
form.contact-message-investor-contact-form input[type=checkbox][aria-invalid=true] { border-color:#a82d23; box-shadow:inset 0 0 0 1px #a82d23; }
form.contact-message-become-a-design-partner-form .field--name-field-privacy-acknowledgement label,
form.contact-message-investor-contact-form .field--name-field-privacy-acknowledgement label { min-height:24px; margin:0 0 4px; color:#272b27; font:400 16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif; letter-spacing:normal; text-transform:none; cursor:pointer; }

/* 06 — Submit: the product's .pmc-button — dark, 4px corners, text left and an arrow that nudges on hover. */
form.contact-message-become-a-design-partner-form .form-actions,
form.contact-message-investor-contact-form .form-actions { display:flex; align-items:center; margin:36px 0 0 !important; }
form.contact-message-become-a-design-partner-form [type=submit],
form.contact-message-investor-contact-form [type=submit] { display:inline-block; width:auto; min-height:52px; margin:0; padding:16px 62px 16px 22px; border:1px solid #272b27; border-radius:4px !important; background:#272b27 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M1 7h11.2M7.6 2.4 12.2 7l-4.6 4.6' fill='none' stroke='%23f7f7f2' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat right 22px center / 14px 14px; color:#f7f7f2; font:400 14px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif; letter-spacing:0; text-align:left; box-shadow:none; transform:none; cursor:pointer; transition:background-color 180ms cubic-bezier(.2,.8,.2,1), background-position 180ms cubic-bezier(.2,.8,.2,1), translate 90ms cubic-bezier(.2,.8,.2,1); }
@media(hover:hover) {
form.contact-message-become-a-design-partner-form [type=submit]:hover,
form.contact-message-investor-contact-form [type=submit]:hover { border-color:#444c41; background-color:#444c41; background-position:right 18px center; color:#f7f7f2; box-shadow:none; transform:none; } }
form.contact-message-become-a-design-partner-form [type=submit]:active,
form.contact-message-investor-contact-form [type=submit]:active { border-color:#444c41; background-color:#444c41; color:#f7f7f2; translate:0 1px; }
form.contact-message-become-a-design-partner-form [type=submit]:focus-visible,
form.contact-message-investor-contact-form [type=submit]:focus-visible { outline:2px solid #5F6C1A; outline-offset:4px; box-shadow:none; }
form.contact-message-become-a-design-partner-form [aria-disabled=true],
form.contact-message-investor-contact-form [aria-disabled=true] { cursor:progress; }
form.contact-message-become-a-design-partner-form[aria-busy=true] [type=submit],
form.contact-message-investor-contact-form[aria-busy=true] [type=submit] { background-image:none; padding-right:22px; }
form.contact-message-become-a-design-partner-form[aria-busy=true] .form-actions::after,
form.contact-message-investor-contact-form[aria-busy=true] .form-actions::after { content:""; display:inline-block; flex:none; width:18px; height:18px; margin-left:16px; border:2px solid #868d80; border-top-color:#272b27; border-radius:50%; animation:pmcf-spin 800ms linear infinite; }

/* 06b — Investor submit: the hero's .pmc-text-link, not the dark button. The investor route is the quieter of the two tracks on the product page (a text link beside the design-partner button), so its form closes the same way — no fill, no box, just the label on a hairline with the arrow held at the end of a 28px gap. The underline draws in from the left on hover, exactly as in the hero, and the arrow nudges 3px right and 2px up; the 45px of right padding is the arrow plus that gap plus the room it needs to move into. */
form.contact-message-investor-contact-form [type=submit] { min-height:48px; padding:0 45px 0 0; border:0; border-bottom:1px solid #272b27; border-radius:0 !important; background:linear-gradient(#272b27,#272b27) left bottom / 0 1px no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M1 7h11.2M7.6 2.4 12.2 7l-4.6 4.6' fill='none' stroke='%23272b27' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat right 3px center / 14px 14px; color:#272b27; transition:background-size 320ms cubic-bezier(.2,.8,.2,1), background-position 180ms cubic-bezier(.2,.8,.2,1), outline-offset 180ms cubic-bezier(.2,.8,.2,1); }
@media(hover:hover) {
form.contact-message-investor-contact-form [type=submit]:hover { border-color:#272b27; background-color:transparent; background-size:100% 1px, 14px 14px; background-position:left bottom, right 0 top calc(50% - 2px); color:#272b27; } }
form.contact-message-investor-contact-form [type=submit]:active { border-color:#272b27; background-color:transparent; color:#272b27; translate:none; }
form.contact-message-investor-contact-form [type=submit]:focus-visible { outline:2px solid #5F6C1A; outline-offset:4px; }
/* While sending, the arrow gives way to the spinner in .form-actions; the underline stays, so the control keeps its shape. */
form.contact-message-investor-contact-form[aria-busy=true] [type=submit] { padding-right:0; background-image:linear-gradient(#272b27,#272b27); }

/* 07 — Errors */
form.contact-message-become-a-design-partner-form .form-item--error-message,
form.contact-message-investor-contact-form .form-item--error-message,
body.path-contact [data-drupal-messages] .alert-danger { color:#a82d23; font-size:14px; line-height:1.6; }
form.contact-message-become-a-design-partner-form .form-item--error-message,
form.contact-message-investor-contact-form .form-item--error-message { margin-top:8px; }
body.path-contact [data-drupal-messages] .alert-danger { background:#fff3f1; border:1px solid #a82d23; padding:20px; border-radius:4px; }
body.path-contact [data-drupal-messages] .alert-danger a { color:#a82d23; text-underline-offset:3px; }

/* 08 — Footer */
body.path-contact .dialog-off-canvas-main-canvas > footer { background:#242824; color:#b9bfb3; }
body.path-contact .dialog-off-canvas-main-canvas > footer h5,
body.path-contact .dialog-off-canvas-main-canvas > footer .lead,
body.path-contact .dialog-off-canvas-main-canvas > footer a { color:#edf0e6; }
body.path-contact .dialog-off-canvas-main-canvas > footer img { filter:brightness(0) invert(1); }
body.path-contact .dialog-off-canvas-main-canvas > footer .icon, body.path-contact .dialog-off-canvas-main-canvas > footer .icon i { color:#b9bfb3 !important; }
body.path-contact .dialog-off-canvas-main-canvas > footer hr { border-top-color:#4a5048; opacity:1; }

@keyframes pmcf-spin { to { transform:rotate(360deg); } }
@media(min-width:992px) { body.path-contact .navbar .navbar-nav .nav-link, body.path-contact .navbar .nav-link-search { color:#272b27; } }

/* 08b — Scroll-to-top button: the theme's ring with an arrow, bottom right, in the page's ground and ink so it matches the product page. */
body.path-contact .progress-wrap { background:#f7f7f2; box-shadow:inset 0 0 0 2px #d6d9cf, 0 1px 3px rgba(36,40,36,.12); }
body.path-contact .progress-wrap::after { color:#272b27; }
body.path-contact .progress-wrap svg.progress-circle path { stroke:#272b27; }

/* 09 — Tablet and phone: one column, full-width button. */
@media(max-width:991px) { body.path-contact h1.title { font-size:52px; } }
@media(max-width:767px) {
body.path-contact .region-title { padding:72px 0 32px; }
body.path-contact h1.title { font-size:40px; }
body.path-contact #main-container { padding:36px 24px 72px; }
form.contact-message-become-a-design-partner-form,
form.contact-message-investor-contact-form { grid-template-columns:minmax(0,1fr); grid-template-rows:none; }
form.contact-message-become-a-design-partner-form .form-item-name,
form.contact-message-become-a-design-partner-form .form-item-mail,
form.contact-message-become-a-design-partner-form .field--name-field-company,
form.contact-message-become-a-design-partner-form .field--name-subject,
form.contact-message-become-a-design-partner-form .field--name-message,
form.contact-message-investor-contact-form .form-item-name,
form.contact-message-investor-contact-form .form-item-mail,
form.contact-message-investor-contact-form .field--name-field-company,
form.contact-message-investor-contact-form .field--name-subject,
form.contact-message-investor-contact-form .field--name-message { grid-column:1; grid-row:auto; }
form.contact-message-become-a-design-partner-form textarea,
form.contact-message-investor-contact-form textarea { flex:none; height:200px; }
form.contact-message-become-a-design-partner-form .form-actions,
form.contact-message-investor-contact-form .form-actions { position:relative; }
form.contact-message-become-a-design-partner-form [type=submit] { width:100%; }
form.contact-message-investor-contact-form [type=submit] { width:auto; }
form.contact-message-become-a-design-partner-form[aria-busy=true] .form-actions::after,
form.contact-message-investor-contact-form[aria-busy=true] .form-actions::after { position:absolute; right:18px; top:17px; margin:0; border-color:#b9bfb3; border-top-color:#f7f7f2; pointer-events:none; }
}

/* 10 — Preferences */
@media(prefers-reduced-motion:reduce) {
body.path-contact .block-system-breadcrumb-block a,
form.contact-message-become-a-design-partner-form *,
form.contact-message-investor-contact-form * { transition:none !important; animation:none !important; }
form.contact-message-become-a-design-partner-form[aria-busy=true] .form-actions::after,
form.contact-message-investor-contact-form[aria-busy=true] .form-actions::after { animation:none !important; }
}
/* Windows high contrast drops background images: give the checkbox back its native look. */
@media(forced-colors:active) {
form.contact-message-become-a-design-partner-form input[type=checkbox],
form.contact-message-investor-contact-form input[type=checkbox] { -webkit-appearance:auto; appearance:auto; }
}
