/* ============================================================
   Lapin Cherry v10 "WOW" - base.css
   Chic side: "Liquid Silk & Chrome". Chalk pink is the paper, cherry lacquer and pearl chrome
   are the bold moments, the night is a scene (menu, chooser, footer), never a theme switch.

   Scoping (SPEC 6):
   - tokens --lc-* on :root (the chic side has ONE look, it ignores html[data-theme]; only kids use the theme);
   - every chic selector sits under :where(.chic) (zero specificity), roots use :where(.chic).x;
   - html/body rules are guarded with :not([data-view="kids"]) so the kids view never sees them.
   - main-view classes are prefixed m-, global chrome lc- / sh- / sf- / ch-.
   Shared components for the adult events view keep their v9 names (.btn .field .opt .stepper .sheet
   .inv-card .chip .tick .sec-head ...), see _spec/UI-KIT.md.
   Stage tokens (--lc-bg --lc-fg --lc-fg-2 --lc-rule --lc-acc) are morphed on scroll by assets/fx/motion.js
   from [data-bg] sections: pink, blush, milk, night, cherry.
   ============================================================ */

/* ============================================================
   1. TOKENS
   ============================================================ */
:root{
  /* palette */
  --lc-pink:#EBD5D0; --lc-pink-2:#F3E4E0; --lc-blush:#F1DFDA; --lc-rose:#C98E97;
  --lc-cherry-2:#6E0C24; --lc-deep:#3A0714; --lc-night:#130509; --lc-night-2:#1A070C; --lc-petal:#F2A2B5;
  /* component tokens (shared with the adult events view) */
  --lc-paper:#EBD5D0;        /* chalk pink - the page */
  --lc-paper-2:#E3C6BF;      /* deeper chalk - bands */
  --lc-milk:#FBF6F3;         /* milk - cards, sheets */
  --lc-ink:#231417;          /* warm near-black */
  --lc-ink-2:#5B4146;        /* muted text, 6.3:1 on paper */
  --lc-line:rgba(35,20,23,.15);
  --lc-line-2:rgba(35,20,23,.38);
  --lc-ctl:rgba(35,20,23,.52);       /* control borders, 3:1 on paper */
  --lc-cherry:#8C1230;       /* lipstick, 7.0:1 on paper */
  --lc-on-cherry:#FBF6F3;
  --lc-cherry-tint:rgba(140,18,48,.07);
  --lc-inv:#1A070C;          /* inverted surface (summary, night cards) */
  --lc-on-inv:#FBF6F3;
  --lc-on-inv-2:#CDB6BA;
  --lc-inv-accent:#F2A2B5;
  --lc-inv-line:rgba(251,246,243,.16);
  --lc-veil:rgba(19,5,9,.62);
  --lc-stage:#130509;
  --lc-shadow:0 40px 80px -44px rgba(92,22,42,.55);
  --lc-glass:rgba(251,246,243,.62);
  --lc-chrome:linear-gradient(180deg,#fff 0%,#f3e2e6 16%,#c7a3ad 47%,#f9eef1 53%,#e2c6cd 80%,#fff 100%);
  --lc-grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .14  0 0 0 0 .08  0 0 0 0 .09  0 0 0 .09 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>") 0 0/220px 220px;
  /* type "Plakát": a fat poster didone for headlines and dishes, an Oi "sticker" for the one shouted word,
     a total or a stuck-on label, Golos Text for text and UI. Yeseva One and Oi have one weight and no italics:
     emphasis is the sticker or a colour, never a slant. */
  --lc-display:"Yeseva One",Georgia,"Times New Roman",serif;
  --lc-sticker:"Oi","Yeseva One",Georgia,serif;
  --lc-text:"Golos Text",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --lc-stk-ls:0;             /* Oi tracking: its fat letters touch, Cyrillic gets a little air (below) */
  --lc-pad:clamp(18px,4.2vw,72px);
  --lc-ease:cubic-bezier(.16,1,.3,1);
  --lc-head-h:84px;
  /* stage: the colour world of the page, morphed on scroll (motion.js) */
  --lc-bg:#EBD5D0;
  --lc-fg:#231417;
  --lc-fg-2:#5B4146;
  --lc-rule:rgba(35,20,23,.16);
  --lc-acc:#8C1230;
  /* the lacquer of the Oi sticker words follows the colour world (motion.js sets --lc-lacq per world):
     dark cherry on the light worlds, petal lacquer on the night and cherry ones */
  --lc-lacq-light:linear-gradient(172deg,#2a030d 0%,#7a0f29 26%,#c65a72 37%,#f4c3cd 40%,#8c1230 47%,#4a0717 62%,#8c1230 78%,#d87d92 85%,#5a0a1e 100%);
  --lc-lacq-dark:linear-gradient(172deg,#fff0f3 0%,#f2a2b5 24%,#ffffff 36%,#ffd9e1 40%,#e07b95 48%,#f6bccb 62%,#d9728d 78%,#fff3f6 86%,#f2a2b5 100%);
  --lc-lacq:var(--lc-lacq-light);
}

html[lang="ru"]{ --lc-stk-ls:.03em; }   /* Oi Cyrillic lowercase has hairline counters: a touch of air keeps мы / ы / ш legible */

/* ============================================================
   2. DOCUMENT (html/body only, never in the kids view)
   ============================================================ */
html, body{ margin:0; }
html{ -webkit-text-size-adjust:100%; }
html:not([data-view="kids"]){ background:var(--lc-bg); color-scheme:light; }
html:not([data-view="kids"]) body{
  background:var(--lc-bg); color:var(--lc-fg);
  font:400 16px/1.58 var(--lc-text);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility; overflow-x:clip;
}
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:hidden; }
/* the WebGL media canvas sits between the page colour and the content */
html:not([data-view="kids"]) #main, html:not([data-view="kids"]) .site-footer{ position:relative; z-index:2; }
#lc-gl{ position:fixed; left:0; top:0; z-index:1; pointer-events:none; }
#lc-gl.is-idle{ visibility:hidden; }   /* nothing drawn: no full-screen layer to composite (gl.js Media.show) */
/* the colour world (motion.js tweens only this layer's background-color, never a token on <html>) */
#lc-bgfx{ position:fixed; inset:0; z-index:0; pointer-events:none; background:var(--lc-bg); }
html[data-view="kids"] #lc-gl, html[data-view="kids"] #lc-bgfx, html[data-view="kids"] .lc-cursor{ display:none !important; }
/* the language switch dips the page under its own colour for a moment (motion.js); the header stays above */
#lc-langveil{ position:fixed; inset:0; z-index:115; pointer-events:none; visibility:hidden; opacity:0; }
/* the chic header is fixed (it floats over the main hero); other chic panes start below it by default.
   Zero specificity: a view that wants its hero under the header just sets padding-top:0. */
:where([data-view-pane="adults"]){ padding-top:var(--lc-head-h); }

/* ============================================================
   3. CHIC RESET (scoped)
   ============================================================ */
:where(.chic){ font:400 16px/1.58 var(--lc-text); color:var(--lc-fg); -webkit-font-smoothing:antialiased; font-synthesis:none; }
:where(.chic), :where(.chic) *, :where(.chic) *::before, :where(.chic) *::after{ box-sizing:border-box; }
:where(.chic) :where(h1,h2,h3,h4,h5,p,figure,blockquote,dl,dd,ol,ul,fieldset,legend){ margin:0; padding:0; }
:where(.chic) :where(ol,ul)[class]{ list-style:none; }
:where(.chic) fieldset{ border:0; min-inline-size:0; }
:where(.chic) :where(img,svg){ display:block; max-width:100%; }
:where(.chic) img{ height:auto; }
:where(.chic) a{ color:inherit; text-decoration:none; }
:where(.chic) button{ font:inherit; color:inherit; background:none; border:0; padding:0; margin:0; cursor:pointer; -webkit-tap-highlight-color:transparent; }
:where(.chic) :where(input,select,textarea){ font:inherit; color:inherit; }
:where(.chic) [hidden]{ display:none !important; }
/* no slanted emphasis anywhere (the display faces have no italics): em / i keep the face and only take a colour
   where a block asks for it; inside headlines em becomes the Oi sticker (section 4) */
:where(.chic) :is(em,i){ font-style:normal; }
/* The selection colour is set on the chic roots only: highlight styles inherit (Chrome 105+), and a
   rule matching every element made each full style recalc (every colour-world switch) ~35 % slower.
   Browsers without highlight inheritance get the per-element rule (motion.js adds .lc-hl-flat). */
:where(.chic)::selection{ background:var(--lc-cherry); color:var(--lc-on-cherry); }
html.lc-hl-flat :where(.chic) ::selection{ background:var(--lc-cherry); color:var(--lc-on-cherry); }
:where(.chic) :focus-visible{ outline:2px solid var(--lc-acc); outline-offset:4px; border-radius:6px; }
:where(.chic) [tabindex="-1"]:focus:not(:focus-visible){ outline:none; }
/* headings that core focuses after a view change (tabindex -1) are not controls: no ring */
:where(.chic) :is(h1,h2,h3)[tabindex="-1"]:focus{ outline:none; }
:where(.chic) p{ text-wrap:pretty; }
:where(.chic) .sr{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; }
:where(.chic) .nw{ white-space:nowrap; }
:where(.chic) .wrap{ width:100%; max-width:1440px; margin-inline:auto; padding-inline:var(--lc-pad); }
:where(.chic).skip-link{ background:var(--lc-night); color:var(--lc-milk); padding:12px 18px; border-radius:999px; font:600 12px/1 var(--lc-text); letter-spacing:.14em; text-transform:uppercase; }
:where(.chic).skip-link:focus-visible{ outline:2px solid var(--lc-petal); outline-offset:3px; }

/* ============================================================
   4. TYPE
   ============================================================ */
:where(.chic) .kicker{ font:600 11.5px/1.35 var(--lc-text); letter-spacing:.15em; text-transform:uppercase; }
:where(.chic) .idx{ font:600 11.5px/1 var(--lc-text); letter-spacing:.14em; text-transform:uppercase; font-variant-numeric:tabular-nums; }
:where(.chic) .h-display{ font-family:var(--lc-display); font-weight:400; font-size:clamp(40px,5.2vw,90px); line-height:.98; letter-spacing:-.012em; text-wrap:balance; }
:where(.chic) .h-display em{ color:var(--lc-cherry); }
/* the sticker: inside a headline the emphasised word switches to Oi - fat, about .8 of the line, in the accent
   colour (or lacquer / pearl). It is the bistro-poster slap that replaces the old italics, so it stays a spice:
   section headlines, the hero, the chooser and wipe titles, totals, stuck-on labels. Card and dish titles keep
   Yeseva and only change colour. */
:where(.chic) :is(.h-display, .m-h1, .m-big, .m-statement, .m-addr, .wt-t, .ch-title, .modal-title, .mnav-sig, .m-form-ok h3, .ev-h1, .ev-big, .ev-end-t, .den-h, .sf-word) em{
  font-family:var(--lc-sticker); font-weight:400; font-size:.8em; letter-spacing:var(--lc-stk-ls);
}
/* Russian: Oi's Cyrillic lowercase does not read as words (м / и / н / п / е close up into blobs, worse under the
   lacquer band - "накрываем", "празднуем" stayed puzzles even with extra tracking). In ru the emphasised word keeps
   the headline's own Yeseva One at full size and is carried by its colour alone (cherry, lacquer or pearl).
   Oi stays where it reads: numbers, prices and totals, and the Latin wordmark "Cherry" (.sf-word). */
html[lang="ru"] :where(.chic) :is(.h-display, .m-h1, .m-big, .m-statement, .m-addr, .wt-t, .ch-title, .modal-title, .mnav-sig, .m-form-ok h3, .ev-h1, .ev-big, .ev-end-t, .den-h) em{
  font-family:var(--lc-display); font-size:1em; letter-spacing:inherit;
}
:where(.chic) .h-3{ font-family:var(--lc-display); font-weight:400; font-size:clamp(22px,1.9vw,28px); line-height:1.12; letter-spacing:0; text-wrap:balance; }
:where(.chic) .h-3 em{ color:var(--lc-acc); }
:where(.chic) .lede{ font-size:clamp(16px,1.25vw,19px); line-height:1.6; max-width:34em; text-wrap:pretty; }
:where(.chic) .serif{ font-family:var(--lc-display); }
:where(.chic) .rule{ display:block; height:0; border:0; border-top:1px solid var(--lc-line); margin:0; }
:where(.chic) .rule.is-strong{ border-top-color:var(--lc-line-2); }
:where(.chic) .rule.is-dash{ border-top:1.5px dashed var(--lc-line-2); }

/* lacquer (cherry) and pearl (chrome) text: gradients clipped to glyphs, slowly catching light. */
:where(.chic) .lacquer, :where(.chic) .pearl{
  background-size:100% 240%; background-position:0 0;
  -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent;
  animation:lc-lacq 6s ease-in-out infinite alternate;
}
:where(.chic) .lacquer{ background-image:var(--lc-lacq); }
:where(.chic) .pearl{ background-image:linear-gradient(172deg,#ffffff 0%,#f5dbe1 20%,#9d7a84 34%,#fff5f7 44%,#e4c2ca 56%,#7a5560 70%,#fdf0f3 84%,#caa6af 100%); animation-duration:7s; }
@keyframes lc-lacq{ to{ background-position:0 100%; } }
/* offscreen pause (motion.js offscreenPause: one IntersectionObserver for every view): a host off screen holds
   every CSS loop inside it - shimmer, spins, pings, sheens, bokeh - and resumes from the same frame */
.is-off, .is-off *, .is-off::before, .is-off::after, .is-off *::before, .is-off *::after{ animation-play-state:paused !important; }
/* split helpers (motion.js) */
:where(.chic) .ch{ display:inline-block; }
/* a split letter is an inline-block only as tall as the tight line-height: the padding (cancelled by the margin)
   grows its painted box up to the Czech accents (Oi carons reach .95em above the baseline). Kept minimal, the
   shimmer repaints these boxes every frame. Whole words (inline) already paint their full font box. */
:where(.chic) .ch.lacquer, :where(.chic) .ch.pearl{ padding:.22em .02em .04em; margin:-.22em -.02em -.04em; }
:where(.chic) .split-mask .wd{ clip-path:inset(-60% -30% -.26em -30%); }

/* ============================================================
   5. BUTTONS AND LINKS
   ============================================================ */
/* pearl chrome pill - the signature button */
:where(.chic) .btn-chrome{
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:60px; padding:0 30px;
  border-radius:999px; font:600 15px/1 var(--lc-text); letter-spacing:.005em; color:#231417; text-decoration:none; white-space:nowrap;
  background:var(--lc-chrome);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95), inset 0 -2px 3px rgba(90,30,45,.22), 0 14px 34px -14px rgba(58,7,20,.55), 0 0 0 1px rgba(58,7,20,.16);
  overflow:hidden; isolation:isolate; cursor:pointer;
}
:where(.chic) .btn-chrome .btn-sheen{ position:absolute; inset:-60% -40%; z-index:-1; background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.95) 50%,transparent 58%); transform:translateX(-62%); transition:transform 1.1s var(--lc-ease); pointer-events:none; }
:where(.chic) .btn-chrome:hover .btn-sheen, :where(.chic) .btn-chrome:focus-visible .btn-sheen{ transform:translateX(62%); }
:where(.chic) .btn-chrome .btn-label{ position:relative; display:inline-flex; align-items:center; gap:12px; }
:where(.chic) .btn-chrome svg{ width:16px; height:16px; flex:none; }
:where(.chic) .btn-chrome .btn-ico{ width:32px; height:32px; margin-right:-16px; border-radius:50%; display:grid; place-items:center; background:var(--lc-cherry); color:var(--lc-milk); transition:transform .6s var(--lc-ease); }
:where(.chic) .btn-chrome:hover .btn-ico{ transform:rotate(-45deg); }
:where(.chic) .btn-chrome .btn-ico svg{ width:14px; height:14px; }
:where(.chic) .btn-chrome:focus-visible{ outline-color:var(--lc-cherry); outline-offset:5px; border-radius:999px; }
:where(.chic).site-header .btn-chrome:focus-visible{ outline-color:var(--lc-acc); }   /* the header rides over dark worlds too: follow the world's accent */

/* .btn - the workhorse (night pill, cherry on hover, a sheen passes through) */
:where(.chic) .btn{
  --bh:54px;
  position:relative; isolation:isolate; overflow:hidden;
  display:inline-flex; align-items:center; justify-content:center; gap:12px;
  min-height:var(--bh); padding:0 28px; border-radius:999px; border:1px solid transparent;
  background:var(--lc-night-2); color:var(--lc-milk);
  font:600 14.5px/1 var(--lc-text); letter-spacing:.005em; white-space:nowrap; text-align:center;
  cursor:pointer; user-select:none;
  transition:background-color .45s var(--lc-ease), color .45s var(--lc-ease), border-color .45s var(--lc-ease), transform .5s var(--lc-ease);
}
:where(.chic) .btn::after{ content:""; position:absolute; inset:-60% -40%; z-index:-1; background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.28) 50%,transparent 58%); transform:translateX(-62%); transition:transform 1.1s var(--lc-ease); pointer-events:none; }
:where(.chic) .btn:hover::after, :where(.chic) .btn:focus-visible::after{ transform:translateX(62%); }
:where(.chic) .btn svg{ width:16px; height:16px; flex:none; transition:transform .5s var(--lc-ease); }
:where(.chic) .btn:hover{ background:var(--lc-cherry); color:var(--lc-on-cherry); }
:where(.chic) .btn:hover svg:last-child{ transform:translateX(4px); }
:where(.chic) .btn:hover svg:first-child:not(:last-child){ transform:none; }
:where(.chic) .btn:active{ transform:scale(.97); }
:where(.chic) .btn:focus-visible{ outline-color:var(--lc-cherry); border-radius:999px; }
:where(.chic) .btn:disabled, :where(.chic) .btn[aria-disabled="true"]{ opacity:.45; cursor:not-allowed; }
:where(.chic) .btn-sm{ --bh:44px; padding:0 20px; font-size:13.5px; }
:where(.chic) .btn-block{ width:100%; }
:where(.chic) .btn-ghost{ background:transparent; color:var(--lc-ink); border-color:var(--lc-ctl); }
:where(.chic) .btn-ghost::after{ background:linear-gradient(105deg,transparent 42%,rgba(140,18,48,.12) 50%,transparent 58%); }
:where(.chic) .btn-ghost:hover{ background:transparent; color:var(--lc-ink); border-color:var(--lc-ink); }
:where(.chic) .btn-cherry{ background:var(--lc-cherry); color:var(--lc-on-cherry); }
:where(.chic) .btn-cherry:hover{ background:var(--lc-night-2); color:var(--lc-milk); }
/* on dark (inverted) surfaces the main button turns to pearl chrome */
:where(.chic) .inv-card .btn{ background:var(--lc-chrome); color:#231417; box-shadow:inset 0 1px 0 rgba(255,255,255,.9), inset 0 -2px 3px rgba(90,30,45,.22); }
:where(.chic) .inv-card .btn::after{ background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.95) 50%,transparent 58%); }
:where(.chic) .inv-card .btn:hover{ background:var(--lc-chrome); color:#231417; }
:where(.chic) .inv-card .btn-ghost{ background:transparent; box-shadow:none; color:var(--lc-on-inv); border-color:rgba(251,246,243,.45); }
:where(.chic) .inv-card .btn-ghost::after{ background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.18) 50%,transparent 58%); }
:where(.chic) .inv-card .btn-ghost:hover{ background:transparent; color:var(--lc-on-inv); border-color:var(--lc-on-inv); }
:where(.chic) .inv-card .btn:focus-visible{ outline-color:var(--lc-inv-accent); }

