/* Hermes UI — общий визуальный слой витрины (дизайн-аудит 09.10.2026).
   Подключается ПОСЛЕДНИМ в <head> каждой страницы (RU-исходники, их EN/HE-копии, /e/*, 404).
   Стили страниц отвечают за раскладку; здесь — то, что обязано быть одинаковым везде:
   токены, шрифт в кнопках и полях, фокус с клавиатуры, состояния кнопок, иврит/RTL,
   reduced-motion. Правило: новые общие вещи добавлять сюда, а не копировать по страницам. */

:root{
  color-scheme:dark; /* системные части форм (выпадающие списки, скроллбар, чекбоксы) — тёмные */
  --hx-gold:#E9B94D; --hx-gold-hi:#F6D992; --hx-gold-lo:#C9922E; --hx-on-gold:#0A0810;
  --hx-grad:linear-gradient(135deg,#F6D992 0%,#E9B94D 52%,#C9922E 100%);
  --hx-ink:#F4F6FB; --hx-mut:#A9B3C9;
  --hx-ring:0 0 0 3px rgba(233,185,77,.22);
  --hx-ease:cubic-bezier(.2,.7,.2,1);
}

html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent}
::selection{background:rgba(233,185,77,.32);color:#fff}

/* Кнопки и поля не наследуют шрифт сами — без этого «Купить», «Продолжить», поля email
   рисовались системным Arial посреди Manrope (43 кнопки на странице страны). */
button,input,select,textarea{font-family:inherit}
input,select,textarea{accent-color:var(--hx-gold)}
::placeholder{color:rgba(169,179,201,.62);opacity:1}

/* ---------- кнопки: ВСЕ золотые и «горят» (10.10.2026) ----------
   Главная и вторичные (.ghost — «Подарить eSIM», «На главную», «Все страны» и т.п.) выглядят одинаково:
   золотой градиент, тёмный текст, мягкое свечение. Раньше вторичные были прозрачными и терялись на тёмном фоне. */
.btn{text-align:center;touch-action:manipulation;-webkit-user-select:none;user-select:none;
  box-shadow:inset 0 1px 0 rgba(255,246,220,.55),inset 0 0 0 1px rgba(246,217,146,.35),0 8px 26px -6px rgba(233,185,77,.42);
  transition:transform .25s var(--hx-ease),box-shadow .25s,filter .2s}
.btn,.btn.ghost{background-image:var(--hx-grad)!important;background-color:var(--hx-gold)!important;color:var(--hx-on-gold)!important;border:0!important}
.btn.ghost::before{color:inherit}
.btn:hover,.btn.ghost:hover{filter:brightness(1.06) saturate(1.05);
  box-shadow:inset 0 1px 0 rgba(255,246,220,.6),inset 0 0 0 1px rgba(246,217,146,.45),0 12px 34px -6px rgba(233,185,77,.6)!important}
.btn:active{transform:translateY(0) scale(.98)!important;filter:brightness(.97)}
.btn:disabled,.btn[aria-disabled=true]{opacity:.55;cursor:progress;transform:none!important;box-shadow:none!important;filter:grayscale(.2)}
.btn .hi{color:inherit}

/* текстовые ссылки рядом с кнопками (под кнопками героя и т.п.) — золотом */
.hx-tlink,.hx-tlink:visited{color:var(--hx-gold)!important;text-decoration:none;border-bottom:1px solid rgba(233,185,77,.45)!important}
.hx-tlink:hover{color:var(--hx-gold-hi)!important;border-bottom-color:var(--hx-gold-hi)!important}

/* ---------- фокус с клавиатуры: видимое золотое кольцо везде ---------- */
:where(a,button,summary,[role=button],[tabindex],.chip,.icard):focus-visible{outline:2px solid var(--hx-gold);outline-offset:3px}
:where(input[type=checkbox],input[type=radio]):focus-visible{outline:2px solid var(--hx-gold);outline-offset:2px}
:where(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea):focus-visible{
  border-color:var(--hx-gold)!important;box-shadow:var(--hx-ring);outline:none}

/* ---------- касание: переключатель языка не меньше 32×32 (было 30×25) ---------- */
.lang-sw a[href]{display:inline-flex;align-items:center;justify-content:center;min-height:32px;min-width:32px}

/* ---------- цифры в ценах не «прыгают» при смене тарифа ---------- */
.p,.pr,.daysval,.daysout,td.p,.fr b,.grid small{font-variant-numeric:tabular-nums}

/* ---------- иврит ---------- */
/* у иврита нет прописных: разрядка «к и к к е р а» рвёт слова на буквы */
[dir=rtl] :is(.kicker,.sec-kick,.only,.badge,.hd,.nb,.tp,h4,th),[dir=rtl] .hero .kicker{letter-spacing:0!important}
/* строка тарифа «1 GB · 7 ימים»: без изоляции цифры склеивались — «GB7 ימים» */
[dir=rtl] .prow>span:first-child{display:inline-flex;align-items:baseline;gap:.28em}
[dir=rtl] .prow .gbn{order:2}
[dir=rtl] .prow [data-i18n=gb]{order:1}
[dir=rtl] .prow .d{order:3;margin:0 .45em 0 0}

/* ---------- меньше движения — по настройке системы ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1!important;transform:none!important;filter:none!important}
}

/* ================= общая шапка и подвал (tools/site-chrome.mjs) ================= */
html{scroll-padding-top:76px}
header.hx-hdr{position:sticky!important;top:0;left:auto;right:auto;z-index:60!important;margin:0;padding:0;width:auto;
  background:rgba(6,5,7,.8)!important;-webkit-backdrop-filter:blur(18px) saturate(1.2);backdrop-filter:blur(18px) saturate(1.2);
  border-bottom:1px solid rgba(233,185,77,.14)!important;transition:background .25s,border-color .25s}
header.hx-hdr.hx-scrolled{background:rgba(6,5,7,.92)!important;border-bottom-color:rgba(233,185,77,.22)!important}
.hx-hdr .hx-in,.hx-ftr .hx-in{box-sizing:border-box;width:100%;max-width:min(1500px,94vw);margin:0 auto;padding:0 28px}
.hx-hdr .hx-in{display:flex;align-items:center;gap:14px;min-height:66px}
.hx-logo{display:inline-flex;align-items:center;gap:10px;color:var(--hx-ink)!important;text-decoration:none!important;white-space:nowrap;
  font-family:'Unbounded',sans-serif;font-weight:700;font-size:15px;letter-spacing:.03em;line-height:1}
.hx-hdr .hx-logo{margin-inline-end:auto}
.hx-logo b{font-weight:700;color:inherit}
.hx-mark{flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;
  background:conic-gradient(from 210deg,#C9922E,#E9B94D,#F6D992,#C9922E);box-shadow:0 0 22px rgba(233,185,77,.32)}
.hx-nav{display:flex;align-items:center;gap:2px;position:static}
.hx-nav a{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:8px 13px;border-radius:999px;white-space:nowrap;
  color:#CDD3E1!important;font-size:14px;font-weight:600;line-height:1.1;text-decoration:none!important;transition:color .2s,background-color .2s}
.hx-nav a:hover{color:#fff!important;background:rgba(233,185,77,.09)}
.hx-nav a[aria-current]{color:var(--hx-gold)!important}
.hx-nav a.hx-acc{margin-inline-start:8px;padding:9px 18px;color:var(--hx-on-gold)!important;background-image:var(--hx-grad);
  box-shadow:inset 0 1px 0 rgba(255,246,220,.55),0 8px 24px -6px rgba(233,185,77,.5);transition:filter .2s,box-shadow .25s,transform .2s}
.hx-nav a.hx-acc:hover{filter:brightness(1.06);box-shadow:inset 0 1px 0 rgba(255,246,220,.6),0 12px 30px -6px rgba(233,185,77,.65)}
.hx-nav a.hx-acc:active{transform:scale(.98)}
.hx-ic{width:17px;height:17px;flex:none}
.hx-hdr .lang-sw{flex:none}
.hx-burger{display:none}
.hx-scrim{position:fixed;inset:0;z-index:59;background:rgba(3,2,5,.62);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.hx-scrim[hidden]{display:none}

@media (max-width:980px){
  .hx-hdr .hx-in{padding:0 16px;gap:10px;min-height:60px}
  .hx-burger{display:inline-grid;place-content:center;gap:4px;flex:none;width:44px;height:44px;padding:0;margin:0;cursor:pointer;
    border-radius:12px;border:1px solid rgba(233,185,77,.4);background:rgba(233,185,77,.1);color:var(--hx-gold)}
  .hx-burger i{display:block;width:18px;height:2px;border-radius:2px;background:currentColor;transition:transform .25s var(--hx-ease),opacity .2s}
  .hx-open .hx-burger i:nth-child(1){transform:translateY(6px) rotate(45deg)}
  .hx-open .hx-burger i:nth-child(2){opacity:0}
  .hx-open .hx-burger i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
  .hx-nav{position:absolute;top:100%;left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;
    padding:8px 16px 20px;background:#0A0810;border-bottom:1px solid rgba(233,185,77,.22);box-shadow:0 28px 50px rgba(0,0,0,.65);
    max-height:calc(100vh - 60px);max-height:calc(100dvh - 60px);overflow-y:auto;overscroll-behavior:contain}
  .hx-open .hx-nav{display:flex}
  .hx-nav a{min-height:54px;padding:14px 6px;border-radius:0;font-size:16.5px;border-bottom:1px solid rgba(148,163,199,.1)}
  .hx-nav a:hover{background:none}
  .hx-nav a.hx-acc{justify-content:center;margin:16px 0 0;border-radius:999px;border:0;font-size:16px}
}
@media (max-width:420px){
  .hx-logo{font-size:13px;gap:8px}
  .hx-mark{width:31px;height:31px;border-radius:9px}
  .hx-hdr .lang-sw a{padding:6px 7px!important;min-width:30px}
}
@media (max-width:340px){.hx-hdr .hx-name{display:none}}

footer.hx-ftr{position:relative;z-index:3;display:block;margin:72px 0 0;padding:54px 0 0;text-align:start;
  border-top:1px solid rgba(233,185,77,.16);background:linear-gradient(180deg,rgba(10,8,16,.55),#060507 70%);
  color:var(--hx-mut);font-size:14px;line-height:1.5}
.hx-fgrid{display:grid;grid-template-columns:1.5fr repeat(4,minmax(0,1fr));gap:32px}
.hx-ftr .hx-fh{margin:0 0 12px;padding:0;font-family:'Unbounded',sans-serif;font-size:12.5px;font-weight:600;letter-spacing:.03em;color:var(--hx-ink)}
.hx-ftr .hx-in a{display:block;width:fit-content;max-width:100%;padding:6px 0;margin:0;color:var(--hx-mut)!important;font-size:14px;text-decoration:none!important;transition:color .2s}
.hx-ftr .hx-in a:hover{color:var(--hx-gold)!important}
.hx-ftr .hx-in a.hx-more{color:var(--hx-gold)!important;font-weight:600}
.hx-ftr .hx-in a.hx-logo{display:inline-flex;width:auto;padding:0;color:var(--hx-ink)!important}
.hx-ftr .hx-tag{margin:16px 0 0;max-width:300px;font-size:13.5px;line-height:1.65;color:var(--hx-mut)}
.hx-pays{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.hx-pays span{border:1px solid rgba(148,163,199,.2);border-radius:7px;padding:4px 9px;font-size:11.5px;font-weight:600;color:#C6CEDF}
.hx-note{display:block;margin-top:6px;font-size:12.5px;line-height:1.5}
.hx-fbot{margin-top:38px;padding:18px 0 4px;border-top:1px solid rgba(148,163,199,.12);display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;font-size:12.5px}
[dir=rtl] .hx-ftr .hx-in a[dir=ltr]{text-align:right}
@media (max-width:980px){
  .hx-ftr .hx-in{padding:0 16px}
  .hx-fgrid{grid-template-columns:1fr 1fr;gap:30px 20px}
  .hx-fbrand{grid-column:1/-1}
  footer.hx-ftr{margin-top:56px;padding-top:42px}
}
/* внутри мини-приложения Telegram: шапка та же, подвал без логотипа и платёжных значков */
.tg-wa .hx-fbrand{display:none}

/* кнопки-цены «Израиль $1.99/день» на главной — тоже золотые; выбранный фильтр — золотая заливка */
.chipbtn{background-image:var(--hx-grad)!important;background-color:var(--hx-gold)!important;color:var(--hx-on-gold)!important;border:0!important;font-weight:700;
  box-shadow:inset 0 1px 0 rgba(255,246,220,.55),0 8px 22px -8px rgba(233,185,77,.5);transition:filter .2s,box-shadow .25s,transform .2s}
.chipbtn b,.chipbtn b *{color:var(--hx-on-gold)!important}
.chipbtn:hover{filter:brightness(1.06);box-shadow:inset 0 1px 0 rgba(255,246,220,.6),0 12px 28px -8px rgba(233,185,77,.65)}
.chipbtn:active{transform:scale(.98)}
.chip.on{background-image:var(--hx-grad)!important;color:var(--hx-on-gold)!important;border-color:transparent!important;font-weight:700}
.hx-ftr .hx-in .lang-sw a{display:inline-flex;width:auto;padding:7px 11px;color:var(--hx-mut)!important}
.hx-ftr .hx-in .lang-sw a.on{color:var(--hx-gold)!important}
/* фильтры страницы страны: невыбранные — золотой контур, чтобы читались как кнопки */
.chip:not(.on){border-color:rgba(233,185,77,.42)!important;color:#EBD49B!important}
.chip:not(.on):hover{border-color:var(--hx-gold)!important;color:#fff!important}

/* опасное действие (удаление данных) — тихая кнопка, не золотая */
.btn.btn-danger-quiet,.btn.btn-danger-quiet:hover{background:transparent!important;border:1px solid rgba(255,107,107,.35)!important;color:#FF8A8A!important;box-shadow:none!important;-webkit-text-fill-color:#FF8A8A!important}
