/* Contact section: editorial introduction, form card, directory, brand signature. */
.reliability-flow-stack { background: #d14d3b; }
#co-create { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); align-items: center; gap: clamp(40px, 5vw, 100px); width: min(100% - 112px, 1560px); margin: 0 auto; padding: 32px 0 90px; overflow: visible; text-align: left; }
.contact-intro { min-width: 0; }
.contact-intro__label { margin: 0 0 24px; color: #ffe2d4; font-size: 22px; font-weight: 500; }
#co-create .co-create-kicker { margin: 0; font-size: clamp(36px, 3.8vw, 66px); font-weight: 500; line-height: 1.24; letter-spacing: -.035em; text-align: left; white-space: normal; }
.contact-intro__subtitle { margin: 28px 0 0; color: #ffe9df; font-size: clamp(18px, 1.5vw, 25px); line-height: 1.6; }
#co-create .co-create-form { align-self: center; box-sizing: border-box; width: 100%; min-width: 0; margin: 0; padding: clamp(30px, 3.7vw, 60px); column-gap: 26px; row-gap: 26px; border-radius: 26px; background: #fffdfb; color: #221b18; }
#co-create .co-create-form__row { display: flex; align-items: center; gap: 12px; min-width: 0; border-bottom: 1px solid #cfc6c0; }
.contact-field--company, .contact-field--message { grid-column: 1 / -1; }
.contact-field__label { flex: 0 0 auto; font-size: 16px; line-height: 1.5; font-weight: 550; }
#co-create .co-create-form__row input { flex: 1 1 0; width: 0; min-width: 0; height: 58px; min-height: 58px; margin: 0; padding: 0 48px 0 2px; border: 0; border-radius: 0; color: #221b18; background: transparent; font-size: 16px; font-weight: 400; line-height: normal; text-align: left; }
#co-create .co-create-form__row input::placeholder { color: #8a817b; font-size: 13px; }
#co-create .co-create-form__row:focus-within { border-color: #bd3e2e; box-shadow: 0 1px 0 #bd3e2e; }
#co-create .co-create-form__row input:focus { outline: none; }
/* Keep immediate hints at input height, with reserved space for typed text. */
#co-create .co-create-required-hint { top: 50%; right: 0; transform: translateY(-50%); font-size: 11px; padding: 3px 7px; }
#co-create .co-create-form__consent { grid-column: 1 / -1; justify-content: flex-start; align-items: flex-start; gap: 10px; margin: 6px 0 0; color: #42362e; font-size: 14px; font-weight: 400; line-height: 1.7; text-align: left; }
#co-create .co-create-form__consent input { flex: 0 0 18px; width: 18px; height: 18px; margin: 3px 0 0; accent-color: #bf3c2d; }
#co-create .co-create-form__consent a { color: #ae3023; text-decoration: underline; text-underline-offset: 3px; }
#co-create .co-create-form__submit { grid-column: 1 / -1; width: 100%; min-width: 0; min-height: 54px; margin: 6px 0 0; padding: 14px 22px; border-radius: 100px; background: #c33e2f; color: white; font-size: 18px; line-height: 1.4; white-space: nowrap; }
#co-create .co-create-form__submit:hover:not(:disabled) { background: #9c2d23; }
#co-create .co-create-form__submit:disabled { background: #ead5cb; color: #715b4e; opacity: 1; }
#co-create .co-create-form__status { grid-column: 1 / -1; margin: 0; color: #9c2d23; font-size: 14px; }
#co-create .co-create-form__status:empty { display: none; }
#co-create .contact-recommendations { padding: 16px; border: 0; background: #f7ede6; }
#co-create.is-sent .contact-intro { visibility: hidden; pointer-events: none; }
.contact-details { width: min(100% - 112px, 1560px); margin: 0 auto; padding: 0 0 34px; }
.contact-directory { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(140px, .8fr) minmax(140px, .8fr); gap: 48px; padding: 44px 0 50px; border-top: 1px solid #ffffff38; }
.contact-directory .site-footer__nav { align-items: flex-start; gap: 18px; }
.contact-directory .site-footer__nav--contact { grid-column: 1; grid-row: 1; }
.contact-directory .site-footer__nav a { color: #ffede4; font-size: 16px; line-height: 1.6; text-align: left; }
.contact-directory .site-footer__nav a:hover { color: #fff; }
.contact-directory .site-footer__nav--contact a { max-width: 410px; }
.contact-directory .site-footer__nav .contact-directory__brand { display: flex; align-items: center; gap: 14px; margin-bottom: 8px; color: #fff; font-size: 30px; font-weight: 600; }
.contact-directory__brand img { width: 40px; height: 40px; }
.contact-legal { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px 32px; padding-top: 24px; border-top: 1px solid #ffffff38; }
.contact-legal .site-footer__copyright, .contact-legal .site-footer__beian, .contact-legal .site-footer__icp { color: #ffe0d2; font-size: 12px; line-height: 1.7; }
.contact-legal .site-footer__filings { display: flex; flex-wrap: wrap; gap: 12px 24px; }
/* The last screen contains only the existing large brand signature. */
.site-footer, .site-footer__inner { min-height: 0; }
.site-footer__inner { width: min(100% - 96px, 1680px); padding: clamp(64px, 8vw, 150px) 0; }
.site-footer__brand-row { position: relative; top: auto; left: auto; width: 100%; margin: 0; transform: none; }
.site-footer__brand { width: 100%; }
.site-footer__brand img { width: clamp(48px, 10vw, 190px); height: clamp(48px, 10vw, 190px); margin-right: clamp(14px, 3vw, 46px); }
.site-footer__brand-word { font-size: clamp(48px, 12.9vw, 244px); }
@media(max-width:1000px) {
 #co-create { width: calc(100% - 64px); gap: 32px; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); }
 #co-create .co-create-form { padding: 30px 24px; column-gap: 18px; }
 .contact-field--phone, .contact-field--email { grid-column: 1 / -1; }
 .contact-details { width: calc(100% - 64px); }
 .contact-directory { gap: 24px; }
}
@media(max-width:720px) {
 #co-create { width: calc(100% - 40px); grid-template-columns: 1fr; padding: 12px 0 48px; gap: 32px; }
 #co-create .co-create-kicker { font-size: clamp(32px, 7vw, 46px); }
 .contact-intro__label { margin-bottom: 16px; font-size: 18px; }
 .contact-intro__subtitle { margin-top: 18px; font-size: 17px; }
 #co-create .co-create-form { padding: 30px 22px; row-gap: 20px; border-radius: 22px; }
 #co-create .co-create-form__row input { height: 50px; min-height: 50px; }
 .contact-details { width: calc(100% - 40px); }
 .contact-directory { grid-template-columns: 1fr 1fr; padding: 32px 0; gap: 32px 24px; }
 .contact-directory .site-footer__nav--contact { grid-column: 1 / -1; grid-row: 1; }
 .contact-directory .site-footer__nav a { font-size: 14px; }
 .contact-legal { flex-direction: column; align-items: flex-start; }
 .site-footer__inner { width: calc(100% - 32px); padding: 66px 0; }
}

/* Reuse the first-screen aurora and star motion across the complete contact area. */
.reliability-flow-stack { overflow: hidden; isolation: isolate; background: #f96c53; }
.reliability-flow-stack > .contact-ambient { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; background: linear-gradient(150deg, #ffad97 0%, #fb7159 45%, #d94730 100%); pointer-events: none; }
.reliability-flow-stack > .contact-ambient::after { display: none; }
.reliability-flow-stack > .reliability-flow { background: transparent; }
.contact-details { position: relative; }
.contact-intro__label, #co-create .co-create-kicker, .contact-intro__subtitle { color: #291913; }
.contact-directory .site-footer__nav a, .contact-directory .site-footer__nav .contact-directory__brand { color: #291913; }
.contact-directory .site-footer__nav a:hover { color: #000; }
.contact-legal .site-footer__copyright, .contact-legal .site-footer__beian, .contact-legal .site-footer__icp { color: #382017; }
.contact-directory, .contact-legal { border-color: #43201833; }
/* White contact headline with a brand-red color sweep as it enters view. */
#co-create .co-create-kicker, #co-create .contact-intro__subtitle { color: #fff; }
#co-create .contact-intro__subtitle { margin-top: 28px; font-size: clamp(27px, 2.7vw, 46px); line-height: 1.45; font-weight: 500; letter-spacing: -.025em; text-wrap: balance; }

/* Reference timing: staggered lettering and form rows, eased layer-button mask. */
.contact-letter { display: inline-block; white-space: pre; }
.contact-motion-ready .contact-letter { opacity: 0; transform: translate3d(0, .65em, 0); }
.contact-motion-visible .contact-letter { animation: contact-letter-enter 1.2s cubic-bezier(.76,0,.24,1) var(--letter-delay,0ms) both; }
@keyframes contact-letter-enter {
 0% { opacity: 0; transform: translate3d(0,.65em,0); color: #b91f15; }
 42% { opacity: .9; color: #ee6555; }
 100% { opacity: 1; transform: translate3d(0,0,0); color: var(--letter-rest-color, #fff); }
}
#co-create .co-create-form.contact-motion-ready { opacity: 0; transform: translate3d(0,48px,0); transition: opacity 1s cubic-bezier(.76,0,.24,1), transform 1.2s cubic-bezier(.76,0,.24,1); }
#co-create .co-create-form.contact-motion-visible { opacity: 1; transform: translate3d(0,0,0); }
#co-create .co-create-form > .contact-motion-ready { opacity: 0; transform: translate3d(0,28px,0); transition: opacity 1s cubic-bezier(.76,0,.24,1) var(--entry-delay,0ms), transform 1.2s cubic-bezier(.76,0,.24,1) var(--entry-delay,0ms); }
#co-create .co-create-form > .contact-motion-visible { opacity: 1; transform: translate3d(0,0,0); }
#co-create .co-create-form__submit { position: relative; isolation: isolate; overflow: hidden; background: #cc3529; box-shadow: none; }
#co-create .co-create-form__submit::before { content: ''; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: #6f1914; transform: translate3d(-102%,0,0); transition: transform .6s cubic-bezier(.76,0,.24,1); }
#co-create .co-create-form__submit:hover:not(:disabled), #co-create .co-create-form__submit:focus-visible:not(:disabled) { background: #cc3529; color: #fff; transform: none; }
#co-create .co-create-form__submit:hover:not(:disabled)::before, #co-create .co-create-form__submit:focus-visible:not(:disabled)::before { transform: translate3d(0,0,0); }
#co-create .co-create-form__submit:disabled::before { display: none; }
@media(max-width:1000px) { .contact-field--name, .contact-field--position { grid-column: 1 / -1; } }
@media(max-width:720px) { #co-create .contact-intro__subtitle { font-size: clamp(26px, 5.8vw, 38px); margin-top: 20px; } }
@media(prefers-reduced-motion:reduce) {
 .contact-motion-ready .contact-letter, .contact-motion-visible .contact-letter { animation: none; opacity: 1; transform: none; color: #fff; }
 #co-create .co-create-form.contact-motion-ready, #co-create .co-create-form > .contact-motion-ready { opacity: 1; transform: none; transition: none; }
 #co-create .co-create-form__submit::before { transition: none; }
}

/* Center the text group in the left column, preserving its left-aligned lines. */
#co-create .contact-intro { justify-self: center; align-self: center; width: max-content; max-width: 100%; margin: 0 auto; }
#co-create .co-create-kicker, #co-create .contact-intro__subtitle { text-align: left; }
/* Final red-to-white accent also works before JS and with reduced motion. */
#co-create .co-create-kicker { background: linear-gradient(100deg, #c52b22 0%, #ee8876 13%, #fff0e8 27%, #fff 38%); background-clip: text; -webkit-background-clip: text; color: transparent; }
#co-create .co-create-kicker .contact-letter { color: var(--letter-rest-color, #fff); }
@media (prefers-reduced-motion: reduce) { #co-create .co-create-kicker .contact-letter { color: var(--letter-rest-color, #fff); } }
@media(max-width:720px) { #co-create .contact-intro { justify-self: start; width: 100%; margin: 0; } }

/* One continuous accent line and a quieter subtitle, rather than per-character colors. */
#co-create .contact-intro { width: min(100%, 580px); }
#co-create .co-create-kicker { background: none; color: #fff; font-size: clamp(34px, 3.45vw, 60px); line-height: 1.32; letter-spacing: -.025em; font-weight: 500; }
.contact-title-line { display: block; }
#co-create .contact-title-line--accent { margin-bottom: .12em; background: linear-gradient(100deg, #ffd0bc 0%, #ffe3d7 40%, #fff 85%); background-clip: text; -webkit-background-clip: text; color: transparent; }
#co-create .contact-intro__subtitle { margin-top: 32px; font-size: clamp(24px, 2.2vw, 36px); line-height: 1.5; font-weight: 400; letter-spacing: .015em; color: #fff8f3; text-wrap: balance; }
#co-create .contact-title-line.contact-motion-ready, #co-create .contact-intro__subtitle.contact-motion-ready { opacity: 0; transform: translate3d(0,24px,0); transition: opacity 1s cubic-bezier(.22,1,.36,1) var(--entry-delay,0ms), transform 1.2s cubic-bezier(.22,1,.36,1) var(--entry-delay,0ms); }
#co-create .contact-title-line.contact-motion-visible, #co-create .contact-intro__subtitle.contact-motion-visible { opacity: 1; transform: none; }
@media(max-width:720px) { #co-create .co-create-kicker { font-size: clamp(30px, 7.3vw, 46px); } #co-create .contact-intro__subtitle { font-size: clamp(23px, 5.5vw, 30px); margin-top: 24px; } }
@media(prefers-reduced-motion:reduce) { #co-create .contact-title-line.contact-motion-ready, #co-create .contact-intro__subtitle.contact-motion-ready { opacity: 1; transform: none; transition: none; } }

/* Center the actual text group, not an oversized text container. */
#co-create .contact-intro { width: fit-content; max-width: 100%; justify-self: center; align-self: center; margin: 0; }
#co-create .contact-title-line--accent { background-image: linear-gradient(100deg, #ed7760 0%, #ffbb62 5%, #ffd052 10%, #ffdc83 18%, #ffe6b0 30%, #fff0d3 43%, #fff8ed 60%, #fff8ed 100%); }
#co-create .contact-intro__subtitle { color: #fff1e8; }
@media(max-width:720px) { #co-create .contact-intro { width: fit-content; max-width: 100%; justify-self: center; margin: 0 auto; } }

/* Warm yellow contact button, retaining the sliding hover layer. */
#co-create .co-create-form__submit:not(:disabled) { background: #cc3529; color: #fff; transition: color .5s cubic-bezier(.76,0,.24,1); }
#co-create .co-create-form__submit::before { background: #f7802c; }
#co-create .co-create-form__submit:hover:not(:disabled), #co-create .co-create-form__submit:focus-visible:not(:disabled) { background: #cc3529; color: #382710; }

/* Larger contact copy and a translucent white wash on the success card. */
#co-create .co-create-kicker { font-size: clamp(36px, 3.8vw, 66px); }
#co-create .contact-intro__subtitle { font-size: clamp(26px, 2.45vw, 40px); }
.co-create-success__card > .hero__background::after { display: block; content: ''; position: absolute; inset: 0; width: 100%; height: 100%; z-index: 4; background: linear-gradient(135deg, rgb(255 255 255 / .5), rgb(255 255 255 / .27)); opacity: 1; filter: none; transform: none; pointer-events: none; }
.co-create-success__card { border: 1px solid rgb(255 255 255 / .6); box-shadow: inset 0 1px 0 rgb(255 255 255 / .6), 0 24px 70px #752a2426; }
@media(max-width:720px) { #co-create .co-create-kicker { font-size: clamp(32px, 8vw, 50px); } #co-create .contact-intro__subtitle { font-size: clamp(24px, 5.9vw, 33px); } }
