/* ═══ ДИЗАЙН-ТОКЕНИ (ідентичні сайту клініки) ═══ */
:root, [data-theme="dark"] {
  --bg:#0d1117; --surface:#161b24; --surface-2:#1e2530; --surface-3:#252d38;
  --border:rgba(148,163,184,.12); --border-strong:rgba(148,163,184,.20);
  --text:#e2e8f0; --text-muted:#8b98a8; --text-faint:#4a5568;
  --primary:#00bfbf; --primary-dark:#00a0a0;
  --primary-glow:rgba(0,191,191,.15); --primary-glow-2:rgba(0,191,191,.06);
  --gold:#e8a838; --gold-bg:rgba(232,168,56,.12);
  --success:#4ade80; --success-bg:rgba(74,222,128,.1);
  --danger:#f87171; --danger-bg:rgba(248,113,113,.1);
  --shadow-sm:0 1px 3px rgba(0,0,0,.2); --shadow-md:0 4px 16px rgba(0,0,0,.3);
  --shadow-lg:0 12px 40px rgba(0,0,0,.4); --shadow-xl:0 24px 64px rgba(0,0,0,.5);
  --radius-sm:8px; --radius-md:12px; --radius-lg:16px; --radius-xl:20px; --radius-full:9999px;
}
[data-theme="light"] {
  --bg:#f8fafc; --surface:#ffffff; --surface-2:#f1f5f9; --surface-3:#e8eef4;
  --border:rgba(15,23,42,.09); --border-strong:rgba(15,23,42,.15);
  --text:#0f172a; --text-muted:#64748b; --text-faint:#94a3b8;
  --primary:#00bfbf; --primary-dark:#009999;
  --primary-glow:rgba(0,191,191,.12); --primary-glow-2:rgba(0,191,191,.06);
  --gold:#c48210; --gold-bg:rgba(232,168,56,.12);
  --success:#16a34a; --success-bg:rgba(22,163,74,.1);
  --danger:#dc2626; --danger-bg:rgba(220,38,38,.08);
  --shadow-sm:0 1px 3px rgba(15,23,42,.06); --shadow-md:0 4px 16px rgba(15,23,42,.08);
  --shadow-lg:0 12px 40px rgba(15,23,42,.10); --shadow-xl:0 24px 64px rgba(15,23,42,.12);
}
[data-theme="eye"] {
  --bg:#f5f5e8; --surface:#fffef5; --surface-2:#eeeee0; --surface-3:#e4e4d4;
  --border:rgba(0,0,0,.08); --border-strong:rgba(0,0,0,.14);
  --text:#1a1a0e; --text-muted:#4a4a32; --text-faint:#7a7a58;
  --primary:#007070; --primary-dark:#005a5a;
  --primary-glow:rgba(0,112,112,.12); --primary-glow-2:rgba(0,112,112,.06);
  --gold:#a06010; --gold-bg:rgba(160,96,16,.10);
  --success:#166534; --success-bg:rgba(22,101,52,.10);
  --danger:#b91c1c; --danger-bg:rgba(185,28,28,.08);
  --shadow-sm:0 1px 3px rgba(0,0,0,.06); --shadow-md:0 4px 16px rgba(0,0,0,.08);
  --shadow-lg:0 12px 40px rgba(0,0,0,.10); --shadow-xl:0 24px 64px rgba(0,0,0,.12);
}

/* ═══ RESET + BASE ═══ */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; -webkit-font-smoothing:antialiased; scroll-padding-top:80px; }
body { min-height:100dvh; background:var(--bg); color:var(--text);
  font-family:'Manrope',system-ui,sans-serif;
  font-size:clamp(1rem,0.95rem + 0.25vw,1.125rem); line-height:1.6; }
img,svg { display:block; max-width:100%; }
button { cursor:pointer; background:none; border:none; font:inherit; color:inherit; }
a { color:inherit; }
p,li { text-wrap:pretty; }
h1,h2,h3,h4 { text-wrap:balance; line-height:1.2; }
.hw { max-width:1140px; margin:0 auto; width:100%; padding-inline:clamp(16px,4vw,24px); }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.ic { width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2;
  stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; display:block; }

/* ═══ HEADER ═══ */
.site-header { position:sticky; top:0; z-index:100; backdrop-filter:blur(12px);
  background:rgba(13,17,23,.92); border-bottom:1px solid var(--border); padding:14px 0; }
