:root{--cream:#FBF4E6;--paper:#FFFDF7;--ink:#4A3B32;--soft:#7A6A5E;--blue:#6FB7E0;--green:#7FA65A;--pink:#F29BB8;--lav:#A893D1;--sun:#F6C445}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--ink);font:17px/1.6 "Trebuchet MS","Avenir Next",system-ui,sans-serif}
img{max-width:100%;height:auto;display:block}
a{color:#2F6E9B}
header{background:var(--paper);border-bottom:3px dashed #E6D6BA}
.bar{max-width:1040px;margin:0 auto;padding:.6rem 1rem;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;justify-content:space-between}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink);font-weight:700;font-size:1.15rem}
.brand img{width:48px;height:48px;border-radius:50%}
nav{display:flex;flex-wrap:wrap;gap:.4rem}
nav a{text-decoration:none;color:var(--ink);padding:.35rem .8rem;border-radius:999px;background:#F3E9D2;font-size:.95rem}
nav a[aria-current]{background:var(--sun)}
main{max-width:1040px;margin:0 auto;padding:1.2rem 1rem 2.5rem}
h1,h2,h3{line-height:1.25;font-family:"Comic Sans MS","Chalkboard SE","Trebuchet MS",sans-serif}
h1{font-size:clamp(1.7rem,6vw,2.6rem);margin:.3em 0}
.card{background:var(--paper);border:2px dashed #E6D6BA;border-radius:22px;padding:1.2rem;box-shadow:0 4px 0 #EADBC0;margin:1.2rem 0}
.hero{text-align:center}.hero .logo{width:min(220px,60vw);margin:0 auto}
.lead{font-size:1.1rem;color:var(--soft);max-width:42em;margin:0 auto}
.video{position:relative;display:block;border-radius:18px;overflow:hidden;border:4px solid #fff;box-shadow:0 4px 0 #EADBC0}
.video .play{position:absolute;inset:0;margin:auto;width:84px;height:84px;border-radius:50%;background:rgba(255,253,247,.92);display:grid;place-items:center;font-size:2rem;color:#E4572E}
.btn{display:inline-block;padding:.6rem 1.1rem;border-radius:999px;background:var(--sun);color:var(--ink);text-decoration:none;font-weight:700;margin:.3rem}
.btn.alt{background:#F3E9D2}
.note{font-size:.9rem;color:var(--soft)}
.crew{display:grid;gap:1.1rem;grid-template-columns:1fr}
@media(min-width:700px){.crew{grid-template-columns:1fr 1fr}.split{display:grid;grid-template-columns:1.2fr 1fr;gap:1.5rem;align-items:center}}
.crew .card{margin:0;border-top:10px solid var(--c)}
.crew img{border-radius:16px;background:#fff;margin-bottom:.6rem}
.sound{display:inline-block;background:var(--c);color:#fff;font-weight:700;padding:.15rem .7rem;border-radius:999px}
ul.ticks{padding-left:1.2rem}
footer{text-align:center;padding:1.5rem 1rem;color:var(--soft);font-size:.9rem;border-top:3px dashed #E6D6BA;background:var(--paper)}
footer a{margin:0 .4rem}
.crew img{width:100%;aspect-ratio:4/3;object-fit:cover}
.intro{color:var(--soft);font-size:1.1rem;max-width:46em}
.c-dewbert{--c:#3F8FC4}.c-sweepkin{--c:#5E8A3C}.c-hoopsy{--c:#C9577F}.c-boxley{--c:#7A62B0}
.crew{margin-top:1.2rem}.crew img{object-fit:contain;background:#F6EEDD}
.bar nav.main{flex-basis:100%}
@media(min-width:1080px){.bar nav.main{flex-basis:auto;order:2}.bar nav.lang{order:3}}
nav.lang{gap:.25rem}nav.lang a{font-size:.85rem;padding:.25rem .6rem;font-weight:700;background:#fff;border:2px solid #F3E9D2}
nav.lang a[aria-current]{background:var(--sun);border-color:var(--sun)}
ul.shorts{list-style:none;padding:0;margin:0;display:grid;gap:1rem;grid-template-columns:repeat(2,1fr)}
@media(min-width:800px){ul.shorts{grid-template-columns:repeat(4,1fr)}}
ul.shorts h3{font-size:1rem;margin:.5rem 0 0}ul.shorts .note{margin:.2rem 0}
.video.short .play{width:60px;height:60px;font-size:1.5rem}
.center{text-align:center}
@media(min-width:1080px){.bar{flex-wrap:nowrap}.brand{white-space:nowrap}.bar nav.main{margin-left:auto;flex-wrap:nowrap}.bar nav.main a{white-space:nowrap}.bar nav.lang{flex-wrap:nowrap;margin-left:.6rem}}
/* page ends at footer on mobile: no empty area below */
html{background:var(--paper);overscroll-behavior-y:none}
body{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;overscroll-behavior-y:none}
body>footer{margin-top:auto}
