:root{--ink:#173a56;--ink-soft:#476070;--paper:#fffdf8;--cream:#f8f5ee;--blue:#dcecf7;--gold:#ffd363;--red:#ad3e3b;--line:#ece3d6;--shadow:0 10px 28px rgba(61,47,28,.08)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.5 "Segoe UI",Arial,sans-serif}
button,a{font:inherit}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #1879b8;outline-offset:3px}
.skip-link{position:absolute;left:14px;top:-50px;z-index:100;background:#fff;padding:9px 14px;border-radius:10px}
.skip-link:focus{top:10px}
.container{width:min(1360px,calc(100% - 48px));margin-inline:auto}
.site-header{height:72px;background:#fffcf5ed;border-bottom:1px solid #ede7da;position:relative;z-index:40}
.header-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:28px}
.site-name{font-size:clamp(1.13rem,1.8vw,1.7rem);font-weight:800;letter-spacing:-.035em;white-space:nowrap}
.site-name span{font-weight:750}
.site-nav{display:flex;align-items:center;gap:clamp(22px,3vw,48px)}
.site-nav a,.footer-inner nav a{font-size:.97rem;font-weight:600;transition:color .18s}
.site-nav a:hover,.footer-inner nav a:hover{color:var(--red)}
.menu-toggle{display:none;align-items:center;justify-content:center;flex-direction:column;gap:5px;width:44px;height:44px;border:0;border-radius:10px;background:transparent}
.menu-toggle span{width:24px;height:3px;border-radius:3px;background:var(--ink);transition:transform .2s,opacity .2s}
.menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(8px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-8px) rotate(-45deg)}
.hero{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(180deg,#fffaf0 0%,#f7f0e4 77%,#efe1ca 100%);border-bottom:1px solid #eaddc8}
.hero:before{content:"";position:absolute;inset:auto 0 0;height:25px;background:repeating-linear-gradient(0deg,rgba(143,94,39,.035) 0 1px,transparent 1px 5px);pointer-events:none}
.hero-inner{min-height:425px;display:grid;grid-template-columns:.88fr 1.12fr;gap:clamp(30px,4vw,70px);align-items:center;position:relative;z-index:2;padding-block:34px 32px}
.hero-copy{padding-left:clamp(0px,7vw,110px)}
.eyebrow{display:block;color:#986e33;text-transform:uppercase;letter-spacing:.13em;font-size:.76rem;font-weight:850;margin-bottom:9px}
.hero h1{font-size:clamp(3.1rem,5vw,5.5rem);line-height:1.04;letter-spacing:-.058em;margin:0 0 17px;font-weight:850}
.hero h1 em{color:var(--red);font-style:normal}
.hero-copy p{font-size:clamp(1rem,1.45vw,1.21rem);max-width:33ch;color:#344d60;margin:0 0 24px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:22px;min-height:53px;padding:12px 23px;border-radius:11px;font-weight:800;transition:transform .18s,box-shadow .18s}
.button:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(189,135,27,.18)}
.button--primary{background:var(--gold);color:#153650}
.button span{font-size:1.45rem;line-height:1}
.tablet-wrap{padding-bottom:16px}
.tablet{display:grid;grid-template-columns:42% 58%;height:316px;overflow:hidden;background:#fffaf2;border:13px solid #fffaf2;border-radius:25px;box-shadow:0 14px 32px rgba(71,50,28,.14),0 0 0 1px #e8d9c6}
.tablet-info{display:flex;flex-direction:column;align-items:flex-start;padding:20px 10px 18px 19px}
.pill{display:inline-block;width:max-content;padding:5px 11px;border-radius:9px;font-size:.72rem;line-height:1.25;font-weight:800}
.pill--gold{background:#ffedbd;color:#8e6112}.pill--blue{background:#e1f0fb;color:#2a6185}.pill--red{background:#fbe0dc;color:#98433b}
.tablet-info h2{font-size:clamp(1.4rem,2.15vw,2.25rem);line-height:1.14;margin:17px 0 12px;letter-spacing:-.04em}
.tablet-info p{color:var(--ink-soft);font-size:.91rem;line-height:1.42;margin:0 0 auto}
.text-button{padding:9px 11px;border:0;border-radius:9px;background:#f7e5c6;color:var(--ink);font-size:.85rem;font-weight:800}
.text-button:hover{background:#ffdb98}
.text-button span{margin-left:8px;font-size:1.2rem}
.sky-art{position:relative;overflow:hidden;border-radius:14px;background:#09213e}.sky-art svg{width:100%;height:100%;display:block}
.tablet-stand{width:39%;height:14px;margin:-2px auto 0;background:linear-gradient(#ccad7b,#a37745);border-radius:3px 3px 11px 11px;box-shadow:0 5px 8px #9a7d5e55}
.slider-dots{display:flex;justify-content:center;gap:7px;margin:13px}.slider-dots span{width:7px;height:7px;border-radius:100%;background:#d8ccbd}.slider-dots .active{background:#278fc8}
.hero-decor{position:absolute;z-index:1;pointer-events:none}
.hero-decor--left{left:max(-18px,calc((100vw - 1580px)/2));top:0;width:195px;height:100%}
.hero-decor--right{right:max(-10px,calc((100vw - 1580px)/2));top:0;width:145px;height:100%}
.plant{position:absolute;left:-30px;top:-38px;width:150px;height:140px;filter:blur(.5px)}
.plant:before{content:"";position:absolute;left:65px;top:30px;width:5px;height:135px;background:#53754a;transform:rotate(-17deg);border-radius:5px}
.plant i{position:absolute;width:60px;height:31px;border-radius:90% 10% 90% 10%;background:linear-gradient(135deg,#8da774,#3c6547);transform-origin:right center;box-shadow:0 4px 8px #1f46282b}
.plant i:nth-child(1){left:22px;top:8px;transform:rotate(20deg)}.plant i:nth-child(2){left:64px;top:23px;transform:rotate(135deg)}.plant i:nth-child(3){left:5px;top:50px;transform:rotate(-20deg)}.plant i:nth-child(4){left:77px;top:75px;transform:rotate(150deg)}.plant i:nth-child(5){left:13px;top:93px;transform:rotate(12deg)}
.pencil-cup{position:absolute;left:33px;bottom:63px;width:62px;height:76px;background:linear-gradient(90deg,#b78348,#e5bf7e,#a97338);border-radius:5px 5px 12px 12px;box-shadow:0 7px 11px #5e3d2052}
.pencil-cup b{position:absolute;bottom:64px;width:7px;height:52px;background:#386693;border-radius:2px;transform-origin:bottom}.pencil-cup b:before{content:"";position:absolute;top:-9px;left:0;border-left:3.5px solid transparent;border-right:3.5px solid transparent;border-bottom:9px solid #e5b66b}.pencil-cup b:nth-child(1){left:13px;transform:rotate(-12deg)}.pencil-cup b:nth-child(2){left:25px;height:65px;background:#e0a73e;transform:rotate(3deg)}.pencil-cup b:nth-child(3){left:38px;background:#b75048;transform:rotate(15deg)}.pencil-cup b:nth-child(4){left:48px;height:46px;background:#547b57;transform:rotate(23deg)}
.block{position:absolute;bottom:28px;box-shadow:0 5px 10px #734a2644}.block--square{left:23px;width:46px;height:42px;background:#bd6a42;border-radius:4px}.block--square:after{content:"";display:block;width:21px;height:21px;border:3px solid #ead2a7;margin:8px auto;transform:rotate(45deg)}.block--triangle{left:88px;width:0;height:0;border-left:27px solid transparent;border-right:27px solid transparent;border-bottom:45px solid #d7ab6d}
.books{position:absolute;right:5px;bottom:64px;display:grid;gap:8px;transform:rotate(-2deg)}.books i{display:block;width:135px;height:23px;border-radius:4px;background:#49718d;box-shadow:0 5px 8px #54616d35}.books i:nth-child(2){background:#e5bd80;width:117px}.books i:nth-child(3){background:#6a8796;width:130px}
.wood-ball{position:absolute;right:45px;bottom:21px;width:45px;height:45px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#efd4a4,#bd8652);box-shadow:0 6px 9px #6d492b55}
.content-section{padding-block:42px 12px;scroll-margin-top:18px}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:19px}.section-heading .eyebrow{margin-bottom:1px}.section-heading h2{font-size:clamp(1.75rem,2.6vw,2.4rem);letter-spacing:-.045em;line-height:1.1;margin:0}.section-note{color:#667b89;font-size:.88rem;text-align:right}
.card-grid{display:grid;gap:16px}.card-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}
.content-card,.project-card{appearance:none;display:flex;text-align:left;width:100%;border:1px solid #eee6dc;background:var(--paper);border-radius:17px;box-shadow:var(--shadow);padding:11px;min-height:183px;color:var(--ink);transition:transform .18s,box-shadow .18s}
.content-card:hover,.project-card:hover{transform:translateY(-3px);box-shadow:0 15px 34px rgba(61,47,28,.14)}
.thumb{position:relative;flex:0 0 35%;min-width:105px;overflow:hidden;border-radius:11px;background:#d9ecf7}
.card-copy,.project-copy{display:flex;flex-direction:column;align-items:flex-start;gap:7px;min-width:0;padding:6px 9px 4px 13px}
.card-copy strong,.project-copy strong{font-size:1.07rem;line-height:1.2;letter-spacing:-.02em}.card-copy small,.project-copy small{color:#546a77;font-size:.85rem;line-height:1.36}.card-meta{font-size:.72rem;color:#6b7880;margin-top:auto;border-top:1px solid #eee6db;padding-top:7px;width:100%}
.thumb--algorithm{background:linear-gradient(145deg,#dff3ff,#b8d9f0)}.flow{position:absolute;border-radius:7px;box-shadow:0 4px 0 #00000012}.flow.a{width:52px;height:24px;left:calc(50% - 26px);top:19%;background:#ffd15b}.flow.b{width:38px;height:38px;left:calc(50% - 19px);top:46%;transform:rotate(45deg);background:#4d95d0}.flow.c{width:54px;height:25px;left:calc(50% - 27px);bottom:10%;background:#db6b5b}.flow-line{position:absolute;left:50%;top:31%;height:56%;width:3px;background:#2d6895;z-index:0}.flow{z-index:1}
.thumb--story{background:linear-gradient(#a3d7ef 0 55%,#d6edc6 55%)}.story-sun{position:absolute;right:20%;top:17%;width:31px;height:31px;border-radius:50%;background:#ffdc7a}.story-hill{position:absolute;left:-12%;bottom:-24%;width:120%;height:75%;border-radius:55% 45% 0 0;background:#83b483}.story-choice{position:absolute;left:11%;bottom:14%;padding:5px 10px;border-radius:8px;background:#fff8e8;color:#236184;font-weight:850;font-size:.85rem;box-shadow:0 3px 7px #2b4d3d33}
.thumb--data{display:flex;align-items:flex-end;justify-content:center;gap:8px;padding:22px;background:linear-gradient(#fff3c9,#e3edf6)}.bar{width:17%;border-radius:5px 5px 0 0;background:#4593c5;box-shadow:inset 0 -5px #1d74ad2b}.bar.b1{height:32%}.bar.b2{height:60%}.bar.b3{height:44%}.bar.b4{height:78%;background:#f8b85a}.chart-line{position:absolute;inset:auto 17px 18px;border-bottom:2px solid #8ca5b7}
.practice-section{background:linear-gradient(180deg,#f2eee6,#f8f5ee);margin-top:32px;padding-block:40px 50px;border-block:1px solid #e9dfd0}
.project-card{min-height:200px}.project-thumb{position:relative;flex:0 0 37%;overflow:hidden;border-radius:10px;background:#0c2945}.project-copy{padding-left:15px}.project-copy .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto}.tags i{font-style:normal;background:#f8ecdc;border-radius:7px;padding:4px 7px;font-size:.71rem;color:#5c655e}
.project-thumb--maze{background:repeating-linear-gradient(90deg,#173d62 0 7px,#112e4c 7px 15px)}.maze-path{position:absolute;inset:15px 24px;border:8px solid #8ac9ed;border-right:0;box-shadow:inset 0 0 0 8px #0f2d49}.maze-path:after{content:"";position:absolute;left:38%;top:22%;width:65%;height:45%;border:7px solid #8ac9ed;border-left:0;border-bottom:0}.maze-dot{position:absolute;width:18px;height:18px;left:19%;bottom:17%;border-radius:50%;background:#ffd568;box-shadow:0 0 14px #ffd568a6}.maze-goal{position:absolute;right:16%;top:15%;color:#fa9d80;font-size:1.5rem}
.project-thumb--solar{background:radial-gradient(circle at 40% 50%,#234b6c,#091d38 75%)}.sun{position:absolute;left:24%;top:38%;width:44px;height:44px;border-radius:50%;background:#ffcc59;box-shadow:0 0 28px #f9b733}.orbit{position:absolute;left:42%;top:50%;border:1px solid #b9cad177;border-radius:50%;transform:translate(-50%,-50%) rotate(-22deg)}.orbit.o1{width:110px;height:68px}.orbit.o2{width:170px;height:105px}.orbit.o3{width:215px;height:148px}.orbit i{position:absolute;top:5px;right:17px;width:15px;height:15px;border-radius:50%;background:#79bee6}.orbit.o2 i{background:#eab77f}.orbit.o3 i{background:#b5a1d7}
.project-thumb--stars{background:radial-gradient(circle at 30% 20%,#1d537f,#081e37)}.project-thumb--stars svg{width:100%;height:100%}
.reference-section{margin-top:38px;padding-block:44px 62px;background:#eef4f6;border-top:1px solid #dce6e8}.reference-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.reference-grid details{background:#fffdf9;border:1px solid #e3e9e8;border-radius:13px;padding:15px 16px;box-shadow:0 5px 12px #1d52600d}.reference-grid summary{cursor:pointer;font-weight:800;list-style:none}.reference-grid summary::-webkit-details-marker{display:none}.reference-grid summary:after{content:"+";float:right;color:#3d8bbe;font-size:1.25rem;line-height:1}.reference-grid details[open] summary:after{content:"−"}.reference-grid p{font-size:.85rem;color:#4f6370;margin:11px 0 0}
.site-footer{background:#dcebf4;color:#254961;position:relative}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:86px;padding-block:18px 24px}.footer-inner strong{font-size:.95rem}.footer-inner nav{display:flex;gap:18px;flex-wrap:wrap}.publication-note{font-size:.72rem;max-width:190px}.publication-note summary{cursor:pointer}.publication-note p{position:absolute;right:20px;bottom:100%;max-width:290px;padding:12px;border-radius:10px;background:#fff;box-shadow:var(--shadow);z-index:3}.wave{height:12px;background:radial-gradient(circle at 12px -2px,transparent 13px,#b13d3d 14px,#b13d3d 18px,transparent 19px) 0 0/32px 22px repeat-x,linear-gradient(#b13d3d,#b13d3d)}
.detail-dialog{width:min(680px,calc(100% - 28px));max-height:min(88vh,900px);border:1px solid #eadfce;border-radius:22px;padding:30px;background:#fffdf7;color:var(--ink);box-shadow:0 25px 90px #132d4270}.detail-dialog::backdrop{background:#071d31a8;backdrop-filter:blur(3px)}.dialog-close{position:absolute;right:15px;top:10px;border:0;background:transparent;color:var(--ink);font-size:2rem}.dialog-content h2{font-size:2rem;margin:7px 0 12px;line-height:1.1}.dialog-content p{color:#476073}.dialog-content ol,.dialog-content ul{padding-left:22px}.dialog-content li{margin:8px 0}.dialog-content .button{margin-top:12px}.dialog-content .pill{margin-top:3px}
@media(max-width:1160px){.hero-decor{opacity:.45}.hero-copy{padding-left:0}.hero-inner{gap:30px}.tablet{grid-template-columns:45% 55%}.tablet-info h2{font-size:1.7rem}.tablet-info p{font-size:.82rem}.content-card,.project-card{flex-direction:column}.thumb,.project-thumb{min-height:135px;flex-basis:auto}.project-card{min-height:0}.card-copy,.project-copy{padding:10px 6px 6px}}
@media(max-width:760px){.container{width:min(100% - 32px,560px)}.site-header{height:66px}.site-name{font-size:1.17rem}.menu-toggle{display:flex}.site-nav{display:none;position:absolute;top:65px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:#fffdf8;padding:10px 20px 20px;box-shadow:0 18px 25px #1c34402e;border-bottom:1px solid #e3d9cb}.site-nav.is-open{display:flex}.site-nav a{padding:14px 8px;border-bottom:1px solid #eee6da;font-size:1.12rem}.hero-inner{grid-template-columns:1fr;gap:25px;padding-block:40px 24px}.hero-copy{text-align:center}.hero h1{font-size:clamp(2.8rem,9vw,4.4rem)}.hero-copy p{margin-inline:auto}.hero-decor{opacity:.3}.hero-decor--left{left:-40px}.hero-decor--right{right:-70px}.tablet-wrap{padding:0 0 12px}.tablet{height:300px}.tablet-info{padding:15px 5px 13px 10px}.tablet-info h2{font-size:1.45rem;margin:14px 0 8px}.tablet-info p{font-size:.78rem}.text-button{font-size:.76rem}.section-heading{align-items:start}.section-note{max-width:150px}.card-grid--three,.reference-grid{grid-template-columns:1fr}.content-card,.project-card{flex-direction:row;min-height:160px}.thumb,.project-thumb{flex:0 0 35%;min-width:0;min-height:0}.content-section{padding-top:38px}.reference-grid{gap:9px}.footer-inner{flex-direction:column;align-items:flex-start;padding-block:22px 25px}.publication-note{max-width:none}}
@media(max-width:520px){.hero-inner{padding-top:34px}.hero-copy .eyebrow{font-size:.66rem}.hero h1{font-size:clamp(2.55rem,11vw,3.45rem)}.hero-copy p{font-size:1rem}.tablet{grid-template-columns:1fr;height:auto;padding:0;border-width:9px}.tablet-info{padding:18px}.tablet-info h2{font-size:1.5rem;margin:12px 0 8px}.tablet-info p{margin-bottom:14px}.sky-art{height:205px}.tablet-stand{height:10px}.hero-decor--left .pencil-cup,.hero-decor--left .block,.hero-decor--right .books,.hero-decor--right .wood-ball{display:none}.section-heading{gap:8px}.section-note{font-size:.75rem;max-width:120px}.content-card,.project-card{min-height:140px}.thumb,.project-thumb{flex-basis:33%}.card-copy,.project-copy{padding:2px 4px 2px 10px;gap:5px}.card-copy strong,.project-copy strong{font-size:.98rem}.card-copy small,.project-copy small{font-size:.77rem}.card-meta{font-size:.66rem}.pill{font-size:.66rem}.tags i{font-size:.64rem}.detail-dialog{padding:26px 18px}.footer-inner nav{gap:9px 16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}