/* Values below were measured from the original Wix site (computed styles, 1100–2560px wide, 390px mobile).
   --u = 1/1440 of the viewport width: Wix scales fonts/gaps with the window, so we do too. */
:root{
  --ink:#1b0911;      /* headings, buttons, footer */
  --plum:#583b4c;     /* body text, inputs, active language */
  --sage:#dbdcd3;     /* panels, inactive language */
  --mauve:#966d86;    /* links, hover */
  --err:#df3131;
  --line:rgba(88,59,76,.2);
  --line-hi:rgba(88,59,76,.6);
  --font:"Gill Sans Nova","Gill Sans","Gill Sans MT","Lato","Helvetica Neue",Arial,sans-serif;
  --ui:"Helvetica Neue",Helvetica,Arial,sans-serif;
  --u:calc(100vw / 1440);
}
*{box-sizing:border-box}
html,body{margin:0}
body{min-height:100vh;font-family:var(--font);font-weight:300;-webkit-text-stroke:.0135em currentColor; /* Gill Sans Nova Book sits between system Gill Sans Light and Regular: Light + hairline stroke matches its measured ink density */
  color:var(--plum);background:var(--ink);-webkit-font-smoothing:antialiased}
a{color:inherit}
button{font-family:inherit}

/* ---------- Home: hero (one screen) + 90px footer ---------- */
.hero{position:relative;height:100vh;height:100svh;overflow:hidden;color:#fff;background:var(--ink) url(../img/poster-desktop.jpg) center/cover no-repeat}
.hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;opacity:0;transition:opacity .6s}
.hero__bg.is-playing{opacity:1}
.hero__bg--mobile{display:none}
/* poster layer above the video until it is really playing: Safari paints its own Play button inside <video> for blocked autoplay and no CSS can hide it, so cover it */
.hero__cover{position:absolute;inset:0;z-index:1;background:var(--ink) url(../img/poster-desktop.jpg) center/cover no-repeat;transition:opacity .6s;pointer-events:none}
.hero.is-playing .hero__cover{opacity:0}
/* Safari draws its own play button / dimming for blocked autoplay: never show it */
.hero__bg::-webkit-media-controls,.hero__bg::-webkit-media-controls-start-playback-button,.hero__bg::-webkit-media-controls-overlay-play-button,.hero__bg::-webkit-media-controls-panel{display:none!important;-webkit-appearance:none}

/* logo + language switch stay fixed while the footer scrolls into view; the button scrolls with the video */
.hero__logo{position:fixed;z-index:5;top:calc(22.5 * var(--u));left:50%;transform:translateX(-50%);width:calc(153 * var(--u));height:calc(112.7 * var(--u));display:block}
.hero__logo img{display:block;width:100%;height:100%;object-fit:contain}
.lang{position:fixed;z-index:5;top:calc(22.5 * var(--u));height:calc(112.7 * var(--u));right:calc(50px + 3.93vw);display:flex;align-items:center;font-size:max(16px,calc(22.5 * var(--u)));line-height:24px;letter-spacing:0}
.lang a{display:block;height:24px;padding:0 14.3px;text-align:center;text-decoration:none;color:var(--sage)}
.lang a[aria-current="true"]{color:var(--plum)}
.lang a:not([aria-current="true"]):hover{color:var(--mauve)}
.lang i{width:1px;height:24px;background:var(--plum)}

