/* ZOTOV — production stylesheet. Generated from the design prototype; do not hand-edit. */
/* ============================================================
   ZOTOV — production additions
   (design tokens and animations come from the prototype block above)
   ============================================================ */

/* ---------- self-hosted Golos Text (SIL OFL, see fonts/OFL.txt) ---------- */
@font-face{font-family:'Golos Text';font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/golos-cyrillic-400.woff2) format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:500;font-display:swap;
  src:url(../fonts/golos-cyrillic-500.woff2) format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:600;font-display:swap;
  src:url(../fonts/golos-cyrillic-600.woff2) format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:700;font-display:swap;
  src:url(../fonts/golos-cyrillic-700.woff2) format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/golos-latin-400.woff2) format('woff2');
  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:'Golos Text';font-style:normal;font-weight:500;font-display:swap;
  src:url(../fonts/golos-latin-500.woff2) format('woff2');
  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:'Golos Text';font-style:normal;font-weight:600;font-display:swap;
  src:url(../fonts/golos-latin-600.woff2) format('woff2');
  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:'Golos Text';font-style:normal;font-weight:700;font-display:swap;
  src:url(../fonts/golos-latin-700.woff2) format('woff2');
  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}

/* Accent. The prototype runtime injected props.accent, whose default is
   #D8CBB6 — that is the colour the standalone reference actually renders.
   (The handoff README lists #C2A47E; that value only ever appeared as the
   var() fallback, never on screen.) Change this one line to restyle the
   whole site: rules, chips, prices, buttons and the reading progress bar. */
