/* V13 — quieter scale, tailored offer, and a clearer contact experience. */
:root { --content-max: 1480px; }

/* Give the original wide bus scene its native ratio instead of cropping it. */
.work-project[data-sector="advertising"] .work-viewport {
  height: auto;
  aspect-ratio: 1916 / 821;
  background: #080708;
}
.work-project[data-sector="advertising"] .bus-route-frame { object-position: center; }
.work-project[data-sector="advertising"] .work-viewport:after { bottom: 12px; right: 12px; }

/* Keep the scale expressive without letting headings dominate whole screens. */
.page-hero h1 { font-size: clamp(54px, 6.7vw, 105px); line-height: .91; }
.hero-copy h1 { font-size: clamp(62px, 8vw, 132px); }
.section-head h2, .lab h2, .outcomes h2, .faq h2 { font-size: clamp(48px, 5.5vw, 84px); line-height: .95; }
.contact-copy h2 { font-size: clamp(52px, 6vw, 88px); line-height: .93; }
.footer-v5-intro h2, .page-cta h2 { font-size: clamp(54px, 6.2vw, 96px); line-height: .92; }
.page-section-head h2, .split-feature h2, .dark-showcase h2, .deliverables h2,
.architecture h2, .collaboration h2, .inspo-note h2, .prepare h2,
.works-intro h2, .before-after-copy h2, .direction-intro h2,
.design-lab-head h2, .check-tool-head h2, .check-explain>div:first-child h2 {
  font-size: clamp(48px, 5.6vw, 86px); line-height: .94;
}
.work-copy h2 { font-size: clamp(40px, 4.1vw, 66px); }
.page-hero { min-height: min(760px, 88vh); }

/* Make the shared brand prominent on desktop as well as mobile. */
.site-header { height: 88px; }
.site-header.scrolled { height: 80px; }
.site-header .brand { gap: 14px; font-size: 14px; }
.site-header .brand img { width: 64px; height: 64px; flex: none; }
.site-header .brand b { font-size: 10px; }

/* Website check: the URL field and its score share one horizontal row. */
.website-check-page .page-hero { display: block; min-height: 0; padding-top: 132px; padding-bottom: 48px; }
.website-check-page .page-index { margin-top: 34px; }
.website-check-page .page-hero h1 { max-width: 1050px; margin-bottom: 24px; }
.website-check-page .page-hero-copy>p { max-width: 930px; }
.website-check-page .url-audit { display: block; padding-top: 56px; padding-bottom: 90px; }
.website-check-page .url-audit-copy { margin-bottom: 34px; }
.website-check-page .url-audit-copy h2 { font-size: clamp(42px, 4.4vw, 72px); margin: 14px 0; }
.website-check-page .url-audit-copy p { margin: 0; max-width: 850px; }
.website-check-page .url-audit-panels { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: clamp(24px, 4vw, 70px); align-items: start; }
.website-check-page .url-audit-form { min-width: 0; }
.website-check-page .check-gauge { width: min(100%, 370px); max-width: 370px; margin: 0 auto; padding: 11%; }
.website-check-page .check-gauge>strong { font-size: clamp(58px, 6vw, 96px); }
.website-check-page .check-gauge.is-empty>strong { font-size: clamp(43px, 4vw, 60px); }
@media(max-width: 900px) {
  .website-check-page .url-audit-panels { grid-template-columns: 1fr; }
  .website-check-page .check-gauge { margin-top: 20px; }
}
@media(max-width: 720px) {
  .website-check-page .page-hero { padding-top: 108px; padding-bottom: 38px; }
  .website-check-page .page-index { margin-top: 30px; }
  .website-check-page .url-audit { padding-top: 44px; padding-bottom: 70px; }
  .website-check-page .url-audit-copy h2 { font-size: clamp(39px, 10vw, 58px); }
  .website-check-page .url-audit-copy p { font-size: 17px; }
  .website-check-page .url-audit-form { padding: 22px; }
  .website-check-page .check-gauge { width: min(82vw, 330px); }
}

