@font-face{font-family:HAIT;src:local("Aptos"),local("Aptos Display");font-display:swap}
:root{--ink:#172322;--muted:#52615e;--blue:#0074a6;--cyan:#009fe3;--green:#93e07e;--yellow:#ffd500;--red:#ff4859;--line:#dce2df;--paper:#fff;--font:HAIT,"Trebuchet MS",sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:17px;line-height:1.6}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:3px solid var(--blue);outline-offset:5px}
h1,h2,h3,p{margin:0}
h1,h2,h3{line-height:1.12;font-weight:500}
h1{font-size:76px;font-weight:600}
h2{font-size:34px}
h3{font-size:18px;font-weight:600}
.skip-link{position:absolute;left:16px;top:-80px;background:white;padding:10px;z-index:5}
.skip-link:focus{top:12px}
.site-header{border-bottom:1px solid var(--line)}
.header-inner{width:min(1240px,90%);min-height:88px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:16px;font-size:30px;font-weight:700;line-height:1}
.brand span{border-left:1px solid var(--line);padding-left:16px;font-size:11px;font-weight:400;line-height:1.5}
.brand strong{display:block;font-size:15px;font-weight:600}
.header-inner nav{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px}
.header-inner nav a:hover,.site-footer a:hover{color:var(--blue)}
.hero{width:min(1240px,90%);margin:auto;padding:76px 0 56px}
.eyebrow{text-transform:uppercase;font-size:12px;font-weight:700;line-height:1.5}
.hero h1{max-width:920px;margin:20px 0 24px}
.hero-intro{max-width:760px;font-size:23px;line-height:1.4}
.hero-detail{max-width:760px;margin-top:16px;color:var(--muted);font-size:15px}
.case-index{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 28px;margin-top:42px;padding-top:20px;border-top:1px solid var(--line)}
.case-index a{display:flex;gap:14px;align-items:baseline;font-size:12px;font-weight:700;color:var(--blue)}
.case-index a span{font-size:14px;font-weight:400;color:var(--ink)}
.case-index a:hover span{text-decoration:underline;text-underline-offset:3px}
.case-list{background:#f5f7f5;padding:0 max(5%,calc((100% - 1240px)/2))}
.case{display:grid;grid-template-columns:120px minmax(0,1fr);gap:28px;padding:56px 0;border-top:1px solid var(--line);scroll-margin-top:24px}
.case:first-child{border-top:0}
.case-number{font-size:56px;line-height:1;color:var(--blue)}
.case:nth-child(3n + 2) .case-number{color:#527f43}
.case:nth-child(3n) .case-number{color:#997f00}
.case-content{max-width:900px}
.case-content>.eyebrow{margin-bottom:12px;color:var(--blue);font-size:10px}
.case-content h2{max-width:760px;margin-bottom:20px}
.case-context,.case-application{max-width:800px;color:var(--muted);font-size:15px}
.case-application{margin-top:15px;color:var(--ink)}
.roles{display:grid;grid-template-columns:1fr 1fr;gap:34px;margin-top:26px}
.roles h3{margin-bottom:8px}
.roles p{color:var(--muted);font-size:14px}
.learning{margin-top:24px;padding:16px 18px;border-left:3px solid var(--green);background:#fff;color:var(--muted);font-size:14px}
.learning strong{color:var(--ink);margin-right:8px}
.closing{padding:68px 5%;text-align:center;background:#e8f5f0}
.closing h2{margin:16px auto}
.closing>p:not(.eyebrow){max-width:610px;margin:0 auto;color:var(--muted);font-size:15px}
.closing-links{display:flex;justify-content:center;align-items:center;gap:32px;flex-wrap:wrap;margin-top:26px}
.text-link{display:inline-flex;align-items:center;gap:14px;padding-bottom:5px;border-bottom:1px solid var(--ink);font-size:14px;font-weight:600}
.text-link span{font-size:20px}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:34px;min-height:52px;padding:13px 22px;background:var(--ink);color:white;font-size:14px}
.button:hover{background:var(--blue)}
.button span{font-size:22px;line-height:1}
.site-footer{display:flex;justify-content:space-between;gap:24px;padding:26px 5%;font-size:11px;color:var(--muted)}
@media(max-width:800px){h1{font-size:62px}.case{grid-template-columns:84px minmax(0,1fr);gap:20px}.case-number{font-size:48px}.case-index{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.header-inner{width:88%;min-height:74px;align-items:flex-start;flex-direction:column;justify-content:center;gap:9px;padding:12px 0}.brand{font-size:26px;gap:12px}.brand span{padding-left:12px;font-size:10px}.brand strong{font-size:13px}.header-inner nav{font-size:11px}.hero{width:88%;padding:52px 0 38px}h1{font-size:46px}.hero-intro{font-size:20px}.hero-detail{font-size:14px}.case-index{grid-template-columns:1fr;gap:11px;margin-top:30px}.case-list{padding:0 6%}.case{grid-template-columns:1fr;gap:12px;padding:38px 0}.case-number{font-size:40px}.case-content h2{font-size:28px}.roles{grid-template-columns:1fr;gap:18px;margin-top:22px}.closing{padding:52px 6%}.closing h2{font-size:32px}.closing-links{gap:22px;flex-direction:column}.site-footer{padding:22px 6%;flex-direction:column;gap:8px}}
@media(max-width:360px){h1{font-size:39px}.case-content h2{font-size:25px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}