*{box-sizing:border-box}
:root{--cambridge:#85c7c9;--cambridge-dark:#2f7378;--ink:#1f2933;--muted:#5c6670;--paper:#fff;--warm:#f7f5ef;--line:#e3ded2}
html{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper);line-height:1.55}
.topbar{background:var(--cambridge);border-bottom:1px solid rgba(0,0,0,.08);display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.75rem clamp(1rem,4vw,3rem)}
.brand{color:var(--ink);text-decoration:none;font-weight:900}
nav{display:flex;gap:.9rem;flex-wrap:wrap;justify-content:flex-end}
nav a{color:var(--ink);text-decoration:none;font-weight:800;font-size:.95rem}
.hero{min-height:66vh;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(220px,.55fr);gap:2rem;align-items:center;padding:clamp(2.5rem,7vw,6rem) clamp(1rem,5vw,5rem);background:linear-gradient(180deg,#fff 0%,var(--warm) 100%)}
.hero-text{max-width:860px}
.eyebrow{margin:0 0 .5rem;color:var(--cambridge-dark);text-transform:uppercase;letter-spacing:.14em;font-size:.78rem;font-weight:900}
h1{margin:.2rem 0 1rem;font-size:clamp(2.8rem,7vw,5.8rem);line-height:.95;letter-spacing:-.04em}
h2{margin:.2rem 0 .8rem;font-size:clamp(1.8rem,4vw,3.1rem);line-height:1.05}
h3{margin:.2rem 0 .8rem;font-size:clamp(1.5rem,3vw,2.2rem);line-height:1.1}
.lead{max-width:720px;font-size:1.16rem;color:#34404a}
.buttons{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.4rem}
.button{display:inline-block;border:1px solid var(--ink);border-radius:999px;padding:.82rem 1.08rem;background:#fff;color:var(--ink);text-decoration:none;font:inherit;font-weight:900;cursor:pointer}
.button.primary{background:var(--ink);color:#fff}
.hero-card{background:#fff;border:1px solid var(--line);border-radius:28px;padding:1rem;box-shadow:0 18px 45px rgba(31,41,51,.12)}
.hero-card img{display:block;width:100%;border-radius:20px}
.section{max-width:1200px;margin:0 auto;padding:4rem clamp(1rem,4vw,3rem)}
.section.pale{max-width:none;background:var(--warm)}
.section.pale>*{max-width:1200px;margin-left:auto;margin-right:auto}
.section-head{max-width:780px;margin-bottom:2rem}
.section-head p{color:var(--muted)}
.reader-shell{background:#fff;border:1px solid var(--line);border-radius:26px;box-shadow:0 18px 50px rgba(31,41,51,.08);padding:1rem}
.reader-intro{min-height:430px;display:grid;place-items:center;text-align:center;border:2px dashed #d7d1c5;border-radius:20px;background:linear-gradient(180deg,#fff,var(--warm));padding:2rem}
.hidden{display:none!important}
.reader-controls{display:flex;justify-content:center;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.reader-controls button{border:0;border-radius:999px;background:var(--cambridge);color:var(--ink);padding:.7rem 1rem;font-weight:900;cursor:pointer}
#pageStatus{font-weight:900;color:var(--muted)}
.book-container{width:100%;height:min(78vh,780px);min-height:420px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.reader-message{min-height:1.5rem;text-align:center;font-weight:800;color:#8a6428}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:1rem}
.gallery-item{margin:0;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 10px 24px rgba(31,41,51,.06)}
.gallery-item img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.gallery-item figcaption{padding:.72rem .8rem;font-size:.9rem;font-weight:900}
.video-list{display:grid;gap:1rem}
.video-card{overflow:hidden;border:1px solid var(--line);border-radius:18px;background:#fff}
.video-toggle{width:100%;border:0;background:#fff;padding:1rem;text-align:left;font:inherit;font-weight:900;cursor:pointer}
.video-card.open .video-toggle{background:var(--cambridge)}
.video-frame{display:none;padding:0 1rem 1rem}
.video-card.open .video-frame{display:block}
.video-frame iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:12px}
.split{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr);gap:2rem}
.card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:1.25rem;box-shadow:0 10px 24px rgba(31,41,51,.06)}
footer{background:var(--ink);color:#fff;text-align:center;padding:2.2rem 1rem}
footer a{color:#fff;font-weight:900}.studio{letter-spacing:.06em}
code{background:#f1eee7;border-radius:.25rem;padding:.1rem .25rem}
@media(max-width:760px){.topbar{align-items:flex-start;flex-direction:column}.hero{grid-template-columns:1fr;min-height:auto}.hero-card{display:none}.book-container{height:66vh;min-height:360px}.split{grid-template-columns:1fr}}