/* ==== 00-fonts.css ==== */
/* Self-hosted Onest variable 400–800 (the only v5 family). Unbounded was dropped in v5. */
@font-face{font-family:'Onest';font-style:normal;font-weight:400 800;font-display:swap;src:url(../fonts/onest-400-800-cyrillic-ext.woff2) format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
@font-face{font-family:'Onest';font-style:normal;font-weight:400 800;font-display:swap;src:url(../fonts/onest-400-800-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Onest';font-style:normal;font-weight:400 800;font-display:swap;src:url(../fonts/onest-400-800-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Onest';font-style:normal;font-weight:400 800;font-display:swap;src:url(../fonts/onest-400-800-latin.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}

/* ==== 01-base.css ==== */
/* WhiteWays v5 · „Кобалт Про“ · tokens, base, buttons, sections, reveals (owner: lead). Ported from raw/v5/v5b/style.css */
*{font-feature-settings:"locl" 0 !important}
*,*::before,*::after{box-sizing:border-box}
:root{
  --paper:#fff;
  --mist:#F3F5FA;
  --mist-2:#E9ECF5;
  --line:#DFE3EE;
  --line-2:#C9D0E3;
  --ink:#0B1233;
  --ink-2:#283052;
  --muted:#525A78;
  --cobalt:#2335FF;
  --cobalt-2:#1B2AE0;
  --cobalt-deep:#0E178F;
  --cobalt-tint:#ECEEFF;
  --night:#070B52;
  --yellow:#FFD43B;
  --hdr:76px;
  --gut:clamp(20px,4vw,48px);
  --ease:cubic-bezier(.2,.75,.15,1);
  --f:"Onest",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"Onest",system-ui,sans-serif;
  --sh-1:0 1px 2px rgba(11,18,51,.05),0 10px 30px -12px rgba(11,18,51,.16);
  --sh-2:0 2px 6px rgba(11,18,51,.06),0 30px 70px -28px rgba(11,18,51,.38);
}
@property --hx{syntax:'<percentage>';inherits:false;initial-value:28%}
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
@property --ang2{syntax:'<angle>';inherits:false;initial-value:0deg}

html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hdr) + 16px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;font-variant-numeric:tabular-nums;background:var(--paper);color:var(--ink);font:400 18px/1.6 var(--f);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
h1,h2,h3,p,ul,ol,figure{margin:0;padding:0}
ul,ol{list-style:none}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button,input{font:inherit;color:inherit}
.ic{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.wrap{width:min(100% - 2*var(--gut),1240px);margin-inline:auto}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--yellow);color:var(--ink);padding:12px 18px;border-radius:12px;font-weight:600}
.skip:focus{top:12px}
:focus-visible{outline:3px solid var(--cobalt);outline-offset:3px;border-radius:8px}
.hero :focus-visible,.cta-card :focus-visible,.hdr:not(.solid) :focus-visible{outline-color:#fff}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;font-weight:600;font-size:17px;line-height:1;letter-spacing:-.005em;white-space:nowrap;border:0;cursor:pointer;transition:transform .35s var(--ease),box-shadow .35s var(--ease),background-color .25s}
.btn .ic{width:19px;height:19px;stroke-width:2.1;transition:transform .35s var(--ease)}
.btn:hover .ic{transform:translateX(3px)}
.btn-lg{min-height:60px;padding:0 30px;font-size:18px}
.btn-block{width:100%}
.btn-y{background:var(--yellow);color:var(--ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 12px 30px -12px rgba(230,170,0,.75)}
.btn-y:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 18px 36px -12px rgba(230,170,0,.85)}
.btn-glass{background:rgba(255,255,255,.1);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.btn-glass:hover{background:rgba(255,255,255,.18)}
.btn-line{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.btn-line:hover{box-shadow:inset 0 0 0 1.5px var(--ink)}

.tag{display:inline-block;font:600 13px/1 var(--f);letter-spacing:.07em;text-transform:uppercase;color:var(--muted);background:#fff;border:1px solid var(--line);padding:5px 8px;border-radius:8px}

/* ---------- sections ---------- */
.sec{padding-block:clamp(84px,10vw,150px)}
.sec-head{max-width:780px;margin-bottom:clamp(40px,5vw,64px)}
.sec-head-c{margin-inline:auto;text-align:center}
.sec-head.split{display:grid;grid-template-columns:1.5fr 1fr;column-gap:64px;align-items:end;max-width:none}
.split .eyebrow{grid-column:1/-1}
.split .lead{margin-top:0;padding-bottom:8px;justify-self:end;max-width:34ch}
.sec-head-c .eyebrow{justify-content:center}
.eyebrow{display:flex;align-items:center;gap:12px;margin-bottom:22px;font:600 14px/1 var(--f);letter-spacing:.09em;text-transform:uppercase;color:var(--cobalt)}
.stop{width:12px;height:12px;border-radius:50%;background:var(--cobalt);box-shadow:0 0 0 5px rgba(35,53,255,.13);flex:none}
.h2{font-size:clamp(36px,4.6vw,66px);line-height:1.03;letter-spacing:-.042em;font-weight:600;text-wrap:balance}
.lead{margin-top:20px;max-width:44ch;font-size:clamp(18px,1.45vw,21px);line-height:1.55;color:var(--muted);text-wrap:pretty}
.sec-head-c .lead{margin-inline:auto}

/* content reveals are one-shot (IntersectionObserver) so nothing hides again on scroll-up;
   scroll-driven view() timelines are kept for decorative motion only (parallax, device rise) */
html.js .rv{opacity:0;transform:translateY(30px);transition:opacity .9s var(--ease),transform 1s var(--ease),clip-path 1.1s var(--ease);transition-delay:calc(var(--i,0)*60ms)}
html.js .rv.in{opacity:1;transform:none}
.draw{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2s var(--ease) .3s}
.in .draw,.in.draw{stroke-dashoffset:0}
html:not(.js) .draw{stroke-dashoffset:0}


/* v5 additions for the multi-page site */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.h1{font-size:clamp(40px,6vw,84px);line-height:1;letter-spacing:-.045em;font-weight:600;text-wrap:balance}
.h3{font-size:clamp(21px,1.7vw,26px);line-height:1.2;letter-spacing:-.025em;font-weight:600}
.sec-mist{background:var(--mist)}
.sec-ink{background:var(--ink);color:#fff}.sec-ink .lead{color:#B9C0DE}.sec-ink .eyebrow{color:#B9C2FF}
.card{background:#fff;border:1px solid var(--line);border-radius:28px;box-shadow:var(--sh-1)}
.chip{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 14px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:15px;font-weight:500;color:var(--ink-2)}
@media (max-width:900px){.sec-head.split{grid-template-columns:1fr}.split .lead{justify-self:start;margin-top:16px}}

/* reduced motion: everything visible, nothing moves */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  html.js .rv{opacity:1!important;transform:none!important;animation:none!important;clip-path:none!important}
  .draw{stroke-dashoffset:0}
}

/* ==== 02-chrome.css ==== */
/* WhiteWays v5 · chrome (owner: chrome agent)
   header + mobile sheet, sub-page contract (.sub-hero / .sub-end), contact card + form,
   footer, AI widget, mobile bar, Lenis, page transitions. Look ported from raw/v5/v5b. */

/* ---------- Lenis ---------- */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:clip}

/* magnetic buttons keep their own hover lift; the pull runs on `translate` */
[data-mag]{transition:transform .35s var(--ease),box-shadow .35s var(--ease),background-color .25s,translate .5s var(--ease)}

/* ---------- header: white on cobalt, solid glass after the first band ---------- */
.hdr{position:absolute;inset:0 0 auto;z-index:60;height:var(--hdr);color:#fff;--mk-bg:#fff;--mk-road:var(--cobalt);--accent:#B9C2FF;view-transition-name:hdr}
html.js .hdr{position:fixed;transition:background-color .35s,color .35s,box-shadow .35s}
.hdr.dim{background:rgba(9,14,110,.5);-webkit-backdrop-filter:saturate(1.4) blur(18px);backdrop-filter:saturate(1.4) blur(18px);box-shadow:0 1px 0 rgba(255,255,255,.1)}
.hdr.solid{background:rgba(255,255,255,.84);-webkit-backdrop-filter:saturate(1.6) blur(18px);backdrop-filter:saturate(1.6) blur(18px);color:var(--ink);box-shadow:0 1px 0 rgba(11,18,51,.08);--mk-bg:var(--cobalt);--mk-road:var(--ink);--accent:var(--cobalt)}
.hdr-in{height:100%;display:flex;align-items:center;gap:24px}
.brand{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-weight:700;font-size:22px;letter-spacing:-.035em;line-height:1}
.brand-mark{width:32px;height:32px;flex:none;display:block}
.brand-word b{font-weight:700;color:var(--accent);transition:color .35s}
.brand-ink{color:var(--ink);--mk-bg:var(--cobalt);--mk-road:var(--ink);--accent:var(--cobalt)}
.nav{margin-left:auto;display:flex;gap:2px}
.nav a{padding:10px 14px;border-radius:999px;font-size:16px;font-weight:500;transition:background-color .2s}
.nav a:hover{background:color-mix(in srgb,currentColor 10%,transparent)}
.nav a[aria-current]{background:color-mix(in srgb,currentColor 13%,transparent);font-weight:600}
.hdr-cta{min-height:46px;padding:0 20px;font-size:16px}
.menu-btn{display:none;width:46px;height:46px;border-radius:14px;border:1px solid color-mix(in srgb,currentColor 28%,transparent);background:transparent;color:inherit;place-items:center;cursor:pointer;flex:none;padding:0}
.menu-btn .ic{width:22px;height:22px}

/* mobile sheet (popover; .open is the fallback without popover support) */
.sheet{display:none;position:fixed;z-index:90;margin:0;inset:0;width:100%;max-width:none;height:100dvh;max-height:none;border:0;padding:0 var(--gut) calc(24px + env(safe-area-inset-bottom));background:#fff;color:var(--ink);overflow:auto;flex-direction:column}
.sheet:popover-open{display:flex}
.sheet.open{display:flex}
.sheet::backdrop{background:rgba(11,18,51,.45)}
.sheet-top{display:flex;justify-content:space-between;align-items:center;height:var(--hdr);flex:none}
.sheet .menu-btn{display:grid;border-color:var(--line-2)}
.sheet-nav{margin-top:8px}
.sheet-nav a{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:clamp(28px,8vw,36px);font-weight:600;letter-spacing:-.035em;line-height:1.1;padding:15px 2px;border-bottom:1px solid var(--line)}
.sheet-nav .ic{width:24px;height:24px;color:var(--cobalt);stroke-width:2}
.sheet-nav a[aria-current]{color:var(--cobalt)}
.sheet-end{margin-top:auto;padding-top:28px;display:grid;gap:16px}
.sheet-mail{display:flex;align-items:center;justify-content:center;gap:10px;font-size:18px;color:var(--muted)}
.sheet-mail .ic{color:var(--cobalt)}
.sheet-mail a{padding-block:10px;font-weight:600;color:var(--ink)}
.sheet :focus-visible{outline-color:var(--cobalt)}
@media (prefers-reduced-motion:no-preference){
  .sheet:popover-open{animation:sheetIn .4s var(--ease)}
  .sheet:popover-open .sheet-nav a{animation:sheetLink .6s var(--ease) both}
  .sheet-nav a:nth-child(2){animation-delay:.04s}.sheet-nav a:nth-child(3){animation-delay:.08s}.sheet-nav a:nth-child(4){animation-delay:.12s}
  .sheet-nav a:nth-child(5){animation-delay:.16s}.sheet-nav a:nth-child(6){animation-delay:.2s}
}
@keyframes sheetIn{from{opacity:0;transform:translateY(-10px)}}
@keyframes sheetLink{from{opacity:0;transform:translateY(14px)}}

/* ---------- sub-page hero: cobalt band under the fixed header ---------- */
.sub-hero{position:relative;isolation:isolate;overflow:clip;color:#fff;
  padding:calc(var(--hdr) + clamp(40px,6vw,96px)) 0 clamp(64px,8vw,120px);
  border-radius:0 0 clamp(28px,4vw,56px) clamp(28px,4vw,56px);
  background:
    radial-gradient(ellipse 60% 75% at 86% 0%,rgba(126,146,255,.55),transparent 66%),
    radial-gradient(ellipse 60% 70% at 0% 100%,rgba(7,11,82,.55),transparent 70%),
    linear-gradient(165deg,#2536FF 0%,#1B2AE0 45%,#0E178F 100%)}
.sub-hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);
  background-size:72px 72px;background-position:50% 0;
  -webkit-mask-image:radial-gradient(ellipse 75% 85% at 72% 0%,#000,transparent 72%);mask-image:radial-gradient(ellipse 75% 85% at 72% 0%,#000,transparent 72%)}
.sub-hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:no-repeat 50% 50%/cover url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 720' preserveAspectRatio='xMidYMid slice'%3E%3Cg fill='none' stroke='white' stroke-linecap='round'%3E%3Cpath d='M-60 700C300 660 560 470 860 420S1260 260 1520 80' stroke-opacity='.06' stroke-width='74'/%3E%3Cpath d='M-60 640C280 600 540 420 840 370S1240 210 1520 20' stroke-opacity='.12' stroke-width='1.2'/%3E%3Cpath d='M-60 760C320 720 580 530 880 480S1280 320 1520 150' stroke-opacity='.12' stroke-width='1.2'/%3E%3Cpath d='M-60 700C300 660 560 470 860 420S1260 260 1520 80' stroke-opacity='.38' stroke-width='1.6' stroke-dasharray='10 14'/%3E%3C/g%3E%3Ccircle cx='860' cy='420' r='5' fill='white' fill-opacity='.55'/%3E%3Ccircle cx='860' cy='420' r='14' fill='none' stroke='white' stroke-opacity='.18'/%3E%3C/svg%3E")}
.sub-hero-in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(36px,5vw,88px);align-items:center}
.sub-hero-in:not(:has(>.sub-visual)){grid-template-columns:minmax(0,880px)}
.sub-hero .eyebrow{color:rgba(255,255,255,.9)}
.sub-hero .stop{background:var(--yellow);box-shadow:0 0 0 5px rgba(255,212,59,.22)}
.sub-title{font-size:clamp(40px,5.6vw,76px);line-height:1.02;letter-spacing:-.045em;font-weight:600;text-wrap:balance;color:#fff}
.sub-lead{margin-top:22px;max-width:40ch;font-size:clamp(18px,1.5vw,21px);line-height:1.55;color:rgba(255,255,255,.88);text-wrap:pretty}
.sub-act{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.sub-visual{position:relative;min-width:0}
.sub-hero :focus-visible{outline-color:#fff}
@media (prefers-reduced-motion:no-preference){
  html.js .sub-copy>*{animation:subIn 1s var(--ease) both}
  html.js .sub-copy>:nth-child(2){animation-delay:.07s}
  html.js .sub-copy>:nth-child(3){animation-delay:.14s}
  html.js .sub-copy>:nth-child(n+4){animation-delay:.21s}
  html.js .sub-visual{animation:subIn 1.1s var(--ease) .18s both}
}
@keyframes subIn{from{opacity:0;transform:translateY(22px)}}

/* closing band before the contact section: one short line + a button, then the route runs down into the card */
.sub-end{position:relative;padding:clamp(88px,10vw,150px) 0 clamp(96px,10vw,140px);text-align:center;background:var(--paper)}
.sub-end>.wrap{display:flex;flex-direction:column;align-items:center;gap:28px}
.sub-end h2{max-width:20ch;margin-inline:auto}
.sub-end p:not(.eyebrow){max-width:44ch;margin:0 auto;color:var(--muted);font-size:clamp(18px,1.45vw,21px)}
.sub-end .eyebrow{justify-content:center;margin-bottom:0}
.sub-end::after,.sub-end+.contact::before{content:"";position:absolute;left:50%;width:2px;margin-left:-1px;background:repeating-linear-gradient(to bottom,var(--cobalt) 0 8px,transparent 8px 16px);opacity:.55}
.sub-end::after{bottom:0;height:clamp(48px,6vw,80px)}
.sub-end+.contact{position:relative}
.sub-end+.contact::before{top:0;height:clamp(40px,5vw,72px)}

/* ---------- contact: cobalt card, illustration + founder | form ---------- */
.contact{background:var(--mist);padding:clamp(40px,5vw,72px) 0 clamp(24px,3vw,40px)}
.cta-card{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(28px,5vw,72px);padding:clamp(14px,2.6vw,36px);border-radius:44px;overflow:hidden;color:#fff;background:radial-gradient(ellipse 60% 60% at 85% 10%,rgba(120,140,255,.5),transparent 70%),linear-gradient(150deg,#2536FF 0%,#1826D2 45%,#0C148C 100%);box-shadow:0 60px 120px -60px rgba(35,53,255,.8)}
.cta-bg{position:absolute;inset:0;z-index:-1;-webkit-mask-image:linear-gradient(to left,#000 24%,transparent 44%);mask-image:linear-gradient(to left,#000 24%,transparent 44%)}
.cta-bg svg{width:100%;height:100%;display:block}
.ct-media{position:relative;min-height:600px;border-radius:30px;overflow:hidden;background:linear-gradient(180deg,#E6EAFF 0%,#F3F5FF 55%,#fff 100%)}
.ct-media::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(35,53,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(35,53,255,.06) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:linear-gradient(#000,transparent 70%);mask-image:linear-gradient(#000,transparent 70%)}
.ct-scene{position:absolute;inset:0}
.ct-scene svg{width:100%;height:100%;display:block}
.ct-scene .draw{transition-duration:2.4s;transition-delay:.4s}
@media (prefers-reduced-motion:no-preference){.ct-pin-in{animation:ctBob 3.2s ease-in-out infinite alternate}}
@keyframes ctBob{to{transform:translateY(-8px)}}
.ct-founder{position:absolute;left:20px;bottom:20px;width:min(360px,calc(100% - 40px));padding:16px 18px 12px;border-radius:22px;background:rgba(255,255,255,.97);box-shadow:var(--sh-2);color:var(--ink)}
.ct-who{display:flex;align-items:center;gap:12px}
.ct-av{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;flex:none;font-style:normal;font-weight:700;font-size:20px;color:#fff;background:linear-gradient(150deg,#3A4BFF,#1420B5)}
.ct-who b{display:block;font-size:17px;font-weight:600;line-height:1.25}
.ct-who span{display:block;font-size:15px;color:var(--ink-2);line-height:1.35}
.ct-meta{margin-top:14px;padding-top:6px;border-top:1px solid var(--line);display:grid;font-size:15px;color:var(--ink-2)}
.ct-meta li{display:flex;align-items:center;gap:10px;min-height:40px}
.ct-meta .ic{width:18px;height:18px;color:var(--cobalt)}
.ct-meta a{padding-block:8px;font-weight:600;color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
.ct-meta a:hover{color:var(--cobalt)}
#contact .ct-founder :focus-visible{outline-color:var(--cobalt)}
.ct-body{align-self:center;padding:clamp(8px,2vw,24px) clamp(4px,2vw,24px) clamp(8px,2vw,24px) 0}
.contact .eyebrow{color:rgba(255,255,255,.9)}
.contact .stop{background:var(--yellow);box-shadow:0 0 0 5px rgba(255,212,59,.22)}
.contact .h2{color:#fff}
.contact .lead{margin-top:18px;color:rgba(255,255,255,.86)}
.cta-card :focus-visible{outline-color:#fff}

/* form: 56px fields, labels above, clear error state */
.form{display:grid;gap:16px;margin-top:32px}
.field{display:grid;gap:8px}
.field>label{font-size:16px;font-weight:600;color:rgba(255,255,255,.92);transition:color .2s}
.field input,.field textarea{display:block;width:100%;min-height:56px;padding:0 18px;border-radius:16px;border:0;background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.3);color:#fff;font:inherit;font-size:18px;caret-color:#fff;transition:box-shadow .2s,background-color .2s}
.field textarea{padding:14px 18px;min-height:112px;line-height:1.5;resize:vertical}
.field ::placeholder{color:rgba(255,255,255,.55);opacity:1}
.field input:hover,.field textarea:hover{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.5)}
.field input:focus,.field textarea:focus{outline:none;background:rgba(255,255,255,.16);box-shadow:inset 0 0 0 2px #fff,0 0 0 5px rgba(255,255,255,.14)}
.field:focus-within>label{color:#fff}
.field input:-webkit-autofill{-webkit-text-fill-color:#fff;-webkit-box-shadow:inset 0 0 0 100px #2A3BEB;transition:background-color 9999s}
.field [aria-invalid="true"]{background:rgba(255,140,120,.12);box-shadow:inset 0 0 0 2px #FFB9AB}
.field .err{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:500;color:#FFC6BB}
.field .err::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.more{border-radius:16px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.22);transition:background-color .2s}
.more[open]{background:rgba(255,255,255,.05);padding-bottom:18px}
.more summary{list-style:none;display:flex;align-items:center;gap:10px;min-height:56px;padding:0 18px;cursor:pointer;font-size:17px;font-weight:600;border-radius:16px}
.more summary::-webkit-details-marker{display:none}
.more summary span{font-size:15px;font-weight:400;color:rgba(255,255,255,.7)}
.more summary .ic{margin-left:auto;transition:transform .3s var(--ease)}
.more[open] summary .ic{transform:rotate(45deg)}
.needs{border:0;margin:0;padding:4px 18px 10px;min-width:0}
.needs legend{padding:0;margin-bottom:12px;font-size:15px;font-weight:600;color:rgba(255,255,255,.88)}
.needs label{position:relative;display:inline-flex;align-items:center;gap:8px;min-height:44px;margin:0 6px 8px 0;padding:0 16px 0 14px;border-radius:999px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.28);font-size:16px;font-weight:500;cursor:pointer;user-select:none;transition:background-color .2s,color .2s,box-shadow .2s}
.needs label::before{content:"";width:14px;height:14px;border-radius:50%;box-shadow:inset 0 0 0 1.5px currentColor;opacity:.7;flex:none;transition:background-color .2s}
.needs label:hover{background:rgba(255,255,255,.15)}
.needs label.on,.needs label:has(:checked){background:#fff;color:var(--cobalt-2);box-shadow:none}
.needs label.on::before,.needs label:has(:checked)::before{background:var(--cobalt);box-shadow:none;opacity:1}
.needs label:has(:focus-visible){outline:3px solid #fff;outline-offset:2px}
.chip-input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.more .field{padding:0 18px}
.form .btn{margin-top:6px}
.form-note{font-size:15px;line-height:1.5;color:rgba(255,255,255,.74);text-align:center}
.form-note.is-sent{text-align:left;padding:16px 18px;border-radius:16px;background:rgba(255,255,255,.13);color:#fff;font-size:16px}
.form-alt{display:block;margin-top:8px;font-size:15px;color:rgba(255,255,255,.84)}
.form-alt a{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.form-copy{margin-left:6px;min-height:40px;padding:0 16px;border-radius:999px;border:0;background:#fff;color:var(--cobalt-2);font-size:15px;font-weight:600;cursor:pointer}
.form-carried{padding:12px 16px;border-radius:14px;background:rgba(255,255,255,.14);font-size:15px;font-weight:500;color:#fff}

/* ---------- footer ---------- */
.ftr{position:relative;z-index:1;background:var(--mist);padding:clamp(72px,8vw,110px) 0 28px;overflow:hidden}
.ftr-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.25fr auto;gap:40px}
.ftr-brand p{margin-top:16px;max-width:30ch;color:var(--muted);font-size:17px}
.ftr-nav{display:grid;align-content:start;font-size:17px}
.ftr-nav a,.ftr-nav span{display:block;padding-block:9px}
.ftr-nav>p{font:600 13px/1 var(--f);letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.ftr-nav a:hover{color:var(--cobalt)}
.ftr-nav a[aria-current]{color:var(--cobalt);font-weight:600}
.ftr-nav span{color:var(--ink-2)}
/* the giant two-tone wordmark; a thin cobalt route runs in from the left and ends at a pin over „Ways“ */
.ftr-mark{--rl:30px;margin-top:clamp(100px,9vw,124px)}
.ftr-word{position:relative;font-size:clamp(64px,17.2vw,248px);line-height:.82;font-weight:600;letter-spacing:-.065em;white-space:nowrap;color:#E1E5F0;user-select:none;clip-path:inset(-140px 0 -90px 0)}
.ftr-word::after{content:"";position:absolute;z-index:-1;left:0;right:0;top:calc(-1*var(--rl));height:1px;background:var(--line-2)}
.ftr-word::before{content:"";position:absolute;left:0;top:calc(-1*var(--rl) - 6px);width:12px;height:12px;border-radius:50%;background:var(--mist);box-shadow:inset 0 0 0 2.5px var(--cobalt);z-index:1}
.ftr-word b{position:relative;display:inline-block;font-weight:600;color:#CFD5FF}
.ftr-word b::before{content:"";position:absolute;right:calc(100% - .16em);top:calc(-1*var(--rl) - 1px);width:70vw;height:2.5px;border-radius:2px;background:var(--cobalt)}
.ftr-word b::after{content:"";position:absolute;left:calc(.16em - 14px);top:calc(-1*var(--rl) - 36px);width:28px;height:37px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 37'%3E%3Cpath d='M14 37C9.5 30 1 22.5 1 14a13 13 0 0 1 26 0c0 8.5-8.5 16-13 23z' fill='%232335FF'/%3E%3Ccircle cx='14' cy='14' r='5' fill='white'/%3E%3C/svg%3E")}
html.js .ftr-mark .ftr-word{transition:clip-path 1.6s var(--ease) .15s}
html.js .ftr-mark:not(.in) .ftr-word{clip-path:inset(-140px 100% -90px 0)}
.ftr-bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;margin-top:clamp(36px,4.4vw,64px);font-size:15px;color:var(--muted)}

/* ---------- AI widget (scripted demo) ---------- */
.ai-fab{position:fixed;right:24px;bottom:24px;z-index:70;display:flex;align-items:center;padding:0;border:0;background:none;cursor:pointer;color:#fff;border-radius:50%}
.ai-orb{position:relative;width:60px;height:60px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 30% 25%,#5A6BFF,#2335FF 55%,#1420B5);box-shadow:0 16px 34px -12px rgba(35,53,255,.75),inset 0 1px 0 rgba(255,255,255,.35);transition:transform .35s var(--ease)}
.ai-fab:hover .ai-orb{transform:translateY(-2px) scale(1.04)}
.ai-orb .ic{position:absolute;width:26px;height:26px;stroke-width:1.8;transition:opacity .25s,transform .35s var(--ease)}
.ai-orb .ai-x{opacity:0;transform:rotate(-45deg)}
.ai-fab.is-open .ai-spark{opacity:0;transform:rotate(45deg)}
.ai-fab.is-open .ai-x{opacity:1;transform:none}
.ai-hint{position:absolute;right:calc(100% + 12px);white-space:nowrap;padding:10px 16px;border-radius:999px;background:#fff;color:var(--ink);font-size:15px;font-weight:600;box-shadow:var(--sh-1);opacity:0;translate:8px 0;transition:opacity .3s,translate .3s var(--ease);pointer-events:none}
.ai-fab:hover .ai-hint,.ai-fab:focus-visible .ai-hint{opacity:1;translate:0}
.ai-fab.is-open .ai-hint{opacity:0}
.ai-panel{position:fixed;right:24px;bottom:100px;z-index:71;width:min(400px,calc(100vw - 32px));max-height:min(640px,calc(100dvh - 130px));display:flex;flex-direction:column;background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:28px;box-shadow:var(--sh-2);overflow:hidden;opacity:0;visibility:hidden;transform:translateY(16px) scale(.98);transform-origin:100% 100%;transition:opacity .3s,transform .4s var(--ease),visibility 0s .4s}
.ai-panel.open{opacity:1;visibility:visible;transform:none;transition:opacity .3s,transform .4s var(--ease),visibility 0s}
.ai-head{display:flex;align-items:center;gap:12px;padding:14px 14px 14px 18px;border-bottom:1px solid var(--line)}
.ai-av svg{display:block;width:40px;height:40px;--mk-bg:var(--cobalt);--mk-road:var(--ink)}
.ai-id .nm{font-size:17px;font-weight:600;line-height:1.2}
.ai-id .st{display:flex;align-items:center;gap:7px;margin-top:2px;font-size:14px;color:var(--muted)}
.ai-id .st i{width:8px;height:8px;border-radius:50%;background:#1FB985;box-shadow:0 0 0 3px rgba(31,185,133,.18)}
.ai-close{margin-left:auto;width:44px;height:44px;border-radius:14px;border:0;background:var(--mist);color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:background-color .2s}
.ai-close:hover{background:var(--mist-2)}
.ai-body{flex:1;min-height:160px;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:10px}
.ai-msg{max-width:86%;padding:12px 15px;border-radius:18px;font-size:16px;line-height:1.45}
.ai-msg.bot{align-self:flex-start;background:var(--mist);color:var(--ink);border-bottom-left-radius:6px}
.ai-msg.user{align-self:flex-end;background:var(--cobalt);color:#fff;border-bottom-right-radius:6px}
.ai-msg.typing{display:flex;gap:5px;padding:16px 16px}
.ai-msg.typing i{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:aiDot 1s ease-in-out infinite}
.ai-msg.typing i:nth-child(2){animation-delay:.15s}.ai-msg.typing i:nth-child(3){animation-delay:.3s}
@keyframes aiDot{50%{opacity:.25;transform:translateY(-2px)}}
.ai-go{align-self:flex-start;display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;background:var(--cobalt-tint);color:var(--cobalt-2);font-size:15px;font-weight:600}
.ai-go:hover{background:#DDE1FF}
.ai-quick{display:flex;flex-wrap:wrap;gap:8px;padding:12px 18px 4px;border-top:1px solid var(--line)}
.ai-quick button{min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--line-2);background:#fff;color:var(--ink-2);font-size:15px;font-weight:500;cursor:pointer;transition:border-color .2s,color .2s}
.ai-quick button:hover{border-color:var(--cobalt);color:var(--cobalt)}
.ai-ask{display:flex;gap:8px;padding:10px 14px 6px 18px}
.ai-ask input{flex:1;min-width:0;height:48px;padding:0 18px;border-radius:999px;border:1px solid var(--line-2);background:#fff;font-size:16px}
.ai-ask input:focus{outline:none;border-color:var(--cobalt);box-shadow:0 0 0 4px rgba(35,53,255,.12)}
.ai-send{width:48px;height:48px;flex:none;border-radius:50%;border:0;background:var(--mist);color:var(--muted);display:grid;place-items:center;cursor:pointer;transition:background-color .2s,color .2s}
.ai-ask.has-text .ai-send{background:var(--cobalt);color:#fff}
.ai-note{padding:4px 18px 14px;font-size:13px;line-height:1.45;color:var(--muted)}
.ai-panel :focus-visible{outline-color:var(--cobalt)}

/* ---------- mobile bar ---------- */
.mbar{display:none}

/* ---------- page transitions (same-origin navigations) ---------- */
@media (prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto}
  ::view-transition-old(root){animation:vtOut .2s ease both}
  ::view-transition-new(root){animation:vtIn .45s var(--ease) both}
}
@keyframes vtOut{to{opacity:0}}
@keyframes vtIn{from{opacity:0;transform:translateY(12px)}}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .ftr-top{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ftr-brand,.ftr-cta{grid-column:1/-1}
}
@media (max-width:1040px){
  :root{--hdr:64px}
  .nav{display:none}
  .menu-btn{display:grid}
  .hdr-cta{margin-left:auto;min-height:44px;padding:0 18px;font-size:15px}
  .brand{font-size:20px;gap:8px}
  .brand-mark{width:28px;height:28px}
  .cta-card{grid-template-columns:minmax(0,1fr);border-radius:32px}
  .ct-body{order:-1;padding:18px 8px 8px}
  .ct-media{min-height:0;display:flex;flex-direction:column}
  .ct-scene{position:relative;inset:auto;aspect-ratio:1/1;max-height:460px;width:100%}
  .ct-founder{position:relative;left:auto;bottom:auto;width:auto;margin:0 12px 12px;box-shadow:var(--sh-1)}
}
@media (max-width:900px){
  .sub-hero-in{grid-template-columns:minmax(0,1fr)}
  .sub-hero::after{background-position:58% 50%}
}
@media (max-width:760px){
  .ftr-top{grid-template-columns:1fr 1fr;gap:30px 20px}
  .ftr-top>div.ftr-nav{grid-column:1/-1}
  .ftr-mark{--rl:22px}
  .ftr{padding-bottom:calc(28px + 80px)}
  .sub-act{flex-direction:column}
  .sub-act .btn{width:100%}
  .ai-fab{display:none}
  .ai-panel{left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));width:auto;max-height:calc(100dvh - 90px);border-radius:24px}
  .mbar{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:65;display:flex;gap:8px;padding:6px;border-radius:999px;background:rgba(255,255,255,.88);-webkit-backdrop-filter:saturate(1.6) blur(16px);backdrop-filter:saturate(1.6) blur(16px);box-shadow:0 14px 40px -14px rgba(11,18,51,.4),inset 0 0 0 1px rgba(11,18,51,.07);transition:transform .45s var(--ease),opacity .3s}
  .mbar.away{transform:translateY(calc(100% + 24px));opacity:0;pointer-events:none}
  .mbar-cta{flex:1;min-height:52px}
  .mbar-chat{width:52px;height:52px;flex:none;border-radius:50%;border:0;background:var(--cobalt);color:#fff;display:grid;place-items:center;cursor:pointer}
  .mbar-chat .ic{width:24px;height:24px}
  .contact{padding-top:28px}
  .cta-card{padding:12px;border-radius:28px;gap:20px}
  .ct-body{padding:20px 10px 6px}
  .ct-media{border-radius:20px}
  .ct-founder{margin:0 10px 10px;padding:14px 14px 8px}
  .cta-bg{display:none}
}
@media (max-width:420px){
  .more summary span{display:none}
  .brand-word{font-size:19px}
  .hdr-cta{padding:0 12px;font-size:14px}
  .hdr-in{gap:8px}
  .hdr .menu-btn{width:44px;height:44px}
}
@media (max-width:374px){
  .hdr-cta{display:none}
  .menu-btn{margin-left:auto}
}

/* ==== 20-hero.css ==== */
/* ==== home hero (owner: hero agent) · one full screen: cobalt band, centred copy, 3D laptop with a live dashboard, five cards on one route ====
   The hero is exactly one screen tall (100svh). The copy takes what it needs, the scene (.hs) takes the rest and the scene box
   (.hs-in) scales to fit that space both ways, so the laptop is always whole and centred. Everything in the scene is sized in cqw
   of .hs-in, so the static route lines up with the cards at every size.
   The copy is plain HTML/CSS (visible at once, LCP). The scene and the background shapes are aria-hidden; the intro is pure CSS with
   delays (--t) and only runs with JS on and motion allowed. Without JS or with reduced motion everything sits in its final state. */

.hero{position:relative;isolation:isolate;overflow:clip;color:#fff;background:var(--night);display:flex;flex-direction:column;height:100vh;height:100svh;min-height:540px;padding:var(--hdr) 0 clamp(12px,2.4vh,32px);border-radius:0 0 clamp(28px,4vw,56px) clamp(28px,4vw,56px)}
.hero-bg{position:absolute;inset:0;z-index:-1;overflow:hidden;
  background:
    radial-gradient(ellipse 55% 42% at 50% 66%,rgba(126,146,255,.46),transparent 70%),
    radial-gradient(ellipse 60% 45% at 30% 0%,rgba(98,118,255,.65),transparent 70%),
    linear-gradient(180deg,#2131F6 0%,#1826D2 34%,#0F1898 68%,#080D5C 100%)}
.hb-sheen{position:absolute;inset:-50%;background:conic-gradient(from 0deg at 50% 50%,transparent 0deg,rgba(255,255,255,.07) 35deg,transparent 80deg,transparent 180deg,rgba(150,170,255,.1) 225deg,transparent 275deg);animation:hbSpin 40s linear infinite}
@keyframes hbSpin{to{transform:rotate(360deg)}}
.hb-aura{position:absolute;aspect-ratio:1;border-radius:50%;pointer-events:none}
.hb-a1{left:-22%;top:-38%;width:72vmax;background:radial-gradient(closest-side,rgba(132,150,255,.4),rgba(132,150,255,0))}
.hb-a2{right:-26%;bottom:-44%;width:66vmax;background:radial-gradient(closest-side,rgba(92,196,255,.2),rgba(92,196,255,0))}
.hb-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:72px 72px;background-position:50% 0;-webkit-mask-image:linear-gradient(#000,rgba(0,0,0,.5) 40%,transparent 66%);mask-image:linear-gradient(#000,rgba(0,0,0,.5) 40%,transparent 66%)}
.hb-glow{position:absolute;left:50%;top:48%;width:min(1200px,130vw);aspect-ratio:2/1;translate:-50% 0;background:radial-gradient(closest-side,rgba(160,176,255,.3),transparent);pointer-events:none}

/* light dust: soft points that rise and fade */
.hb-dust i{position:absolute;left:var(--x);top:var(--y);width:var(--s);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#fff 0,rgba(255,255,255,.65) 38%,rgba(255,255,255,0) 72%);opacity:var(--o)}

/* ---------- levitating shapes: outer = place + pointer depth (--mx/--my from 21-hero.js), <b> = float ---------- */
.lv{position:absolute;z-index:0;display:block;left:var(--x);top:var(--y);width:var(--s);aspect-ratio:1;pointer-events:none;translate:calc(var(--mx,0)*var(--d,1)*1px) calc(var(--my,0)*var(--d,1)*1px)}
.lv b{position:absolute;inset:0;display:block;border-radius:50%}
/* glossy cobalt sphere */
.lv-orb b,.lv-ball b{background:
  radial-gradient(circle at 34% 27%,rgba(255,255,255,.95) 0,rgba(255,255,255,.5) 7%,rgba(255,255,255,0) 23%),
  radial-gradient(circle at 70% 84%,rgba(150,168,255,.9) 0,rgba(150,168,255,0) 44%),
  radial-gradient(circle at 40% 36%,#6D7BFF 0,#3444FF 34%,#1624C8 68%,#0A1172 100%);
  box-shadow:0 20px 34px -16px rgba(2,4,40,.7)}
/* far, out-of-focus sphere: gives the band depth */
.lv-far b{background:radial-gradient(circle at 36% 30%,rgba(150,166,255,.55) 0,rgba(70,88,255,.32) 38%,rgba(22,36,200,.12) 70%,rgba(22,36,200,0) 100%);filter:blur(6px)}
/* white pearl */
.lv-pearl b{background:radial-gradient(circle at 34% 28%,#fff 0,#F3F5FF 15%,#C8CFFF 47%,#8391F2 78%,#5968DC 100%);box-shadow:0 14px 24px -12px rgba(2,4,40,.6)}
/* glass bubble */
.lv-bub b{background:
  radial-gradient(circle at 31% 25%,rgba(255,255,255,.9) 0,rgba(255,255,255,.22) 11%,rgba(255,255,255,0) 25%),
  radial-gradient(circle at 50% 50%,rgba(255,255,255,0) 50%,rgba(190,202,255,.2) 74%,rgba(255,255,255,.55) 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}
/* glossy capsule */
.lv-pill{aspect-ratio:2.5/1;rotate:-32deg}
.lv-pill b{border-radius:999px;background:
  radial-gradient(ellipse 58% 38% at 42% 24%,rgba(255,255,255,.8),rgba(255,255,255,0) 72%),
  linear-gradient(180deg,#6573FF 0,#2B3CFF 46%,#111C9E 100%);
  box-shadow:inset 0 -5px 12px rgba(4,8,70,.45),0 18px 30px -14px rgba(2,4,40,.65)}
/* glass ring (torus): tilted, the sheen runs round it */
.lv-ring b{perspective:600px}
.lv-ring s{position:absolute;inset:0;display:block;border-radius:50%;transform:rotateX(64deg) rotateY(-16deg);
  background:conic-gradient(from 200deg,#fff,rgba(170,184,255,.45) 20%,rgba(255,255,255,.1) 44%,rgba(140,158,255,.6) 68%,rgba(255,255,255,.95) 90%,#fff);
  -webkit-mask:radial-gradient(closest-side,transparent 61%,#000 63.5%,#000 96%,transparent 99%);mask:radial-gradient(closest-side,transparent 61%,#000 63.5%,#000 96%,transparent 99%)}
/* the two shapes that sit beside the copy (wide screens only), under the text layer */
.hero-in .lv{z-index:-1}
.lv-ring{left:calc(50% + clamp(300px,25vw,420px));top:52%;width:clamp(70px,6.6vw,124px)}
.lv-ball{right:calc(50% + clamp(310px,26vw,440px));top:70%;width:clamp(30px,2.8vw,52px)}

/* ---------- copy ---------- */
.hero-in{position:relative;z-index:2;flex:none;display:flex;flex-direction:column;align-items:center;text-align:center;padding-top:clamp(14px,3.4vh,52px)}
.hero-kick{display:none;align-items:center;gap:10px;margin-bottom:clamp(14px,2.2vh,24px);padding:9px 16px 9px 12px;border-radius:999px;background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);font:500 15px/1.2 var(--f);color:rgba(255,255,255,.92)}
@media (min-height:860px){.hero-kick{display:inline-flex}}
.hero-pulse{position:relative;width:8px;height:8px;border-radius:50%;background:#7CF0B5}
.hero-pulse::after{content:'';position:absolute;inset:0;border-radius:50%;background:#7CF0B5;animation:heroPulse 2.4s ease-out infinite}
@keyframes heroPulse{0%{opacity:.7;transform:scale(1)}70%,100%{opacity:0;transform:scale(3.2)}}
.hero-h{font-size:clamp(32px,min(4.8vw,7.6vh),64px);line-height:1.02;letter-spacing:-.045em;font-weight:600;text-wrap:balance}
.hero-mbr{display:none}
.hero-sub{margin-top:clamp(10px,1.8vh,20px);font-size:clamp(17px,min(1.45vw,2.6vh),21px);line-height:1.45;color:rgba(255,255,255,.86);text-wrap:balance}
.hero-yl{color:var(--yellow);font-weight:600;white-space:nowrap}
.hero-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:clamp(16px,2.8vh,30px)}
.hero-alt .ic{display:none}
@media (max-height:800px){.hero-cta .btn-lg{min-height:54px;font-size:17px}}

/* ---------- scene: .hs fills the rest of the screen, .hs-in is the biggest box of ratio --ar that fits in it ---------- */
.hs{position:relative;z-index:1;flex:1 1 0;min-height:0;margin-top:clamp(8px,2.2vh,28px);container-type:size;display:grid;place-items:center;perspective:1400px;pointer-events:none;user-select:none}
.hs-in{--ar:2.3;--side:140px;position:relative;width:min(100cqw - 2*var(--gut) - var(--side),calc(var(--ar)*100cqh),1800px);aspect-ratio:var(--ar);container-type:inline-size;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transform-origin:50% 55%}

/* laptop */
.hs-lap{position:absolute;z-index:1;left:22.5cqw;top:2cqw;width:55cqw;perspective:130cqw;perspective-origin:50% calc(100% - 1.25cqw)}
.hs-light{position:absolute;left:-30%;right:-30%;top:-18%;bottom:-30%;z-index:-1;background:radial-gradient(closest-side,rgba(190,202,255,.55),rgba(120,140,255,.18) 55%,transparent);pointer-events:none}
.hs-lid{position:relative;transform-origin:50% 100%;transform-style:preserve-3d}
.hs-scr{position:relative;background:#0A0D1F;border-radius:1.4cqw 1.4cqw .35cqw .35cqw;padding:.85cqw .85cqw 1.25cqw;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),0 4cqw 7cqw -3cqw rgba(0,0,30,.8);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.hs-scr::before{content:'';position:absolute;top:.3cqw;left:50%;width:.4cqw;height:.4cqw;margin-left:-.2cqw;border-radius:50%;background:#262B45}
.hs-view{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:.35cqw;background:#F5F7FC;container-type:inline-size}
.hs-view::after{content:'';position:absolute;inset:0;background:linear-gradient(115deg,rgba(255,255,255,.18) 0%,rgba(255,255,255,0) 38%);pointer-events:none}
.hs-glare{position:absolute;inset:0;z-index:3;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.55) 48%,rgba(255,255,255,.1) 56%,transparent 70%);opacity:0;pointer-events:none}
.hs-dark{position:absolute;inset:0;z-index:2;background:#05081E;opacity:0;pointer-events:none}
.hs-back{position:absolute;inset:0;border-radius:1.4cqw 1.4cqw .35cqw .35cqw;background:linear-gradient(180deg,#E9ECF4,#B9C0D2);transform:rotateX(180deg);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.hs-back i{position:absolute;left:50%;top:50%;width:4cqw;height:4cqw;margin:-2cqw 0 0 -2cqw;border-radius:50%;background:rgba(255,255,255,.45)}
.hs-base{position:relative;height:1.25cqw;margin-inline:-3.8cqw;background:linear-gradient(180deg,#EEF0F6 0%,#C7CCDA 45%,#8E95AB 100%);border-radius:.15cqw .15cqw 1.4cqw 1.4cqw/.15cqw .15cqw 1cqw 1cqw;box-shadow:0 1.4cqw 2.4cqw -1cqw rgba(0,0,30,.45)}
.hs-base::before{content:'';position:absolute;left:50%;top:0;width:15%;height:38%;translate:-50% 0;background:#B3B9CA;border-radius:0 0 .8cqw .8cqw}
.hs-base::after{content:'';position:absolute;left:3.8cqw;right:3.8cqw;bottom:100%;height:.75cqw;border-radius:.5cqw .5cqw 0 0;background:linear-gradient(180deg,#DCE0EA,#AAB1C4);opacity:0}
/* soft shadow on the "road" under the floating laptop */
.hs-floor{position:absolute;z-index:0;left:50%;top:40.2cqw;width:62cqw;height:3.2cqw;translate:-50% -50%;border-radius:50%;background:radial-gradient(closest-side,rgba(2,4,46,.62),rgba(2,4,46,.26) 55%,rgba(2,4,46,0))}

/* dashboard inside the screen (cqw = % of the screen width) */
.db{position:absolute;inset:0;display:flex;flex-direction:column;color:var(--ink);font-family:var(--f);text-align:left;line-height:1.25}
.db-bar{display:flex;align-items:center;gap:2cqw;height:6.6cqw;padding:0 2.8cqw;background:#fff;border-bottom:1px solid #E6E9F2;flex:none}
.db-brand{display:flex;align-items:center;gap:1.1cqw;font-size:1.8cqw;font-weight:600;letter-spacing:-.02em;white-space:nowrap}
.db-mk{width:3.4cqw;height:3.4cqw}
.db-tabs{display:flex;gap:.4cqw;margin-left:1cqw}
.db-tabs i{font-style:normal;font-size:1.35cqw;color:var(--muted);padding:.65cqw 1.3cqw;border-radius:99px}
.db-tabs .on{background:var(--cobalt-tint);color:var(--cobalt);font-weight:600}
.db-month{margin-left:auto;display:flex;align-items:center;gap:.8cqw;font-size:1.4cqw;font-weight:500;padding:.75cqw 1.4cqw;border:1px solid #E1E5EF;border-radius:99px}
.db-month svg{width:1.6cqw;height:1.6cqw;fill:none;stroke:var(--cobalt);stroke-width:2;stroke-linecap:round}
.db-body{flex:1;display:flex;flex-direction:column;gap:1.8cqw;padding:2.2cqw 2.8cqw 2.6cqw;min-height:0}
.db-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:1.6cqw}
.db-kpis li,.db-card{background:#fff;border-radius:1.3cqw;box-shadow:0 .1cqw .3cqw rgba(11,18,51,.06),0 .8cqw 2cqw -1cqw rgba(11,18,51,.16)}
.db-kpis li{padding:1.5cqw 1.7cqw 1.6cqw}
.db-l{display:flex;align-items:center;gap:.8cqw;font-size:1.3cqw;color:var(--muted);white-space:nowrap}
.db-ic{width:2.4cqw;height:2.4cqw;border-radius:.7cqw;background:var(--cobalt-tint);display:grid;place-items:center;flex:none}
.db-ic svg{width:1.5cqw;height:1.5cqw;fill:none;stroke:var(--cobalt);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.db-v{display:block;margin-top:1.1cqw;font-size:3.6cqw;line-height:1;font-weight:600;letter-spacing:-.035em;font-variant-numeric:tabular-nums;white-space:nowrap}
.db-v small{font-size:.55em;font-weight:500;margin-right:.12em;color:var(--muted);letter-spacing:0}
.db-g .db-ic{background:var(--cobalt)}.db-g .db-ic svg{stroke:#fff}
.db-row{flex:1;display:grid;grid-template-columns:1.75fr 1fr;gap:1.6cqw;min-height:0}
.db-card{display:flex;flex-direction:column;min-height:0;padding:1.6cqw 1.8cqw 1.4cqw}
.db-h{font-size:1.45cqw;font-weight:600;letter-spacing:-.01em}
.db-plot{position:relative;flex:1;margin-top:1.2cqw}
.db-grid{position:absolute;inset:0;background:repeating-linear-gradient(to bottom,#EDF0F6 0 1px,transparent 1px 25%)}
.db-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.db-line{fill:none;stroke:var(--cobalt);stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0}
.db-peak{position:absolute;left:100%;top:17.1%;width:1.3cqw;height:1.3cqw;margin:-.65cqw 0 0 -.65cqw;border-radius:50%;background:var(--cobalt);box-shadow:0 0 0 .35cqw #fff,0 0 0 .8cqw rgba(35,53,255,.18)}
.db-x{display:flex;justify-content:space-between;margin-top:.8cqw;font-size:1.1cqw;color:#8A91AB}
.db-cols{flex:1;display:grid;grid-template-columns:repeat(7,1fr);gap:.9cqw;margin-top:1.2cqw;min-height:0}
.db-cols li{display:grid;grid-template-rows:1fr auto;justify-items:center;gap:.7cqw;min-height:0}
.db-cols i{align-self:end;width:100%;height:var(--h);border-radius:.55cqw .55cqw .2cqw .2cqw;background:var(--cobalt);transform-origin:50% 100%}
.db-cols li:not(.hi) i{background:#C5CCF6}
.db-cols .hi i{background:linear-gradient(180deg,#5664FF,var(--cobalt))}
.db-cols span{font-size:1.1cqw;color:#8A91AB}

/* route: every segment starts and ends under a card, so it always meets the card edge whatever the card height */
.hs-route{position:absolute;inset:0;z-index:2;width:100%;height:100%;overflow:visible;display:none;--sw:.13}
.hs-route path{fill:none;stroke:#fff;stroke-opacity:.85;stroke-width:var(--sw);stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}
.hs-route .rt-w{stroke-opacity:1;stroke-width:calc(var(--sw)*2.8)}
.hs-route .rt-c{stroke:var(--cobalt);stroke-opacity:1}
.rt-end{fill:var(--cobalt);stroke:#fff;stroke-width:calc(var(--sw)*1.6);transform-box:fill-box;transform-origin:center}
.rt-d5{display:block}

/* cards */
.hc{position:absolute;z-index:3;transform:translate3d(calc(var(--px,0)*var(--z,1)*1px),calc(var(--py,0)*var(--z,1)*1px),0)}
.hc-a{position:relative;background:rgba(255,255,255,.97);color:var(--ink);border-radius:max(12px,1.25cqw);padding:max(10px,.95cqw);box-shadow:inset 0 1px 0 #fff,0 .15cqw .4cqw rgba(3,6,60,.12),0 2.2cqw 4.4cqw -1.6cqw rgba(3,6,60,.62);text-align:left}
.hc-l{display:flex;align-items:center;gap:max(7px,.6cqw);font-size:max(13px,1.1cqw);font-weight:600;line-height:1.2;letter-spacing:-.01em;white-space:nowrap}
.hc-n{display:grid;place-items:center;width:max(20px,1.6cqw);height:max(20px,1.6cqw);border-radius:50%;background:var(--cobalt);color:#fff;font-style:normal;font-size:max(11px,.85cqw);font-weight:600;flex:none}

/* 1 map */
.hc-map{left:3.5cqw;top:2cqw;width:16.5cqw;z-index:3}
.map{position:relative;margin-top:max(8px,.8cqw);border-radius:max(8px,.8cqw);overflow:hidden;aspect-ratio:5/3}
.map svg{display:block;width:100%;height:100%}
.map-pin{position:absolute;left:47%;top:30%;width:18%;aspect-ratio:1;translate:-50% -85%;color:var(--cobalt)}
.map-pin svg{position:relative;width:100%;height:100%;fill:var(--cobalt);stroke:#fff;stroke-width:1.6;filter:drop-shadow(0 .3cqw .4cqw rgba(11,18,51,.3))}
.map-pin svg circle{fill:#fff;stroke:none}
.map-ring{position:absolute;left:50%;top:92%;width:130%;aspect-ratio:2/1;translate:-50% -50%;border-radius:50%;background:rgba(35,53,255,.28)}
.map-no{position:absolute;left:58%;top:6%;padding:.25em .55em;border-radius:99px;background:var(--cobalt);color:#fff;font-size:max(13px,1.05cqw);font-weight:700;line-height:1.1;box-shadow:0 .4cqw .9cqw -.3cqw rgba(11,18,51,.45);transform-origin:0 100%}

/* 2 browser + phone */
.hc-web{left:1cqw;top:21cqw;width:23cqw;z-index:4}
.hc-web .hc-a{padding:0;overflow:visible}
.hc-tab{position:absolute;left:max(10px,.9cqw);bottom:calc(100% - max(8px,.6cqw));padding:max(6px,.45cqw) max(12px,.9cqw) max(6px,.45cqw) max(6px,.45cqw);border-radius:99px;background:#fff;box-shadow:0 .8cqw 1.8cqw -.8cqw rgba(3,6,60,.5)}
.bw-bar{display:flex;align-items:center;gap:max(4px,.35cqw);height:max(22px,1.9cqw);padding:0 max(8px,.8cqw);border-radius:max(12px,1.25cqw) max(12px,1.25cqw) 0 0;background:#EEF1F8}
.bw-bar i{width:max(6px,.5cqw);height:max(6px,.5cqw);border-radius:50%;background:#C9D0E3}
.bw-bar span{flex:1;height:52%;margin-left:max(6px,.6cqw);max-width:48%;border-radius:99px;background:#fff}
.hc-web img{width:100%;border-radius:0 0 max(12px,1.25cqw) max(12px,1.25cqw)}
.hc-ph{left:18cqw;top:26.5cqw;width:7.4cqw;z-index:5}
.hc-ph .hc-a{padding:max(3px,.42cqw);border-radius:max(16px,1.5cqw);background:#0A0D1F;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.16),0 2.4cqw 4cqw -1.6cqw rgba(0,0,30,.75)}
.ph-v{position:relative;aspect-ratio:390/844;overflow:hidden;border-radius:max(13px,1.15cqw);background:#F6EFE3}
.ph-v::before{content:'';position:absolute;z-index:2;top:2.6%;left:50%;width:30%;height:3.2%;translate:-50% 0;border-radius:99px;background:#000}
.ph-v img{width:100%;height:100%;object-fit:cover;object-position:top}

/* 3 chat */
.hc-chat{left:76cqw;top:30.5cqw;width:20cqw;z-index:4}
.ch-q{margin:max(8px,.8cqw) 0 0 auto;width:fit-content;max-width:90%;padding:max(6px,.5cqw) max(10px,.85cqw);border-radius:max(12px,1cqw) max(12px,1cqw) max(4px,.3cqw) max(12px,1cqw);background:var(--mist-2);font-size:max(13px,1.05cqw);line-height:1.3}
.ch-a{position:relative;display:flex;align-items:flex-end;gap:max(6px,.5cqw);margin-top:max(6px,.55cqw);min-height:max(28px,2.4cqw)}
.ch-av{display:grid;place-items:center;width:max(22px,1.8cqw);height:max(22px,1.8cqw);border-radius:50%;background:var(--cobalt-tint);flex:none}
.ch-av svg{width:62%;height:62%;fill:var(--cobalt)}
.ch-r{padding:max(6px,.5cqw) max(10px,.85cqw);border-radius:max(12px,1cqw) max(12px,1cqw) max(12px,1cqw) max(4px,.3cqw);background:var(--cobalt);color:#fff;font-size:max(13px,1.05cqw);line-height:1.3;transform-origin:0 100%}
.ch-dots{position:absolute;left:calc(max(22px,1.8cqw) + max(6px,.5cqw));bottom:0;display:flex;gap:max(3px,.28cqw);padding:max(9px,.75cqw) max(10px,.85cqw);border-radius:max(12px,1cqw) max(12px,1cqw) max(12px,1cqw) max(4px,.3cqw);background:var(--mist-2);opacity:0}
.ch-dots i{width:max(5px,.42cqw);height:max(5px,.42cqw);border-radius:50%;background:#8A91AB}

/* 4 calendar */
.hc-cal{left:79.5cqw;top:17.5cqw;width:16cqw;z-index:3}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:max(3px,.3cqw);margin-top:max(8px,.8cqw)}
.cal span{font-size:max(11px,.8cqw);font-weight:600;color:#8A91AB;text-align:center;line-height:1.6}
.cal i{position:relative;height:max(14px,1.15cqw);border-radius:max(4px,.35cqw);background:var(--mist);overflow:hidden}
.cal .tk{background:#DCE1EE}
.cal-go{display:grid;place-items:center}
.cal-go::before{content:'';position:absolute;inset:0;background:var(--cobalt);transform-origin:0 50%}
.cal-go svg{position:relative;width:80%;height:80%;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}

/* 5 post (far card: smaller, a touch soft) */
.hc-post{left:82.5cqw;top:1cqw;width:12.5cqw;z-index:2;filter:blur(.4px)}
.hc-post .hc-a{box-shadow:inset 0 1px 0 #fff,0 1.6cqw 3cqw -1.4cqw rgba(3,6,60,.5)}
.post-img{margin-top:max(8px,.7cqw);border-radius:max(8px,.7cqw);overflow:hidden;aspect-ratio:16/11}
.post-img svg{display:block;width:100%;height:100%}
.post-ft{display:flex;align-items:center;gap:max(8px,.7cqw);margin-top:max(7px,.6cqw)}
.post-like{position:relative;display:grid;width:max(18px,1.45cqw);height:max(18px,1.45cqw)}
.post-like svg{width:100%;height:100%;fill:#FF4D6D;stroke:#FF4D6D;stroke-width:1.6;stroke-linejoin:round}
.post-c{width:max(18px,1.45cqw);height:max(18px,1.45cqw)}
.post-c svg{width:100%;height:100%;fill:none;stroke:#8A91AB;stroke-width:1.8;stroke-linejoin:round}
.ht{position:absolute;left:15%;top:10%;width:70%;height:70%;opacity:0;background:#FF4D6D;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 20s-7.5-4.6-7.5-10A4.3 4.3 0 0 1 12 7.4 4.3 4.3 0 0 1 19.5 10c0 5.4-7.5 10-7.5 10z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 20s-7.5-4.6-7.5-10A4.3 4.3 0 0 1 12 7.4 4.3 4.3 0 0 1 19.5 10c0 5.4-7.5 10-7.5 10z'/%3E%3C/svg%3E") center/contain no-repeat}

@container (max-width:1100px){.ch-x{display:none}}
@container (max-width:320px){.ch-av{display:none}.ch-dots{left:0}}

/* ---------- small desktop scene (the box is under 900px wide): three cards ---------- */
@container (max-width:900px){
  .hc-cal,.hc-post{display:none}
  .hc-map{left:1cqw;top:0;width:19cqw}
  .hc-web{left:0;top:22cqw;width:25cqw}
  .hc-ph{left:19cqw;top:27cqw;width:7cqw}
  .hc-chat{left:75cqw;top:13cqw;width:25cqw}
  .ch-q{max-width:none}
  .ch-x{display:none}
  .rt-d5{display:none}.rt-d3{display:block}
  .hs-route{--sw:.2}
}

/* ---------- intro + levitation (JS on + motion allowed only) ---------- */
@media (prefers-reduced-motion:no-preference){
  html.js .hs-in{animation:hsIn 1.1s var(--ease) .15s both}
  html.js .hs-lid{animation:hsLid 1.4s cubic-bezier(.45,.02,.12,1) .45s both}
  html.js .hs-base::after{animation:hsEdge .35s ease-in .5s both}
  html.js .hs-light{animation:hsFade 1.4s ease-out 1.45s both}
  html.js .hs-dark{animation:hsPower .8s ease-out 1.55s both}
  html.js .hs-glare{animation:hsGlare 1.2s cubic-bezier(.4,0,.2,1) 1.5s both}
  html.js .db-line{animation:hsDraw 1.9s cubic-bezier(.5,0,.25,1) 2s both}
  html.js .db-fill{animation:hsWipe 1.9s cubic-bezier(.5,0,.25,1) 2.1s both}
  html.js .db-peak{animation:hsPop .6s cubic-bezier(.3,1.6,.5,1) 3.7s both}
  html.js .db-cols i{animation:hsBar 1s var(--ease) calc(2.2s + var(--i)*80ms) both}
  html.js .hs-lap{animation:lapFloat 7s ease-in-out 2.4s infinite}
  html.js .hs-floor{animation:hsFade 1.2s ease-out 1s both,floorBreath 7s ease-in-out 2.4s infinite}

  html.js .hs-route path{animation:hsDraw var(--l) cubic-bezier(.45,0,.3,1) var(--t) both}
  html.js .rt-end{animation:hsPop .5s cubic-bezier(.3,1.6,.5,1) var(--t) both,hsBeat 2.4s ease-in-out calc(var(--t) + .5s) infinite}

  html.js .hc-a{animation:hcIn .9s var(--ease) var(--t) both,hcBob 8s ease-in-out var(--f) infinite alternate}
  html.js .hc-post .hc-a{animation-duration:.9s,10s}
  html.js .map-pin{animation:hcDrop .7s cubic-bezier(.3,1.5,.5,1) calc(var(--t) + .35s) both}
  html.js .map-ring{animation:hcRing 2.6s ease-out calc(var(--t) + .9s) infinite}
  html.js .map-no{animation:hsPop .55s cubic-bezier(.3,1.7,.5,1) calc(var(--t) + .8s) both}
  html.js .ch-dots{animation:chDots 1.15s linear calc(var(--t) + .35s) both}
  html.js .ch-dots i{animation:chBounce .6s ease-in-out calc(var(--t) + .35s) 3}
  html.js .ch-dots i:nth-child(2){animation-delay:calc(var(--t) + .5s)}
  html.js .ch-dots i:nth-child(3){animation-delay:calc(var(--t) + .65s)}
  html.js .ch-r{animation:hsPop .5s cubic-bezier(.3,1.4,.5,1) calc(var(--t) + 1.45s) both}
  html.js .cal-go::before{animation:calFill .6s var(--ease) calc(var(--t) + .5s) both}
  html.js .cal-go svg{animation:hsPop .45s cubic-bezier(.3,1.6,.5,1) calc(var(--t) + .95s) both}
  html.js .post-like svg{animation:hsPop .5s cubic-bezier(.3,1.8,.5,1) calc(var(--t) + .4s) both}
  html.js .ht{animation:heartUp 1.5s cubic-bezier(.2,.6,.3,1) calc(var(--t) + .5s) both}
  html.js .ht:nth-of-type(2){--hx2:-70%;animation-delay:calc(var(--t) + .68s)}
  html.js .ht:nth-of-type(3){--hx2:80%;animation-delay:calc(var(--t) + .86s)}

  html.js .hb-a1{animation:hbDrift1 28s ease-in-out infinite alternate}
  html.js .hb-a2{animation:hbDrift2 34s ease-in-out infinite alternate}
  html.js .hb-dust i{opacity:0;animation:hbDust var(--d) linear var(--dl) infinite}
  html.js .lv b{animation:lvIn 1.2s cubic-bezier(.3,1.35,.5,1) var(--in) both,lvFloat var(--fd) ease-in-out var(--fl) infinite}
  html.js .lv-pill b{animation-name:lvIn,lvTilt}
  html.js .lv-ring s{animation:lvSpin 18s linear infinite}

  .hs.off *,.hero:has(.hs.off) .hero-bg *,.hero:has(.hs.off) .lv *,.hero:has(.hs.off) .hero-pulse::after{animation-play-state:paused!important}
}
@keyframes hsIn{from{opacity:0;translate:0 4cqw}}
@keyframes hsLid{from{transform:rotateX(-90deg)}}
@keyframes hsEdge{from{opacity:1}}
@keyframes hsFade{from{opacity:0}}
@keyframes hsPower{0%{opacity:1}35%{opacity:.35}100%{opacity:0}}
@keyframes hsGlare{0%{opacity:0;transform:translateX(-70%)}25%{opacity:1}100%{opacity:0;transform:translateX(70%)}}
@keyframes hsDraw{0%{stroke-dashoffset:1;opacity:0}.5%{opacity:1}100%{stroke-dashoffset:0}}
@keyframes hsWipe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes hsBar{from{transform:scaleY(0)}}
@keyframes hsPop{from{opacity:0;transform:scale(.3)}}
@keyframes hsBeat{50%{transform:scale(1.8);opacity:.55}}
@keyframes lapFloat{50%{translate:0 -.8cqw}}
@keyframes floorBreath{50%{scale:.86 .8;opacity:.62}}
@keyframes hcIn{from{opacity:0;transform:translateY(2.2cqw) scale(.94)}}
@keyframes hcBob{from{translate:0 -.6cqw}to{translate:0 .6cqw}}
@keyframes hcDrop{from{opacity:0;transform:translateY(-60%)}}
@keyframes hcRing{0%{opacity:.9;transform:scale(.3)}80%,100%{opacity:0;transform:scale(1.25)}}
@keyframes chDots{0%{opacity:0}12%,86%{opacity:1}100%{opacity:0}}
@keyframes chBounce{50%{transform:translateY(-45%)}}
@keyframes calFill{from{transform:scaleX(0)}}
@keyframes heartUp{0%{opacity:0;transform:translate(0,0) scale(.5)}18%{opacity:1}100%{opacity:0;transform:translate(var(--hx2,10%),-260%) scale(1)}}
@keyframes hbDrift1{to{transform:translate3d(16vw,10vh,0) scale(1.12)}}
@keyframes hbDrift2{to{transform:translate3d(-14vw,-12vh,0) scale(.9)}}
@keyframes hbDust{0%{opacity:0;transform:translate3d(0,0,0)}18%,80%{opacity:var(--o)}100%{opacity:0;transform:translate3d(1.2vw,-24vh,0)}}
@keyframes lvIn{from{opacity:0;scale:.4}}
@keyframes lvFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-18px,0)}}
@keyframes lvTilt{0%,100%{transform:translate3d(0,0,0) rotate(0deg)}50%{transform:translate3d(4px,-16px,0) rotate(7deg)}}
@keyframes lvSpin{from{transform:rotateX(64deg) rotateY(-16deg) rotateZ(0deg)}to{transform:rotateX(64deg) rotateY(-16deg) rotateZ(360deg)}}

/* ---------- layouts ---------- */
@media (max-width:1100px){
  .lv-ring,.lv-ball{display:none}
  .lv-orb{--y:34%!important}
  .lv-pearl{--y:37%!important}
}
/* phones and portrait tablets: a taller scene, laptop wide, map and chat above its corners, phone in front */
@media (max-width:699px),(orientation:portrait) and (max-width:1100px){
  .hs-in{--ar:1.1;--side:0px}
  .hs-lap{left:8cqw;top:30cqw;width:84cqw}
  .hs-floor{top:86.4cqw;width:92cqw;height:5cqw}
  .hc-web,.hc-cal,.hc-post{display:none}
  .hc-map{left:0;top:0;width:36cqw}
  .hc-chat{left:56cqw;top:0;width:44cqw}
  .hc-ph{left:76cqw;top:45cqw;width:19cqw}
  .ch-q{max-width:none}
  .ch-x{display:none}
  .rt-d5,.rt-d3{display:none}.rt-m{display:block}
  .hs-route{--sw:.42}
  .hc-a{border-radius:14px}
  .lv-orb,.lv-pearl,.lv-far{display:none}
  .lv-ring,.lv-ball{display:block}
  .lv-ring{left:calc(50% + 262px);top:62%;width:64px}
  .lv-ball{right:calc(50% + 268px);top:74%;width:30px}
  .lv-pill{--x:-2.5%!important;--y:66%!important}
  .lv-bub{--x:91%!important;--y:54%!important}
}
@media (max-width:560px){
  .hero-in{padding-top:clamp(10px,2vh,24px)}
  .hero-mbr{display:inline}
  .hero-h{font-size:clamp(26px,8.1vw,38px);line-height:1.06}
  .hero-sub{max-width:30ch;margin-top:10px;font-size:17px}
  .hero-cta{width:100%;flex-direction:column;align-items:center;gap:2px;margin-top:18px}
  .hero-cta .btn-y{width:100%;min-height:54px;font-size:17px}
  .lv-ring,.lv-ball{display:none}
  .lv-pearl{display:block;--x:3%!important;--y:calc(var(--hdr) + 108px)!important;--s:20px!important}
  .lv-bub{--x:88%!important;--y:calc(var(--hdr) + 236px)!important;--s:46px!important}
  .lv-pill{--x:-5%!important;--y:calc(var(--hdr) + 250px)!important;--s:60px!important}
  .hero-alt{min-height:44px;padding:0 8px;background:none;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;font-size:16px;font-weight:500;color:rgba(255,255,255,.9)}
  .hero-alt .ic{display:block;width:17px;height:17px}
  .hero-kick{font-size:14px}
  .hero-donly{display:none}
}
@media (max-width:560px) and (max-height:600px){.hero-alt{display:none}}

/* ==== 25-quiz.css ==== */
/* ---------- QUIZ „Кой план е за вас?“ · v5 cobalt band with a white app card (owner: ceni agent) ---------- */
.qz-sec{padding-block:clamp(8px,2vw,24px) clamp(20px,3vw,40px)}
.qz-band{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:clamp(28px,5vw,80px);align-items:center;padding:clamp(24px,4.4vw,64px);border-radius:44px;color:#fff;background:radial-gradient(ellipse 60% 60% at 85% 10%,rgba(120,140,255,.5),transparent 70%),linear-gradient(150deg,#2536FF 0%,#1826D2 45%,#0C148C 100%);box-shadow:0 80px 80px -50px rgba(35,53,255,.75)}
.qz-roads{position:absolute;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none}
.qz-roads path{fill:none;stroke:rgba(255,255,255,.14);stroke-width:1.5;stroke-dasharray:6 10;vector-effect:non-scaling-stroke}
.qz-band>.qz-head :focus-visible{outline-color:#fff}
.qz-eye{color:rgba(255,255,255,.88)}
.qz-eye .stop{background:var(--yellow);box-shadow:0 0 0 5px rgba(255,212,59,.22)}
.qz-head .h2{color:#fff;max-width:12ch}
.qz-sum{display:grid;gap:10px;margin-top:clamp(28px,3vw,40px);max-width:440px}
.qz-sum li{display:grid;grid-template-columns:32px auto minmax(0,1fr);align-items:center;gap:14px;padding:12px 16px 12px 12px;border-radius:18px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);font-size:16px;transition:background-color .35s var(--ease),color .35s var(--ease)}
.qz-sum i{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:600;font-size:15px;background:rgba(255,255,255,.14)}
.qz-sum span{font-weight:500;color:rgba(255,255,255,.8)}
.qz-sum b{font-weight:600;text-align:right;color:rgba(255,255,255,.6)}
.qz-sum li.is-set{background:#fff;color:var(--ink);box-shadow:none}
.qz-sum li.is-set i{background:var(--cobalt);color:#fff}
.qz-sum li.is-set span{color:var(--muted)}
.qz-sum li.is-set b{color:var(--ink)}
html:not(.js) .qz-sum{display:none}

.qz-card{position:relative;min-height:470px;padding:clamp(22px,3vw,38px);border-radius:30px;background:#fff;color:var(--ink);box-shadow:0 50px 100px -40px rgba(3,6,60,.7)}
.qz-top{display:flex;align-items:center;gap:16px;min-height:44px;margin-bottom:26px}
.qz-bar{flex:1;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.qz-bar i{position:relative;height:8px;border-radius:4px;background:var(--mist-2);overflow:hidden}
.qz-bar i::after{content:'';position:absolute;inset:0;border-radius:inherit;background:var(--cobalt);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.qz-bar i.on::after{transform:none}
.qz-back{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border:0;border-radius:999px;background:var(--mist);font-size:15px;font-weight:600;color:var(--ink-2);cursor:pointer;transition:background-color .2s}
.qz-back:hover{background:var(--mist-2)}
.qz-back .ic{width:17px;height:17px;rotate:180deg}
.qz-back[hidden]{display:none}

.qz-q{margin:0;padding:0;border:0;min-width:0}
html.js .qz-q:not(.is-on){display:none}
html.js .qz-q.is-on{animation:qzIn .45s var(--ease) both}
@keyframes qzIn{from{opacity:0;transform:translateY(12px)}}
.qz-q legend{display:block;padding:0;margin-bottom:22px;font-size:clamp(26px,2.4vw,34px);font-weight:600;letter-spacing:-.035em;line-height:1.12}
.qz-q legend:focus{outline:0}
.qz-n{display:block;margin-bottom:12px;font:600 13px/1 var(--f);letter-spacing:.08em;text-transform:uppercase;color:var(--cobalt)}
.qz-opts{display:grid;gap:10px}
.qz-o{display:flex;align-items:center;gap:14px;width:100%;min-height:64px;padding:12px 20px 12px 16px;border:0;border-radius:18px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line);font-size:18px;font-weight:500;text-align:left;color:var(--ink);cursor:pointer;transition:box-shadow .25s,background-color .25s,transform .25s var(--ease)}
.qz-o i{position:relative;width:24px;height:24px;flex:none;border-radius:50%;box-shadow:inset 0 0 0 2px var(--line-2);transition:box-shadow .25s}
.qz-o i::after{content:'';position:absolute;inset:6px;border-radius:50%;background:var(--cobalt);transform:scale(0);transition:transform .25s var(--ease)}
@media (hover:hover) and (pointer:fine){.qz-o:hover{box-shadow:inset 0 0 0 1.5px var(--cobalt);transform:translateX(3px)}}
.qz-o[aria-pressed="true"]{background:var(--cobalt-tint);box-shadow:inset 0 0 0 2px var(--cobalt)}
.qz-o[aria-pressed="true"] i{box-shadow:inset 0 0 0 2px var(--cobalt)}
.qz-o[aria-pressed="true"] i::after{transform:none}

.qz-result:empty{display:none}
.qz-card.is-done .qz-result{animation:qzIn .5s var(--ease) both}
.qz-res-top{margin-bottom:12px}
.qz-plan{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:var(--cobalt-tint);color:var(--cobalt);font:600 13px/1 var(--f);letter-spacing:.06em;text-transform:uppercase}
.qz-plan::before{content:'';width:8px;height:8px;border-radius:50%;background:currentColor}
.qz-res-row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 18px}
.qz-res-h{font-size:clamp(30px,2.8vw,40px);font-weight:600;letter-spacing:-.04em;line-height:1.05}
.qz-res-h:focus{outline:0}
.qz-price{display:flex;align-items:baseline;gap:6px}
.qz-price b{font-size:clamp(48px,4.4vw,64px);line-height:.95;font-weight:600;letter-spacing:-.055em;background:linear-gradient(transparent 64%,var(--yellow) 64% 90%,transparent 90%);padding-inline:4px;margin-inline:-4px}
.qz-price span{font-size:18px;font-weight:500;color:var(--muted)}
.qz-why{margin-top:12px;font-size:16px;line-height:1.45;color:var(--muted)}
.qz-list{margin-top:16px}
.qz-list li{display:flex;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--line);font-size:17px}
.qz-list li::before{content:'';flex:none;width:20px;height:20px;border-radius:50%;background:var(--cobalt-tint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232335FF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4L18 8'/%3E%3C/svg%3E") center/14px no-repeat}
.qz-term{display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:8px 14px;border-radius:14px;background:var(--mist);font-size:15px;font-weight:500;color:var(--ink-2)}
.qz-acts{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:22px}
.qz-acts .btn{white-space:normal;text-align:center;line-height:1.2}
.qz-again{min-height:44px;padding:0 6px;border:0;background:none;font-size:16px;font-weight:600;color:var(--cobalt);text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(35,53,255,.3);cursor:pointer}
.qz-again:hover{text-decoration-color:currentColor}
.qz-nojs{font-size:16px;color:var(--muted)}
.qz-nojs a{color:var(--cobalt);text-decoration:underline}
html.js .qz-nojs{display:none}
html:not(.js) .qz-q,html:not(.js) .qz-top{display:none}
html:not(.js) .qz-card{min-height:0}

@media (max-width:900px){
  .qz-band{grid-template-columns:1fr;border-radius:32px}
  .qz-head .h2{max-width:none}
  .qz-sum{max-width:none}
  .qz-card{min-height:0}
}
@media (max-width:560px){
  .qz-band{padding:28px 16px 16px;border-radius:28px}
  .qz-head{padding-inline:6px}
  .qz-sum li{grid-template-columns:28px auto minmax(0,1fr);gap:10px;font-size:15px;padding:10px 12px 10px 10px}
  .qz-sum i{width:28px;height:28px;font-size:14px}
  .qz-card{padding:20px 18px 22px;border-radius:24px}
  .qz-o{min-height:58px;font-size:17px}
  .qz-acts .btn{width:100%}
}

/* ==== 30-home.css ==== */
/* WhiteWays v5 · home sections below the hero (owner: home agent). Ported from raw/v5/v5b/style.css, every class prefixed hm- */

/* ---------- global route rail (built by 30-home.js, wide screens only) ---------- */
.hm-main{position:relative;display:block}
.hm-route{position:absolute;left:0;top:0;z-index:0;pointer-events:none;display:none;overflow:visible}
.hm-route.on{display:block}
.hm-rt-track{fill:none;stroke:var(--line-2);stroke-width:1.6;stroke-dasharray:5 8}
.hm-rt-fill{fill:none;stroke:var(--cobalt);stroke-width:2.4;stroke-linecap:round}
.hm-rt-stops line{stroke:var(--line-2);stroke-width:1.6;stroke-dasharray:3 5;transition:stroke .4s}
.hm-rt-stops circle{fill:#fff;stroke:var(--line-2);stroke-width:2;transition:fill .4s,stroke .4s}
.hm-rt-stops .on line{stroke:var(--cobalt);stroke-dasharray:none}
.hm-rt-stops .on circle{fill:var(--cobalt);stroke:var(--cobalt)}
.hm-rt-car{fill:var(--cobalt);stroke:#fff;stroke-width:3;filter:drop-shadow(0 0 10px rgba(35,53,255,.55))}
.hm-rt-pin path{fill:var(--yellow);stroke:var(--ink);stroke-width:1.6}
.hm-rt-pin circle{fill:var(--ink)}
.hm-rt-pin{opacity:.35;transition:opacity .5s}
.hm-rt-pin.on{opacity:1}

/* ---------- shared device mockups ---------- */
.hm-browser{background:#fff;border-radius:16px;overflow:hidden;box-shadow:var(--sh-2),inset 0 0 0 1px var(--line)}
.hm-bbar{display:flex;align-items:center;gap:6px;height:36px;padding:0 14px;background:#F7F8FC;border-bottom:1px solid var(--line)}
.hm-bbar i{width:10px;height:10px;border-radius:50%;background:#D8DCE8}
.hm-bbar span{margin-inline:auto;translate:-15px 0;font-size:13px;line-height:1;color:var(--muted);background:#fff;border:1px solid var(--line);border-radius:8px;padding:5px 16px}
.hm-browser img{width:100%}
.hm-laptop{position:relative}
.hm-lp-screen{position:relative;background:#0A0D1F;border-radius:18px 18px 4px 4px;padding:1.5% 1.5% 2.2%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 50px 90px -40px rgba(0,0,30,.8)}
.hm-lp-screen::before{content:'';position:absolute;top:.65%;left:50%;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:#262B45}
.hm-lp-view{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:5px;background:#000}
.hm-lp-view img{width:100%}
.hm-lp-base{position:relative;height:clamp(9px,1.4vw,17px);margin-inline:-6.5%;background:linear-gradient(180deg,#EEF0F6 0%,#C7CCDA 45%,#8E95AB 100%);border-radius:2px 2px 18px 18px/2px 2px 14px 14px;box-shadow:0 26px 40px -14px rgba(0,0,30,.55)}
.hm-lp-base::before{content:'';position:absolute;left:50%;top:0;width:15%;height:38%;translate:-50% 0;background:#B3B9CA;border-radius:0 0 10px 10px}
.hm-phone{position:relative;background:#0A0D1F;border-radius:clamp(22px,3.4vw,40px);padding:clamp(5px,.7vw,9px);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.16),0 34px 60px -24px rgba(0,0,30,.7)}
.hm-ph-view{position:relative;aspect-ratio:9/19.5;overflow:hidden;border-radius:clamp(17px,2.8vw,32px);background:#000}
.hm-ph-view::before{content:'';position:absolute;z-index:2;top:3%;left:50%;width:32%;height:3.4%;translate:-50% 0;border-radius:99px;background:#000}
.hm-ph-view img{width:100%}
@media (prefers-reduced-motion:no-preference){
  .hm-scroller{animation:hmSiteScroll var(--dur,24s) ease-in-out 1.5s infinite alternate}
}
@keyframes hmSiteScroll{0%,8%{transform:translateY(0)}30%,38%{transform:translateY(calc(var(--max) * .3))}62%,70%{transform:translateY(calc(var(--max) * .66))}92%,100%{transform:translateY(var(--max))}}
.hm-card-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:10px}
.hm-card-h b{font-size:17px;font-weight:600;line-height:1.25}
.hm-card-h span{font-size:14px;color:var(--muted);white-space:nowrap}

/* ---------- 0 · industries ---------- */
.hm-ind{padding-top:clamp(64px,8vw,110px)}
.hm-ind-cap{display:flex;align-items:center;gap:16px;margin-bottom:22px;font:600 14px/1 var(--f);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.hm-ind-cap::after{content:'';flex:1;height:1px;background:var(--line)}
.hm-ind-row{display:grid;grid-template-columns:repeat(8,1fr);gap:14px;padding-bottom:30px}
.hm-ind-row li:nth-child(even){margin-top:30px;margin-bottom:-30px}
.hm-ind-row figure{position:relative}
.hm-ind-ph{aspect-ratio:3/4;border-radius:22px;overflow:hidden;background:var(--mist-2)}
.hm-ind-row img{width:100%;height:100%;object-fit:cover;filter:saturate(.9) contrast(1.04);transform:scale(1.14)}
.hm-ind-row figcaption{position:absolute;left:10px;bottom:10px;padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.93);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:14px;font-weight:600;line-height:1.2;color:var(--ink)}
@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline:view()){
    .hm-ind-row img{animation:hmPar linear both;animation-timeline:view()}
    .hm-ind-row li:nth-child(even) img{animation-name:hmPar2}
  }
}
@keyframes hmPar{from{transform:scale(1.14) translateY(-6%)}to{transform:scale(1.14) translateY(6%)}}
@keyframes hmPar2{from{transform:scale(1.14) translateY(7%)}to{transform:scale(1.14) translateY(-7%)}}

/* ---------- 1 · services bento ---------- */
.hm-svc{padding-top:clamp(72px,9vw,130px)}
.hm-bento{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:330px;gap:20px}
.hm-tile{position:relative;isolation:isolate;display:flex;flex-direction:column;border-radius:30px;background:var(--mist);overflow:hidden;container-type:inline-size;box-shadow:inset 0 0 0 1px rgba(11,18,51,.035);transition:box-shadow .45s var(--ease),translate .45s var(--ease)}
.hm-tile::after{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(35,53,255,.09),transparent 60%);opacity:0;transition:opacity .35s}
@media (hover:hover) and (pointer:fine){
  .hm-tile:hover{box-shadow:inset 0 0 0 1.5px rgba(35,53,255,.25),var(--sh-2);translate:0 -4px}
  .hm-tile:hover::after{opacity:1}
  .hm-tile:hover .hm-cnt{background:var(--cobalt);color:#fff;box-shadow:none}
}
.hm-tile:has(a:focus-visible){outline:3px solid var(--cobalt);outline-offset:3px}
.hm-t-web{grid-column:1/8;grid-row:span 2;background:linear-gradient(165deg,#E9ECFF 0%,#F4F5FC 55%,#F3F5FA 100%)}
.hm-t-google{grid-column:8/13}
.hm-t-ai{grid-column:8/13}
.hm-t-shop{grid-column:1/5}
.hm-t-ads{grid-column:5/9}
.hm-t-brand{grid-column:9/13;grid-row:span 2;background:linear-gradient(180deg,var(--mist) 0%,#EEF0F8 100%)}
.hm-t-auto{grid-column:1/5}
.hm-t-care{grid-column:5/9}
.hm-tile-txt{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:flex-start;gap:14px;padding:26px 28px 0}
.hm-tile h3{font-size:22px;line-height:1.2;font-weight:600;letter-spacing:-.018em;max-width:15ch}
.hm-tile h3 a{outline:none}
.hm-tile h3 a::after{content:'';position:absolute;inset:0;z-index:4}
.hm-cnt{flex:none;font:600 14px/1 var(--f);padding:8px 11px;border-radius:999px;background:#fff;color:var(--cobalt);box-shadow:inset 0 0 0 1px var(--line);transition:background-color .3s,color .3s}
.hm-viz{position:relative;flex:1;min-height:0}
/* web */
.hm-w-browser{position:absolute;left:12%;right:-8%;top:40px}
.hm-w-phone{position:absolute;left:5%;bottom:-70px;width:24%;max-width:170px}
.hm-w-badge{position:absolute;right:6%;bottom:28px;display:inline-flex;gap:8px;align-items:center;padding:11px 16px;border-radius:999px;background:var(--ink);color:#fff;font-size:15px;font-weight:600;box-shadow:var(--sh-2)}
.hm-w-badge .ic{width:18px;height:18px;color:#9FB0FF;stroke-width:2.4}
/* google */
.hm-t-google .hm-tile-txt{background:linear-gradient(var(--mist) 60%,transparent);padding-bottom:18px}
.hm-map{position:absolute;inset:0;width:100%;height:100%}
.hm-g-card{position:absolute;left:24px;bottom:22px;width:min(300px,72%);padding:10px;border-radius:18px;background:#fff;box-shadow:var(--sh-2)}
.hm-g-q{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:999px;background:var(--mist);font-size:15px;color:var(--ink-2)}
.hm-g-q .ic{width:18px;height:18px;color:var(--cobalt)}
.hm-g-res{display:flex;align-items:center;gap:12px;padding:10px 4px 2px}
.hm-g-res img{width:52px;height:52px;border-radius:12px;object-fit:cover;flex:none}
.hm-g-res b{display:block;font-size:16px;font-weight:600;line-height:1.25}
.hm-g-res small{display:block;font-size:14px;color:#127A4B;font-weight:500}
/* ai */
.hm-chat{position:absolute;inset:18px 28px 24px;display:flex;flex-direction:column;justify-content:flex-end;gap:10px}
.hm-bub{max-width:85%;padding:12px 16px;border-radius:20px;font-size:16px;line-height:1.4}
.hm-q{align-self:flex-end;background:var(--cobalt);color:#fff;border-bottom-right-radius:6px}
.hm-a{display:flex;gap:10px;align-items:flex-start;background:#fff;color:var(--ink);border-bottom-left-radius:6px;box-shadow:var(--sh-1)}
.hm-ai-av{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:var(--cobalt-tint);color:var(--cobalt);flex:none}
.hm-ai-av .ic{width:17px;height:17px}
.hm-chat-time{font:500 14px/1 var(--f);color:var(--muted);padding-left:4px}
/* shop */
.hm-t-shop .hm-viz{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:18px 24px 0;align-items:end}
.hm-prod{align-self:end;background:#fff;border-radius:18px 18px 0 0;padding:8px 8px 10px;box-shadow:var(--sh-1)}
.hm-prod-img{border-radius:12px;overflow:hidden;aspect-ratio:4/4.2;background:#F1EAE0}
.hm-prod-img img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.hm-prod-row{display:flex;justify-content:space-between;align-items:center;gap:6px;padding:10px 4px 2px}
.hm-prod-row b{font-size:15px;font-weight:600;line-height:1.2}
.hm-btn-mini{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--cobalt);color:#fff;flex:none}
.hm-btn-mini .ic{width:18px;height:18px}
.hm-ship{align-self:center;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:6px;padding-bottom:24px}
.hm-ship-n{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:#fff;color:var(--ink-2);box-shadow:var(--sh-1)}
.hm-ship-n.on{background:var(--cobalt);color:#fff}
.hm-ship-line{width:100%;height:10px;overflow:visible}
.hm-ship-line path{stroke:var(--cobalt);stroke-width:2.4;fill:none}
.hm-ship p{grid-column:1/-1;margin-top:12px;padding:10px 12px;border-radius:14px;background:#fff;box-shadow:var(--sh-1)}
.hm-ship p b{display:block;font-size:15px;font-weight:600}
.hm-ship p small{display:flex;align-items:center;gap:6px;font-size:14px;color:#127A4B;font-weight:500}
.hm-ship p small::before{content:'';width:8px;height:8px;border-radius:50%;background:#1FA463}
/* ads */
.hm-post{position:absolute;left:24px;top:16px;width:min(54%,226px);background:#fff;border-radius:18px;box-shadow:var(--sh-2);overflow:hidden}
.hm-post-h{display:flex;align-items:center;gap:9px;padding:10px 12px}
.hm-post-h i{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:700;font-size:14px;background:#FCE4EC;color:#9C2150}
.hm-post-h b{display:block;font-size:14px;line-height:1.2}
.hm-post-h small{display:block;font-size:13px;color:var(--muted);line-height:1.2}
.hm-post-img{aspect-ratio:4/3;overflow:hidden}
.hm-post-img img{width:100%;height:100%;object-fit:cover}
.hm-post-f{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px 34px;font-size:14px;font-weight:500}
.hm-post-f em{font-style:normal;font-weight:600;color:#fff;background:var(--cobalt);padding:6px 10px;border-radius:8px;font-size:13px}
.hm-spark{position:absolute;right:20px;top:44px;width:min(42%,168px);padding:14px 14px 10px;border-radius:16px;background:#fff;box-shadow:var(--sh-1)}
.hm-spark small{display:block;font-size:14px;font-weight:600;color:var(--ink-2);margin-bottom:6px}
.hm-spark svg{width:100%;height:auto}
/* brand */
.hm-reel{position:absolute;left:50%;top:24px;bottom:-30px;aspect-ratio:9/16;translate:-50% 0;border-radius:24px;overflow:hidden;box-shadow:var(--sh-2);max-width:86%}
.hm-reel img{width:100%;height:100%;object-fit:cover}
.hm-rec{position:absolute;left:14px;top:14px;display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:8px;background:rgba(0,0,0,.45);color:#fff;font:600 13px/1 var(--f);letter-spacing:.06em;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.hm-rec i{width:8px;height:8px;border-radius:50%;background:#FF4D4D}
.hm-reel-play{position:absolute;left:50%;top:44%;width:62px;height:62px;translate:-50% -50%;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.9);color:var(--ink);box-shadow:0 10px 30px rgba(0,0,0,.25)}
.hm-reel-play .ic{width:26px;height:26px;margin-left:4px}
.hm-reel-bar{position:absolute;left:14px;right:14px;bottom:52px;height:4px;border-radius:4px;background:rgba(255,255,255,.35);overflow:hidden}
.hm-reel-bar i{display:block;width:38%;height:100%;background:#fff;border-radius:4px}
.hm-swatch{position:absolute;left:18px;bottom:26px;display:flex;align-items:center;gap:8px;padding:10px 14px 10px 12px;border-radius:18px;background:#fff;box-shadow:var(--sh-2)}
.hm-aa{font-size:26px;font-weight:600;letter-spacing:-.04em;line-height:1;margin-right:4px}
.hm-swatch i{width:26px;height:26px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 1px rgba(11,18,51,.1)}
/* automations */
.hm-flow{position:absolute;inset:0 24px;display:grid;grid-template-columns:repeat(3,1fr);align-items:center}
.hm-flow-line{position:absolute;left:10%;right:10%;top:calc(50% - 30px);width:80%;height:60px;overflow:visible}
.hm-node{position:relative;display:grid;justify-items:center;gap:10px}
.hm-node i{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:#fff;color:var(--ink-2);box-shadow:var(--sh-1)}
.hm-node i.on{background:var(--cobalt);color:#fff;box-shadow:0 14px 30px -10px rgba(35,53,255,.6)}
.hm-node .ic{width:24px;height:24px}
.hm-node small{font-size:14px;font-weight:600;color:var(--ink-2)}
/* care */
.hm-care{position:absolute;inset:0 26px 26px;display:flex;align-items:center;gap:22px}
.hm-shield{position:relative;width:112px;height:112px;flex:none;border-radius:34px;display:grid;place-items:center;background:linear-gradient(160deg,#3444FF,#1B2AE0);color:#fff;box-shadow:0 20px 40px -16px rgba(35,53,255,.7)}
.hm-shield::before{content:'';position:absolute;inset:-10px;border-radius:42px;border:1.5px dashed rgba(35,53,255,.3)}
.hm-shield .ic{width:52px;height:52px;stroke-width:1.5}
.hm-care-l{display:grid;gap:8px}
.hm-care-l li{display:flex;align-items:center;gap:8px;padding:9px 14px 9px 10px;border-radius:12px;background:#fff;font-size:15px;font-weight:500;box-shadow:var(--sh-1);white-space:nowrap}
.hm-care-l .ic{width:17px;height:17px;color:#1FA463;stroke-width:2.6}
@container (max-width:380px){
  .hm-care{gap:14px}
  .hm-shield{width:84px;height:84px;border-radius:26px}
  .hm-shield .ic{width:40px;height:40px}
  .hm-care-l li{font-size:14px;padding:8px 12px 8px 9px}
  .hm-t-shop .hm-viz{gap:10px;padding-inline:18px}
}
@container (min-width:700px){
  .hm-w-browser{left:20%;right:-3%}
  .hm-w-phone{left:7%;width:20%}
}
.hm-more-link{margin-top:36px;text-align:center}
.hm-more-link .ic,.hm-more-head .ic{width:19px;height:19px}

/* ---------- 2 · work ---------- */
.hm-cases{display:grid;gap:32px}
.hm-case{position:sticky;top:calc(var(--hdr) + 22px + var(--i)*16px);display:grid;grid-template-columns:5fr 7fr;min-height:600px;border-radius:38px;background:var(--bg);color:var(--fg);overflow:hidden;isolation:isolate;transform-origin:50% 0;transform:scale(calc(1 - var(--p,0)*.045));box-shadow:0 40px 90px -50px rgba(11,18,51,calc(.5 - var(--p,0)*.5))}
.hm-case::after{content:'';position:absolute;inset:0;z-index:5;background:#050817;opacity:calc(var(--p,0)*.4);pointer-events:none}
.hm-case::before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 60% 70% at 72% 60%,var(--glow),transparent 70%);opacity:.9}
.hm-case-txt{display:flex;flex-direction:column;padding:52px 20px 52px 56px}
.hm-case-n{display:flex;align-items:center;gap:16px;flex-wrap:wrap;font:600 15px/1 var(--f);letter-spacing:.12em;color:var(--ac)}
.hm-live{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;font-size:14px;letter-spacing:.02em;font-weight:600;color:var(--fg);background:color-mix(in srgb,var(--fg) 10%,transparent)}
.hm-live::before{content:'';width:8px;height:8px;border-radius:50%;background:#34D27B;box-shadow:0 0 0 4px rgba(52,210,123,.22)}
.hm-case-name{margin-top:auto;font-size:clamp(46px,6.2vw,94px);line-height:.95;letter-spacing:-.05em;font-weight:600;text-wrap:balance}
.hm-case-meta{margin-top:22px;font-size:20px;font-weight:500}
.hm-case-feat{margin-top:4px;font-size:18px;opacity:.86}
.hm-case-light .hm-case-feat{opacity:1;color:#4A4236}
.hm-case-link{margin-top:30px;display:inline-flex;align-items:center;gap:8px;width:fit-content;min-height:50px;padding:0 22px;border-radius:999px;font-weight:600;font-size:17px;box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--fg) 34%,transparent);transition:background-color .25s,color .25s}
.hm-case-link:hover{background:var(--fg);color:var(--bg)}
.hm-case-link:focus-visible{outline-color:var(--fg)}
.hm-case-link .ic{width:18px;height:18px;stroke-width:2.2}
.hm-case-viz{position:relative;min-height:320px}
.hm-case-viz .hm-laptop{position:absolute;left:4%;top:13%;width:104%}
.hm-case-viz .hm-phone{position:absolute;left:-6%;bottom:9%;width:19%;z-index:2}

.hm-more{position:relative;z-index:1;margin-top:clamp(90px,10vw,140px)}
.hm-more-head{display:flex;justify-content:space-between;align-items:center;gap:16px 24px;flex-wrap:wrap;margin-bottom:34px}
.hm-more-head h3{font-size:clamp(26px,2.6vw,38px);line-height:1.1;letter-spacing:-.035em;font-weight:600}
.hm-mq{overflow:hidden;padding-block:10px 16px;padding-inline-start:max(var(--gut),calc((100vw - 1240px)/2));-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
html:not(.js) .hm-mq{overflow-x:auto}
.hm-mq+.hm-mq{margin-top:10px}
.hm-mq-track{display:flex;gap:24px;width:max-content;padding-inline:0 24px}
@media (prefers-reduced-motion:no-preference){
  .hm-mq-track.run{animation:hmMq 80s linear infinite}
  .hm-mq-rev .hm-mq-track.run{animation-direction:reverse;animation-duration:90s}
  .hm-mq:hover .hm-mq-track,.hm-mq:focus-within .hm-mq-track{animation-play-state:paused}
}
@media (prefers-reduced-motion:reduce){.hm-mq{overflow-x:auto;-webkit-mask-image:none;mask-image:none}}
@keyframes hmMq{to{transform:translateX(-50%)}}
.hm-mc{display:block;width:clamp(260px,26vw,380px)}
.hm-mc-shot{display:block;aspect-ratio:16/10;border-radius:18px;overflow:hidden;background:var(--mist);box-shadow:var(--sh-1),inset 0 0 0 1px var(--line);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.hm-mc-shot img{width:100%;height:100%;object-fit:cover;object-position:top}
.hm-mc:hover .hm-mc-shot{transform:translateY(-6px);box-shadow:var(--sh-2)}
.hm-mc-t{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-top:14px;font-size:15px;color:var(--muted)}
.hm-mc-t b{font-size:18px;font-weight:600;color:var(--ink);letter-spacing:-.01em}

/* ---------- 3 · how (winding road) ---------- */
.hm-road-wrap{position:relative}
.hm-road-wrap::before{content:'';position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:repeating-linear-gradient(var(--line-2) 0 6px,transparent 6px 14px)}
.hm-road-wrap.on::before{display:none}
.hm-road-svg{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.hm-rdw-band{fill:none;stroke:var(--mist);stroke-width:30;stroke-linecap:round}
.hm-rdw-track{fill:none;stroke:var(--line-2);stroke-width:2;stroke-dasharray:6 9}
.hm-rdw-fill{fill:none;stroke:var(--cobalt);stroke-width:3;stroke-linecap:round}
.hm-rdw-car{fill:var(--cobalt);stroke:#fff;stroke-width:3;filter:drop-shadow(0 0 10px rgba(35,53,255,.55))}
.hm-road{position:relative;display:grid;gap:clamp(64px,8vw,120px);padding-block:20px 40px}
.hm-rs{display:grid;grid-template-columns:1fr 150px 1fr;align-items:center}
.hm-rs-viz{grid-column:1;grid-row:1}
.hm-rs-node{grid-column:2;grid-row:1;justify-self:center}
.hm-rs-txt{grid-column:3;grid-row:1}
.hm-rs:nth-child(even) .hm-rs-viz{grid-column:3}
.hm-rs:nth-child(even) .hm-rs-txt{grid-column:1;text-align:right;justify-self:end}
.hm-rs:nth-child(odd) .hm-rs-node{translate:-22px 0}
.hm-rs:nth-child(even) .hm-rs-node{translate:22px 0}
.hm-rs-node{position:relative;z-index:2;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font:600 17px/1 var(--f);background:#fff;color:var(--muted);box-shadow:inset 0 0 0 1.5px var(--line-2),0 0 0 8px #fff;transition:background-color .5s,color .5s,box-shadow .5s}
.hm-rs-node.on,html:not(.js) .hm-rs-node{background:var(--cobalt);color:#fff;box-shadow:0 0 0 8px rgba(35,53,255,.14),0 12px 26px -8px rgba(35,53,255,.6)}
.hm-rs-pill{display:inline-block;margin-bottom:16px;padding:8px 12px;border-radius:999px;background:var(--cobalt-tint);color:var(--cobalt);font:600 13px/1 var(--f);letter-spacing:.05em;text-transform:uppercase}
.hm-rs-txt h3{font-size:clamp(30px,3.3vw,48px);line-height:1.04;letter-spacing:-.04em;font-weight:600;text-wrap:balance}
.hm-rs-txt p{margin-top:14px;max-width:22ch;font-size:20px;line-height:1.45;color:var(--muted)}
.hm-rs:nth-child(even) .hm-rs-txt p{margin-left:auto}
.hm-rs-viz{position:relative;isolation:isolate;aspect-ratio:5/4;border-radius:34px;overflow:hidden;background:var(--mist);box-shadow:inset 0 0 0 1px rgba(11,18,51,.04)}
.hm-v-audit{background:linear-gradient(170deg,#E4E8FF 0%,#EEF0FB 60%,#F3F5FA 100%)}
.hm-v-month{background:linear-gradient(190deg,#E4E8FF 0%,#EEF0FB 55%,#F3F5FA 100%)}
.hm-v-plan,.hm-v-launch{background:linear-gradient(160deg,#EDEFFF,#F4F5FB 60%)}
.hm-v-plan::before,.hm-v-launch::before{content:'';position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(11,18,51,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(11,18,51,.045) 1px,transparent 1px);background-size:40px 40px;-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 30%,transparent 80%);mask-image:radial-gradient(circle at 50% 50%,#000 30%,transparent 80%)}
html.js .hm-rs-viz.rv{transform:none;clip-path:inset(12% 9% 12% 9% round 34px)}
html.js .hm-rs-viz.rv.in{clip-path:inset(0 round 34px)}
.hm-scene{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
@media (prefers-reduced-motion:no-preference){
  .hm-lens{transform-box:view-box;transform-origin:382px 88px;transition:transform 1.4s var(--ease) .5s}
  html.js .hm-v-audit:not(.in) .hm-lens{transform:translate(-36px,26px) scale(.9)}
  html.js .hm-v-month:not(.in) .hm-bars i{transform:scaleY(.2)}
}
.hm-audit,.hm-report{position:absolute;left:28px;bottom:28px;width:min(340px,calc(100% - 56px));padding:20px;border-radius:22px;background:#fff;box-shadow:var(--sh-2)}
.hm-audit li{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--line);font-size:16px;font-weight:500}
.hm-audit li i{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;font-style:normal;font-weight:700;font-size:15px;flex:none}
.hm-audit li i .ic{width:17px;height:17px;stroke-width:2.6}
.hm-audit .ok i{background:#E3F6EC;color:#127A4B}
.hm-audit .no i{background:#FFF0E0;color:#A4520A}
.hm-audit .na i{background:var(--mist-2);color:var(--muted)}
.hm-pl-stack{position:absolute;inset:0 0 40px;display:grid;place-items:center}
.hm-pl{position:absolute;width:190px;padding:20px;border-radius:24px;background:#fff;box-shadow:var(--sh-2)}
.hm-pl small{display:block;font-size:16px;font-weight:600;color:var(--muted)}
.hm-pl b{display:block;margin-top:6px;font-size:36px;font-weight:600;letter-spacing:-.045em;line-height:1}
.hm-pl b span{font-size:15px;font-weight:500;letter-spacing:0;color:var(--muted)}
.hm-pl-a{translate:-90% 12%;rotate:-7deg}
.hm-pl-c{translate:90% 12%;rotate:7deg;text-align:right}
.hm-pl-a b,.hm-pl-c b{font-size:30px}
.hm-pl-b{z-index:2;width:236px;padding:24px 22px 22px;background:linear-gradient(160deg,#3142FF,#1B2AE0 60%,#1520B8);color:#fff}
.hm-pl-b small{color:rgba(255,255,255,.8)}
.hm-pl-b b{color:var(--yellow);font-size:46px}
.hm-pl-b b span{color:rgba(255,255,255,.8)}
.hm-pl-b em{position:absolute;top:-13px;left:22px;font:600 13px/1 var(--f);letter-spacing:.04em;text-transform:uppercase;font-style:normal;padding:7px 10px;border-radius:8px;background:#fff;color:var(--cobalt);box-shadow:var(--sh-1)}
.hm-pl-b ul{margin-top:16px;display:grid;gap:8px;font-size:15px}
.hm-pl-b li{display:flex;gap:8px;align-items:center}
.hm-pl-b li::before{content:'';width:6px;height:6px;border-radius:50%;background:#B9C2FF;flex:none}
.hm-pl-note{position:absolute;left:50%;bottom:28px;translate:-50% 0;display:inline-flex;gap:8px;align-items:center;padding:10px 16px;border-radius:999px;background:var(--ink);color:#fff;font-size:15px;font-weight:600;white-space:nowrap}
.hm-pl-note .ic{width:18px;height:18px;color:var(--yellow)}
.hm-l-browser{position:absolute;left:9%;right:-12%;top:34px}
.hm-launch{position:absolute;left:28px;bottom:28px;width:min(330px,calc(100% - 56px));padding:18px 22px 16px;border-radius:22px;background:#fff;box-shadow:var(--sh-2)}
.hm-lr{display:flex;align-items:center}
.hm-lr-dot{width:16px;height:16px;border-radius:50%;background:var(--line-2);flex:none}
.hm-lr-dot.on{background:var(--cobalt)}
.hm-lr-dot.pin{width:38px;height:38px;display:grid;place-items:center;background:var(--cobalt);color:#fff;box-shadow:0 0 0 6px rgba(35,53,255,.15)}
.hm-lr-dot.pin .ic{width:19px;height:19px}
.hm-lr-l{flex:1;height:2px;background:var(--line-2)}
.hm-lr-l.on{background:var(--cobalt)}
.hm-lr-t{display:flex;justify-content:space-between;margin-top:10px;font-size:14px;font-weight:600;color:var(--ink-2)}
.hm-domain{position:absolute;right:24px;bottom:150px;display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:16px;background:var(--ink);color:#fff;box-shadow:var(--sh-2)}
.hm-domain .ic{width:22px;height:22px;color:#AEB8FF}
.hm-domain b{display:block;font-size:15px}
.hm-domain small{display:block;font-size:14px;color:rgba(255,255,255,.75)}
.hm-report{left:auto;right:28px;width:min(262px,calc(100% - 56px))}
.hm-bars{display:flex;align-items:flex-end;gap:10px;height:92px;padding-top:6px}
.hm-bars i{flex:1;height:calc(var(--h)*100%);border-radius:7px 7px 3px 3px;background:linear-gradient(180deg,#5A68FF,var(--cobalt));transform-origin:50% 100%;transition:transform 1s var(--ease)}
.hm-bars i:nth-child(2){transition-delay:.08s}.hm-bars i:nth-child(3){transition-delay:.16s}.hm-bars i:nth-child(4){transition-delay:.24s}
.hm-rep-l{display:flex;justify-content:space-between;gap:14px;margin-top:12px;padding-top:10px;border-top:1px solid var(--line);font-size:14px;color:var(--muted)}
.hm-rep-l b{margin-left:4px;font-size:16px;color:var(--ink);font-weight:600}
.hm-rep-l span{white-space:nowrap}
.hm-report .hm-card-h{flex-direction:column;align-items:flex-start;gap:2px}
.hm-msg{position:absolute;left:28px;top:28px;display:flex;align-items:center;gap:12px;padding:12px 18px 12px 12px;border-radius:20px;background:rgba(255,255,255,.97);box-shadow:var(--sh-2);max-width:calc(100% - 56px)}
.hm-av{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;flex:none;font-style:normal;font-weight:700;font-size:18px;color:#fff;background:linear-gradient(150deg,#3A4BFF,#1420B5)}
.hm-msg b{display:block;font-size:15px;font-weight:600;line-height:1.25}
.hm-msg span{display:block;font-size:15px;color:var(--ink-2);line-height:1.35}

/* ---------- 4 · price ---------- */
.hm-price{background:linear-gradient(180deg,transparent,var(--mist) 22%,var(--mist) 100%)}
.hm-vs{display:flex;align-items:center;justify-content:center;gap:14px;max-width:780px;margin:0 auto clamp(44px,5vw,64px)}
.hm-vs>div{flex:1;padding:18px 22px;border-radius:22px}
.hm-vs small{display:block;font:600 13px/1.2 var(--f);letter-spacing:.05em;text-transform:uppercase}
.hm-vs p{margin-top:8px}
.hm-vs b{display:block;font-size:28px;font-weight:600;letter-spacing:-.035em;line-height:1.1}
.hm-vs b span{font-size:17px;font-weight:500;letter-spacing:0}
.hm-vs p>span{display:block;margin-top:4px;font-size:16px}
.hm-vs-a{background:#fff;color:var(--muted);box-shadow:inset 0 0 0 1px var(--line)}
.hm-vs-a b{color:var(--ink-2)}
.hm-vs-b{background:var(--ink);color:#fff}
.hm-vs-b small,.hm-vs-b p>span{color:rgba(255,255,255,.76)}
.hm-vs-b b{color:var(--yellow)}
.hm-vs-b b span{color:rgba(255,255,255,.8)}
.hm-vs-arrow{width:46px;height:46px;flex:none;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--cobalt);box-shadow:var(--sh-1)}
.hm-vs-arrow .ic{stroke-width:2.2}
.hm-plans{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(5,auto);column-gap:20px;align-items:start}
.hm-plan{position:relative;display:grid;grid-row:span 5;grid-template-rows:subgrid;row-gap:0;padding:36px 32px 32px;border-radius:32px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),var(--sh-1);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.hm-plan::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(380px circle at var(--mx,50%) var(--my,0%),rgba(35,53,255,.07),transparent 60%);opacity:0;transition:opacity .35s}
@media (hover:hover) and (pointer:fine){.hm-plan:hover{transform:translateY(-6px)}.hm-plan:hover::after{opacity:1}}
.hm-plan-h h3{font-size:26px;font-weight:600;letter-spacing:-.03em}
.hm-plan-h p{margin-top:6px;font-size:17px;color:var(--muted);line-height:1.4}
.hm-plan-p{display:flex;align-items:baseline;gap:8px;margin-top:26px}
.hm-plan-p b{font-size:clamp(60px,5.4vw,78px);line-height:.95;font-weight:600;letter-spacing:-.055em;background:linear-gradient(transparent 64%,var(--yellow) 64% 90%,transparent 90%);padding-inline:4px;margin-inline:-4px}
.hm-plan-p span{font-size:19px;font-weight:500;color:var(--muted)}
.hm-plan-act{margin-top:10px;font-size:15px;color:var(--muted)}
.hm-plan-l{margin-top:24px;margin-bottom:30px;align-self:start}
.hm-plan-l li{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-top:1px solid var(--line);font-size:17px;line-height:1.4}
.hm-plan-l li::before{content:'';flex:none;width:20px;height:20px;margin-top:1px;border-radius:50%;background:var(--cobalt-tint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232335FF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4L18 8'/%3E%3C/svg%3E") center/14px no-repeat}
.hm-plan>.btn{align-self:end}
.hm-plan-hot{background:linear-gradient(165deg,#3243FF 0%,#1F2EE6 45%,#1420B5 100%);color:#fff;box-shadow:0 40px 80px -40px rgba(35,53,255,.8)}
.hm-plan-hot::before{content:'';position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;background:conic-gradient(from var(--ang2),rgba(255,255,255,.9),rgba(255,255,255,.08) 25%,rgba(255,255,255,.08) 50%,rgba(170,185,255,.9) 70%,rgba(255,255,255,.08) 85%,rgba(255,255,255,.9));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:hmSpin2 7s linear infinite}
@keyframes hmSpin2{to{--ang2:360deg}}
@media (prefers-reduced-motion:reduce){.hm-plan-hot::before{animation:none}}
.hm-plan-hot .hm-plan-h p,.hm-plan-hot .hm-plan-act,.hm-plan-hot .hm-plan-p span{color:rgba(255,255,255,.8)}
.hm-plan-hot .hm-plan-p b{background:none;color:var(--yellow)}
.hm-plan-hot .hm-plan-l li{border-color:rgba(255,255,255,.16)}
.hm-plan-hot .hm-plan-l li::before{background-color:rgba(255,255,255,.16);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4L18 8'/%3E%3C/svg%3E")}
.hm-plan-hot :focus-visible{outline-color:#fff}
.hm-plan-badge{position:absolute;top:-14px;left:32px;padding:8px 12px;border-radius:10px;background:#fff;color:var(--cobalt);font:600 13px/1 var(--f);letter-spacing:.05em;text-transform:uppercase;box-shadow:var(--sh-1)}
.hm-pfacts{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 14px;margin-top:44px}
.hm-pfacts .chip{min-height:46px;padding:0 18px;gap:10px;font-size:16px}
.hm-pfacts .ic{color:var(--cobalt);width:19px;height:19px}
.hm-price-more{margin-top:26px;text-align:center}
.hm-price-more a{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:600;font-size:17px;color:var(--cobalt);text-decoration:underline;text-decoration-color:rgba(35,53,255,.35);text-underline-offset:5px;text-decoration-thickness:1.5px}
.hm-price-more a:hover{text-decoration-color:var(--cobalt)}
.hm-price-more .ic{width:18px;height:18px;stroke-width:2.2}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .hm-ind-row{grid-template-columns:repeat(4,1fr);padding-bottom:0}
  .hm-ind-row li:nth-child(even){margin-top:0;margin-bottom:0}
  .hm-t-web{grid-column:1/-1;grid-row:span 2}
  .hm-t-google,.hm-t-ai,.hm-t-shop,.hm-t-ads,.hm-t-auto,.hm-t-care{grid-column:span 6}
  .hm-t-brand{grid-column:span 6;grid-row:span 2}
  .hm-case{grid-template-columns:1fr 1.2fr}
}
@media (max-width:900px){
  .hm-rs{grid-template-columns:52px 1fr;column-gap:18px;row-gap:22px;align-items:start}
  .hm-rs-node,.hm-rs:nth-child(odd) .hm-rs-node,.hm-rs:nth-child(even) .hm-rs-node{grid-column:1;grid-row:1;translate:0 0;width:52px;height:52px;font-size:15px}
  .hm-rs-txt,.hm-rs:nth-child(even) .hm-rs-txt{grid-column:2;grid-row:1;text-align:left;justify-self:start;padding-top:2px}
  .hm-rs:nth-child(even) .hm-rs-txt p{margin-left:0}
  .hm-rs-viz,.hm-rs:nth-child(even) .hm-rs-viz{grid-column:1/-1;grid-row:2}
  .hm-rs-pill{margin-bottom:12px}
  .hm-road-wrap::before{left:26px}
  .hm-case{grid-template-columns:1fr;min-height:0}
  .hm-case-txt{padding:30px 28px 8px}
  .hm-case-name{margin-top:26px}
  .hm-case-viz{min-height:0;aspect-ratio:1.45}
  .hm-case-viz .hm-laptop{left:14%;top:10%;width:92%}
  .hm-case-viz .hm-phone{left:4%;bottom:6%;width:25%}
  .hm-plans{grid-template-columns:1fr;grid-template-rows:none;row-gap:28px;max-width:560px;margin-inline:auto}
  .hm-plan{grid-row:auto;grid-template-rows:none;display:flex;flex-direction:column}
  .hm-plan>.btn{margin-top:auto}
  .hm-plan-hot{order:-1}
}
@media (max-width:760px){
  .hm-ind-row{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gut);margin-inline:calc(-1*var(--gut));padding-inline:var(--gut);gap:12px;scrollbar-width:none}
  .hm-ind-row::-webkit-scrollbar{display:none}
  .hm-ind-row li{flex:0 0 148px;scroll-snap-align:start}
  .hm-bento{grid-template-columns:1fr;grid-auto-rows:auto;gap:16px}
  .hm-bento>.hm-tile{grid-column:1/-1;grid-row:auto;min-height:320px}
  .hm-bento>.hm-t-web{min-height:420px}
  .hm-bento>.hm-t-brand{min-height:480px}
  .hm-bento>.hm-t-ai{min-height:290px}
  .hm-bento>.hm-t-auto{min-height:250px}
  .hm-bento>.hm-t-care{min-height:290px}
  .hm-bento>.hm-t-ads{min-height:360px}
  .hm-tile-txt{padding:22px 22px 0}
  .hm-tile h3{font-size:21px}
  .hm-w-browser{left:8%;right:-14%;top:30px}
  .hm-w-phone{width:30%;bottom:-40px}
  .hm-w-badge{right:5%;bottom:20px;font-size:14px}
  .hm-care{inset:0 20px 22px}
  .hm-shield{width:96px;height:96px}
  .hm-flow{inset:0 12px}
  .hm-spark{top:64px}
  .hm-case-meta{font-size:18px}
  .hm-case-feat{font-size:17px}
  .hm-more-head{flex-direction:column;align-items:flex-start}
  .hm-mc{width:250px}
  .hm-mc-t{flex-direction:column;gap:2px;margin-top:12px}
  .hm-vs{flex-direction:column;align-items:stretch}
  .hm-vs-arrow{align-self:center;rotate:90deg}
  .hm-plan{padding:32px 24px 24px}
  .hm-pl{width:112px;padding:14px}
  .hm-pl b,.hm-pl-a b,.hm-pl-c b{font-size:22px}
  .hm-pl-a b span,.hm-pl-c b span{display:none}
  .hm-pl-b{width:156px;padding:22px 14px 18px}
  .hm-pl-b b{font-size:32px}
  .hm-pl-b ul{display:none}
  .hm-pl-a{translate:-92% 12%}
  .hm-pl-c{translate:92% 12%}
  .hm-rs-viz{aspect-ratio:auto;height:340px;border-radius:28px}
  .hm-v-audit{height:450px}
  .hm-v-month{height:420px}
  .hm-audit li.na{display:none}
  .hm-rs-txt h3{font-size:30px}
  .hm-rs-txt p{font-size:18px;margin-top:8px;max-width:none}
  .hm-domain{bottom:auto;top:16px;right:14px;padding:10px 12px}
  .hm-domain .ic{display:none}
  .hm-l-browser{top:84px;left:6%;right:-20%}
  .hm-audit,.hm-report,.hm-launch{left:14px;bottom:14px;width:calc(100% - 28px);padding:14px 16px}
  .hm-report{right:14px;width:auto}
  .hm-bars{height:64px}
  .hm-audit li{padding:7px 0;font-size:15px}
  .hm-msg{left:14px;top:14px;max-width:calc(100% - 28px)}
  .hm-pl-stack{inset:0 0 56px}
}

/* ==== 38-report.css ==== */
/* ---------- REPORT (.rep-): the monthly report of the fictional Бистро Смокиня, counts only ---------- */
.rep-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(40px,5.5vw,96px);align-items:center}
.rep-copy{display:grid;justify-items:start}
.rep-points{display:grid;gap:12px;margin:30px 0 34px}
.rep-points li{display:flex;align-items:center;gap:12px;font-size:17px;font-weight:500;color:var(--ink-2)}
.rep-points .ic{width:28px;height:28px;padding:5px;border-radius:50%;background:#E3F6EC;color:#1FA463;stroke-width:2.6}

.rep-dash{display:grid;gap:12px;padding:clamp(16px,2vw,26px);border-radius:28px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-2)}
.rep-top{display:flex;align-items:center;gap:12px;padding-bottom:6px}
.rep-logo{width:44px;height:44px;flex:none}
.rep-top p b{display:block;font-size:18px;font-weight:600;line-height:1.2;letter-spacing:-.01em}
.rep-top p small{display:block;font-size:14px;color:var(--muted)}
.rep-from{margin-left:auto;display:inline-flex;align-items:center;gap:8px;padding:5px 12px 5px 5px;border-radius:999px;background:var(--mist);font-size:14px;font-weight:600;color:var(--ink-2);white-space:nowrap}
.rep-from i{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--cobalt);color:#fff;font-style:normal;font-size:14px;font-weight:600}

.rep-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.rep-kpi{display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:18px;background:var(--mist)}
.rep-kpi span{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:#fff;color:var(--cobalt);margin-bottom:8px}
.rep-kpi span .ic{width:18px;height:18px}
.rep-kpi small{font-size:14px;line-height:1.3;color:var(--muted)}
.rep-kpi b{margin-top:auto;padding-top:4px;font-size:clamp(26px,2.3vw,34px);font-weight:600;line-height:1;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.rep-kpi.is-main{background:var(--cobalt);color:#fff}
.rep-kpi.is-main span{background:rgba(255,255,255,.16);color:#fff}
.rep-kpi.is-main small{color:rgba(255,255,255,.82)}

.rep-row{display:grid;grid-template-columns:1.45fr 1fr;gap:10px}
.rep-chart,.rep-ranks,.rep-next{padding:16px;border-radius:18px;background:var(--mist)}
.rep-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.rep-h b{font-size:15px;font-weight:600}
.rep-h small{font-size:14px;color:var(--muted)}
.rep-bars{display:flex;align-items:flex-end;gap:8px;height:120px;margin-top:30px}
.rep-bars i{position:relative;flex:1;height:calc(var(--h) * 100%);border-radius:8px 8px 3px 3px;background:#C5CCF6;transform-origin:bottom}
.rep-bars i.is-top{background:var(--cobalt)}
.rep-bars em{position:absolute;left:50%;top:-21px;translate:-50% 0;font-style:normal;font-size:13px;font-weight:600;line-height:1;color:var(--muted)}
.rep-bars i.is-top em{color:var(--cobalt)}
.rep-days{display:flex;gap:8px;margin-top:8px}
.rep-days span{flex:1;text-align:center;font-size:13px;color:var(--muted)}
@media (prefers-reduced-motion:no-preference){
  .rep-bars i{transition:transform 1s var(--ease);transition-delay:calc(var(--h) * 400ms + 200ms)}
  html.js .rep-dash.rv:not(.in) .rep-bars i{transform:scaleY(.05)}
}
.rep-ranks ol{display:grid;gap:8px;margin-top:12px}
.rep-ranks li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 8px 8px 12px;border-radius:12px;background:#fff;font-size:14.5px;font-weight:500}
.rep-ranks li b{width:28px;height:28px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--cobalt-tint);color:var(--cobalt);font-size:14px;font-weight:700}
.rep-next ul{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.rep-next li{display:inline-flex;align-items:center;gap:8px;padding:8px 14px 8px 10px;border-radius:999px;background:#fff;font-size:14px;font-weight:500}
.rep-next li::before{content:"";width:14px;height:14px;border-radius:4px;box-shadow:inset 0 0 0 2px var(--line-2)}

@media (max-width:1000px){.rep-grid{grid-template-columns:1fr}}
@media (max-width:620px){
  .rep-kpis{grid-template-columns:1fr 1fr}
  .rep-row{grid-template-columns:1fr}
  .rep-from{font-size:0;gap:0;padding:4px}
  .rep-top p b{font-size:17px}
}

/* ==== 60-ceni.css ==== */
/* ceni.html · v5 „Кобалт Про“ (owner: ceni agent, prefix cn-) */

/* ---------- sub-hero: price anchor on a live site ---------- */
.cn-hero-acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.cn-hv{position:relative;padding-bottom:4px}
.cn-hv-site{position:relative;border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 50px 90px -40px rgba(3,6,60,.75),0 0 0 1px rgba(255,255,255,.18)}
.cn-bbar{display:flex;align-items:center;gap:6px;height:34px;padding:0 14px;background:#F7F8FC;border-bottom:1px solid var(--line)}
.cn-bbar i{width:10px;height:10px;border-radius:50%;background:#D8DCE8}
.cn-bbar span{margin-inline:auto;translate:-15px 0;font-size:13px;line-height:1;color:var(--muted);background:#fff;border:1px solid var(--line);border-radius:8px;padding:5px 16px}
.cn-hv-site img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top}
.cn-hv-cmp{position:relative;z-index:2;display:flex;align-items:stretch;margin:-64px clamp(10px,3vw,28px) 0}
.cn-hv-cmp>p{flex:1;min-width:0;padding:18px 22px;border-radius:22px;box-shadow:0 30px 60px -24px rgba(3,6,60,.6)}
.cn-hv-cmp small{display:block;font:600 13px/1.2 var(--f);letter-spacing:.05em;text-transform:uppercase}
.cn-hv-cmp b{display:block;margin-top:8px;font-size:clamp(24px,2.3vw,32px);font-weight:600;letter-spacing:-.035em;line-height:1.05;white-space:nowrap}
.cn-hv-cmp b span{font-size:17px;font-weight:500;letter-spacing:0}
.cn-hv-cmp p>span{display:block;margin-top:6px;font-size:15px;line-height:1.3}
.cn-hv-old{background:#fff;color:var(--muted)}
.cn-hv-old b{color:var(--ink-2)}
.cn-hv-new{background:var(--ink);color:#fff}
.cn-hv-new small,.cn-hv-new p>span,.cn-hv-new b span{color:rgba(255,255,255,.76)}
.cn-hv-new b{color:var(--yellow)}
.cn-hv-arr{position:relative;z-index:3;align-self:center;width:46px;height:46px;flex:none;margin-inline:-14px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--cobalt);box-shadow:0 0 0 5px rgba(255,255,255,.35),var(--sh-1)}
.cn-hv-arr .ic{stroke-width:2.2}
@media (max-width:560px){
  .cn-hv-cmp{flex-direction:column;margin:-40px 10px 0}
  .cn-hv-arr{margin:-14px auto;rotate:90deg}
  .cn-hv-cmp>p{padding:16px 18px}
}

/* ---------- 1 · plans ---------- */
.cn-cards{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(5,auto);column-gap:20px;align-items:start}
.cn-plan{position:relative;display:grid;grid-row:span 5;grid-template-rows:subgrid;row-gap:0;padding:36px 32px 30px;border-radius:32px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),var(--sh-1);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
@media (hover:hover) and (pointer:fine){.cn-plan:hover{transform:translateY(-6px);box-shadow:inset 0 0 0 1px var(--line),var(--sh-2)}}
.cn-plan-h h3{font-size:26px;font-weight:600;letter-spacing:-.03em;line-height:1.2}
.cn-plan-h p{margin-top:6px;font-size:17px;color:var(--muted);line-height:1.4}
.cn-plan-p{display:flex;align-items:baseline;gap:8px;margin-top:26px}
.cn-plan-p b{font-size:clamp(60px,5.4vw,78px);line-height:.95;font-weight:600;letter-spacing:-.055em;background:linear-gradient(transparent 64%,var(--yellow) 64% 90%,transparent 90%);padding-inline:4px;margin-inline:-4px}
.cn-plan-p span{font-size:19px;font-weight:500;color:var(--muted)}
.cn-plan-act{margin-top:10px;font-size:15px;color:var(--muted)}
.cn-plan-l{margin-top:24px;margin-bottom:28px;align-self:start}
.cn-plan-l li{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-top:1px solid var(--line);font-size:17px;line-height:1.4}
.cn-plan-l li::before{content:'';flex:none;width:20px;height:20px;margin-top:1px;border-radius:50%;background:var(--cobalt-tint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232335FF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4L18 8'/%3E%3C/svg%3E") center/14px no-repeat}
.cn-plan-acts{align-self:end;display:grid;gap:6px;justify-items:center}
.cn-plan-calc{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;font-size:16px;font-weight:600;color:var(--cobalt);text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(35,53,255,.3);transition:text-decoration-color .2s}
.cn-plan-calc:hover{text-decoration-color:currentColor}
.cn-plan-hot{background:linear-gradient(165deg,#3243FF 0%,#1F2EE6 45%,#1420B5 100%);color:#fff;box-shadow:0 40px 80px -40px rgba(35,53,255,.8)}
@media (hover:hover) and (pointer:fine){.cn-plan-hot:hover{box-shadow:0 50px 90px -40px rgba(35,53,255,.9)}}
.cn-plan-hot::before{content:'';position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;background:conic-gradient(from var(--ang2),rgba(255,255,255,.9),rgba(255,255,255,.08) 25%,rgba(255,255,255,.08) 50%,rgba(170,185,255,.9) 70%,rgba(255,255,255,.08) 85%,rgba(255,255,255,.9));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:cnSpin 7s linear infinite}
@keyframes cnSpin{to{--ang2:360deg}}
.cn-plan-hot .cn-plan-h p,.cn-plan-hot .cn-plan-act,.cn-plan-hot .cn-plan-p span{color:rgba(255,255,255,.8)}
.cn-plan-hot .cn-plan-p b{background:none;color:var(--yellow)}
.cn-plan-hot .cn-plan-l li{border-color:rgba(255,255,255,.16)}
.cn-plan-hot .cn-plan-l li::before{background-color:rgba(255,255,255,.16);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4L18 8'/%3E%3C/svg%3E")}
.cn-plan-hot .cn-plan-calc{color:#fff;text-decoration-color:rgba(255,255,255,.4)}
.cn-plan-hot :focus-visible{outline-color:#fff}
.cn-plan-badge{position:absolute;top:-14px;left:32px;padding:8px 12px;border-radius:10px;background:#fff;color:var(--cobalt);font:600 13px/1 var(--f);letter-spacing:.05em;text-transform:uppercase;box-shadow:var(--sh-1)}

.cn-pfacts{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 14px;margin-top:44px}
.cn-pfacts li{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);font-size:16px;font-weight:500;color:var(--ink-2)}
.cn-pfacts .ic{color:var(--cobalt);width:19px;height:19px}

.cn-live{margin-top:clamp(64px,8vw,104px)}
.cn-live-t{display:flex;align-items:center;gap:12px;margin-bottom:22px;font:600 14px/1.2 var(--f);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.cn-live-t::after{content:'';flex:1;height:1px;background:var(--line)}
.cn-live-dot{width:8px;height:8px;border-radius:50%;background:#1FA463;box-shadow:0 0 0 4px rgba(31,164,99,.18);flex:none}
.cn-live-list{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.cn-live-list a{display:block}
.cn-live-shot{display:block;aspect-ratio:16/10;border-radius:18px;overflow:hidden;background:var(--mist);box-shadow:var(--sh-1),inset 0 0 0 1px var(--line);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.cn-live-shot img{width:100%;height:100%;object-fit:cover;object-position:top}
.cn-live-list a:hover .cn-live-shot{transform:translateY(-5px);box-shadow:var(--sh-2)}
.cn-live-n{display:block;margin-top:12px;font-size:15px;line-height:1.35;color:var(--muted)}
.cn-live-n b{display:block;font-size:17px;font-weight:600;color:var(--ink)}

@media (max-width:980px){
  .cn-cards{grid-template-columns:1fr;grid-template-rows:none;row-gap:24px;max-width:560px;margin-inline:auto}
  .cn-plan{grid-row:auto;grid-template-rows:none}
  .cn-plan-hot{order:-1}
  .cn-live-list{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .cn-plan{padding:32px 24px 24px}
  .cn-pfacts{gap:10px}
  .cn-pfacts li{padding:10px 16px;font-size:15px}
  .cn-live-list{gap:18px 12px}
  .cn-live-n{font-size:14px}
  .cn-live-n b{font-size:16px}
}

/* ---------- 2 · comparison ---------- */
.cn-cmp{border-radius:28px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),var(--sh-1);overflow:clip}
.cn-cmp-sum{display:none}
.cn-cmp-sum::-webkit-details-marker{display:none}
.cn-switch{display:none}
.cn-tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:16px}
.cn-tbl th,.cn-tbl td{padding:14px 22px;text-align:center;border-top:1px solid var(--line)}
.cn-tbl thead th{position:sticky;top:var(--hdr);z-index:2;background:#fff;border-top:0;border-bottom:1px solid var(--line);padding:22px 22px 20px;vertical-align:bottom}
.cn-tbl .cn-th-f{text-align:left;font-size:14px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.cn-th-n{display:block;font-size:20px;font-weight:600;letter-spacing:-.02em}
.cn-th-p{display:block;margin-top:4px;font-size:15px;color:var(--muted)}
.cn-th-p b{font-size:22px;font-weight:600;color:var(--ink);letter-spacing:-.03em}
.cn-tbl thead .cn-c-hot{background:var(--cobalt);color:#fff}
.cn-tbl thead .cn-c-hot .cn-th-p{color:rgba(255,255,255,.8)}
.cn-tbl thead .cn-c-hot .cn-th-p b{color:var(--yellow)}
.cn-tbl tbody th{text-align:left;font-weight:500;color:var(--ink-2)}
.cn-tbl td[data-col="grow"]{background:#F6F7FF}
.cn-tbl th[scope="col"]:not(.cn-th-f),.cn-tbl td{width:19%}
.cn-grp th{padding:12px 22px;background:var(--mist);font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:left}
.cn-y::before{content:'';display:inline-block;vertical-align:middle;width:26px;height:26px;border-radius:50%;background:var(--cobalt) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4L18 8'/%3E%3C/svg%3E") center/16px no-repeat}
.cn-n::before{content:'';display:inline-block;vertical-align:middle;width:14px;height:2px;border-radius:2px;background:var(--line-2)}
.cn-add{font-weight:600;color:var(--ink-2);white-space:nowrap}
.cn-in{white-space:nowrap}
.cn-in span{display:inline-block;padding:6px 10px;border-radius:999px;background:var(--cobalt-tint);color:var(--cobalt);font-size:14px;font-weight:600;line-height:1}
.cn-tot th,.cn-tot td{padding-block:20px;font-size:18px;font-weight:600;color:var(--ink);background:var(--mist)}
.cn-tot td[data-col="grow"]{background:var(--cobalt-tint)}
.cn-tbl-note{margin-top:20px;font-size:16px;color:var(--muted);text-align:center}
.cn-tbl-note a{color:var(--cobalt);font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(35,53,255,.3);white-space:nowrap}
.cn-tbl-note a:hover{text-decoration-color:currentColor}

@media (max-width:760px){
  .cn-cmp-sum{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px;padding:0 22px;font-size:18px;font-weight:600;cursor:pointer;list-style:none}
  .cn-cmp-sum .ic{width:34px;height:34px;padding:8px;border-radius:50%;background:var(--mist);color:var(--cobalt);transition:rotate .35s var(--ease)}
  .cn-cmp[open] .cn-cmp-sum{border-bottom:1px solid var(--line)}
  .cn-cmp[open] .cn-cmp-sum .ic{rotate:45deg}
  .cn-switch{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin:14px;padding:4px;border-radius:999px;background:var(--mist)}
  .cn-switch button{min-height:44px;border:0;border-radius:999px;background:transparent;font-size:16px;font-weight:600;color:var(--muted);cursor:pointer;transition:background-color .25s,color .25s}
  .cn-switch button[aria-pressed="true"]{background:#fff;color:var(--ink);box-shadow:var(--sh-1)}
  .cn-tbl[data-cn-show="start"] [data-col]:not([data-col="start"]),
  .cn-tbl[data-cn-show="grow"] [data-col]:not([data-col="grow"]),
  .cn-tbl[data-cn-show="full"] [data-col]:not([data-col="full"]){display:none}
  .cn-tbl{font-size:15px}
  .cn-tbl th,.cn-tbl td{padding:12px 14px}
  .cn-tbl thead th{position:static;padding:14px}
  .cn-grp th{padding:10px 14px}
  .cn-tbl th[scope="col"]:not(.cn-th-f),.cn-tbl td{width:36%}
}

/* ---------- 3 · builder (app) ---------- */
.cn-app{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px;align-items:start}
.cn-b-form{padding:clamp(22px,3vw,36px);border-radius:28px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),var(--sh-1)}
.cn-b-step{margin:0;padding:0;border:0;min-width:0}
.cn-b-step+.cn-b-step{margin-top:28px;padding-top:28px;border-top:1px solid var(--line)}
.cn-b-step>legend+*{clear:both}
.cn-b-step legend{float:left;display:flex;align-items:center;gap:12px;width:100%;padding:0;margin-bottom:16px;font-size:20px;font-weight:600;letter-spacing:-.02em}
.cn-b-step legend small{margin-left:auto;font-size:15px;font-weight:500;letter-spacing:0;color:var(--muted)}
.cn-b-n{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--cobalt-tint);color:var(--cobalt);font-size:15px;font-weight:600}
.cn-b-form input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.cn-b-form label{cursor:pointer;-webkit-tap-highlight-color:transparent}
.cn-b-form label:has(input:focus-visible){outline:3px solid var(--cobalt);outline-offset:3px}

.cn-b-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.cn-b-plan{position:relative;display:grid;gap:4px;padding:18px 18px 16px;border-radius:20px;box-shadow:inset 0 0 0 1.5px var(--line);transition:box-shadow .25s,background-color .25s}
.cn-b-plan::after{content:'';position:absolute;top:16px;right:16px;width:20px;height:20px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--line-2);transition:background-color .25s,box-shadow .25s}
.cn-b-pn{font-size:18px;font-weight:600}
.cn-b-pp{font-size:15px;color:var(--muted)}
.cn-b-pp b{font-size:26px;font-weight:600;letter-spacing:-.035em;color:var(--ink)}
.cn-b-rec{position:absolute;top:-11px;left:14px;padding:5px 8px;border-radius:8px;background:var(--cobalt);color:#fff;font:600 13px/1 var(--f);font-style:normal;letter-spacing:.03em}
.cn-b-plan:hover{box-shadow:inset 0 0 0 1.5px var(--line-2)}
.cn-b-plan:has(input:checked){background:var(--cobalt-tint);box-shadow:inset 0 0 0 2px var(--cobalt)}
.cn-b-plan:has(input:checked)::after{background:var(--cobalt) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4L18 8'/%3E%3C/svg%3E") center/13px no-repeat;box-shadow:none}

.cn-b-adds{display:grid;gap:10px}
.cn-b-add{display:grid;grid-template-columns:44px minmax(0,1fr) auto 46px;align-items:center;gap:14px;padding:12px 16px 12px 12px;border-radius:18px;box-shadow:inset 0 0 0 1.5px var(--line);transition:box-shadow .25s,background-color .25s,opacity .25s}
.cn-b-add:hover{box-shadow:inset 0 0 0 1.5px var(--line-2)}
.cn-b-ic{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:var(--mist);color:var(--ink-2);transition:background-color .25s,color .25s}
.cn-b-ic .ic{width:22px;height:22px}
.cn-b-an{font-size:17px;font-weight:600;line-height:1.25}
.cn-b-inc{display:block;font-size:14px;font-weight:500;color:var(--cobalt)}
.cn-b-inc[hidden]{display:none}
.cn-b-ap{font-size:16px;font-weight:600;color:var(--ink-2);white-space:nowrap}
.cn-b-sw{position:relative;width:46px;height:28px;border-radius:999px;background:var(--line-2);transition:background-color .25s}
.cn-b-sw::after{content:'';position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(11,18,51,.25);transition:transform .3s var(--ease)}
.cn-b-add:has(input:checked){background:var(--cobalt-tint);box-shadow:inset 0 0 0 2px var(--cobalt)}
.cn-b-add:has(input:checked) .cn-b-ic{background:var(--cobalt);color:#fff}
.cn-b-add:has(input:checked) .cn-b-sw{background:var(--cobalt)}
.cn-b-add:has(input:checked) .cn-b-sw::after{transform:translateX(18px)}
.cn-b-add.is-inc{cursor:default;background:var(--mist);box-shadow:none}
.cn-b-add.is-inc .cn-b-ic{background:#fff;color:var(--cobalt)}
.cn-b-add.is-inc .cn-b-ap{color:var(--muted);opacity:.5}
.cn-b-add.is-inc .cn-b-sw{background:#B9C2FF}
.cn-b-add.is-inc .cn-b-sw::after{transform:translateX(18px)}

.cn-b-vids{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.cn-b-vid{display:grid;gap:4px;justify-items:center;text-align:center;padding:14px 8px;border-radius:16px;box-shadow:inset 0 0 0 1.5px var(--line);transition:box-shadow .25s,background-color .25s}
.cn-b-vid:hover{box-shadow:inset 0 0 0 1.5px var(--line-2)}
.cn-b-vn{font-size:16px;font-weight:600;line-height:1.2}
.cn-b-vp{font-size:14px;color:var(--muted);white-space:nowrap}
.cn-b-vid:has(input:checked){background:var(--cobalt-tint);box-shadow:inset 0 0 0 2px var(--cobalt)}
.cn-b-hint{display:flex;gap:10px;align-items:center;margin-top:14px;font-size:15px;color:var(--muted)}
.cn-b-hint::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--cobalt);flex:none}
.cn-b-hint[hidden]{display:none}
.cn-b-mini{display:none}

.cn-rcpt{position:sticky;top:calc(var(--hdr) + 20px);isolation:isolate;overflow:hidden;padding:clamp(24px,2.6vw,34px);border-radius:28px;color:#fff;background:radial-gradient(ellipse 80% 55% at 100% 0%,rgba(35,53,255,.55),transparent 70%),var(--ink);box-shadow:0 40px 80px -40px rgba(11,18,51,.7)}
.cn-rcpt :focus-visible{outline-color:var(--yellow)}
.cn-rcpt-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.cn-rcpt-t{font:600 14px/1 var(--f);letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.72)}
.cn-rcpt-plan{padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.12);font-size:15px;font-weight:600}
.cn-rcpt-main{margin-top:26px}
.cn-rcpt-k{font-size:15px;color:rgba(255,255,255,.72)}
.cn-rcpt-big{display:flex;align-items:baseline;gap:8px;margin-top:2px}
.cn-rcpt-big b{font-size:clamp(60px,5.6vw,80px);line-height:1;font-weight:600;letter-spacing:-.055em;color:var(--yellow);font-variant-numeric:tabular-nums}
.cn-rcpt-big span{font-size:20px;font-weight:500;color:rgba(255,255,255,.8)}
.cn-rcpt-lines{margin-top:20px}
.cn-rcpt-lines li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-top:1px solid rgba(255,255,255,.12);font-size:15px;color:rgba(255,255,255,.82)}
.cn-rcpt-lines li span{display:flex;align-items:center;gap:10px}
.cn-rcpt-lines li span::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--dot,#fff);flex:none}
.cn-rcpt-lines b{font-weight:600;color:#fff;white-space:nowrap}
.cn-rcpt-lines [data-k="plan"]{--dot:#6C7BFF}
.cn-rcpt-lines [data-k="ads"]{--dot:#A3AEFF}
.cn-rcpt-lines [data-k="ai"]{--dot:#D3D8FF}
.cn-rcpt-lines [data-k="voice"]{--dot:#7CF0B5}
.cn-rcpt-lines [data-k="act"]{--dot:var(--yellow)}
.cn-rcpt-lines [data-k="vid"]{--dot:transparent}
.cn-rcpt-lines [data-k="vid"] span::before{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.6)}
.cn-rcpt-lines .is-inc b{font-weight:500;color:rgba(255,255,255,.7)}
.cn-rcpt-lines .is-inc span::before{background:transparent;box-shadow:inset 0 0 0 1.5px #A3AEFF}
.cn-rcpt-tot{margin:6px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cn-rcpt-tot div{padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.cn-rcpt-tot dt{font-size:15px;font-weight:600}
.cn-rcpt-tot dt small{display:block;font-size:13px;font-weight:400;color:rgba(255,255,255,.62);line-height:1.3}
.cn-rcpt-tot dd{margin:8px 0 0;font-size:clamp(19px,1.6vw,22px);font-weight:600;letter-spacing:-.02em;white-space:nowrap}
.cn-rcpt-bar{margin-top:20px}
.cn-bar{display:flex;gap:3px;height:12px}
.cn-bar i{flex:0 1 0;min-width:0;border-radius:6px;transition:flex-grow .6s var(--ease)}
.cn-seg-plan{background:#6C7BFF}
.cn-seg-ads{background:#A3AEFF}
.cn-seg-ai{background:#D3D8FF}
.cn-seg-voice{background:#7CF0B5}
.cn-seg-act{background:var(--yellow)}
.cn-legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:10px;font-size:14px;color:rgba(255,255,255,.72)}
.cn-legend li{display:flex;align-items:center;gap:6px}
.cn-legend li[hidden]{display:none}
.cn-legend li::before{content:'';width:8px;height:8px;border-radius:50%}
.cn-l-plan::before{background:#6C7BFF}.cn-l-ads::before{background:#A3AEFF}.cn-l-ai::before{background:#D3D8FF}.cn-l-voice::before{background:#7CF0B5}.cn-l-act::before{background:var(--yellow)}
.cn-rcpt-tip{margin-top:18px;padding:14px 16px;border-radius:16px;background:#fff;color:var(--ink);font-size:15px;line-height:1.45;font-weight:500}
.cn-rcpt-tip[hidden]{display:none}
.cn-rcpt-sw{display:inline;padding:0;border:0;background:none;font-weight:600;color:var(--cobalt);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.cn-rcpt-tip :focus-visible{outline-color:var(--cobalt)}
.cn-rcpt .btn{margin-top:22px}
.cn-rcpt-fine{margin-top:14px;font-size:14px;line-height:1.45;color:rgba(255,255,255,.62);text-align:center}
.cn-nojs{display:none}
html:not(.js) .cn-nojs{display:block;margin-top:20px;color:var(--muted)}
html:not(.js) .cn-app{display:none}

@media (max-width:980px){
  .cn-app{grid-template-columns:1fr;max-width:640px;margin-inline:auto}
  .cn-rcpt{position:relative;top:auto}
  .cn-b-mini{position:sticky;top:calc(var(--hdr) + 10px);z-index:5;display:flex;justify-content:space-between;align-items:center;gap:12px;margin:-6px -6px 22px;padding:12px 18px;border-radius:999px;background:var(--ink);color:#fff;font-size:15px;box-shadow:0 14px 30px -14px rgba(11,18,51,.6)}
  .cn-b-mini span{color:rgba(255,255,255,.72)}
  .cn-b-mini b{font-size:18px;font-weight:600;color:var(--yellow)}
  .cn-b-mini i{font-style:normal}
}
@media (max-width:560px){
  .cn-b-plans{gap:8px}
  .cn-b-plan{padding:16px 12px 12px}
  .cn-b-plan::after{top:12px;right:10px;width:18px;height:18px}
  .cn-b-pn{font-size:16px}
  .cn-b-pp{font-size:14px}
  .cn-b-pp{display:grid;line-height:1.2}
  .cn-b-pp b{font-size:24px}
  .cn-b-plan::after{display:none}
  .cn-b-rec{left:50%;translate:-50% 0;white-space:nowrap;padding:4px 7px}
  .cn-b-add{grid-template-columns:40px minmax(0,1fr) 46px;grid-template-areas:"ic an sw" "ic ap sw";column-gap:12px;row-gap:2px;padding:12px}
  .cn-b-ic{grid-area:ic;width:40px;height:40px}
  .cn-b-an{grid-area:an;font-size:16px}
  .cn-b-ap{grid-area:ap;font-size:15px}
  .cn-b-sw{grid-area:sw}
  .cn-b-vids{grid-template-columns:repeat(2,1fr)}
  .cn-rcpt-tot{grid-template-columns:1fr}
  .cn-rcpt-tot div{display:flex;justify-content:space-between;align-items:center;gap:12px}
  .cn-rcpt-tot dd{margin:0}
}

/* ---------- 4 · terms: buy-out timeline ---------- */
.cn-tl{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);grid-template-areas:"read chart" "read range" "ev ev";column-gap:clamp(28px,4vw,64px);padding:clamp(24px,4vw,48px);border-radius:32px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),var(--sh-2)}
.cn-tl-read{grid-area:read;align-self:center}
.cn-tl-k{font-size:17px;color:var(--muted)}
.cn-tl-k output{font-weight:600;color:var(--ink)}
.cn-tl-v{display:flex;align-items:baseline;gap:6px;margin-top:6px}
.cn-tl-v b{font-size:clamp(64px,7vw,104px);line-height:.95;font-weight:600;letter-spacing:-.06em;font-variant-numeric:tabular-nums;background:linear-gradient(transparent 64%,var(--yellow) 64% 90%,transparent 90%);padding-inline:4px;margin-inline:-4px}
.cn-tl-v span{font-size:28px;font-weight:600;color:var(--muted)}
.cn-tl-f{margin-top:14px;font-size:16px;line-height:1.45;color:var(--ink-2)}
.cn-tl.is-own .cn-tl-f{color:var(--cobalt);font-weight:600}
.cn-tl-chart{grid-area:chart;min-width:0}
.cn-tl-bars{display:grid;grid-template-columns:repeat(13,1fr);gap:clamp(4px,.7vw,10px);align-items:end;height:clamp(150px,18vw,230px)}
.cn-tl-bars li{position:relative;height:100%;display:flex;align-items:flex-end;justify-content:center;cursor:pointer}
.cn-tl-bars i{display:block;width:100%;height:calc((12 - var(--m)) / 12 * 100%);border-radius:10px 10px 4px 4px;background:var(--mist-2);transition:background-color .35s,box-shadow .35s}
.cn-tl-bars li.is-paid i{background:#C9D0FF}
.cn-tl-bars li.is-at i{background:var(--cobalt);box-shadow:0 14px 26px -10px rgba(35,53,255,.7)}
.cn-tl-key{width:clamp(28px,3vw,44px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--cobalt);box-shadow:inset 0 0 0 1.5px var(--line-2);transition:background-color .35s,color .35s,box-shadow .35s}
.cn-tl-key .ic{width:55%;height:55%}
.cn-tl.is-own .cn-tl-key{background:var(--cobalt);color:#fff;box-shadow:0 0 0 6px rgba(35,53,255,.15)}
.cn-tl-road{position:relative;height:6px;margin-top:14px;border-radius:6px;background:repeating-linear-gradient(90deg,var(--line-2) 0 8px,transparent 8px 14px)}
.cn-tl-fill{position:absolute;left:0;top:0;bottom:0;width:calc((var(--n) + .5) / 13 * 100%);border-radius:6px;background:var(--cobalt);transition:width .4s var(--ease)}
.cn-tl-ticks{display:grid;grid-template-columns:repeat(13,1fr);gap:clamp(4px,.7vw,10px);margin-top:10px;font-size:14px;font-weight:600;color:var(--muted);text-align:center}
.cn-range{grid-area:range;-webkit-appearance:none;appearance:none;width:calc(100% - 100% / 13 + 28px);margin:14px calc(100% / 26 - 14px) 0;height:28px;background:transparent;cursor:pointer}
.cn-range::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:var(--mist-2)}
.cn-range::-moz-range-track{height:4px;border-radius:4px;background:var(--mist-2)}
.cn-range::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;margin-top:-12px;border-radius:50%;background:var(--cobalt);border:4px solid #fff;box-shadow:0 0 0 1px var(--line-2),0 6px 16px -4px rgba(35,53,255,.6)}
.cn-range::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--cobalt);border:4px solid #fff;box-shadow:0 0 0 1px var(--line-2),0 6px 16px -4px rgba(35,53,255,.6)}
.cn-tl-ev{grid-area:ev;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:clamp(24px,3vw,36px);padding-top:clamp(20px,2.6vw,30px);border-top:1px solid var(--line)}
.cn-tl-ev li{display:grid;gap:4px;font-size:16px;line-height:1.4;color:var(--ink-2)}
.cn-tl-ev b{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--cobalt)}
.cn-tl-ev b::before{content:'';width:10px;height:10px;border-radius:50%;background:var(--cobalt);box-shadow:0 0 0 4px rgba(35,53,255,.13);flex:none}
.cn-ev-12 b::before{background:var(--yellow);box-shadow:0 0 0 4px rgba(255,212,59,.3)}
.cn-ev-live{justify-items:center;text-align:center}
.cn-ev-12{justify-items:end;text-align:right}

.cn-terms-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}
.cn-terms-grid li{display:grid;grid-template-columns:46px 1fr;column-gap:16px;align-items:center;padding:22px;border-radius:24px;background:var(--mist)}
.cn-terms-grid i{grid-row:span 2;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:#fff;color:var(--cobalt);box-shadow:var(--sh-1)}
.cn-terms-grid b{font-size:19px;font-weight:600;letter-spacing:-.015em;line-height:1.25}
.cn-terms-grid span{font-size:16px;line-height:1.35;color:var(--muted)}

@media (max-width:900px){
  .cn-tl{grid-template-columns:1fr;grid-template-areas:"read" "chart" "range" "ev"}
  .cn-tl-read{margin-bottom:28px}
  .cn-ev-live,.cn-ev-12{justify-items:start;text-align:left}
  .cn-terms-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .cn-tl{padding:24px 18px;border-radius:26px}
  .cn-tl-ticks{font-size:13px}
  .cn-tl-bars i{border-radius:6px 6px 3px 3px}
  .cn-tl-ev{grid-template-columns:1fr}
  .cn-terms-grid{gap:10px}
  .cn-terms-grid li{grid-template-columns:1fr;align-content:start;row-gap:4px;padding:16px}
  .cn-terms-grid i{grid-row:auto;width:40px;height:40px;margin-bottom:8px}
  .cn-terms-grid b{font-size:17px}
  .cn-terms-grid span{font-size:15px}
}

/* ---------- 5 · FAQ ---------- */
.cn-faq-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.45fr);gap:clamp(40px,6vw,96px);align-items:start}
.cn-faq-side{position:sticky;top:calc(var(--hdr) + 32px)}
.cn-msg{display:flex;align-items:center;gap:14px;margin-top:32px;padding:14px 20px 14px 14px;border-radius:22px;background:#fff;box-shadow:var(--sh-1);max-width:400px}
.cn-av{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;flex:none;font-style:normal;font-weight:700;font-size:19px;color:#fff;background:linear-gradient(150deg,#3A4BFF,#1420B5)}
.cn-msg b{display:block;font-size:16px;font-weight:600;line-height:1.3}
.cn-msg span{display:block;font-size:15px;line-height:1.4;color:var(--ink-2)}
.cn-faq-list{display:grid;gap:12px}
.cn-faq-list details{border-radius:22px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);transition:box-shadow .3s}
.cn-faq-list details[open]{box-shadow:inset 0 0 0 1px var(--line),var(--sh-1)}
.cn-faq-list summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:72px;padding:18px 20px 18px 26px;font-size:clamp(18px,1.4vw,20px);font-weight:600;letter-spacing:-.015em;line-height:1.3;cursor:pointer;list-style:none}
.cn-faq-list summary::-webkit-details-marker{display:none}
.cn-faq-list summary .ic{width:38px;height:38px;padding:9px;border-radius:50%;background:var(--mist);color:var(--cobalt);transition:rotate .35s var(--ease),background-color .3s,color .3s}
.cn-faq-list details[open] summary .ic{rotate:45deg;background:var(--cobalt);color:#fff}
.cn-faq-list details p{padding:0 26px 24px;font-size:17px;line-height:1.6;color:var(--muted);max-width:60ch}
@media (max-width:900px){
  .cn-faq-grid{grid-template-columns:1fr}
  .cn-faq-side{position:static}
  .cn-faq-list summary{padding-left:20px}
  .cn-faq-list details p{padding:0 20px 20px}
}

/* ---------- closing band (layout only; the band itself is .sub-end from chrome) ---------- */
.cn-end-acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}

/* ==== 61-proekti.css ==== */
/* ---------- PROEKTI v5 (.pr-) : fanned phones hero, live case panels, filterable gallery, „Всеки сайт включва“ ---------- */

/* ---------- device mockups (page-local names, so nothing collides with the home mockups) ---------- */
.pr-phone{position:relative;background:#0A0D1F;border-radius:17%/7.9%;padding:3.6%;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.16),0 34px 60px -24px rgba(0,0,30,.7)}
.pr-ph-view{position:relative;aspect-ratio:9/19.5;overflow:hidden;border-radius:14%/6.5%;background:#000}
.pr-ph-view::before{content:'';position:absolute;z-index:2;top:2.6%;left:50%;width:30%;height:3.2%;translate:-50% 0;border-radius:99px;background:#000}
.pr-ph-view img,.pr-lap-view img{width:100%;height:auto;will-change:transform}
.pr-lap{position:relative}
.pr-lap-screen{position:relative;background:#0A0D1F;border-radius:18px 18px 4px 4px;padding:1.5% 1.5% 2.2%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 50px 90px -40px rgba(0,0,30,.8)}
.pr-lap-screen::before{content:'';position:absolute;top:.65%;left:50%;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:#262B45}
.pr-lap-view{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:5px;background:#000}
.pr-lap-base{position:relative;height:clamp(9px,1.4vw,17px);margin-inline:-6.5%;background:linear-gradient(180deg,#EEF0F6 0%,#C7CCDA 45%,#8E95AB 100%);border-radius:2px 2px 18px 18px/2px 2px 14px 14px;box-shadow:0 26px 40px -14px rgba(0,0,30,.55)}
.pr-lap-base::before{content:'';position:absolute;left:50%;top:0;width:15%;height:38%;translate:-50% 0;background:#B3B9CA;border-radius:0 0 10px 10px}

/* the tall screenshot scrolls slowly inside the device: always in the hero, in a case while it is on screen or hovered */
@media (prefers-reduced-motion:no-preference){
  .pr-scr{animation:prScroll var(--dur,28s) ease-in-out 1.2s infinite alternate;animation-play-state:paused}
  .pr-hero .pr-scr,.pr-case.play .pr-scr,.pr-case:hover .pr-scr{animation-play-state:running}
}
@keyframes prScroll{0%,8%{transform:translateY(0)}30%,38%{transform:translateY(calc(var(--max) * .33))}62%,70%{transform:translateY(calc(var(--max) * .66))}92%,100%{transform:translateY(var(--max))}}

/* ---------- hero: three real sites fanned out ---------- */
.pr-hero-act{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.pr-fan{position:relative;min-height:clamp(420px,40vw,580px)}
.pr-fan::before{content:'';position:absolute;inset:6% 4%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.26),rgba(255,255,255,0));pointer-events:none}
.pr-fan .pr-phone{position:absolute;top:50%;left:50%;width:clamp(150px,15.5vw,226px);translate:-50% -50%}
.pr-fan-c{z-index:3}
.pr-fan-l,.pr-fan-r{z-index:1;scale:.86;filter:saturate(.92)}
.pr-fan .pr-fan-l{translate:-118% -45%;rotate:-11deg}
.pr-fan .pr-fan-r{translate:18% -45%;rotate:11deg}
.pr-fan-tag{position:absolute;z-index:4;left:50%;bottom:3%;translate:-50% 0;display:inline-flex;align-items:center;gap:10px;padding:11px 18px 11px 14px;border-radius:999px;background:#fff;color:var(--ink);font-size:15px;font-weight:600;white-space:nowrap;box-shadow:0 20px 40px -16px rgba(0,0,40,.55)}
.pr-fan-tag i{width:9px;height:9px;border-radius:50%;background:#34D27B;box-shadow:0 0 0 4px rgba(52,210,123,.22)}
.pr-fan-tag span{color:var(--muted);font-weight:500}
@media (prefers-reduced-motion:no-preference){
  html.js .pr-fan-l{animation:prFanL 1.3s var(--ease) .35s both}
  html.js .pr-fan-r{animation:prFanR 1.3s var(--ease) .35s both}
  html.js .pr-fan-c{animation:prFanC 1.1s var(--ease) .15s both}
  html.js .pr-fan-tag{animation:prTag .9s var(--ease) 1.1s both}
}
@keyframes prFanL{from{translate:-50% -46%;rotate:0deg}}
@keyframes prFanR{from{translate:-50% -46%;rotate:0deg}}
@keyframes prFanC{from{opacity:0;translate:-50% -44%}}
@keyframes prTag{from{opacity:0;translate:-50% 14px}}

/* ---------- live cases (stacked colour panels) ---------- */
.pr-cases{display:grid;gap:32px}
.pr-case{position:relative;display:grid;grid-template-columns:5fr 7fr;min-height:600px;border-radius:38px;background:var(--bg);color:var(--fg);overflow:hidden;isolation:isolate;box-shadow:0 40px 90px -50px rgba(11,18,51,.5)}
.pr-case::before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 60% 70% at 72% 60%,var(--glow),transparent 70%);opacity:.9}
.pr-case-txt{display:flex;flex-direction:column;align-items:flex-start;padding:52px 20px 52px 56px}
.pr-case-n{display:flex;align-items:center;gap:16px;flex-wrap:wrap;font:600 15px/1 var(--f);letter-spacing:.12em;color:var(--ac)}
.pr-live-dot{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;font-size:14px;letter-spacing:.02em;font-weight:600;color:var(--fg);background:color-mix(in srgb,var(--fg) 10%,transparent)}
.pr-live-dot::before{content:'';width:8px;height:8px;border-radius:50%;background:#34D27B;box-shadow:0 0 0 4px rgba(52,210,123,.22)}
.pr-case-name{margin-top:auto;font-size:clamp(46px,6vw,90px);line-height:.95;letter-spacing:-.05em;font-weight:600;text-wrap:balance}
.pr-case-meta{margin-top:20px;font-size:20px;font-weight:500}
.pr-case-pts{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.pr-case-pts li{padding:8px 14px;border-radius:999px;font-size:15px;font-weight:500;line-height:1.2;background:color-mix(in srgb,var(--fg) 9%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--fg) 14%,transparent)}
.pr-case-link{margin-top:30px;display:inline-flex;align-items:center;gap:8px;min-height:50px;padding:0 22px;border-radius:999px;font-weight:600;font-size:17px;box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--fg) 34%,transparent);transition:background-color .25s,color .25s}
.pr-case-link:hover{background:var(--fg);color:var(--bg)}
.pr-case-link .ic{width:18px;height:18px;stroke-width:2.2}
.pr-case :focus-visible{outline-color:var(--fg)}
.pr-case-viz{position:relative;min-height:320px}
.pr-case-viz .pr-lap{position:absolute;left:4%;top:13%;width:104%;transition:translate .8s var(--ease)}
.pr-case-viz .pr-phone{position:absolute;left:-6%;bottom:9%;width:19%;z-index:2;transition:translate .8s var(--ease)}
.pr-case:hover .pr-lap{translate:0 -8px}
.pr-case:hover .pr-case-viz .pr-phone{translate:0 -16px}
@media (min-width:901px){
  .pr-case{position:sticky;top:calc(var(--hdr) + 22px + var(--i)*16px);transform-origin:50% 0;transform:scale(calc(1 - var(--p,0)*.045))}
  .pr-case::after{content:'';position:absolute;inset:0;z-index:5;background:#050817;opacity:calc(var(--p,0)*.4);pointer-events:none}
}

/* ---------- gallery: 12 sites, filter by branch ---------- */
.pr-filter{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:36px}
.pr-chip{display:inline-flex;align-items:center;gap:9px;min-height:48px;padding:0 12px 0 18px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:16px;font-weight:600;color:var(--ink-2);white-space:nowrap;cursor:pointer;transition:background-color .25s,color .25s,border-color .25s,transform .35s var(--ease)}
.pr-chip:has(.pr-ci){padding-left:14px}
.pr-chip:hover{border-color:var(--line-2);transform:translateY(-1px)}
.pr-chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.pr-ci{width:19px;height:19px;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;color:var(--cobalt)}
.pr-chip[aria-pressed="true"] .pr-ci{color:#B9C2FF}
.pr-n{display:inline-grid;place-items:center;min-width:28px;height:26px;padding:0 8px;border-radius:99px;background:var(--mist);color:var(--muted);font-size:14px;font-weight:600}
.pr-chip[aria-pressed="true"] .pr-n{background:rgba(255,255,255,.16);color:#fff}

.pr-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.pr-g[hidden]{display:none}
.pr-gc{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px 12px;height:100%;padding:12px 12px 16px;background:#fff;border:1px solid var(--line);border-radius:28px;box-shadow:var(--sh-1);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.pr-gc:hover{transform:translateY(-6px);box-shadow:var(--sh-2)}
.pr-gstage{grid-column:1/-1;position:relative;display:block;aspect-ratio:4/3;border-radius:20px;background:var(--t,var(--mist));overflow:hidden}
.pr-gwin{position:absolute;left:7%;top:12%;width:78%;border-radius:10px;overflow:hidden;background:#fff;box-shadow:0 1px 2px rgba(11,18,51,.08),0 22px 40px -18px rgba(11,18,51,.4);transition:translate .6s var(--ease)}
.pr-gwin::before{content:'';display:block;height:clamp(12px,1.25vw,18px);background:radial-gradient(circle at 10px 50%,#D5D9E4 2.6px,transparent 3.2px),radial-gradient(circle at 20px 50%,#D5D9E4 2.6px,transparent 3.2px),radial-gradient(circle at 30px 50%,#D5D9E4 2.6px,transparent 3.2px);border-bottom:1px solid var(--line)}
.pr-gwin img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top}
.pr-gph{position:absolute;right:6%;top:30%;width:21%;padding:2.2%;background:#0A0D1F;border-radius:16%/7.4%;box-shadow:0 24px 40px -18px rgba(0,0,30,.6);transition:translate .6s var(--ease)}
.pr-gph img{width:100%;aspect-ratio:9/19.5;object-fit:cover;object-position:top;border-radius:13%/6%}
.pr-gc:hover .pr-gwin{translate:0 -4px}
.pr-gc:hover .pr-gph{translate:0 -12px}
.pr-gt{display:flex;flex-direction:column;gap:3px;min-width:0;padding-left:8px}
.pr-gt b{font-size:19px;line-height:1.2;font-weight:600;letter-spacing:-.015em;color:var(--ink)}
.pr-gt span{font-size:15px;line-height:1.3;color:var(--muted)}
.pr-go{display:grid;place-items:center;width:44px;height:44px;margin-right:4px;border-radius:50%;background:var(--mist);color:var(--ink);transition:background-color .3s,color .3s}
.pr-go .ic{width:18px;height:18px;stroke-width:2.1}
.pr-gc:hover .pr-go{background:var(--cobalt);color:#fff}

/* ---------- every site includes ---------- */
.pr-inc-aside{justify-self:end;max-width:34ch;padding-bottom:8px}
.pr-inc-aside .lead{margin-top:0}
.pr-more{display:inline-flex;align-items:center;gap:8px;margin-top:14px;font-weight:600;font-size:17px;color:var(--cobalt)}
.pr-more .ic{width:18px;height:18px;stroke-width:2.1;transition:transform .35s var(--ease)}
.pr-more:hover .ic{transform:translateX(3px)}
.pr-inc-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.pr-tile{padding:12px 12px 22px;background:#fff;border:1px solid var(--line);border-radius:28px;box-shadow:var(--sh-1)}
.pr-art{display:block;padding:12px 8px;border-radius:20px;background:var(--mist)}
.pr-art svg{display:block;width:100%;height:auto}
.pr-tile-t{margin:18px 10px 0;font-size:19px;line-height:1.25;font-weight:600;letter-spacing:-.02em}
.pr-tile-s{margin:4px 10px 0;font-size:15px;line-height:1.35;color:var(--muted)}

/* ---------- closing band ---------- */
/* layout and colours come from the shared .sub-end contract (02-chrome.css) */
.pr-end-act{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:6px}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .pr-case{grid-template-columns:1fr 1.2fr}
  .pr-inc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1000px){
  .pr-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
}
@media (max-width:900px){
  .pr-inc-aside{justify-self:start;margin-top:16px}
  .pr-case{grid-template-columns:1fr;min-height:0;border-radius:30px}
  .pr-case-txt{padding:30px 28px 8px}
  .pr-case-name{margin-top:26px}
  .pr-case-viz{min-height:0;aspect-ratio:1.45}
  .pr-case-viz .pr-lap{left:14%;top:10%;width:92%}
  .pr-case-viz .pr-phone{left:4%;bottom:6%;width:25%}
  .pr-fan{min-height:clamp(360px,90vw,480px);margin-top:12px}
  .pr-fan .pr-phone{width:clamp(130px,36vw,190px)}
}
@media (max-width:620px){
  .pr-hero-act .btn{flex:1 1 100%}
  .pr-filter{flex-wrap:nowrap;overflow-x:auto;margin-inline:calc(-1 * var(--gut));padding:2px 56px 6px var(--gut);scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
  .pr-filter::-webkit-scrollbar{display:none}
  .pr-chip{min-height:44px;font-size:15px}
  .pr-grid{gap:12px}
  .pr-gc{gap:10px 6px;padding:7px 7px 12px;border-radius:20px}
  .pr-gstage{border-radius:14px}
  .pr-gwin{border-radius:6px}
  .pr-gt{padding-left:5px}
  .pr-gt b{font-size:15px}
  .pr-gt span{font-size:13px}
  .pr-go{display:none}
  .pr-inc-grid{gap:12px}
  .pr-tile{padding:8px 8px 16px;border-radius:22px}
  .pr-art{padding:8px 4px;border-radius:15px}
  .pr-tile-t{margin:14px 6px 0;font-size:16px}
  .pr-tile-s{margin:3px 6px 0;font-size:13px}
  .pr-case-txt{padding:26px 22px 4px}
  .pr-case-meta{font-size:18px}
}

/* ==== 62-uslugi.css ==== */
/* ---------- USLUGI (.us-) v5: orbit hero, sticky area bar, eight visual blocks (all about the fictional Бистро Смокиня) ---------- */
.us-sprite{position:absolute;width:0;height:0;overflow:hidden}

/* hero: the 8 areas orbit the WhiteWays mark on a white road */
.us-hero-acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.us-orbit{position:relative;width:min(100%,540px);aspect-ratio:1;margin-inline:auto}
.us-orbit-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
@media (prefers-reduced-motion:no-preference){.us-orbit-lane{animation:us-lane 40s linear infinite}}
@keyframes us-lane{to{stroke-dashoffset:-480}}
.us-orbit-core{position:absolute;left:50%;top:50%;width:24%;aspect-ratio:1;translate:-50% -50%;border-radius:28%;box-shadow:0 30px 60px -18px rgba(3,6,60,.65),0 0 0 14px rgba(255,255,255,.09),0 0 0 32px rgba(255,255,255,.045)}
.us-orbit-core svg{display:block;width:100%;height:100%}
.us-onode{position:absolute;left:var(--x);top:var(--y);translate:-50% -30px;display:grid;justify-items:center;gap:8px}
.us-onode i{width:60px;height:60px;border-radius:19px;display:grid;place-items:center;background:#fff;color:var(--cobalt);box-shadow:0 18px 40px -14px rgba(3,6,60,.6);transition:transform .35s var(--ease)}
.us-onode .ic{width:27px;height:27px;stroke-width:1.9}
.us-onode span{font-size:15px;font-weight:600;line-height:1;color:#fff;white-space:nowrap;padding:6px 11px;border-radius:999px;background:rgba(7,11,82,.28)}
.us-onode:hover i{transform:translateY(-4px)}

/* sticky bar of the 8 areas */
.us-body{position:relative;padding-bottom:clamp(40px,5vw,80px)}
.us-bar{position:sticky;top:calc(var(--hdr) + 10px);z-index:30;margin-top:-30px;pointer-events:none}
.us-bar-in{position:relative;display:flex;gap:2px;width:max-content;max-width:100%;margin-inline:auto;padding:6px;border-radius:999px;background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4);box-shadow:var(--sh-2),inset 0 0 0 1px var(--line);overflow-x:auto;scrollbar-width:none;pointer-events:auto}
.us-bar-in::-webkit-scrollbar{display:none}
.us-bar a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px 0 12px;border-radius:999px;font-size:15px;font-weight:600;line-height:1;color:var(--ink-2);white-space:nowrap;transition:background-color .25s,color .25s}
.us-bar a .ic{width:18px;height:18px;color:var(--cobalt);transition:color .25s}
.us-bar a:hover{background:var(--mist)}
.us-bar a.is-on{background:var(--cobalt);color:#fff}
.us-bar a.is-on .ic{color:#fff}

/* area block: copy + big visual, alternating sides */
.us-area{padding-block:clamp(64px,8vw,120px) 0}
.us-area:first-of-type{padding-top:clamp(72px,8vw,120px)}
.us-area-in{display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:clamp(40px,5.5vw,96px);align-items:center}
.us-area.is-flip .us-copy{order:2}
.us-num{display:flex;align-items:center;gap:12px;margin-bottom:20px;font:600 14px/1 var(--f);letter-spacing:.09em;text-transform:uppercase;color:var(--cobalt)}
.us-h{font-size:clamp(34px,3.7vw,54px)}
.us-line{margin-top:16px;max-width:34ch;font-size:clamp(18px,1.4vw,20px);line-height:1.5;color:var(--muted);text-wrap:pretty}
.us-svc{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}
.us-svc li{display:inline-flex;align-items:center;gap:9px;min-height:42px;padding:6px 15px 6px 7px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:15px;font-weight:500;line-height:1.25;color:var(--ink-2);transition:border-color .25s,transform .35s var(--ease)}
.us-svc li .ic{width:28px;height:28px;padding:5px;border-radius:50%;background:var(--cobalt-tint);color:var(--cobalt);stroke-width:2}
@media (hover:hover){.us-svc li:hover{border-color:var(--line-2);transform:translateY(-2px)}}
.us-foot{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;margin-top:28px;padding-top:22px;border-top:1px solid var(--line)}
.us-inc{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:600;color:var(--ink)}
.us-inc .ic{width:18px;height:18px;color:#1FA463;stroke-width:2.6}
.us-add{font-size:15px;font-weight:500;color:var(--muted)}
.us-add b{font-weight:700;color:var(--ink);white-space:nowrap;background:linear-gradient(transparent 58%,var(--yellow) 58% 92%,transparent 92%)}
.us-more{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-size:15px;font-weight:600;color:var(--cobalt)}
.us-more .ic{width:18px;height:18px;stroke-width:2.2;transition:transform .35s var(--ease)}
.us-more:hover .ic{transform:translateX(3px)}
.us-foot .us-more:first-of-type{margin-left:auto}

/* visual panel */
.us-viz{position:relative;min-height:clamp(460px,40vw,560px);border-radius:32px;background:var(--mist);overflow:hidden;isolation:isolate;box-shadow:inset 0 0 0 1px rgba(11,18,51,.04)}
.us-viz img{display:block;width:100%}
.us-float{position:absolute;z-index:3;display:flex;align-items:center;gap:12px;padding:12px 16px 12px 12px;border-radius:18px;background:#fff;box-shadow:var(--sh-2)}
.us-float i{width:40px;height:40px;flex:none;border-radius:12px;display:grid;place-items:center;background:var(--cobalt);color:#fff}
.us-float i .ic{width:20px;height:20px}
.us-float b{display:block;font-size:15px;font-weight:600;line-height:1.25}
.us-float small{display:block;font-size:14px;line-height:1.3;color:var(--muted)}
.us-glogo{display:block;width:44px;height:44px;flex:none}

/* 01 web */
.us-road{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.us-road path{fill:none;stroke:#fff;stroke-width:54;stroke-linecap:round;vector-effect:non-scaling-stroke}
.us-browser{position:absolute;left:11%;right:-9%;top:11%;border-radius:16px;overflow:hidden;background:#fff;box-shadow:var(--sh-2),inset 0 0 0 1px var(--line)}
.us-bbar{display:flex;align-items:center;gap:6px;height:34px;padding:0 14px;background:#F7F8FC;border-bottom:1px solid var(--line)}
.us-bbar i{width:10px;height:10px;border-radius:50%;background:#D8DCE8}
.us-bbar span{margin-inline:auto;translate:-15px 0;font-size:13px;line-height:1;color:var(--muted);background:#fff;border:1px solid var(--line);border-radius:8px;padding:5px 16px}
.us-phone{position:absolute;z-index:2;left:5%;top:40%;width:25%;max-width:160px;padding:6px;border-radius:30px;background:#0A0D1F;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.16),0 34px 60px -24px rgba(0,0,30,.7)}
.us-phone-v{aspect-ratio:9/19.5;overflow:hidden;border-radius:24px;background:#000}
.us-f-book{right:5%;top:58%}
.us-pill-dark{position:absolute;z-index:3;right:6%;bottom:8%;display:inline-flex;align-items:center;gap:8px;padding:11px 16px;border-radius:999px;background:var(--ink);color:#fff;font-size:15px;font-weight:600;box-shadow:var(--sh-2)}
.us-pill-dark .ic{width:18px;height:18px;color:#9FB0FF;stroke-width:2.4}

/* 02 shop */
.us-v-shop{display:grid;grid-template-columns:.92fr 1fr;gap:22px;align-items:center;padding:7% 6%}
.us-prod{padding:10px 10px 12px;border-radius:24px;background:#fff;box-shadow:var(--sh-2);rotate:-2deg}
.us-prod-img{aspect-ratio:1/1.22;border-radius:16px;overflow:hidden}
.us-prod-img img{height:100%;object-fit:cover;object-position:62% 50%}
.us-prod-row{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;padding:12px 6px 2px}
.us-prod-row small{display:block;font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:#C25B38}
.us-prod-row b{display:block;font-size:16px;font-weight:600;line-height:1.25}
.us-prod-row span{display:block;margin-top:4px;font-size:17px;font-weight:700}
.us-cartbtn{width:44px;height:44px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--cobalt);color:#fff;box-shadow:0 12px 24px -10px rgba(35,53,255,.7)}
.us-cartbtn .ic{width:20px;height:20px}
.us-track{position:relative;padding:20px;border-radius:24px;background:#fff;box-shadow:var(--sh-1)}
.us-track-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.us-track-h b{font-size:16px;font-weight:600}
.us-track-h small{font-size:14px;color:var(--muted)}
.us-track-line{position:absolute;left:36px;top:100px;width:10px;height:calc(100% - 150px)}
.us-track-line path{fill:none;stroke:var(--line-2);stroke-width:2}
.us-track-line path.draw{stroke:var(--cobalt);stroke-width:2.5}
.us-track ol{position:relative;display:grid;gap:26px;margin-top:20px}
.us-track li{display:flex;align-items:center;gap:12px}
.us-track li i{width:42px;height:42px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--cobalt-tint);color:var(--cobalt);box-shadow:0 0 0 4px #fff}
.us-track li i .ic{width:18px;height:18px}
.us-track li.on i{background:var(--cobalt);color:#fff}
.us-track li b{display:block;font-size:16px;font-weight:600;line-height:1.25}
.us-track li small{display:block;font-size:14px;color:var(--muted)}

/* 03 google */
.us-map{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.us-gcard{position:absolute;left:6%;bottom:8%;width:min(350px,82%);padding:12px;border-radius:22px;background:#fff;box-shadow:var(--sh-2)}
.us-gq{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:999px;background:var(--mist);font-size:15px;color:var(--ink-2)}
.us-gq .ic{width:18px;height:18px;color:var(--cobalt)}
.us-gres{display:flex;align-items:center;gap:12px;padding:14px 6px 12px}
.us-gres b{display:block;font-size:17px;font-weight:600;line-height:1.25}
.us-gres small{display:block;font-size:14px;font-weight:500;color:#127A4B}
.us-gacts{display:flex;gap:6px}
.us-gacts span{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;border-radius:999px;border:1px solid var(--line);font-size:14px;font-weight:600;color:var(--cobalt)}
.us-gacts .ic{width:16px;height:16px}
.us-f-ai{right:6%;top:8%}

/* 04 ads */
.us-v-ads{background:var(--cobalt-tint)}
.us-post{position:absolute;left:8%;top:8%;width:min(56%,310px);border-radius:22px;background:#fff;box-shadow:var(--sh-2);overflow:hidden;rotate:-1.5deg}
.us-post-h{display:flex;align-items:center;gap:10px;padding:12px 14px}
.us-post-h .us-glogo{width:36px;height:36px}
.us-post-h b{display:block;font-size:15px;font-weight:600;line-height:1.2}
.us-post-h small{display:block;font-size:13px;color:var(--muted);line-height:1.3}
.us-post-img{aspect-ratio:4/3.3;overflow:hidden}
.us-post-img img{height:100%;object-fit:cover}
.us-post-f{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 14px 14px;font-size:15px;font-weight:600}
.us-post-f em{font-style:normal;font-size:14px;font-weight:600;color:#fff;background:var(--cobalt);padding:8px 12px;border-radius:10px}
.us-camp{position:absolute;right:6%;bottom:8%;width:min(52%,300px);padding:16px;border-radius:22px;background:#fff;box-shadow:var(--sh-2)}
.us-camp-h{display:flex;justify-content:space-between;align-items:center;gap:8px}
.us-camp-h b{font-size:15px;font-weight:600}
.us-live{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;background:#E3F6EC;color:#127A4B;font-size:13px;font-weight:600;line-height:1}
.us-live::before{content:"";width:7px;height:7px;border-radius:50%;background:#1FA463}
.us-camp dl{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:12px 0 10px}
.us-camp dl div{padding:8px 9px;border-radius:12px;background:var(--mist)}
.us-camp dt{font-size:13px;color:var(--muted);line-height:1.2}
.us-camp dd{margin:4px 0 0;font-size:19px;font-weight:600;letter-spacing:-.03em;line-height:1}
.us-spark{display:block;width:100%;height:auto}
.us-camp-ch{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.us-camp-ch li{padding:5px 10px;border-radius:999px;background:var(--mist);font-size:13px;font-weight:600;color:var(--ink-2)}

/* 05 ai */
.us-v-ai{display:grid;align-content:center;justify-items:center;gap:20px;padding:7% 8%;background:radial-gradient(120% 90% at 20% 0%,#3B4BFF 0%,var(--cobalt) 45%,var(--cobalt-deep) 100%)}
.us-chat{width:min(100%,420px);border-radius:24px;background:#fff;box-shadow:0 40px 80px -30px rgba(3,6,60,.7);overflow:hidden}
.us-chat-h{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line)}
.us-chat-h .us-glogo{width:40px;height:40px}
.us-chat-h b{display:block;font-size:16px;font-weight:600;line-height:1.2}
.us-chat-h small{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.us-chat-h small i{width:7px;height:7px;border-radius:50%;background:#1FA463}
.us-chat-h>span{margin-left:auto;font-size:13px;font-weight:600;color:var(--muted)}
.us-chat-b{display:grid;gap:10px;padding:16px}
.us-msg{max-width:84%;padding:10px 14px;border-radius:18px;font-size:15.5px;line-height:1.4}
.us-msg.me{justify-self:end;background:var(--cobalt);color:#fff;border-bottom-right-radius:6px}
.us-msg.ai{justify-self:start;background:var(--mist);color:var(--ink);border-bottom-left-radius:6px}
.us-chat-in{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 12px 12px;padding:6px 6px 6px 16px;border-radius:999px;background:var(--mist);font-size:14px;color:var(--muted)}
.us-chat-in i{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--cobalt);color:#fff}
.us-chat-in .ic{width:16px;height:16px}
.us-chan{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.us-chan li{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.12);box-shadow:inset 0 0 0 1px rgba(255,255,255,.26);color:#fff;font-size:14px;font-weight:600;line-height:1}
.us-chan .ic{width:16px;height:16px}

/* 06 auto */
.us-v-auto{display:grid;align-content:center;gap:26px;padding:8% 8% 15%}
.us-flow{position:relative;display:grid;grid-template-columns:repeat(3,1fr);align-items:start}
.us-flow-line{position:absolute;left:16.67%;width:66.66%;top:0;height:60px;overflow:visible}
.us-node{position:relative;display:grid;justify-items:center;gap:10px}
.us-node i{width:60px;height:60px;border-radius:19px;display:grid;place-items:center;background:#fff;color:var(--ink-2);box-shadow:var(--sh-1)}
.us-node i.on{background:var(--cobalt);color:#fff;box-shadow:0 14px 30px -10px rgba(35,53,255,.6)}
.us-node .ic{width:25px;height:25px}
.us-node small{font-size:14px;font-weight:600;color:var(--ink-2)}
.us-cal{padding:16px;border-radius:22px;background:#fff;box-shadow:var(--sh-2)}
.us-cal-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.us-cal-h b{font-size:16px;font-weight:600}
.us-cal-h small{font-size:14px;color:var(--muted)}
.us-cal ul{display:grid;gap:8px;margin-top:12px}
.us-cal li{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;background:var(--mist);font-size:15px;font-weight:500}
.us-cal time{font-size:14px;font-weight:700;color:var(--cobalt)}
.us-cal em{font-style:normal;font-size:13px;font-weight:600;padding:4px 9px;border-radius:999px;background:#fff;color:var(--muted)}
.us-cal li.is-new{background:var(--cobalt-tint);box-shadow:inset 0 0 0 1.5px rgba(35,53,255,.35)}
.us-cal li.is-new em{background:var(--cobalt);color:#fff}
.us-f-rem{right:6%;bottom:5%}

/* 07 brand (the bistro's own palette) */
.us-v-brand{background:#F6EFE3}
.us-kit{position:absolute;z-index:2;left:7%;top:12%;width:min(50%,290px);padding:18px;border-radius:24px;background:#fff;box-shadow:var(--sh-2)}
.us-kit-logo{display:flex;align-items:center;gap:12px}
.us-kit-logo svg{width:52px;height:52px;flex:none}
.us-kit-logo b{display:block;font:600 26px/1 Georgia,"Times New Roman",serif;color:#1E3A2E}
.us-kit-logo small{display:block;margin-top:5px;font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#C25B38}
.us-sw{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:16px 0}
.us-sw li{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:500;color:var(--muted)}
.us-sw i{width:28px;height:28px;flex:none;border-radius:9px;background:var(--s);box-shadow:inset 0 0 0 1px rgba(11,18,51,.1)}
.us-kit-type{display:flex;align-items:center;gap:14px;padding-top:14px;border-top:1px solid var(--line)}
.us-kit-type b{font:600 40px/1 Georgia,"Times New Roman",serif;color:#1E3A2E}
.us-kit-type span{font-size:14px;line-height:1.3;color:var(--muted)}
.us-reel{position:absolute;right:9%;top:8%;bottom:8%;aspect-ratio:9/16;border-radius:26px;overflow:hidden;box-shadow:var(--sh-2);rotate:2deg}
.us-reel img{height:100%;object-fit:cover}
.us-rec{position:absolute;left:14px;top:14px;display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:8px;background:rgba(0,0,0,.45);color:#fff;font-size:13px;font-weight:600;line-height:1;letter-spacing:.06em}
.us-rec i{width:8px;height:8px;border-radius:50%;background:#FF4D4D}
.us-reel-play{position:absolute;left:50%;top:44%;width:60px;height:60px;translate:-50% -50%;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.92);color:var(--ink);box-shadow:0 10px 30px rgba(0,0,0,.25)}
.us-reel-play .ic{width:26px;height:26px}
.us-reel-sub{position:absolute;left:12px;right:12px;bottom:34px;text-align:center;font-size:16px;font-weight:600;line-height:1.2;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.6)}
.us-reel-bar{position:absolute;left:14px;right:14px;bottom:16px;height:4px;border-radius:4px;background:rgba(255,255,255,.35);overflow:hidden}
.us-reel-bar i{display:block;width:38%;height:100%;border-radius:4px;background:#fff}

/* 08 care (dark panel) */
.us-v-care{display:grid;align-content:center;gap:18px;padding:8%;background:radial-gradient(90% 70% at 85% 10%,#1A2566 0%,var(--ink) 60%);color:#fff}
.us-up{padding:18px;border-radius:22px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.us-up-h{display:flex;justify-content:space-between;align-items:center;gap:10px}
.us-up-st{display:inline-flex;align-items:center;gap:9px;font-size:16px;font-weight:600}
.us-up-st i{width:9px;height:9px;border-radius:50%;background:#3BD68A;box-shadow:0 0 0 5px rgba(59,214,138,.18)}
.us-up-h small{font-size:14px;color:#B9C0DE}
.us-up-bars{display:flex;gap:4px;height:44px;margin-top:14px}
.us-up-bars i{flex:1;border-radius:3px;background:#3BD68A;opacity:.88}
.us-care{display:flex;align-items:center;gap:22px}
.us-shield{position:relative;width:108px;height:108px;flex:none;border-radius:32px;display:grid;place-items:center;background:linear-gradient(160deg,#3444FF,#1B2AE0);color:#fff;box-shadow:0 20px 40px -16px rgba(35,53,255,.8)}
.us-shield::before{content:"";position:absolute;inset:-10px;border-radius:40px;border:1.5px dashed rgba(159,176,255,.35)}
.us-shield .ic{width:50px;height:50px;stroke-width:1.5}
.us-log{flex:1;display:grid;gap:8px}
.us-log li{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:10px 14px;border-radius:14px;background:rgba(255,255,255,.07);font-size:15px;font-weight:500}
.us-log time{font-size:14px;color:#9FA8D6}
.us-log b{display:inline-flex;align-items:center;gap:5px;font-size:14px;font-weight:600;color:#3BD68A}
.us-log .ic{width:16px;height:16px;stroke-width:2.6}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .us-v-shop{grid-template-columns:1fr 1fr;padding:7% 5%}
  .us-care{gap:16px}
  .us-shield{width:84px;height:84px;border-radius:26px}
  .us-shield .ic{width:40px;height:40px}
}
@media (max-width:900px){
  .us-area-in{grid-template-columns:1fr;gap:36px}
  .us-area.is-flip .us-copy{order:0}
  .us-viz{min-height:460px}
}
@media (max-width:600px){
  .us-onode{translate:-50% -50%}
  .us-onode i{width:46px;height:46px;border-radius:15px}
  .us-onode .ic{width:22px;height:22px}
  .us-onode span{display:none}
  .us-bar{margin-top:-26px;top:calc(var(--hdr) + 6px)}
  .us-bar-in{width:auto}
  .us-bar a{padding:0 14px 0 11px}
  .us-svc{display:grid;grid-template-columns:1fr 1fr;gap:6px}
  .us-svc li{align-items:center;min-height:48px;padding:7px 10px 7px 7px;border-radius:14px;font-size:14px}
  .us-svc li .ic{width:26px;height:26px}
  .us-foot .us-more:first-of-type{margin-left:0}
  .us-viz{min-height:420px;border-radius:26px}
  .us-browser{left:8%;right:-22%;top:9%}
  .us-bbar span{display:none}
  .us-phone{left:5%;top:34%;width:31%;padding:4px;border-radius:22px}
  .us-phone-v{border-radius:18px}
  .us-f-book{right:4%;top:auto;bottom:24%;padding:10px 12px 10px 10px}
  .us-pill-dark{right:4%;bottom:6%;font-size:14px;padding:10px 14px}
  .us-v-shop{grid-template-columns:1fr;gap:14px;padding:22px 18px}
  .us-prod{display:flex;align-items:center;gap:12px;rotate:0deg}
  .us-prod-img{width:96px;flex:none;aspect-ratio:1}
  .us-prod-row{flex:1;padding:0 4px 0 0}
  .us-track-line{left:36px;top:96px;height:calc(100% - 144px)}
  .us-track ol{gap:20px}
  .us-gcard{left:5%;width:90%;bottom:5%}
  .us-f-ai{right:5%;top:5%}
  .us-post{left:5%;top:5%;width:64%}
  .us-v-ads{min-height:500px}
  .us-camp{left:5%;right:5%;bottom:4%;width:auto;padding:13px}
  .us-camp-ch{display:none}
  .us-camp dd{font-size:17px}
  .us-v-ai{padding:22px 16px}
  .us-v-auto{padding:24px 16px 88px}
  .us-f-rem{right:auto;left:16px;bottom:16px}
  .us-kit{left:5%;top:7%;width:60%;padding:14px}
  .us-kit-logo svg{width:40px;height:40px}
  .us-kit-logo b{font-size:21px}
  .us-kit-logo small{font-size:13px;letter-spacing:.08em}
  .us-sw{grid-template-columns:repeat(4,1fr);gap:6px}
  .us-sw li{font-size:0;gap:0}
  .us-sw i{width:100%;height:30px}
  .us-kit-type b{font-size:32px}
  .us-reel{right:5%;top:22%;bottom:5%}
  .us-v-care{padding:22px 16px}
  .us-shield{display:none}
  .us-log li{font-size:14px;gap:10px;padding:10px 12px}
}

/* ==== 63-video.css ==== */
/* Video page (owner: video agent) · prefix vd- · v5 „Кобалт Про“ */
.vd-defs{position:absolute;width:0;height:0;overflow:hidden}
.vd-hero :focus-visible,.vd-addon :focus-visible{outline-color:#fff}

/* ---------- hero: storyboard reel in a phone ---------- */
.vd-y{color:var(--yellow);font-weight:600;white-space:nowrap}
.vd-acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.vd-visual{position:relative;display:grid;place-items:center;padding-block:12px}
.vd-stage{position:relative;width:clamp(220px,20vw,280px)}
.vd-phone{position:relative;z-index:1;padding:9px;border-radius:44px;background:#0A0D1F;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.16),0 44px 80px -30px rgba(0,0,30,.8)}
.vd-screen{position:relative;isolation:isolate;aspect-ratio:9/19.5;overflow:hidden;border-radius:35px;background:#070B52}
.vd-screen::before{content:'';position:absolute;z-index:6;top:2.2%;left:50%;width:30%;height:3.1%;translate:-50% 0;border-radius:99px;background:#000}
.vd-f{position:absolute;inset:0;opacity:0}
.vd-f1{opacity:1;z-index:1}.vd-f2{z-index:2}.vd-f3{z-index:3}.vd-f4{z-index:4}
.vd-f>svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.vd-cap{position:absolute;left:50%;bottom:8.5%;translate:-50% 0;width:max-content;max-width:86%;padding:7px 12px;border-radius:10px;background:rgba(7,11,82,.78);color:#fff;font:600 15px/1.3 var(--f);text-align:center;text-wrap:balance}
.vd-endc{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding-bottom:6%;text-align:center;color:#fff;background:repeating-radial-gradient(circle at 50% 44%,transparent 0 58px,rgba(255,255,255,.07) 58px 60px),radial-gradient(circle at 50% 44%,#4050FF,#2335FF 50%,#1B2AE0)}
.vd-logo{width:68px;height:68px;margin-bottom:8px;filter:drop-shadow(0 12px 20px rgba(0,0,40,.35))}
.vd-endc b{font-size:22px;line-height:1.15;font-weight:600;letter-spacing:-.02em}
.vd-endc small{font-size:14px;color:rgba(255,255,255,.8)}
.vd-endbtn{margin-top:18px;padding:11px 18px;border-radius:999px;background:var(--yellow);color:var(--ink);font-size:15px;font-weight:600}
.vd-prog{position:absolute;z-index:5;top:7.2%;left:8%;right:8%;height:3px;border-radius:3px;background:rgba(255,255,255,.34);overflow:hidden;-webkit-mask:repeating-linear-gradient(90deg,#000 0 calc(25% - 4px),transparent calc(25% - 4px) 25%);mask:repeating-linear-gradient(90deg,#000 0 calc(25% - 4px),transparent calc(25% - 4px) 25%)}
.vd-prog i{display:block;height:100%;background:#fff;transform:scaleX(.25);transform-origin:0 50%}

.vd-board{position:absolute;z-index:2;right:calc(100% - 64px);top:15%;width:222px;padding:14px 14px 12px;border-radius:22px;background:#fff;color:var(--ink);box-shadow:0 2px 6px rgba(11,18,51,.08),0 30px 60px -22px rgba(3,6,60,.6)}
.vd-board-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.vd-board-h b{font-size:15px;font-weight:600}
.vd-pp{display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:50%;background:var(--cobalt-tint);color:var(--cobalt);cursor:pointer;transition:background-color .25s}
.vd-pp:hover{background:#DDE1FF}
.vd-pp .ic{width:17px;height:17px;stroke-width:2.4}
.vd-i-play{display:none;fill:currentColor}
.vd-pp[aria-pressed="true"] .vd-i-pause{display:none}
.vd-pp[aria-pressed="true"] .vd-i-play{display:block}
.vd-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.vd-thumbs li{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--muted)}
.vd-thumbs svg{width:100%;aspect-ratio:9/15;border-radius:8px;display:block;box-shadow:0 0 0 1px var(--line)}
.vd-t1 svg{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--cobalt)}
.vd-t1 span{color:var(--cobalt)}
.vd-subs{position:absolute;z-index:2;right:-96px;bottom:21%;display:flex;align-items:center;gap:10px;width:max-content;padding:10px 16px 10px 10px;border-radius:18px;background:#fff;color:var(--ink);font-size:15px;line-height:1.2;box-shadow:0 2px 6px rgba(11,18,51,.08),0 30px 60px -22px rgba(3,6,60,.6)}
.vd-subs b{font-weight:600}
.vd-subs small{display:block;font-size:13px;font-weight:500;color:var(--muted)}
.vd-subs span{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--cobalt);color:#fff;font-size:15px}

@media (prefers-reduced-motion:no-preference){
  .vd-f{animation:vd-frame 12s linear infinite both;animation-delay:var(--d)}
  .vd-f1,.vd-t1 svg,.vd-t1 span{--d:0s}
  .vd-f2,.vd-t2 svg,.vd-t2 span{--d:-9s}
  .vd-f3,.vd-t3 svg,.vd-t3 span{--d:-6s}
  .vd-f4,.vd-t4 svg,.vd-t4 span{--d:-3s}
  .vd-f .vd-cap{animation:vd-cap 12s var(--ease) infinite both;animation-delay:var(--d)}
  .vd-prog i{animation:vd-prog 12s linear infinite}
  .vd-thumbs svg{animation:vd-thumb 12s linear infinite both;animation-delay:var(--d)}
  .vd-thumbs span{animation:vd-num 12s linear infinite both;animation-delay:var(--d)}
  .is-paused .vd-f,.is-paused .vd-cap,.is-paused .vd-prog i,.is-paused .vd-thumbs svg,.is-paused .vd-thumbs span{animation-play-state:paused}
}
@media (prefers-reduced-motion:reduce){.vd-pp{display:none}}
@keyframes vd-frame{0%{opacity:0;transform:scale(1.07)}4%{opacity:1}29%{opacity:1}29.5%,100%{opacity:0;transform:scale(1)}}
@keyframes vd-cap{0%,6%{opacity:0;transform:translateY(8px)}11%,100%{opacity:1;transform:none}}
@keyframes vd-prog{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes vd-thumb{0%,24.6%{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--cobalt)}25%,100%{box-shadow:0 0 0 1px var(--line)}}
@keyframes vd-num{0%,24.6%{color:var(--cobalt)}25%,100%{color:var(--muted)}}

/* ---------- process ---------- */
.vd-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}
.vd-step{position:relative;display:flex;flex-direction:column}
.vd-step>p{margin-top:8px;max-width:26ch;font-size:17px;line-height:1.5;color:var(--muted)}
.vd-viz{position:relative;isolation:isolate;aspect-ratio:1;border-radius:28px;overflow:hidden;background:var(--mist);box-shadow:inset 0 0 0 1px rgba(11,18,51,.04)}
.vd-meta{position:relative;display:flex;align-items:center;height:48px;margin:26px 0 16px}
.vd-node{position:relative;z-index:1;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--cobalt);color:#fff;font:600 16px/1 var(--f);box-shadow:0 0 0 7px rgba(35,53,255,.12),0 10px 22px -8px rgba(35,53,255,.6)}
.vd-step:not(:last-child) .vd-meta::after{content:'';position:absolute;left:62px;right:-14px;top:50%;height:2px;margin-top:-1px;border-radius:2px;background:linear-gradient(90deg,var(--cobalt),rgba(35,53,255,.18));transform-origin:0 50%}
@media (prefers-reduced-motion:no-preference){
  html.js .vd-step.rv:not(.in) .vd-meta::after{transform:scaleX(0)}
  html.js .vd-step.rv .vd-viz{transition:clip-path 1.1s var(--ease);transition-delay:calc(var(--i,0)*60ms)}
  html.js .vd-step.rv:not(.in) .vd-viz{clip-path:inset(10% 8% round 28px)}
  html.js .vd-step.rv.in .vd-viz{clip-path:inset(0 round 28px)}
  .vd-step .vd-meta::after{transition:transform 1.2s var(--ease) .5s}
}

.vd-v-script,.vd-v-files{background:linear-gradient(160deg,#E9ECFF,#F4F5FB 62%)}
.vd-sheet{position:absolute;left:50%;top:47%;width:76%;translate:-50% -50%;rotate:-3deg;padding:14px 14px 16px;border-radius:18px;background:#fff;box-shadow:var(--sh-2)}
.vd-sheet-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:14px}
.vd-sheet-h b{font-weight:600}
.vd-sheet-h span{color:var(--muted);font-size:13px}
.vd-sheet-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.vd-sheet-row figure{display:flex;flex-direction:column;gap:5px}
.vd-sheet-row svg{width:100%;aspect-ratio:9/14;border-radius:8px;display:block;margin-bottom:3px}
.vd-sheet-row i{height:5px;border-radius:5px;background:var(--mist-2)}
.vd-sheet-row i+i{width:62%}
.vd-ok{position:absolute;right:8%;bottom:8%;display:inline-flex;align-items:center;gap:8px;padding:8px 14px 8px 8px;border-radius:999px;background:var(--ink);color:#fff;font-size:14px;font-weight:600;box-shadow:var(--sh-2)}
.vd-ok .ic{width:24px;height:24px;padding:4px;border-radius:50%;background:var(--cobalt);stroke-width:2.8}

.vd-v-shoot>svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.vd-v-shoot::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,11,82,.18),rgba(7,11,82,0) 30%,rgba(7,11,82,0) 70%,rgba(7,11,82,.35))}
.vd-vf{position:absolute;z-index:2;width:24px;height:24px;border:0 solid #fff}
.vd-vf.tl{left:16px;top:16px;border-width:2.5px 0 0 2.5px;border-top-left-radius:7px}
.vd-vf.tr{right:16px;top:16px;border-width:2.5px 2.5px 0 0;border-top-right-radius:7px}
.vd-vf.bl{left:16px;bottom:16px;border-width:0 0 2.5px 2.5px;border-bottom-left-radius:7px}
.vd-vf.br{right:16px;bottom:16px;border-width:0 2.5px 2.5px 0;border-bottom-right-radius:7px}
.vd-focus{position:absolute;z-index:2;left:50%;top:44%;width:24%;aspect-ratio:1;translate:-50% -50%;border-radius:8px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.9)}
.vd-rec{position:absolute;z-index:3;left:26px;top:26px;display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:8px;background:rgba(7,11,52,.55);color:#fff;font:600 13px/1 var(--f);letter-spacing:.06em}
.vd-rec i{width:8px;height:8px;border-radius:50%;background:#FF4D4D}
.vd-tc{position:absolute;z-index:3;right:26px;bottom:26px;padding:6px 9px;border-radius:8px;background:rgba(7,11,52,.55);color:#fff;font:500 13px/1 var(--f);font-variant-numeric:tabular-nums;letter-spacing:.02em}

.vd-v-edit{display:flex;flex-direction:column;gap:10px;padding:14px;background:var(--ink)}
.vd-prev{position:relative;flex:1;min-height:0;border-radius:14px;overflow:hidden}
.vd-prev svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.vd-ai{position:absolute;right:10px;top:10px;display:inline-flex;align-items:center;gap:6px;padding:6px 10px 6px 8px;border-radius:999px;background:rgba(255,255,255,.94);color:var(--cobalt);font-size:13px;font-weight:600;box-shadow:0 8px 20px -8px rgba(0,0,40,.5)}
.vd-ai .ic{width:15px;height:15px;fill:currentColor;stroke:none}
.vd-tracks{position:relative;display:grid;gap:5px}
.vd-trk{display:flex;gap:3px;height:20px}
.vd-trk>*{flex:var(--w,1);min-width:0;border-radius:5px;overflow:hidden}
.vd-trk-v svg{width:100%;height:100%;display:block}
.vd-trk-a{border-radius:5px;background:rgba(35,53,255,.28)}
.vd-trk-a svg{width:100%;height:100%;display:block;fill:none;stroke:#8C96FF;stroke-width:1.2;stroke-linejoin:round}
.vd-trk-s i{background:rgba(255,255,255,.2)}
.vd-trk-s b{background:transparent}
.vd-head{position:absolute;top:-7px;bottom:-3px;left:37%;width:2px;border-radius:2px;background:#fff;box-shadow:0 0 10px rgba(255,255,255,.6)}
.vd-head::before{content:'';position:absolute;left:50%;top:0;width:10px;height:10px;translate:-50% 0;border-radius:3px 3px 50% 50%;background:#fff}

.vd-v-files{display:grid;place-items:center}
.vd-files{width:84%;padding:6px 14px;border-radius:18px;background:#fff;box-shadow:var(--sh-2)}
.vd-file{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:13px;font-weight:500;color:var(--ink-2)}
.vd-file+.vd-file{border-top:1px solid var(--line)}
.vd-file i{flex:none;display:grid;place-items:center;width:26px;height:26px}
.vd-file i::before{content:'';width:var(--w);height:var(--h);border:2px solid var(--cobalt);border-radius:3px}
.vd-file-s i{border-radius:7px;background:var(--cobalt-tint);color:var(--cobalt);font-size:13px;font-style:normal;font-weight:700}
.vd-file-s i::before{display:none}
.vd-file b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.vd-file .ic{width:18px;height:18px;padding:3px;border-radius:50%;background:#E3F6EC;color:#127A4B;stroke-width:3}

/* ---------- formats ---------- */
.vd-fmts{container-type:inline-size;display:flex;justify-content:center;align-items:flex-start;gap:28px}
.vd-fmt{--fh:min(260px,calc((100cqw - 84px - 56px)/4.1403));display:flex;flex-direction:column;align-items:center;text-align:center}
.vd-fr{position:relative;flex:none;padding:7px;background:
  linear-gradient(var(--cobalt) 0 0) 0 0/16px 2px,linear-gradient(var(--cobalt) 0 0) 0 0/2px 16px,
  linear-gradient(var(--cobalt) 0 0) 100% 0/16px 2px,linear-gradient(var(--cobalt) 0 0) 100% 0/2px 16px,
  linear-gradient(var(--cobalt) 0 0) 0 100%/16px 2px,linear-gradient(var(--cobalt) 0 0) 0 100%/2px 16px,
  linear-gradient(var(--cobalt) 0 0) 100% 100%/16px 2px,linear-gradient(var(--cobalt) 0 0) 100% 100%/2px 16px;background-repeat:no-repeat}
.vd-fr-in{position:relative;width:calc(var(--fh)*var(--r));height:var(--fh);border-radius:10px;overflow:hidden;box-shadow:0 0 0 1px rgba(35,53,255,.16),var(--sh-1);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.vd-fmt:hover .vd-fr-in{transform:translateY(-4px);box-shadow:0 0 0 1px rgba(35,53,255,.3),var(--sh-2)}
.vd-fr-in svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.vd-fcap{position:absolute;left:50%;bottom:9%;translate:-50% 0;width:max-content;max-width:88%;padding:5px 9px;border-radius:7px;background:rgba(7,11,82,.8);color:#fff;font:600 13px/1.3 var(--f)}
.vd-fr-r{margin-top:20px;font-size:28px;line-height:1;font-weight:600;letter-spacing:-.03em}
.vd-fr-w{margin-top:8px;max-width:17ch;font-size:15px;line-height:1.4;color:var(--muted)}

/* ---------- price ---------- */
.vd-tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.vd-tier{display:flex;flex-direction:column;padding:32px 30px 30px;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.vd-tier:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.vd-dur{display:flex;align-items:baseline;gap:10px}
.vd-dur b{font-size:clamp(56px,5vw,76px);line-height:.9;font-weight:600;letter-spacing:-.05em}
.vd-dur span{font-size:18px;font-weight:500;color:var(--muted)}
.vd-ruler{position:relative;height:8px;margin:28px 0 10px;border-radius:8px;background:var(--mist-2)}
.vd-ruler i{position:absolute;left:0;top:0;bottom:0;width:calc(var(--len)/30*100%);border-radius:8px;background:linear-gradient(90deg,#8F99FF,var(--cobalt))}
.vd-ruler i::after{content:'';position:absolute;right:-8px;top:50%;width:18px;height:18px;margin-top:-9px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px var(--cobalt),0 4px 10px rgba(35,53,255,.4)}
.vd-ticks{display:flex;justify-content:space-between;font-size:13px;color:var(--muted)}
.vd-tname{margin-top:26px;font:600 14px/1 var(--f);letter-spacing:.09em;text-transform:uppercase;color:var(--cobalt)}
.vd-tprice{margin-top:12px;font-size:clamp(34px,3vw,44px);line-height:1.1;font-weight:600;letter-spacing:-.04em;white-space:nowrap}
.vd-tprice span{padding-inline:2px;background:linear-gradient(transparent 62%,var(--yellow) 62% 90%,transparent 90%)}
.vd-tier .btn{margin-top:30px}

.vd-price{padding-bottom:clamp(56px,6vw,96px)}
.vd-incl{margin-top:56px;text-align:center}
.vd-incl-h{margin-bottom:18px;font:600 14px/1 var(--f);letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.vd-incl-l{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:980px;margin-inline:auto}
.vd-incl-l .chip{white-space:normal;text-align:left;line-height:1.3;padding-block:7px}
.vd-incl-l .ic{width:17px;height:17px;color:var(--cobalt);stroke-width:2.6}

.vd-addon{display:flex;align-items:center;gap:24px;margin-top:48px;padding:26px 28px;border-radius:28px;background:var(--ink);color:#fff;box-shadow:var(--sh-2)}
.vd-addon-i{flex:none;display:grid;place-items:center;width:56px;height:56px;border-radius:18px;background:var(--cobalt)}
.vd-addon-i .ic{width:26px;height:26px}
.vd-addon p{flex:1;font-size:18px;line-height:1.5;color:#B9C0DE}
.vd-addon b{color:#fff;font-weight:600}
.vd-addon .btn{flex:none}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .vd-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 28px}
  .vd-step:nth-child(2n) .vd-meta::after{display:none}
}
@media (max-width:900px){
  .vd-visual{padding-block:24px 8px}
  .vd-tiers{grid-template-columns:1fr;max-width:520px;margin-inline:auto}
  .vd-addon{flex-direction:column;align-items:flex-start;gap:18px}
  .vd-addon .btn{width:100%}
}
@media (max-width:700px){
  .vd-stage{width:200px}
  .vd-phone{padding:7px;border-radius:36px}
  .vd-screen{border-radius:29px}
  .vd-cap{font-size:13px;padding:6px 10px}
  .vd-endc b{font-size:18px}
  .vd-endbtn{font-size:13px;padding:9px 14px}
  .vd-board{right:calc(100% - 96px);top:36%;width:164px;padding:10px 10px 9px;border-radius:18px}
  .vd-board-h{margin-bottom:8px}
  .vd-board-h b{font-size:13px}
  .vd-pp{width:32px;height:32px}
  .vd-thumbs{gap:5px}
  .vd-thumbs svg{border-radius:6px}
  .vd-subs{right:-64px;top:9%;bottom:auto;padding:8px 12px 8px 8px;font-size:14px;border-radius:14px;gap:8px}
  .vd-subs span{width:28px;height:28px;font-size:13px;border-radius:8px}

  .vd-steps{grid-template-columns:1fr;gap:44px}
  .vd-meta::after{display:none}
  .vd-viz{aspect-ratio:5/4}
  .vd-meta{margin:20px 0 12px}

  .vd-fmts{display:grid;grid-template-columns:repeat(3,auto);justify-content:center;align-items:start;gap:32px 12px}
  .vd-fmt{--fh:calc((100cqw - 24px - 42px)/2.3625)}
  .vd-fmt:first-child{grid-column:1/-1}
  .vd-fmt:first-child .vd-fr-in{width:calc(100cqw - 14px);height:auto;aspect-ratio:16/9}
  .vd-fr-r{margin-top:14px;font-size:22px}
  .vd-fr-w{font-size:14px}
  .vd-fmt:not(:first-child) .vd-fcap{max-width:none;padding:4px 6px;white-space:nowrap}

  .vd-tier{padding:26px 22px 22px}
  .vd-incl{text-align:left}
  .vd-incl-l{display:grid;gap:0;padding:4px 20px;border:1px solid var(--line);border-radius:22px;background:#fff;box-shadow:var(--sh-1)}
  .vd-incl-l .chip{min-height:0;padding:13px 0;border:0;border-radius:0;background:none;font-size:16px}
  .vd-incl-l .chip+.chip{border-top:1px solid var(--line)}
  .vd-addon{padding:22px}
}

/* ==== 64-instrumenti.css ==== */
/* Инструменти (.tl-) · v5 „Кобалт Про“: calculator, 60-second site check, channel route. Owner: instrumenti page agent. */
.page-instrumenti{--tl-ok:#127A4B;--tl-ok-bg:#E3F6EC;--tl-no:#C2361B;--tl-no-bg:#FFEDE8;--tl-mid:#C77700}

/* shared controls: the real radio sits invisibly on top of its label */
.tl-imp-opts label,.tl-yn label,.tl-goal-opts label,.tl-type{position:relative;cursor:pointer}
.tl-imp-opts input,.tl-yn input,.tl-goal-opts input,.tl-type input{position:absolute;inset:0;z-index:2;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
:where(.page-instrumenti) fieldset{border:0;margin:0;padding:0;min-width:0}
.tl-fine{font-size:15px;line-height:1.45;color:var(--muted)}

/* ---------- sub-hero: preview of the three tools ---------- */
.tl-safe{display:inline-flex;align-items:center;gap:10px;margin-top:26px;padding:10px 16px 10px 12px;border-radius:999px;background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);font-size:15px;line-height:1.3;color:rgba(255,255,255,.9)}
.tl-safe .ic{width:18px;height:18px;color:#B9C2FF}
.tl-pv{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);grid-template-rows:auto auto;gap:16px}
.tl-pv-card{position:relative;display:flex;flex-direction:column;min-width:0;padding:20px 20px 22px;border-radius:24px;background:#fff;color:var(--ink);box-shadow:inset 0 1px 0 #fff,0 30px 60px -26px rgba(3,6,60,.6);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.tl-pv-card:hover{transform:translateY(-4px);box-shadow:inset 0 1px 0 #fff,0 40px 70px -26px rgba(3,6,60,.7)}
.tl-pv-calc{grid-row:1/3}
.tl-pv-n{align-self:flex-start;padding:6px 9px;border-radius:999px;background:var(--cobalt-tint);color:var(--cobalt);font:600 13px/1 var(--f);letter-spacing:.04em}
.tl-pv-t{margin-top:12px;font-size:17px;font-weight:600;line-height:1.25;letter-spacing:-.01em}
.tl-pv-big{margin-top:auto;padding-top:22px;font-size:clamp(34px,3.4vw,48px);font-weight:600;line-height:1;letter-spacing:-.045em;white-space:nowrap}
.tl-pv-sub{margin-top:6px;font-size:14px;color:var(--muted)}
.tl-pv-bars{display:grid;gap:8px;margin-top:20px}
.tl-pv-bars i{display:block;height:12px;width:calc(var(--v)*100%);border-radius:6px;background:var(--line-2)}
.tl-pv-bars i+i{background:linear-gradient(90deg,var(--cobalt),#7D8BFF)}
.tl-pv-f{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-top:18px;font-size:14px;line-height:1.2}
.tl-pv-f em{font-style:normal;color:var(--muted)}
.tl-pv-f b{white-space:nowrap;padding:4px 8px;border-radius:8px;background:var(--mist);font-size:15px;font-weight:600}
.tl-pv-slide{position:relative;height:6px;margin:12px 10px 0 0;border-radius:6px;background:linear-gradient(90deg,var(--cobalt) var(--p),var(--mist-2) var(--p))}
.tl-pv-slide i{position:absolute;left:var(--p);top:50%;width:22px;height:22px;translate:-50% -50%;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 6px var(--cobalt),0 4px 12px rgba(35,53,255,.35)}
.tl-pv-ring{position:relative;align-self:center;width:min(120px,100%);margin-top:12px}
.tl-pv-ring svg{display:block;width:100%;height:auto;transform:rotate(-90deg)}
.tl-pv-ring circle{fill:none;stroke:var(--mist-2);stroke-width:18}
.tl-pv-ring circle.on{stroke:var(--cobalt);stroke-dasharray:70 100;stroke-linecap:round}
.tl-pv-ring b{position:absolute;inset:0;display:grid;place-content:center;grid-auto-flow:column;align-items:baseline;font-size:34px;font-weight:600;letter-spacing:-.04em}
.tl-pv-ring small{font-size:15px;color:var(--muted);letter-spacing:0}
.tl-pv-road{display:block;width:100%;height:auto;margin-top:14px;overflow:visible}
.tl-pv-road .bg{fill:none;stroke:var(--mist-2);stroke-width:12;stroke-linecap:round}
.tl-pv-road .fg{fill:none;stroke:var(--cobalt);stroke-width:2.6;stroke-linecap:round}
.tl-pv-road circle{fill:#fff;stroke:var(--cobalt);stroke-width:3.5}
.tl-pv-road .pin{fill:var(--yellow);stroke:var(--ink);stroke-width:1.6}

/* ---------- 1 · calculator ---------- */
.tl-calc-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:24px;align-items:stretch}
.tl-form{display:grid;gap:30px;align-content:start;padding:clamp(24px,3vw,44px)}
.tl-field-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:14px}
.tl-field-top label{font-size:17px;font-weight:600;line-height:1.3}
.tl-field-top label small{display:block;margin-top:2px;font-size:14px;font-weight:400;color:var(--muted)}
.tl-num{flex:none;display:inline-flex;align-items:baseline;gap:6px;padding:8px 14px;border-radius:14px;background:var(--mist);transition:box-shadow .25s}
.tl-num:focus-within{box-shadow:inset 0 0 0 2px var(--cobalt)}
.tl-num input{width:5.4ch;padding:0;border:0;background:transparent;font-size:24px;font-weight:600;line-height:1.2;letter-spacing:-.02em;text-align:right;-moz-appearance:textfield;appearance:textfield}
.tl-num input:focus{outline:0}
.tl-num input::-webkit-outer-spin-button,.tl-num input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.tl-num span{font-size:15px;font-weight:500;color:var(--muted)}
.tl-range{--p:50%;display:block;width:100%;height:28px;margin:0;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer}
.tl-range::-webkit-slider-runnable-track{height:8px;border-radius:8px;background:linear-gradient(90deg,var(--cobalt) var(--p),var(--mist-2) var(--p))}
.tl-range::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;margin-top:-10px;border:0;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 7px var(--cobalt),0 4px 14px rgba(35,53,255,.38);transition:transform .2s var(--ease)}
.tl-range:active::-webkit-slider-thumb{transform:scale(1.12)}
.tl-range::-moz-range-track{height:8px;border-radius:8px;background:var(--mist-2)}
.tl-range::-moz-range-progress{height:8px;border-radius:8px;background:var(--cobalt)}
.tl-range::-moz-range-thumb{width:28px;height:28px;border:0;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 7px var(--cobalt),0 4px 14px rgba(35,53,255,.38)}
.tl-range:focus{outline:0}
.tl-range:focus-visible::-webkit-slider-thumb{box-shadow:inset 0 0 0 7px var(--cobalt),0 0 0 4px rgba(35,53,255,.25)}
.tl-imp{padding-top:26px;border-top:1px solid var(--line)}
.tl-imp legend{float:left;width:100%;padding:0;margin-bottom:14px;font-size:17px;font-weight:600;line-height:1.3}
.tl-imp-opts{clear:both;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.tl-imp-opts span{display:grid;place-items:center;min-height:50px;padding:0 8px;border-radius:999px;box-shadow:inset 0 0 0 1.5px var(--line-2);font-size:17px;font-weight:600;white-space:nowrap;transition:background-color .25s,color .25s,box-shadow .25s}
.tl-imp-opts label:hover span{box-shadow:inset 0 0 0 1.5px var(--ink)}
.tl-imp-opts input:checked+span{background:var(--ink);color:#fff;box-shadow:none}
.tl-imp-opts input:focus-visible+span,.tl-yn input:focus-visible+span,.tl-goal-opts input:focus-visible+span{outline:3px solid var(--cobalt);outline-offset:3px}

.tl-res{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;padding:clamp(28px,3.4vw,48px);border-radius:28px;color:#fff;background:linear-gradient(165deg,#18225C 0%,var(--ink) 55%)}
.tl-res::before{content:'';position:absolute;z-index:-1;right:-20%;top:-30%;width:80%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(35,53,255,.55),transparent 65%)}
.tl-res::after{content:'';position:absolute;z-index:-1;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:linear-gradient(#000,transparent 70%);mask-image:linear-gradient(#000,transparent 70%)}
.tl-res-k{font:600 14px/1 var(--f);letter-spacing:.09em;text-transform:uppercase;color:#B9C2FF}
.tl-big{display:flex;align-items:baseline;gap:12px;margin-top:16px;font-size:clamp(64px,8.2vw,124px);font-weight:600;line-height:.95;letter-spacing:-.055em;white-space:nowrap}
.tl-big small{font-size:.42em;letter-spacing:-.02em;color:#B9C2FF}
.tl-note{margin-top:12px;font-size:16px;line-height:1.45;color:#B9C0DE}
.tl-kpis{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:30px}
.tl-kpis p{padding:16px 18px;border-radius:18px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.tl-kpis b{display:block;font-size:clamp(26px,2.4vw,32px);font-weight:600;line-height:1.1;letter-spacing:-.03em;color:#8FF0C4;white-space:nowrap}
.tl-kpis p>span{display:block;margin-top:4px;font-size:15px;color:#B9C0DE}
.tl-bars{display:grid;gap:18px;margin-top:30px}
.tl-bar p{display:flex;justify-content:space-between;align-items:baseline;gap:6px 12px;flex-wrap:wrap;margin-bottom:8px;font-size:15px}
.tl-bar p span{color:#B9C0DE}
.tl-bar p b{font-weight:600}
.tl-track{height:14px;border-radius:8px;background:rgba(255,255,255,.08);overflow:hidden}
.tl-track i{display:block;width:calc(var(--v,0)*100%);height:100%;border-radius:inherit;transition:width .7s var(--ease)}
.tl-bar-now i{background:#5A6399}
.tl-bar-new i{background:linear-gradient(90deg,var(--cobalt),#8C98FF)}
.tl-bars{margin-bottom:34px}
.tl-res .tl-cta{margin-top:auto}
.tl-res .tl-fine{margin-top:12px;text-align:center;color:#9AA3C7}

/* ---------- 2 · site check ---------- */
.tl-check-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px;align-items:start}
.tl-qs{padding:8px clamp(18px,2.6vw,34px)}
.tl-q fieldset{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px 18px;padding:14px 0}
.tl-q+.tl-q fieldset{border-top:1px solid var(--line)}
.tl-q legend{float:left;display:flex;align-items:center;gap:14px;padding:0;font-size:17px;font-weight:500;line-height:1.35;color:var(--ink-2)}
.tl-q-n{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--mist);color:var(--muted);font:600 14px/1 var(--f);transition:background-color .3s,color .3s}
.tl-q:has(input[value="1"]:checked) .tl-q-n{background:var(--tl-ok-bg);color:var(--tl-ok)}
.tl-q:has(input[value="0"]:checked) .tl-q-n{background:var(--tl-no-bg);color:var(--tl-no)}
.tl-yn{display:flex;gap:4px;padding:4px;border-radius:999px;background:var(--mist)}
.tl-yn span{display:grid;place-items:center;min-width:62px;min-height:44px;padding:0 14px;border-radius:999px;font-size:16px;font-weight:600;color:var(--muted);transition:background-color .25s,color .25s,box-shadow .25s}
.tl-yn label:hover span{color:var(--ink)}
.tl-yn input[value="1"]:checked+span{background:var(--tl-ok);color:#fff;box-shadow:0 6px 14px -6px rgba(18,122,75,.6)}
.tl-yn input[value="0"]:checked+span{background:var(--tl-no);color:#fff;box-shadow:0 6px 14px -6px rgba(194,54,27,.6)}
.tl-nojs{padding:14px 0 18px;font-size:15px;color:var(--muted)}
html.js .tl-nojs{display:none}

.tl-score{position:sticky;top:calc(var(--hdr) + 24px);padding:clamp(24px,3vw,40px);text-align:center;--ring:var(--cobalt)}
.tl-score[data-grade="low"]{--ring:var(--tl-no)}
.tl-score[data-grade="mid"]{--ring:var(--tl-mid)}
.tl-score[data-grade="top"]{--ring:var(--tl-ok)}
.tl-ring{position:relative;width:min(250px,76%);margin-inline:auto}
.tl-ring svg{display:block;width:100%;height:auto}
.tl-seg{fill:none;stroke:var(--mist-2);stroke-width:16;transition:stroke .45s var(--ease) calc(var(--k)*35ms)}
.tl-seg.on{stroke:var(--ring)}
.tl-score-v{position:absolute;left:0;right:0;top:50%;translate:0 -50%;line-height:1}
.tl-score-v b{font-size:clamp(64px,6vw,84px);font-weight:600;letter-spacing:-.05em;color:var(--ink)}
.tl-score-v span{font-size:24px;font-weight:600;color:var(--muted)}
.tl-grade{margin-top:20px;font-size:clamp(21px,1.8vw,25px);font-weight:600;line-height:1.2;letter-spacing:-.02em;color:var(--ink);text-wrap:balance;transition:color .3s}
.tl-score:not([data-grade="none"]) .tl-grade{color:var(--ring)}
.tl-score[data-grade="good"] .tl-grade{color:var(--cobalt)}
.tl-count{margin-top:6px;font-size:15px;color:var(--muted)}
.tl-fixes{margin-top:24px;padding-top:22px;border-top:1px solid var(--line);text-align:left}
.tl-fixes-h{font-size:17px;font-weight:600;margin-bottom:12px}
.tl-fix-list{display:grid;gap:8px}
.tl-fix{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:12px;padding:12px 14px;border-radius:16px;background:var(--mist);animation:tlIn .45s var(--ease) both}
.tl-fix b{display:block;font-size:16px;font-weight:600;line-height:1.3}
.tl-fix p{margin-top:2px;font-size:15px;line-height:1.4;color:var(--muted)}
.tl-fix-p,.tl-step-p{flex:none;padding:6px 10px;border-radius:999px;font:600 13px/1 var(--f);white-space:nowrap;background:#fff;color:var(--ink-2);box-shadow:inset 0 0 0 1px var(--line)}
.tl-fix-p[data-plan="grow"],.tl-step-p[data-tier="1"]{background:var(--cobalt-tint);color:var(--cobalt);box-shadow:none}
.tl-fix-p[data-plan="full"],.tl-step-p[data-tier="2"]{background:var(--ink);color:#fff;box-shadow:none}
.tl-fix-plan{margin-top:12px;font-size:15px;color:var(--muted)}
.tl-fix-plan b{color:var(--ink)}
.tl-fix-plan a,.tl-gp-act a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.tl-fix-plan a{color:var(--cobalt);font-weight:600}
.tl-score .tl-cta{margin-top:26px}
.tl-reset{margin-top:8px;min-height:44px;padding:0 14px;border:0;border-radius:999px;background:transparent;font-size:15px;font-weight:500;color:var(--muted);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.tl-reset:hover{color:var(--ink)}
@keyframes tlIn{from{opacity:0;transform:translateY(8px)}}

/* ---------- 3 · channel route ---------- */
.tl-route{padding-bottom:clamp(24px,4vw,56px)}
.tl-route-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(24px,3.4vw,48px);align-items:start}
.tl-leg{float:left;width:100%;padding:0;margin-bottom:14px;font:600 14px/1 var(--f);letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.tl-type-grid{clear:both;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.tl-type{display:block;aspect-ratio:1/1;border-radius:20px;overflow:hidden;isolation:isolate;background:var(--mist-2);transition:box-shadow .3s var(--ease),transform .3s var(--ease)}
.tl-type-img{position:absolute;inset:0;z-index:-1}
.tl-type-img img{width:100%;height:100%;object-fit:cover;filter:saturate(.9);transition:transform .6s var(--ease)}
.tl-type:hover .tl-type-img img{transform:scale(1.05)}
.tl-type::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,18,51,0) 45%,rgba(11,18,51,.4))}
.tl-type-t{position:absolute;left:10px;bottom:10px;padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.94);font-size:15px;font-weight:600;line-height:1.2;color:var(--ink);transition:background-color .25s,color .25s}
.tl-type:has(input:checked){box-shadow:0 0 0 3px #fff,0 0 0 6px var(--cobalt)}
.tl-type:has(input:checked) .tl-type-t{background:var(--cobalt);color:#fff}
.tl-type:has(input:checked)::before{content:'';position:absolute;right:10px;top:10px;width:26px;height:26px;border-radius:50%;background:var(--cobalt) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center/16px no-repeat}
.tl-type:has(input:focus-visible){outline:3px solid var(--cobalt);outline-offset:8px}
.tl-goals{margin-top:30px}
.tl-goal-opts{clear:both;display:grid;gap:8px}
.tl-goal-opts span{display:flex;align-items:center;gap:14px;min-height:56px;padding:10px 18px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line);font-size:17px;font-weight:600;line-height:1.3;transition:background-color .25s,box-shadow .25s}
.tl-goal-opts span::before{content:'';flex:none;width:20px;height:20px;border-radius:50%;box-shadow:inset 0 0 0 2px var(--line-2);transition:box-shadow .25s}
.tl-goal-opts label:hover span{box-shadow:inset 0 0 0 1.5px var(--ink)}
.tl-goal-opts input:checked+span{background:var(--cobalt-tint);box-shadow:inset 0 0 0 2px var(--cobalt)}
.tl-goal-opts input:checked+span::before{box-shadow:inset 0 0 0 6px var(--cobalt)}

.tl-map{position:relative;isolation:isolate;overflow:hidden;padding:clamp(22px,3vw,36px) clamp(18px,3vw,36px) clamp(26px,3vw,40px);border-radius:30px;background:linear-gradient(160deg,#EDEFFF,var(--mist) 60%)}
.tl-map::before{content:'';position:absolute;inset:0;z-index:-2;background-image:linear-gradient(rgba(11,18,51,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(11,18,51,.045) 1px,transparent 1px);background-size:40px 40px;-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 30%,transparent 85%);mask-image:radial-gradient(circle at 50% 50%,#000 30%,transparent 85%)}
.tl-road{position:absolute;inset:0;z-index:-1;width:100%;height:100%;overflow:visible;pointer-events:none}
.tl-road-band{fill:none;stroke:#fff;stroke-width:22;stroke-linecap:round;stroke-linejoin:round}
.tl-road-track{fill:none;stroke:var(--line-2);stroke-width:2;stroke-dasharray:6 9}
.tl-road-line{fill:none;stroke:var(--cobalt);stroke-width:3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset 1.8s var(--ease)}
.tl-start{display:flex;align-items:center;gap:14px;font-size:16px;font-weight:600;line-height:1.3;color:var(--ink-2)}
.tl-start i{flex:none;width:20px;height:20px;margin-left:7px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 6px var(--cobalt),0 0 0 6px rgba(35,53,255,.13)}
.tl-steps{display:grid;gap:18px;margin-top:26px}
.tl-step{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;width:min(100% - 64px,430px);margin-left:64px;padding:16px 18px;border-radius:20px;background:#fff;box-shadow:var(--sh-1)}
.tl-step:nth-child(2){margin-left:auto}
.tl-step-n{position:absolute;left:-50px;top:50%;translate:0 -50%;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--cobalt);color:#fff;font:600 16px/1 var(--f);box-shadow:0 0 0 6px rgba(35,53,255,.14),0 10px 22px -8px rgba(35,53,255,.6)}
.tl-step-ic{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--cobalt-tint);color:var(--cobalt)}
.tl-step-ic .ic{width:24px;height:24px}
.tl-step-t{font-size:17px;font-weight:600;line-height:1.3;letter-spacing:-.01em}
.tl-step-d{margin-top:2px;font-size:15px;line-height:1.4;color:var(--muted)}
.tl-steps.go .tl-step{animation:tlStep .6s var(--ease) both;animation-delay:calc(var(--i,0)*.18s + .15s)}
@keyframes tlStep{from{opacity:0;transform:translateY(14px)}}
.tl-goalpin{position:relative;width:min(100% - 64px,340px);margin:22px 0 0 auto;padding:18px 22px 20px;border-radius:22px;background:var(--ink);color:#fff;box-shadow:var(--sh-2)}
.tl-pin{position:absolute;left:-52px;top:50%;width:32px;height:32px;margin-top:-20px;border-radius:50% 50% 50% 0;background:var(--yellow);box-shadow:inset 0 0 0 2px var(--ink);rotate:-45deg}
.tl-pin::after{content:'';position:absolute;inset:10px;border-radius:50%;background:var(--ink)}
.tl-gp-k{font-size:14px;color:#B9C0DE}
.tl-gp-name{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 14px;margin-top:4px;font-size:28px;font-weight:600;line-height:1.1;letter-spacing:-.03em}
.tl-gp-name b{font-weight:600;color:var(--yellow);white-space:nowrap}
.tl-gp-name small{font-size:15px;font-weight:500;color:#B9C0DE;letter-spacing:0}
.tl-gp-act{margin-top:8px;font-size:14px;color:#B9C0DE}
.tl-gp-act a{color:#fff;white-space:nowrap}
.tl-route-acts{display:flex;align-items:center;flex-wrap:wrap;gap:14px 20px;margin-top:22px}
.tl-route-acts .tl-fine{flex:1 1 220px}

/* ---------- closing band (layout from .sub-end in 02-chrome.css: centered column) ---------- */
.tl-audit{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.tl-audit li{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:8px 18px 8px 9px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),var(--sh-1);font-size:16px;font-weight:600;color:var(--ink-2)}
.tl-audit li i{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;font-style:normal;font-weight:700;font-size:16px}
.tl-audit li i .ic{width:17px;height:17px;stroke-width:2.6}
.tl-audit .ok i{background:var(--tl-ok-bg);color:var(--tl-ok)}
.tl-audit .no i{background:#FFF0E0;color:#A4520A}
.tl-end-acts{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}

@media (prefers-reduced-motion:reduce){
  .tl-fix,.tl-steps.go .tl-step{animation:none}
  .tl-track i,.tl-seg,.tl-road-line,.tl-pv-card{transition:none}
}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .tl-pv{grid-template-columns:1fr 1fr}
}
@media (max-width:980px){
  .tl-calc-grid,.tl-check-grid,.tl-route-grid{grid-template-columns:minmax(0,1fr)}
  .tl-score{position:static}
}
@media (max-width:600px){
  .tl-pv{gap:12px}
  .tl-pv-card{padding:16px 16px 18px;border-radius:20px}
  .tl-pv-t{font-size:15px}
  .tl-pv-big{font-size:32px}
  .tl-pv-f{margin-top:14px;font-size:13px}
  .tl-pv-f b{font-size:14px;padding:3px 7px}
  .tl-pv-ring{width:96px}
  .tl-pv-ring b{font-size:28px}
  .tl-field-top{align-items:flex-end}
  .tl-field-top label{font-size:16px}
  .tl-num input{font-size:22px;width:5ch}
  .tl-imp-opts{grid-template-columns:repeat(2,1fr)}
  .tl-kpis{gap:8px}
  .tl-kpis p{padding:14px}
  .tl-qs{padding:4px 16px}
  .tl-q fieldset{gap:10px 12px}
  .tl-q legend{gap:10px;font-size:16px}
  .tl-q-n{width:28px;height:28px;font-size:13px}
  .tl-yn span{min-width:48px;padding:0 10px;font-size:15px}
  .tl-type-grid{gap:8px}
  .tl-type{border-radius:16px;aspect-ratio:4/5}
  .tl-type-t{left:6px;bottom:6px;padding:6px 9px;font-size:13px}
  .tl-type:has(input:checked)::before{right:6px;top:6px;width:22px;height:22px;background-size:14px}
  .tl-step{grid-template-columns:auto minmax(0,1fr);width:calc(100% - 48px);margin-left:48px;padding:14px;gap:4px 12px}
  .tl-step:nth-child(2){width:calc(100% - 66px);margin-left:66px}
  .tl-step-n{left:-44px;width:32px;height:32px;font-size:15px}
  .tl-step-ic{grid-row:span 2;align-self:start;width:40px;height:40px;border-radius:12px}
  .tl-step-p{grid-column:2;justify-self:start;margin-top:6px}
  .tl-start i{margin-left:6px}
  .tl-goalpin{width:calc(100% - 48px);margin-left:48px}
  .tl-pin{left:-46px}
  .tl-route-acts .btn{width:100%}
  .tl-end-acts .btn{flex:1 1 auto}
}

/* ==== 65-za-nas.css ==== */
/* ---------- ЗА НАС (za-nas.html) · prefix .zn- · v5 ---------- */
.zn-hero :focus-visible,.zn-nofit :focus-visible,.zn-mono :focus-visible{outline-color:#fff}
.zn-av{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;flex:none;font-style:normal;font-weight:700;font-size:19px;line-height:1;color:#fff;background:linear-gradient(150deg,#3A4BFF,#1420B5)}
.zn-price{font-weight:600;color:var(--ink);background:linear-gradient(transparent 56%,var(--yellow) 56%);padding:0 3px;border-radius:2px;white-space:nowrap}
.zn-pill{display:inline-block;padding:7px 11px;border-radius:999px;background:var(--cobalt-tint);color:var(--cobalt);font:600 13px/1 var(--f);letter-spacing:.05em;text-transform:uppercase}

/* ---------- hero: scattered contacts -> one white road -> one person ---------- */
.zn-hero-act{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.zn-hv{position:relative;width:min(100%,560px);margin-inline:auto}
.zn-hv-svg{display:block;width:100%;height:auto;overflow:visible}
.zn-hv-lane{animation:zn-lane 1.1s linear infinite}
@keyframes zn-lane{to{stroke-dashoffset:-22}}
.zn-hv-person{position:relative;display:flex;align-items:center;gap:14px;width:max-content;max-width:100%;margin:-4px auto 0;padding:12px 14px 12px 12px;border-radius:24px;background:#fff;color:var(--ink);box-shadow:0 34px 70px -28px rgba(7,11,82,.7)}
.zn-hv-person p b{display:block;font-size:18px;font-weight:600;line-height:1.2;letter-spacing:-.01em}
.zn-hv-person p span{display:block;font-size:15px;line-height:1.35;color:var(--muted)}
.zn-hv-ok{width:32px;height:32px;margin-left:10px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--cobalt-tint);color:var(--cobalt)}
.zn-hv-ok .ic{width:17px;height:17px;stroke-width:2.6}

/* ---------- why: 5 suppliers vs one ---------- */
.zn-vs{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:clamp(16px,2vw,28px);align-items:stretch}
.zn-vs-card{display:flex;flex-direction:column;border-radius:28px;padding:clamp(24px,2.6vw,38px)}
.zn-vs-a{background:var(--mist);border:1px solid var(--line)}
.zn-vs-b{position:relative;overflow:hidden;isolation:isolate;color:#fff;background:radial-gradient(ellipse 70% 60% at 92% 0%,rgba(120,140,255,.55),transparent 70%),linear-gradient(150deg,#2536FF 0%,#1826D2 50%,#0E178F 100%);box-shadow:0 50px 90px -46px rgba(35,53,255,.8)}
.zn-vs-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:26px}
.zn-vs-k{font:600 14px/1 var(--f);letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.zn-vs-b .zn-vs-k{color:#C9D0FF}
.zn-vs-n{font-size:clamp(26px,2.4vw,34px);font-weight:600;letter-spacing:-.035em;line-height:1}
.zn-vs-a .zn-vs-n{color:var(--ink-2)}
.zn-bills{display:grid;gap:10px}
.zn-bills li{display:flex;align-items:center;gap:14px;margin-right:26px;padding:10px 12px 10px 10px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1);transform:translateX(var(--x,0)) rotate(var(--r,0deg))}
.zn-bi{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;flex:none;background:var(--mist-2);color:var(--muted)}
.zn-bills b{flex:1;min-width:0;font-size:17px;font-weight:600;color:var(--ink-2)}
.zn-bills em{font-style:normal;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:6px 9px;border-radius:8px;background:var(--mist)}
.zn-vs-foot{margin-top:auto;padding-top:26px;font-size:16px;line-height:1.45;color:var(--muted)}
.zn-vs-b .zn-vs-foot{color:rgba(255,255,255,.85)}
.zn-vs-mid{align-self:center;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1);color:var(--cobalt)}
.zn-one{display:flex;align-items:center;gap:14px;padding:14px 18px 14px 14px;border-radius:20px;background:#fff;color:var(--ink);box-shadow:0 24px 44px -22px rgba(7,11,82,.7)}
.zn-one b{display:block;font-size:17px;font-weight:600;line-height:1.25}
.zn-one span{display:block;font-size:15px;line-height:1.35;color:var(--muted)}
.zn-ones{position:relative;display:grid;gap:18px;margin-top:30px}
.zn-ones::before{content:"";position:absolute;left:21px;top:24px;bottom:24px;width:3px;border-radius:2px;background:repeating-linear-gradient(180deg,rgba(255,255,255,.7) 0 9px,transparent 9px 17px)}
.zn-ones li{position:relative;display:flex;align-items:center;gap:16px;font-size:clamp(20px,1.8vw,24px);font-weight:600;letter-spacing:-.025em;line-height:1.15}
.zn-bill1{display:flex;align-items:center;gap:14px;margin-top:30px;padding:10px 14px 10px 10px;border-radius:16px;background:#fff;color:var(--ink);box-shadow:0 24px 44px -22px rgba(7,11,82,.7)}
.zn-bill1 .zn-bi{background:var(--cobalt-tint);color:var(--cobalt)}
.zn-bill1 b{flex:1;min-width:0;font-size:17px;font-weight:600}
.zn-bill1 .zn-price{font-size:16px}
.zn-ones i{width:45px;height:45px;border-radius:50%;display:grid;place-items:center;flex:none;background:#fff;color:var(--cobalt);font-style:normal;font-size:18px;font-weight:700;box-shadow:0 0 0 6px rgba(255,255,255,.14)}

/* ---------- principles: 6 icon cards ---------- */
.zn-prin-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,22px)}
.zn-p{position:relative;padding:clamp(24px,2.4vw,34px);background:#fff;border:1px solid var(--line);border-radius:28px;box-shadow:var(--sh-1);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.zn-p:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
html.js .zn-p.rv.in:hover{transform:translateY(-4px)}
.zn-p-ic{width:60px;height:60px;margin-bottom:30px;border-radius:18px;display:grid;place-items:center;background:var(--cobalt-tint);color:var(--cobalt);transition:background-color .35s,color .35s}
.zn-p-ic .ic{width:28px;height:28px;stroke-width:1.8}
.zn-p:hover .zn-p-ic{background:var(--cobalt);color:#fff}
.zn-p .h3{margin-bottom:8px}
.zn-p:has(.zn-p-go) .h3{padding-right:40px}
.zn-p p{font-size:17px;line-height:1.5;color:var(--muted)}
.zn-p-go{position:absolute;top:22px;right:22px;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);color:var(--ink);transition:background-color .3s,color .3s,border-color .3s}
.zn-p-go .ic{width:18px;height:18px;transform:rotate(-45deg)}
.zn-p-go:hover{background:var(--ink);border-color:var(--ink);color:#fff}

/* ---------- process: 4 stops on one route ---------- */
.zn-steps{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2vw,28px)}
.zn-steps::before,.zn-steps::after{content:"";position:absolute;left:22px;right:22px;top:21px;height:3px;border-radius:3px;background:var(--line)}
.zn-steps::after{background:var(--cobalt);transform-origin:left center;transition:transform 1.8s var(--ease) .25s}
@media (prefers-reduced-motion:no-preference){html.js .zn-steps.rv:not(.in)::after{transform:scaleX(0)}}
.zn-step{position:relative;min-width:0}
.zn-node{position:relative;z-index:1;width:45px;height:45px;border-radius:50%;display:grid;place-items:center;background:var(--cobalt);color:#fff;font-size:14px;font-weight:700;border:3px solid #fff;box-shadow:0 0 0 6px var(--cobalt-tint)}
.zn-sv{position:relative;height:210px;margin-top:26px;padding:18px;border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1);overflow:hidden}
.zn-sv-h{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;font-size:15px;font-weight:600;line-height:1.3}
.zn-sv-h .ic{color:var(--cobalt)}
.zn-sv-audit li{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--line);font-size:14px;font-weight:500;line-height:1.3}
.zn-sv-audit li i{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;flex:none;font-style:normal;font-weight:700;font-size:14px}
.zn-sv-audit li i .ic{width:16px;height:16px;stroke-width:2.6}
.zn-sv-audit .ok i{background:#E3F6EC;color:#127A4B}
.zn-sv-audit .no i{background:#FFF0E0;color:#A4520A}
.zn-sv-doc dl{margin:0}
.zn-sv-doc dl div{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 0;border-top:1px solid var(--line);font-size:14px;line-height:1.3}
.zn-sv-doc dt{color:var(--muted)}
.zn-sv-doc dd{margin:0;font-weight:600;white-space:nowrap}
.zn-br{border-radius:12px;overflow:hidden;border:1px solid var(--line)}
.zn-br-bar{display:flex;align-items:center;gap:5px;height:22px;padding:0 10px;background:#F7F8FC;border-bottom:1px solid var(--line)}
.zn-br-bar i{width:7px;height:7px;border-radius:50%;background:#D8DCE8}
.zn-br img{width:100%;height:106px;object-fit:cover;object-position:top}
.zn-track{display:flex;align-items:center;margin-top:14px;padding:0 2px}
.zn-track i{width:14px;height:14px;border-radius:50%;flex:none;border:2px solid var(--line-2);background:#fff}
.zn-track i.on{border-color:var(--cobalt);background:var(--cobalt)}
.zn-track b{flex:1;height:3px;border-radius:2px;background:var(--line)}
.zn-track b.on{background:var(--cobalt)}
.zn-track .flag{width:30px;height:30px;display:grid;place-items:center;border:0;background:var(--cobalt-tint);color:var(--cobalt)}
.zn-track .flag .ic{width:16px;height:16px;stroke-width:2.2}
.zn-one-s{padding:10px 12px 10px 10px;border:1px solid var(--line);box-shadow:var(--sh-1)}
.zn-one-s .zn-av{width:38px;height:38px;font-size:16px}
.zn-one-s b{font-size:15px}
.zn-one-s span{font-size:14px}
.zn-bars{display:flex;align-items:flex-end;gap:7px;height:96px;margin-top:16px}
.zn-bars i{flex:1;height:calc(var(--h)*100%);border-radius:6px 6px 3px 3px;background:linear-gradient(180deg,#5A68FF,var(--cobalt))}
.zn-st{margin-top:24px}
.zn-st .zn-pill{margin-bottom:12px}
.zn-st p{margin-top:6px;font-size:17px;line-height:1.5;color:var(--muted)}

/* ---------- not a fit ---------- */
.zn-nofit{position:relative;overflow:hidden;background:radial-gradient(ellipse 55% 70% at 0% 100%,rgba(35,53,255,.38),transparent 70%),var(--ink)}
.zn-nofit-in{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,6vw,96px);align-items:center}
.zn-nofit .h2{color:#fff}
.zn-nofit .stop{background:#7D8BFF;box-shadow:0 0 0 5px rgba(125,139,255,.2)}
.zn-nofit-list{display:grid;gap:14px}
.zn-nofit-list li{display:flex;align-items:center;gap:20px;padding:22px 26px 22px 22px;border-radius:24px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12)}
.zn-sign{flex:none;width:52px;height:52px}
.zn-sign svg{display:block;width:100%;height:100%}
.zn-sign circle{fill:var(--cobalt);stroke:#fff;stroke-width:2.5}
.zn-sign rect{fill:#fff}
.zn-nofit-list h3{font-size:clamp(19px,1.6vw,23px);font-weight:600;letter-spacing:-.02em;line-height:1.3}

/* ---------- founder: monogram card, no photo ---------- */
.zn-f-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:clamp(40px,7vw,120px);align-items:center}
.zn-mono{position:relative;isolation:isolate;container-type:inline-size;width:100%;max-width:520px;aspect-ratio:6/7;border-radius:40px;overflow:hidden;color:#fff;background:radial-gradient(ellipse 60% 55% at 85% 8%,rgba(120,140,255,.55),transparent 70%),linear-gradient(150deg,#2536FF 0%,#1826D2 45%,#0C148C 100%);box-shadow:0 60px 120px -60px rgba(35,53,255,.85)}
.zn-mono-bg{position:absolute;inset:0;z-index:-1;width:100%;height:100%}
.zn-mono-l{position:absolute;left:50%;top:44.64%;transform:translate(-50%,-50%);font-size:44cqw;font-weight:600;line-height:1;letter-spacing:0;color:#fff;text-shadow:0 24px 50px rgba(7,11,82,.35)}
.zn-mono-msg{position:absolute;top:26px;right:26px;display:inline-flex;align-items:center;gap:10px;padding:11px 16px 11px 12px;border-radius:999px;background:#fff;color:var(--ink);font-size:15px;font-weight:600;line-height:1;box-shadow:var(--sh-2)}
.zn-mono-msg .ic{color:var(--cobalt)}
.zn-mono-cap{position:absolute;left:22px;right:22px;bottom:22px;display:flex;align-items:center;gap:14px;padding:12px 16px 12px 12px;border-radius:22px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.26);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.zn-mono-cap .zn-av{background:#fff;color:var(--cobalt)}
.zn-mono-cap span{font-size:15px;line-height:1.35;color:rgba(255,255,255,.88)}
.zn-mono-cap b{display:block;font-size:18px;font-weight:600;color:#fff}
.zn-mail{display:inline-flex;align-items:center;gap:14px;margin-top:34px;font-size:clamp(20px,1.8vw,24px);font-weight:600;letter-spacing:-.02em;color:var(--ink);text-decoration:underline;text-decoration-color:transparent;text-underline-offset:5px;transition:text-decoration-color .3s}
.zn-mail:hover{text-decoration-color:var(--cobalt)}
.zn-mail-ic{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;flex:none;background:var(--cobalt-tint);color:var(--cobalt)}
.zn-mail-ic .ic{width:24px;height:24px}
.zn-f-act{margin-top:34px}

/* ---------- FAQ accordion ---------- */
.zn-faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(40px,6vw,100px);align-items:start}
.zn-faq-side{position:sticky;top:calc(var(--hdr) + 32px)}
.zn-faq-mail{margin-top:30px}
.zn-faq-list{display:grid;gap:12px}
.zn-qa{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--sh-1);transition:box-shadow .3s}
.zn-qa[open]{box-shadow:var(--sh-2)}
.zn-qa summary{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:66px;padding:16px 20px 16px 26px;list-style:none;cursor:pointer;font-size:clamp(18px,1.4vw,20px);font-weight:600;letter-spacing:-.015em;line-height:1.3;border-radius:22px}
.zn-qa summary::-webkit-details-marker{display:none}
.zn-qa-ic{position:relative;flex:none;width:36px;height:36px;border-radius:50%;background:var(--cobalt-tint);transition:transform .35s var(--ease),background-color .3s}
.zn-qa-ic::before,.zn-qa-ic::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;margin:-1px 0 0 -7px;border-radius:2px;background:var(--cobalt);transition:background-color .3s}
.zn-qa-ic::after{transform:rotate(90deg)}
.zn-qa summary:hover .zn-qa-ic{background:#DDE1FF}
.zn-qa[open] .zn-qa-ic{transform:rotate(45deg);background:var(--cobalt)}
.zn-qa[open] .zn-qa-ic::before,.zn-qa[open] .zn-qa-ic::after{background:#fff}
.zn-qa p{max-width:62ch;padding:0 26px 24px;font-size:17px;line-height:1.6;color:var(--muted)}
.zn-qa p a{color:var(--cobalt);text-decoration:underline;text-underline-offset:3px}
@supports (interpolate-size:allow-keywords){
  .zn-faq-list{interpolate-size:allow-keywords}
  .zn-qa::details-content{height:0;overflow:clip;transition:height .4s var(--ease),content-visibility .4s allow-discrete}
  .zn-qa[open]::details-content{height:auto}
}

/* ---------- closing band ---------- */
.zn-end .lead{margin-top:0}
.zn-end-act{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}

/* ---------- responsive ---------- */
@media (max-width:1060px){
  .zn-prin-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .zn-steps{grid-template-columns:1fr;gap:44px;padding-left:72px}
  .zn-steps::before,.zn-steps::after{left:21px;right:auto;top:10px;bottom:10px;width:3px;height:auto}
  .zn-steps::after{transform-origin:center top}
  .zn-node{position:absolute;left:-72px;top:0}
  .zn-step{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:center}
  .zn-sv{margin-top:0}
  .zn-st{margin-top:0}
}
@media (max-width:1060px) and (prefers-reduced-motion:no-preference){html.js .zn-steps.rv:not(.in)::after{transform:scaleY(0)}}
@media (max-width:900px){
  .zn-vs{grid-template-columns:1fr}
  .zn-vs-mid{justify-self:center}
  .zn-vs-mid .ic{transform:rotate(90deg)}
  .zn-nofit-in,.zn-f-grid,.zn-faq-grid{grid-template-columns:1fr}
  .zn-faq-side{position:static}
  .zn-mono{max-width:460px;margin-inline:auto}
}
@media (max-width:640px){
  .zn-hero-act .btn{flex:1 1 auto}
  .zn-bills li{margin-right:0;transform:translateX(calc(var(--x,0px)*.35)) rotate(calc(var(--r,0deg)*.6))}
  .zn-bills b{font-size:16px}
  .zn-bill1{gap:10px;padding:10px 12px 10px 10px}
  .zn-bill1 .zn-bi{width:34px;height:34px}
  .zn-bill1 b{font-size:16px;white-space:nowrap}
  .zn-bill1 .zn-price{font-size:15px}
  .zn-prin-grid{grid-template-columns:1fr}
  .zn-p{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:18px;align-items:start;padding:22px}
  .zn-p-ic{grid-row:span 2;width:52px;height:52px;margin-bottom:0;border-radius:16px}
  .zn-p-ic .ic{width:25px;height:25px}
  .zn-p .h3{margin-bottom:4px}
  .zn-p-go{top:18px;right:18px;width:40px;height:40px}
  .zn-steps{padding-left:60px;gap:40px}
  .zn-node{left:-60px}
  .zn-step{grid-template-columns:1fr;gap:20px}
  .zn-nofit-list li{padding:18px;gap:16px}
  .zn-sign{width:44px;height:44px}
  .zn-mono{border-radius:32px}
  .zn-mono-msg{top:18px;right:18px}
  .zn-mono-cap{left:16px;right:16px;bottom:16px}
  .zn-qa summary{padding:14px 16px 14px 20px;min-height:62px}
  .zn-qa p{padding:0 20px 20px}
}

/* ==== 66-kontakt.css ==== */
/* ---------- КОНТАКТ (kontakt.html) · prefix .kt- ---------- */

/* shared flat illustrations: cobalt, tint, white, ink details */
.kt-il{display:block;width:100%;height:auto;overflow:visible}
.kt-il .c{fill:var(--cobalt)}.kt-il .c2{fill:#5A67FF}.kt-il .cd{fill:var(--cobalt-deep)}
.kt-il .t{fill:#D5DAFF}.kt-il .t2{fill:var(--cobalt-tint)}.kt-il .w{fill:#fff}.kt-il .n{fill:var(--ink)}
.kt-il .l1{fill:var(--line)}.kt-il .l2{fill:var(--line-2)}.kt-il .sh{fill:rgba(11,18,51,.08)}
.kt-il .o6{opacity:.6}.kt-il .o8{opacity:.85}
.kt-il .ol{stroke:#D5DAFF;stroke-width:1.5}
.kt-il .st-w{stroke:#fff;stroke-width:2;stroke-linejoin:round}
.kt-il .sw,.kt-il .sc,.kt-il .sc2,.kt-il .sl,.kt-il .sd,.kt-il .sn,.kt-il .sm,.kt-il .sh-h{fill:none;stroke-linecap:round;stroke-linejoin:round}
.kt-il .sw{stroke:#fff;stroke-width:2.6}
.kt-il .sc{stroke:var(--cobalt);stroke-width:4}
.kt-il .sc2{stroke:var(--cobalt);stroke-width:1.7}
.kt-il .sl{stroke:var(--cobalt-deep);stroke-width:2.5;opacity:.45}
.kt-il .sd{stroke:var(--cobalt);stroke-width:3;stroke-dasharray:1 9;opacity:.6}
.kt-il .sn{stroke:var(--ink);stroke-width:5}
.kt-il .sm{stroke:var(--ink);stroke-width:7}
.kt-il .sh-h{stroke:var(--ink);stroke-width:11}
.kt-il-tx{font-family:var(--f);font-weight:700;text-anchor:middle;fill:var(--cobalt)}
.kt-il .w-tx{fill:#fff}

/* ---------- hero: three easy steps on a dashed route ---------- */
.kt-hero :focus-visible{outline-color:#fff}
.kt-hero-act{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.kt-easy-v{display:flex;justify-content:center}
.kt-easy{display:grid;gap:16px;width:min(100%,500px);padding:clamp(18px,2vw,26px);border-radius:32px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.kt-ez{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:14px}
.kt-ez:not(:last-child)::before{content:"";position:absolute;left:21px;top:50%;width:2px;height:calc(100% + 16px);background:repeating-linear-gradient(180deg,rgba(255,255,255,.8) 0 7px,transparent 7px 14px)}
.kt-ez-n{position:relative;z-index:1;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff;color:var(--cobalt);font:700 15px/1 var(--f);box-shadow:0 0 0 6px rgba(255,255,255,.16)}
.kt-ez-card{display:grid;grid-template-columns:84px minmax(0,1fr);align-items:center;gap:18px;padding:12px 20px 12px 12px;border-radius:24px;background:#fff;color:var(--ink);box-shadow:0 24px 50px -24px rgba(4,8,60,.6)}
.kt-ez-art{display:block;padding:4px;border-radius:18px;background:var(--cobalt-tint)}
.kt-ez-card p{display:grid;gap:4px;min-width:0}
.kt-ez-card b{font-size:clamp(18px,1.5vw,21px);line-height:1.2;font-weight:600;letter-spacing:-.02em}
.kt-ez-card p span{font-size:15px;line-height:1.35;color:var(--muted)}

/* ---------- booking calendar ---------- */
.kt-cal{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);overflow:hidden;box-shadow:var(--sh-2)}
.kt-fs{margin:0;padding:0;border:0;min-width:0}
.kt-fs legend{float:left;width:100%;display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:0;margin-bottom:16px;font:600 14px/1.2 var(--f);letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.kt-fs legend + *{clear:both}
.kt-month{font-size:clamp(18px,1.5vw,21px);font-weight:600;letter-spacing:-.02em;text-transform:none;color:var(--ink)}
.kt-cal-days{padding:clamp(20px,3vw,40px)}
.kt-dow,.kt-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.kt-dow{margin-bottom:8px;text-align:center;font:600 13px/1 var(--f);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.kt-dow .we{color:#6E7592}
.kt-d{position:relative;display:grid;place-items:center;aspect-ratio:1/.92;border-radius:16px;line-height:1;color:var(--ink)}
.kt-d > span{display:grid;justify-items:center;gap:3px}
.kt-d b{font-size:clamp(17px,1.4vw,20px);font-weight:600;letter-spacing:-.01em}
.kt-d small{font-size:13px;font-weight:600;color:var(--cobalt)}
.kt-d.is-open{cursor:pointer;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line-2);transition:box-shadow .25s,background-color .25s,color .25s,transform .35s var(--ease)}
.kt-d.is-open:hover{box-shadow:inset 0 0 0 1.5px var(--cobalt);transform:translateY(-1px)}
.kt-d input,.kt-t input,.kt-w input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.kt-d.is-open:has(input:checked){background:var(--cobalt);color:#fff;box-shadow:0 14px 28px -14px rgba(35,53,255,.9)}
.kt-d.is-open:has(input:checked) small{color:#fff}
.kt-d:has(input:focus-visible),.kt-t:has(input:focus-visible) span,.kt-w:has(input:focus-visible) span{outline:3px solid var(--cobalt);outline-offset:3px}
.kt-d.is-off,.kt-d.is-hol{color:#7E86A4;background:repeating-linear-gradient(135deg,var(--mist) 0 6px,#fff 6px 12px)}
.kt-d.is-past{color:#AEB4CA}
.kt-d.is-today::after{content:"";position:absolute;bottom:12%;left:50%;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--cobalt)}
.kt-legend{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:18px;font-size:14px;color:var(--muted)}
.kt-legend span{display:inline-flex;align-items:center;gap:8px}
.kt-legend i{width:16px;height:16px;border-radius:5px}
.kt-legend .lg-a{background:#fff;box-shadow:inset 0 0 0 1.5px var(--line-2)}
.kt-legend .lg-o{background:repeating-linear-gradient(135deg,var(--mist-2) 0 3px,#fff 3px 6px);box-shadow:inset 0 0 0 1px var(--line)}
.kt-nojs{grid-column:1/-1;padding:18px;border-radius:16px;background:var(--mist);font-size:16px;color:var(--ink-2)}
/* without JS the pickers cannot reach the form: show the note and the button only */
html:not(.js) .kt-dow,html:not(.js) .kt-legend,html:not(.js) .kt-cal-side .kt-fs,html:not(.js) .kt-ticket{display:none}
html:not(.js) .kt-cal-side .btn{margin-top:0}
html:not(.js) .kt-grid{clear:both}

.kt-cal-side{display:grid;align-content:start;gap:26px;padding:clamp(20px,3vw,40px);background:var(--mist);border-left:1px solid var(--line)}
.kt-times{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.kt-t,.kt-w{position:relative;display:block}
.kt-t span{display:grid;place-items:center;height:48px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line-2);font-size:16px;font-weight:600;transition:box-shadow .25s,background-color .25s,color .25s}
.kt-t:hover span{box-shadow:inset 0 0 0 1.5px var(--cobalt)}
.kt-t:has(input:checked) span{background:var(--cobalt);color:#fff;box-shadow:0 12px 24px -12px rgba(35,53,255,.9)}
.kt-ways{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.kt-w span{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 6px;border-radius:18px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line-2);font-size:15px;font-weight:600;line-height:1.1;transition:box-shadow .25s,background-color .25s,color .25s}
.kt-w .ic{width:22px;height:22px;color:var(--cobalt)}
.kt-w:hover span{box-shadow:inset 0 0 0 1.5px var(--cobalt)}
.kt-w:has(input:checked) span{background:var(--cobalt-tint);color:var(--cobalt);box-shadow:inset 0 0 0 2px var(--cobalt)}
.kt-ticket{display:flex;align-items:center;gap:14px;min-height:72px;padding:12px 16px;border-radius:18px;background:#fff;border:1.5px dashed var(--line-2);transition:border-color .25s,box-shadow .25s}
.kt-ticket-ic{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:14px;background:var(--cobalt-tint);color:var(--cobalt)}
.kt-sum{font-size:16px;font-weight:600;line-height:1.35;color:var(--ink-2)}
.kt-ticket.is-ok{border-style:solid;border-color:var(--cobalt)}
.kt-ticket.is-ok .kt-ticket-ic{background:var(--cobalt);color:#fff}
.kt-ticket.is-miss{border-style:solid;border-color:var(--cobalt);box-shadow:0 0 0 4px rgba(35,53,255,.16)}
.kt-ticket.is-miss .kt-sum{color:var(--cobalt)}
.kt-cal-side .btn{margin-top:-8px}

/* step 2 label on the shared contact block, and a short flash when the booking lands in the form */
.kt-step2{color:#fff}
.kt-step2 .stop{background:#fff;box-shadow:0 0 0 5px rgba(255,255,255,.2)}
@keyframes kt-flash{0%,100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}35%{box-shadow:0 0 0 8px rgba(255,255,255,.45)}}
.kt-flash{animation:kt-flash 1.4s var(--ease) .5s}

/* ---------- channels ---------- */
.kt-ch-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,24px)}
.kt-cc{display:flex;flex-direction:column;padding:14px 14px 28px}
.kt-cc-art{margin-bottom:24px;padding:20px 22px 10px;border-radius:20px;background:linear-gradient(180deg,var(--cobalt-tint),#F7F8FF)}
.kt-cc h3,.kt-cc .kt-mail,.kt-cc-p,.kt-cc-act{padding-inline:14px}
.kt-mail{margin-top:8px;font-size:clamp(19px,1.6vw,22px);font-weight:600;letter-spacing:-.015em;color:var(--cobalt);overflow-wrap:anywhere}
.kt-mail:hover{text-decoration:underline;text-underline-offset:4px}
.kt-cc-p{margin-top:8px;font-size:17px;line-height:1.45;color:var(--muted)}
.kt-cc-act{margin-top:auto;padding-top:24px}
.kt-cc .kt-up,.kt-cc .btn:hover .kt-up{transform:rotate(-90deg)}

/* ---------- what happens next: three stops on the route ---------- */
.kt-tl{--gap:clamp(20px,2.6vw,36px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.kt-tl-i{position:relative;display:flex;flex-direction:column}
.kt-tl-i:not(:last-child)::before{content:"";position:absolute;left:23px;top:22px;width:calc(100% + var(--gap));height:2px;background:var(--cobalt);opacity:.3}
.kt-tl-n{position:relative;z-index:1;display:grid;place-items:center;width:46px;height:46px;margin-bottom:28px;border-radius:50%;background:var(--cobalt);color:#fff;font:700 15px/1 var(--f);box-shadow:0 0 0 7px rgba(35,53,255,.13)}
.kt-tl-art{margin-bottom:24px;padding:20px 22px 12px;border-radius:24px;background:linear-gradient(180deg,var(--cobalt-tint),#F7F8FF);border:1px solid #fff;box-shadow:var(--sh-1)}
.kt-tl-i p{margin-top:8px;font-size:17px;line-height:1.45;color:var(--muted)}
.kt-next-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 24px;margin-top:clamp(44px,5vw,72px);padding:clamp(18px,2.2vw,26px) clamp(20px,2.6vw,30px) clamp(18px,2.2vw,26px) clamp(24px,3vw,40px);border-radius:28px;background:var(--ink);color:#fff}
.kt-next-foot p{font-size:clamp(20px,2vw,26px);font-weight:600;letter-spacing:-.025em;line-height:1.2}
.kt-next-foot :focus-visible{outline-color:#fff}

/* toast for the copy button and the booking */
.kt-toast{position:fixed;left:50%;bottom:24px;z-index:95;max-width:calc(100vw - 32px);padding:14px 22px;border-radius:999px;background:var(--ink);color:#fff;font-size:16px;font-weight:600;box-shadow:var(--sh-2);opacity:0;transform:translate(-50%,16px);pointer-events:none;transition:opacity .3s,transform .4s var(--ease)}
.kt-toast.on{opacity:1;transform:translate(-50%,0)}
.kt-toast:empty{display:none}

@media (max-width:1000px){
  .kt-cal{grid-template-columns:1fr}
  .kt-cal-side{border-left:0;border-top:1px solid var(--line)}
}
@media (max-width:860px){
  .kt-ch-grid{grid-template-columns:1fr;max-width:560px;margin-inline:auto}
  .kt-tl{grid-template-columns:1fr;gap:32px}
  .kt-tl-i{display:grid;grid-template-columns:46px minmax(0,1fr);column-gap:18px;align-items:start}
  .kt-tl-n{grid-row:1/span 3;margin:0}
  .kt-tl-art,.kt-tl-i h3,.kt-tl-i p{grid-column:2}
  .kt-tl-i:not(:last-child)::before{left:22px;top:46px;width:2px;height:calc(100% - 14px)}
  .kt-tl-art{max-width:420px}
}
@media (max-width:560px){
  .kt-easy{gap:12px;padding:14px;border-radius:26px}
  .kt-ez{grid-template-columns:36px minmax(0,1fr);gap:10px}
  .kt-ez:not(:last-child)::before{left:17px;height:calc(100% + 12px)}
  .kt-ez-n{width:36px;height:36px;font-size:13px}
  .kt-ez-card{grid-template-columns:64px minmax(0,1fr);gap:14px;padding:10px 14px 10px 10px;border-radius:20px}
  .kt-ez-art{border-radius:14px;padding:2px}
  .kt-ez-card b{font-size:17px}
  .kt-cal-days,.kt-cal-side{padding:18px}
  .kt-dow,.kt-grid{gap:5px}
  .kt-d{border-radius:12px}
  .kt-d b{font-size:16px}
  .kt-d small{font-size:13px}
  .kt-legend{font-size:14px}
  .kt-times{gap:6px}
  .kt-t span{height:46px}
  .kt-ways{gap:6px}
  .kt-w span{padding:12px 4px;font-size:15px}
  .kt-hero-act .btn{width:100%}
  .kt-cc-art{padding:14px 36px 6px;margin-bottom:20px}
  .kt-next-foot{flex-direction:column;align-items:stretch;text-align:left}
  .kt-next-foot .btn{width:100%}
}