@font-face{font-family:"Commissioner";src:url(/assets/fonts/commissioner-greek.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}
@font-face{font-family:"Commissioner";src:url(/assets/fonts/commissioner-latin.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Archivo";src:url(/assets/fonts/archivo-latin-wdth.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap}
:root{
  --navy:#0D2240;--ink:#08142a;--marble:#f1eee7;--gold:#cdb88e;--gold-l:#e9d9ad;--muted:#b4bccb;--line:rgba(205,184,142,.3);
  --sans:"Commissioner",system-ui,-apple-system,"Segoe UI",sans-serif;--wide:"Archivo","Commissioner",sans-serif;
  --pad:clamp(20px,4vw,56px);--ease:cubic-bezier(.22,.61,.36,1);--fh:100vh;--veil:0;--hero:1
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--navy);color:var(--marble);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
a{color:inherit}
button{font:inherit;color:inherit}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:12px;top:-60px;z-index:50;background:var(--marble);color:var(--ink);padding:10px 16px;border-radius:2px;text-decoration:none;transition:top .2s}
.skip:focus{top:12px}
:focus-visible{outline:2px solid var(--gold-l);outline-offset:3px}

/* film */
.film{position:fixed;left:0;top:0;width:100%;height:100vh;height:100lvh;z-index:0;background:var(--navy);overflow:hidden}
.reel{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;background:var(--navy);display:block}
.shade{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity 1.2s var(--ease);background:
  linear-gradient(180deg,rgba(8,20,42,.5) 0,rgba(8,20,42,0) 20%),
  linear-gradient(0deg,rgba(8,20,42,.62) 0,rgba(8,20,42,0) 40%)}
.film.lit .shade{opacity:1}
.veil{position:absolute;inset:0;pointer-events:none;background:var(--ink);opacity:var(--veil)}

/* header */
.top{position:fixed;inset:0 0 auto 0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px var(--pad);transition:background .5s,backdrop-filter .5s}
.top.solid{background:rgba(8,20,42,.55)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;opacity:0;transition:opacity .9s var(--ease)}
.top.show .brand{opacity:1}
.brand-mark{width:22px;height:23px;flex:none}
.brand-word{font-family:var(--wide);font-stretch:125%;font-weight:500;font-size:12px;letter-spacing:.34em}
.nav{display:flex;gap:30px}
.nav a{font-size:12.5px;letter-spacing:.08em;text-decoration:none;color:#dfe4ec;opacity:.85;transition:opacity .25s}
.nav a:hover{opacity:1}
.top-r{display:flex;align-items:center;gap:18px}
.lang{background:none;border:0;padding:6px 2px;cursor:pointer;font-family:var(--wide);font-stretch:112%;font-size:10.5px;letter-spacing:.18em}
.pill{font-size:12px;letter-spacing:.08em;text-decoration:none;border:1px solid rgba(241,238,231,.5);border-radius:999px;padding:8px 18px;transition:background .25s,color .25s,border-color .25s}
.pill:hover{background:var(--marble);color:var(--ink);border-color:var(--marble)}

main{position:relative;z-index:10}

/* hero */
.hero{position:relative;height:100vh;height:100svh;min-height:520px}
.ident{position:absolute;left:0;right:0;top:calc(50vh + var(--fh)*.104 + clamp(16px,3vh,34px));top:calc(50lvh + var(--fh)*.104 + clamp(16px,3vh,34px));text-align:center;opacity:0;transform:translateY(6px);transition:opacity .45s var(--ease),transform .6s var(--ease);pointer-events:none}
.ident.on{opacity:1;transform:none;transition:opacity .6s var(--ease),transform .8s var(--ease)}
.ident-word{font-family:var(--wide);font-stretch:125%;font-weight:500;font-size:clamp(14px,1.45vw,20px);letter-spacing:.42em;padding-left:.42em;margin:0 0 10px}
.ident-tag{font-family:var(--wide);font-stretch:118%;font-size:clamp(9px,.8vw,11px);letter-spacing:.32em;text-transform:uppercase;color:var(--gold);margin:0}
.caps{position:absolute;inset:0;pointer-events:none;opacity:var(--hero)}
.cap{position:absolute;left:var(--pad);bottom:clamp(96px,14vh,150px);max-width:min(52vw,860px);opacity:0;transform:translateY(12px);transition:opacity .6s var(--ease),transform .8s var(--ease)}
.cap.on{opacity:1;transform:none}
.cap h2{font-weight:300;font-size:clamp(34px,4.4vw,72px);line-height:1.08;letter-spacing:-.012em;margin:0;text-shadow:0 2px 30px rgba(8,20,42,.45)}
.cap p{margin:14px 0 0;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#e3e7ee;text-shadow:0 1px 12px rgba(8,20,42,.6)}
.cap.place p{display:flex;align-items:center;gap:16px;margin:0 0 14px;font-family:var(--wide);font-stretch:118%;font-size:11px;letter-spacing:.32em;color:var(--gold-l)}
.cap.place p::before{content:"";width:46px;height:1px;background:currentColor;flex:none}
.cap.place h2{font-weight:200;font-size:clamp(38px,5.4vw,92px);letter-spacing:.14em;text-transform:uppercase;line-height:1}
.hud{position:absolute;left:var(--pad);bottom:clamp(28px,5vh,44px);display:flex;align-items:center;gap:14px;opacity:calc(var(--hero)*var(--hud,0));transition:opacity .6s}
.play{width:30px;height:30px;border-radius:50%;border:1px solid rgba(241,238,231,.45);background:rgba(8,20,42,.25);display:grid;place-content:center;cursor:pointer;padding:0}
.play svg{width:12px;height:12px;fill:var(--marble)}
.play .ic-play{display:none}
.play[aria-pressed="false"] .ic-play{display:block}
.play[aria-pressed="false"] .ic-pause{display:none}
.prog{width:clamp(90px,10vw,150px);height:1px;background:rgba(241,238,231,.25);display:block;overflow:hidden}
.prog i{display:block;height:100%;background:var(--gold-l);transform-origin:0 50%;transform:scaleX(0)}
.cue{position:absolute;right:var(--pad);bottom:clamp(28px,5vh,44px);display:flex;align-items:center;gap:12px;text-decoration:none;font-family:var(--wide);font-stretch:118%;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:#dfe4ec;opacity:calc(var(--hero)*var(--hud,0));transition:opacity .6s}
.cue i{width:1px;height:34px;background:linear-gradient(var(--gold-l),transparent);animation:cue 2.2s var(--ease) infinite;transform-origin:50% 0}
@keyframes cue{0%{transform:scaleY(0)}55%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}

/* sections over the film */
.sec{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;padding:clamp(90px,14vh,150px) var(--pad)}
.sec.right{justify-content:flex-end}
.sec.center{justify-content:center}
.glass{width:min(100%,560px);padding:clamp(26px,3.4vw,48px);background:rgba(8,20,42,.78);border:1px solid var(--line);border-radius:3px;box-shadow:0 30px 80px rgba(3,9,20,.45)}
.glass.wide{width:min(100%,1040px)}
.glass.form-card{width:min(100%,680px);text-align:center}
@media (min-width:900px) and (hover:hover){.glass{background:rgba(8,20,42,.62);-webkit-backdrop-filter:blur(16px) saturate(1.1);backdrop-filter:blur(16px) saturate(1.1)}}
.rv{opacity:0;transform:translateY(34px);transition:opacity 1s var(--ease),transform 1.2s var(--ease)}
.rv.in{opacity:1;transform:none}
.lbl{font-family:var(--wide);font-stretch:118%;font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--gold);margin:0 0 20px}
.disp{font-weight:300;font-size:clamp(30px,3.6vw,54px);line-height:1.12;letter-spacing:-.012em;margin:0}
.disp.sm{font-size:clamp(26px,2.6vw,38px)}
.disp em{font-style:normal;color:var(--gold-l)}
.body{margin:18px 0 0;color:#d5dbe6;font-size:15.5px}
.pl{list-style:none;margin:clamp(28px,4vh,44px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,44px)}
.pl li{border-top:1px solid var(--line);padding-top:18px}
.pl b{display:block;font-family:var(--wide);font-stretch:118%;font-weight:400;font-size:11px;letter-spacing:.3em;color:var(--gold)}
.pl h3{font-weight:300;font-size:clamp(20px,1.7vw,25px);margin:12px 0 8px}
.pl p{margin:0;font-size:14.5px;color:#cfd6e2}
.sig{display:flex;flex-direction:column;gap:4px;margin:30px 0 0;font-weight:300;font-size:21px}
.sig small{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.inv-mark{width:40px;height:42px;margin:0 auto 22px;display:block}

/* form */
.form{margin-top:30px;text-align:start}
.hp{position:absolute;width:1px;height:1px;margin:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.fld{display:block;margin:0 0 20px}
.fld span{display:block;font-family:var(--wide);font-stretch:112%;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:#aeb7c8;margin-bottom:4px}
.fld input,.fld select,.fld textarea{width:100%;background:transparent;border:0;border-bottom:1px solid rgba(241,238,231,.35);border-radius:0;color:var(--marble);font:inherit;font-size:16px;padding:8px 0;outline-offset:4px;transition:border-color .25s}
.fld select{appearance:none;-webkit-appearance:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23cdb88e'/%3E%3C/svg%3E") no-repeat right 2px center/9px}
.fld select option{background:var(--ink);color:var(--marble)}
.fld textarea{resize:vertical;min-height:70px}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--gold-l)}
.fld.err input,.fld.err select{border-color:#ff9c8a}
.fld em{display:block;font-style:normal;font-size:12.5px;color:#ffb3a5;margin-top:6px}
.chk{display:flex;gap:12px;align-items:flex-start;font-size:13px;color:#cfd6e2;margin:4px 0 24px;cursor:pointer}
.chk input{width:17px;height:17px;margin:2px 0 0;accent-color:var(--gold);flex:none}
.chk.err span{color:#ffb3a5}
.btn{display:block;width:100%;border:1px solid var(--gold-l);background:linear-gradient(135deg,#b39b68,#e9d9ad 45%,#b9a16d 70%,#eadcb6);color:#0b1a33;font-family:var(--wide);font-stretch:112%;font-weight:500;font-size:11.5px;letter-spacing:.26em;text-transform:uppercase;padding:17px 22px;border-radius:2px;cursor:pointer;transition:filter .25s,transform .25s}
.btn:hover{filter:brightness(1.07)}
.btn:active{transform:translateY(1px)}
.btn[disabled]{opacity:.6;cursor:default}
.f-msg{min-height:22px;margin:16px 0 0;font-size:14px;text-align:center;color:#ffb3a5}
.f-msg.ok{color:var(--gold-l)}

.foot{position:relative;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 30px;padding:26px var(--pad) 34px;font-size:12px;letter-spacing:.06em;color:#aeb7c8;background:linear-gradient(0deg,rgba(8,20,42,.9),rgba(8,20,42,0))}
.foot p{margin:0}
.foot a{text-underline-offset:4px}

@media (max-width:900px){.nav{display:none}.pl{grid-template-columns:1fr;gap:18px}}
@media (max-width:760px){
  .top{padding:14px var(--pad)}
  .brand-word{font-size:10.5px;letter-spacing:.28em}
  .pill{padding:7px 14px;font-size:11.5px}
  .top-r{gap:10px}
  .hero{height:100svh}
  .cap{max-width:calc(100vw - 2*var(--pad));bottom:clamp(104px,15vh,140px)}
  .cap h2{font-size:clamp(28px,8.2vw,40px)}
  .cap p{font-size:11px}
  .cap.place h2{font-size:clamp(26px,8vw,40px);letter-spacing:.08em}
  .cue span{display:none}
  /* sections become bottom sheets: the film stays visible above them */
  .sec{min-height:100svh;padding:0 12px calc(14px + env(safe-area-inset-bottom));align-items:flex-end;justify-content:center}
  .glass,.glass.wide,.glass.form-card{width:100%;padding:22px 18px 20px;border-radius:14px;background:linear-gradient(180deg,rgba(8,20,42,.58),rgba(8,20,42,.86) 42%);box-shadow:0 -10px 50px rgba(3,9,20,.35)}
  .glass.form-card{text-align:start}
  .inv-mark{display:none}
  .lbl{margin-bottom:12px;font-size:10px}
  .disp{font-size:clamp(25px,7.2vw,32px)}
  .disp.sm{font-size:clamp(22px,6.2vw,27px)}
  .body{font-size:14.5px;margin-top:12px}
  .pl{display:flex;gap:12px;margin:20px -18px 0 0;padding:0 18px 4px 0;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .pl::-webkit-scrollbar{display:none}
  .pl li{flex:0 0 76%;scroll-snap-align:start;padding-top:14px}
  .pl h3{font-size:19px;margin:8px 0 6px}
  .pl p{font-size:13.5px}
  .sig{margin-top:18px;font-size:19px}
  .form{margin-top:18px}
  .f-row{grid-template-columns:1fr;gap:0}
  .fld{margin-bottom:13px}
  .fld input,.fld select,.fld textarea{padding:6px 0}
  .fld textarea{min-height:46px}
  .chk{margin:2px 0 16px;font-size:12.5px}
  .btn{padding:15px 18px}
  .f-msg{margin-top:10px;min-height:18px}
  .foot{flex-direction:column;padding-bottom:calc(26px + env(safe-area-inset-bottom))}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.rv{transition:none;opacity:1;transform:none}.cue i{animation:none}}

/* ---------- more languages: fonts load only when their script is on screen ---------- */
@font-face{font-family:"Commissioner";src:url(/assets/fonts/commissioner-cyrillic.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Heebo";src:url(/assets/fonts/heebo-hebrew.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0590-05FF,U+20AA,U+FB1D-FB4F}
@font-face{font-family:"Tajawal";src:url(/assets/fonts/tajawal-arabic-200.woff2) format("woff2");font-weight:200;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:"Tajawal";src:url(/assets/fonts/tajawal-arabic-300.woff2) format("woff2");font-weight:300;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:"Tajawal";src:url(/assets/fonts/tajawal-arabic-400.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:"Tajawal";src:url(/assets/fonts/tajawal-arabic-500.woff2) format("woff2");font-weight:500 900;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:"EP Han";src:url(/assets/fonts/notosanssc-ep.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+3000-303F,U+4E00-9FFF,U+FF00-FFEF}
:root{--sans:"Commissioner","Heebo","Tajawal","EP Han",system-ui,-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;--wide:"Archivo","Commissioner","Heebo","Tajawal","EP Han","PingFang SC","Microsoft YaHei",sans-serif}

/* language menu */
.lang-w{position:relative}
.lang{display:flex;align-items:center;gap:7px;color:var(--marble)}
.lang svg{width:8px;height:5px;fill:none;stroke:currentColor;stroke-width:1.4;opacity:.7;transition:transform .25s var(--ease)}
.lang[aria-expanded="true"] svg{transform:rotate(180deg)}
.lang-m{position:absolute;top:calc(100% + 10px);right:-8px;z-index:30;min-width:172px;margin:0;padding:6px;list-style:none;background:rgba(8,20,42,.95);border:1px solid var(--line);border-radius:4px;box-shadow:0 20px 50px rgba(3,9,20,.5)}
.lang-m[hidden]{display:none}
.lang-m button{display:flex;width:100%;align-items:center;justify-content:space-between;gap:18px;background:none;border:0;border-radius:2px;padding:9px 12px;cursor:pointer;font-size:14px;line-height:1.3;color:#dfe4ec;text-align:start;transition:background .2s}
.lang-m button:hover,.lang-m button:focus-visible{background:rgba(241,238,231,.08)}
.lang-m small{font-family:var(--wide);font-stretch:112%;font-size:9.5px;letter-spacing:.18em;color:#8f9bb3}
.lang-m .on{color:var(--gold-l)}
.lang-m .on small{color:var(--gold)}

/* right-to-left (Hebrew, Arabic) */
html[dir="rtl"] .skip{left:auto;right:12px}
html[dir="rtl"] .cap{left:auto;right:var(--pad)}
html[dir="rtl"] .hud{left:auto;right:var(--pad)}
html[dir="rtl"] .prog i{transform-origin:100% 50%}
html[dir="rtl"] .cue{right:auto;left:var(--pad)}
html[dir="rtl"] .lang-m{right:auto;left:-8px}
html[dir="rtl"] .fld select{background-position:left 2px center}
html[dir="rtl"] .fld input[type="email"],html[dir="rtl"] .fld input[type="tel"]{direction:ltr;text-align:right}

/* per-script type: small spaced capitals do not exist outside Latin, Greek and Cyrillic */
html:not([lang="el"]):not([lang="en"]) .cap h2,html:not([lang="el"]):not([lang="en"]) .disp{text-wrap:balance}
html[lang="ru"] .cap h2{font-size:clamp(32px,4vw,64px)}
html[lang="ru"] .cap.place h2{font-size:clamp(34px,5vw,84px);letter-spacing:.12em}
html[lang="he"] .ident-tag,html[lang|="zh"] .ident-tag{font-size:clamp(11px,.9vw,13px)}
html[lang="he"] .lbl,html[lang="he"] .cap.place p,html[lang="he"] .fld span,html[lang="he"] .sig small,html[lang="he"] .cue,html[lang="he"] .btn{font-size:13px;letter-spacing:.12em}
html[lang="he"] .cap p{font-size:14px;letter-spacing:.08em}
html[lang="he"] .cap h2,html[lang="he"] .disp{line-height:1.18;letter-spacing:0}
html[lang="he"] .cap.place h2{letter-spacing:.06em}
html[lang|="zh"] .lbl,html[lang|="zh"] .cap.place p,html[lang|="zh"] .fld span,html[lang|="zh"] .sig small,html[lang|="zh"] .cue,html[lang|="zh"] .btn{font-size:12.5px;letter-spacing:.22em}
html[lang|="zh"] .cap p{font-size:14px;letter-spacing:.16em}
html[lang|="zh"] .cap h2{line-height:1.24;letter-spacing:.04em}
html[lang|="zh"] .cap.place h2{font-weight:300;letter-spacing:.2em}
html[lang|="zh"] .disp{line-height:1.32;letter-spacing:.03em}
html[lang|="zh"] .cap h2,html[lang|="zh"] .disp{word-break:keep-all}
html[lang|="zh"] .disp.sm em{display:block}
html[lang|="zh"] .nav a,html[lang|="zh"] .pill{font-size:13px}
html[lang="ar"] body{line-height:1.8}
html[lang="ar"] [data-i],html[lang="ar"] .cap h2,html[lang="ar"] .cap p,html[lang="ar"] .pl h3,html[lang="ar"] .pl p,html[lang="ar"] .fld em,html[lang="ar"] .f-msg{letter-spacing:0!important}
html[lang="ar"] .ident-tag{font-size:clamp(13px,1.05vw,15px)}
html[lang="ar"] .lbl,html[lang="ar"] .cap.place p,html[lang="ar"] .fld span,html[lang="ar"] .sig small,html[lang="ar"] .cue,html[lang="ar"] .btn{font-size:14px}
html[lang="ar"] .btn{font-size:15px;font-weight:500}
html[lang="ar"] .cap p{font-size:15px}
html[lang="ar"] .nav a,html[lang="ar"] .pill{font-size:14px}
html[lang="ar"] .cap h2{line-height:1.35}
html[lang="ar"] .cap.place h2{font-weight:300;line-height:1.3}
html[lang="ar"] .disp{line-height:1.45}
html[lang="ar"] .pl h3{line-height:1.4}
html[lang="ar"] .body{font-size:16.5px}
html[lang="ar"] .pl p{font-size:15.5px}
@media (max-width:760px){
  html[dir="rtl"] .pl{margin:20px 0 0 -18px;padding:0 0 4px 18px}
  .lang-m{top:calc(100% + 8px)}
  html[lang="ar"] .body{font-size:15.5px}
  html[lang="ar"] .pl p{font-size:14.5px}
  html[lang="ru"] .cap h2{font-size:clamp(26px,7.4vw,38px)}
  html[lang="ru"] .cap.place h2{font-size:clamp(24px,7.2vw,38px);letter-spacing:.06em}
}