:root{--zt-brass:#D8CBB6;--zt-svc-bg:#F2EFE9;--zt-svc-fg:#17130F}

/* ---------- conditional blocks (was <sc-if> in the prototype) ---------- */
.zt-hide{display:none !important}
@media (max-width:1079.98px){.zt-desktop{display:none !important}}
@media (min-width:1080px){.zt-mobile{display:none !important}}

/* floating contact bar starts hidden, revealed past the first screen */
[data-ref="float"]{opacity:0;visibility:hidden;transform:translateY(14px)}

/* ---------- scroll-reveal initial state ----------
   Set in CSS rather than JS so nothing flashes before app.js runs.
   Only applies when JS is on and motion is allowed. */
@media (prefers-reduced-motion: no-preference){
  .zt-js [data-reveal]:not([data-reveal="mask"]){opacity:0;transform:translateY(26px);filter:blur(10px)}
  .zt-js [data-reveal="mask"] [data-img]{clip-path:inset(0 0 100% 0);transform:scale(1.14)}
}
/* Animating filter:blur() on ~100 elements is the main cause of scroll stutter
   on phones — a phone GPU re-rasterises each one every frame. The fade and the
   slide stay; only the blur goes. */
@media (prefers-reduced-motion: no-preference) and (hover: none){
  .zt-js [data-reveal]:not([data-reveal="mask"]){transform:translateY(16px);filter:none}
  .zt-js [data-reveal="mask"] [data-img]{transform:scale(1.06)}
}

/* ---------- accessibility helpers ---------- */
.zt-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.zt-skip{position:fixed;top:-100px;left:16px;z-index:400;padding:14px 22px;border-radius:999px;
  background:var(--zt-brass,#C2A47E);color:#100E0C;font-size:12px;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;transition:top .3s ease}
.zt-skip:focus{top:16px;color:#100E0C}

/* ---------- honeypot: reachable for bots, invisible and unfocusable for people ---------- */
.zt-hp{position:absolute !important;left:-9999px !important;top:auto !important;
  width:1px !important;height:1px !important;opacity:0 !important;pointer-events:none !important}

/* ---------- legal links inside the consent line ---------- */
.zt-legal{text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:rgba(194,164,126,.5);color:rgba(237,232,224,.78)}
.zt-legal:hover{color:var(--zt-brass,#C2A47E)}

/* ---------- network / server error line under the submit button ---------- */
[data-ref="status"][data-state="error"]{color:#D98E6C !important}

/* ---------- no-JS fallback ---------- */
.zt-noscript{position:relative;z-index:300;margin:0;padding:16px clamp(20px,4vw,56px);
  background:#D98E6C;color:#100E0C;font-size:14px;line-height:1.6;text-align:center}
.zt-noscript a{text-decoration:underline;color:#100E0C}

/* ---------- legal documents (privacy / consent / offer pages) ---------- */
.zt-doc{max-width:820px;margin:0 auto;padding:clamp(96px,14vh,160px) clamp(20px,4vw,56px) clamp(64px,10vh,120px)}
.zt-doc h1{font-size:clamp(28px,4vw,52px);font-weight:600;line-height:1.08;letter-spacing:-.03em;margin:0 0 14px}
.zt-doc h2{font-size:clamp(18px,1.8vw,24px);font-weight:600;line-height:1.25;letter-spacing:-.02em;margin:44px 0 14px}
.zt-doc p,.zt-doc li{font-size:16px;line-height:1.75;color:rgba(237,232,224,.72);margin:0 0 14px}
.zt-doc ul,.zt-doc ol{padding-left:22px;margin:0 0 14px}
.zt-doc li{margin-bottom:8px}
.zt-doc a{color:var(--zt-brass,#C2A47E);text-decoration:underline;text-underline-offset:3px}
.zt-doc .zt-meta{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgba(237,232,224,.5);margin-bottom:36px}
.zt-doc .zt-back{display:inline-flex;align-items:center;height:46px;padding:0 24px;margin-bottom:48px;
  border:1px solid rgba(237,232,224,.2);border-radius:999px;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:rgba(237,232,224,.8);text-decoration:none}
.zt-doc .zt-back:hover{border-color:var(--zt-brass,#C2A47E);color:var(--zt-brass,#C2A47E)}


/* ---------- base tokens and animations from the prototype ---------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#100E0C;color:#EDE8E0;font-family:'Golos Text','Helvetica Neue',Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none;transition:color .35s ease,opacity .35s ease}
a:hover{color:var(--zt-brass,#C2A47E)}
input,textarea,select,button{font:inherit;color:inherit}
input,textarea,select{background:transparent}
::placeholder{color:rgba(237,232,224,.46)}
::selection{background:var(--zt-brass,#C2A47E);color:#100E0C}
:focus-visible{outline:2px solid var(--zt-brass,#C2A47E);outline-offset:3px}
input,select,textarea{color-scheme:dark}
input[type=date]::-webkit-calendar-picker-indicator,input[type=time]::-webkit-calendar-picker-indicator{filter:invert(1) opacity(.45);cursor:pointer;transition:opacity .3s ease}
input[type=date]:hover::-webkit-calendar-picker-indicator,input[type=time]:hover::-webkit-calendar-picker-indicator{opacity:.8}
button:disabled{cursor:default;opacity:.55}
@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms !important;transition-duration:.01ms !important}}
@keyframes ztIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes ztBreathe{0%,100%{opacity:.86}50%{opacity:1}}
@keyframes ztDrop{0%{transform:translateY(-100%)}100%{transform:translateY(100%)}}
@keyframes ztHeroIn{from{opacity:0;transform:scale(1.09);filter:blur(16px)}to{opacity:1;transform:scale(1);filter:blur(0)}}
@keyframes ztLineIn{from{opacity:0;transform:translateY(34px);clip-path:inset(0 0 105% 0)}to{opacity:1;transform:none;clip-path:inset(0 0 -14% 0)}}
@keyframes ztFadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes ztRule{from{transform:scaleX(0)}to{transform:scaleX(1)}}
[data-rev-track]::-webkit-scrollbar{display:none}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
@keyframes ztLangOut{to{opacity:0;filter:blur(2px)}}
@keyframes ztLangIn{from{opacity:0;filter:blur(3px)}to{opacity:1;filter:blur(0)}}
@keyframes ztCheckRing{0%{transform:scale(.55);opacity:0}60%{transform:scale(1.05);opacity:1}100%{transform:scale(1);opacity:1}}
@keyframes ztCheckDraw{from{stroke-dashoffset:46}to{stroke-dashoffset:0}}
@keyframes ztCheckHalo{0%{transform:scale(.7);opacity:.5}100%{transform:scale(1.8);opacity:0}}
@keyframes ztCheckFill{0%{transform:scale(0);opacity:0}70%{transform:scale(1.04);opacity:1}100%{transform:scale(1);opacity:1}}
@media (hover:none){a:hover{color:inherit}}
@media (max-width:820px){
html{-webkit-text-size-adjust:100%}
body{overscroll-behavior-y:none}
@supports (height:100svh){#top{min-height:min(100svh,940px) !important}}
[data-chip]{height:46px !important}
[data-rev-track]{-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
[data-safe-bottom]{padding-bottom:env(safe-area-inset-bottom,0px)}
}

/* ---------- hover / focus / active (was style-hover="" attributes) ---------- */
/* Hover states are gated behind a real pointer. On a touchscreen :hover
   latches on tap and only clears when you tap somewhere else — cards and
   price rows would stay lit up after being touched. */
@media (hover: hover) and (pointer: fine){
.zt-p0:hover{background:var(--zt-brass,#C2A47E) !important;color:#100E0C !important}
.zt-p1:hover{filter:brightness(1.07) !important;box-shadow:0 14px 36px rgba(0,0,0,.5),0 1px 0 rgba(255,255,255,.22) inset !important}
.zt-p3:hover{border-color:var(--zt-brass,#C2A47E) !important;background:rgba(237,232,224,.05) !important}
.zt-p4:hover{background:var(--zt-brass,#C2A47E) !important;color:#100E0C !important;border-color:var(--zt-brass,#C2A47E) !important}
.zt-p5:hover{border-color:rgba(194,164,126,.5) !important}
.zt-p6:hover{color:#EDE8E0 !important}
.zt-p7:hover{border-color:var(--zt-brass,#C2A47E) !important;color:#100E0C !important;background:var(--zt-brass,#C2A47E) !important}
.zt-p8:hover{border-color:var(--zt-brass,#C2A47E) !important;color:var(--zt-brass,#C2A47E) !important}
.zt-p10:hover{opacity:.86 !important}
.zt-p11:hover{color:var(--zt-brass,#C2A47E) !important}
.zt-p12:hover{border-color:var(--zt-brass,#C2A47E) !important;color:var(--zt-brass,#C2A47E) !important;background:rgba(194,164,126,.06) !important}
.zt-p13:hover{border-color:var(--zt-brass,#C2A47E) !important}
.zt-p15:hover{transform:translateY(-3px) !important;color:var(--zt-brass,#C2A47E) !important;border-color:var(--zt-brass,#C2A47E) !important;background:rgba(194,164,126,.1) !important}
.zt-p16:hover{filter:brightness(1.06) !important;transform:translateY(-3px) !important}
}

/* focus and active work everywhere */
.zt-p2:active{filter:brightness(.96) !important}
.zt-p9:focus{border-color:var(--zt-brass,#C2A47E) !important}
.zt-p14:active{filter:brightness(.95) !important}

/* responsive grid spans (was applySpans() in JS) */
@media (min-width:1080px){[data-span-lg="1"]{grid-column:span 1}[data-span-lg="2"]{grid-column:span 2}[data-span-lg="3"]{grid-column:span 3}[data-span-lg="4"]{grid-column:span 4}[data-span-lg="5"]{grid-column:span 5}[data-span-lg="6"]{grid-column:span 6}[data-span-lg="7"]{grid-column:span 7}[data-span-lg="8"]{grid-column:span 8}[data-span-lg="9"]{grid-column:span 9}[data-span-lg="10"]{grid-column:span 10}[data-span-lg="11"]{grid-column:span 11}[data-span-lg="12"]{grid-column:span 12}}
@media (min-width:620px) and (max-width:1079.98px){[data-span-md="1"]{grid-column:span 1}[data-span-md="2"]{grid-column:span 2}[data-span-md="3"]{grid-column:span 3}[data-span-md="4"]{grid-column:span 4}[data-span-md="5"]{grid-column:span 5}[data-span-md="6"]{grid-column:span 6}[data-span-md="7"]{grid-column:span 7}[data-span-md="8"]{grid-column:span 8}[data-span-md="9"]{grid-column:span 9}[data-span-md="10"]{grid-column:span 10}[data-span-md="11"]{grid-column:span 11}[data-span-md="12"]{grid-column:span 12}}
@media (max-width:619.98px){[data-span-sm="1"]{grid-column:span 1}[data-span-sm="2"]{grid-column:span 2}[data-span-sm="3"]{grid-column:span 3}[data-span-sm="4"]{grid-column:span 4}[data-span-sm="5"]{grid-column:span 5}[data-span-sm="6"]{grid-column:span 6}[data-span-sm="7"]{grid-column:span 7}[data-span-sm="8"]{grid-column:span 8}[data-span-sm="9"]{grid-column:span 9}[data-span-sm="10"]{grid-column:span 10}[data-span-sm="11"]{grid-column:span 11}[data-span-sm="12"]{grid-column:span 12}}
/* highlighted placeholders inside the legal documents */
.zt-doc .zt-fill{border-left:2px solid #D98E6C;padding-left:14px;color:#D98E6C;font-size:14px}

/* ---------- touch feedback ----------
   iOS paints a grey box over anything tappable. Removing it without a
   replacement makes the page feel dead, so taps get an opacity dip instead. */
@media (hover: none){
  a, button, [data-chip], [data-faq] button{-webkit-tap-highlight-color:transparent}
  a:active, button:active{opacity:.62;transition:opacity .1s ease}
  /* comfortable tap targets on the two smallest controls */
  [data-pax]{min-width:44px;min-height:44px}
}

/* ---------- scroll lock that also works on iOS ----------
   Safari ignores overflow:hidden on <body>, so the page keeps scrolling behind
   an open menu or dialog. Fixing the body is the only reliable way. */
body.zt-locked{position:fixed;left:0;right:0;width:100%;overflow:hidden}