
:root{
  --bone:#F3EFE5;
  --bone-2:#E9E2D5;
  --ocean:#173B46;
  --ocean-dark:#0F2B33;
  --eucalyptus:#667A68;
  --ochre:#D79A55;
  --clay:#B95F45;
  --charcoal:#252725;
  --line:rgba(23,59,70,.17);
  --max:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bone);color:var(--charcoal);font-family:"Plus Jakarta Sans",Arial,sans-serif;line-height:1.58}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit}
.wrap{width:min(calc(100% - 48px),var(--max));margin:auto}
.display{font-family:"Syne",Arial,sans-serif;letter-spacing:-.055em;line-height:.94;font-weight:600}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.68rem;font-weight:700;color:var(--eucalyptus);margin:0 0 16px}
.lede{font-size:1.12rem;max-width:680px;color:#4e5b5e}
.btn{display:inline-flex;align-items:center;gap:14px;background:var(--clay);color:#fff;padding:14px 21px;border-radius:999px;font-size:.78rem;font-weight:700;transition:.2s ease}
.btn:hover{background:var(--ochre);transform:translateY(-1px)}
.btn--outline{background:transparent;border:1px solid rgba(243,239,229,.5);color:var(--bone)}
.text-link{font-size:.77rem;font-weight:700;color:var(--ocean);text-decoration:underline;text-underline-offset:5px}
.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:15px;top:15px;background:#fff;padding:10px;z-index:100}

/* global header */
.header{position:sticky;top:0;z-index:40;background:rgba(243,239,229,.94);backdrop-filter:blur(13px);border-bottom:1px solid var(--line)}
.header__inner{height:82px;display:flex;align-items:center;justify-content:space-between}
.logo{height:60px;width:auto;display:flex;align-items:center}.logo img{display:block;height:100%;width:auto;max-width:100%}
.nav{display:flex;align-items:center;gap:28px;font-size:.74rem;font-weight:600}.nav a:not(.btn){position:relative}.nav a:not(.btn):after{content:"";position:absolute;left:0;right:100%;bottom:-6px;height:1px;background:var(--clay);transition:.2s}.nav a:not(.btn):hover:after,.nav a[aria-current="page"]:after{right:0}
.nav-toggle{display:none;border:0;background:transparent;color:var(--ocean);font-size:1.35rem}

/* shared page hero */
.page-hero{position:relative;min-height:560px;display:grid;align-items:end;overflow:hidden}
.page-hero__media{position:absolute;inset:0}.page-hero__media img{width:100%;height:100%;object-fit:cover}
.page-hero__media:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(243,239,229,.98) 0%,rgba(243,239,229,.9) 38%,rgba(243,239,229,.12) 70%,rgba(23,59,70,.14))}
.page-hero__inner{position:relative;z-index:2;padding:105px 0 80px}
.page-hero h1{font-size:clamp(3.8rem,7vw,6.7rem);margin:0 0 24px;color:var(--ocean);max-width:760px}
.page-hero p{max-width:630px;margin:0 0 28px}
.page-hero__note{position:absolute;right:5%;bottom:8%;color:#fff;font-family:"Caveat",cursive;font-size:2.25rem;line-height:1.02;transform:rotate(-4deg);text-shadow:0 2px 18px rgba(0,0,0,.25)}

/* proof bar */
.proofbar{background:var(--bone);border-bottom:1px solid var(--line)}
.proofbar__grid{display:grid;grid-template-columns:repeat(4,1fr)}
.proofbar__item{text-align:center;padding:27px 20px;border-right:1px solid var(--line)}
.proofbar__item:last-child{border-right:0}
.proofbar strong{font-family:"Syne",Arial,sans-serif;font-size:2.05rem;color:var(--ocean);font-weight:500}
.proofbar span{display:block;margin-top:5px;text-transform:uppercase;letter-spacing:.13em;font-size:.64rem;color:#697274}

/* section scaffolding */
.section{padding:94px 0}
.section--soft{background:var(--bone-2)}
.section--ocean{background:var(--ocean-dark);color:var(--bone)}
.section-head{display:flex;justify-content:space-between;gap:45px;align-items:end;margin-bottom:42px}
.section-head h2{font-size:clamp(3rem,5vw,4.6rem);color:var(--ocean);margin:0}
.section-head p{max-width:480px;margin:0;color:#5f696c}
.section--ocean .section-head h2{color:var(--bone)}
.section--ocean .section-head p{color:rgba(243,239,229,.7)}

/* services hub */
.service-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.service-card{background:#fff;border:1px solid var(--line);padding:42px;min-height:330px;display:flex;flex-direction:column;justify-content:space-between}
.service-card--wide{grid-column:1/-1;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;background:var(--ocean);color:var(--bone)}
.service-card__num{font-family:"Syne",Arial,sans-serif;font-size:2rem;color:var(--clay);margin-bottom:30px}
.service-card h3{font-family:"Syne",Arial,sans-serif;font-size:2rem;font-weight:500;color:var(--ocean);margin:0 0 14px}
.service-card--wide h3{color:var(--bone);font-size:2.8rem}
.service-card p{margin:0;color:#5f686b;max-width:620px}.service-card--wide p{color:rgba(243,239,229,.75)}
.service-card ul{padding:0;margin:28px 0 0;list-style:none;border-top:1px solid var(--line)}
.service-card li{padding:12px 0;border-bottom:1px solid var(--line);font-size:.79rem;color:#566164}
.service-card--wide ul{border-color:rgba(243,239,229,.2)}.service-card--wide li{border-color:rgba(243,239,229,.2);color:rgba(243,239,229,.82)}
.service-card__visual{min-height:320px;overflow:hidden}.service-card__visual img{width:100%;height:100%;object-fit:cover;filter:saturate(.78)}
.system-row{display:grid;grid-template-columns:1.2fr repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.system-row__intro,.system-row__step{padding:35px 28px}.system-row__step{border-left:1px solid var(--line)}
.system-row h3{font-family:"Syne",Arial,sans-serif;font-weight:500;color:var(--ocean);font-size:1.45rem;margin:0 0 8px}.system-row p{font-size:.8rem;color:#657074;margin:0}
.system-row__step span{display:block;color:var(--clay);font-family:"Syne",Arial,sans-serif;font-size:1.8rem;margin-bottom:28px}
.fit-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:18px}
.fit-card{padding:50px;background:#fff;border:1px solid var(--line)}
.fit-card h3{font-family:"Syne",Arial,sans-serif;color:var(--ocean);font-size:2.2rem;font-weight:500;margin:0 0 20px}
.fit-list{display:grid;gap:0}.fit-list div{padding:17px 0;border-top:1px solid var(--line)}.fit-list strong{display:block;color:var(--ocean);margin-bottom:5px}.fit-list span{font-size:.83rem;color:#606b6d}

/* image statement */
.statement{display:grid;grid-template-columns:.95fr 1.05fr;min-height:430px}
.statement__copy{padding:70px max(44px,calc((100vw - var(--max))/2));padding-right:60px;background:var(--ocean);color:var(--bone);display:flex;flex-direction:column;justify-content:center}
.statement__copy h2{font-size:3.9rem;margin:0 0 22px}.statement__copy p{color:rgba(243,239,229,.72);max-width:480px}
.statement__image{position:relative;overflow:hidden}.statement__image img{width:100%;height:100%;object-fit:cover;filter:saturate(.78)}
.statement__image .handnote{position:absolute;right:8%;bottom:10%;font-family:"Caveat",cursive;color:#fff;font-size:2.1rem;transform:rotate(-4deg);text-shadow:0 2px 12px rgba(0,0,0,.3)}

/* about */
.about-intro{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;align-items:start}
.about-intro h2{font-size:4.4rem;color:var(--ocean);margin:0}
.about-copy{font-size:1.04rem;color:#526064}.about-copy p:first-child{font-size:1.28rem;color:var(--ocean)}
.origin-grid{display:grid;grid-template-columns:1.05fr .95fr;min-height:520px}
.origin-photo{position:relative;overflow:hidden;background:#d7d0c4}.origin-photo img{width:100%;height:100%;object-fit:cover;filter:saturate(.75)}
.origin-photo__label{position:absolute;left:30px;bottom:26px;background:rgba(243,239,229,.92);padding:13px 16px;font-size:.65rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ocean)}
.origin-copy{background:var(--ocean-dark);color:var(--bone);padding:70px 8%;display:flex;flex-direction:column;justify-content:center}
.origin-copy h2{font-size:3.8rem;margin:0 0 24px}.origin-copy p{color:rgba(243,239,229,.74);max-width:580px}
.values{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.value{background:#fff;border:1px solid var(--line);padding:40px}.value span{font-family:"Syne",Arial,sans-serif;color:var(--clay);font-size:2rem}.value h3{font-family:"Syne",Arial,sans-serif;color:var(--ocean);font-size:1.7rem;font-weight:500;margin:30px 0 10px}.value p{font-size:.84rem;color:#647073;margin:0}
.working-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:65px}
.working-grid h2{font-size:3.8rem;color:var(--ocean);margin:0}
.working-list{border-top:1px solid var(--line)}
.working-item{display:grid;grid-template-columns:110px 1fr;gap:20px;padding:24px 0;border-bottom:1px solid var(--line)}
.working-item b{font-family:"Syne",Arial,sans-serif;color:var(--clay);font-size:1.75rem;font-weight:500}.working-item h3{margin:0 0 6px;color:var(--ocean);font-size:1rem}.working-item p{margin:0;color:#637073;font-size:.83rem}

/* final CTA */
.final-cta{position:relative;min-height:360px;display:grid;place-items:center;text-align:center;overflow:hidden;color:#fff}
.final-cta img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.7) brightness(.48)}
.final-cta:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,43,51,.6),rgba(15,43,51,.25))}
.final-cta__inner{position:relative;z-index:2;padding:70px 20px}.final-cta h2{font-size:4.2rem;margin:0 0 14px}.final-cta p{margin:0 0 24px;color:rgba(255,255,255,.8)}

/* footer */
.footer{background:var(--bone);padding:44px 0;border-top:1px solid var(--line)}
.footer__grid{display:grid;grid-template-columns:220px 1fr auto;gap:40px;align-items:center}
.footer__logo{width:190px}.footer__nav{display:flex;justify-content:center;gap:26px;font-size:.72rem}.footer__meta{text-align:right;font-size:.6rem;text-transform:uppercase;letter-spacing:.14em;color:#6e7678}

@media(max-width:900px){
  .service-grid{grid-template-columns:1fr}.service-card--wide{grid-column:auto;grid-template-columns:1fr}.service-card__visual{min-height:260px}
  .system-row{grid-template-columns:1fr 1fr}.system-row__intro{grid-column:1/-1}.system-row__step:nth-child(even){border-left:0}
  .fit-grid,.about-intro,.origin-grid,.working-grid{grid-template-columns:1fr}
  .origin-photo{min-height:420px}.values{grid-template-columns:1fr}
  .statement{grid-template-columns:1fr}.statement__image{min-height:300px}
}
@media(max-width:760px){
  .wrap{width:min(calc(100% - 34px),var(--max))}
  .header__inner{height:72px}.logo{height:50px;width:auto}.nav-toggle{display:block}.nav{position:absolute;top:72px;left:0;right:0;background:var(--bone);padding:20px;display:none;flex-direction:column;align-items:stretch;border-bottom:1px solid var(--line)}.nav.is-open{display:flex}
  .page-hero{min-height:620px}.page-hero__inner{padding:260px 0 48px}.page-hero h1{font-size:3.65rem}.page-hero__media:after{background:linear-gradient(0deg,rgba(243,239,229,.98),rgba(243,239,229,.88) 44%,rgba(243,239,229,.08) 78%)}.page-hero__note{display:none}
  .proofbar__grid{grid-template-columns:1fr 1fr}.proofbar__item:nth-child(2){border-right:0}.proofbar__item:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .section{padding:70px 0}.section-head{display:block}.section-head p{margin-top:15px}
  .system-row{grid-template-columns:1fr}.system-row__intro{grid-column:auto}.system-row__step{border-left:0;border-top:1px solid var(--line)}
  .statement__copy{padding:55px 24px}.statement__copy h2,.origin-copy h2,.working-grid h2{font-size:3rem}
  .about-intro h2{font-size:3.4rem}.origin-copy{padding:55px 24px}
  .working-item{grid-template-columns:70px 1fr}.final-cta h2{font-size:3rem}
  .footer__grid{grid-template-columns:1fr;text-align:center}.footer__logo{margin:auto}.footer__nav{flex-wrap:wrap}.footer__meta{text-align:center}
}

/* Block two: Work + Who We Work With */
.work-hero{padding:110px 0 72px;background:var(--bone)}
.work-hero__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:end}
.work-hero h1{font-size:clamp(4.1rem,7vw,7rem);margin:0;color:var(--ocean)}
.work-hero .lede{margin:22px 0 0}
.work-hero__aside{border-left:1px solid var(--line);padding-left:34px;color:#5e686b;font-size:.9rem}
.work-hero__aside strong{display:block;color:var(--ocean);font-size:.76rem;text-transform:uppercase;letter-spacing:.14em;margin-bottom:12px}

.case-feature{display:grid;grid-template-columns:1.05fr .95fr;min-height:540px;border-top:1px solid var(--line)}
.case-feature__media{position:relative;overflow:hidden;background:#d9d1c4}
.case-feature__media img,.case-feature__media video{width:100%;height:100%;object-fit:cover}
.case-feature__media:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(15,43,51,.45))}
.case-feature__tag{position:absolute;z-index:2;left:28px;top:28px;background:rgba(243,239,229,.94);color:var(--ocean);padding:9px 12px;font-size:.62rem;text-transform:uppercase;letter-spacing:.14em;font-weight:700}
.case-feature__copy{padding:64px 6%;display:flex;flex-direction:column;justify-content:center;background:#fff}
.case-feature--reverse .case-feature__media{order:2}.case-feature--reverse .case-feature__copy{order:1;background:var(--ocean-dark);color:var(--bone)}
.case-feature__copy h2{font-family:"Syne",Arial,sans-serif;font-size:clamp(2.8rem,4.3vw,4.4rem);line-height:.96;letter-spacing:-.05em;color:var(--ocean);font-weight:600;margin:0 0 20px}
.case-feature--reverse .case-feature__copy h2{color:var(--bone)}
.case-feature__copy p{max-width:610px;color:#5d696b}.case-feature--reverse .case-feature__copy p{color:rgba(243,239,229,.74)}
.case-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:28px 0 30px}
.case-metric{border-top:1px solid var(--line);padding-top:14px}.case-feature--reverse .case-metric{border-color:rgba(243,239,229,.2)}
.case-metric strong{font-family:"Syne",Arial,sans-serif;font-size:1.7rem;color:var(--clay);font-weight:500}.case-metric span{display:block;font-size:.64rem;line-height:1.35;text-transform:uppercase;letter-spacing:.09em;color:#6d7678;margin-top:4px}.case-feature--reverse .case-metric span{color:rgba(243,239,229,.58)}
.case-feature__links{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.case-feature--reverse .text-link{color:var(--bone)}

.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.project-card{background:#fff;border:1px solid var(--line);min-height:390px;display:flex;flex-direction:column}
.project-card__visual{height:170px;background:var(--ocean);position:relative;overflow:hidden;display:grid;place-items:center}
.project-card__visual img{width:100%;height:100%;object-fit:cover;opacity:.86}
.project-card__monogram{font-family:"Syne",Arial,sans-serif;font-size:3.5rem;color:var(--bone);letter-spacing:-.05em}
.project-card__body{padding:30px;display:flex;flex-direction:column;flex:1}
.project-card__body h3{font-family:"Syne",Arial,sans-serif;font-size:1.75rem;font-weight:500;color:var(--ocean);margin:0 0 12px}
.project-card__body p{font-size:.82rem;color:#647073;margin:0 0 24px}
.project-card__body .text-link{margin-top:auto}
.project-card__meta{font-size:.61rem;text-transform:uppercase;letter-spacing:.13em;color:var(--eucalyptus);margin-bottom:12px;font-weight:700}
.project-card__visual--keil{background:#151311}
.project-card__visual--keil img{opacity:.48;filter:saturate(.72) contrast(1.04)}
.project-card__brandmark{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:28px;background:linear-gradient(180deg,rgba(10,10,10,.12),rgba(10,10,10,.38))}
.project-card__brandmark img{width:min(82%,320px);height:auto;object-fit:contain;opacity:1;filter:none}


.work-strip{background:var(--ocean);color:var(--bone);padding:38px 0}
.work-strip__inner{display:grid;grid-template-columns:1fr auto;align-items:center;gap:30px}
.work-strip h3{font-family:"Syne",Arial,sans-serif;font-size:2rem;font-weight:500;margin:0}.work-strip p{margin:5px 0 0;color:rgba(243,239,229,.66);font-size:.82rem}

.audience-hero{padding:110px 0 90px;background:linear-gradient(120deg,var(--bone) 0 64%,var(--bone-2) 64%)}
.audience-hero__grid{display:grid;grid-template-columns:1fr .7fr;gap:80px;align-items:center}
.audience-hero h1{font-size:clamp(4.2rem,7vw,7rem);margin:0 0 24px;color:var(--ocean)}
.audience-hero__card{background:var(--ocean);color:var(--bone);padding:44px}
.audience-hero__card h2{font-family:"Syne",Arial,sans-serif;font-weight:500;font-size:2rem;margin:0 0 18px}.audience-hero__card p{color:rgba(243,239,229,.72);font-size:.86rem}
.audience-hero__card ul{list-style:none;padding:0;margin:28px 0 0;border-top:1px solid rgba(243,239,229,.2)}
.audience-hero__card li{padding:13px 0;border-bottom:1px solid rgba(243,239,229,.2);font-size:.77rem}

.audience-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.audience-card{background:#fff;border:1px solid var(--line);padding:42px;min-height:350px}
.audience-card__label{font-size:.63rem;text-transform:uppercase;letter-spacing:.14em;color:var(--clay);font-weight:700}
.audience-card h3{font-family:"Syne",Arial,sans-serif;font-size:2.2rem;color:var(--ocean);font-weight:500;margin:22px 0 14px}
.audience-card p{color:#626d70;font-size:.87rem}.audience-card ul{list-style:none;padding:0;margin:24px 0 0;border-top:1px solid var(--line)}.audience-card li{padding:10px 0;border-bottom:1px solid var(--line);font-size:.75rem;color:#5e696c}

.signal-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:start}
.signal-grid h2{font-size:4rem;color:var(--ocean);margin:0}
.signal-list{border-top:1px solid var(--line)}
.signal{display:grid;grid-template-columns:50px 1fr;gap:18px;padding:20px 0;border-bottom:1px solid var(--line)}
.signal b{font-family:"Syne",Arial,sans-serif;color:var(--clay);font-size:1.45rem;font-weight:500}.signal h3{margin:0 0 5px;color:var(--ocean);font-size:.98rem}.signal p{margin:0;color:#687275;font-size:.8rem}

.logo-cloud{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.logo-cloud__item{min-height:160px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:center;padding:26px;background:#fff;text-align:center}
.logo-cloud__item img{max-width:150px;max-height:76px;filter:saturate(0) contrast(.9);opacity:.82}.logo-cloud__item span{font-family:"Syne",Arial,sans-serif;color:var(--ocean);font-size:1.25rem}

@media(max-width:900px){
.work-hero__grid,.case-feature,.audience-hero__grid,.signal-grid{grid-template-columns:1fr}
.case-feature--reverse .case-feature__media,.case-feature--reverse .case-feature__copy{order:initial}
.case-feature__media{min-height:360px}.project-grid{grid-template-columns:1fr 1fr}.logo-cloud{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
.work-hero,.audience-hero{padding:80px 0 60px}.work-hero h1,.audience-hero h1{font-size:3.7rem}.work-hero__aside{border-left:0;border-top:1px solid var(--line);padding:22px 0 0}
.case-feature__copy{padding:48px 24px}.case-metrics{grid-template-columns:1fr}.project-grid,.audience-grid{grid-template-columns:1fr}.work-strip__inner{grid-template-columns:1fr}.signal-grid h2{font-size:3rem}.logo-cloud{grid-template-columns:1fr 1fr}
}


/* Block three: Creative Portfolio + How We Work */
.portfolio-hero{
  padding:110px 0 82px;background:var(--ocean-dark);color:var(--bone);overflow:hidden
}
.portfolio-hero__grid{display:grid;grid-template-columns:1.02fr .98fr;gap:70px;align-items:center}
.portfolio-hero h1{font-size:clamp(4rem,7vw,7.1rem);margin:0;color:var(--bone)}
.portfolio-hero .lede{color:rgba(243,239,229,.72);margin:24px 0 0}
.portfolio-hero__collage{display:grid;grid-template-columns:1fr 1fr;gap:12px;transform:rotate(1.5deg)}
.portfolio-hero__tile{position:relative;overflow:hidden;background:#12333c;min-height:190px}
.portfolio-hero__tile:first-child{grid-row:span 2;min-height:392px}
.portfolio-hero__tile img,.portfolio-hero__tile video{width:100%;height:100%;object-fit:cover}
.portfolio-hero__tile:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.portfolio-hero__scribble{font-family:"Caveat",cursive;color:var(--ochre);font-size:2rem;margin-top:22px;transform:rotate(-2deg)}

.portfolio-filter{display:flex;gap:10px;flex-wrap:wrap;margin-top:30px}
.portfolio-filter a{border:1px solid var(--line);border-radius:999px;padding:8px 13px;font-size:.68rem;font-weight:700;color:var(--ocean);background:#fff}

.reel-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.reel-card{position:relative;aspect-ratio:9/16;background:#d8d0c3;overflow:hidden}
.reel-card video,.reel-card img{width:100%;height:100%;object-fit:cover}
.reel-card__meta{position:absolute;inset:auto 0 0;background:linear-gradient(transparent,rgba(15,43,51,.82));padding:52px 18px 18px;color:#fff;z-index:2}
.reel-card__meta strong{display:block;font-size:.8rem}.reel-card__meta span{display:block;font-size:.62rem;text-transform:uppercase;letter-spacing:.11em;opacity:.75;margin-top:3px}
.play-badge{position:absolute;top:14px;right:14px;z-index:2;background:rgba(243,239,229,.9);color:var(--ocean);height:34px;width:34px;border-radius:50%;display:grid;place-items:center;font-size:.72rem}

.film-feature{display:grid;grid-template-columns:1.1fr .9fr;gap:0;background:#fff;border:1px solid var(--line);margin-bottom:18px}
.film-feature--reverse{grid-template-columns:.9fr 1.1fr}
.film-feature--reverse .film-feature__media{order:2}
.film-feature__media{position:relative;min-height:390px;background:#d4cabd;overflow:hidden}
.film-feature__media img,.film-feature__media video{width:100%;height:100%;object-fit:cover}
.film-feature__copy{padding:50px;display:flex;flex-direction:column;justify-content:center}
.film-feature__copy h3{font-family:"Syne",Arial,sans-serif;color:var(--ocean);font-size:2.4rem;font-weight:500;margin:0 0 14px}
.film-feature__copy p{color:#637073;margin:0 0 18px}
.film-feature__kicker{font-size:.62rem;text-transform:uppercase;letter-spacing:.14em;color:var(--clay);font-weight:700;margin-bottom:14px}

.creative-types{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.creative-type{padding:36px;background:#fff;border:1px solid var(--line)}
.creative-type b{font-family:"Syne",Arial,sans-serif;color:var(--clay);font-size:1.75rem;font-weight:500}
.creative-type h3{font-family:"Syne",Arial,sans-serif;color:var(--ocean);font-weight:500;font-size:1.7rem;margin:28px 0 10px}
.creative-type p{font-size:.82rem;color:#647073;margin:0}

.youtube-note{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.embed-placeholder{background:var(--ocean);color:var(--bone);aspect-ratio:16/9;display:grid;place-items:center;text-align:center;padding:30px;position:relative;overflow:hidden}
.embed-placeholder:before{content:"▶";width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--clay);font-size:1.1rem;margin:auto auto 14px}
.embed-placeholder strong{font-family:"Syne",Arial,sans-serif;font-size:1.45rem;font-weight:500}.embed-placeholder span{display:block;font-size:.7rem;opacity:.68;margin-top:6px}

.process-hero{padding:115px 0 85px;background:linear-gradient(120deg,var(--bone) 0 64%,var(--bone-2) 64%)}
.process-hero__grid{display:grid;grid-template-columns:1fr .75fr;gap:80px;align-items:center}
.process-hero h1{font-size:clamp(4rem,7vw,7rem);color:var(--ocean);margin:0}
.process-hero__aside{background:var(--ocean);padding:42px;color:var(--bone)}
.process-hero__aside h2{font-family:"Syne",Arial,sans-serif;font-size:2rem;font-weight:500;margin:0 0 15px}
.process-hero__aside p{font-size:.84rem;color:rgba(243,239,229,.73)}
.process-hero__aside .handnote{font-family:"Caveat",cursive;color:var(--ochre);font-size:1.8rem;margin-top:22px}

.process-list{border-top:1px solid var(--line)}
.process-step{display:grid;grid-template-columns:120px .8fr 1.2fr;gap:30px;padding:34px 0;border-bottom:1px solid var(--line);align-items:start}
.process-step__num{font-family:"Syne",Arial,sans-serif;font-size:2.5rem;color:var(--clay)}
.process-step h3{font-family:"Syne",Arial,sans-serif;color:var(--ocean);font-size:2rem;font-weight:500;margin:0}
.process-step p{margin:0;color:#647073;font-size:.9rem;max-width:620px}

.engagement-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.engagement{background:#fff;border:1px solid var(--line);padding:38px}
.engagement h3{font-family:"Syne",Arial,sans-serif;color:var(--ocean);font-weight:500;font-size:1.8rem;margin:0 0 12px}
.engagement p{color:#657174;font-size:.82rem}
.engagement ul{list-style:none;padding:0;margin:24px 0 0;border-top:1px solid var(--line)}
.engagement li{padding:10px 0;border-bottom:1px solid var(--line);font-size:.73rem;color:#596568}

.two-col-check{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.check-card{padding:44px;background:#fff;border:1px solid var(--line)}
.check-card--dark{background:var(--ocean-dark);color:var(--bone)}
.check-card h3{font-family:"Syne",Arial,sans-serif;color:var(--ocean);font-size:2rem;font-weight:500;margin:0 0 20px}
.check-card--dark h3{color:var(--bone)}
.check-card ul{list-style:none;padding:0;margin:0}
.check-card li{padding:13px 0;border-top:1px solid var(--line);font-size:.82rem;color:#606d70}
.check-card--dark li{border-color:rgba(243,239,229,.17);color:rgba(243,239,229,.72)}
.check-card li:before{content:"✓";color:var(--clay);margin-right:10px;font-weight:700}
.check-card--dark li:before{content:"→";color:var(--ochre)}

.communication{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:start}
.communication h2{font-size:3.8rem;color:var(--ocean);margin:0}
.communication__items{border-top:1px solid var(--line)}
.communication__item{padding:21px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:150px 1fr;gap:22px}
.communication__item strong{color:var(--ocean);font-size:.82rem}.communication__item p{margin:0;font-size:.81rem;color:#667174}

@media(max-width:900px){
  .portfolio-hero__grid,.film-feature,.film-feature--reverse,.process-hero__grid,.communication{grid-template-columns:1fr}
  .film-feature--reverse .film-feature__media{order:initial}
  .reel-grid{grid-template-columns:repeat(2,1fr)}
  .creative-types,.engagement-grid{grid-template-columns:1fr 1fr}
  .process-step{grid-template-columns:80px 1fr}.process-step p{grid-column:2}
}
@media(max-width:760px){
  .portfolio-hero,.process-hero{padding:80px 0 60px}
  .portfolio-hero h1,.process-hero h1{font-size:3.6rem}
  .portfolio-hero__collage{margin-top:20px}
  .reel-grid{grid-template-columns:1fr 1fr}
  .film-feature__media{min-height:270px}.film-feature__copy{padding:34px 24px}
  .creative-types,.youtube-note,.engagement-grid,.two-col-check{grid-template-columns:1fr}
  .process-step{grid-template-columns:55px 1fr;gap:14px}.process-step__num{font-size:1.8rem}.process-step h3{font-size:1.65rem}
  .communication h2{font-size:3rem}.communication__item{grid-template-columns:1fr;gap:6px}
}


/* Block four: standalone case studies */
.case-hero{
  padding:104px 0 76px;background:var(--bone);overflow:hidden
}
.case-hero__grid{display:grid;grid-template-columns:1.08fr .92fr;gap:70px;align-items:center}
.case-hero h1{font-size:clamp(4rem,7vw,7.2rem);color:var(--ocean);margin:0}
.case-hero .lede{margin:24px 0 0}
.case-hero__brandbox{
  min-height:430px;background:var(--ocean);color:var(--bone);display:grid;place-items:center;
  padding:48px;position:relative;overflow:hidden
}
.case-hero__brandbox:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 20%,rgba(215,154,85,.18),transparent 36%)}
.case-hero__brandbox img{max-width:78%;max-height:180px;position:relative;z-index:2}
.case-hero__brandbox--type{font-family:"Syne",Arial,sans-serif;font-size:3.2rem;line-height:1;color:var(--bone);text-align:center;position:relative;z-index:2}
.case-hero__brandbox--type small{display:block;font-family:"Plus Jakarta Sans",sans-serif;text-transform:uppercase;letter-spacing:.16em;font-size:.62rem;margin-top:16px;color:rgba(243,239,229,.62)}
.case-hero__note{font-family:"Caveat",cursive;color:var(--clay);font-size:1.8rem;transform:rotate(-2deg);margin-top:24px}

.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.metric{padding:35px 28px;text-align:center;border-right:1px solid var(--line)}
.metric:last-child{border-right:0}
.metric strong{display:block;font-family:"Syne",Arial,sans-serif;font-size:2.6rem;color:var(--ocean);font-weight:500}
.metric span{display:block;font-size:.65rem;text-transform:uppercase;letter-spacing:.12em;color:#6c7678;margin-top:6px}

.case-intro{display:grid;grid-template-columns:.85fr 1.15fr;gap:80px}
.case-intro h2{font-size:4rem;color:var(--ocean);margin:0}
.case-copy{font-size:1rem;color:#586568}.case-copy p:first-child{font-size:1.22rem;color:var(--ocean)}

.case-flow{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.case-flow__item{padding:38px;background:#fff;border:1px solid var(--line)}
.case-flow__item b{font-family:"Syne",Arial,sans-serif;color:var(--clay);font-size:1.85rem;font-weight:500}
.case-flow__item h3{font-family:"Syne",Arial,sans-serif;color:var(--ocean);font-size:1.65rem;font-weight:500;margin:27px 0 10px}
.case-flow__item p{font-size:.83rem;color:#647073;margin:0}

.result-panel{background:var(--ocean-dark);color:var(--bone);padding:70px}
.result-panel__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:start}
.result-panel h2{font-size:4rem;margin:0}
.result-panel p{color:rgba(243,239,229,.72)}
.result-list{border-top:1px solid rgba(243,239,229,.18)}
.result-list div{padding:18px 0;border-bottom:1px solid rgba(243,239,229,.18);display:grid;grid-template-columns:160px 1fr;gap:20px}
.result-list strong{color:var(--ochre);font-family:"Syne",Arial,sans-serif;font-size:1.35rem;font-weight:500}
.result-list span{font-size:.81rem;color:rgba(243,239,229,.76)}

.case-quote{padding:76px 0;text-align:center}
.case-quote blockquote{font-family:"Syne",Arial,sans-serif;font-size:clamp(2.5rem,5vw,4.4rem);line-height:1.05;color:var(--ocean);max-width:950px;margin:0 auto}
.case-quote p{font-size:.7rem;text-transform:uppercase;letter-spacing:.14em;color:#70797b;margin-top:22px}

.system-screenshot{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}
.system-screenshot__visual{min-height:420px;background:linear-gradient(135deg,#173B46,#254f5b);position:relative;overflow:hidden;padding:36px}
.mock-browser{background:#f9f7f1;border-radius:14px;box-shadow:0 28px 70px rgba(0,0,0,.25);overflow:hidden;height:100%}
.mock-browser__bar{height:38px;background:#e8e2d7;border-bottom:1px solid #d3cbc0;display:flex;align-items:center;gap:7px;padding:0 13px}
.mock-browser__bar i{width:8px;height:8px;background:#b8afa4;border-radius:50%;display:block}
.mock-browser__content{padding:28px}
.mock-browser__content .fake-h{height:18px;width:54%;background:#173B46;border-radius:999px;margin-bottom:18px}
.mock-browser__content .fake-p{height:8px;width:82%;background:#d6d0c5;border-radius:999px;margin-bottom:8px}
.mock-browser__content .fake-card{height:170px;background:#eae5dc;margin-top:28px;border:1px solid #d9d1c6}
.system-screenshot__copy{background:#fff;border:1px solid var(--line);padding:48px;display:flex;flex-direction:column;justify-content:center}
.system-screenshot__copy h3{font-family:"Syne",Arial,sans-serif;color:var(--ocean);font-size:2.35rem;font-weight:500;margin:0 0 14px}
.system-screenshot__copy p{color:#626f72}

.case-next{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.case-next__card{padding:42px;border:1px solid var(--line);background:#fff}
.case-next__card h3{font-family:"Syne",Arial,sans-serif;color:var(--ocean);font-size:1.9rem;font-weight:500;margin:0 0 12px}
.case-next__card p{font-size:.83rem;color:#647073}

@media(max-width:900px){
  .case-hero__grid,.case-intro,.result-panel__grid,.system-screenshot{grid-template-columns:1fr}
  .metric-grid{grid-template-columns:1fr 1fr}.metric:nth-child(2){border-right:0}.metric:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .case-flow{grid-template-columns:1fr 1fr}.case-next{grid-template-columns:1fr}
}
@media(max-width:760px){
  .case-hero{padding:78px 0 58px}.case-hero h1{font-size:3.5rem}.case-hero__brandbox{min-height:300px}
  .metric-grid{grid-template-columns:1fr}.metric{border-right:0;border-bottom:1px solid var(--line)}.metric:last-child{border-bottom:0}
  .case-intro h2,.result-panel h2{font-size:3rem}.case-flow{grid-template-columns:1fr}
  .result-panel{padding:52px 24px}.result-list div{grid-template-columns:1fr;gap:4px}
}

/* Feedback pass — Sep 23 2026 */
.page-hero h1 span,.audience-hero h1 span,.process-hero h1 span,.section-head h2 span,.division-title span{display:block}
.page-hero h1{font-size:clamp(3.6rem,5.6vw,5.55rem);max-width:880px;line-height:.94}.page-hero h1 span{white-space:nowrap}
.page-hero__media img{filter:none;object-position:center 52%}
.service-card--wide.service-card--light{background:#fff;color:var(--charcoal);border:1px solid var(--line)}
.service-card--wide.service-card--light h3{color:var(--ocean)}
.service-card--wide.service-card--light p{color:#5f686b}
.service-card--wide.service-card--light ul{border-color:var(--line)}
.service-card--wide.service-card--light li{border-color:var(--line);color:#5e696c}
.service-card--wide.service-card--light .service-card__num{color:var(--clay)}
.service-card__visual img{filter:none}
.audience-hero{padding:88px 0 72px}.audience-hero__grid{grid-template-columns:1.05fr .75fr;gap:64px}
.audience-hero h1{font-size:clamp(3.7rem,5.6vw,5.55rem);line-height:.94;max-width:850px}.audience-hero h1 span{white-space:nowrap}
.audience-hero__card--image{position:relative;overflow:hidden;min-height:430px;display:flex;align-items:flex-end;background:#173B46;padding:0}
.audience-hero__card-bg{position:absolute;inset:0}.audience-hero__card-bg img{width:100%;height:100%;object-fit:cover;filter:none}
.audience-hero__card-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,43,51,.12),rgba(15,43,51,.88) 75%)}
.audience-hero__card-content{position:relative;z-index:1;padding:34px;color:var(--bone)}
.logo-cloud__item img{max-width:72%;max-height:74px;object-fit:contain;filter:none}
.logo-cloud__item--text span{font-family:"Syne",sans-serif;font-weight:600;color:var(--ocean);font-size:.98rem;line-height:1.15;text-align:center}
.process-hero{padding:90px 0 72px}.process-hero__grid{grid-template-columns:1.05fr .75fr;gap:64px}
.process-hero h1{font-size:clamp(3.8rem,5.65vw,5.65rem);line-height:.94;max-width:840px}.process-hero h1 span{white-space:nowrap}
.process-hero__aside{padding:36px}
.section-head h2{line-height:.97}.section-head h2 span{white-space:nowrap}
.division-title{font-size:clamp(2.9rem,4.1vw,3.8rem)!important;max-width:760px}
.statement__image img{filter:none}
@media(max-width:980px){.page-hero h1 span,.audience-hero h1 span,.process-hero h1 span,.section-head h2 span,.division-title span{white-space:normal}.audience-hero__grid,.process-hero__grid{grid-template-columns:1fr}.audience-hero__card--image{min-height:360px}}
@media(max-width:760px){.page-hero h1,.audience-hero h1,.process-hero h1{font-size:3.25rem}.audience-hero,.process-hero{padding:68px 0 54px}.division-title{font-size:2.7rem!important}}

/* Refinement pass 02: audience/process hero media fixes. */
.audience-hero__grid{grid-template-columns:minmax(0,1.12fr) minmax(390px,.88fr);gap:52px}
.audience-hero__grid>div{min-width:0}
.audience-hero h1{font-size:clamp(3.4rem,4.75vw,5.1rem);max-width:780px}
.audience-hero h1 span{white-space:normal}
.audience-hero__card--image{min-height:500px;width:100%}
.audience-hero__card-bg img{object-position:center center}

.process-hero__aside--image{position:relative;overflow:hidden;min-height:500px;display:flex;align-items:flex-end;padding:0;background:var(--ocean)}
.process-hero__media{position:absolute;inset:0}
.process-hero__media img{width:100%;height:100%;object-fit:cover;object-position:center center;filter:none}
.process-hero__media:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,43,51,.12) 5%,rgba(15,43,51,.9) 82%)}
.process-hero__aside-content{position:relative;z-index:1;padding:36px;color:var(--bone)}
.process-hero__aside--image h2{color:var(--bone)}
.process-hero__aside--image p{color:rgba(243,239,229,.78)}
@media(max-width:980px){
  .audience-hero__grid{grid-template-columns:1fr}
  .audience-hero h1{font-size:clamp(3.25rem,8vw,4.7rem)}
  .audience-hero__card--image,.process-hero__aside--image{min-height:420px}
}

/* Refinement pass 04: browser treatment + audience logo grid */
.browser-frame{width:100%;max-width:760px;margin:auto;background:#fff;border:1px solid rgba(23,59,70,.14);border-radius:16px;overflow:hidden;box-shadow:0 24px 60px rgba(23,59,70,.12)}
.browser-frame__bar{height:42px;display:flex;align-items:center;gap:7px;padding:0 14px;background:#f1ede4;border-bottom:1px solid rgba(23,59,70,.1)}
.browser-frame__bar>span{width:8px;height:8px;border-radius:50%;background:rgba(23,59,70,.35);flex:0 0 auto}
.browser-frame__url{margin-left:8px;height:22px;min-width:0;flex:1;display:flex;align-items:center;padding:0 10px;border-radius:999px;background:#fff;color:rgba(23,59,70,.45);font-size:.62rem;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.browser-frame__screen{aspect-ratio:16/10;overflow:hidden;background:#eee}
.browser-frame__screen img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.service-card__visual--browser{padding:28px;background:linear-gradient(145deg,#efe9dd,#faf7f0);display:flex;align-items:center;justify-content:center}
.logo-cloud__item{transition:background .18s ease,transform .18s ease;text-decoration:none}
.logo-cloud__item[href]:hover{background:#f8f4ec}
.logo-cloud__item img{max-width:80%;max-height:88px}
.logo-cloud__item--bighorn img{max-width:96%;max-height:118px}
.logo-cloud__item--keil{background:#1e1c1a;padding:0;overflow:hidden}
.logo-cloud__item--keil img{width:100%;height:100%;max-width:none;max-height:none;object-fit:cover}
.logo-cloud__item--cta{background:var(--ocean);color:var(--bone);padding:28px;align-items:flex-start;justify-content:center;flex-direction:column;text-align:left}
.logo-cloud__item--cta:hover{background:#214956!important}
.logo-cloud__item--cta .logo-cloud__cta-eyebrow{font-family:"Plus Jakarta Sans",sans-serif;font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.16em;color:var(--ochre);margin-bottom:10px}
.logo-cloud__item--cta strong{font-family:"Syne",sans-serif;font-size:1.08rem;line-height:1.25;font-weight:500;color:var(--bone)}
.logo-cloud__item--cta .logo-cloud__cta-link{font-family:"Plus Jakarta Sans",sans-serif;font-size:.72rem;color:var(--bone);margin-top:16px}

/* Refinement pass 05: How We Work hero + Work card polish */
.process-hero--image{
  position:relative;
  background-image:linear-gradient(90deg,rgba(10,31,37,.72) 0%,rgba(10,31,37,.50) 48%,rgba(10,31,37,.30) 100%),url('/assets/img/user/how-we-work-hero.jpg');
  background-size:cover;
  background-position:center 56%;
  color:var(--bone);
  padding-top:145px;
}
.process-hero--image .process-hero__grid{position:relative;z-index:1}
.process-hero--image h1{color:var(--bone)}
.process-hero--image .lede{color:rgba(243,239,229,.88)}
.process-hero--image .eyebrow{color:var(--ochre)}
.process-hero__aside--plain{
  min-height:0;
  align-self:center;
  background:rgba(243,239,229,.94);
  color:var(--ocean);
  padding:0;
  box-shadow:0 18px 50px rgba(8,26,31,.16);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}
.process-hero__aside--plain .process-hero__aside-content{padding:38px;color:var(--ocean)}
.process-hero__aside--plain h2{color:var(--ocean)}
.process-hero__aside--plain p{color:#5e6869}
.process-hero__aside--plain .handnote{color:var(--clay)}
.project-grid--three{grid-template-columns:repeat(3,1fr)}
.project-card__visual--logo{background:#fff;padding:26px}
.project-card__visual--logo img{width:100%;height:100%;object-fit:contain;opacity:1;filter:none}
.project-card__visual--logo img[src*="bighorn"]{transform:scale(1.12)}
.project-card__visual--keil-logo{background:#1a1714;padding:0}
.project-card__visual--keil-logo img{width:100%;height:100%;object-fit:cover;opacity:1;filter:none}
@media(max-width:980px){.project-grid--three{grid-template-columns:1fr 1fr}.process-hero--image{padding-top:120px}}
@media(max-width:680px){.project-grid--three{grid-template-columns:1fr}.process-hero--image{padding-top:105px;background-position:center center}}


/* Pass 11: image-hero fold and vertical balance */
@media(min-width:981px){
  /* Services: hero + four-result strip occupy exactly one viewport. */
  .page-hero--with-proof{
    min-height:calc(100svh - 104px);
    align-items:center;
  }
  .page-hero--with-proof .page-hero__inner{
    padding:112px 0 58px;
    transform:translateY(-24px);
  }
  .page-hero--with-proof + .proofbar .proofbar__grid{min-height:104px}
  .page-hero--with-proof + .proofbar .proofbar__item{
    padding:20px 22px;
    display:flex;
    flex-direction:column;
    justify-content:center;
  }

  /* About has no result strip, so its image hero owns the full first viewport. */
  .page-hero--full{
    min-height:100svh;
    align-items:center;
  }
  .page-hero--full .page-hero__inner{
    padding:112px 0 64px;
    transform:translateY(-22px);
  }

  /* How We Work also uses an image-backed overlay hero. */
  .process-hero--image{
    min-height:100svh;
    display:flex;
    align-items:center;
    padding:108px 0 68px;
  }
  .process-hero--image .process-hero__grid{width:100%}
}

@media(min-width:981px) and (max-height:760px){
  .page-hero--with-proof .page-hero__inner{transform:translateY(-12px)}
  .page-hero--full .page-hero__inner{transform:translateY(-10px)}
  .process-hero--image{padding-top:92px;padding-bottom:50px}
}


/* Pass 12 hero consistency */
@media(min-width:981px){
  /* Services */
  .page-hero--with-proof .page-hero__inner{transform:translateY(-34px)}

  /* Who we work with: full image-backed hero */
  .audience-hero--image{
    position:relative;
    min-height:100svh;
    padding:0;
    display:flex;
    align-items:center;
    overflow:hidden;
    background:var(--ocean);
    color:var(--bone);
  }
  .audience-hero--image .audience-hero__media{position:absolute;inset:0}
  .audience-hero--image .audience-hero__media img{width:100%;height:100%;object-fit:cover;object-position:center 48%;filter:none}
  .audience-hero--image .audience-hero__media:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,43,51,.78) 0%,rgba(15,43,51,.58) 45%,rgba(15,43,51,.30) 72%,rgba(15,43,51,.16) 100%)}
  .audience-hero--image .audience-hero__grid{position:relative;z-index:1;width:min(calc(100% - 48px),1240px);margin:0 auto;grid-template-columns:minmax(0,1.05fr) minmax(350px,.72fr);gap:64px;align-items:center;transform:translateY(18px)}
  .audience-hero--image .audience-hero__copy{min-width:0}
  .audience-hero--image h1{color:var(--bone);max-width:800px}
  .audience-hero--image .lede{color:rgba(243,239,229,.88);max-width:650px}
  .audience-hero--image .eyebrow{color:var(--ochre)}
  .audience-hero__card--plain{background:rgba(243,239,229,.95);color:var(--ocean);padding:0;box-shadow:0 24px 70px rgba(8,26,31,.18)}
  .audience-hero__card--plain .audience-hero__card-content{padding:36px;color:var(--ocean)}
  .audience-hero__card--plain p{color:#566164}
  .audience-hero__card--plain ul{border-top:1px solid rgba(23,59,70,.14)}
  .audience-hero__card--plain li{border-bottom:1px solid rgba(23,59,70,.14);color:var(--ocean)}

  /* How We Work: restore centered composition and prevent left-edge clipping */
  .process-hero--image{min-height:100svh;padding:92px 0 56px;display:flex;align-items:center;background-position:center 52%}
  .process-hero--image .process-hero__grid{width:min(calc(100% - 48px),1240px);margin:0 auto;grid-template-columns:minmax(0,1.03fr) minmax(360px,.72fr);gap:56px;align-items:center}
  .process-hero--image .process-hero__copy{min-width:0;padding:0}
  .process-hero--image h1{font-size:clamp(3.55rem,5vw,5.15rem);max-width:720px;line-height:.95}
  .process-hero--image .lede{max-width:640px}
  .process-hero__aside--plain{width:100%;max-width:520px;justify-self:end}
}

@media(max-width:980px){
  .audience-hero--image{position:relative;min-height:auto;padding:110px 0 70px;background:var(--ocean);color:var(--bone);overflow:hidden}
  .audience-hero--image .audience-hero__media{position:absolute;inset:0}
  .audience-hero--image .audience-hero__media img{width:100%;height:100%;object-fit:cover}
  .audience-hero--image .audience-hero__media:after{content:"";position:absolute;inset:0;background:rgba(15,43,51,.65)}
  .audience-hero--image .audience-hero__grid{position:relative;z-index:1;grid-template-columns:1fr;gap:32px}
  .audience-hero--image h1{color:var(--bone)}
  .audience-hero--image .lede{color:rgba(243,239,229,.9)}
  .audience-hero__card--plain{background:rgba(243,239,229,.96);color:var(--ocean);padding:0}
  .audience-hero__card--plain .audience-hero__card-content{padding:30px;color:var(--ocean)}
  .audience-hero__card--plain p{color:#566164}
  .process-hero--image .process-hero__grid{width:min(calc(100% - 36px),1240px);margin:0 auto}
}

/* Pass 10: requested Work/Services refinements */
.audience-hero--image .audience-hero__media img{object-position:center 50%}
.logo-cloud__item--keil img{width:100%;height:100%;max-width:118px;max-height:118px;object-fit:contain}
.logo-cloud__item--cta{background:#fff!important;color:var(--ocean)!important;align-items:flex-start;justify-content:center}
.logo-cloud__item--cta:hover{background:#f8f5ee!important}
.logo-cloud__item--cta .logo-cloud__cta-eyebrow{color:var(--clay)!important}
.logo-cloud__item--cta strong,.logo-cloud__item--cta .logo-cloud__cta-link{color:var(--ocean)!important}
.process-hero--image{background-image:linear-gradient(90deg,rgba(10,31,37,.72) 0%,rgba(10,31,37,.5) 48%,rgba(10,31,37,.3) 100%),url('/assets/img/user/how-we-work-waikiki.jpg')!important;background-position:center 55%!important}
.project-card__visual--logo img[src*="bighorn"]{transform:none!important;max-width:72%;max-height:72%;margin:auto;object-fit:contain}
.mock-browser__content--screenshot{padding:0!important;overflow:hidden!important;height:calc(100% - 38px)}
.mock-browser__content--screenshot img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center}
.case-hero--bighorn h1{font-size:clamp(3.35rem,5vw,5.25rem);line-height:.96}
.case-hero__brandbox--bighorn-plain{background:transparent!important;min-height:360px;padding:20px;overflow:visible}
.case-hero__brandbox--bighorn-plain:after{display:none}
.case-hero__brandbox--bighorn-plain img{max-width:100%!important;max-height:320px!important;width:min(100%,560px)}
.brand-before-after{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.brand-before-after figure{margin:0;background:#fff;border:1px solid var(--line);padding:34px;min-height:320px;display:flex;flex-direction:column;justify-content:center}
.brand-before-after figure .eyebrow{margin-bottom:18px}
.brand-before-after img{display:block;width:100%;height:220px;object-fit:contain}
.case-hero--lantern h1{font-size:clamp(3.4rem,5.2vw,5.3rem);line-height:.96}
.statement__image--contain{background:#f4efe4;display:grid;place-items:center;padding:28px}
.statement__image--contain img{width:100%;height:100%;object-fit:contain!important;filter:none!important}
@media(max-width:900px){.brand-before-after{grid-template-columns:1fr}.case-hero__brandbox--bighorn-plain{min-height:250px}.case-hero__brandbox--bighorn-plain img{max-height:240px!important}}

/* Pass 11: layout cleanup and browser-frame refinements */
.service-card--wide.service-card--light{grid-template-columns:.86fr 1.14fr;gap:34px}
.service-card__visual--browser-wide{padding:14px 0 14px 14px;overflow:visible;background:linear-gradient(145deg,#efe9dd,#faf7f0)}
.service-card__visual--browser-wide .browser-frame{max-width:none;width:100%}
.service-card__visual--browser-wide .browser-frame__screen{aspect-ratio:2048/1134}

.logo-cloud__item--keil{background:#fff!important;padding:26px!important;overflow:hidden}
.logo-cloud__item--keil img{width:100%;height:100%;max-width:132px;max-height:132px;object-fit:contain!important}

.project-card__visual--logo img[src*="bighorn-logo-display"]{max-width:92%!important;max-height:92%!important;width:92%!important;height:92%!important;object-fit:contain!important;margin:auto}

.system-screenshot{grid-template-columns:1.2fr .8fr;gap:28px;align-items:stretch}
.system-screenshot__visual{min-height:0;background:transparent!important;padding:0!important;overflow:visible;display:flex;align-items:center;justify-content:center}
.system-screenshot__visual .mock-browser{width:100%;height:auto;box-shadow:0 22px 54px rgba(23,59,70,.15)}
.mock-browser__content--screenshot{padding:0!important;overflow:hidden!important;height:auto!important}
.mock-browser__content--screenshot img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center}
.mock-browser__content--pcg{aspect-ratio:2048/1134}
.mock-browser__content--robinson{aspect-ratio:2048/1133}
.mock-browser__content--bighorn{aspect-ratio:2048/1133}
.mock-browser__content--lantern{aspect-ratio:2048/933}

.section--bighorn-start{background:#FAF8F2;border-top:1px solid rgba(23,59,70,.08);border-bottom:1px solid rgba(23,59,70,.08)}
.case-hero__brandbox--bighorn-plain{min-height:330px;padding:10px 0 10px 12px;display:flex;align-items:center;justify-content:flex-start}
.case-hero__brandbox--bighorn-plain img{width:min(100%,620px)!important;max-width:620px!important;max-height:none!important;height:auto!important;object-fit:contain}
.brand-before-after figure:last-child img{height:265px;transform:scale(1.08)}

@media(max-width:900px){
  .service-card--wide.service-card--light{grid-template-columns:1fr}
  .service-card__visual--browser-wide{padding:12px}
  .system-screenshot{grid-template-columns:1fr}
  .case-hero__brandbox--bighorn-plain{justify-content:center;padding:12px;min-height:240px}
  .case-hero__brandbox--bighorn-plain img{width:min(100%,480px)!important}
}

/* Pass 12 About page image refinements */
@media (min-width:901px){
  .origin-grid{grid-template-columns:1.25fr .75fr;min-height:500px}
  .origin-photo img{object-position:center center;filter:none}
}


/* Pass 13: About refinements */
.about-hero .page-hero__media:after{background:linear-gradient(90deg,rgba(243,239,229,.88) 0%,rgba(243,239,229,.72) 36%,rgba(243,239,229,.16) 70%,rgba(23,59,70,.12) 100%)}
@media(min-width:901px){
  .origin-grid--about{grid-template-columns:.36fr .64fr;min-height:500px}
  .origin-grid--about .origin-photo img{width:100%;height:100%;object-fit:cover;object-position:center center}
  .statement--about-create .statement__copy h2{font-size:clamp(3.15rem,3.65vw,3.8rem)}
  .nowrap-desktop{white-space:nowrap}
}
@media(max-width:900px){.nowrap-desktop{white-space:normal}}

/* Pass 13: Creative page rebuild */
.portfolio-hero--single-video .portfolio-hero__grid{grid-template-columns:1.08fr .72fr;gap:84px}
.portfolio-hero--single-video h1{font-size:clamp(3.55rem,5.7vw,5.8rem);line-height:.94}
.portfolio-hero__single{width:min(100%,390px);aspect-ratio:9/16;justify-self:end;border-radius:24px;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.24);background:#0f2b33}
.portfolio-hero__single video{display:block;width:100%;height:100%;object-fit:cover}
.creative-reel-gallery{margin-top:38px}
.creative-reel-gallery__rail{overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;margin-inline:0}
.creative-reel-gallery__rail::-webkit-scrollbar{display:none}
.creative-reel-gallery__track{display:flex;gap:16px;list-style:none;margin:0;padding:0}
.creative-reel-gallery__track li{flex:0 0 clamp(205px,21vw,270px);scroll-snap-align:start}
.creative-reel{display:block;width:100%;border:0;padding:0;background:transparent;cursor:pointer}
.creative-reel__frame{display:block;position:relative;aspect-ratio:9/16;border-radius:18px;overflow:hidden;background:#173B46;box-shadow:0 14px 34px rgba(23,59,70,.12)}
.creative-reel__frame video{width:100%;height:100%;object-fit:cover;display:block}
.creative-reel__frame:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.22));pointer-events:none}
.creative-reel__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:rgba(243,239,229,.92);color:#173B46;font-size:16px;transition:.2s}
.creative-reel.is-playing .creative-reel__play{opacity:0}
.creative-reel-gallery__hint{font-size:.72rem;color:#6b7577;margin:14px 0 0}
.youtube-note--live{align-items:start}
.youtube-embed{background:#0f2b33;border:1px solid rgba(243,239,229,.12);overflow:hidden}
.youtube-embed iframe{display:block;width:100%;aspect-ratio:16/9;border:0}
.youtube-embed__label{padding:18px 20px;color:#F3EFE5;display:flex;align-items:baseline;justify-content:space-between;gap:14px}
.youtube-embed__label strong{font-family:"Syne",sans-serif;font-size:1.05rem;font-weight:600}.youtube-embed__label span{font-size:.68rem;opacity:.65;text-transform:uppercase;letter-spacing:.1em}
.creative-system-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(23,59,70,.14);border:1px solid rgba(23,59,70,.14)}
.creative-system-grid article{background:#fff;padding:34px}.creative-system-grid span{font-size:.68rem;letter-spacing:.12em;color:#B95F45;font-weight:700}.creative-system-grid h3{font-family:"Syne",sans-serif;color:#173B46;font-size:1.55rem;margin:18px 0 12px}.creative-system-grid p{margin:0;color:#657174;font-size:.9rem}
@media(max-width:900px){.portfolio-hero--single-video .portfolio-hero__grid{grid-template-columns:1fr;gap:42px}.portfolio-hero__single{justify-self:start;width:min(78vw,360px)}.creative-system-grid{grid-template-columns:1fr}.youtube-note--live{grid-template-columns:1fr}}

/* Momentum case study */
.momentum-hero{position:relative;min-height:760px;display:flex;align-items:flex-end;overflow:hidden;color:#fff}
.momentum-hero__bg,.momentum-hero__shade{position:absolute;inset:0;width:100%;height:100%}.momentum-hero__bg{object-fit:cover}.momentum-hero__shade{background:linear-gradient(90deg,rgba(10,31,37,.78) 0%,rgba(10,31,37,.42) 52%,rgba(10,31,37,.12) 100%)}
.momentum-hero__inner{position:relative;z-index:2;padding:130px 0 90px}.momentum-hero h1{font-size:clamp(3.6rem,6.3vw,6.2rem);max-width:920px;margin:0 0 22px}.momentum-hero .lede{max-width:760px;color:rgba(255,255,255,.86);margin:0 0 28px}
.momentum-film-block .system-screenshot__visual video{width:100%;height:100%;min-height:430px;object-fit:cover;display:block}
.momentum-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.momentum-gallery figure{margin:0;aspect-ratio:4/3;overflow:hidden;background:#ddd}.momentum-gallery img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:900px){.momentum-hero{min-height:640px}.momentum-gallery{grid-template-columns:repeat(2,1fr)}}

/* Pass 15: Momentum work-page feature */
.momentum-work-callout{padding-top:72px;padding-bottom:72px}
.system-screenshot--momentum-work{align-items:stretch}
.momentum-work-media{background:#173B46;overflow:hidden;min-height:440px}
.momentum-work-media video{display:block;width:100%;height:100%;min-height:440px;object-fit:cover}
@media(max-width:900px){.momentum-work-media,.momentum-work-media video{min-height:320px}}

/* Momentum case study — reusable brand-media section */
.momentum-usage-section{background:var(--bone)}
.momentum-usage-head{align-items:end}
.momentum-usage-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid rgba(23,59,70,.16);background:#fff}
.momentum-usage-grid article{padding:42px 38px 46px;min-height:280px}
.momentum-usage-grid article+article{border-left:1px solid rgba(23,59,70,.16)}
.momentum-usage-grid span{display:block;color:var(--ochre);font-size:.78rem;font-weight:700;letter-spacing:.14em;margin-bottom:34px}
.momentum-usage-grid h3{font-size:1.65rem;margin:0 0 14px;color:var(--ocean)}
.momentum-usage-grid p{margin:0;color:var(--text-soft);max-width:360px}
@media(max-width:800px){.momentum-usage-grid{grid-template-columns:1fr}.momentum-usage-grid article+article{border-left:0;border-top:1px solid rgba(23,59,70,.16)}}
