@font-face{font-family:Baskervville;src:url('/assets/baskervville-regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
:root{--ink:#100c24;--muted:#514b61;--line:#dedbe8;--mint:#302157;--hero-wash:#efedf8;--hero-ink:#100c24;--marble-peek:12px;--display-font:Baskervville,Georgia,'Times New Roman',serif}
:root{--diagram-connector:#3d296a;--diagram-ink:#181030;--diagram-lilac:#bea7f5;--diagram-aqua:#82eadb;--diagram-pink:#ffc4e6}
:root{--surface-pearl:#efeff1;--logo-mint:#20f1cb;--logo-pink:#ff168f;--fido-green:#004b4e;--project-gap:32px}
/* Lucide arrows stay quiet and consistent, including on emoji-capable platforms. */
.link-tail{white-space:nowrap}
.link-arrow{display:inline-block;width:16px;height:16px;margin-left:6px;vertical-align:baseline;opacity:.75;flex-shrink:0;stroke-width:2.25}
.marble-banner{--marble-height:200px;--ribbon-height:70px;height:var(--marble-height);width:100%;position:sticky;top:calc(var(--marble-peek) - var(--marble-height));z-index:21;background:#0abab5 url('/assets/marble-ink-v2.webp') center/cover no-repeat;touch-action:pan-y}
.marble-banner.marble-compact{height:var(--ribbon-height);top:calc(var(--marble-peek) - var(--ribbon-height))}
.marble-banner.marble-compact{--ribbon-height:64px}
.marble-banner canvas{display:block;width:100%;height:100%;opacity:0}
.marble-banner canvas.marble-ready{opacity:1}
.marble-logo{--logo-inset:max(5vw,calc((100vw - 1280px)/2));position:absolute;left:calc(-1 * var(--logo-inset));top:0;bottom:0;display:flex;align-items:center;width:184px;padding:0 24px;background:var(--ink)}
.marble-logo img{display:block;width:100%;height:auto;filter:brightness(0) invert(1)}
.marble-logo:focus-visible{outline:2px solid #fff;outline-offset:8px}
.marble-banner .site-header.marble-toolbar{position:absolute;inset:auto 0 0;height:var(--ribbon-height);width:min(1280px,90%);max-width:none;padding:0;margin:auto;background:transparent;display:flex;align-items:center;justify-content:space-between;gap:24px}
body[data-page=home] .marble-banner .marble-toolbar{height:100%}
body[data-page=home] .marble-logo{width:216px}
.site-index{position:sticky;top:var(--marble-peek);z-index:20;display:flex;align-items:center;gap:8px;min-height:56px;padding:6px max(5%,calc((100% - 1280px)/2));background:var(--hero-wash);color:var(--hero-ink)}
.site-index a{display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 14px;font:12px/1.4 Arial,Helvetica,sans-serif;text-transform:uppercase;text-decoration:none;white-space:nowrap}
.site-index a:hover,.site-index a[aria-current],.site-index a:active{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
.site-index a:focus-visible{outline:2px solid var(--hero-ink);outline-offset:2px}
@media(max-width:760px){.site-index{gap:4px;justify-content:space-between;min-height:56px}.site-index a{padding:0 9px}}
body[data-page=home] .site-header{justify-content:flex-end}
.skip:focus{z-index:22}
@media(max-width:760px){.marble-banner{--marble-height:140px;--ribbon-height:49px}.marble-banner.marble-compact{--ribbon-height:49px}}
html{scroll-padding-top:24px}
html:has(.site-index){scroll-padding-top:calc(80px + var(--marble-peek))}
@media(max-width:760px){:root{--marble-peek:8px}html:has(.site-index){scroll-padding-top:calc(72px + var(--marble-peek))}}
.case-cover{background:var(--hero-wash);color:var(--hero-ink)}
.case-cover-inner{width:min(1280px,90%);margin:auto;min-height:240px;padding:26px 0 36px;display:flex;flex-direction:column;justify-content:space-between;gap:28px}
.case-cover-top{display:flex;justify-content:flex-end;gap:28px}
.editorial .case-disciplines{font-size:30px;line-height:1.2;margin:0}
.editorial .case-year{font-size:14px;line-height:1.6;margin:0;text-align:right}
.case-cover .eyebrow{color:var(--muted);margin-bottom:12px}
.editorial .case-cover h1{font-size:68px;line-height:1.06;margin:0;max-width:1050px}
.case-cover-bottom{display:flex;align-items:end;justify-content:space-between;gap:40px}
.case-cover-notes{display:grid;grid-template-columns:1fr 1fr;gap:36px}
.editorial .case-cover-notes p{font-size:13px;line-height:1.6;margin:0}
.case-cover-notes strong{display:block;font-weight:600;margin-bottom:8px}
.editorial .case-author{font:46px/1.1 Georgia,serif;margin:0;text-align:right}
.case-opening,.case-process,.case-media,.case-results{width:min(1280px,90%);margin:auto}
.case-opening{display:grid;grid-template-columns:1fr 1fr;gap:64px;padding:56px 0 32px}
.case-opening p{font-size:18px}
.case-media{padding:12px 0 44px}
.case-media figure{margin:0;min-width:0}
.case-media img{width:100%;height:auto;max-height:720px;object-fit:contain;background:var(--image-backdrop,#fff)}
.case-media figcaption{font-size:13px;color:var(--muted);line-height:1.5;margin-top:12px}
.case-primary img{max-height:620px}
.case-film-stage{display:flex;align-items:center;justify-content:center;padding:24px;background:var(--image-backdrop,#fff)}
.case-film-stage video{display:block;width:100%;height:auto;max-width:900px;max-height:560px;object-fit:contain}
.case-film-portrait video{width:min(100%,300px)}
.topshot-motion .case-film-stage{background:#f7f7f7}
.topshot-showcase{background:#151515;color:#fff;padding:72px 0 100px;margin:32px 0 0;clip-path:polygon(0 0,100% 0,100% calc(100% - 48px),50% 100%,0 calc(100% - 48px))}
.topshot-showcase .editorial-band{border:0;padding-top:0}
.topshot-showcase .eyebrow,.topshot-showcase figcaption{color:#e1daec}
.topshot-showcase .case-media{padding-bottom:40px}
.topshot-showcase h2{color:#fff}
.topshot-archive-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.topshot-archive-grid img{height:auto;max-height:none}
.topshot-mobile-states{max-width:1000px}
@media(max-width:760px){.topshot-showcase{padding:48px 0 72px}.topshot-archive-grid{grid-template-columns:1fr}.topshot-mobile-states figure{width:min(100%,320px);margin:auto}}
.case-flow,.case-system{width:min(1280px,90%);margin:0 auto 44px;padding-bottom:20px}
.case-flow-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;list-style:none;padding:0;margin:0}
.case-flow-steps>li{position:relative;min-width:0;padding:24px;border:1px solid #b7a3d6;border-radius:6px;background:var(--hero-wash)}
.case-flow-steps>li:nth-child(2){background:#edf1f8;border-color:#aab7cc}
.case-flow-steps>li:nth-child(3){background:#f4f6f5;border-color:#bdc9c2}
.case-flow-steps>li+li::before{content:"";position:absolute;right:100%;top:50%;width:32px;border-top:3px solid var(--diagram-connector)}
.case-flow-steps>li+li::after{content:"";position:absolute;left:-7px;top:calc(50% - 3px);width:6px;height:6px;border-top:3px solid var(--diagram-connector);border-right:3px solid var(--diagram-connector);transform:rotate(45deg)}
.editorial .case-flow-steps h3,.editorial .case-system h3{font-size:21px;line-height:1.35;margin:0 0 12px}
.editorial .case-flow-steps p,.editorial .case-system p{font-size:16px;line-height:1.5;margin:0}
.case-flow figcaption,.case-system figcaption{font-size:13px;color:var(--muted);line-height:1.5;margin-top:24px;max-width:740px}
.case-system-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;list-style:none;padding:24px 0;margin:0;}
.case-system-grid li{min-width:0}
.case-system-grid a{display:inline-block;margin-top:16px;font-size:15px}
@media(max-width:900px){
  .case-flow-steps{grid-template-columns:1fr}
  .case-flow-steps>li+li::before{left:32px;top:-33px;right:auto;width:0;height:32px;border-top:0;border-left:3px solid var(--diagram-connector)}
  .case-flow-steps>li+li::after{left:29px;top:-7px;transform:rotate(135deg)}
}
@media(max-width:760px){
  .case-film-stage{padding:16px}
  .case-flow-steps>li{padding:20px}
  .case-system-grid{grid-template-columns:1fr;gap:24px}
  .case-system-grid li+li{padding-top:24px}
}
.case-media-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
.case-media-pair img{display:block;height:auto;max-height:none}
.case-page-previews figure>a{display:block;aspect-ratio:4/5;overflow:hidden;background:var(--image-backdrop,#fff)}
.case-page-previews figure>a img{width:100%;height:auto}
.auth-continuity{width:min(1280px,90%);margin:0 auto 44px;padding-bottom:20px}
.continuity-root{width:fit-content;max-width:100%;margin:0 auto;padding:16px 24px;border:1px solid #b7a3d6;border-radius:6px;background:var(--hero-wash);font-size:20px;text-align:center}
.continuity-paths{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px;list-style:none;margin:0;padding:48px 0 0;position:relative}
.continuity-paths::before{content:"";position:absolute;top:0;left:50%;height:24px;border-left:3px solid var(--diagram-connector)}
.continuity-path{position:relative;min-width:0}
.continuity-path::before{content:"";position:absolute;top:-24px;height:24px;left:50%;right:-24px;border-top:3px solid var(--diagram-connector);border-left:3px solid var(--diagram-connector)}
.continuity-path:last-child::before{left:-24px;right:50%;border-left:0;border-right:3px solid var(--diagram-connector)}
.editorial .continuity-label{font-size:13px;text-align:center;color:var(--muted);margin:0 0 20px}
.continuity-path ol{list-style:none;margin:0;padding:0;display:grid;gap:32px}
.continuity-path ol li{position:relative;padding:24px;border:1px solid #b7a3d6;border-radius:6px;background:var(--hero-wash)}
.continuity-path:last-child ol li{background:#edf1f8;border-color:#aab7cc}
.continuity-path ol li+li::before{content:"";position:absolute;left:50%;top:-33px;height:32px;border-left:3px solid var(--diagram-connector)}
.continuity-path ol li+li::after{content:"";position:absolute;left:calc(50% - 3px);top:-7px;width:6px;height:6px;border-right:3px solid var(--diagram-connector);border-bottom:3px solid var(--diagram-connector);transform:rotate(45deg)}
.editorial .continuity-path h3{font-size:21px;line-height:1.35;margin:0 0 12px}
.editorial .continuity-path ol p{font-size:16px;line-height:1.5;margin:0}
.editorial .continuity-dependency{font-size:16px;line-height:1.5;padding:20px 0;margin:0}
.continuity-dependency strong{display:block;font-weight:600;margin-bottom:6px}
.auth-continuity figcaption{font-size:13px;color:var(--muted);line-height:1.5;margin-top:24px;max-width:740px}
@media(max-width:760px){
  .case-media-pair{grid-template-columns:1fr;gap:32px}
  .continuity-root{font-size:18px;width:100%;box-sizing:border-box}
  .continuity-paths{grid-template-columns:1fr;gap:36px;padding:32px 0 0 36px}
  .continuity-paths::before{left:12px;top:0;bottom:0;height:auto}
  .continuity-path::before,.continuity-path:last-child::before{top:10px;left:-24px;right:auto;width:20px;height:0;border-top:3px solid var(--diagram-connector);border-left:0;border-right:0}
  .editorial .continuity-label{text-align:left}
  .continuity-path ol li{padding:20px}
  .editorial .continuity-path h3{font-size:20px}
}
.passkeys-film-stage{display:flex;justify-content:center;padding:24px;background:#edf1f8}
.passkeys-film video{display:block;width:min(100%,300px);height:auto;aspect-ratio:6/13;object-fit:contain;background:#fff}
.case-recording:focus-visible{outline:3px solid var(--mint);outline-offset:5px}
@media(max-width:760px){.passkeys-film-stage{padding:16px}}
/* The journey's connectors describe sequence and branching, not quantitative scale. */
.passkey-journey{width:min(1280px,90%);margin:0 auto 44px;padding:0 0 32px}
.journey-heading{max-width:740px;margin-bottom:32px}
.editorial .journey-heading h2{font-size:32px;margin-bottom:16px}
.sequence-heading{display:flex;flex-wrap:wrap;align-items:center;gap:.2em .35em}
.sequence-heading>span{display:inline-flex;align-items:center;gap:.35em;white-space:nowrap}
.sequence-heading svg{width:.65em;height:.65em;flex:none}
.editorial .journey-heading>p:last-child{font-size:17px}
.journey-stages{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:48px;list-style:none;margin:0;padding:0}
.journey-stage{position:relative;min-width:0}
.journey-node{border:1px solid #b7a3d6;border-radius:6px;padding:24px;background:#f6f3fb;min-width:0}
.journey-google{background:var(--hero-wash)}
.journey-system{background:#edf1f8;border-color:#aab7cc}
.editorial .journey-node h3{font-size:21px;line-height:1.3;margin:0 0 12px}
.editorial .journey-node p{font-size:16px;line-height:1.5;margin:0}
.editorial .journey-node .journey-owner{font-size:12px;line-height:1.5;color:var(--muted);margin-bottom:20px}
.journey-stage:first-child::after,.journey-stage:nth-child(2)::after{content:"";position:absolute;left:100%;top:50%;width:48px;border-top:3px solid var(--diagram-connector)}
.journey-stage:nth-child(2)::before{content:"";position:absolute;left:-7px;top:calc(50% - 4px);width:7px;height:7px;border-top:3px solid var(--diagram-connector);border-right:3px solid var(--diagram-connector);transform:rotate(45deg)}
.journey-stage:nth-child(2)::after{width:24px}
.journey-outcomes{list-style:none;margin:0;padding:0;display:grid;grid-auto-rows:1fr;gap:20px}
.journey-outcomes::before{content:"";position:absolute;left:-24px;top:calc(25% - 5px);bottom:calc(25% - 5px);border-left:3px solid var(--diagram-connector)}
.journey-outcomes>li{position:relative}
.journey-outcomes>li::before{content:"";position:absolute;right:100%;top:50%;width:24px;border-top:3px solid var(--diagram-connector)}
.journey-outcomes>li::after{content:"";position:absolute;left:-7px;top:calc(50% - 4px);width:7px;height:7px;border-top:3px solid var(--diagram-connector);border-right:3px solid var(--diagram-connector);transform:rotate(45deg)}
.journey-measure{margin-top:32px;padding:24px 0;display:grid;grid-template-columns:1fr 2fr;gap:32px}
.editorial .journey-measure h3{font-size:20px;line-height:1.4;margin:0}
.editorial .journey-measure p{font-size:16px;line-height:1.5;margin:0;max-width:680px}
.passkey-journey figcaption{font-size:13px;line-height:1.5;color:var(--muted);max-width:820px;margin-top:16px}
@media(max-width:1000px){
  .journey-stages{grid-template-columns:1fr;gap:32px;max-width:620px;margin:auto}
  .journey-stage:first-child::after,.journey-stage:nth-child(2)::after{left:32px;top:100%;width:0;height:32px;border-top:0;border-left:3px solid var(--diagram-connector)}
  .journey-stage:nth-child(2)::before{left:29px;top:-7px;transform:rotate(135deg)}
  .journey-stage:nth-child(2)::after{height:32px}
  .journey-outcomes{margin-left:56px}
  .journey-outcomes::before{left:32px;top:0;bottom:calc(25% - 5px)}
  .journey-outcomes>li::before{width:24px}
  .journey-measure{grid-template-columns:1fr;gap:12px}
}
@media(max-width:760px){
  .journey-node{padding:20px}
  .editorial .journey-heading h2{font-size:28px}
  .editorial .journey-node h3{font-size:20px}
  .journey-outcomes{margin-left:32px}
  .journey-stage:first-child::after,.journey-stage:nth-child(2)::after{left:12px}
  .journey-stage:nth-child(2)::before{left:9px}
  .journey-outcomes::before{left:12px}
  .journey-outcomes>li::before{width:20px}
}
.case-results{padding:30px 0}
.case-results-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin:28px 0}
.case-results-grid strong{font:52px/1.1 Georgia,serif;color:var(--ink)}
.case-results-grid p{font-size:16px;margin:10px 0 0}
.editorial .case-result-note{font-size:13px;color:var(--muted);margin:0;max-width:680px}
.case-process{padding:64px 0}
.case-process-heading{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start;margin-bottom:28px}
.case-process-heading>p{max-width:460px;font-size:17px;color:var(--muted);padding-top:30px}
.case-process-list{padding:0;margin:0;list-style:none;counter-reset:steps}
.case-process-list li{display:grid;grid-template-columns:220px 1fr;gap:36px;padding:32px 0;}
.case-process-list li:last-child{}
.case-step-number{font:48px/1.1 Arial,sans-serif;font-weight:300;color:var(--mint)}
.case-process-list h3{font-size:27px;margin-bottom:10px}
.case-process-list p{font-size:17px;max-width:800px;margin:0;color:var(--muted)}
.case-process-list .case-step-premise{color:var(--ink);margin-bottom:10px}
.case-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.case-gallery img{height:360px}
.case-chapter{width:min(1280px,90%);margin:auto;padding:64px 0;display:grid;grid-template-columns:1fr 1fr;gap:64px}
.case-chapter .copy{max-width:none}
.case-chapter .action a{display:inline-block;padding:8px 0;font-size:17px;text-underline-offset:5px}
.case-study .case-cover h1{overflow-wrap:break-word}
.case-study .case-opening-copy .role-line{margin:0;font-size:16px;color:var(--muted)}
.case-study .case-process-list h3{font-size:27px;margin-bottom:10px}
.case-study .case-process-list p{font-size:17px;margin:0 0 10px}
.case-study .case-process-list p:last-child{margin-bottom:0}
.case-study .case-media img{max-width:100%}
@media(max-width:760px){
  .case-cover-inner{min-height:0;padding:28px 0;gap:32px}
  .editorial .case-disciplines{font-size:21px}
  .editorial .case-cover h1{font-size:42px;overflow-wrap:anywhere}
  .case-cover-bottom{display:block}
  .case-cover-notes{gap:20px}
  .editorial .case-author{font-size:32px;margin-top:30px}
  .case-opening,.case-process-heading{grid-template-columns:1fr;gap:8px}
  .case-opening{padding-top:36px}
  .case-process{padding:42px 0}
  .case-process-heading>p{padding:0;margin:0 0 16px}
  .case-process-list li{grid-template-columns:44px minmax(0,1fr);gap:18px;padding:26px 0}
  .case-step-number{font-size:30px}
  .case-process-list h3{font-size:23px}
  .case-process-list p{font-size:16px}
  .case-results-grid{gap:18px}
  .case-results-grid strong{font-size:32px}
  .case-results-grid p{font-size:13px}
  .case-gallery{grid-template-columns:1fr}
  .case-gallery img{height:auto;max-height:620px}
  .case-chapter{grid-template-columns:minmax(0,1fr);gap:12px;padding:42px 0}
  .case-study .case-process-list h3{font-size:23px}
  .case-study .case-process-list p{font-size:16px}
}
.site-header{height:112px;max-width:1480px;margin:auto;align-items:center;justify-content:space-between;padding:24px 5%}
.site-header .logo{position:static;transform:none;padding:0;color:var(--mint);font-size:46px;letter-spacing:0}
.site-header .logo img{display:block;width:112px;height:auto}
.site-header nav{width:auto;gap:28px;line-height:1.4}
.site-header nav a:hover,.site-header nav a[aria-current=page]{text-underline-offset:7px}
a:focus-visible,button:focus-visible{outline:3px solid var(--mint);outline-offset:5px}
.editorial{color:var(--ink)}
.editorial h1,.editorial h2,.editorial h3{letter-spacing:0;font-weight:400}
.editorial h1,.editorial h2{font-family:var(--display-font)}
.editorial h1{font-size:72px;line-height:1.06;margin:20px 0 28px}
.editorial h2,.sources h2{font-family:var(--display-font);font-size:42px;font-weight:400;line-height:1.15;margin:0 0 24px}
.editorial h3{font-size:23px;line-height:1.3;margin:0 0 12px}
.editorial p{font-size:18px;line-height:1.65;margin:0 0 20px}
.editorial a{text-underline-offset:5px}
.eyebrow,.editorial .eyebrow{font:12px/1.5 Arial,Helvetica,sans-serif;text-transform:uppercase;letter-spacing:0;margin:0 0 16px;color:var(--muted)}
.home-opening,.editorial-hero,.work-section,.editorial-band,.chapter-nav,.next-story,.case-image{width:min(1280px,90%);margin:auto}
.home-opening{padding:50px 0 64px}
.home-opening h1{font-size:76px}
.editorial .lede{font-size:23px;line-height:1.5;max-width:780px}
.text-link{display:inline-block;font-size:17px;padding:8px 0}
.work-section{padding:48px 0 72px;}
body[data-page=home] #work{border-top:0}
.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin-bottom:24px}
.section-heading p{font-size:14px;color:var(--muted)}
.work-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--project-gap)}
.work-image{display:block;background:var(--image-backdrop,#fff);aspect-ratio:1.6;overflow:hidden}
.work-image img{width:100%;height:100%;object-fit:contain}
/* Extend the artwork's own edge colors into the uncropped thumbnail stage. */
.work-image[href="/passkeys/"]{--image-backdrop:#dde0e2}
.work-image[href="/google-authenticator/"],.work-image[href="/two-step-verification/"],.work-image[href="/fido/"]{--image-backdrop:linear-gradient(105deg,#d8e1e2,#dce1e2)}
.work-image[href="/nbatopshot/"]{--image-backdrop:linear-gradient(105deg,#dcefee,#e1efed)}
.work-image[href="/fintech/"]{--image-backdrop:#f7f7f7}
.work-image[href="/music-startup/"]{--image-backdrop:#ecebeb}
.work-image[href="/canadian-crypto/"]{aspect-ratio:1000/648}
.work-copy{padding-top:22px;max-width:560px}
.work-copy h3{font-family:var(--display-font);font-size:32px}
.work-copy h3 a{text-decoration:none}
.work-copy h3 a:hover{text-decoration:underline}
.work-copy p{font-size:17px}
.google-zone{padding:18px 0 0}
.google-zone-heading{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin-bottom:30px;max-width:780px;align-items:start}
.editorial .google-zone-heading h2{font-size:64px;line-height:1.1;margin-bottom:12px}
.editorial .google-tenure{font-size:16px;line-height:1.5;color:var(--muted);margin:0}
.google-zone-intro p{font-size:18px;margin:0 0 8px}
.google-project-grid .work-image{aspect-ratio:1.75}
body.editorial .work-item .work-image[href="/google-authenticator/"]{aspect-ratio:916/512;--image-backdrop:#dff1fe}
body.editorial .work-item .work-image[href="/passkeys/"]{aspect-ratio:2096/1182;--image-backdrop:#e4ebfa}
body.editorial .work-item .work-image[href="/two-step-verification/"]{aspect-ratio:316/178;--image-backdrop:#fff}
body.editorial .work-item .work-image[href="/two-step-verification/"] img{padding:16px}
.case-media.case-illustration{max-width:720px;margin-inline:auto}
.case-illustration figure{margin:0}
.case-illustrated-copy{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,316px);gap:40px;align-items:center}
.case-illustrated-copy figure{margin:0}
.case-illustrated-copy img{width:100%;height:auto}
.case-illustrated-copy figcaption{font-size:13px;line-height:1.5;color:var(--muted);margin-top:16px}
body.editorial .work-item .work-image[href="/fido/"]{display:grid;place-items:center;aspect-ratio:1.75;background:var(--fido-green)}
body.editorial .work-item .work-image[href="/fido/"] img{width:68%;height:auto}
.case-media .fido-brand-banner{display:grid;place-items:center;aspect-ratio:3.5;background:var(--fido-green)}
.case-media .fido-brand-banner img{width:min(60%,480px);height:auto;background:transparent}
.case-resource-logo{display:block;width:min(100%,360px);margin-bottom:32px}
.case-resource-logo img{width:100%;height:auto}
.case-detail-illustration{width:min(100%,316px);margin:32px 0 0}
.case-detail-illustration img{width:100%;height:auto}
/* Chapters stay available while the case study scrolls beneath them. */
html{scroll-padding-top:88px;scroll-behavior:auto}
.case-nav{position:sticky;top:6px;z-index:20;display:flex;align-items:center;gap:20px;min-height:64px;padding:8px 4%;background:#fff;color:#100c26;border-bottom:1px solid #e4e3e8;font:15px/1.3 Inter,Arial,sans-serif}
.case-nav a{color:inherit;text-decoration:none}
.case-nav a:hover{color:#a90062}
.case-nav svg{width:20px;height:20px;flex:none;stroke-width:2.25}
.case-nav .case-nav-brand{display:none;align-items:center;justify-content:center;width:76px;min-height:44px;flex:none}
.case-nav-brand img{display:block;width:100%;height:auto}
.case-nav.has-compact-brand .case-nav-brand{display:flex}
.case-nav-home,.case-nav-projects summary{display:flex;align-items:center;gap:8px;min-height:44px;white-space:nowrap}
.case-nav-chapters{display:flex;justify-content:center;gap:20px;margin:auto;min-width:0}
.case-nav-chapters a{display:flex;align-items:center;min-height:44px;border-bottom:3px solid transparent}
.case-nav-chapters a[aria-current]{border-bottom-color:#10dfbf}
.case-nav-projects{position:relative;flex:none}
.case-nav-projects summary{cursor:pointer;list-style:none}
.case-nav-projects summary::-webkit-details-marker{display:none}
.case-nav-projects[open] summary{color:#a90062}
.case-nav-panel{position:absolute;right:0;top:calc(100% + 9px);width:280px;max-height:70dvh;overflow:auto;background:#fff;border:1px solid #e4e3e8;box-shadow:5px 5px 0 #10dfbf,-3px -3px 0 #ff0099;padding:12px}
.case-nav-panel a{display:flex;align-items:center;min-height:44px;padding:8px 12px}
.case-nav-panel a[aria-current]{background:#eeedf0;border-left:3px solid #ff0099}
.case-nav-select{display:none;appearance:none;font:inherit;color:inherit;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='16' fill='%23efeff1'/%3E%3Cpath d='M16 9v14m-6-6 6 6 6-6' fill='none' stroke='%2320f1cb' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 10px center/32px 32px no-repeat;border:1px solid #c8c6d0;border-radius:0;min-height:52px;padding:10px 50px 10px 16px;min-width:0;max-width:100%;text-align:left;text-align-last:left;cursor:pointer}
.editorial .chapter-band--ink :focus-visible,.editorial footer :focus-visible{outline:3px solid #10dfbf;outline-offset:5px}
.case-nav :focus-visible{outline:3px solid #a90062;outline-offset:3px}
@media(max-width:1050px){
  .case-nav{gap:14px;padding-inline:20px}
  .case-nav.is-enhanced .case-nav-chapters{display:none}
  .case-nav.is-enhanced .case-nav-select{display:block;flex:1;margin-inline:auto;max-width:300px}
  .case-nav:not(.is-enhanced){flex-wrap:wrap}
  .case-nav:not(.is-enhanced) .case-nav-chapters{order:3;flex-basis:100%;justify-content:flex-start;overflow:auto}
  .case-nav:not(.is-enhanced) .case-nav-projects{margin-left:auto}
}
@media(max-width:480px){.case-nav{gap:8px;padding-inline:12px}.case-nav .case-nav-brand{width:52px}.case-nav-home span,.case-nav-projects summary span{display:none}.case-nav-home,.case-nav-projects summary{justify-content:center;width:44px}.case-nav-select{width:0}.case-nav-panel{width:min(280px,calc(100vw - 32px))}}
@media(max-width:600px){
  html{scroll-padding-top:148px}
  .case-nav.is-enhanced{display:grid;grid-template-columns:1fr auto 1fr;gap:4px 12px}
  .case-nav .case-nav-home{grid-column:1;grid-row:1;width:auto;justify-self:start}
  .case-nav .case-nav-brand{grid-column:2;grid-row:1}
  .case-nav .case-nav-projects{grid-column:3;grid-row:1;justify-self:end}
  .case-nav-home span,.case-nav-projects summary span{display:inline}
  .case-nav-projects summary{width:auto}
  .case-nav.is-enhanced .case-nav-select{grid-column:1/-1;grid-row:2;width:100%;max-width:none;margin:0}
}
@media(max-width:760px){.case-media .fido-brand-banner{aspect-ratio:1.75}.case-resource-logo{width:min(100%,280px)}}
@media(max-width:760px){.case-illustrated-copy{grid-template-columns:1fr;gap:24px}.case-illustrated-copy figure{width:min(100%,316px);margin-inline:auto}}
.google-project-grid .work-copy h3{font-size:29px}
.google-continuity{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:28px 0;margin-top:34px}
.google-continuity h3{font-size:22px}
.google-continuity p{font-size:16px;margin:0;max-width:590px}
.google-continuity>a{flex-shrink:0}
.fido-feature{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;padding:54px 0;margin:var(--project-gap) 0 48px}
.fido-feature h2{font-size:36px}
.fido-feature h2 a{text-decoration:none}
.fido-feature h2 a:hover{text-decoration:underline}
.fido-feature .work-copy{padding:0}
body.editorial .work-item.recovery-feature{margin-top:var(--project-gap)}
.earlier-work>h2{font-size:32px;text-align:center}
.earlier-work{position:relative;background:#fff;padding:100px max(5%,calc((100% - 1280px)/2))}
.earlier-work::before{content:"";position:absolute;inset:0 0 auto;height:28px;pointer-events:none}
.earlier-work::before{background:var(--surface-pearl);mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 28'%3E%3Cpath d='M0 0H80V1L40 26L0 1Z'/%3E%3C/svg%3E") top left/80px 28px repeat-x}
@media(max-width:760px){
  .google-zone-heading,.fido-feature{grid-template-columns:1fr;gap:20px}
  .editorial .google-zone-heading h2{font-size:44px}
  .earlier-work{padding-block:72px 56px}
  .fido-feature h2{font-size:30px}
  .google-zone-intro p{font-size:17px}
  .google-continuity{display:block}
  .google-continuity>a{margin-top:12px}
  .fido-feature{padding:36px 0;margin-bottom:36px}
  .google-project-grid .work-copy h3{font-size:27px}
}
.additional-work{display:flex;flex-wrap:wrap;gap:24px;margin-top:40px;padding-top:24px}
.editorial-band{padding:64px 0;display:grid;grid-template-columns:220px minmax(0,1fr);gap:36px}
.narrative{max-width:860px}
.principles{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:28px;margin-top:32px}
.principles>article{min-width:0}
.principles>article>a+p{margin-top:16px}
.principles p{font-size:16px}
.principles h3{font-size:20px;font-weight:600}
.editorial-hero{padding:44px 0 50px}
.editorial .role-line{font-size:14px;color:var(--muted);margin-top:30px}
.chapter-nav{display:flex;flex-wrap:wrap;gap:24px;padding:22px 0;font-size:14px}
.case-image{padding:0 0 56px}
.case-image img{width:100%;height:auto;max-height:650px;object-fit:contain;background:var(--image-backdrop,#fff)}
.case-image figcaption{font-size:14px;color:var(--muted);line-height:1.5;margin-top:14px}
.case-image a{display:block}
.sources{display:block}
.source-note{max-width:760px;color:var(--muted);font-size:16px;line-height:1.6}
.source-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px}
.source-row{display:flex;flex-direction:column;gap:10px;padding:24px 0;text-decoration:none;line-height:1.5}
.source-row strong{font-size:19px;font-weight:500}
.source-row:hover strong{text-decoration:underline;text-underline-offset:4px}
.source-row>span:last-child{font-size:15px;color:var(--muted)}
.source-meta{font-size:12px;color:var(--muted)}
.status-note{border-left:3px solid var(--mint);padding-left:18px}
.next-story{padding:36px 0 64px;display:flex;justify-content:space-between;gap:20px}
.next-story span{color:var(--muted)}
footer{padding:65px 5%;min-height:0;gap:16px;color:var(--ink)}
footer p{font-family:var(--display-font);font-size:48px;letter-spacing:0}
footer a{max-width:100%;overflow-wrap:anywhere}
footer small{margin-top:24px;font-size:13px}
@media(max-width:760px){
.site-header{height:90px;width:100%;padding:20px 5%}
.site-header .logo{font-size:38px}
.site-header nav{top:90px;left:0;width:100%;padding:20px 5%;gap:8px}
#menu{min-height:44px}
.editorial h1,.home-opening h1{font-size:46px}
.editorial h2,.sources h2{font-size:32px}
.editorial .lede{font-size:20px}
.home-opening{padding:24px 0 38px}
.editorial-hero{padding:28px 0 36px}
.editorial-band{grid-template-columns:1fr;gap:12px;padding:42px 0}
.section-heading{display:block}
.work-section{padding:32px 0 44px}
.work-grid,.source-list{grid-template-columns:1fr}
.work-copy h3{font-size:28px}
.editorial p{font-size:17px}
.principles{grid-template-columns:1fr;gap:16px}
.chapter-nav{gap:18px}
.next-story{flex-direction:column}
footer p{font-size:38px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Shared project cards: title, full-width artwork, then the outcome. */
body.editorial .work-item{display:flex;flex-direction:column;align-items:stretch;background:#fff;padding:28px 0 0;gap:0;border-radius:0}
body.editorial .work-item .work-copy{display:contents}
body.editorial .work-item .eyebrow{order:0;padding-inline:22px;margin-bottom:10px;font-size:13px;text-transform:none}
body.editorial .work-item :is(h2,h3){order:1;padding-inline:22px;margin-bottom:24px;font-size:32px;line-height:1.14}
body.editorial .work-item :is(h2,h3) a{display:block;position:relative;min-height:44px}
body.editorial .work-item :is(h2,h3) a:has(.link-arrow){padding-right:48px}
body.editorial .work-item .work-image{order:2}
body.editorial .work-item .work-copy>p:not(.eyebrow){order:3;padding:22px;margin:0;font-size:17px;line-height:1.55}
body.editorial .work-item .link-tail{white-space:normal}
body.editorial .work-item .link-arrow{position:absolute;right:0;top:3px;width:32px;height:32px;margin:0;padding:8px;border-radius:50%;background:var(--ink);color:var(--logo-mint);opacity:1}
@media(min-width:761px){
  body.editorial .work-grid .work-item :is(h2,h3){min-height:74px}
  body.editorial .fido-feature .work-image[href="/fido/"]{aspect-ratio:3.5}
  body.editorial .fido-feature .work-image[href="/fido/"] img{width:min(60%,480px)}
}
@media(max-width:760px){:root{--project-gap:28px}}
@media(max-width:380px){body.editorial .work-item :is(h2,h3){font-size:28px}}
/* Solid color offsets add depth without changing card dimensions or document flow. */
body.editorial :is(.work-item,.journey-node,.case-flow-steps>li,.case-system-grid>li,.diagram-merge,.continuity-root,.continuity-path ol li){--card-lift:-3px;transition:translate 180ms ease-out,box-shadow 180ms ease-out}
@media(hover:hover) and (pointer:fine){
  body.editorial :is(.work-item,.journey-node,.case-flow-steps>li,.case-system-grid>li,.diagram-merge,.continuity-root,.continuity-path ol li):hover{translate:0 var(--card-lift);box-shadow:-5px 5px 0 var(--logo-pink),5px -5px 0 var(--logo-mint)}
}
body.editorial :is(.work-item,.case-system-grid>li):has(a:focus-visible){translate:0 var(--card-lift);box-shadow:-5px 5px 0 var(--logo-pink),5px -5px 0 var(--logo-mint)}
@media(prefers-reduced-motion:reduce){
  body.editorial :is(.work-item,.journey-node,.case-flow-steps>li,.case-system-grid>li,.diagram-merge,.continuity-root,.continuity-path ol li){--card-lift:0px;transition:none}
}

/* The permanent ink stays visible underneath each animated drawing pass. */
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
body[data-page=home] .site-header{height:88px}
body[data-page=home] .site-header .logo{font-size:30px}
.signature-hero{background:transparent;color:var(--ink);width:100%;overflow:hidden}
.editorial-intro{width:100%;margin:0 auto;padding:52px max(5%,calc((100% - 1280px)/2)) 36px;background:var(--hero-wash);color:var(--hero-ink)}
.masthead-signature{position:absolute;top:20px;right:max(5%,calc((100% - 1280px)/2));display:block;width:76px;padding:10px 0}
.masthead-signature img{width:100%;height:auto;filter:brightness(.3)}
.name-composition{position:relative;padding:0 0 20px}
.hero-wordmark{width:300px;max-width:100%;height:auto}
.editorial .name-composition h1{font:24px/1.35 var(--display-font);letter-spacing:0;margin:0}
.intro-bottom{display:block}
.editorial .intro-statement{font:24px/1.35 var(--display-font);margin:0}
.editorial .intro-detail p{font-size:18px;line-height:1.6;max-width:640px;margin:0 0 12px}
@media(max-width:760px){
  body[data-page=home] .marble-banner{--marble-height:104px}
  .editorial-intro{padding:40px 5% 24px}
  .name-composition{padding:0 0 16px}
  .hero-wordmark{width:224px}
  .editorial .name-composition h1{font-size:22px;line-height:1.35;margin:0}
  .editorial .intro-statement{font-size:22px}
  .editorial .intro-detail p{font-size:16px}
}
.signature-art{width:min(1320px,100%);margin:0 auto;height:clamp(270px,48svh,510px);display:flex;align-items:center;justify-content:center}
.mgux-mark{width:100%;height:100%;overflow:visible}
.signature-caption{width:min(1280px,90%);margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 0 36px}
.editorial .signature-name{font-size:12px;color:var(--muted);margin:0 0 9px}
.editorial .signature-statement{font:28px/1.25 Georgia,serif;margin:0}
.motion-toggle{width:44px;height:44px;flex:0 0 44px;border:1px solid #b7bfba;border-radius:50%;background:transparent;color:var(--ink);cursor:pointer;font:18px/1 Arial,sans-serif}
.motion-toggle:hover{background:#eff3f0;border-color:#77877c}
.motion-toggle:focus-visible{outline-color:var(--mint)}
.motion-toggle[hidden]{display:none}
.animation-paused .mgux-retrace{animation-play-state:paused}
.home-summary{padding:30px 0 24px;display:flex;align-items:center;justify-content:space-between;gap:36px}
.editorial .home-summary .lede{font-size:18px;max-width:800px;margin:0}
.home-summary .text-link{flex-shrink:0}
@media(max-width:760px){
  body[data-page=home] .site-header{height:76px}
  body[data-page=home] .site-header nav{top:76px}
  .signature-art{height:auto;aspect-ratio:1.85}
  .signature-caption{padding-bottom:28px;gap:16px}
  .editorial .signature-statement{font-size:24px;max-width:270px}
  .editorial .signature-name{font-size:11px}
  .home-summary{display:block;padding:24px 0 20px}
  .editorial .home-summary .lede{font-size:17px}
  .home-summary .text-link{margin-top:10px}
}

/* The angular mark gives the marble its own stage. */
.home-masthead{height:112px;display:flex;align-items:center;justify-content:center;background:#fff}
.home-masthead a{display:block;width:220px;padding:0}
.home-masthead img{width:100%;height:auto}
.home-hero-art{position:relative;isolation:isolate;padding:20px 0 32px;overflow:hidden;background:#fff}
body[data-page=home] .marble-disc{position:relative;top:auto;z-index:0;width:min(560px,76vw,52svh);height:auto;aspect-ratio:1;border-radius:50%;margin:0 auto;overflow:hidden}
.marble-disc canvas{position:absolute;inset:0}
body[data-page=home] .marble-disc{background-color:#c9c7db;background-image:url('/assets/marble-mercurial-v1.webp')}
.home-marquee{position:absolute;inset:50% 0 auto;transform:translateY(-50%);pointer-events:none;overflow:hidden;color:#050505}
.home-marquee-track{display:flex;width:max-content;animation:home-marquee 34s linear infinite}
.home-marquee-track span{display:block;flex-shrink:0;font:400 92px/1.2 Arial,Helvetica,sans-serif;letter-spacing:0;white-space:nowrap}
@keyframes home-marquee{to{transform:translateX(-50%)}}
body[data-page=home] .editorial-intro{background:#fff;color:#000;text-align:center;padding:36px 5% 88px}
body[data-page=home] .name-composition h1{font-size:80px;line-height:1.1}
.intro-connections{display:flex;align-items:center;justify-content:center;gap:.3em}
.intro-connection-arrow{width:.8em;height:.8em;flex:none;color:var(--logo-pink);stroke-width:2.25}
body[data-page=home] .name-composition{padding-bottom:32px}
body[data-page=home] .intro-detail p{max-width:1080px;margin:0 auto;font:36px/1.4 var(--display-font)}
.home-work-band{--circle-cap:28vw;background:linear-gradient(#fff 0 calc(var(--circle-cap) - 1px),var(--surface-pearl) calc(var(--circle-cap) - 1px))}
.home-work-band::before{content:"";display:block;height:var(--circle-cap);background:var(--surface-pearl);clip-path:circle(60vw at 50% 60vw)}
body[data-page=home] #work{padding-bottom:36px}
body[data-page=home] #work>.section-heading{display:block;text-align:center;margin:0 0 88px}
body[data-page=home] #work>.section-heading h2{font-size:80px;line-height:1.1;color:#000;margin:0;text-decoration-line:underline;text-decoration-color:var(--logo-mint);text-decoration-thickness:4px;text-underline-offset:.16em;text-decoration-skip-ink:none}
body[data-page=home] #approach{--point-depth:140px;position:relative;width:100%;padding:calc(var(--point-depth) + 96px) 5%;border:0;background:#000;color:#fff;clip-path:polygon(0 0,100% 0,100% calc(100% - var(--point-depth)),50% 100%,0 calc(100% - var(--point-depth)))}
body[data-page=home] #approach::before{content:"";position:absolute;inset:0 0 auto;height:var(--point-depth);background:#fff;clip-path:polygon(0 0,100% 0,50% 100%);pointer-events:none}
body[data-page=home] #approach,body[data-page=home] #about{grid-template-columns:minmax(0,1fr)}
body[data-page=home] #approach .narrative{width:100%;max-width:1120px;margin-inline:auto}
body[data-page=home] #approach h2{text-align:center;margin-bottom:48px}
body[data-page=home] #approach .principles{gap:48px}
body[data-page=home] #approach>.eyebrow,body[data-page=home] #about>.eyebrow{display:none}
body[data-page=home] #about{border:0;padding-block:136px}
body.editorial footer{--footer-inset:max(5vw,calc((100vw - 1280px)/2));background:#000;color:#fff;padding:100px var(--footer-inset) 0;border-radius:0}
body.editorial footer p{font:48px/1.25 var(--display-font);max-width:780px}
body.editorial footer::after{content:"";display:block;height:clamp(280px,50vw,900px);margin:100px calc(-1 * var(--footer-inset)) 0;background:#fff url('/assets/mgux-angular-pink.svg') center/ min(640px,33%) auto no-repeat;clip-path:circle(60vw at 50% 60vw)}
body[data-page=home] footer{position:relative;padding-top:196px}
body[data-page=home] footer::before{content:"";position:absolute;inset:-1px 0 auto;height:97px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V54C1200 10 1040 6 720 70S240 136 0 76Z' fill='white'/%3E%3C/svg%3E") center/100% 100% no-repeat;pointer-events:none}
@media(min-width:1800px){.home-marquee-track span{font-size:112px}}
@media(max-width:900px){.home-marquee-track span{font-size:64px}}
@media(max-width:1200px){.intro-connections{flex-direction:column;gap:.12em}.intro-connection-arrow{rotate:90deg;width:.55em;height:.55em}}
@media(max-width:760px){
  .home-masthead{height:88px}
  .home-masthead a{width:172px}
  .home-hero-art{padding:12px 0 44px}
  .home-marquee{top:calc(50% - 16px)}
  .home-marquee-track span{font-size:44px}
  body[data-page=home] .editorial-intro{padding:24px 5% 48px}
  body[data-page=home] .name-composition h1{font-size:46px}
  body[data-page=home] .name-composition{padding-bottom:24px}
  body[data-page=home] .intro-detail p{font-size:25px}
  body[data-page=home] #work>.section-heading{margin-bottom:48px}
  body[data-page=home] #work>.section-heading h2{font-size:46px}
  body[data-page=home] #work{padding-bottom:24px}
  body[data-page=home] #approach{--point-depth:64px;padding:calc(var(--point-depth) + 48px) 5%}
  body[data-page=home] #approach h2{margin-bottom:32px}
  body[data-page=home] #approach .principles{gap:28px}
  body[data-page=home] #about{padding-block:80px}
  body.editorial footer{--footer-inset:5vw;padding:72px var(--footer-inset) 0}
  body.editorial footer::after{margin-top:64px;background-size:65% auto}
  body.editorial footer p{font-size:34px}
  body[data-page=home] footer{padding-top:136px}
  body[data-page=home] footer::before{height:65px}
}
@media(prefers-reduced-motion:reduce){.home-marquee-track{animation:none}}

/* Keep chapter labels with their titles instead of in a separate sidebar. */
.case-study .editorial-band{display:block;padding-block:80px}
.case-study .editorial-band>.eyebrow,.case-study .editorial-band>.narrative{width:100%;max-width:960px;margin-inline:auto}
.case-study .eyebrow{font-size:17px;text-transform:none;margin-bottom:18px}
.case-study .editorial-band h2{font-size:54px;line-height:1.15;margin-bottom:28px}
.case-study .case-cover h1{font-size:88px;line-height:1.05;max-width:1200px}
.case-study .case-cover-inner{padding-bottom:48px;gap:40px}
@media(max-width:760px){
  .case-study .editorial-band{padding-block:48px}
  .case-study .eyebrow{font-size:16px;margin-bottom:14px}
  .case-study .editorial-band h2{font-size:36px;line-height:1.2;margin-bottom:24px}
  .case-study .case-cover h1{font-size:48px}
  .case-study .case-cover-inner{padding-bottom:36px;gap:28px}
}
@media(max-width:380px){.case-study .case-cover h1{font-size:42px}.case-study .editorial-band h2{font-size:32px}}

/* A shared masthead and high-contrast opening connect the case studies to home. */
.case-study .marble-banner.marble-compact{position:sticky;top:-202px;height:208px;background:#c9c7db url('/assets/marble-mercurial-v1.webp') center/cover no-repeat;z-index:21}
.case-study .marble-banner canvas{position:absolute;inset:auto 0 0;height:96px}
.case-study .marble-banner .site-header.marble-toolbar{inset:0 0 auto;width:100%;height:112px;background:#fff}
.case-study .marble-logo{left:50%;transform:translateX(-50%);width:220px;padding:0;background:transparent}
.case-study .marble-logo img{filter:none}
.case-study .marble-logo:focus-visible{outline-color:#080808;outline-offset:4px}
.case-study .case-cover{background:#fff;color:#000;text-align:left}
.case-study .case-cover-inner{display:grid;grid-template-columns:minmax(0,1fr) 200px;align-items:start;padding:48px 0 20px;gap:48px;min-height:0}
.case-study .case-cover-top{grid-column:2;grid-row:1;justify-content:flex-start;padding-top:12px}
.case-study .case-cover-title{grid-column:1;grid-row:1}
.case-study .case-year{text-align:left;color:var(--muted)}
.case-study .case-cover h1{margin:0;font-size:76px}
.case-study .case-opening{display:block;width:min(1280px,90%);padding:16px 0 32px;margin:auto;background:#fff;color:var(--ink)}
.case-opening-copy{max-width:900px}
.case-opening-copy p:last-child{margin-bottom:0}
.case-milestone{width:min(1280px,90%);margin:0 auto 56px;padding:32px 0 24px;color:var(--ink)}
.case-milestone .milestone-context{margin:0 0 28px;font-size:14px;color:var(--muted)}
.milestone-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;max-width:960px;margin:0}
.milestone-stats>div{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.milestone-stats dt{font-size:17px;line-height:1.5;margin-top:16px}
.milestone-stats dd{order:-1;margin:0;font:64px/1.08 var(--display-font);font-variant-numeric:lining-nums;white-space:nowrap}
.milestone-stats dd::after{content:"";display:block;width:48px;height:4px;background:var(--logo-mint);margin-top:18px}
.case-milestone .milestone-source{margin:28px 0 0;font-size:13px;line-height:1.6;color:var(--muted)}
.milestone-source a{color:inherit;text-underline-offset:4px}
@media(max-width:760px){
  .case-milestone{padding:24px 0;margin-bottom:36px}
  .milestone-stats{gap:24px}
  .milestone-stats dd{font-size:38px}
  .milestone-stats dt{font-size:15px;margin-top:12px}
  .milestone-stats dd::after{width:36px;height:3px;margin-top:14px}
}
@media(max-width:380px){.milestone-stats{gap:16px}.milestone-stats dd{font-size:32px}}
.case-details{width:min(1280px,90%);margin:0 auto 48px}
.case-details summary{cursor:pointer;min-height:44px;padding:12px 0;font-size:18px;text-decoration:underline;text-decoration-color:var(--logo-mint);text-underline-offset:6px}
.case-details[open] summary{margin-bottom:24px}
.case-details .case-media{width:100%}
.case-details summary:focus-visible{outline:3px solid var(--ink);outline-offset:5px}
.case-goal-state img{max-height:680px}
.case-study .case-opening h2{font-size:38px;line-height:1.2}
.case-study .case-opening .eyebrow,.case-study .case-opening .role-line{color:var(--muted)}
.case-study .sources>.eyebrow{max-width:none}
.case-study .next-story{padding-block:48px 72px;align-items:baseline}
.case-study .next-story>a{font:32px/1.2 var(--display-font);max-width:820px}
@media(max-width:760px){
  .case-study .marble-banner.marble-compact{height:168px;top:-162px}
  .case-study .marble-banner canvas{height:80px}
  .case-study .marble-banner .site-header.marble-toolbar{height:88px}
  .case-study .marble-logo{width:172px}
  .case-study .case-cover-inner{display:flex;flex-direction:column;padding:28px 0 12px;gap:18px}
  .case-study .case-cover-top{padding:0}
  .case-study .case-cover h1{font-size:48px}
  .case-study .case-opening{padding:12px 0 28px}
  .case-study .case-opening h2{font-size:36px}
  .case-study .next-story>a{font-size:28px}
}
@media(max-width:380px){.case-study .case-cover h1{font-size:42px}}

.case-lead-copy p{max-width:780px}
.case-opening:has(.case-facts){grid-template-columns:minmax(0,2fr) minmax(240px,1fr)}
.case-facts{padding-left:32px;}
.editorial .case-facts p{font-size:17px;line-height:1.5}
.case-facts strong{display:block;font:48px/1.1 var(--display-font);color:var(--ink);margin-bottom:10px}
.editorial .case-facts .source-note{font-size:13px}
.case-outcome-gallery{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:40px;align-items:start}
.case-outcome-gallery img{max-height:none;height:auto}
.case-outcome-gallery .passkeys-film-stage{padding:0;background:#fff}
.case-outcome-gallery video{width:min(100%,300px)}
.case-study .chapter-band{--slice:64px;width:100%;padding:calc(80px + var(--slice)) max(5vw,calc((100vw - 1280px)/2));border:0;margin-block:32px 48px}
.case-study .chapter-band--ink{background:#000;color:#fff;--muted:#ccc;--ink:#fff;--line:#555}
.case-study .chapter-band--paper{background:var(--surface-pearl)}
.case-study .chapter-band--slice{clip-path:polygon(0 0,100% var(--slice),100% 100%,0 calc(100% - var(--slice)))}
.case-study .chapter-band--slice+.editorial-band{border-top:0}
.case-study main>.chapter-band--ink:last-child{margin-bottom:0;padding-bottom:64px;clip-path:polygon(0 0,100% var(--slice),100% 100%,0 100%)}
/* Overlap the clipped edge by one pixel to prevent a pale antialiasing line. */
.case-study main:has(>.chapter-band--ink:last-child)+footer{margin-top:-1px;padding-top:65px}
.case-study .chapter-band--serrated{position:relative}
.chapter-band--serrated::before,.chapter-band--serrated::after{content:"";position:absolute;inset:-1px 0 auto;height:28px;pointer-events:none;background:#fff;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 28'%3E%3Cpath d='M0 0H80V1L40 26L0 1Z'/%3E%3C/svg%3E") top left/80px 28px repeat-x}
.chapter-band--serrated::after{inset:auto 0 -1px;transform:rotate(180deg)}
.case-study .chapter-band--serrated:has(+.chapter-band--ink){margin-bottom:0}
.chapter-band--serrated:has(+.chapter-band--ink)::after{background:#000}
.case-study .chapter-band--serrated+.chapter-band--ink{margin-top:0}
.case-study .chapter-band--wave{--wave-height:80px;position:relative;padding-block:96px calc(96px + var(--wave-height))}
.chapter-band--wave::after{content:"";position:absolute;inset:auto 0 -1px;height:var(--wave-height);pointer-events:none;transform:rotate(180deg);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V54C1200 10 1040 6 720 70S240 136 0 76Z' fill='white'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.text-flair{font-style:normal;text-decoration:underline;text-decoration-color:var(--logo-mint);text-decoration-thickness:3px;text-underline-offset:8px;text-decoration-skip-ink:auto}
.case-action{display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:56px;padding:16px 32px;border:1px solid currentColor;border-radius:999px;background:#000;color:#fff;text-decoration:none;font-size:16px;line-height:1.4;font-weight:600}
.case-action:hover{background:var(--ink)}
.case-action .link-arrow{width:20px;height:20px;margin:0;opacity:1}
.chapter-band--ink .case-action{background:#fff;color:#000}
.chapter-band--ink .case-action:hover{background:#dedede}
@media(max-width:760px){
  .case-opening:has(.case-facts){grid-template-columns:1fr}
  .case-facts{padding:24px 0 0;border-left:0;}
  .case-facts strong{font-size:38px}
  .case-outcome-gallery{grid-template-columns:1fr;gap:32px}
  .case-study .chapter-band{--slice:32px;padding:80px 5%;margin-block:24px 32px}
  .case-study .chapter-band--wave{--wave-height:48px;padding-block:64px calc(64px + var(--wave-height))}
  .case-action{padding-inline:24px;max-width:100%}
}

/* Shared diagram palette and solid directional arrowheads. */
.enrollment-cycle-steps .cycle-step{display:block;font-size:13px;line-height:1;margin-bottom:16px}
.journey-node,.case-flow-steps>li,.continuity-root,.continuity-path ol li{border:0;border-radius:8px;color:var(--diagram-ink)}
.journey-google,.case-flow-steps>li:first-child,.continuity-root{background:var(--diagram-ink);color:#fff}
.editorial .journey-google .journey-owner{color:#e4dcfa}
.journey-system,.case-flow-steps>li:nth-child(2),.continuity-path ol li{background:var(--diagram-lilac)}
.journey-outcomes>li:first-child,.case-flow-steps>li:nth-child(3){background:var(--diagram-aqua)}
.journey-outcomes>li:last-child,.continuity-path:last-child ol li{background:var(--diagram-pink)}
.editorial .journey-node .journey-owner{font-size:13px}
.journey-stage:nth-child(2)::before,.journey-outcomes>li::after,.case-flow-steps>li+li::after{width:12px;height:13px;left:-11px;top:calc(50% - 5px);border:0;background:var(--diagram-connector);clip-path:polygon(0 0,100% 50%,0 100%);transform:none}
.continuity-path ol li+li::after{width:13px;height:12px;left:calc(50% - 5px);top:-11px;border:0;background:var(--diagram-connector);clip-path:polygon(0 0,100% 0,50% 100%);transform:none}
.journey-measure{border:0;background:#f0ebfc;padding:28px;border-radius:8px}
.case-system-grid{border:0;padding:0}
.case-system-grid>li{padding:24px;border:0;border-radius:8px;background:var(--diagram-lilac);color:var(--diagram-ink)}
.case-system-grid>li:first-child{background:var(--diagram-ink);color:#fff}
.case-system-grid>li:last-child{background:var(--diagram-aqua)}
.case-system-grid>li a{color:inherit}
/* Both desktop rows read left to right; the inter-row connector wraps 3 to 4. */
.enrollment-cycle-steps{row-gap:48px}
.enrollment-cycle-steps>li:nth-child(4){background:var(--diagram-pink)}
.enrollment-cycle-steps>li:nth-child(5){background:var(--diagram-lilac)}
.enrollment-cycle-steps>li:nth-child(6){background:var(--diagram-aqua)}
@media(min-width:901px){
  .enrollment-cycle-steps{row-gap:64px}
  .enrollment-cycle-steps>li:nth-child(4)::before{left:calc(50% - 1.5px);right:auto;top:-64px;width:calc(200% + 67px);height:64px;border:0;background:var(--diagram-connector);clip-path:polygon(calc(100% - 3px) 0,100% 0,100% calc(50% + 1.5px),3px calc(50% + 1.5px),3px 100%,0 100%,0 calc(50% - 1.5px),calc(100% - 3px) calc(50% - 1.5px))}
  .enrollment-cycle-steps>li:nth-child(4)::after{left:calc(50% - 6.5px);top:-11px;width:13px;height:12px;clip-path:polygon(0 0,100% 0,50% 100%)}
}
@media(max-width:900px){.enrollment-cycle-steps{row-gap:32px}}
/* Equal contributions converge, rather than implying a sequence of handoffs. */
.diagram-contributors{position:relative;padding-bottom:32px;margin-bottom:32px}
.diagram-contributors>li{position:relative}
.diagram-contributors>li:last-child{background:var(--diagram-pink)}
.diagram-contributors>li::after{content:"";position:absolute;left:50%;top:100%;height:32px;border-left:3px solid var(--diagram-connector)}
.diagram-contributors::after{content:"";position:absolute;bottom:0;left:calc((100% - 64px)/6);right:calc((100% - 64px)/6);border-top:3px solid var(--diagram-connector)}
.diagram-merge{position:relative;padding:24px;border-radius:8px;background:var(--diagram-aqua);color:var(--diagram-ink);text-align:center}
.diagram-merge::before{content:"";position:absolute;left:50%;bottom:100%;height:33px;border-left:3px solid var(--diagram-connector)}
.diagram-merge::after{content:"";position:absolute;left:calc(50% - 5px);top:-11px;width:13px;height:12px;background:var(--diagram-connector);clip-path:polygon(0 0,100% 0,50% 100%)}
@media(max-width:1000px){
  .journey-stage:nth-child(2)::before{left:27px;top:-11px;width:13px;height:12px;clip-path:polygon(0 0,100% 0,50% 100%)}
}
@media(max-width:900px){
  .case-flow-steps>li+li::after{left:27px;top:-11px;width:13px;height:12px;clip-path:polygon(0 0,100% 0,50% 100%)}
}
@media(max-width:760px){
  .journey-stage:nth-child(2)::before{left:7px}
  .journey-measure{padding:24px}
  .case-system-grid>li,.case-system-grid>li+li{padding:20px;border:0}
  .diagram-contributors{padding:0 0 0 28px;margin-bottom:32px}
  .diagram-contributors::after{top:0;bottom:-16px;left:0;right:auto;border-top:0;border-left:3px solid var(--diagram-connector)}
  .diagram-contributors>li::after{top:50%;left:auto;right:100%;width:28px;height:0;border-left:0;border-top:3px solid var(--diagram-connector)}
  .diagram-merge::before{left:0;bottom:calc(100% + 16px);width:50%;height:0;border-top:3px solid var(--diagram-connector);border-left:0}
  .diagram-merge::after{top:-16px;height:16px;clip-path:polygon(40% 0,60% 0,60% 45%,100% 45%,50% 100%,0 45%,40% 45%)}
}