/* underlined text links */
:where(.chic) .lnk, :where(.chic) .link-u{
  position:relative; display:inline-flex; align-items:center; gap:10px; min-height:44px; padding:0;
  font:500 14px/1 var(--lc-text); color:inherit;
}
:where(.chic) .lnk::after, :where(.chic) .link-u::after{ content:""; position:absolute; left:0; right:0; bottom:10px; height:1px; background:currentColor; transform-origin:right; transition:transform .7s var(--lc-ease); }
:where(.chic) .lnk:hover::after, :where(.chic) .link-u:hover::after{ transform:scaleX(0); transform-origin:left; }
:where(.chic) .lnk svg{ width:15px; height:15px; }
:where(.chic) .icon-btn{ width:44px; height:44px; flex:none; border-radius:50%; display:grid; place-items:center; border:1px solid var(--lc-ctl); color:inherit; transition:border-color .3s, background-color .3s, transform .6s var(--lc-ease); }
:where(.chic) .icon-btn:hover{ border-color:currentColor; }
:where(.chic) .icon-btn svg{ width:18px; height:18px; }

/* ============================================================
   6. FORM + CARD COMPONENTS (shared with the adult events view)
   ============================================================ */
:where(.chic) .sheet{ background:var(--lc-milk); color:var(--lc-ink); border:1px solid var(--lc-line); border-radius:30px; padding:clamp(22px,3vw,44px); box-shadow:0 40px 90px -50px rgba(58,7,20,.55); }
:where(.chic) .inv-card{ position:relative; isolation:isolate; overflow:hidden; background:var(--lc-inv); color:var(--lc-on-inv); border-radius:30px; padding:32px 30px 28px; box-shadow:0 40px 90px -40px rgba(58,7,20,.8), inset 0 0 0 1px rgba(255,255,255,.06); }
:where(.chic) .inv-card::before{ content:""; position:absolute; inset:0; z-index:-1; background:radial-gradient(90% 60% at 100% 0%,rgba(140,18,48,.55),rgba(140,18,48,0) 60%); pointer-events:none; }
:where(.chic) .inv-card .kicker{ color:var(--lc-on-inv-2); }
:where(.chic) .inv-card .rule{ border-top-color:var(--lc-inv-line); }
:where(.chic) .inv-card .rule.is-dash{ border-top-color:rgba(251,246,243,.34); }
:where(.chic) .inv-card :focus-visible{ outline-color:var(--lc-inv-accent); }