/* One individually planned scope, not three product tiers. */
.bespoke { display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, .82fr); gap: clamp(35px, 7vw, 110px); align-items: center; background: radial-gradient(circle at 80% 18%, #4965c338, transparent 38%), linear-gradient(135deg, #122452, #0c1734); border-top: 1px solid #4b67a550; }
.bespoke-heading h2 { font-size: clamp(56px, 6vw, 98px); line-height: .92; letter-spacing: -.07em; margin: 26px 0 28px; }
.bespoke-heading h2 em, .bespoke-page-intro h2 em { color: #abb8ff; font-style: normal; }
.bespoke-heading p { color: #c2cde9; font-size: clamp(18px, 1.35vw, 21px); line-height: 1.6; max-width: 620px; margin-bottom: 34px; }
.bespoke-details { border: 1px solid #8197d75c; background: #0b1533a8; padding: clamp(25px, 3vw, 42px); box-shadow: 0 28px 95px #05091555; }
.bespoke-details>span, .bespoke-page-grid article>span { color: #aebdff; font: 600 11px var(--mono); letter-spacing: .1em; }
.bespoke-details>div { display: grid; grid-template-columns: 45px 1fr; column-gap: 12px; padding: 22px 0; border-bottom: 1px solid #8295cb3b; }
.bespoke-details>div b { color: #99acff; font: 600 12px var(--mono); grid-row: span 2; }
.bespoke-details>div strong { font-size: clamp(21px, 1.7vw, 27px); letter-spacing: -.04em; }
.bespoke-details>div p { grid-column: 2; margin: 5px 0 0; color: #aeb9d6; font-size: 15px; line-height: 1.5; }
.bespoke-details>small { display: block; margin-top: 23px; color: #c8d4fa; font-size: 14px; }
.bespoke-hero-note { min-height: 320px; width: min(100%, 500px); padding: 30px; border: 1px solid #8d9ff263; background: radial-gradient(circle at 90% 10%, #697aff55, transparent 52%), #111d40; display: flex; flex-direction: column; }
.bespoke-hero-note span { color: #b9c6ff; font: 600 11px var(--mono); letter-spacing: .1em; }
.bespoke-hero-note strong { margin: auto 0; font-size: clamp(35px, 3vw, 52px); line-height: 1; letter-spacing: -.06em; }
.bespoke-hero-note i { font-style: normal; color: #aebaff; font-size: 27px; align-self: end; }
.bespoke-page { padding: clamp(72px, 8vw, 120px) var(--pad); background: linear-gradient(135deg,#101d42,#182a5b); }
.bespoke-page-intro { max-width: 890px; }
.bespoke-page-intro h2 { font-size: clamp(54px, 6vw, 92px); line-height: .91; letter-spacing: -.07em; margin: 25px 0; }
.bespoke-page-intro p { color: #c7d0e9; font-size: clamp(18px, 1.4vw, 22px); line-height: 1.6; }
.bespoke-page-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 55px 0 35px; }
.bespoke-page-grid article { border: 1px solid #a2b4eb53; padding: 32px; min-height: 245px; background: #0b1634ad; }
.bespoke-page-grid h3 { font-size: clamp(23px, 2vw, 32px); line-height: 1.09; letter-spacing: -.04em; margin: 45px 0 15px; }
.bespoke-page-grid p { font-size: 16px; line-height: 1.5; color: #afbcda; }

/* A more editorial, tighter accordion. */
.page-faq { max-width: 1270px; padding-top: 72px; padding-bottom: 90px; }
.page-faq details { border: 1px solid #8799d346; border-bottom: 0; background: #101b3bd9; transition: background .2s, border-color .2s; }
.page-faq details:last-child { border-bottom: 1px solid #8799d346; }
.page-faq details[open] { background: linear-gradient(110deg,#1a2c5a,#111c3c); border-color: #a5b7f677; }
.page-faq summary { grid-template-columns: 52px minmax(0, 1fr) 34px; gap: 18px; padding: 19px 25px; font-size: clamp(19px, 1.55vw, 24px); line-height: 1.25; letter-spacing: -.03em; }
.page-faq summary:hover { color: #bdcbff; }
.page-faq summary span { color: #9eacff; font-size: 12px; }
.page-faq summary i { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid #a5b6ee83; border-radius: 50%; color: #ccd6ff; font-size: 21px; }
.page-faq details p { padding: 0 65px 23px 95px; max-width: 1000px; color: #c5cee4; font-size: 17px; line-height: 1.58; }
.accordion summary { font-size: clamp(18px, 1.5vw, 22px); }

/* Replace the oversized percent display with a small live three-point signal. */
.page-hero:has(.briefing-status) { min-height: 560px; }
.briefing-status { min-height: 330px; padding: 28px; border-color: #90a7eb76; background: radial-gradient(circle at 72% 40%,#4a62cb31,transparent 42%), #101d40cb; }
.briefing-status-top { display: flex; justify-content: space-between; gap: 15px; }
.briefing-status-top span, .briefing-status-top b { color: #b1c1f9; font: 600 10px var(--mono); letter-spacing: .08em; }
.briefing-status-top b { color: #85dbc4; }
.briefing-symbol { height: 75px; width: 130px; position: relative; margin: 15px 0 5px; }
.briefing-symbol i { position: absolute; inset: 10px auto auto 0; border: 1px solid #b1bfff76; border-radius: 50%; width: 65px; height: 65px; background: transparent!important; }
.briefing-symbol i:nth-child(2) { left: 22px; }
.briefing-symbol i:nth-child(3) { left: 44px; }
.briefing-symbol b { position: absolute; top: 23px; left: 64px; color: #b9c3ff; font-size: 33px; font-weight: 400; }
.briefing-status strong { display: block; margin: 0 0 25px; font-size: clamp(30px, 3vw, 47px); line-height: 1.07; letter-spacing: -.055em; }
.briefing-status strong em { color: #b5c2ff; font-style: normal; }
.briefing-progress { margin-top: auto; border-top: 1px solid #a7b8ed48; padding-top: 17px; }
.briefing-progress>span { color: #bac7e7; font-size: 13px; }
.briefing-progress>div { display: flex; gap: 6px; margin-top: 14px; }
.briefing-progress i { display: block; flex: 1; height: 4px; background: #6d81b75e!important; transition: background .3s; }
.briefing-progress i.complete { background: #9faeff!important; }
.briefing-layout { grid-template-columns: minmax(250px,.65fr) minmax(0,1.35fr); gap: clamp(40px, 6vw, 105px); padding-top: 85px; padding-bottom: 95px; background: radial-gradient(circle at 5% 20%,#6355d643,transparent 30%),radial-gradient(circle at 96% 78%,#1cbbdf27,transparent 31%),#0b1430; }
.briefing-form-intro { align-self: start; position: sticky; top: 120px; }
.briefing-form-intro h2 { font-size: clamp(46px, 4.7vw, 78px); line-height: .94; letter-spacing: -.07em; margin: 28px 0; }
.briefing-form-intro h2 em { font-style: normal; color: #b8c3ff; }
.briefing-form-intro p { color: #bdc7e0; font-size: 18px; line-height: 1.6; max-width: 410px; }
.briefing-form-intro>div { margin-top: 70px; border-top: 1px solid #8b9bce60; padding-top: 20px; }
.briefing-form-intro a { color: #e5eaff; font-size: 16px; text-decoration: none; overflow-wrap: anywhere; }
.briefing-form-intro small { display: block; margin-top: 10px; color: #96a5d1; }
.briefing-form { border: 1px solid #91a5de58; padding: clamp(25px, 3vw, 46px); background: linear-gradient(150deg,#1b2c5b99,#0f1938dc); box-shadow: 0 30px 100px #03071159; }
.briefing-form:before { display: none; content: none; }
.briefing-form-top { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 28px; margin-bottom: 12px; border-bottom: 1px solid #a1b4e355; color: #b7c4f8; font: 600 11px var(--mono); }
.briefing-form .form-grid { gap: 27px 25px; }
.briefing-form label { color: #c6d3ee; font-size: 12px; letter-spacing: .045em; }
.briefing-form input,.briefing-form select,.briefing-form textarea { border: 0; border-bottom: 1px solid #9aacd478; border-radius: 0; background: transparent; padding: 13px 0 15px; margin-top: 8px; font: 400 17px var(--sans); }
.briefing-form input::placeholder,.briefing-form textarea::placeholder { color: #9ba9ca; opacity: 1; }
.briefing-form .briefing-message { display: block; margin-top: 35px; }
.briefing-form textarea { min-height: 120px; }
.briefing-submit { display: flex; justify-content: space-between; align-items: end; gap: 25px; margin-top: 23px; }
.briefing-submit p { color: #a6b3d1; font-size: 12px; line-height: 1.55; max-width: 390px; margin: 0; }
.briefing-submit p a { color: #d8e1ff; }
.briefing-submit .button { width: auto; min-width: 250px; margin: 0; border-radius: 999px; background: linear-gradient(105deg,#8d72ff,#54b9e9); color: #071129; }

/* Echo the original Nexus contact mood without forcing a heavy box or tall form. */
.contact { min-height: 0; padding-top: clamp(70px, 7vw, 110px); padding-bottom: clamp(70px, 7vw, 110px); background: radial-gradient(circle at 0 15%,#614fbd3a,transparent 36%),radial-gradient(circle at 100% 90%,#1aabc44a,transparent 35%),#0c1531; }
.contact-form-v11 { border: 0; border-radius: 0; background: transparent; box-shadow: none; padding: clamp(20px, 2.5vw, 36px); position: relative; isolation: isolate; }
.contact-form-v11:before { content: ''; position: absolute; inset: 0; z-index: -1; border: 1px solid #9aaadd56; background: radial-gradient(circle at 80% 12%,#897aff21,transparent 30%),radial-gradient(circle at 20% 87%,#5dbadb1c,transparent 33%),#0d1734be; }
.contact-form-v11 .contact-form-intro h3 { font-size: clamp(32px, 2.8vw, 44px); }
.contact-form-v11 input,.contact-form-v11 textarea { border: 0; border-bottom: 1px solid #9aaed379; border-radius: 0; background: transparent; padding: 12px 0; box-shadow: none; }
.contact-form-v11 input:focus,.contact-form-v11 textarea:focus { box-shadow: none; border-bottom-color: #c1ceff; }
.contact-form-v11 .project-choice-grid button { min-height: 45px; padding: 10px 13px; border-radius: 0; background: #14244d; font-size: 13px; }
.contact-form-v11 .project-choice-grid button.active { background: #acc0ff; }
.contact-form-v11 textarea { min-height: 110px; }
.contact-form-bottom .button { border-radius: 999px; background: linear-gradient(105deg,#8d72ff,#54b9e9); color: #071129; }

@media(max-width: 900px) {
  .bespoke,.briefing-layout { grid-template-columns: 1fr; }
  .briefing-form-intro { position: static; }
  .briefing-form-intro>div { margin-top: 30px; }
  .bespoke-page-grid { grid-template-columns: 1fr; }
  .bespoke-page-grid article { min-height: 0; }
  .bespoke-page-grid h3 { margin-top: 25px; }
}
@media(max-width: 720px) {
  .site-header,.site-header.scrolled { height: 80px; }
  .site-header .brand { gap: 10px; font-size: 12px; }
  .site-header .brand img { width: 54px; height: 54px; }
  .site-header .brand b { font-size: 9px; }
  .site-header .menu-toggle { width: 42px; height: 42px; }
  .site-header .menu-toggle i { left: 13px; }
  .site-header .menu-toggle i:first-child { top: 17px; }
  .site-header .menu-toggle i:last-child { top: 23px; }
  .site-header .menu-toggle[aria-expanded=true] i:first-child,
  .site-header .menu-toggle[aria-expanded=true] i:last-child { top: 20px; }
  .site-header .mobile-nav { top: 80px; }
  .hero { min-height: 0; padding-bottom: 80px; }
  .hero .nexus-stage { position: relative; top: auto; right: auto; width: min(92vw, 460px); max-width: none; margin: 42px auto 30px; opacity: 1; }
  .hero .nexus-stage .core { width: 58%; }
  .hero .nexus-stage .core img { width: 90%; height: 90%; }
  .process-track .track-line { height: var(--mobile-line-height, 0px); }
  .process-track .track-line i,.process-track.visible .track-line i { width: 1px; height: var(--mobile-progress, 0%); transition: none; }
  .process-track article:first-of-type:before { border-color: #5e6470; box-shadow: none; }
  .process-track article.is-active:before { border-color: var(--cyan); box-shadow: 0 0 15px var(--cyan); }
  .page-hero h1 { font-size: clamp(43px, 11vw, 68px); line-height: .96; }
  .hero-copy h1 { font-size: clamp(52px, 13vw, 82px); }
  .section-head h2,.lab h2,.outcomes h2,.faq h2 { font-size: clamp(42px, 11vw, 67px); }
  .contact-copy h2,.footer-v5-intro h2,.page-cta h2 { font-size: clamp(43px, 10.5vw, 68px); }
  .page-section-head h2,.split-feature h2,.dark-showcase h2,.deliverables h2,.architecture h2,.collaboration h2,.inspo-note h2,.prepare h2,.works-intro h2,.before-after-copy h2,.direction-intro h2,.design-lab-head h2,.check-tool-head h2,.check-explain>div:first-child h2 { font-size: clamp(42px, 11vw, 67px); }
  .work-copy h2 { font-size: clamp(36px, 10vw, 56px); }
  .work-project[data-sector="advertising"] .work-viewport { aspect-ratio: 1916 / 821; }
  .work-project[data-sector="advertising"] .work-viewport:after { font-size: 7px; padding: 6px; }
  .bespoke-heading h2,.bespoke-page-intro h2 { font-size: clamp(48px, 12vw, 70px); }
  .bespoke-details { padding: 22px; }
  .page-faq { padding-top: 40px; padding-bottom: 65px; }
  .page-faq summary { grid-template-columns: 34px minmax(0,1fr) 28px; gap: 10px; padding: 17px 13px; font-size: 17px; }
  .page-faq summary i { width: 26px; height: 26px; font-size: 18px; }
  .page-faq details p { font-size: 15px; line-height: 1.55; padding: 0 17px 20px 57px; }
  .page-hero:has(.briefing-status) { min-height: 0; }
  .briefing-status { min-height: 270px; width: 100%; }
  .briefing-status strong { font-size: 33px; }
  .briefing-layout { gap: 35px; padding-top: 60px; padding-bottom: 65px; }
  .briefing-form-intro h2 { font-size: clamp(46px, 12vw, 64px); }
  .briefing-form { padding: 22px; }
  .briefing-form .form-grid { grid-template-columns: 1fr; gap: 22px; }
  .briefing-submit { align-items: stretch; flex-direction: column-reverse; }
  .briefing-submit .button { width: 100%; min-width: 0; }
  .contact { gap: 45px; }
  .contact-form-v11 { padding: 18px; }
}