:root{--teal:#52b7c1;--ink:#161616;--paper:#fff;--grey:#f3f1ee;--line:#d9d9d9;--orange:#ff6a00;--link:#b34700}
@media(prefers-color-scheme:dark){:root{--ink:#f2f2f2;--paper:#121212;--grey:#1d1d1d;--line:#333;--link:#ff8a3d}}
*{box-sizing:border-box}html{scroll-padding-top:4rem}
body{margin:0;font:1.0625rem/1.65 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:var(--paper)}
a{color:var(--link)}a:focus-visible,button:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
img{max-width:100%;height:auto;display:block}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:#fff;color:#000;padding:.5rem;z-index:9}
.wrap{max-width:68rem;margin:0 auto;padding:0 1.25rem}
header.site{background:var(--teal);border-bottom:5px solid var(--orange)}
header.site .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem 2rem;padding-top:.9rem;padding-bottom:.9rem}
.brand{color:#000;font-weight:800;font-size:1.25rem;text-decoration:none}
nav a{color:#000;text-decoration:none;margin-left:1.5rem;font-weight:600;padding:.25rem 0;border-bottom:3px solid transparent}
nav a:hover,nav a[aria-current]{border-color:var(--orange)}
.hero{background:var(--teal);color:#000;padding:4rem 0 4.5rem}
.hero h1{font-size:clamp(2.6rem,8vw,5.5rem);line-height:1;margin:0 0 1.25rem;font-weight:900;letter-spacing:-.03em}
.hero p{margin:0;font-size:clamp(1.15rem,2.5vw,1.6rem);max-width:30rem;padding-left:1rem;border-left:8px solid var(--orange)}
main{padding:3rem 0 4rem}h2.sec{font-size:1.9rem;margin:0 0 1.5rem}
.grid{display:grid;gap:1.75rem;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr))}
.card{background:var(--grey);border-top:5px solid var(--orange);border-radius:0 0 6px 6px;overflow:hidden;display:flex;flex-direction:column}
.card img{width:100%;aspect-ratio:4/3;object-fit:cover}.card .t{padding:1.25rem;display:flex;flex-direction:column;gap:.6rem;flex:1}
.card h3{margin:0;font-size:1.3rem;line-height:1.25}.card h3 a{color:inherit;text-decoration:none}.card h3 a:hover{text-decoration:underline}
.card p{margin:0}.more{margin-top:auto;font-weight:700}
.btn{display:inline-block;background:var(--orange);color:#000;font-weight:700;padding:.75rem 1.4rem;border:0;border-radius:4px;font:inherit;font-weight:700;cursor:pointer;text-decoration:none}
.btn:hover{background:#ff8533}
article{max-width:44rem}article h1{font-size:clamp(2rem,5vw,3rem);line-height:1.1;margin:0 0 1.5rem}
article img{margin:1.5rem 0;border-radius:6px}.back{display:inline-block;margin-bottom:1.5rem;font-weight:600}
.video{position:relative;aspect-ratio:16/9;background:#000;color:#fff;display:flex;flex-direction:column;gap:.75rem;align-items:center;justify-content:center;text-align:center;padding:1rem;margin:1.5rem 0;border-radius:6px}
.video p{margin:0;font-size:.9rem;max-width:30rem}.video a{color:#ffb27a}.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:6px}
footer.site{background:var(--teal);color:#000;padding:1.75rem 0;border-top:5px solid var(--orange)}footer.site a{color:#000;margin-right:1.25rem}
.todo{background:#fff3e8;color:#000;border-left:6px solid var(--orange);padding:.75rem 1rem}
@media(prefers-reduced-motion:no-preference){.card{transition:transform .15s}.card:hover{transform:translateY(-3px)}}
.pt{font-size:clamp(2.2rem,6vw,3.5rem);margin:0 0 2rem}
.timeline{list-style:none;margin:0 0 0 .6rem;padding:0;border-left:4px solid var(--orange)}
.timeline li{position:relative;padding:0 0 3rem 2rem;display:grid;gap:1.25rem}
.timeline li::before{content:"";position:absolute;left:-.95rem;top:.35rem;width:1.1rem;height:1.1rem;border-radius:50%;background:var(--orange);border:3px solid var(--paper)}
.timeline h2{margin:0 0 .5rem;font-size:1.6rem;line-height:1.2}.timeline p{margin:0 0 .75rem}
.yr{display:inline-block;background:var(--teal);color:#000;font-weight:800;padding:.1rem .7rem;border-radius:4px;margin-bottom:.5rem}
.timeline img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px}
@media(min-width:48rem){.timeline li{grid-template-columns:1fr 17rem;align-items:start}}
.facts{background:var(--grey);border-left:6px solid var(--orange);padding:.75rem 1.25rem;margin:1.5rem 0}.facts p{margin:.35rem 0}article h2{margin:2rem 0 .75rem}
.brand{display:flex;align-items:center;gap:1rem}.brand .logo{height:2.1rem;width:auto}.brand span{padding-left:1rem;border-left:2px solid #000;line-height:1.2}
.date{opacity:.75;margin:-.75rem 0 1.5rem}
.yt{margin:-.75rem 0 1.5rem;font-size:.95rem}
.scan{border:1px solid var(--line);margin:1rem 0}
article figure{margin:1.5rem 0}article figure img{margin:0 0 .5rem}figcaption{font-size:.95rem;opacity:.8}