:where(.chic) .field{ display:grid; gap:8px; align-content:start; min-width:0; }
:where(.chic) .field > label, :where(.chic) .field .field-l{ font:600 11px/1.4 var(--lc-text); letter-spacing:.14em; text-transform:uppercase; color:var(--lc-ink-2); }
:where(.chic) .field > label small{ font:400 11px/1 var(--lc-text); letter-spacing:.02em; text-transform:none; opacity:.9; margin-left:4px; }
:where(.chic) .field :where(input,select,textarea){
  width:100%; min-height:54px; padding:15px 18px; border-radius:16px;
  border:1px solid var(--lc-ctl); background:var(--lc-paper); color:var(--lc-ink);
  font:400 16px/1.4 var(--lc-text); appearance:none; -webkit-appearance:none;
  transition:border-color .3s var(--lc-ease), box-shadow .3s var(--lc-ease), background-color .3s;
}
:where(.chic) .sheet .field :where(input,select,textarea){ background:#F4E8E4; }
:where(.chic) .field textarea{ min-height:120px; resize:vertical; line-height:1.55; }
:where(.chic) .field select{ padding-right:44px; background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6.5 9.5 12 15l5.5-5.5' fill='none' stroke='%235B4146' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>"); background-repeat:no-repeat; background-position:right 14px center; background-size:18px; }
:where(.chic) .field :where(input,select,textarea):hover{ border-color:var(--lc-ink); }
:where(.chic) .field :where(input,select,textarea):focus{ outline:none; border-color:var(--lc-cherry); background-color:#fff; box-shadow:0 0 0 4px rgba(140,18,48,.16); }
:where(.chic) .field ::placeholder{ color:var(--lc-ink-2); opacity:.9; }
:where(.chic) .field input[type="date"]{ min-width:0; }
:where(.chic) .field input[type="date"]::-webkit-date-and-time-value{ text-align:left; }
:where(.chic) .field-err{ font-size:13.5px; line-height:1.4; color:var(--lc-cherry); }
:where(.chic) .field-err:empty{ display:none; }
:where(.chic) .field.is-err :where(input,select,textarea){ border-color:var(--lc-cherry); box-shadow:inset 0 0 0 1px var(--lc-cherry); }
:where(.chic) .field-hint{ font-size:13.5px; color:var(--lc-ink-2); }

:where(.chic) .chips{ display:flex; flex-wrap:wrap; gap:8px; }
:where(.chic) .chip{ position:relative; display:inline-flex; }
:where(.chic) .chip input{ position:absolute; opacity:0; inset:0; width:100%; height:100%; margin:0; cursor:pointer; }
:where(.chic) .chip > span{ display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:0 18px; border-radius:999px; border:1px solid var(--lc-ctl); font-size:14.5px; line-height:1.2; transition:background-color .35s var(--lc-ease), color .35s var(--lc-ease), border-color .35s var(--lc-ease); }
:where(.chic) .chip > span svg{ width:0; height:14px; flex:none; transition:width .35s var(--lc-ease); }
:where(.chic) .chip:hover > span{ border-color:var(--lc-ink); }
:where(.chic) .chip input:checked + span{ background:var(--lc-night-2); color:var(--lc-milk); border-color:var(--lc-night-2); }
:where(.chic) .chip input:checked + span svg{ width:14px; }
:where(.chic) .chip input:focus-visible + span{ outline:2px solid var(--lc-cherry); outline-offset:3px; }
:where(.chic) .chip input:disabled + span{ opacity:.45; cursor:not-allowed; }

:where(.chic) .opt{ position:relative; display:block; cursor:pointer; }
:where(.chic) .opt input{ position:absolute; opacity:0; inset:0; width:100%; height:100%; margin:0; cursor:pointer; z-index:1; }
:where(.chic) .opt .card{ display:grid; grid-template-columns:22px 1fr auto; gap:6px 14px; align-items:start; height:100%; padding:20px 20px 20px 18px; border-radius:22px; border:1px solid var(--lc-line-2); background:var(--lc-milk); color:var(--lc-ink); transition:border-color .4s var(--lc-ease), background-color .6s var(--lc-ease), color .6s var(--lc-ease), box-shadow .5s var(--lc-ease), transform .6s var(--lc-ease); }
:where(.chic) .opt:hover .card{ border-color:var(--lc-ink); transform:translateY(-2px); }
:where(.chic) .opt .dot{ width:20px; height:20px; border-radius:50%; border:1px solid var(--lc-ctl); margin-top:3px; display:grid; place-items:center; transition:border-color .3s, background-color .3s; }
:where(.chic) .opt .dot::after{ content:""; width:10px; height:10px; border-radius:50%; background:var(--lc-cherry); transform:scale(0); transition:transform .45s var(--lc-ease); }
:where(.chic) .opt input[type="checkbox"] + .card .dot{ border-radius:6px; }
:where(.chic) .opt input[type="checkbox"] + .card .dot::after{ width:10px; height:6px; border-radius:0; background:none; border-left:1.6px solid var(--lc-on-cherry); border-bottom:1.6px solid var(--lc-on-cherry); transform:rotate(-45deg) translate(1px,-1px) scale(0); }
:where(.chic) .opt .ttl{ font:400 20px/1.2 var(--lc-display); letter-spacing:0; text-wrap:balance; }
:where(.chic) .opt .pr{ font:600 12.5px/1.6 var(--lc-text); font-variant-numeric:tabular-nums; white-space:nowrap; text-align:right; }
:where(.chic) .opt .pr small{ display:block; font:400 11.5px/1.2 var(--lc-text); color:var(--lc-ink-2); }
:where(.chic) .opt .ds{ grid-column:2/4; font-size:14px; line-height:1.5; color:var(--lc-ink-2); }
:where(.chic) .opt input:checked + .card{ border-color:var(--lc-cherry); box-shadow:inset 0 0 0 1px var(--lc-cherry), 0 24px 44px -28px rgba(58,7,20,.55); background:#FFF9F7; }
:where(.chic) .opt input:checked + .card .dot{ border-color:var(--lc-cherry); }
:where(.chic) .opt input:checked + .card .dot::after{ transform:scale(1); }
:where(.chic) .opt input[type="checkbox"]:checked + .card .dot{ background:var(--lc-cherry); }
:where(.chic) .opt input[type="checkbox"]:checked + .card .dot::after{ transform:rotate(-45deg) translate(1px,-1px) scale(1); }
:where(.chic) .opt input:focus-visible + .card{ outline:2px solid var(--lc-cherry); outline-offset:3px; }
:where(.chic) .opt input:disabled{ cursor:not-allowed; }
:where(.chic) .opt input:disabled + .card{ opacity:.45; transform:none; }
:where(.chic) .opt.sm .card{ padding:16px 18px 16px 16px; }
:where(.chic) .opt.sm .ttl{ font-size:18px; }
:where(.chic) .opts{ display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr)); gap:10px; }

:where(.chic) .tick{ display:flex; align-items:center; gap:12px; min-height:48px; padding:10px 16px; border-radius:16px; border:1px dashed var(--lc-line-2); font-size:14.5px; line-height:1.4; cursor:pointer; }
:where(.chic) .tick input{ appearance:none; -webkit-appearance:none; width:20px; height:20px; margin:0; border-radius:6px; border:1px solid var(--lc-ctl); display:grid; place-items:center; flex:none; background:var(--lc-milk); cursor:pointer; }
:where(.chic) .tick input::after{ content:""; width:10px; height:6px; border-left:1.6px solid var(--lc-on-cherry); border-bottom:1.6px solid var(--lc-on-cherry); transform:rotate(-45deg) translate(1px,-1px) scale(0); transition:transform .25s; }
:where(.chic) .tick input:checked{ background:var(--lc-cherry); border-color:var(--lc-cherry); }
:where(.chic) .tick input:checked::after{ transform:rotate(-45deg) translate(1px,-1px) scale(1); }
:where(.chic) .tick input:focus-visible{ outline:2px solid var(--lc-cherry); outline-offset:3px; }
:where(.chic) .tick b{ font:600 12.5px/1.3 var(--lc-text); margin-left:auto; font-variant-numeric:tabular-nums; white-space:nowrap; }

:where(.chic) .stepper{ display:flex; align-items:center; gap:22px; }
:where(.chic) .stepper button{ width:56px; height:56px; flex:none; border-radius:50%; display:grid; place-items:center; background:var(--lc-milk); color:var(--lc-ink); box-shadow:inset 0 0 0 1px var(--lc-line-2), 0 10px 24px -14px rgba(58,7,20,.5); transition:transform .5s var(--lc-ease), background-color .3s; }
:where(.chic) .stepper button:hover{ background:#fff; }
:where(.chic) .stepper button:active{ transform:scale(.92); }
:where(.chic) .stepper button:disabled{ opacity:.35; cursor:not-allowed; }
:where(.chic) .stepper button svg{ width:16px; height:16px; }
:where(.chic) .stepper output{ font:400 56px/1 var(--lc-display); letter-spacing:-.01em; min-width:1.4em; text-align:center; font-variant-numeric:lining-nums tabular-nums; }
:where(.chic) .stepper .u{ font:400 17px/1.3 var(--lc-display); color:var(--lc-ink-2); }
:where(.chic) .stepper.sm{ gap:12px; }
:where(.chic) .stepper.sm button{ width:44px; height:44px; }
:where(.chic) .stepper.sm output{ font-size:38px; min-width:1.25em; }

:where(.chic) .note-line{ font-size:14px; line-height:1.5; color:var(--lc-ink-2); display:flex; gap:10px; align-items:baseline; }
:where(.chic) .note-line::before{ content:""; flex:none; width:6px; height:6px; border-radius:50%; background:var(--lc-cherry); translate:0 -2px; }

/* section layout helpers (adult events view) */
:where(.chic) .sec{ padding-block:clamp(84px,9vw,140px); }
:where(.chic) .sec-head{ display:flex; align-items:center; gap:18px; margin-bottom:clamp(36px,5vw,80px); }
:where(.chic) .sec-no{ font:600 11.5px/1 var(--lc-text); letter-spacing:.14em; }
:where(.chic) .sec-no::before{ content:"("; } :where(.chic) .sec-no::after{ content:")"; }
:where(.chic) .sec-rule{ flex:1; height:1px; background:currentColor; opacity:.22; transform-origin:left; }
:where(.chic) .sec-note{ opacity:.85; }
:where(.chic) .sec-intro{ display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:32px 80px; align-items:end; margin-bottom:clamp(44px,5vw,80px); }

/* ============================================================
   7. GLOBAL LAYERS: cursor, preloader, liquid wipe
   ============================================================ */
:where(.chic).lc-cursor{ position:fixed; left:0; top:0; z-index:450; pointer-events:none; display:none; opacity:0; transition:opacity .4s; color:var(--lc-fg); }
:where(.chic).lc-cursor.is-on{ opacity:1; }
html.has-cursor:not([data-view="kids"]) :where(.chic).lc-cursor{ display:block; }
html.has-cursor:not([data-view="kids"]), html.has-cursor:not([data-view="kids"]) body *{ cursor:none !important; }
html.has-cursor:not([data-view="kids"]) :where(input[type="text"],input[type="email"],input[type="tel"],input[type="number"],input[type="date"],textarea,select){ cursor:auto !important; }
:where(.chic) .c-ring, :where(.chic) .c-dot, :where(.chic) .c-label{ position:absolute; left:0; top:0; will-change:transform; }
:where(.chic) .c-ring{ width:46px; height:46px; margin:-23px 0 0 -23px; border-radius:50%; border:1px solid currentColor; opacity:.55; }
:where(.chic) .c-ring.is-big{ opacity:1; }
:where(.chic) .c-dot{ width:8px; height:8px; margin:-4px 0 0 -4px; border-radius:50%; background:var(--lc-acc); }
:where(.chic) .c-label{ font:600 10px/1 var(--lc-text); letter-spacing:.14em; text-transform:uppercase; color:var(--lc-bg); white-space:nowrap; opacity:0; }
:where(.chic) .c-fill{ position:absolute; inset:0; border-radius:50%; background:currentColor; opacity:.9; transform:scale(0); transition:transform .5s var(--lc-ease); }
:where(.chic) .c-ring.is-big .c-fill{ transform:scale(1); }
html.ch-open :where(.chic).lc-cursor{ --lc-fg:#FBF6F3; --lc-bg:#130509; --lc-acc:#F2A2B5; color:#FBF6F3; }

/* preloader: only on a first chic paint, never in reduced motion; CSS failsafe hides it */
:where(.chic).lc-pre{ position:fixed; inset:0; z-index:400; display:none; place-items:center; color:var(--lc-ink); pointer-events:none; }
html.lc-pre :where(.chic).lc-pre{ display:grid; animation:lc-pre-fail .01s linear 2.6s forwards; }
:where(.chic) .pre-fill{ position:absolute; inset:0; background:var(--lc-pink); }
:where(.chic) .pre-edge{ position:absolute; left:0; bottom:-1px; width:100%; height:160px; overflow:visible; }
:where(.chic) .pre-in{ position:relative; display:grid; justify-items:center; gap:18px; }
:where(.chic) .pre-mark{ width:74px; height:88px; overflow:visible; }
:where(.chic) .pre-mark .ear{ fill:none; stroke:var(--lc-ink); stroke-width:1.2; stroke-dasharray:80; stroke-dashoffset:80; animation:lc-ear .8s var(--lc-ease) .05s forwards; }
:where(.chic) .pre-mark .ear + .ear{ animation-delay:.16s; }
:where(.chic) .pre-mark .chy{ transform-box:fill-box; transform-origin:50% 50%; transform:scale(0); animation:lc-pop .6s var(--lc-ease) .38s forwards; }
:where(.chic) .pre-mark .chy + .chy{ animation-delay:.46s; }
:where(.chic) .pre-word{ font:400 24px/1 var(--lc-display); letter-spacing:.005em; }
:where(.chic) .pre-word em{ color:var(--lc-cherry); }
:where(.chic) .pre-count{ position:absolute; right:var(--lc-pad); bottom:calc(var(--lc-pad) * .8); font:600 12px/1 var(--lc-text); letter-spacing:.14em; font-variant-numeric:tabular-nums; }
:where(.chic) .pre-cap{ position:absolute; left:var(--lc-pad); bottom:calc(var(--lc-pad) * .8); font:600 11px/1 var(--lc-text); letter-spacing:.16em; text-transform:uppercase; }
@keyframes lc-ear{ to{ stroke-dashoffset:0; } }
@keyframes lc-pop{ to{ transform:scale(1); } }
@keyframes lc-pre-fail{ to{ opacity:0; visibility:hidden; } }
/* no preloader (a reload, a deep link): the hero copy stays hidden until motion.js plays its entrance,
   instead of showing the unsplit headline for a moment; the fail-safe shows it after 2.4 s regardless */
html.lc-hold :where(.chic) :is(.m-hero, .ev-hero) :is(h1, [data-in]){ opacity:0; animation:lc-hold-fail .01s linear 2.4s forwards; }
@keyframes lc-hold-fail{ to{ opacity:1; } }

/* liquid wipe between views (LC.transitionFn) */
:where(.chic).lc-wipe{ position:fixed; inset:0; z-index:350; pointer-events:none; }
:where(.chic).lc-wipe[hidden]{ display:none; }
:where(.chic).lc-wipe svg{ position:absolute; inset:0; width:100%; height:100%; }
:where(.chic).lc-wipe .w0{ fill:var(--lc-pink-2); }
:where(.chic).lc-wipe .w1{ fill:var(--lc-cherry); }
:where(.chic).lc-wipe .w2{ fill:var(--lc-night); }
:where(.chic).lc-wipe .w-edge{ fill:none; stroke:url(#lc-wipe-chrome); stroke-width:2.5; }
:where(.chic) .wipe-title{ position:absolute; inset:0; display:grid; place-content:center; justify-items:center; text-align:center; color:var(--lc-milk); padding:0 var(--lc-pad); }
:where(.chic) .wt-k{ font:600 12px/1 var(--lc-text); letter-spacing:.2em; text-transform:uppercase; opacity:.8; margin-bottom:18px; }
:where(.chic) .wt-t{ font:400 clamp(46px,7.6vw,140px)/.98 var(--lc-display); letter-spacing:-.015em; }

/* ============================================================
   8. HEADER (fixed, transparent over the silk; hides on the way down)
   ============================================================ */
:where(.chic).site-header{
  position:fixed; left:0; right:0; top:0; z-index:120; height:var(--lc-head-h); color:var(--lc-fg);
  transition:transform .7s var(--lc-ease), background-color .6s var(--lc-ease), box-shadow .6s var(--lc-ease);
}
:where(.chic).site-header::before{ content:""; position:absolute; inset:0; z-index:-1; opacity:0; background:color-mix(in srgb,var(--lc-bg) 72%,transparent); -webkit-backdrop-filter:blur(14px) saturate(1.15); backdrop-filter:blur(14px) saturate(1.15); box-shadow:0 1px 0 var(--lc-rule); transition:opacity .6s var(--lc-ease); pointer-events:none; }
:where(.chic).site-header.is-scrolled::before{ opacity:1; }
:where(.chic).site-header.is-hidden{ transform:translateY(-110%); }
html[data-den-tone="dark"] :where(.chic).site-header, html[data-den-tone="dark"] :where(.chic).lc-cursor{ color:#FBF6F3; --lc-acc:#F2A2B5; --lc-bg:#130509; }
html[data-den-tone="light"] :where(.chic).site-header, html[data-den-tone="light"] :where(.chic).lc-cursor{ color:#231417; --lc-acc:#8C1230; }
:where(.chic) .sh-in{ display:flex; align-items:center; gap:24px; height:100%; padding:0 var(--lc-pad); }
:where(.chic) .sh-brand{ display:inline-flex; align-items:center; gap:12px; margin-right:auto; min-height:44px; border-radius:8px; }
:where(.chic) .mk{ --mk-fruit:var(--lc-acc); color:currentColor; overflow:visible; }
:where(.chic) .sh-brand .mk{ width:30px; height:36px; }
:where(.chic) .wm{ font-family:var(--lc-display); font-weight:400; font-size:22px; letter-spacing:.005em; line-height:1; white-space:nowrap; }
:where(.chic) .sh-nav{ display:flex; gap:2px; }
:where(.chic) .sh-nav :where(a,button){ position:relative; display:block; padding:14px 12px; border-radius:999px; font:500 13.5px/1 var(--lc-text); letter-spacing:.01em; white-space:nowrap; }
/* hover roll: the Golos label leaves upwards, the same word in Yeseva rolls in. Both sit in one grid cell, so the
   link is as wide as the wider of the two and nothing is clipped. */
:where(.chic) .nl{ display:grid; justify-items:center; position:relative; overflow:hidden; height:21px; line-height:16px; padding:0 0 5px; margin:0 0 -5px; }
:where(.chic) .nl > span{ grid-area:1 / 1; display:block; height:16px; white-space:nowrap; transition:transform .6s var(--lc-ease); }
:where(.chic) .nl > span + span{ transform:translateY(150%); font-family:var(--lc-display); font-size:15px; letter-spacing:.01em; }
:where(.chic) .sh-nav :where(a,button):hover .nl > span:first-child{ transform:translateY(-150%); }
:where(.chic) .sh-nav :where(a,button):hover .nl > span + span{ transform:translateY(0); }
html[data-view="adults"] :where(.chic) .sh-ev .nl > span:first-child{ transform:translateY(-150%); }
html[data-view="adults"] :where(.chic) .sh-ev .nl > span + span{ transform:translateY(0); }
:where(.chic) .sh-r{ display:flex; align-items:center; gap:10px; }
:where(.chic) .sh-cta{ min-height:46px; padding:0 22px; font-size:13.5px; }
:where(.chic) .sh-menu{ display:none; position:relative; width:48px; height:48px; border-radius:50%; box-shadow:inset 0 0 0 1px var(--lc-rule); }
:where(.chic) .sh-menu .bars::before, :where(.chic) .sh-menu .bars::after{ content:""; position:absolute; left:14px; right:14px; height:1.5px; background:currentColor; transition:transform .6s var(--lc-ease); }
:where(.chic) .sh-menu .bars::before{ top:19px; }
:where(.chic) .sh-menu .bars::after{ top:27px; }
:where(.chic) .sh-menu[aria-expanded="true"] .bars::before{ transform:translateY(4px) rotate(45deg); }
:where(.chic) .sh-menu[aria-expanded="true"] .bars::after{ transform:translateY(-4px) rotate(-45deg); }
:where(.chic) .sh-menu:focus-visible{ border-radius:50%; }

/* language menu (core contract: .lang-menu > .lang-btn + .lang-pop > .lang-item) */
:where(.chic) .lang-menu{ position:relative; }
:where(.chic) .lang-btn{ display:inline-flex; align-items:center; gap:6px; height:44px; padding:0 12px; border-radius:999px; font:600 12px/1 var(--lc-text); letter-spacing:.12em; transition:background-color .3s; }
:where(.chic) .lang-btn:hover{ background:color-mix(in srgb,currentColor 8%,transparent); }
:where(.chic) .lang-btn svg{ width:13px; height:13px; transition:transform .45s var(--lc-ease); }
:where(.chic) .lang-btn[aria-expanded="true"] svg{ transform:rotate(180deg); }
:where(.chic) .lang-pop{ position:absolute; top:calc(100% + 8px); right:0; z-index:5; min-width:190px; display:grid; gap:2px; padding:6px; background:var(--lc-milk); color:var(--lc-ink); border-radius:20px; box-shadow:0 30px 60px -24px rgba(40,10,20,.5), inset 0 0 0 1px var(--lc-line); }
:where(.chic) .lang-item{ display:flex; align-items:center; justify-content:space-between; gap:14px; width:100%; min-height:44px; padding:0 14px; border-radius:14px; font:400 15px/1 var(--lc-text); text-align:left; }
:where(.chic) .lang-item:hover{ background:var(--lc-cherry-tint); }
:where(.chic) .lang-pop .lang-item[aria-checked="true"]::after{ content:""; width:7px; height:7px; border-radius:50%; background:var(--lc-cherry); }
:where(.chic) .lang-item:focus-visible{ outline-color:var(--lc-cherry); outline-offset:-2px; }
@media (prefers-reduced-motion:no-preference){
  :where(.chic) .lang-pop:not([hidden]){ animation:lc-pop-in .45s var(--lc-ease); transform-origin:100% 0; }
}
@keyframes lc-pop-in{ from{ opacity:0; transform:translateY(-8px) scale(.96); } to{ opacity:1; transform:none; } }

/* ============================================================
   9. MOBILE MENU (#lc-mnav, a core modal; motion.js opens it as a circle from the burger)
   ============================================================ */
:where(.chic).mnav{ display:block; padding:0; background:var(--lc-night); color:var(--lc-milk); overflow-y:auto; overscroll-behavior:contain; }
:where(.chic).mnav[hidden]{ display:none; }
:where(.chic) .mnav-in{ min-height:100%; display:flex; flex-direction:column; padding:0 var(--lc-pad) max(24px,env(safe-area-inset-bottom)); }
:where(.chic) .mnav-top{ display:flex; align-items:center; justify-content:space-between; height:var(--lc-head-h); flex:none; }
:where(.chic) .mnav-top .mk{ width:24px; height:30px; --mk-fruit:var(--lc-petal); }
:where(.chic) .mnav-top .wm{ font-size:20px; }
:where(.chic).mnav .modal-close{ position:static; width:48px; height:48px; border-color:rgba(251,246,243,.4); color:var(--lc-milk); }
:where(.chic).mnav .modal-close:hover{ transform:rotate(90deg); }
:where(.chic) .mnav-nav{ display:flex; flex-direction:column; margin-top:6px; }
:where(.chic) .mnav-nav > *{ overflow:hidden; border-bottom:1px solid rgba(251,246,243,.14); }
:where(.chic) .mnav-nav :where(a,button){ display:flex; justify-content:space-between; align-items:baseline; width:100%; padding:14px 0; font:400 clamp(34px,9.4vw,50px)/1.1 var(--lc-display); letter-spacing:-.005em; text-align:left; }
:where(.chic) .mnav-nav small{ font:600 11px/1 var(--lc-text); letter-spacing:.14em; opacity:.6; }
:where(.chic) .mnav-nav em{ font-family:var(--lc-sticker); font-size:.82em; letter-spacing:var(--lc-stk-ls); color:var(--lc-petal); }
html[lang="ru"] :where(.chic) .mnav-nav em{ font-family:var(--lc-display); font-size:1em; letter-spacing:inherit; }   /* "События": Yeseva in ru (see the sticker note in section 4) */
:where(.chic) .mnav-sig{ margin:auto 0 24px; padding-top:28px; font:400 24px/1.25 var(--lc-display); }
:where(.chic) .mnav-sig em{ color:var(--lc-petal); }
:where(.chic) .mnav-foot{ display:grid; gap:16px; }
:where(.chic) .mnav-row{ display:flex; justify-content:space-between; align-items:center; }
:where(.chic) .mnav-langs{ display:flex; gap:2px; }
:where(.chic) .mnav-langs .lang-item{ width:auto; min-width:48px; justify-content:center; padding:0 10px; font:600 12px/1 var(--lc-text); letter-spacing:.12em; color:rgba(251,246,243,.72); }
:where(.chic) .mnav-langs .lang-item:hover{ background:rgba(251,246,243,.08); }
:where(.chic) .mnav-langs .lang-item[aria-checked="true"]{ color:var(--lc-milk); text-decoration:underline; text-underline-offset:6px; text-decoration-thickness:1px; }
:where(.chic) .mnav-langs .lang-item:focus-visible, :where(.chic).mnav :focus-visible{ outline-color:var(--lc-petal); }
:where(.chic) .mnav-meta{ color:rgba(251,246,243,.72); font-size:14px; line-height:1.6; }
@media (max-height:640px){ :where(.chic) .mnav-sig{ display:none; } :where(.chic) .mnav-foot{ margin-top:24px; } }

/* ============================================================
   10. MODALS (chooser, nav picker, lightbox) + TOAST
   ============================================================ */
:where(.chic).modal{ padding:20px; }
:where(.chic).modal .modal-back{ background:var(--lc-veil); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
:where(.chic).modal .modal-card{ position:relative; width:min(100%,560px); max-height:calc(100dvh - 40px); overflow:auto; overscroll-behavior:contain; background:var(--lc-milk); color:var(--lc-ink); border-radius:30px; padding:clamp(28px,3.4vw,44px); box-shadow:0 50px 120px -40px rgba(20,5,10,.7); }
:where(.chic).modal .modal-card :focus-visible{ outline-color:var(--lc-cherry); }   /* light cards: a fixed ring, never the world's --lc-acc (milk in the cherry world) */
:where(.chic).modal:not(.mnav):not(.lc-chooser) .modal-close{ position:absolute; top:16px; right:16px; z-index:2; background:var(--lc-milk); color:var(--lc-ink); }
:where(.chic).modal:not(.lc-chooser) .modal-close:hover{ transform:rotate(90deg); }
:where(.chic) .modal-title{ font:400 clamp(32px,3.4vw,46px)/1.02 var(--lc-display); letter-spacing:-.01em; margin:12px 0 8px; }
:where(.chic) .modal-title em{ color:var(--lc-cherry); }
@media (prefers-reduced-motion:no-preference){
  :where(.chic).modal:not(.mnav):not(.lc-chooser):not([hidden]) .modal-back{ animation:lc-fade-in .5s var(--lc-ease) both; }
  :where(.chic).modal:not(.mnav):not(.lc-chooser):not([hidden]) .modal-card{ animation:lc-card-in .8s var(--lc-ease) both; }
}
@keyframes lc-fade-in{ from{ opacity:0; } to{ opacity:1; } }
@keyframes lc-card-in{ from{ opacity:0; transform:translateY(34px) scale(.97); } to{ opacity:1; transform:none; } }

/* chooser: a liquid blob swallows the screen from the click point (motion.js) */
:where(.chic).lc-chooser{ display:block; padding:0; z-index:260; color:var(--lc-milk); }
:where(.chic) .ch-under{ position:absolute; inset:0; background:var(--lc-pink-2); }
:where(.chic) .ch-under.two{ background:var(--lc-cherry); }
:where(.chic) .ch-panel{ position:absolute; inset:0; background:var(--lc-night); color:var(--lc-milk); overflow:hidden; }
:where(.chic) .ch-silk{ position:absolute; inset:0; }
:where(.chic) .ch-silk::after{ content:""; position:absolute; inset:0; background:radial-gradient(70% 60% at 50% 45%,rgba(19,5,9,.22),rgba(19,5,9,.74)); pointer-events:none; }
:where(.chic) .ch-silk .silk-cv{ position:absolute; inset:0; width:100%; height:100%; display:block; }
:where(.chic) .ch-in{ position:relative; height:100%; display:grid; grid-template-rows:auto auto minmax(0,1fr) auto; padding:22px var(--lc-pad) 24px; overflow:auto; overscroll-behavior:contain; }
:where(.chic) .ch-top{ display:flex; justify-content:space-between; align-items:center; min-height:52px; }
:where(.chic) .ch-close{ display:inline-flex; align-items:center; gap:12px; min-height:48px; padding-left:6px; font:600 12px/1 var(--lc-text); letter-spacing:.14em; text-transform:uppercase; }
:where(.chic) .ch-close i{ width:48px; height:48px; border-radius:50%; display:grid; place-items:center; box-shadow:inset 0 0 0 1px rgba(251,246,243,.42); transition:transform .7s var(--lc-ease); }
:where(.chic) .ch-close:hover i{ transform:rotate(90deg); }
:where(.chic) .ch-close svg{ width:16px; height:16px; }
:where(.chic) .ch-close:focus-visible{ border-radius:999px; outline-offset:6px; }
:where(.chic).lc-chooser :focus-visible{ outline-color:var(--lc-milk); }
:where(.chic) .ch-title{ margin:clamp(10px,2.4vh,34px) 0 clamp(18px,3.6vh,46px); text-align:center; font:400 clamp(46px,7vw,132px)/.96 var(--lc-display); letter-spacing:-.015em; }
html[lang="ru"] :where(.chic) .ch-title{ font-size:clamp(40px,5.6vw,108px); }
:where(.chic) .ch-sub{ display:block; margin:12px auto 0; max-width:36em; font:600 11.5px/1.6 var(--lc-text); letter-spacing:.14em; text-transform:uppercase; opacity:.8; }
:where(.chic) .ch-opts{ display:flex; gap:16px; min-height:0; }
:where(.chic) .ch-opt{ position:relative; flex:1; min-height:clamp(300px,52vh,620px); border-radius:32px; overflow:hidden; isolation:isolate; display:flex; flex-direction:column; justify-content:space-between; padding:clamp(20px,2.6vw,40px); transition:flex 1s var(--lc-ease), transform 1s var(--lc-ease); }
@media (hover:hover) and (min-width:900px){
  :where(.chic) .ch-opts:hover .ch-opt{ flex:.8; }
  :where(.chic) .ch-opts .ch-opt:hover{ flex:1.35; }
  /* the name never re-wraps while the cards trade width (it jumped to two lines mid-animation): it keeps
     one line and the shrinking card stops at its width */
  :where(.chic) .ch-name{ white-space:nowrap; }
}
:where(.chic) .ch-a{ color:#231417; background:linear-gradient(135deg,#fff 0%,#f1dde2 18%,#c9a3ae 46%,#fbf1f3 55%,#e2c3ca 76%,#fff 100%); }
:where(.chic) .ch-a::after{ content:""; position:absolute; inset:-40%; z-index:-1; background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.85) 50%,transparent 60%); transform:translateX(-50%); transition:transform 1.4s var(--lc-ease); }
:where(.chic) .ch-a:hover::after{ transform:translateX(50%); }
:where(.chic) .ch-a:focus-visible{ outline-color:var(--lc-milk); outline-offset:4px; border-radius:32px; }
:where(.chic) .ch-b{ color:var(--lc-milk); background:#2a0a12; }
:where(.chic) .ch-b img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; filter:grayscale(1) contrast(1.05); transform:scale(1.08); transition:transform 1.4s var(--lc-ease); }
:where(.chic) .ch-b::before{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(140,18,48,.35),rgba(58,7,20,.92)); mix-blend-mode:multiply; }
:where(.chic) .ch-b::after{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,rgba(19,5,9,.8),rgba(19,5,9,0) 62%); }
:where(.chic) .ch-b:hover img{ transform:scale(1); }
:where(.chic) .ch-b:focus-visible{ outline-offset:4px; border-radius:32px; }
:where(.chic) .ch-k{ display:flex; justify-content:space-between; gap:14px; font:600 11.5px/1.3 var(--lc-text); letter-spacing:.14em; text-transform:uppercase; }
:where(.chic) .ch-name{ display:block; font:400 clamp(42px,5.2vw,96px)/.95 var(--lc-display); letter-spacing:-.015em; }
:where(.chic) .ch-a .ch-name em{ color:var(--lc-cherry); }
:where(.chic) .ch-b .ch-name em{ color:#FFD9E1; }
:where(.chic) .ch-d{ display:block; max-width:440px; margin-top:16px; font-size:clamp(14px,1.1vw,17px); line-height:1.5; }
:where(.chic) .ch-go{ display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:18px; }
:where(.chic) .ch-go i{ width:62px; height:62px; flex:none; border-radius:50%; display:grid; place-items:center; background:currentColor; transition:transform .8s var(--lc-ease); }
:where(.chic) .ch-go i svg{ width:20px; height:20px; }
:where(.chic) .ch-a .ch-go i svg{ color:var(--lc-milk); }
:where(.chic) .ch-b .ch-go i svg{ color:var(--lc-deep); }
:where(.chic) .ch-opt:hover .ch-go i{ transform:rotate(-45deg) scale(1.08); }
:where(.chic) .ch-foot{ margin:18px 0 0; text-align:center; font:600 12px/1.5 var(--lc-text); letter-spacing:.12em; text-transform:uppercase; }
:where(.chic) .ch-foot a{ display:inline-block; padding:6px 0; text-decoration:underline; text-underline-offset:4px; }
:where(.chic) .ch-ripple{ position:absolute; border-radius:50%; pointer-events:none; background:radial-gradient(circle,rgba(255,255,255,.7),rgba(255,255,255,0) 70%); transform:translate(-50%,-50%) scale(0); }
/* perf: the shimmering title letters (chooser + wipe) live in their own small layers; painted into the
   full-screen .ch-in / .lc-wipe layer, every shimmer frame re-rastered the whole screen (35-70 ms frames).
   During the liquid entrance (html.ch-intro, motion.js) the shimmer holds still and resumes from the same
   frame. Under the opaque chooser the views' idle loops pause (resumed when it has closed). */
html:not(.lc-still) :where(.chic).lc-chooser .ch-title .ch, html:not(.lc-still) :where(.chic) .wt-t .ch{ will-change:transform; }
html.ch-intro :where(.chic).lc-chooser :is(.lacquer, .pearl){ animation-play-state:paused; }
html.ch-open [data-view-pane] :is(.lacquer, .pearl, .m-cue i, .m-blob, .m-badge .ring, .m-live i, .m-lk-hint svg, .den-bokeh, .den-colon, .den-fb-bubs circle, .ev-hero-note i),
html.ch-open [data-view-pane] :is(.m-blob, .ev-tk-dev, .ev-sum)::after, html.ch-open [data-view-pane] .ev-live::before{ animation-play-state:paused; }

/* nav picker */
:where(.chic).modal .navm-card{ width:min(100%,480px); }
:where(.chic) .navm-card > .kicker{ color:var(--lc-ink-2); }
:where(.chic) .navm-sub{ color:var(--lc-ink-2); }
:where(.chic) .nav-apps{ margin-top:22px; border-top:1px solid var(--lc-line-2); }
:where(.chic) .nav-app{ display:flex; align-items:center; justify-content:space-between; min-height:60px; border-bottom:1px solid var(--lc-line); font:400 22px/1.2 var(--lc-display); letter-spacing:0; transition:color .3s, padding .5s var(--lc-ease); }
:where(.chic) .nav-app svg{ width:18px; height:18px; transition:transform .5s var(--lc-ease); }
:where(.chic) .nav-app:hover{ color:var(--lc-cherry); padding-left:8px; }
:where(.chic) .nav-app:hover svg{ transform:rotate(-45deg); }

/* lightbox */
:where(.chic).modal .lightbox-card{ width:auto; max-width:min(100%,1100px); padding:0; background:transparent; box-shadow:none; overflow:visible; text-align:center; }
:where(.chic) .lightbox-card img{ max-width:100%; max-height:calc(100dvh - 120px); width:auto; height:auto; margin:0 auto; border-radius:22px; box-shadow:0 50px 120px -40px rgba(0,0,0,.7); }
:where(.chic) .lightbox-card .modal-close{ top:-8px; right:-8px; }
:where(.chic).modal .lightbox-card :focus-visible{ outline-color:var(--lc-petal); }   /* the ring sits on the dark backdrop here */
:where(.chic) .lightbox-cap{ margin-top:14px; font:400 18px/1.4 var(--lc-display); color:var(--lc-milk); }
:where(.chic) .lightbox-cap:empty{ display:none; }

/* toast (position and show/hide in core.css) */
:where(.chic)#toast{ background:var(--lc-night-2); color:var(--lc-milk); padding:14px 22px; border-radius:999px; font:500 13.5px/1.35 var(--lc-text); max-width:calc(100% - 32px); box-shadow:0 24px 50px -20px rgba(0,0,0,.6), inset 0 0 0 1px rgba(255,255,255,.06); text-align:center; }

/* ============================================================
   11. MAIN VIEW
   ============================================================ */
:where(.chic).m-view{ overflow-x:clip; }   /* the pane itself carries .chic, so no descendant combinator here */
:where(.chic) .m-sec{ position:relative; padding:clamp(80px,10vw,150px) var(--lc-pad); }
:where(.chic) .m-head{ display:flex; align-items:center; gap:18px; margin-bottom:clamp(40px,6vw,90px); }
:where(.chic) .m-head .rule-l{ flex:1; height:1px; background:currentColor; opacity:.22; transform-origin:left; }
:where(.chic) .m-big{ font:400 clamp(40px,6vw,112px)/.98 var(--lc-display); letter-spacing:-.012em; text-wrap:balance; }
:where(.chic) .m-view .lede{ font-size:clamp(16px,1.25vw,19px); }
:where(.chic) .line-mask{ display:block; overflow:hidden; padding-bottom:.08em; margin-bottom:-.08em; }

/* ---- hero ---- */
:where(.chic) .m-hero{ position:relative; height:100vh; height:100svh; min-height:620px; color:var(--lc-ink); }
:where(.chic) .m-hero-frame{ position:absolute; inset:0; overflow:hidden; background:radial-gradient(120% 90% at 70% 30%,#f7e8e5 0%,#e7c8c2 46%,#d6aab1 100%); transform-origin:50% 0; }
:where(.chic) .m-hero-frame .silk-cv{ position:absolute; inset:0; width:100%; height:100%; display:block; }
:where(.chic) .m-hero-fog{
  position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(110% 64% at 20% 88%,rgba(243,228,224,.8) 0%,rgba(243,228,224,.4) 45%,rgba(243,228,224,0) 72%),
    linear-gradient(180deg,rgba(243,228,224,.32) 0%,rgba(243,228,224,0) 22%);
}
:where(.chic) .m-hero-in{ position:relative; height:100%; display:grid; grid-template-rows:auto 1fr auto; padding:calc(var(--lc-head-h) + 26px) var(--lc-pad) clamp(22px,3.4vw,46px); }
:where(.chic) .m-hero-top{ display:flex; justify-content:space-between; align-items:center; gap:20px; }
:where(.chic) .m-live{ display:inline-flex; align-items:center; gap:10px; margin:0; padding:9px 16px 9px 12px; border-radius:999px; font:600 12px/1 var(--lc-text); letter-spacing:.04em; font-variant-numeric:tabular-nums; background:rgba(251,246,243,.6); box-shadow:inset 0 0 0 1px rgba(35,20,23,.1); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
:where(.chic) .m-live i{ width:8px; height:8px; border-radius:50%; background:#2f8f5b; }
:where(.chic) .m-live[data-state="open"] i{ animation:lc-ping 2.2s infinite; }
:where(.chic) .m-live:not([data-state="open"]) i{ background:var(--lc-cherry); }
@keyframes lc-ping{ 0%{ box-shadow:0 0 0 0 rgba(47,143,91,.45); } 80%,100%{ box-shadow:0 0 0 10px rgba(47,143,91,0); } }
:where(.chic) .m-h1{ align-self:end; margin:0 0 clamp(18px,2.6vw,34px); font:400 clamp(52px,9.2vw,176px)/.94 var(--lc-display); letter-spacing:-.015em; }
html[lang="ru"] :where(.chic) .m-h1{ font-size:clamp(44px,7.6vw,146px); }
:where(.chic) .m-h1 .l1, :where(.chic) .m-h1 .l2{ display:block; }
:where(.chic) .m-h1 .l2{ padding-left:clamp(0px,9vw,180px); }
:where(.chic) .m-h1 .ch{ will-change:transform; }
:where(.chic) .m-hero-bot{ display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:32px; }
:where(.chic) .m-deck{ max-width:470px; margin:0; font-size:clamp(15px,1.12vw,17px); line-height:1.55; }
:where(.chic) .m-deck strong{ font-weight:600; }
:where(.chic) .m-ctas{ display:flex; align-items:center; gap:26px; }
:where(.chic) .m-badge{ position:absolute; right:var(--lc-pad); top:calc(var(--lc-head-h) + 86px); width:132px; height:132px; }
:where(.chic) .m-badge .ring{ width:100%; height:100%; animation:lc-spin 22s linear infinite; }
:where(.chic) .m-badge text{ font:600 9.6px var(--lc-text); letter-spacing:.25em; text-transform:uppercase; fill:currentColor; }
:where(.chic) .m-badge .mk{ position:absolute; inset:0; margin:auto; width:34px; height:40px; --mk-fruit:var(--lc-cherry); }
@keyframes lc-spin{ to{ transform:rotate(360deg); } }
:where(.chic) .m-cue{ position:absolute; left:50%; bottom:clamp(22px,3.4vw,46px); transform:translateX(-50%); display:grid; justify-items:center; gap:10px; font:600 10px/1 var(--lc-text); letter-spacing:.2em; text-transform:uppercase; }
:where(.chic) .m-cue i{ width:1px; height:44px; background:linear-gradient(currentColor 50%,transparent 50%); background-size:1px 200%; animation:lc-cue 2s var(--lc-ease) infinite; }
@keyframes lc-cue{ from{ background-position:0 100%; } to{ background-position:0 -100%; } }

/* ---- marquee (velocity reactive) ---- */
:where(.chic) .m-marq{ position:relative; padding:clamp(40px,6vw,90px) 0 clamp(20px,3vw,40px); overflow:hidden; }
:where(.chic) .m-mq-row{ white-space:nowrap; }
:where(.chic) .m-mq-track{ display:inline-flex; align-items:center; will-change:transform; }
:where(.chic) .m-mq-item{ display:inline-flex; align-items:center; gap:clamp(22px,3vw,48px); padding-right:clamp(22px,3vw,48px); font:400 clamp(56px,8.6vw,156px)/1.12 var(--lc-display); letter-spacing:-.01em; }
:where(.chic) .m-mq-alt .m-mq-item{ font:700 clamp(30px,4.4vw,76px)/1.12 var(--lc-text); letter-spacing:.01em; text-transform:uppercase; color:transparent; -webkit-text-stroke:1.2px var(--lc-fg); }
:where(.chic) .m-mq-sep{ width:.5em; height:.6em; flex:none; color:var(--lc-fg); --mk-fruit:var(--lc-acc); }
:where(.chic) .m-mq-alt .m-mq-sep{ width:.4em; }

/* ---- café ---- */
:where(.chic) .m-cafe-grid{ display:grid; grid-template-columns:1.25fr .9fr; gap:clamp(30px,6vw,110px); align-items:start; }
:where(.chic) .m-statement{ font:400 clamp(42px,6.2vw,112px)/.98 var(--lc-display); letter-spacing:-.012em; text-wrap:balance; }
:where(.chic) .m-statement em{ color:var(--lc-acc); }
:where(.chic) .m-cafe-copy{ margin-top:clamp(36px,5vw,80px); display:grid; grid-template-columns:1.1fr .9fr; gap:32px; max-width:760px; }
:where(.chic) .m-cafe-copy .lede{ margin:0; }
/* the stuck-on label: Oi on a cherry pill, a little askew */
:where(.chic) .m-nores{ display:grid; justify-items:start; align-content:start; gap:16px; }
:where(.chic) .m-nores > span{ display:inline-block; padding:.62em .95em .7em; border-radius:16px; background:var(--lc-cherry); color:var(--lc-milk); font:400 clamp(16px,1.3vw,20px)/1.1 var(--lc-sticker); letter-spacing:.01em; rotate:-3deg; box-shadow:0 18px 30px -18px rgba(58,7,20,.7); }
html[lang="ru"] :where(.chic) .m-nores > span{ font-family:var(--lc-display); letter-spacing:.005em; }   /* Cyrillic label in Yeseva (section 4) */
:where(.chic) .m-nores small{ display:block; font:600 11px/1.4 var(--lc-text); letter-spacing:.14em; text-transform:uppercase; color:var(--lc-fg-2); }
:where(.chic) .m-cafe-side{ display:grid; padding-top:clamp(0px,4vw,70px); }
:where(.chic) .m-media{ position:relative; overflow:hidden; border-radius:220px 220px 28px 28px; aspect-ratio:3/4; background:rgba(35,20,23,.06); }
:where(.chic) .m-media img{ width:100%; height:100%; object-fit:cover; transition:opacity .4s; }
:where(.chic) .m-media.gl-on img{ opacity:0; }
:where(.chic) .m-fig-cap{ display:flex; justify-content:space-between; gap:12px; font:600 11px/1.4 var(--lc-text); letter-spacing:.12em; text-transform:uppercase; margin-top:14px; color:var(--lc-fg-2); }

/* ---- lístek (pinned horizontal, night) ---- */
:where(.chic) .m-lk{ position:relative; color:var(--lc-milk); }
:where(.chic) .m-lk-bulge{ position:absolute; left:0; bottom:100%; width:100%; height:16vh; display:block; fill:var(--lc-night); pointer-events:none; }
:where(.chic) .m-lk-pin{ position:relative; height:100vh; height:100svh; overflow:hidden; }
:where(.chic) .m-lk-track{ position:absolute; left:0; top:0; height:100%; display:flex; align-items:center; gap:clamp(18px,2.2vw,36px); padding:0 var(--lc-pad); will-change:transform; }
:where(.chic) .m-lk-intro{ flex:none; width:min(64vw,960px); padding-right:4vw; }
:where(.chic) .m-lk-title{ margin:.2em 0 0; font:400 clamp(72px,10vw,172px)/.92 var(--lc-sticker); letter-spacing:var(--lc-stk-ls); }
html[lang="ru"] :where(.chic) .m-lk-title{ font-family:var(--lc-display); letter-spacing:-.012em; }   /* "Меню" in Yeseva (section 4) */
:where(.chic) .m-lk-intro p{ max-width:440px; margin-top:22px; font-size:clamp(15px,1.2vw,18px); line-height:1.6; color:rgba(251,246,243,.84); }
:where(.chic) .m-lk-hint{ display:flex; align-items:center; gap:14px; font:600 11px/1 var(--lc-text) !important; letter-spacing:.16em; text-transform:uppercase; }
:where(.chic) .m-lk-hint svg{ width:18px; height:18px; animation:lc-nudge 1.8s var(--lc-ease) infinite; }
@keyframes lc-nudge{ 50%{ transform:translateX(8px); } }
:where(.chic) .m-lk-card{
  flex:none; position:relative; width:clamp(300px,30vw,460px); height:min(76vh,700px); border-radius:30px; padding:22px;
  display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:18px; color:var(--lc-milk);
  box-shadow:inset 0 0 0 1px rgba(251,246,243,.14);
  background:linear-gradient(180deg,rgba(251,246,243,.05),rgba(251,246,243,0));
}
:where(.chic) .m-lk-meta{ display:flex; justify-content:space-between; gap:12px; font:600 11px/1.3 var(--lc-text); letter-spacing:.16em; text-transform:uppercase; color:rgba(251,246,243,.74); }
:where(.chic) .m-lk-sw{ position:relative; border-radius:22px; min-height:0; overflow:hidden; }
:where(.chic) .m-lk-sw::before{ content:""; position:absolute; inset:0; background:var(--sw,linear-gradient(135deg,#5b3121,#e0ae7f)); transition:opacity .5s; }
:where(.chic) .m-lk-sw.gl-on::before{ opacity:0; }
:where(.chic) .m-lk-sw .m-media{ border-radius:inherit; aspect-ratio:auto; height:100%; background:none; }
:where(.chic) .m-lk-card h3{ font:400 clamp(28px,2.5vw,44px)/1.02 var(--lc-display); letter-spacing:-.008em; text-wrap:balance; }
:where(.chic) .m-lk-card h3 em{ color:var(--lc-petal); }
:where(.chic) .m-lk-card p{ margin-top:10px; font:400 15.5px/1.45 var(--lc-text); color:rgba(251,246,243,.8); }
:where(.chic) .m-lk-card.is-ps p{ font:400 15px/1.5 var(--lc-text); }
:where(.chic) .m-lk-outro{ flex:none; width:min(52vw,640px); padding:0 6vw 0 3vw; }
:where(.chic) .m-lk-outro .m-big{ font-size:clamp(40px,5.2vw,92px); }
:where(.chic) .m-lk-outro ul{ margin-top:36px; display:grid; gap:14px; }
:where(.chic) .m-lk-outro li{ display:flex; gap:14px; align-items:baseline; font-size:16px; color:rgba(251,246,243,.88); padding-bottom:14px; border-bottom:1px solid rgba(251,246,243,.14); }
:where(.chic) .m-lk-outro li b{ font:600 11px/1 var(--lc-text); letter-spacing:.14em; color:rgba(251,246,243,.62); }
:where(.chic) .m-lk-progress{ position:absolute; left:var(--lc-pad); right:var(--lc-pad); bottom:clamp(20px,3vw,38px); display:flex; align-items:center; gap:18px; font:600 11px/1 var(--lc-text); letter-spacing:.16em; font-variant-numeric:tabular-nums; }
:where(.chic) .m-lk-bar{ flex:1; height:1px; background:rgba(251,246,243,.2); position:relative; }
:where(.chic) .m-lk-bar i{ position:absolute; inset:0; background:var(--lc-milk); transform-origin:left; transform:scaleX(0); }
:where(.chic) .m-lk :focus-visible{ outline-color:var(--lc-milk); }

/* ---- eventy: stacked cards + two doors ---- */
:where(.chic) .m-ev-intro{ display:grid; grid-template-columns:1.3fr .7fr; gap:40px; align-items:end; margin-bottom:clamp(50px,8vw,120px); }
:where(.chic) .m-ev-intro .lede{ margin:0; }
:where(.chic) .m-stack{ position:relative; }
:where(.chic) .m-scard{
  --top:calc(var(--lc-head-h) + 10px + var(--i) * 14px);
  position:sticky; top:var(--top); height:min(calc(100vh - var(--lc-head-h) - 110px),720px); margin-bottom:clamp(40px,7vh,90px);
  border-radius:36px; overflow:hidden; display:grid; grid-template-columns:1.25fr 1fr; align-items:stretch;
  transform-origin:50% 0; isolation:isolate;
}
:where(.chic) .m-scard:last-child{ margin-bottom:0; }
:where(.chic) .m-scard{ --lc-lacq:var(--lc-lacq-light); }
:where(.chic) .m-sc-body{ position:relative; z-index:2; display:flex; flex-direction:column; justify-content:space-between; gap:24px; padding:clamp(24px,3.6vw,60px); }
:where(.chic) .m-sc-n{ display:flex; gap:16px; align-items:center; font:600 11.5px/1.3 var(--lc-text); letter-spacing:.16em; text-transform:uppercase; }
:where(.chic) .m-sc-n b{ font:400 clamp(52px,5vw,86px)/.8 var(--lc-display); letter-spacing:-.01em; }
:where(.chic) .m-scard h3{ font:400 clamp(44px,6vw,112px)/.95 var(--lc-display); letter-spacing:-.012em; text-wrap:balance; }
:where(.chic) .m-scard h3 em:not(.lacquer):not(.pearl){ color:var(--lc-cherry); }
html[lang="ru"] :where(.chic) .m-scard h3{ font-size:clamp(38px,5vw,92px); }
:where(.chic) .m-scard p{ margin-top:22px; max-width:440px; font-size:clamp(15px,1.2vw,18px); line-height:1.55; }
:where(.chic) .m-sc-tags{ display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
:where(.chic) :is(.sc-1, .sc-2, .sc-6) :is(.m-sc-n, .m-sc-tags span){ text-shadow:0 1px 14px rgba(19,5,9,.45); }   /* light labels over the moving blob */
:where(.chic) .m-sc-tags span{ padding:9px 14px; border-radius:999px; font:600 11px/1 var(--lc-text); letter-spacing:.1em; text-transform:uppercase; box-shadow:inset 0 0 0 1px currentColor; opacity:.86; }
:where(.chic) .m-sc-art{ position:relative; z-index:1; }
/* every occasion card leads to the configurator */
:where(.chic) .m-sc-go{ display:inline-flex; align-items:center; gap:14px; min-height:48px; margin-top:22px; font:600 13.5px/1 var(--lc-text); letter-spacing:.01em; }
:where(.chic) .m-sc-go i{ width:44px; height:44px; flex:none; border-radius:50%; display:grid; place-items:center; background:currentColor; transition:transform .7s var(--lc-ease); }
:where(.chic) .m-sc-go i svg{ width:15px; height:15px; color:var(--sc-paper,#1a070c); }
:where(.chic) .m-sc-go:hover i{ transform:rotate(-45deg); }
:where(.chic) .m-sc-go:focus-visible{ outline-color:currentColor; border-radius:999px; }
:where(.chic) .m-sc-veil{ position:absolute; inset:0; z-index:5; background:#1a070c; opacity:0; pointer-events:none; }
/* light cards sink under a cherry veil (a near-black one turned them flat concrete grey) */
:where(.chic) :is(.sc-3, .sc-4, .sc-5) .m-sc-veil{ background:#6a0d26; }
:where(.chic) .m-blob{
  position:absolute; left:50%; top:50%; width:min(32vw,440px); aspect-ratio:1; margin:calc(min(32vw,440px) / -2) 0 0 calc(min(32vw,440px) / -2);
  border-radius:42% 58% 63% 37% / 41% 44% 56% 59%;
  background:
    radial-gradient(34% 22% at 33% 23%,rgba(255,255,255,.96) 0%,rgba(255,255,255,.5) 40%,rgba(255,255,255,0) 100%),
    radial-gradient(20% 9% at 64% 80%,rgba(255,255,255,.8) 0%,rgba(255,255,255,0) 100%),
    linear-gradient(176deg,var(--b4) 0%,var(--b1) 14%,var(--b2) 33%,var(--b3) 46%,var(--b3) 49%,var(--b2) 57%,var(--b4) 70%,var(--b1) 80%,var(--b2) 90%,var(--b3) 100%);
  background-size:100% 100%,100% 100%,100% 160%;
  box-shadow:inset -30px -40px 70px rgba(0,0,0,.42), inset 26px 30px 50px rgba(255,255,255,.5), inset 0 0 0 1px rgba(255,255,255,.28), 0 70px 110px -50px rgba(0,0,0,.6);
}
:where(.chic) .m-blob::after{
  content:""; position:absolute; right:-9%; bottom:2%; width:21%; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(40% 30% at 35% 28%,#fff,rgba(255,255,255,0) 80%),linear-gradient(176deg,var(--b4),var(--b1) 20%,var(--b2) 45%,var(--b3) 55%,var(--b2) 70%,var(--b1));
  box-shadow:inset -8px -10px 18px rgba(0,0,0,.4), inset 6px 6px 12px rgba(255,255,255,.5), 0 20px 30px -16px rgba(0,0,0,.5);
}
:where(.chic) .m-scard.is-on .m-blob{ animation:lc-morph 9s ease-in-out infinite, lc-bands 7s ease-in-out infinite alternate; }
:where(.chic) .m-scard.is-on .m-blob::after{ animation:lc-drip 6s ease-in-out infinite; }
@keyframes lc-bands{ to{ background-position:0 0,0 0,0 100%; } }
@keyframes lc-drip{ 50%{ transform:translate(-14px,10px) scale(.86); } }
@keyframes lc-morph{
  0%,100%{ border-radius:42% 58% 63% 37% / 41% 44% 56% 59%; }
  33%{ border-radius:58% 42% 45% 55% / 55% 57% 43% 45%; }
  66%{ border-radius:38% 62% 55% 45% / 58% 40% 60% 42%; }
}
/* perf: the stack is scrubbed on every scroll frame (card scale, veil opacity, blob y + scale, main.js
   events()). As own compositor layers they only move; without the hint Chrome re-rastered each whole
   card (and the blurred blob) at every new scale and the commit blocked scrolling for up to 50 ms. */
html:not(.lc-still) :where(.chic) .m-scard, html:not(.lc-still) :where(.chic) .m-blob{ will-change:transform; }
html:not(.lc-still) :where(.chic) .m-sc-veil{ will-change:opacity; }
/* the slow liquid morph repaints the blob every frame; held while Lenis is moving the page (the blob
   rides the scroll then anyway) and resumed from the same frame when it settles. Stops the 16 ms hitches. */
html.lenis-scrolling :where(.chic) .m-scard.is-on .m-blob{ animation-play-state:paused; }
/* the same for the lacquer / pearl shimmer: every shimmer frame re-rasters the letters (the hero's fat Oi
   sticker most of all), and during the hero scroll-out that raster stalled frames past 20 ms. Held while
   Lenis moves the page, resumed from the same frame when it settles. */
html.lenis-scrolling :where(.chic) :is(.lacquer, .pearl){ animation-play-state:paused; }
:where(.chic) .sc-1{ --sc-paper:var(--lc-cherry); background:var(--lc-cherry); color:var(--lc-milk); --b1:#fff; --b2:#f2a7b7; --b3:#4a0717; --b4:#ffd9e1; }
:where(.chic) .sc-2{ --sc-paper:#1a070c; background:#1a070c; color:var(--lc-milk); --b1:#fff; --b2:#a88a92; --b3:#12060a; --b4:#e9dde0; }
:where(.chic) .sc-3{ --sc-paper:var(--lc-milk); background:var(--lc-milk); color:var(--lc-ink); --b1:#fff; --b2:#e3b5bf; --b3:#8c1230; --b4:#fbe6ea; }
:where(.chic) .sc-4{ --sc-paper:#E3BFB7; background:#E3BFB7; color:var(--lc-ink); --b1:#fff; --b2:#e8c89b; --b3:#6e3a1c; --b4:#fff1d9; }
:where(.chic) .sc-5{ --sc-paper:#efe8ea; background:linear-gradient(120deg,#cfc6c9 0%,#f7f2f3 30%,#b4a9ad 52%,#efe8ea 70%,#c9bfc3 100%); color:var(--lc-ink); --b1:#fff; --b2:#9a9094; --b3:#231417; --b4:#f2eef0; }
:where(.chic) .sc-6{ --sc-paper:var(--lc-deep); background:var(--lc-deep); color:var(--lc-milk); --b1:#fff; --b2:#e79aac; --b3:#12020a; --b4:#ffe3e9; }

:where(.chic) .m-doors{ display:flex; gap:16px; height:min(88vh,860px); margin-top:clamp(70px,10vw,150px); }
:where(.chic) .m-door{ position:relative; flex:1; border-radius:36px; overflow:hidden; isolation:isolate; display:flex; flex-direction:column; justify-content:space-between; padding:clamp(22px,3vw,46px); transition:flex 1.1s var(--lc-ease); }
@media (hover:hover) and (min-width:900px){
  :where(.chic) .m-doors:hover .m-door{ flex:.78; }
  :where(.chic) .m-doors .m-door:hover{ flex:1.4; }
}
:where(.chic) .m-door:focus-visible{ outline-offset:5px; border-radius:36px; }
:where(.chic) .m-door-bg{ position:absolute; inset:0; z-index:-1; border-radius:inherit; }
:where(.chic) .m-door-a{ color:var(--lc-milk); }
:where(.chic) .m-door-a::after{ content:""; position:absolute; inset:0; z-index:-1; border-radius:inherit; pointer-events:none; background:linear-gradient(180deg,rgba(19,5,9,.5) 0%,rgba(19,5,9,0) 30%,rgba(19,5,9,0) 42%,rgba(19,5,9,.82) 78%,rgba(19,5,9,.92) 100%); }
:where(.chic) .m-door-a .m-door-bg::before{ content:""; position:absolute; inset:0; border-radius:inherit; background:radial-gradient(80% 60% at 30% 30%,#6d1a31,#1a070c); transition:opacity .6s; }
:where(.chic) .m-door-a .m-door-bg.gl-on::before{ opacity:0; }
:where(.chic) .m-door-a:focus-visible{ outline-color:var(--lc-cherry); }
:where(.chic) .m-door-b{ color:var(--lc-ink); }
:where(.chic) .m-door-b .m-door-bg{ aspect-ratio:auto; }
:where(.chic) .m-door-shade{ position:absolute; inset:0; z-index:-1; border-radius:inherit; background:linear-gradient(180deg,rgba(251,246,243,.92) 0%,rgba(251,246,243,.55) 30%,rgba(251,246,243,0) 52%,rgba(251,246,243,0) 56%,rgba(251,246,243,.92) 100%); pointer-events:none; }
:where(.chic) .m-door-top{ display:flex; justify-content:space-between; gap:12px; font:600 11.5px/1.3 var(--lc-text); letter-spacing:.16em; text-transform:uppercase; }
:where(.chic) .m-door h3{ margin:18px 0 auto; font:400 clamp(52px,6.4vw,124px)/.92 var(--lc-display); letter-spacing:-.015em; }   /* under the top row, on the milky shade - never across the faces in door B's photo */
:where(.chic) .m-door-a h3 em{ color:#FFD9E1; }
:where(.chic) .m-door-b h3 em{ color:var(--lc-cherry); }
:where(.chic) .m-door h3 .ch{ transition:transform .8s var(--lc-ease); transition-delay:calc(var(--c) * 22ms); }
:where(.chic) .m-door:hover h3 .ch{ transform:translateY(-.1em); }
:where(.chic) .m-door-foot{ display:grid; gap:16px; max-width:460px; }
:where(.chic) .m-door-foot p{ font-size:16px; line-height:1.5; }
:where(.chic) .m-door-foot p b{ font-weight:600; font-variant-numeric:lining-nums; }
:where(.chic) .m-door-cta{ display:inline-flex; align-items:center; gap:14px; font:600 14.5px/1 var(--lc-text); }
:where(.chic) .m-door-cta i{ width:56px; height:56px; border-radius:50%; display:grid; place-items:center; background:currentColor; transition:transform .8s var(--lc-ease); }
:where(.chic) .m-door-cta i svg{ width:18px; height:18px; }
:where(.chic) .m-door-a .m-door-cta i svg{ color:#1a070c; }
:where(.chic) .m-door-b .m-door-cta i svg{ color:var(--lc-milk); }
:where(.chic) .m-door:hover .m-door-cta i{ transform:rotate(-45deg) scale(1.08); }
:where(.chic) .m-door-chips{ display:flex; flex-wrap:wrap; gap:8px; }
:where(.chic) .m-door-chips span{ padding:8px 12px; border-radius:999px; font:600 11px/1 var(--lc-text); letter-spacing:.08em; text-transform:uppercase; box-shadow:inset 0 0 0 1px currentColor; opacity:.88; }
:where(.chic) .m-door small{ font:600 11px/1.45 var(--lc-text); letter-spacing:.1em; text-transform:uppercase; opacity:.8; }

/* ---- gift ---- */
:where(.chic) .m-gift-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(30px,6vw,100px); align-items:center; }
:where(.chic) .m-gift-copy .m-big{ margin:18px 0 26px; font-size:clamp(40px,5.2vw,96px); }
html[lang="ru"] :where(.chic) .m-gift-copy .m-big{ font-size:clamp(30px,3.85vw,68px); }   /* "Сертификат нет." is glued by an NBSP */
:where(.chic) .m-gift-copy .lede{ margin-bottom:34px; }
:where(.chic) .m-gift-stage{ position:relative; display:grid; place-items:center; perspective:1100px; min-height:min(70vh,640px); }
:where(.chic) .m-voucher{
  --gx:50%; --gy:30%;
  position:relative; width:min(560px,86vw); aspect-ratio:1.62; border-radius:24px; color:var(--lc-milk); overflow:hidden;
  background:linear-gradient(135deg,#a3183c 0%,#8c1230 40%,#4a0717 100%);
  box-shadow:0 60px 120px -50px rgba(58,7,20,.7), 0 0 0 1px rgba(255,255,255,.08) inset;
  padding:clamp(20px,2.4vw,32px); display:grid; grid-template-rows:auto 1fr auto;
}
:where(.chic) .m-v-holo{ position:absolute; inset:0; pointer-events:none; mix-blend-mode:color-dodge; opacity:.55; background:repeating-linear-gradient(115deg,rgba(255,120,170,0) 0%,rgba(255,170,200,.5) 7%,rgba(170,210,255,.45) 12%,rgba(255,236,190,.5) 17%,rgba(255,120,170,0) 24%); background-size:220% 220%; background-position:var(--gx) var(--gy); }
:where(.chic) .m-v-glare{ position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at var(--gx) var(--gy),rgba(255,255,255,.5),rgba(255,255,255,0) 42%); mix-blend-mode:soft-light; }
:where(.chic) .m-v-top{ position:relative; display:flex; justify-content:space-between; align-items:center; }
:where(.chic) .m-v-top .wm{ font-size:20px; }
:where(.chic) .m-v-chip{ width:44px; height:34px; border-radius:7px; background:linear-gradient(135deg,#f7e7c6,#b89556 45%,#fff2d3 60%,#9c7a3c); box-shadow:inset 0 0 0 1px rgba(0,0,0,.15); }
:where(.chic) .m-v-big{ position:relative; align-self:center; font:400 clamp(28px,2.9vw,44px)/1.02 var(--lc-display); letter-spacing:-.01em; }
:where(.chic) .m-v-big em{ color:#FFD9E1; }
:where(.chic) .m-v-kv{ position:relative; display:flex; gap:40px; font-size:14px; }
:where(.chic) .m-v-kv b{ font-weight:500; }
:where(.chic) .m-v-kv span{ display:block; font:600 10px/1.6 var(--lc-text); letter-spacing:.14em; text-transform:uppercase; opacity:.74; }
:where(.chic) .m-v-stub{ position:absolute; right:clamp(20px,2.4vw,32px); bottom:clamp(20px,2.4vw,32px); font:600 10px/1 var(--lc-text); letter-spacing:.16em; text-transform:uppercase; opacity:.74; }
:where(.chic) .m-v-shadow{ position:absolute; bottom:6%; left:50%; width:60%; height:40px; margin-left:-30%; border-radius:50%; background:rgba(58,7,20,.35); filter:blur(24px); z-index:-1; }

/* ---- visit + contact form (cherry) ---- */
:where(.chic) .m-visit{ color:var(--lc-milk); }
:where(.chic) .m-visit :focus-visible{ outline-color:var(--lc-milk); }
:where(.chic) .m-addr{ font:400 clamp(44px,7.2vw,138px)/.96 var(--lc-display); letter-spacing:-.015em; text-wrap:balance; }
:where(.chic) .m-route{ position:relative; display:block; width:100%; margin:clamp(40px,6vw,90px) 0; padding:10px 0; border-radius:24px; text-align:left; color:var(--lc-milk); }
:where(.chic) .m-route svg{ width:100%; height:auto; overflow:visible; }
:where(.chic) .m-route .st{ stroke:rgba(251,246,243,.35); stroke-width:1; }
:where(.chic) .m-route .walk-bg{ stroke:rgba(251,246,243,.45); stroke-width:2; stroke-dasharray:2 10; stroke-linecap:round; fill:none; }
:where(.chic) .m-route .walk{ stroke:var(--lc-milk); stroke-width:2.5; stroke-dasharray:1 1; stroke-dashoffset:0; stroke-linecap:round; fill:none; }
:where(.chic) .m-route text{ font:600 12px var(--lc-text); letter-spacing:.14em; text-transform:uppercase; fill:rgba(251,246,243,.86); }
:where(.chic) .m-route .big-t{ font:400 40px var(--lc-display); letter-spacing:0; text-transform:none; fill:var(--lc-milk); }
:where(.chic) .m-route-lbl{ display:none; }
:where(.chic) .m-route .m-route-go{ position:absolute; right:0; top:50%; translate:0 -50%; display:inline-flex; align-items:center; gap:12px; padding:10px 12px 10px 18px; border-radius:999px; background:rgba(251,246,243,.14); box-shadow:inset 0 0 0 1px rgba(251,246,243,.3); font:600 11px/1 var(--lc-text); letter-spacing:.14em; text-transform:uppercase; transition:background-color .4s; }
:where(.chic) .m-route .m-route-go i{ width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:var(--lc-milk); color:var(--lc-cherry); transition:transform .7s var(--lc-ease); }
:where(.chic) .m-route .m-route-go svg{ width:14px; height:14px; }
/* narrower screens and the longer Russian labels: the pill goes under the line (it collided with the bunny mark) */
@media (max-width:1300px){ :where(.chic) .m-route .m-route-go{ position:static; translate:none; margin-top:18px; } }
html[lang="ru"] :where(.chic) .m-route .m-route-go{ position:static; translate:none; margin-top:18px; }
/* the scroll cue would sit inside the hero paragraph below ~1180px */
@media (max-width:1180px){ :where(.chic) .m-cue{ display:none; } }
:where(.chic) .m-route:hover .m-route-go{ background:rgba(251,246,243,.24); }
:where(.chic) .m-route:hover .m-route-go i{ transform:rotate(-45deg); }
:where(.chic) .m-visit-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(20px,3vw,44px); border-top:1px solid rgba(251,246,243,.24); padding-top:28px; }
:where(.chic) .m-visit-grid h3{ margin:0 0 14px; font:600 11px/1 var(--lc-text); letter-spacing:.16em; text-transform:uppercase; opacity:.8; }
:where(.chic) .m-visit-grid p{ font-size:16px; line-height:1.6; }
:where(.chic) .m-visit-grid p a{ text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px; text-decoration-color:rgba(251,246,243,.5); transition:text-decoration-color .3s; }
:where(.chic) .m-visit-grid p a:hover{ text-decoration-color:currentColor; }
:where(.chic) .m-visit-grid .lnk{ margin-top:4px; }
:where(.chic) .m-hrs{ display:grid; grid-template-columns:auto 1fr; gap:4px 18px; font-variant-numeric:tabular-nums; }
:where(.chic) .m-hrs .is-today{ font-weight:600; }
:where(.chic) .m-hrs .is-day::before{ content:""; display:inline-block; width:7px; height:7px; margin:0 8px 2px 0; border-radius:50%; background:currentColor; }
:where(.chic) .m-soft{ opacity:.8; }
:where(.chic) .m-visit-quote{ margin:clamp(60px,9vw,140px) 0 0; max-width:1100px; font:400 clamp(28px,3.2vw,54px)/1.14 var(--lc-display); letter-spacing:-.005em; }
:where(.chic) .m-visit-quote em{ color:#FFD9E1; }

:where(.chic) .m-lead{ display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:40px clamp(40px,6vw,96px); align-items:start; margin-top:clamp(84px,10vw,150px); padding-top:clamp(40px,4vw,56px); border-top:1px solid rgba(251,246,243,.24); scroll-margin-top:calc(var(--lc-head-h) + 10px); }
:where(.chic) .m-lead-copy{ position:sticky; top:calc(var(--lc-head-h) + 32px); }
:where(.chic) .m-lead-copy .m-big{ margin:18px 0 24px; font-size:clamp(36px,3.7vw,66px); }
:where(.chic) .m-lead-copy .m-big em{ color:var(--lc-petal); }
:where(.chic) .m-lead-copy .lede{ color:rgba(251,246,243,.88); }
:where(.chic) .m-lead-sheet :focus-visible{ outline-color:var(--lc-cherry); }
:where(.chic) .m-form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px 18px; }
:where(.chic) .m-f-full{ grid-column:1/-1; }
:where(.chic) .m-form-act{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 26px; margin-top:26px; }
:where(.chic) .m-form-note{ margin-top:14px; font-size:13.5px; line-height:1.5; color:var(--lc-ink-2); }
:where(.chic) .m-form-ok{ display:grid; justify-items:start; gap:14px; padding:12px 0; }
:where(.chic) .m-form-ok:focus{ outline:none; }
:where(.chic) .m-form-ok .mk{ width:44px; height:52px; --mk-fruit:var(--lc-cherry); color:var(--lc-ink); }
:where(.chic) .m-form-ok h3{ font:400 clamp(34px,3.4vw,50px)/1.02 var(--lc-display); letter-spacing:-.01em; }
:where(.chic) .m-form-ok h3 em{ color:var(--lc-cherry); }
:where(.chic) .m-form-ok p{ color:var(--lc-ink-2); max-width:30em; font-size:17px; }
:where(.chic) .m-petal{ position:fixed; z-index:360; width:12px; height:16px; border-radius:80% 0 80% 0; pointer-events:none; }

/* ============================================================
   12. FOOTER (night silk + liquid chrome wordmark)
   ============================================================ */
:where(.chic).site-footer{ position:relative; color:var(--lc-milk); padding:0 var(--lc-pad) 28px; min-height:100vh; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; }
:where(.chic) .sf-silk{ position:absolute; left:0; right:0; top:0; height:100%; }
:where(.chic) .sf-silk::before{ content:""; position:absolute; inset:0; background:radial-gradient(90% 70% at 50% 30%,#4b0e1e,#130509); transition:opacity .6s; }
:where(.chic) .sf-silk.gl-on::before{ opacity:0; }
:where(.chic).site-footer::before{ content:""; position:absolute; left:0; right:0; bottom:0; height:64%; pointer-events:none; background:linear-gradient(180deg,rgba(19,5,9,0) 0%,rgba(19,5,9,.74) 55%,rgba(19,5,9,.92) 100%); }
:where(.chic) .sf-in{ position:relative; }
:where(.chic).site-footer :focus-visible{ outline-color:var(--lc-milk); }
:where(.chic) .sf-line{ margin:0 0 10px; text-align:center; font:600 11.5px/1.4 var(--lc-text); letter-spacing:.2em; text-transform:uppercase; }
:where(.chic) .sf-word{ margin:0 -1vw; text-align:center; white-space:nowrap; font:400 clamp(36px,11.4vw,220px)/1.16 var(--lc-display); letter-spacing:-.012em; color:var(--lc-milk); }
:where(.chic) .sf-word.gl-on{ color:transparent; }
/* the fat chrome Oi letters of "Cherry" touched (the C read as a G): a little air, in the footer only
   (gl.js paints every run of the wordmark with its own letter-spacing) */
:where(.chic) .sf-word em{ letter-spacing:calc(var(--lc-stk-ls) + .045em); }
:where(.chic) .sf-cross{ display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin:16px 0 34px; }
:where(.chic) .sf-door{ display:inline-flex; align-items:center; gap:14px; min-height:52px; padding:0 10px 0 22px; border-radius:999px; background:rgba(251,246,243,.08); box-shadow:inset 0 0 0 1px rgba(251,246,243,.24); font:400 clamp(18px,1.5vw,22px)/1 var(--lc-display); letter-spacing:0; -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); transition:background-color .4s; }
:where(.chic) .sf-door em{ color:var(--lc-petal); }
:where(.chic) .sf-door i{ width:36px; height:36px; border-radius:50%; display:grid; place-items:center; background:var(--lc-milk); color:var(--lc-night); transition:transform .7s var(--lc-ease); }
:where(.chic) .sf-door svg{ width:15px; height:15px; }
:where(.chic) .sf-door:hover{ background:rgba(251,246,243,.16); }
:where(.chic) .sf-door:hover i{ transform:rotate(-45deg); }
:where(.chic) .sf-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:28px; padding-top:34px; border-top:1px solid rgba(251,246,243,.2); }
:where(.chic) .sf-grid h3{ margin:0 0 12px; font:600 11px/1 var(--lc-text); letter-spacing:.16em; text-transform:uppercase; opacity:.7; }
:where(.chic) .sf-grid :where(a,p){ display:block; margin:0 0 6px; font-size:15px; line-height:1.6; }
:where(.chic) .sf-grid a{ width:fit-content; }
:where(.chic) .sf-grid a:hover{ text-decoration:underline; text-underline-offset:4px; }
:where(.chic) .sf-legal{ display:flex; justify-content:space-between; gap:10px 20px; flex-wrap:wrap; margin-top:34px; font:600 10.5px/1.6 var(--lc-text); letter-spacing:.12em; text-transform:uppercase; opacity:.7; }

/* ============================================================
   13. REVEAL (core toggles .reveal -> .in; used by the adult events view)
   ============================================================ */
:where(.chic) .reveal{ opacity:0; transform:translateY(28px); transition:opacity 1.2s var(--lc-ease), transform 1.2s var(--lc-ease); }
:where(.chic) .reveal.in{ opacity:1; transform:none; }

/* ============================================================
   14. RESPONSIVE
   ============================================================ */
@media (max-width:1100px){
  :where(.chic) .sh-nav, :where(.chic) .sh-lang, :where(.chic) .sh-cta{ display:none; }
  :where(.chic) .sh-menu{ display:block; }
  :where(.chic) .m-cafe-grid, :where(.chic) .m-gift-grid, :where(.chic) .m-ev-intro, :where(.chic) .m-lead, :where(.chic) .sec-intro{ grid-template-columns:minmax(0,1fr); }
  :where(.chic) .m-cafe-copy{ grid-template-columns:minmax(0,1fr); }
  :where(.chic) .m-visit-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  :where(.chic) .sf-grid{ grid-template-columns:1fr 1fr; }
  :where(.chic) .m-lead-copy{ position:static; }
}
@media (max-width:760px){
  :root{ --lc-head-h:68px; }
  :where(.chic) .wm{ font-size:20px; }
  :where(.chic) .sh-brand .mk{ width:24px; height:30px; }
  :where(.chic) .m-hero-in{ padding-top:calc(var(--lc-head-h) + 14px); }
  :where(.chic) .m-hero-top{ flex-direction:column; align-items:flex-start; gap:12px; }
  :where(.chic) .m-h1{ font-size:clamp(42px,12vw,72px); line-height:.96; letter-spacing:-.012em; }
  html[lang="ru"] :where(.chic) .m-h1{ font-size:clamp(36px,10.2vw,58px); }
  :where(.chic) .m-big, :where(.chic) .m-statement{ font-size:clamp(34px,9.6vw,44px); }
  html[lang="ru"] :where(.chic) .m-big, html[lang="ru"] :where(.chic) .m-statement, html[lang="ru"] :where(.chic) .m-gift-copy .m-big{ font-size:8vw; }
  :where(.chic) .m-addr{ font-size:10.4vw; }
  html[lang="en"] :where(.chic) .m-addr{ font-size:9.2vw; }   /* "Three minutes" stays one line (nowrap) */
  :where(.chic) .m-h1 .l2{ padding-left:0; }
  :where(.chic) .m-hero-bot{ grid-template-columns:minmax(0,1fr); gap:22px; }
  :where(.chic) .m-ctas{ flex-wrap:wrap; gap:14px 22px; }
  :where(.chic) .m-badge, :where(.chic) .m-cue{ display:none; }
  :where(.chic) .m-deck{ font-size:15px; }
  :where(.chic) .m-media{ border-radius:160px 160px 22px 22px; }
  :where(.chic) .m-lk-intro{ width:86vw; padding-right:0; }
  :where(.chic) .m-lk-title{ font-size:16vw; }
  html[lang="ru"] :where(.chic) .m-lk-title{ font-size:16vw; }
  :where(.chic) .m-lk-card{ width:78vw; height:min(68vh,560px); padding:16px; border-radius:24px; }
  :where(.chic) .m-lk-outro{ width:84vw; padding:0 8vw 0 2vw; }
  :where(.chic) .m-scard{ grid-template-columns:minmax(0,1fr); grid-template-rows:1fr auto; height:min(calc(100vh - var(--lc-head-h) - 60px),640px); border-radius:28px; }
  :where(.chic) .m-scard h3{ font-size:clamp(34px,10vw,54px); }
  html[lang="ru"] :where(.chic) .m-scard h3{ font-size:clamp(28px,8.4vw,48px); }
  :where(.chic) .m-sc-art{ position:absolute; inset:0; opacity:.9; }
  /* the sphere starts under the eyebrow (its bottom ~66 px; the scrub ends at y -40) and is sized to the band
     left above the title: at top 30 % it sat on the eyebrow and the white "02 · pro nevěsty i ženichy" ran
     onto the silver sphere */
  :where(.chic) .m-blob{ --bs:clamp(130px,min(58vw,100vh - var(--lc-head-h) - 482px),222px); width:var(--bs); margin:0 0 0 calc(var(--bs) / -2); left:72%; top:118px; }
  :where(.chic) .m-sc-body{ justify-content:flex-end; gap:18px; }
  :where(.chic) .m-sc-n{ position:absolute; top:24px; left:24px; right:24px; }
  :where(.chic) .m-scard p{ margin-top:14px; }
  :where(.chic) .m-doors{ flex-direction:column; height:auto; }
  :where(.chic) .m-door{ min-height:78vh; }
  /* phones: the door title sits under the top row, on the milky shade, not over the faces in the photo */
  :where(.chic) .m-door h3{ margin-bottom:auto; }
  :where(.chic) .m-door-shade{ background:linear-gradient(180deg,rgba(251,246,243,.94) 0%,rgba(251,246,243,.74) 30%,rgba(251,246,243,0) 48%,rgba(251,246,243,0) 56%,rgba(251,246,243,.94) 100%); }
  :where(.chic) .ch-in{ padding-top:12px; }
  :where(.chic) .ch-opts{ flex-direction:column; gap:12px; }
  :where(.chic) .ch-opt{ min-height:0; flex:none; }
  :where(.chic) .ch-title{ font-size:11vw; margin:6px 0 16px; }
  html[lang="ru"] :where(.chic) .ch-title{ font-size:9.6vw; }   /* Yeseva "празднуем" is narrower than the Oi one was: a little more size, still one line at 360 */
  :where(.chic) .ch-sub{ display:none; }
  :where(.chic) .ch-name{ font-size:10.4vw; margin-top:34px; }
  :where(.chic) .ch-d{ font-size:14px; margin-top:8px; }
  :where(.chic) .ch-go{ margin-top:10px; }
  :where(.chic) .ch-go i{ width:50px; height:50px; }
  :where(.chic) .m-visit-grid, :where(.chic) .sf-grid{ grid-template-columns:minmax(0,1fr); }
  /* the walk label ends before the bunny mark (x 812): anchored at its end, it grows to the left */
  :where(.chic) .m-route .big-t{ font-size:52px; text-anchor:end; transform:translateX(376px); }
  :where(.chic) .m-route text{ font-size:20px; }
  /* the map is drawn at ~0.36 of its size here: the micro labels move out of the SVG, in readable type */
  :where(.chic) .m-route text:not(.big-t){ display:none; }
  :where(.chic) .m-route-lbl{ display:flex; justify-content:space-between; gap:10px; margin-top:6px; font:600 11px/1.3 var(--lc-text); letter-spacing:.12em; text-transform:uppercase; color:rgba(251,246,243,.86); }
  :where(.chic) .m-route-lbl b{ display:inline-grid; place-items:center; width:18px; height:18px; margin-right:6px; border-radius:50%; box-shadow:inset 0 0 0 1px currentColor; font-size:10px; letter-spacing:0; vertical-align:-4px; }
  :where(.chic) .m-route .m-route-go{ position:static; translate:none; margin-top:18px; }
  :where(.chic).site-footer{ min-height:auto; padding-top:64vh; }
  :where(.chic) .m-v-kv{ gap:22px; }
  :where(.chic) .m-v-stub{ display:none; }
  :where(.chic) .m-gift-stage{ min-height:0; padding:30px 0; }
  :where(.chic) .m-form-grid{ grid-template-columns:minmax(0,1fr); }
  :where(.chic) .inv-card{ padding:26px 22px 22px; border-radius:24px; }
  :where(.chic) .sheet{ border-radius:24px; padding:24px 18px; }
  :where(.chic) .stepper{ gap:16px; }
  :where(.chic) .sec-head{ gap:12px; }
  :where(.chic) .m-head{ flex-wrap:wrap; gap:10px 14px; }
  :where(.chic) .m-head .rule-l{ order:3; flex-basis:100%; }
  :where(.chic) .m-head .m-head-note{ order:2; margin-left:auto; text-align:right; }
  :where(.chic) .sec-note{ display:none; }
}
/* phones and touch screens: every text link of the chrome is a 44 px target (SPEC 10) */
@media (max-width:760px), (pointer:coarse){
  :where(.chic) .sf-grid a{ display:flex; align-items:center; min-height:44px; margin:0; }
  :where(.chic) .m-visit-grid p a{ display:inline-flex; align-items:center; min-height:44px; }
  :where(.chic) .ch-foot a{ display:inline-flex; align-items:center; min-height:44px; padding:0 4px; }
}
@media (max-width:400px){
  :where(.chic) .btn{ padding:0 22px; }
  :where(.chic) .btn-chrome{ padding:0 24px; }
}

/* ============================================================
   15. STILL MODE: reduced motion (html.lc-still is set before paint) or no motion libraries
   ============================================================ */
@media (prefers-reduced-motion:reduce){
  :where(.chic) *, :where(.chic) *::before, :where(.chic) *::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  :where(.chic) .lacquer, :where(.chic) .pearl{ background-position:0 30%; }
  :where(.chic) .reveal{ opacity:1; transform:none; }
}
html.lc-still :where(.chic) .m-lk-bulge{ display:none; }
html.lc-still :where(.chic) .m-lk-pin{ height:auto; overflow:visible; padding:clamp(80px,10vw,140px) 0; }
html.lc-still :where(.chic) .m-lk-track{ position:relative; display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr)); align-items:stretch; }
html.lc-still :where(.chic) .m-lk-intro, html.lc-still :where(.chic) .m-lk-outro{ grid-column:1/-1; width:auto; padding:0 0 24px; }
html.lc-still :where(.chic) .m-lk-card{ width:auto; height:auto; min-height:520px; }
html.lc-still :where(.chic) .m-lk-hint, html.lc-still :where(.chic) .m-lk-progress{ display:none; }
html.lc-still :where(.chic) .m-cue{ display:none; }

/* ============================================================
   16. PRINT (everything except the quote printing, which core handles)
   ============================================================ */
@media print{
  .site-header, .site-footer, #lc-mnav, .m-marq, #lc-gl, .lc-cursor, .lc-pre, .lc-wipe{ display:none !important; }
  :where(.chic) .reveal{ opacity:1 !important; transform:none !important; }
}