.cta{position:absolute;z-index:5;left:50%;bottom:calc(63 * var(--u));transform:translateX(-50%);background:var(--ink);color:#fff;border:0;font:inherit;font-size:max(16px,calc(22.5 * var(--u)));line-height:1.43;text-transform:uppercase;padding:12px 32px;width:calc(6.151em + 64px);text-align:center;cursor:pointer;white-space:nowrap;transition:background-color .4s}
.cta:hover{background:rgba(27,9,17,.6)}
.foot{height:90px;display:flex;align-items:center;justify-content:center;background:var(--ink)}
.foot a{font-size:max(16px,calc(18 * var(--u)));line-height:1.6;text-transform:uppercase;text-decoration:none;color:var(--mauve)}

/* sound toggle (desktop video only): 66x44 hit area, 2px from the hero's bottom-right corner, white note with drop shadow */
.snd{position:absolute;z-index:5;right:2px;bottom:2px;width:66px;height:44px;padding:0;border:0;background:none;cursor:pointer;color:#fff;-webkit-text-stroke:0}
.snd span{position:absolute;left:8px;top:6px;width:48px;height:32px;transition:opacity .25s}
.snd svg{display:block;width:100%;height:100%;fill:currentColor;overflow:visible}
.snd[aria-pressed="true"] .snd__live{opacity:0}
.snd[aria-pressed="false"] .snd__muted{opacity:0}
.snd:focus-visible{outline:2px solid rgba(255,255,255,.8);outline-offset:-4px}

/* tablet */
@media (max-width:1000px){
  .hero__logo{top:2.89vw;width:12.59vw;height:10.69vw}
  .lang{top:2.89vw;height:10.69vw;right:8.34vw;font-size:16px}
  .cta{bottom:4.69vw;font-size:max(16px,2.344vw)}
}
/* mobile */
@media (max-width:750px){
  .hero__bg--desktop{display:none}
  .hero__bg--mobile{display:block}
  .hero{background-image:url(../img/poster-mobile.jpg)}
  .hero__cover{background-image:url(../img/poster-mobile.jpg)}
  .hero__logo{top:4.1vw;width:26.7vw;height:18.82vw}
  .lang{top:4.1vw;height:18.82vw;right:4.4vw;font-size:16px}
  .cta{bottom:14.36vw;font-size:4.1vw}
  .snd{display:none}   /* the phone cut has no audio and no toggle, like the original */
}
@media (prefers-reduced-motion:reduce){.hero__bg,.snd{display:none}}

/* ---------- Subscribe dialog ---------- */
dialog.sub{border:0;padding:0;margin:auto;background:var(--sage);color:var(--ink);width:min(1.4 * 100vh,100vw);max-width:none;max-height:100vh;max-height:100svh;overflow:visible;font-family:var(--font)}
dialog.sub[open]{animation:subIn .3s ease-out}
dialog.sub:focus{outline:none}
.sub__close:focus:not(:focus-visible){outline:none}
.sub__close:focus-visible{outline:2px solid var(--line-hi);outline-offset:4px}
@keyframes subIn{from{opacity:0}to{opacity:1}}
dialog.sub::backdrop{background:rgba(88,59,76,.6)}
.sub__wrap{display:flex;align-items:stretch;position:relative}
.sub__photo{flex:none;width:calc(.7 * 100vh - 20px);background:url(../img/subscribe.jpg) 57% 35%/cover no-repeat}
.sub__body{flex:1;min-width:0;padding:calc(36 * var(--u)) 3.125vw calc(36 * var(--u)) 40px;text-align:center}
.sub__close{position:absolute;top:24px;right:24px;width:22.17px;height:22.17px;padding:0;border:0;background:none;color:var(--plum);cursor:pointer;line-height:0}
.sub__close svg{display:block;width:100%;height:100%}
.sub__logo{display:block;margin:0 auto;width:calc(.17467 * 100vh);height:calc(.1341 * 100vh);object-fit:contain}
.sub h2{margin:calc(27 * var(--u)) 0 0;font-weight:inherit;font-size:calc(42.75 * var(--u));line-height:1.3;text-transform:uppercase;color:var(--ink)}
.sub p.lead{margin:calc(8.6 * var(--u)) auto 0;width:95%;font-size:max(16px,calc(18 * var(--u)));line-height:1.2;letter-spacing:.006em;color:var(--ink)}
.sub form{margin:calc(27 * var(--u)) 0 0;text-align:left}

.field{position:relative;margin:0 0 16px}
.field .box{display:flex;align-items:center;height:38px;background:var(--sage);border:1px solid var(--line);padding-right:12px;transition:border-color .2s}
.field .box:hover,.field .box:focus-within{border-color:var(--line-hi)}
.field input{flex:1;min-width:0;height:36px;border:0;outline:0;background:none;padding:8px 2px 8px 12px;font:inherit;font-size:16px;line-height:20px;color:var(--plum)}
.field input::placeholder{color:#6e6e6e;opacity:1}
.field.has-err .box{border-color:var(--err)}
.field .err{display:none;margin-top:8px;height:20px;font:14px/19.6px var(--ui);color:var(--err);white-space:nowrap}
.field .err svg{width:20px;height:20px;margin-right:2px;vertical-align:top;fill:currentColor}
.field.has-err .err{display:block}
.field.has-err{margin-bottom:16px}

/* phone with country selector */
.cc{position:relative;flex:none;display:flex;align-items:center;gap:0;height:16px;margin:0 0 0 12px;padding:0;border:0;background:none;cursor:pointer;color:var(--plum);transition:opacity .0s}
.cc:hover{opacity:.7}
.cc img{width:22.4px;height:14px;display:block;object-fit:cover}
.cc svg{width:16px;height:16px;fill:currentColor;transition:transform .15s}
.cc[aria-expanded="true"] svg{transform:rotate(180deg)}
.field--phone input{padding-left:4px}
.field--phone .box{padding-left:0}
.ccl{position:absolute;z-index:20;left:0;width:291.6px;max-width:100%;background:var(--sage);border:1px solid rgba(88,59,76,.4);box-shadow:0 4px 8px rgba(0,0,0,.1),0 0 4px rgba(0,0,0,.1);padding:12px 0 0;display:none}
.ccl.open{display:block}
.ccl .s{position:relative;display:flex;align-items:center;margin:8px 24px 0;height:42px;border:1px solid var(--line-hi);background:var(--sage);padding-right:12px}
.ccl .s svg{flex:none;width:24px;height:24px;margin-left:12px;fill:currentColor;color:var(--plum)}
.ccl .s input{flex:1;min-width:0;height:40px;border:0;outline:0;background:none;padding:8px 2px 8px 0;font:inherit;font-size:16px;line-height:24px;color:var(--plum)}
.ccl .s input::placeholder{color:#6e6e6e;opacity:1}
.ccl ul{position:relative;list-style:none;margin:7px 0 0;padding:0 0 8px;height:198px;overflow-y:auto;overscroll-behavior:contain}
.ccl li{display:flex;align-items:center;gap:12px;height:40px;padding:10px 24px;font-size:16px;line-height:20px;color:var(--plum);cursor:pointer;white-space:nowrap}
.ccl li:hover{background:rgba(88,59,76,.06)}
.ccl li[aria-selected="true"]{background:rgba(88,59,76,.16)}
.ccl li img{width:22.4px;height:14px;flex:none;object-fit:cover}
.ccl li span{overflow:hidden;text-overflow:ellipsis}

/* consent */
.field--consent .consent{margin:0}
.consent{display:flex;align-items:center;gap:12px;margin:0 0 16px;font-size:16px;line-height:24px;color:var(--plum);cursor:pointer}
.consent input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.consent .cb{flex:none;position:relative;width:16px;height:16px;border:1px solid var(--line);transition:border-color .2s}
.consent:hover .cb{border-color:var(--line-hi)}
.consent .cb svg{position:absolute;inset:-1px;width:16px;height:16px;fill:var(--mauve);display:none}
.consent input:checked + .cb svg{display:block}
.consent input:focus-visible + .cb{outline:2px solid var(--line-hi);outline-offset:2px}
.consent a{color:var(--mauve)}
.sub .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.sub button[type=submit]{display:block;width:50%;margin:0 auto;padding:11px 14px;border:0;background:var(--ink);color:var(--sage);font:inherit;font-size:20px;line-height:24px;text-transform:none;cursor:pointer;transition:background-color .2s,color .2s}
.sub button[type=submit]:hover{background:rgba(27,9,17,.7)}
.sub button[disabled]{opacity:.6;cursor:wait}
.sub .msg{min-height:0;margin:0;text-align:center;font:14px/19.6px var(--ui);color:var(--err)}
.sub .msg:not(:empty){margin-top:12px}
.sub .done{display:none;padding:calc(60 * var(--u)) 0;font-size:calc(22.5 * var(--u));line-height:1.4;color:var(--ink)}
.sub.is-done form,.sub.is-done .lead{display:none}
.sub.is-done .done{display:block}

/* tablet: photo left, narrower column */
@media (max-width:1000px) and (min-width:751px){
  dialog.sub{width:100vw}
  .sub__photo{width:48.5vw}
  .sub__body{padding:calc(36 * var(--u)) 25px calc(36 * var(--u)) 24px}
}
/* mobile: photo becomes a 136px band */
@media (max-width:750px){
  dialog.sub{width:min(97.4vw,405px);max-height:calc(100svh - 10px);overflow:auto}
  .sub__wrap{display:block}
  .sub__photo{width:100%;height:136px;background-position:50% 57.6%}
  .sub__close{top:20px;right:20px;color:#fff}
  .sub__body{padding:24px 5.13vw 19.5px}
  .sub__logo{width:75.3px;height:57.8px}
  .sub h2{margin-top:15.9px;font-size:28px;line-height:1.3}
  .sub p.lead{margin-top:4px;width:100%;font-size:16px}
  .sub form{margin-top:16px}
  .consent{align-items:center}
  .sub button[type=submit]{width:100%}
  .ccl{left:0}
}

/* ---------- Legal page (same scale rules as home: 22.5px text at 1440px wide) ---------- */
body.legal{background:var(--sage);color:var(--plum)}
.legal__head{position:relative;height:calc(157.7 * var(--u))}
.legal .hero__logo{position:absolute}
.legal .lang{position:absolute}
.legal .lang a{color:#6e6e6e}
.legal .lang a[aria-current="true"]{color:var(--plum)}
.legal .lang a:not([aria-current="true"]):hover{color:var(--mauve)}
.legal main{padding:calc(72 * var(--u)) 7.5vw calc(72 * var(--u));font-size:calc(22.5 * var(--u));line-height:1.2}
.legal h1{margin:0 0 calc(40.5 * var(--u));font-weight:inherit;font-size:calc(63 * var(--u));line-height:1.2}
.legal main p{margin:0}
.legal main b{font-weight:400;-webkit-text-stroke:.022em currentColor;paint-order:stroke fill} /* system Gill Sans Bold is far wider than the original's bold */
@media (max-width:750px){
  .legal__head{height:27vw}
  .legal main{padding:5vw 5.13vw 9vw;font-size:4.1vw}
  .legal h1{font-size:12.31vw;margin-bottom:2.81vw}
}