/* HERO — full-width image with a dark overlay and white copy. */
    .hero{
      min-height:760px;
      position:relative;
      display:flex;
      align-items:center;
      overflow:hidden;
      background:var(--dark);
      color:#fff;
      border-bottom:1px solid rgba(0,0,0,.08);
      isolation:isolate;
    }
    .hero-media{
      position:absolute;inset:0;z-index:-3;
      transform:scale(1.035);
      transition:transform 1.5s var(--ease),opacity .45s ease;
      background:var(--dark);
    }
    .hero.is-loaded .hero-media{transform:scale(1)}
    .hero-media img{filter:saturate(.9) contrast(.98)}
    .hero-media:after{
      content:"";position:absolute;inset:0;
      /* Compact dark area on the left; the right half has no overlay. */
      background:linear-gradient(90deg,#0b0b0b 0%,rgba(11,11,11,.92) 18%,rgba(11,11,11,.5) 34%,rgba(11,11,11,0) 50%,rgba(11,11,11,0) 100%);
      pointer-events:none;
    }
    .hero-fallback{
      position:absolute;inset:0;display:grid;place-items:center;
      font-size:11px;letter-spacing:.08em;color:inherit;text-transform:uppercase;
      z-index:-1;
    }
    .hero-content{padding:calc(var(--header) + 48px) 0 48px;position:relative;z-index:2}
    .project-meta-line{font-size:10px;color:inherit;text-transform:uppercase;letter-spacing:.07em;margin-bottom:18px}
    .hero h1{
      margin:0;
      font-size:clamp(58px,7.2vw,106px);
      line-height:.92;
      letter-spacing:-5.4px;
      font-weight:800;
      white-space:nowrap;
    }
    .hero-lead{margin:24px 0 0;max-width:470px;font-size:16px;line-height:1.72;color:inherit}
    .hero-bottom{margin-top:42px;display:flex;gap:26px;align-items:center;font-size:11px;color:inherit}
    .hero-bottom a{border-bottom:1px solid currentColor;padding-bottom:2px}
    .hero-index{position:absolute;right:34px;bottom:30px;font-size:10px;letter-spacing:.06em;color:inherit}

    /* Statement / metadata — no doodles until real assets exist. */
    .statement-section{padding:92px 0 88px;background:var(--paper)}
    .statement{max-width:900px;margin:0 auto 76px;font-size:24px;line-height:1.45;text-align:center;letter-spacing:-.6px}
    .metadata{display:grid;grid-template-columns:repeat(4,1fr);gap:44px;padding-top:26px;border-top:1px solid var(--line)}
    .meta-label{font-size:10px;color:#77766f;margin-bottom:8px}
    .meta-value{font-size:13px;line-height:1.6}

    /* Shared section typography */
    .section{padding:118px 0}
    .eyebrow{font-size:10px;color:#77766f;letter-spacing:.06em;text-transform:uppercase;margin-bottom:15px}
    .section-title{font-size:clamp(23px,2.2vw,34px);line-height:.96;margin:0 0 18px;letter-spacing:-1.6px;font-weight:800}
    .section-sub{font-size:clamp(19.2px,1.76vw,27.2px);line-height:1.45;margin:0 0 28px;letter-spacing:-.6px;font-weight:400}
    .body-copy{font-size:15px;line-height:1.9;color:#33332f;max-width:660px}

    /* CHALLENGE — Bradley-style: left narrative sticky, right side scrolls. */
    .challenge-section{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--paper)}
    .challenge-layout{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:86px;align-items:start}
    .challenge-left{
      position:sticky;
      top:calc(var(--header) + 34px);
      padding:96px 0 120px;
      min-height:calc(100vh - var(--header) - 20px);
      display:flex;flex-direction:column;justify-content:center;
    }
    .challenge-left .body-copy{max-width:520px}
    .challenge-right{padding:94px 0 124px;display:flex;flex-direction:column;gap:120px}
    .challenge-story{
      min-height:78vh;
      display:grid;
      grid-template-columns:minmax(0,1fr);
      gap:24px;
      align-items:start;
    }
    .challenge-caption{align-self:start}
    .challenge-caption .num{font-size:10px;color:#8a8982;margin-bottom:12px;letter-spacing:.05em}
    .challenge-caption h3{font-size:16px;line-height:1.45;margin:0 0 9px;letter-spacing:-.2px}
    .challenge-caption p{font-size:12px;line-height:1.65;color:#6e6d67;margin:0}
    .challenge-frame{
      height:min(68vh,620px);
      min-height:460px;
      position:relative;
      overflow:hidden;
      background:#dfdfdc;
      border:1px solid #d5d5d0;
    }
    .media-fallback{position:absolute;inset:0;display:grid;place-items:center;color:#8b8b85;font-size:10px;letter-spacing:.06em;text-transform:uppercase}
    .challenge-frame img{position:relative;z-index:2}
    .challenge-frame.is-placeholder .fallback-demo{display:flex}
    .fallback-demo{position:absolute;inset:0;z-index:1;display:none;align-items:center;justify-content:center;padding:56px}
    .bubble-stack{width:min(410px,88%)}
    .bubble{background:white;border-radius:999px;padding:17px 22px;margin:16px 0;font-size:14px;box-shadow:0 16px 30px rgba(0,0,0,.06)}
    .bubble:nth-child(2){margin-left:52px}.bubble:nth-child(3){margin-left:12px}.bubble:nth-child(4){margin-left:78px}
    .verification-diagram{width:86%;display:grid;gap:15px}.verification-node{border:1px solid #c5c5c0;background:#f4f4f1;padding:18px 20px;font-size:13px}.verification-arrow{text-align:center;color:#8a8a85}
    .more-ai{width:88%;display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}.more-ai span{border:1px solid #c9c9c4;background:#f4f4f1;padding:17px 20px;font-size:13px}.more-ai b{font-size:22px;font-weight:400;color:#8a8984}

    /* EXPLORE — the entire black section is the image, continuously cross-fading. */
    .research{
      min-height:100vh;
      position:relative;
      color:#fff;
      overflow:hidden;
      isolation:isolate;
      display:flex;
      align-items:center;
      background:#090909;
    }
    .research-bg{position:absolute;inset:0;z-index:-4;opacity:0;transition:opacity 1.25s ease;background:#111}
    .research-bg.active{opacity:1}
    .research-bg img,.research-bg video{filter:brightness(.67) saturate(.72)}
    .research-bg img{transform:scale(1.015);transition:transform 6s linear}
    .research-bg.active img{transform:scale(1.045)}
    .research:after{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.62) 44%,rgba(0,0,0,.28) 76%,rgba(0,0,0,.42) 100%)}
    .research-copy{width:min(620px,62vw);padding:116px 0;position:relative;z-index:3}
    .research .eyebrow{color:#aaa9a2}.research .body-copy{color:#f0f0ed}
    .research-insight{margin-top:46px;padding-top:30px;border-top:1px solid rgba(255,255,255,.28);font-size:17.6px;line-height:1.55;max-width:590px}
    .research-index{position:absolute;right:32px;bottom:28px;z-index:4;color:#d0d0cb;font-size:10px;letter-spacing:.08em}

    /* REFINE — still static; motion hooks reserved for later. */
    .refine-section{background:#f6f6f3}
    .refine-intro{max-width:860px}
    .refine-flow{display:grid;grid-template-columns:1fr 42px 1fr 42px 1fr;align-items:center;margin-top:58px}
    .flow-arrow{text-align:center;font-size:24px;color:#97968f}
    .info-card{min-height:420px;background:#deded9;padding:32px;position:relative;overflow:hidden;border:1px solid #d2d2cd}
    .info-card .step{font-size:10px;color:#787771;margin-bottom:12px;letter-spacing:.04em}
    .info-card h3{font-size:20px;margin:0 0 8px;letter-spacing:-.3px}.info-card p{font-size:12px;color:#6b6a65;margin:0;line-height:1.65}
    .dot-cloud{position:absolute;inset:164px 26px 34px}.dot-cloud i{position:absolute;width:14px;height:14px;background:#aaa9a3;border-radius:50%}
    .dot-cloud i:nth-child(1){left:7%;top:20%}.dot-cloud i:nth-child(2){left:25%;top:53%}.dot-cloud i:nth-child(3){left:40%;top:19%}.dot-cloud i:nth-child(4){left:58%;top:47%}.dot-cloud i:nth-child(5){left:77%;top:12%}.dot-cloud i:nth-child(6){left:85%;top:67%}.dot-cloud i:nth-child(7){left:49%;top:77%}.dot-cloud i:nth-child(8){left:16%;top:76%}.dot-cloud i:nth-child(9){left:69%;top:83%}.dot-cloud i:nth-child(10){left:32%;top:41%}
    .matrix{position:absolute;left:36px;right:36px;bottom:36px;top:176px;border-left:1px solid #9e9d97;border-bottom:1px solid #9e9d97}.matrix:before,.matrix:after{content:"";position:absolute;background:#aaa9a3}.matrix:before{width:1px;top:0;bottom:0;left:50%}.matrix:after{height:1px;left:0;right:0;top:50%}.matrix b{position:absolute;width:15px;height:15px;border-radius:50%;background:#8d8c86}.matrix b:nth-child(1){left:24%;top:66%}.matrix b:nth-child(2){left:63%;top:27%}.matrix b:nth-child(3){left:76%;top:16%}.matrix b:nth-child(4){left:57%;top:44%}.matrix b:nth-child(5){left:32%;top:38%}.matrix b:nth-child(6){left:70%;top:58%}.matrix b:nth-child(7){left:46%;top:23%}
    .core-bars{position:absolute;left:42px;right:42px;top:194px;display:flex;flex-direction:column;gap:16px}.core-bars span{height:42px;background:#b7b7b1;border-radius:4px}

    /* EXPERIENCE — cleaner editorial rows, subtle entrance on scroll. */
    .experience-section{background:var(--paper)}
    .experience-head{margin-bottom:54px}
    .feature-list{display:flex;flex-direction:column}
    .feature-row{display:grid;grid-template-columns:1.15fr .85fr;gap:72px;align-items:center;padding:42px 0;border-top:1px solid var(--line)}
    .feature-row:last-child{border-bottom:1px solid var(--line)}
    .feature-media{height:300px;background:#dfdfdc;position:relative;overflow:hidden;border:1px solid #d3d3ce}
    .feature-media video,.feature-media img{position:relative;z-index:2}
    .feature-index{font-size:10px;color:#77766f;margin-bottom:11px;letter-spacing:.04em}
    .feature-copy h3{font-size:21px;line-height:1.45;margin:0 0 12px;letter-spacing:-.3px}.feature-copy p{font-size:13px;color:#62615c;line-height:1.75;margin:0}

    /* Project facts: two text colours on the page background. */
    .numbers{padding:56px 0;background:var(--paper);color:#2A4A38}
    .numbers-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
    .number-item{min-width:0;padding:32px 24px}
    .number-item strong{display:block;color:#F78226;font-size:clamp(28px,3.1vw,42px);line-height:1.1;letter-spacing:-1.5px;margin-bottom:20px;white-space:nowrap}
    .number-item span{font-size:12px;color:inherit;line-height:1.7}

    /* Explore links stay near the end, as requested. */
    .explore-final{padding:104px 0 118px;background:var(--paper);border-top:1px solid var(--line)}
    .explore-final-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:38px}
    .explore-final .section-title{margin-bottom:0}.explore-tagline{font-size:11px;color:#76756f}
    .link-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
    .project-link{display:block}
    .project-link .thumb{height:220px;background:#ddd;overflow:hidden;position:relative;border:1px solid #d5d5d0}
    .project-link .thumb:after{content:"↗";position:absolute;right:15px;top:13px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.92);font-size:13px;transform:translateY(4px);opacity:0;transition:.35s var(--ease);z-index:4}
    .project-link:hover .thumb:after{transform:none;opacity:1}.project-link .label{font-size:14px;margin-top:12px;display:flex;justify-content:space-between;gap:10px}
    .video-thumb{background:linear-gradient(135deg,#d3d3cf,#bdbdb8)}.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:15px;z-index:3}.proto-thumb:before,.proto-thumb:after{content:"";position:absolute;background:#f4f4f1;box-shadow:0 14px 28px rgba(0,0,0,.1)}.proto-thumb:before{width:62%;height:70%;left:10%;top:15%;transform:rotate(-3deg)}.proto-thumb:after{width:49%;height:62%;right:8%;bottom:11%;transform:rotate(4deg)}.award-thumb{display:flex;align-items:center;justify-content:center;flex-direction:column}.award-thumb strong{font-size:30px;line-height:.94;letter-spacing:-1.2px}.award-thumb span{font-size:11px;margin-top:12px;color:#555}

    .reflection{padding:116px 0;border-top:1px solid var(--line);background:#f5f5f2}.reflection .section-sub{max-width:880px}.reflection .body-copy{max-width:920px}
    .footer{height:100px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#76756f}

    @media(max-width:980px){
      .numbers-row{grid-template-columns:repeat(2,minmax(0,1fr))}
      
      .hero{min-height:650px}.hero h1{font-size:72px;letter-spacing:-4px}
      .metadata{grid-template-columns:1fr 1fr;gap:32px}
      .challenge-layout{grid-template-columns:1fr}.challenge-left{position:relative;top:auto;min-height:auto;padding:80px 0 16px}.challenge-right{padding:30px 0 90px;gap:60px}.challenge-story{min-height:auto}.challenge-frame{height:520px;min-height:0}
      .research-copy{width:78vw}.refine-flow{grid-template-columns:1fr;gap:16px}.flow-arrow{transform:rotate(90deg)}
      .feature-row{grid-template-columns:1fr;gap:22px}.link-grid{grid-template-columns:1fr}.project-link .thumb{height:300px}    }
    @media(max-width:620px){
      .hero{min-height:600px;align-items:flex-end}.hero-content{padding:calc(var(--header) + 40px) 0 48px}.hero h1{font-size:56px;letter-spacing:-3px}.hero-lead{font-size:14px}.statement-section{padding:70px 0}.statement{font-size:18.4px;margin-bottom:52px}.metadata{grid-template-columns:1fr}.section{padding:84px 0}.section-title{font-size:22px}.section-sub{font-size:18.4px}.challenge-story{grid-template-columns:1fr;gap:15px}.challenge-caption{order:0}.challenge-frame{height:390px}.research{min-height:760px}.research-copy{width:100%;padding:90px 0}.numbers{padding:36px 0}.numbers-row{grid-template-columns:1fr;gap:12px}.number-item{padding:24px 16px}.number-item strong{font-size:clamp(23px,6.5vw,34px);letter-spacing:-1px}.explore-final-head{align-items:flex-start;flex-direction:column}.project-link .thumb{height:240px}
    }
    @media(prefers-reduced-motion:reduce){
      html{scroll-behavior:auto}[data-reveal]{opacity:1;transform:none;transition:none}.hero-media,.research-bg,.research-bg img,.project-link .thumb:after{transition:none!important;transform:none!important}
    }
  
/* Stable media surfaces preserve the reference geometry. */
.hero-media img{object-position:68% center}
.hero-fallback{display:none}
.hero.has-media-error .hero-fallback{display:grid}
.media-fallback{padding:24px;text-align:center}
.feature-media video{object-fit:contain}
.project-link[aria-disabled="true"]{cursor:default}
.project-link[aria-disabled="true"] .label{opacity:.65}
.project-link[aria-disabled="true"] .thumb:after{display:none}
.project-link .thumb img{position:relative;z-index:2}
.thumb.has-image:before,.thumb.has-image:after{display:none}
@media(max-width:620px){.hero h1{font-size:clamp(42px,11vw,56px)}.hero-bottom{flex-wrap:wrap;gap:16px}.fallback-demo{padding:24px}.bubble{font-size:12px;padding:12px}}
@media(max-width:620px){.hero-media:after{background:linear-gradient(180deg,rgba(11,11,11,.25),rgba(11,11,11,.65) 38%,rgba(11,11,11,.96) 64%,#0b0b0b 100%)}}