/* One brand surface; gold is an accent, not a competing section theme. */
.pain-quote { position:relative; padding:44px 0; margin-block:16px 24px; color:var(--ink); }
.pain-quote::before,.pain-quote::after { content:""; display:block; position:absolute; width:48px; height:34.2px; background:url('/img/figma-page/brand-quote.svg') center/contain no-repeat; pointer-events:none; }
.pain-quote::before { top:0; right:0; left:auto; bottom:auto; }
.pain-quote::after { bottom:0; left:0; right:auto; top:auto; transform:rotate(180deg); }
.section-cta { display:flex; flex-direction:column; align-items:flex-start; gap:8px; margin-top:40px; position:relative; z-index:4; }
.section-cta .btn { max-width:100%; white-space:normal; gap:20px; text-align:center; }
.section-cta .btn svg { flex:none; }
.section-cta p { margin:4px 0 0; max-width:52ch; font-size:16px; line-height:1.5; color:var(--muted); }
.section-cta small { font-size:14px; color:var(--muted); }
@media(max-width:699px) {
  .section-cta { margin-top:28px; }
  .section-cta .btn { width:100%; justify-content:space-between; padding:14px 18px; font-size:17px; }
}
:root { --paper:#fff; --cream:#fff; --cream-2:#f7f5ef; --ink:#111223; --navy:#111223; --gold:#eccc6e; }
main > section:not(.hero) { position:relative; isolation:isolate; }
.brand-outline { color:var(--ink); -webkit-text-stroke:1px var(--gold); paint-order:stroke fill; }
.dark .brand-outline { color:var(--gold); -webkit-text-stroke:0; }
.dream-section { background:var(--cream-2); }
.dream-section::before { content:""; position:absolute; z-index:-1; width:min(45vw,620px); aspect-ratio:1; left:2%; bottom:12%; background:url('/img/figma-hero/blob.svg') center/contain no-repeat; opacity:.5; pointer-events:none; }
.dream-title { max-width:24ch; }
.pain-section { overflow:visible; background:var(--paper); }
.pain-section::before,.pain-section::after { display:none; }
.pain-stage { display:grid; grid-template-columns:1fr 1fr; align-items:start; gap:72px; }
.pain-narrative { position:sticky; top:48px; padding-bottom:24px; }
.pain-title { margin-bottom:24px; }
.pains { display:block; grid-column:auto; grid-row:auto; padding-bottom:60px; margin:0; }
.pain,.pain:nth-child(2),.pain:nth-child(3) { position:sticky; top:48px; z-index:1; margin:0 0 140px; min-height:280px; padding:36px 32px 64px 112px; border:1px solid var(--gold); border-radius:20px; background:var(--paper); box-shadow:none; transform:none!important; opacity:1!important; visibility:visible!important; }
.pain:nth-child(2) { top:72px; z-index:2; }
.pain:nth-child(3) { top:96px; z-index:3; margin-bottom:0; }
.pain h3 { font-size:26px; line-height:1.2; }
.pain p { font-size:18px; line-height:1.6; }
.pain-graphic,.pain:nth-child(2) .pain-graphic,.pain:nth-child(3) .pain-graphic { display:block; position:absolute; width:64px; height:104px; object-fit:contain; right:auto; left:28px; top:36px; }
.pain-number { width:58px; height:62px; left:auto; right:0; bottom:0; }
.pain-number span { width:28px; height:28px; font-size:15px; }
.pain-stack-spacer { display:none; }
.services-section { background:var(--cream-2); }
.scope-note { max-width:65ch; margin:32px 0 16px; font-size:16px; color:var(--muted); }
.service-paths { gap:40px 64px; }
.service-paths article { border-color:var(--gold); }
.service-paths h3 { font-size:26px; }
.ui { overflow:hidden; }
.ui::before { display:block; content:""; position:absolute; z-index:-1; left:-160px; top:0; width:620px; aspect-ratio:1; background:url('/img/figma-hero/blob.svg') center/contain no-repeat; opacity:.12; pointer-events:none; }
.ui-shot { border:1px solid rgba(236,204,110,.35); padding:12px; border-radius:20px; }
.steps { counter-reset:steps; }
.step { border-top:1px solid var(--gold); padding-top:24px; }
.step::before { color:var(--gold-deep); }
.about-fig { position:relative; isolation:isolate; }
.about-fig::before { content:""; position:absolute; inset:-24px; z-index:-1; background:url('/img/figma-hero/blob.svg') center/contain no-repeat; transform:rotate(12deg); }
.tools span { background:var(--cream-2); border:1px solid var(--gold); }
.btn { transition:background-color 180ms ease,transform 180ms ease,box-shadow 180ms ease; }
.btn:active { transform:translateY(1px) scale(.98); }
.text-link { color:var(--ink); }
.dark .text-link { color:var(--cream); }
.text-link:focus-visible,.mcard:focus-visible { outline:3px solid var(--gold-deep); outline-offset:4px; }
.dark .mcard:focus-visible { outline-color:var(--gold); }
@media(hover:hover) and (pointer:fine) {
  main > section:not(.hero) .btn:hover { transform:translateY(-2px); box-shadow:0 8px 20px -12px rgba(17,18,35,.4); }
  .text-link:hover { text-decoration-color:var(--gold-deep); }
  .mcard:hover .mcard-f img { transform:scale(1.025); }
  .mcard-f img { transition:transform 250ms ease; }
}
@media(max-width:859px) {
  .hero p.lede { max-width:38ch; } /* Existing mobile flow grows naturally with approved copy. */
}
@media(max-width:999px) {
  .pain-stage { display:block; max-width:620px; }
  .pain-narrative { position:relative; top:auto; padding-bottom:28px; }
}
@media(max-width:699px) {
  .pain-stage { display:block; }
  .pain-narrative { position:relative; top:auto; padding-bottom:28px; }
  .pains { padding-bottom:48px; margin:0; }
  .pain,.pain:nth-child(2),.pain:nth-child(3) { min-height:264px; padding:28px 24px 58px 84px; top:24px; margin-bottom:108px; }
  .pain:nth-child(2) { top:44px; }
  .pain:nth-child(3) { top:64px; margin-bottom:0; }
  .pain h3 { font-size:22px; }.pain p { font-size:16px; }
  .pain-graphic,.pain:nth-child(2) .pain-graphic,.pain:nth-child(3) .pain-graphic { right:auto; left:16px; top:30px; width:48px; height:88px; }
  .service-paths { gap:28px; }.service-paths h3 { font-size:24px; }
  .dream-section::before { width:90vw; bottom:12%; left:0; }
  .step { padding:24px 40px 0 0; }.step::before { top:24px; }
  .about-fig { margin:16px; }
}
@media(max-height:540px),(prefers-reduced-motion:reduce) {
  .pain-narrative { position:relative; top:auto; }
  .pain,.pain:nth-child(2),.pain:nth-child(3) { position:relative; top:auto; margin-bottom:20px; }
  .pains { padding-bottom:0; }
}
@media(prefers-reduced-motion:reduce) { .btn,.mcard-f img { transition:none; }.btn:active { transform:none; } }

/* Two synchronized, equal-width groups make each lane seamless. */
.project-marquee .morph-cards { display:block; overflow:hidden; padding:56px 0; scroll-snap-type:none; }
.project-lane { direction:ltr; overflow:hidden; padding:12px 0; transform:rotate(3deg) scale(1.04); }
.project-track,.project-group { display:flex; align-items:center; width:max-content; }
.project-track { animation:project-flow 95s linear infinite; animation-play-state:paused; }
.project-lane:nth-child(2) .project-track { animation-direction:reverse; animation-duration:100s; }
.project-group { gap:24px; padding-right:24px; flex:none; }
.project-marquee .mcard { flex:0 0 clamp(280px,31vw,480px); width:clamp(280px,31vw,480px); aspect-ratio:16/9; height:auto; border-radius:12px; overflow:hidden; }
.project-marquee .mcard-f img { object-position:top; object-fit:cover; }
.project-marquee .mcard-b { min-height:0; padding:10px 14px; border:0; border-radius:0; background:var(--ink); color:var(--paper); opacity:0; transition:opacity 160ms cubic-bezier(.23,1,.32,1); }
.project-marquee .mcard-b b,.project-marquee .mcard-b span { color:var(--paper); }.project-marquee .mcard-b i { display:none; }
.project-marquee .mcard:focus-within .mcard-b { opacity:1; }
.project-marquee .mcard:focus-visible .mcard-in { outline:3px solid var(--gold-deep); outline-offset:-4px; }
.marquee-running .project-track { animation-play-state:running; }
.project-marquee .morph-cards:focus-within .project-track { animation-play-state:paused; }
@media(hover:hover) and (pointer:fine) {
 .project-marquee .mcard:hover .mcard-b { opacity:1; }
}
@keyframes project-flow { to { transform:translateX(-50%); } }
.marquee-reduced .project-track,.marquee-keyboard .project-track { animation:none; transform:none; }
.marquee-reduced .project-lane,.marquee-keyboard .project-lane { transform:none; overflow-x:auto; padding-inline:24px; }
.marquee-reduced .project-clone,.marquee-keyboard .project-clone { display:none; }
.marquee-reduced .mcard-b,.marquee-keyboard .mcard-b { opacity:1; }
@media(max-width:699px) {
 .project-marquee .morph-cards { padding:32px 0; }
 .project-group { gap:16px; padding-right:16px; }
 .project-marquee .mcard { flex-basis:78vw; width:78vw; }
 .project-marquee .mcard-b { opacity:1; padding:6px 10px; }
 .project-marquee .mcard-b b { font-size:15px; }.project-marquee .mcard-b span { font-size:12px; }
}
/* Unified campaign surfaces and contrast. */
html { scroll-padding-top:104px; }
.site-header { position:fixed; top:12px; inset-inline:0; z-index:50; background:transparent; padding:0 20px; }
.site-header.nav-enhanced { transform:translateY(0); opacity:1; transition:transform 240ms cubic-bezier(.22,1,.36,1),opacity 180ms cubic-bezier(.22,1,.36,1); will-change:transform; }
.site-header.nav-enhanced.nav-hidden:not(.nav-open) { transform:translateY(calc(-100% - 20px)); opacity:0; pointer-events:none; }
.site-header .wrap { width:min(1200px,100%); max-width:none; margin:auto; min-height:64px; padding:10px 24px; gap:32px; justify-content:space-between; background:var(--paper); border:1px solid var(--line); border-radius:16px; box-shadow:0 8px 24px rgba(17,18,35,.07); }
.nav-brand { display:block; flex:none; color:var(--ink); text-decoration:none; font-size:21px; font-weight:700; line-height:1.1; }
.nav-brand span { display:block; font-size:12px; font-weight:400; margin-top:4px; }
.site-header .hero-nav { width:auto; gap:28px; font-size:18px; }
.site-header .hero-nav a { display:flex; align-items:center; min-height:44px; padding:4px 8px; }
.site-header .hero-nav a:last-child { background:var(--gold); border-radius:8px; padding-inline:18px; }
.nav-toggle { display:none; font:inherit; background:var(--gold); color:var(--ink); border:0; border-radius:8px; min-height:44px; padding:8px 12px; gap:8px; align-items:center; cursor:pointer; }
.site-header a:focus-visible,.nav-toggle:focus-visible { outline:3px solid var(--gold-deep); outline-offset:3px; }
.nav-toggle:active { transform:scale(.98); }
@media(max-width:699px) {
 .site-header { top:8px; padding-inline:12px; }
 .site-header .wrap { flex-wrap:wrap; padding:8px 12px; min-height:60px; gap:8px; }
 .nav-brand { font-size:19px; }.nav-brand span { font-size:11px; }
 .site-header.nav-enhanced .nav-toggle { display:flex; }
 .site-header .hero-nav { width:100%; display:grid; gap:4px; font-size:18px; border-top:1px solid var(--line); padding-top:8px; }
 .site-header.nav-enhanced:not(.nav-open) .hero-nav { display:none; }
 .site-header .hero-nav a { padding:8px 12px; }
 .site-header .hero-nav a::after { display:none; }
 .site-header.nav-enhanced .nav-toggle { width:44px; padding:0; justify-content:center; flex:none; }
 .site-header.nav-enhanced .nav-toggle svg { width:24px; height:24px; }
 .hero h1 { top:88px; }
 .hero-person { top:158px; }.hero-blob { top:148px; }.hero-socials { top:166px; }
 .hero-stage { height:calc(158px + min(72vw,360px)); }
}
@media(prefers-reduced-motion:reduce){.site-header.nav-enhanced{transition:opacity 120ms linear}.site-header.nav-enhanced.nav-hidden:not(.nav-open){transform:none}}
.process-section>.wrap { position:relative; }
.process-section #process-h { max-width:18ch; font-size:clamp(36px,4.1vw,64px); line-height:1.12; margin-bottom:24px; }
.process-section #process-h span { color:var(--ink); -webkit-text-stroke:1px var(--gold); paint-order:stroke fill; }
.process-section>.wrap>div:first-child { max-width:72%; }
.process-section .process-sign { position:absolute; top:0; left:0; width:220px; aspect-ratio:1; display:grid; place-items:center; background:url('/img/figma-hero/blob.svg') center/contain no-repeat; transform:rotate(-8deg); }
.process-sign span { font-size:26px; font-weight:700; line-height:1.2; text-align:center; transform:rotate(8deg); }
.process-section .steps { list-style:none; padding:0; margin:64px 0 0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:32px; counter-reset:process; }
.process-section .step { position:relative; counter-increment:process; padding:80px 0 0; border:0; }
.process-section .step::before { content:counter(process,decimal-leading-zero); position:absolute; top:0; right:0; font-size:48px; font-weight:700; line-height:1; color:var(--ink); -webkit-text-stroke:1px var(--gold); paint-order:stroke fill; }
.process-section .step::after { content:""; position:absolute; top:56px; right:0; left:0; height:2px; background:var(--gold); }
.process-section .step h3 { font-size:24px; margin-bottom:16px; }
.process-section .step p { font-size:17px; line-height:1.65; }
.process-section .process-fig { margin-top:48px; padding:32px 80px 0 0; position:relative; }
.process-section .process-fig::before { content:""; position:absolute; top:32px; right:0; width:56px; height:40px; background:url('/img/figma-page/brand-quote.svg') center/contain no-repeat; }
.process-section .process-fig .story { max-width:70ch; }
.process-section .section-cta { margin-top:32px; }
@media(max-width:999px) {
 .process-section .process-sign { width:160px; }.process-sign span { font-size:21px; }
 .process-section .steps { grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; }
}
@media(max-width:699px) {
 .process-section>.wrap>div:first-child { max-width:none; }
 .process-section #process-h { font-size:36px; }
 .process-section .process-sign { position:relative; top:auto; left:auto; width:136px; margin:24px 0 0 auto; }
 .process-section .process-sign span { font-size:20px; }
 .process-section .steps { grid-template-columns:1fr; margin-top:32px; gap:32px; }
 .process-section .step { padding:0 64px 24px 0; border-bottom:1px solid var(--line); }
 .process-section .step::before { font-size:36px; top:0; }
 .process-section .step::after { display:none; }
 .process-section .step h3 { font-size:23px; margin-bottom:12px; }
 .process-section .process-fig { margin-top:32px; padding:64px 0 0; }
 .process-section .process-fig::before { top:16px; width:48px; height:34px; }
}
:root { --cream-2:#fff; --muted-dark:var(--muted); }
body,header,.hero,.hero-stage,main>section,main>section.dark,main>section.tint,.client-proof,footer { background:var(--paper); color:var(--ink); }
main>section:not(.hero) { border-bottom:1px solid var(--line); }
.dark h2,.dark h3,.dark .text-link,.dark .brand-outline,.dark .hand,footer a,.ui h2 { color:var(--ink); }
.dark .hl,.dark .kicker { color:var(--gold-deep); }
.dark .note,.dark .muted,.dark p.lede { color:var(--muted); }
.dark :focus-visible { outline-color:var(--gold-deep); }
.case,footer { border-color:var(--line); }
.case-editorial{display:grid;grid-template-columns:minmax(260px,.7fr) minmax(0,2fr);gap:clamp(32px,4vw,72px);align-items:center;margin-top:32px!important;padding-top:30px;border-top:1px solid rgba(255,255,255,.18)}
.case-editorial-heading h3{max-width:10ch;margin:10px 0 18px;font-size:clamp(34px,3vw,58px);line-height:.98}.case-editorial-heading h3 em{color:var(--gold);font-style:normal}.case-editorial-heading>p{max-width:34ch;color:#c8cad8;font-size:16px;line-height:1.55}
.case-wall{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:112px 148px;grid-auto-flow:dense;gap:14px;direction:ltr}.case-tile{position:relative;min-width:0;margin:0;overflow:hidden;border-radius:18px;background:#f3eedf;color:#111223}.case-photo{grid-row:span 2}.case-photo img{width:100%;height:100%;object-fit:cover}.case-photo::after{content:"";position:absolute;inset:30% 0 0;background:linear-gradient(transparent,rgba(17,18,35,.9))}.case-photo figcaption{position:absolute;z-index:1;right:16px;bottom:15px;left:16px;direction:rtl;color:#fff}.case-photo figcaption span,.case-note span{display:block;margin-bottom:5px;color:var(--gold);font-size:12px;font-weight:700}.case-photo figcaption strong{font-size:16px;line-height:1.25}.case-note{display:flex;padding:16px;flex-direction:column;align-items:center;justify-content:center;direction:rtl;text-align:center}.case-note img{width:96px;height:auto;filter:brightness(0) saturate(100%) invert(8%) sepia(22%) saturate(991%) hue-rotate(198deg) brightness(88%)}.case-note p{margin:8px 0 0;font-size:13px;line-height:1.35}.case-note-result{background:var(--gold);align-items:flex-start;text-align:right}.case-note-result span{color:#111223}.case-note-result strong{font-size:16px;line-height:1.25}.case-quote{display:flex;padding:16px;flex-direction:column;justify-content:center;direction:rtl;background:#fff;color:#111223;font:700 16px/1.3 var(--fd)}.case-quote cite{margin-top:8px;color:#656575;font:400 12px/1.3 var(--fb)}
.case-editorial .case-wall{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:859px){.case-editorial{grid-template-columns:1fr;margin-top:32px!important;padding-top:28px}.case-editorial-heading h3{font-size:38px}.case-editorial .case-wall{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:150px 210px 150px}.case-photo{grid-row:span 2}.case-photo-detail{display:none}}
.mcard-b { background:var(--paper); color:var(--ink); border:1px solid var(--line); }
.mcard-b span,.mcard-b i { color:var(--muted); }
.mcard-b b,.offer li { color:var(--ink); }
.offer .big,.offer li::before { color:var(--gold-deep); }
form { border:1px solid var(--line); }
.sticky { background:var(--paper); border-top:1px solid var(--line); }
.dream-section::before,.ui::before { display:none; }
.hero p.lede { color:var(--ink); }
.client-proof .wrap { display:block; }
.client-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:20px; }
.client-heading p { margin:0; }
.logo-window { overflow:hidden; direction:ltr; }
.logo-track,.logo-group { display:flex; width:max-content; align-items:center; }
.logo-group { flex:none; }
.client-logo { display:flex; align-items:center; justify-content:center; width:200px; height:84px; padding:10px 20px; flex:none; font-size:21px; font-weight:700; color:var(--ink); }
.client-logo img { width:160px; height:64px; object-fit:contain; filter:brightness(0); }
.logos-ready .logo-track { animation:brand-loop 48s linear infinite; }
.client-proof:focus-within .logo-track { animation-play-state:paused; }
@keyframes brand-loop { to { transform:translateX(-50%); } }
.pain-scroll { position:relative; }
.deck-pinned.pain-stage { position:sticky; top:var(--pin-top,104px); overflow:visible; padding-bottom:12px; align-items:center; }
.deck-pinned .pain-narrative { position:relative; top:auto; }
.deck-pinned .pains { position:relative; padding:0; overflow:clip; border-radius:20px; }
.deck-pinned .pain,.deck-pinned .pain:nth-child(2),.deck-pinned .pain:nth-child(3) { position:absolute; inset:0 0 auto; margin:0; transform:translateY(var(--card-y,0px))!important; box-shadow:0 8px 24px rgba(17,18,35,.06); }
@media(max-width:999px) {
 .pain-mobile-intro:not(:empty) { padding-bottom:32px; max-width:620px; }
 .deck-pinned .pain-narrative { padding-bottom:16px; }
 .deck-pinned .pain-title { font-size:28px; margin-bottom:8px; }
}
@media(prefers-reduced-motion:reduce) {
 .logos-ready .logo-track { animation:none; width:100%; }
 .logo-group { width:100%; flex-wrap:wrap; justify-content:center; }
 .logo-group>[aria-hidden],.logo-group[aria-hidden] { display:none; }
 .client-logo { width:50%; }
}