:root{--yellow:#ffc400;--black:#050505;--white:#f6f6f2;--muted:#9b9b96}*{box-sizing:border-box}html{scroll-behavior:smooth}html,body{margin:0;background:var(--black);color:var(--white);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}em{font-style:normal;color:var(--yellow)}.topbar{position:fixed;z-index:50;top:0;left:0;right:0;height:72px;display:flex;align-items:center;padding:0 4vw;background:rgba(5,5,5,.82);backdrop-filter:blur(10px);border-bottom:1px solid #252525}.brand{font-weight:900;letter-spacing:.08em;font-size:18px;margin-right:auto}.brand b{color:var(--yellow);margin-left:.42em}.topbar nav{display:flex;gap:24px;font-size:12px;text-transform:uppercase;letter-spacing:.12em}.topbar nav a:hover{color:var(--yellow)}.lang{margin-left:26px;border:1px solid #555;background:none;color:white;padding:8px 10px;cursor:pointer}.hero{height:100vh;min-height:650px;position:relative;display:flex;align-items:flex-end;background:#000}.hero video{position:absolute;top:72px;right:0;bottom:0;left:3vw;width:calc(100% - 3vw);height:calc(100% - 72px);object-fit:contain;background:#000}.heroShade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.78),transparent 60%)}.heroCopy{z-index:2;padding:0 4vw 7vh;max-width:700px}.eyebrow,.sectionHead>span,.system>span,.about span,.newsTitle>span{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#b8b8b2}.hero h1,.statement h2,.sectionHead h2,.system h2,.closing h2,.newsTitle h1{font-size:clamp(54px,8vw,130px);line-height:.84;margin:18px 0;font-weight:900;letter-spacing:-.055em}.hero p{max-width:470px;font-size:18px;line-height:1.5}.sound{position:absolute;z-index:4;right:4vw;bottom:5vh;border:1px solid #777;background:rgba(0,0,0,.6);color:white;padding:12px 16px;letter-spacing:.12em;cursor:pointer}.statement,.system,.closing{padding:12vh 4vw;min-height:70vh;display:flex;flex-direction:column;justify-content:center}.statement h2{font-size:clamp(44px,6.8vw,105px)}.newsTeaser{display:grid;grid-template-columns:.8fr 1.2fr;gap:5vw;padding:10vh 4vw;background:var(--yellow);color:#050505;align-items:center}.newsTeaser h2{font-size:clamp(42px,6vw,90px);line-height:.9;margin:14px 0}.newsTeaser h2 em{color:white}.newsTeaser p{font-size:18px;line-height:1.55;max-width:520px}.newsTeaser video,.bookCard video,.filmCard video,.newsArticle video{width:100%;display:block;background:#000;object-fit:contain}.arrow{font-weight:800;font-size:12px;letter-spacing:.12em}.section,.filmSection{padding:12vh 4vw}.sectionHead{max-width:1000px;margin-bottom:55px}.sectionHead h2{font-size:clamp(44px,6vw,92px)}.sectionHead p{font-size:18px;max-width:650px;line-height:1.5}.bookGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.bookCard,.filmCard{background:#111;border:1px solid #242424}.bookCard video{aspect-ratio:16/9}.slot{aspect-ratio:16/9;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px dashed #555;color:#777;gap:8px}.slot small{font-size:10px}.meta{padding:18px;display:flex;gap:8px;flex-direction:column}.meta b{letter-spacing:.06em}.meta span,.meta small{color:#aaa;font-size:13px}.filmGrid{display:grid;grid-template-columns:1fr 1fr;gap:32px}.filmCard video{aspect-ratio:16/9;max-height:calc(100vh - 120px)}.system{background:var(--white);color:#080808}.system p{font-size:20px;line-height:1.5;max-width:650px}.about{padding:12vh 4vw;display:grid;grid-template-columns:1.2fr .8fr;gap:10vw;border-top:1px solid #292929}.about h2{font-size:clamp(40px,5vw,75px);margin:15px 0}.about p{font-size:18px;line-height:1.65}.closing{text-align:center;align-items:center}.closing p{letter-spacing:.12em}.closing p em{margin-left:.35em}footer{padding:30px 4vw;border-top:1px solid #292929;display:flex;justify-content:space-between;font-size:11px;color:#888}.newsPage{padding:150px 4vw 10vh}.newsTitle{padding:5vh 0 10vh}.newsTitle h1{font-size:clamp(54px,7vw,110px)}.newsArticle{display:grid;grid-template-columns:.75fr 1.25fr;gap:6vw;align-items:start}.newsCopy h2{font-size:42px;margin:15px 0}.newsCopy h3{font-size:25px;color:var(--yellow)}.newsCopy p{font-size:18px;line-height:1.65}.credits{border-top:1px solid #333;border-bottom:1px solid #333;padding:18px 0;margin:28px 0;font-size:13px;line-height:1.7}.newsCopy strong{color:var(--yellow)}
@media(max-width:800px){.topbar nav{display:none}.topbar{height:60px}.hero video{top:60px;right:0;bottom:0;left:0;width:100%;height:calc(100% - 60px)}.hero{min-height:620px}.heroShade{background:linear-gradient(0deg,rgba(0,0,0,.85),transparent 65%)}.heroCopy{padding-bottom:9vh}.newsTeaser,.about,.newsArticle{grid-template-columns:1fr}.newsTeaser video{grid-row:1}.bookGrid,.filmGrid{grid-template-columns:1fr}.statement,.system,.closing{min-height:55vh}.sound{bottom:2vh}.newsPage{padding-top:100px}footer{gap:15px;flex-direction:column}}@media (max-width: 600px) {
  .statement h2 {
    font-size: clamp(32px, 8.2vw, 42px);
    max-width: calc(100vw - 70px);
  }
}


/* V5 - responsive and bilingual alignment pass */
.hero{min-height:100svh}
.heroCopy .eyebrow{min-height:1.4em;display:block}
.statement>span,.sectionHead>span,.system>span,.about span{display:block;min-height:1.4em;line-height:1.4}
.statement h2,.sectionHead h2,.system h2,.about h2,.about h3,.closing h2{transform:none;position:relative;left:0}
.bilingualHeadline{min-height:1.75em}
.meta b{min-height:1.2em}
.meta span{display:block;min-height:2.4em;line-height:1.35}
.about>div{display:flex;flex-direction:column;align-items:flex-start}
.about .aboutClaim{font-size:clamp(46px,5.8vw,92px);line-height:.88;margin:18px 0 22px;letter-spacing:-.055em}
.about h3{font-size:clamp(22px,2.2vw,34px);line-height:1.05;margin:0;font-weight:700;max-width:650px}

/* Wide desktop: preserve full 16:9 frame, with a safe offset from the website typography. */
@media(min-width:1200px){
  .hero video{left:clamp(34px,3vw,64px);width:calc(100% - clamp(34px,3vw,64px));object-position:center center}
  .heroCopy{max-width:min(700px,42vw)}
}
/* Tablet: keep the whole movie visible and reduce typography before it can collide. */
@media(min-width:801px) and (max-width:1199px){
  .topbar{padding-left:3vw;padding-right:3vw}.topbar nav{gap:15px}.lang{margin-left:16px}
  .hero video{left:2.5vw;width:97.5%;object-fit:contain;object-position:center center}
  .heroCopy{padding-left:3vw;max-width:48vw}
  .hero h1{font-size:clamp(50px,8.2vw,90px)}
  .hero p{font-size:16px;max-width:390px}
  .section,.filmSection,.statement,.system,.about,.closing,.newsTeaser{padding-left:3vw;padding-right:3vw}
}
/* Phones: film and copy occupy separate visual zones; no crop and no type collision. */
@media(max-width:800px){
  .hero{height:auto;min-height:100svh;display:block;padding-top:60px;padding-bottom:28px}
  .hero video{position:relative;top:auto;right:auto;bottom:auto;left:auto;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;object-position:center center;background:#000}
  .heroShade{top:60px;background:linear-gradient(0deg,rgba(0,0,0,.98) 0%,rgba(0,0,0,.92) 34%,rgba(0,0,0,.12) 65%,transparent 78%);pointer-events:none}
  .heroCopy{position:relative;z-index:2;padding:24px 5vw 76px;max-width:none}
  .heroCopy .eyebrow{min-height:2.8em}
  .hero h1{font-size:clamp(48px,17vw,78px);margin-top:12px}
  .hero p{font-size:16px;max-width:34em}
  .sound{position:absolute;right:5vw;bottom:24px}
  .statement,.system,.closing{padding-top:10vh;padding-bottom:10vh}
  .section,.filmSection,.about,.newsTeaser{padding-left:5vw;padding-right:5vw}
  .sectionHead{margin-bottom:34px}
  .bilingualHeadline{min-height:0}
  .about .aboutClaim{font-size:clamp(48px,14vw,76px)}
  .about h3{font-size:24px}
}
@media(max-width:520px){
  .brand{font-size:16px}.lang{margin-left:0}.topbar{padding:0 5vw}
  .heroCopy{padding-left:5vw;padding-right:5vw}
  .hero h1{letter-spacing:-.06em}
  .newsTeaser h2,.sectionHead h2,.statement h2,.system h2,.closing h2,.newsTitle h1{overflow-wrap:normal;word-break:normal}
  footer{padding-left:5vw;padding-right:5vw}
}

/* V9 - dedicated phone portrait + landscape composition */
@media (max-width: 600px) and (orientation: portrait){
  .topbar{height:52px;padding:0 5vw}
  .brand{font-size:14px;letter-spacing:.07em}
  .lang{font-size:11px;padding:6px 8px}
  .hero{padding-top:52px;padding-bottom:18px;min-height:auto}
  .hero video{width:100%;aspect-ratio:16/9}
  .heroShade{top:52px;background:linear-gradient(0deg,rgba(0,0,0,.96) 0%,rgba(0,0,0,.74) 28%,rgba(0,0,0,.05) 58%,transparent 72%)}
  .heroCopy{padding:14px 5vw 58px}
  .heroCopy .eyebrow{min-height:1.4em;margin:0}
  .hero h1{font-size:clamp(45px,15.5vw,68px);line-height:.86;margin:9px 0 12px}
  .hero p{font-size:14px;line-height:1.42;margin:0;max-width:30em}
  .sound{right:5vw;bottom:14px;padding:9px 12px;font-size:10px}
  .statement,.system,.closing{min-height:auto;padding-top:72px;padding-bottom:72px}
  .statement h2,.sectionHead h2,.system h2,.closing h2,.newsTitle h1{font-size:clamp(40px,13vw,62px);line-height:.9}
}

/* A phone in landscape is its own format: wide but very shallow. */
@media (orientation: landscape) and (max-height: 520px) and (max-width: 1000px){
  .topbar{height:44px;padding:0 3vw}
  .brand{font-size:13px;letter-spacing:.07em}
  .topbar nav{display:none}
  .lang{margin-left:0;padding:5px 8px;font-size:10px}
  .hero{height:auto;min-height:100svh;padding:44px 0 0;display:grid;grid-template-columns:minmax(0,56%) minmax(0,44%);align-items:center}
  .hero video{position:relative;top:auto;left:auto;right:auto;bottom:auto;width:100%;height:auto;max-height:calc(100svh - 44px);aspect-ratio:16/9;object-fit:contain;object-position:center;background:#000}
  .heroShade{display:none}
  .heroCopy{position:relative;padding:14px 3vw 52px;max-width:none;align-self:center}
  .heroCopy .eyebrow{min-height:1.2em;font-size:9px}
  .hero h1{font-size:clamp(36px,7vw,62px);line-height:.84;margin:8px 0 10px}
  .hero p{font-size:12px;line-height:1.35;margin:0;max-width:32em}
  .sound{right:3vw;bottom:12px;padding:7px 10px;font-size:9px}
  .statement,.system,.closing{min-height:auto;padding:54px 4vw}
  .section,.filmSection,.about,.newsTeaser{padding:54px 4vw}
  .statement h2,.sectionHead h2,.system h2,.closing h2,.newsTitle h1{font-size:clamp(38px,7.2vw,68px);line-height:.9;margin-top:12px;margin-bottom:14px}
  .newsTeaser h2{font-size:clamp(36px,6.5vw,60px);line-height:.9}
  .sectionHead{margin-bottom:28px}
  .sectionHead p,.newsTeaser p,.about p,.system p{font-size:14px;line-height:1.45}
  .bookGrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .filmGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .meta{padding:12px}.meta span{min-height:0}.meta b{font-size:12px}.meta span,.meta small{font-size:11px}
  .about{grid-template-columns:1fr 1fr;gap:6vw}
  .about .aboutClaim{font-size:clamp(38px,7vw,64px)}
  .about h3{font-size:20px}
  .closing p{font-size:10px}
  footer{padding:18px 4vw;flex-direction:row}
}

/* Final responsive/contact pass */
.contactClosing{padding:12vh 4vw;min-height:72vh;display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center;border-top:1px solid #292929}
.contactLeft>span{display:block;font-size:11px;letter-spacing:.18em;color:#b8b8b2;margin-bottom:20px}
.contactLeft h2{font-size:clamp(54px,7vw,110px);line-height:.86;margin:0;font-weight:900;letter-spacing:-.055em}
.contactRight{align-self:center}.contactRight p{font-size:18px;line-height:1.55;max-width:540px;margin:0 0 34px}
.contactMail{display:inline-flex;align-items:baseline;gap:.28em;color:var(--yellow);font-size:clamp(25px,3.1vw,52px);font-weight:800;letter-spacing:-.035em;border-bottom:1px solid transparent;transition:opacity .18s ease,border-color .18s ease}
.contactMail span{font-size:.55em}.contactMail:hover{opacity:.78;border-color:var(--yellow)}

/* Tablet 801-1199: use the available screen without desktop-sized empty fields. */
@media(min-width:801px) and (max-width:1199px){
  .topbar{height:64px}.brand{font-size:16px}.topbar nav{gap:13px;font-size:11px;letter-spacing:.1em}.lang{margin-left:14px;padding:7px 9px}
  .hero{height:auto;min-height:76svh;padding-top:64px;display:grid;grid-template-columns:minmax(0,56%) minmax(0,44%);align-items:center}
  .hero video{position:relative;top:auto;left:auto;right:auto;bottom:auto;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;object-position:center;background:#000}
  .heroShade{display:none}.heroCopy{position:relative;padding:6vh 3vw;max-width:none;align-self:center}.hero h1{font-size:clamp(48px,7vw,78px)}.hero p{font-size:15px}.sound{right:3vw;bottom:4vh}
  .statement,.system,.closing{min-height:52vh;padding-top:8vh;padding-bottom:8vh}
  .section,.filmSection{padding-top:9vh;padding-bottom:9vh}.sectionHead{margin-bottom:38px}
  .statement h2{font-size:clamp(46px,6.4vw,78px);max-width:100%}.sectionHead h2,.system h2{font-size:clamp(46px,6vw,74px)}
  .bilingualHeadline{font-size:clamp(44px,5.8vw,70px)!important;max-width:100%;overflow-wrap:normal}
  .about{padding-top:8vh;padding-bottom:8vh;gap:7vw}.about .aboutClaim{font-size:clamp(42px,5vw,64px)}.about p{font-size:16px;line-height:1.55}
  .bookMove{min-height:52vh}
  .contactClosing{min-height:58vh;padding:9vh 3vw;gap:6vw}.contactLeft h2{font-size:clamp(50px,6.2vw,72px)}.contactRight p{font-size:16px}.contactMail{font-size:clamp(24px,2.8vw,34px)}
}
@media(max-width:800px){
  .contactClosing{min-height:auto;padding:76px 5vw;grid-template-columns:1fr;gap:48px}.contactLeft h2{font-size:clamp(48px,14vw,76px)}.contactRight p{font-size:16px;margin-bottom:24px}.contactMail{font-size:clamp(22px,6.6vw,34px);overflow-wrap:anywhere}
  .bookMove{padding-top:72px;padding-bottom:72px}
}
@media(max-width:600px) and (orientation:portrait){
  .statement h2,.bilingualHeadline{font-size:clamp(36px,11.2vw,54px)!important;line-height:.91;letter-spacing:-.045em}
  .statement,.system{padding-top:62px;padding-bottom:62px}.section,.filmSection,.about,.newsTeaser{padding-top:68px;padding-bottom:68px}
  .about{gap:36px}.about .aboutClaim{font-size:clamp(42px,12vw,62px)}
}

/* Final wide-screen proportion pass */
@media(min-width:1600px){
  .hero{min-height:760px;height:min(100vh,980px)}
  .heroCopy{padding-bottom:6vh}
  .statement,.system,.closing{min-height:58vh;padding-top:9vh;padding-bottom:9vh}
  .section,.filmSection{padding-top:9vh;padding-bottom:9vh}
  .about{padding-top:9vh;padding-bottom:9vh;gap:8vw}
  .bookMove{min-height:58vh}
  .contactClosing{min-height:62vh;padding-top:9vh;padding-bottom:9vh}
}