[data-theme="light"] .site-header { background:rgba(248,250,252,.95); }
[data-theme="eye"]   .site-header { background:rgba(245,245,232,.95); }
.header-inner { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.logo-block { display:flex; align-items:center; gap:12px; text-decoration:none; flex-shrink:0; }
.logo-img { width:42px; height:42px; border-radius:var(--radius-md); background:var(--surface);
  border:1px solid var(--border); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.logo-img .ic { width:21px; height:21px; color:var(--primary); }
.logo-name { font-size:15px; font-weight:700; letter-spacing:-.01em; }
.logo-sub { font-size:11.5px; color:var(--text-muted); }
.main-nav { display:flex; gap:clamp(12px,2vw,22px); align-items:center; }
.main-nav a { color:var(--text-muted); text-decoration:none; font-size:13.5px; font-weight:600;
  transition:color .2s; white-space:nowrap; }
.main-nav a:hover, .main-nav a.active-link { color:var(--primary); }
.header-right { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.theme-sw { display:flex; gap:2px; padding:3px; border-radius:var(--radius-full);
  background:var(--surface-2); border:1px solid var(--border); }
.theme-sw button { width:30px; height:30px; border-radius:50%; display:flex; align-items:center;
  justify-content:center; color:var(--text-muted); transition:background .2s,color .2s; }
.theme-sw button.active { background:var(--primary); color:#0d1117; }
[data-theme="eye"] .theme-sw button.active { color:#ffffff; }
.theme-sw .ic { width:15px; height:15px; }

/* ═══ КНОПКИ ═══ */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:11px 22px; border-radius:var(--radius-full); font-size:14.5px; font-weight:700;
  text-decoration:none; transition:background .2s, border-color .2s, transform .2s, color .2s; }
.btn-primary { background:var(--primary); color:#0d1117; }
.btn-primary:hover { background:var(--primary-dark); transform:translateY(-1px); }
.btn-primary:disabled { opacity:.5; transform:none; cursor:not-allowed; }
[data-theme="eye"] .btn-primary { color:#ffffff; }
.btn-ghost { border:1px solid var(--border-strong); color:var(--text-muted); }
.btn-ghost:hover { border-color:var(--primary); color:var(--primary); }
.btn-sm { padding:8px 16px; font-size:13px; }

/* ═══ КАРТКИ ТА СІТКИ ═══ */
main { padding-block:clamp(28px,5vw,48px) clamp(40px,8vw,72px); }
.page-hero { text-align:center; padding-bottom:clamp(24px,4vw,36px); }
.kicker { display:inline-flex; align-items:center; gap:6px; padding:5px 13px;
  border-radius:var(--radius-full); background:var(--primary-glow); color:var(--primary);
  font-size:12px; font-weight:700; letter-spacing:.04em; margin-bottom:12px; }
[data-theme="eye"] .kicker { color:var(--primary-dark); }
.page-hero h1 { font-family:'Lora',Georgia,serif; font-size:clamp(28px,4.5vw,42px);
  letter-spacing:-.02em; margin-bottom:12px; }
.page-hero p { font-size:clamp(15px,2vw,17px); color:var(--text-muted);
  max-width:640px; margin:0 auto; line-height:1.65; }
.sec-title { font-family:'Lora',Georgia,serif; font-size:clamp(20px,3vw,26px); margin-bottom:16px; }
.card { background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:clamp(18px,3vw,26px); }
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.stack { display:flex; flex-direction:column; gap:16px; }

/* ═══ КАРТКА ЗАХОДУ ═══ */
.ev-card { position:relative; display:flex; flex-direction:column; gap:12px;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg);
  padding:20px; transition:transform .2s, box-shadow .2s, border-color .2s; }
.ev-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-md); border-color:var(--border-strong); }
.ev-badges { display:flex; gap:6px; flex-wrap:wrap; }
.badge { font-size:11.5px; font-weight:700; padding:4px 10px; border-radius:var(--radius-full);
  letter-spacing:.03em; }
.badge-live { background:var(--danger-bg); color:var(--danger); }
.badge-points { background:var(--primary-glow); color:var(--primary); }
[data-theme="eye"] .badge-points { color:var(--primary-dark); }
.badge-soon { background:var(--gold-bg); color:var(--gold); }
.badge-ok { background:var(--success-bg); color:var(--success); }
.ev-card h3 { font-size:17px; line-height:1.35; }
.ev-card h3 a { text-decoration:none; }
.ev-card h3 a::after { content:''; position:absolute; inset:0; }
.ev-card h3 a:hover { color:var(--primary); }
.ev-sum { font-size:13.5px; color:var(--text-muted); line-height:1.55; flex:1; }
.ev-meta { display:flex; flex-wrap:wrap; gap:10px 16px; font-size:12.5px; color:var(--text-faint);
  padding-top:12px; border-top:1px solid var(--border); }
.ev-meta span { display:inline-flex; align-items:center; gap:6px; }
.ev-meta .ic { width:14px; height:14px; }
.price { font-size:15px; font-weight:700; color:var(--text); }

/* ═══ ФОРМИ ═══ */
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.field { display:flex; flex-direction:column; gap:5px; }
.field.full { grid-column:1 / -1; }
label { font-size:12.5px; font-weight:600; color:var(--text-muted); }
input, select, textarea { padding:11px 14px; border-radius:var(--radius-md);
  border:1px solid var(--border-strong); background:var(--surface-2); color:var(--text);
  font:inherit; font-size:14.5px; width:100%; transition:border-color .2s; }
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--primary); }
input::placeholder { color:var(--text-faint); }
.hint { font-size:12px; color:var(--text-faint); }
.check { display:flex; gap:10px; align-items:flex-start; font-size:13px; color:var(--text-muted); }
.check input { width:17px; height:17px; margin-top:2px; flex-shrink:0; accent-color:var(--primary); }
.check a { color:var(--primary); }
.msg { padding:12px 15px; border-radius:var(--radius-md); font-size:13.5px; display:none; }
.msg.show { display:block; }
.msg.ok { background:var(--success-bg); color:var(--success); }
.msg.err { background:var(--danger-bg); color:var(--danger); }
.msg.info { background:var(--primary-glow-2); color:var(--text-muted); border:1px solid var(--border); }

/* ═══ ТАБИ ═══ */
.tabs { display:flex; gap:6px; margin-bottom:18px; }
.tab { padding:9px 18px; border-radius:var(--radius-full); font-size:13.5px; font-weight:600;
  color:var(--text-muted); border:1px solid var(--border); transition:all .2s; }
.tab.active { background:var(--primary-glow); border-color:var(--primary); color:var(--primary); }
[data-theme="eye"] .tab.active { color:var(--primary-dark); }

/* ═══ ПОРОЖНІЙ СТАН ═══ */
.empty { text-align:center; padding:44px 20px; border:1px dashed var(--border-strong);
  border-radius:var(--radius-lg); color:var(--text-muted); }
.empty .ic { width:26px; height:26px; margin:0 auto 10px; color:var(--text-faint); }

/* ═══ КРОКИ ═══ */
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; counter-reset:s; }
.step { background:var(--surface); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:18px; }
.step::before { counter-increment:s; content:counter(s); display:flex; align-items:center;
  justify-content:center; width:28px; height:28px; border-radius:50%;
  background:var(--primary-glow); color:var(--primary); font-size:13px; font-weight:700; margin-bottom:10px; }
[data-theme="eye"] .step::before { color:var(--primary-dark); }
.step h3 { font-size:14.5px; margin-bottom:5px; }
.step p { font-size:12.5px; color:var(--text-muted); line-height:1.5; }

/* ═══ FOOTER ═══ */
.site-footer { border-top:1px solid var(--border); padding:28px 0; margin-top:auto; }
.footer-inner { display:flex; justify-content:space-between; align-items:center;
  gap:14px; flex-wrap:wrap; font-size:13px; color:var(--text-muted); }
.footer-inner a { color:var(--text-muted); text-decoration:none; }
.footer-inner a:hover { color:var(--primary); }
.footer-links { display:flex; gap:16px; flex-wrap:wrap; }

/* ═══ АДАПТИВ ═══ */
@media (max-width:900px) {
  .grid-3, .steps { grid-template-columns:1fr 1fr; }
  .main-nav { display:none; }
}
@media (max-width:680px) {
  .grid-2, .grid-3, .steps, .form-grid { grid-template-columns:1fr; }
  .logo-sub { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
}
