/* ════════════════════════════════════════════════════════
   AMAVI VOYAGE — ДИЗАЙН-ТОКЕНЫ (канон)
   Источник правды: DESIGN-SYSTEM.md. Менять только парой.
   Подключается ПЕРВЫМ на каждой странице сайта.
════════════════════════════════════════════════════════ */
:root{
  /* ── цвета ── */
  --ink:#060606;
  --ivory:#f2ede6;
  --gold:#c9a96e;
  --gold-press:#b8945a;
  --gold-dim:rgba(201,169,110,.55);
  --gold-faint:rgba(201,169,110,.3);
  --ivory-60:rgba(242,237,230,.6);
  --ivory-45:rgba(242,237,230,.45);
  --ivory-28:rgba(242,237,230,.28);
  --line:rgba(242,237,230,.08);

  /* ── шрифты ── */
  --f-display:'Cormorant Garamond',serif;  /* 300, italic — заголовки/цифры/цены */
  --f-ui:'Inter',sans-serif;               /* 200/300/400 — всё остальное */

  /* ── типошкала ── */
  --t-hero:clamp(64px,10.5vw,168px);   /* lh .88, ls -.015em */
  --t-h1:clamp(44px,6.4vw,96px);       /* lh .93 */
  --t-h2:clamp(40px,5vw,74px);         /* lh .95 */
  --t-h3:clamp(28px,2.6vw,44px);       /* lh 1.0 */
  --t-mani:clamp(30px,4.6vw,64px);     /* lh 1.32 */
  --t-body:13.5px;                     /* lh 2, Inter 300 */
  --t-sub:12.5px;                      /* lh 2 */
  --t-btn:11px;                        /* ls .24em, UPPER, Inter 400 */
  --t-label:10px;                      /* ls .3em, UPPER */
  --t-kicker:10px;                     /* ls .4em, UPPER, gold */
  --t-micro:9px;                       /* ls .24em, UPPER */

  /* ── движение ── */
  --ease:cubic-bezier(.16,1,.3,1);
  --dur-reveal:1.1s;
  --dur-hover:.4s;

  /* ── сетка ── */
  --gutter:52px;
}
@media(max-width:820px){
  :root{ --gutter:24px; }
}

/* ── ДОСТУПНОСТЬ (канон, едина на весь сайт) ── */
/* видимый фокус для клавиатуры (при cursor:none иначе не видно где ты) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
[onclick]:focus-visible,[role="button"]:focus-visible,.btn:focus-visible{
  outline:2px solid var(--gold);outline-offset:3px;
}
/* тактильная отдача на клик — едино на все кнопки */
.btn:active,.w-btn:active,.f-btn:active,.world-cta:active,.x-btn:active{transform:translateY(0) scale(.985);}
/* уважение к настройке «меньше движения» */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important;}
}

/* ── базовые классы-эталоны ── */
.x-hero{font-family:var(--f-display);font-weight:300;font-size:var(--t-hero);line-height:.88;letter-spacing:-.015em;}
.x-h1{font-family:var(--f-display);font-weight:300;font-size:var(--t-h1);line-height:.93;}
.x-h2{font-family:var(--f-display);font-weight:300;font-size:var(--t-h2);line-height:.95;}
.x-h3{font-family:var(--f-display);font-weight:300;font-size:var(--t-h3);line-height:1;}
.x-hero em,.x-h1 em,.x-h2 em,.x-h3 em{font-style:italic;color:var(--ivory-60);}
.x-body{font-family:var(--f-ui);font-weight:300;font-size:var(--t-body);line-height:1.65;color:var(--ivory-60);}
.x-label{font-family:var(--f-ui);font-weight:300;font-size:var(--t-label);letter-spacing:.3em;text-transform:uppercase;}
.x-kicker{display:flex;align-items:center;gap:14px;font-family:var(--f-ui);font-size:var(--t-kicker);letter-spacing:.4em;text-transform:uppercase;color:var(--gold);}
.x-kicker::before{content:'';width:46px;height:1px;background:var(--gold);}
.x-micro{font-family:var(--f-ui);font-size:var(--t-micro);letter-spacing:.24em;text-transform:uppercase;color:var(--ivory-28);}
.x-btn{display:inline-flex;align-items:center;gap:14px;padding:19px 46px;background:var(--gold);color:var(--ink);
  font-family:var(--f-ui);font-weight:400;font-size:var(--t-btn);letter-spacing:.24em;text-transform:uppercase;cursor:pointer;}
