/* Shared stylesheet for the static sub-pages (veneers/, cyprus/ and their Armenian twins in hy/).
   The frame — tokens, header, mobile menu, pills, collapse, results stage and
   viewer, FAQ, contact, footer, rail, reveals — is copied from index.html's inline
   <style>. A change to either copy must be made in both; the :root block must
   stay byte-identical (tools/i18n.py check compares it). */

/* ===== TOKENS ===== */
/* Cool paper, the logo's navy and its blue (assets/logo/). Every component reads semantic tokens;
   .section-deep, the header, the footer, the menu and the viewer flip them to the navy ground. */
:root{
  --paper:#F3F5F8;--paper-2:#E9EDF2;--paper-3:#DCE2E9;
  --navy:#293746;--navy-2:#314051;--navy-3:#1E2935;
  --blue:#007FFC;--blue-deep:#0065D1;--blue-hi:#6DB3FF;
  --ice:#3E6F88;--ice-hi:#9CC3D8;
  --bg:var(--paper);--bg-2:var(--paper-2);
  --ink:#141C25;--ink-body:#2A3542;--body-muted:#4E5A66;--body-dim:#5C6873;
  --label:#5F6B75;--label-dim:#5F6B75;--title-dim:#7A8791;--faq-closed:#3E4A56;
  --hair:rgba(20,28,37,0.12);--hair-2:rgba(20,28,37,0.16);--ghost:rgba(20,28,37,0.30);
  --accent:var(--blue);--accent-text:var(--blue-deep);--accent-hi:#3D98FF;
  --btn:var(--blue-deep);--btn-hover:#0057B5;--btn-text:#FFFFFF;
  --clinical:var(--ice);
  --display:'Fraunces','Noto Serif Armenian','Literata',Georgia,serif;
  --ui:'Archivo','Noto Sans Armenian','Onest',system-ui,-apple-system,'Segoe UI',sans-serif;
  --brand:'Newsreader','Noto Serif Armenian',Georgia,serif;
  --soft:'opsz' 144,'SOFT' 40;
  --pad-x:clamp(20px,4vw,64px);--sec-y:clamp(80px,12vh,160px);
  --ease-out:cubic-bezier(0.16,1,0.3,1);
  color-scheme:light;
}
.section-deep,.site-header,.site-footer,.mobile-menu,.lightbox{
  --bg:var(--navy);--bg-2:var(--navy-2);
  --ink:#F3F5F8;--ink-body:#E6EAEF;--body-muted:#BEC7D1;--body-dim:#AEB8C3;
  --label:#A9B4BF;--label-dim:#9FABB6;--title-dim:#9FABB6;--faq-closed:#C7CFD6;
  --hair:rgba(255,255,255,0.10);--hair-2:rgba(255,255,255,0.14);--ghost:rgba(255,255,255,0.28);
  --accent:var(--blue-hi);--accent-text:var(--blue-hi);--accent-hi:#9CCBFF;
  --btn:var(--blue-deep);--btn-hover:#0A74E6;--btn-text:#FFFFFF;
  --clinical:var(--ice-hi);
  color-scheme:dark;
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
[hidden]{display:none !important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--ui);font-size:16px;line-height:normal;color:var(--ink-body);background:var(--paper);overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer;text-align:inherit}
ul,ol{list-style:none}
h1,h2,h3{font-weight:inherit}
::selection{background:var(--navy);color:var(--paper)}
:focus-visible{outline:1.5px solid var(--accent-text);outline-offset:3px}
section[id]{scroll-margin-top:96px}

@keyframes rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes wipe{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}

/* ===== LAYOUT ===== */
.container{max-width:1560px;margin:0 auto;padding:0 var(--pad-x)}
.section{position:relative;z-index:2;padding:var(--sec-y) 0;background:var(--bg);color:var(--ink-body)}
.section-deep{background:var(--navy)}
.split-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:clamp(24px,4vw,64px);align-items:start;margin-bottom:clamp(40px,6vh,72px)}
.split-head .eyebrow{padding-top:14px}

/* ===== TYPE ===== */
.eyebrow{font-size:10.5px;letter-spacing:0.26em;text-transform:uppercase;color:var(--accent-text);font-weight:500}
.h2{font-family:var(--display);font-weight:300;font-variation-settings:var(--soft);font-size:clamp(2.4rem,5vw,4.6rem);line-height:1.02;letter-spacing:-0.015em;color:var(--ink);text-wrap:balance}
.h2-sub{font-size:clamp(2.3rem,4.4vw,3.9rem);line-height:1.05}
.w14{max-width:14ch}.w16{max-width:16ch}.w18{max-width:18ch}
.lede{margin-top:22px;max-width:52ch;font-size:16px;line-height:1.7;color:var(--body-muted);font-weight:300}
.accent{color:var(--accent)}
.lede-after{margin-top:clamp(28px,4vh,44px)}
.more-link{margin-top:clamp(22px,3vh,32px)}
.arrow{font-family:var(--display);font-size:1.55em;line-height:1;font-weight:400}

/* ===== PILLS, LINKS ===== */
.pill{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:16px 28px;border:1px solid transparent;border-radius:999px;font-size:10.5px;letter-spacing:0.2em;text-transform:uppercase;font-weight:500;line-height:1.2;white-space:nowrap;transition:background 0.25s,color 0.25s,border-color 0.25s}
.pill-lg{padding:18px 32px;font-size:11px;gap:12px}
.pill-solid{background:var(--btn);color:var(--btn-text)}
.pill-solid:hover{background:var(--btn-hover)}
.pill-ghost{border-color:var(--ghost);color:var(--ink)}
.pill-ghost:hover{border-color:var(--ink)}
.pill-outline{border-color:var(--ink);color:var(--ink);padding:12px 20px;gap:9px}
.pill-outline:hover{background:var(--ink);color:var(--bg)}
.pill .dot{width:5px;height:5px;border-radius:50%;background:currentColor}
.text-link{display:inline-flex;align-items:center;gap:10px;font-size:10.5px;letter-spacing:0.2em;text-transform:uppercase;font-weight:500;color:var(--accent-text);transition:color 0.25s}
.text-link:hover{color:var(--ink)}

/* ===== COLLAPSE (FAQ) ===== */
.collapse{display:grid;grid-template-rows:0fr;transition:grid-template-rows 0.5s var(--ease-out)}
.collapse > *{min-height:0;overflow:hidden;opacity:0;visibility:hidden;transition:opacity 0.4s ease,visibility 0s linear 0.5s}
.is-open > .collapse{grid-template-rows:1fr}
.is-open > .collapse > *{opacity:1;visibility:visible;transition:opacity 0.4s ease,visibility 0s}

/* ===== HEADER ===== */
/* the logo's own navy ground (the header flips to the deep tokens), so the logo sits in it as drawn */
.site-header{position:fixed;top:0;left:0;right:0;z-index:80;background:var(--navy);border-bottom:1px solid var(--hair)}
.header-inner{max-width:1560px;margin:0 auto;padding:12px var(--pad-x);min-height:78px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px}
/* the clinic's logo, one per language (assets/logo/, cut from its PDFs), both in one 1151:202 box */
.wordmark{display:block;flex:0 0 auto}
.wordmark img{display:block;width:auto;height:40px}
/* from 861px to 960px the nav shares the row with it: a smaller logo keeps the English header on one row */
@media (min-width:861px) and (max-width:960px){.wordmark img{height:32px}}
.nav-links{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px clamp(12px,2vw,34px);flex:1 1 320px;min-width:0;font-size:11px;letter-spacing:0.18em;text-transform:uppercase;font-weight:500}
.nav-links a{color:var(--body-dim);transition:color 0.25s}
.nav-links a:hover{color:var(--ink)}
.nav-links a[aria-current="page"]{color:var(--accent-text)}
.header-right{display:flex;align-items:center;gap:14px;flex:0 0 auto}
.lang-toggle{display:flex;align-items:center;gap:8px;font-size:10px;letter-spacing:0.2em;font-weight:500;color:var(--label)}
.lang-toggle a,.lang-toggle [aria-current]{padding:6px 0;color:var(--label);transition:color 0.25s}
.lang-toggle a:hover,.lang-toggle [aria-current]{color:var(--ink)}
.lang-sep{opacity:0.4}
.hamburger{display:none;flex-direction:column;gap:5px;padding:10px 4px}
.hamburger span{display:block;width:22px;height:1.5px;background:var(--ink);transition:transform 0.3s,opacity 0.3s}
.hamburger.active span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.hamburger.active span:nth-child(2){opacity:0}
.hamburger.active span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
/* the three-language switch (ENG / ARM / RUS), the Russian nav and the nav's eight links need the
   room: below 1395px, where the English links no longer fit one line at the full tracking, the nav
   and the switch track tighter (one line from about 1240px, two below), below 960px the nav type and
   the CTA's padding step down, so the header stays on one row (79px) and deep links land below it
   (tools/check_browser.py, step 7) */
@media (min-width:861px) and (max-width:1394px){.nav-links{letter-spacing:0.12em;column-gap:clamp(10px,1.4vw,22px)}.lang-toggle{gap:5px;letter-spacing:0.12em}.header-inner{column-gap:16px}}
@media (min-width:861px) and (max-width:960px){.nav-links{font-size:10.5px;letter-spacing:0.1em;column-gap:10px}.header-right{gap:10px}.header-cta{padding-left:14px;padding-right:14px}}

/* ===== MOBILE MENU ===== */
.mobile-overlay{position:fixed;inset:0;z-index:74;background:rgba(20,28,37,0.45);opacity:0;visibility:hidden;transition:opacity 0.35s,visibility 0s linear 0.35s}
.mobile-overlay.open{opacity:1;visibility:visible;transition-delay:0s}
.mobile-menu{position:fixed;top:0;right:0;bottom:0;z-index:78;width:min(340px,88vw);padding:104px 28px 32px;background:var(--navy);color:var(--ink-body);display:flex;flex-direction:column;overflow-y:auto;transform:translateX(100%);visibility:hidden;transition:transform 0.45s var(--ease-out),visibility 0s linear 0.45s}
.mobile-menu.open{transform:none;visibility:visible;transition-delay:0s}
.mobile-menu > a{font-family:var(--display);font-weight:300;font-variation-settings:'opsz' 72,'SOFT' 30;font-size:1.7rem;line-height:1.2;color:var(--ink);padding:12px 0;border-bottom:1px solid var(--hair)}
.mobile-menu > a[aria-current="page"]{color:var(--accent)}
.mobile-actions{display:flex;flex-direction:column;gap:10px;margin-top:28px}
.mobile-lang{display:flex;gap:18px;margin-top:28px;font-size:11px;letter-spacing:0.2em}
.mobile-lang a,.mobile-lang [aria-current]{color:var(--label);padding:6px 0}
.mobile-lang [aria-current]{color:var(--ink)}

/* ===== BREADCRUMB ===== */
.crumbs{margin-bottom:clamp(22px,3.4vh,36px);font-size:10px;letter-spacing:0.2em;text-transform:uppercase;font-weight:500;color:var(--label)}
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.crumbs li{display:flex;align-items:center;gap:10px}
.crumbs li + li::before{content:'/';opacity:0.5}
.crumbs a{color:var(--body-dim);transition:color 0.25s}
.crumbs a:hover{color:var(--ink)}
.crumbs [aria-current]{color:var(--clinical)}

/* ===== VENEER HERO ===== */
/* transparent, so the dot grid shows; the top padding clears the fixed header */
.vx-hero{position:relative;z-index:2;background:transparent;padding-top:clamp(120px,14vh,170px)}
body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(rgba(20,28,37,0.11) 1px,transparent 1.2px);background-size:26px 26px;-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,0.9),rgba(0,0,0,0.35) 55vh,transparent 100vh);mask-image:linear-gradient(to bottom,rgba(0,0,0,0.9),rgba(0,0,0,0.35) 55vh,transparent 100vh)}
.vx-hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,0.95fr);gap:clamp(28px,5vw,80px);align-items:center}
.vx-copy{animation:rise 1.1s cubic-bezier(0.2,0.7,0.2,1) both}
.eyebrow-rule{display:flex;align-items:center;gap:12px;margin-bottom:clamp(24px,4vh,40px)}
.eyebrow-rule::before{content:'';flex:none;width:36px;height:1px;background:var(--accent)}
.vx-title{font-family:var(--display);font-weight:300;font-variation-settings:'opsz' 144,'SOFT' 55;font-size:clamp(2.8rem,5.8vw,5.6rem);line-height:0.96;letter-spacing:-0.02em;color:var(--ink);text-wrap:balance}
.vx-title .accent{color:var(--accent-text);font-style:italic}
.hero-intro{margin-top:clamp(24px,3.4vh,34px);max-width:48ch;font-size:clamp(15.5px,1.15vw,17.5px);line-height:1.7;color:var(--body-muted);font-weight:300}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(28px,4vh,42px)}
.updated{margin-top:22px;font-size:9.5px;letter-spacing:0.2em;text-transform:uppercase;font-weight:500;color:var(--label)}
.vx-media{position:relative;animation:fade 1.4s ease both}
.vx-shot{aspect-ratio:1400/851;overflow:hidden;background:var(--paper-3);animation:wipe 1.2s var(--ease-out) 0.15s both}
.vx-shot img{width:100%;height:100%;object-fit:cover}
.vx-chip{position:absolute;top:18px;right:18px;padding:8px 12px;background:rgba(243,245,248,0.86);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:9px;letter-spacing:0.22em;text-transform:uppercase;font-weight:500;color:var(--ice)}
.stat-strip{margin-top:clamp(40px,7vh,80px);border-top:1px solid var(--hair-2);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:var(--paper)}
.stat{padding:28px 20px;border-right:1px solid var(--hair-2)}
.stat:first-child{padding-left:0}
.stat:last-child{padding-right:0;border-right:0}
.stat-num{font-family:var(--display);font-variation-settings:'opsz' 96,'SOFT' 30;font-size:clamp(2rem,3.2vw,3rem);font-weight:300;color:var(--ink);line-height:1}
.stat-num .accent{color:var(--accent)}
.stat-label{margin-top:10px;font-size:9.5px;letter-spacing:0.2em;text-transform:uppercase;font-weight:500;color:var(--label)}

/* ===== STEPS ===== */
.journey{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--hair-2)}
.journey li{padding:32px 28px 40px;border-right:1px solid var(--hair-2)}
.journey li:first-child{padding-left:0}
.journey li:last-child{padding-right:0;border-right:0}
.step-num{font-family:var(--display);font-variation-settings:'opsz' 144,'SOFT' 40;font-size:3rem;font-weight:300;color:var(--accent);line-height:1}
.step-title{margin:22px 0 10px;font-size:13px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ink);font-weight:500}
.step-text{font-size:14.5px;line-height:1.7;color:var(--body-dim);font-weight:300}
/* six steps in two rows of three (the implants page); from 860px down the two- and one-column rules apply */
@media (min-width:861px){
  .journey-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .journey-3 li:nth-child(3n+1){padding-left:0}
  .journey-3 li:nth-child(3n){padding-right:0;border-right:0}
  .journey-3 li:nth-child(n+4){border-top:1px solid var(--hair-2)}
}

/* ===== COMPARE (traditional vs digital) ===== */
.compare{margin-top:clamp(40px,6vh,64px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--hair-2);border:1px solid var(--hair-2)}
.compare > div{padding:clamp(24px,3vw,40px);background:var(--bg)}
/* a blue tint laid over the opaque ground, so the hairline behind can't show through */
.compare > .is-ours{background:linear-gradient(rgba(0,127,252,0.06),rgba(0,127,252,0.06)),var(--bg)}
.compare-label{font-size:10px;letter-spacing:0.2em;text-transform:uppercase;font-weight:500;color:var(--label)}
.is-ours .compare-label{color:var(--accent-text)}
.compare-num{margin-top:14px;font-family:var(--display);font-variation-settings:'opsz' 144,'SOFT' 40;font-weight:300;font-size:clamp(2.6rem,4.4vw,3.8rem);line-height:1;color:var(--title-dim)}
.is-ours .compare-num{color:var(--ink)}
.compare-num span{font-size:0.45em}
.compare-text{margin-top:14px;max-width:42ch;font-size:14px;line-height:1.7;color:var(--body-dim);font-weight:300}
/* two facts of equal weight (the implant timeline), neither dimmed */
.compare-even .compare-num{color:var(--ink)}

/* ===== WHAT VENEERS CORRECT ===== */
.vx-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:clamp(24px,4vw,64px);align-items:start}
.vx-figure{aspect-ratio:1400/789;overflow:hidden;background:var(--paper-3)}
.vx-figure img{width:100%;height:100%;object-fit:cover}
.fix-list{border-top:1px solid var(--hair-2)}
.fix-list li{display:grid;grid-template-columns:52px minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:baseline;padding:clamp(18px,2.4vh,26px) 0;border-bottom:1px solid var(--hair-2)}
.fix-num{font-size:10.5px;letter-spacing:0.18em;font-weight:500;color:var(--accent-text)}
.fix-name{font-family:var(--display);font-variation-settings:'opsz' 72,'SOFT' 30;font-weight:300;font-size:clamp(1.35rem,2.3vw,2rem);line-height:1.15;color:var(--ink)}
.fix-text{font-size:14.5px;line-height:1.7;color:var(--body-dim);font-weight:300}
.fix-close{margin-top:clamp(28px,4vh,44px);max-width:52ch;font-family:var(--display);font-variation-settings:'opsz' 72,'SOFT' 40;font-weight:300;font-style:italic;font-size:clamp(1.25rem,2vw,1.7rem);line-height:1.45;color:var(--ink)}

/* ===== RESULTS ===== */
.results-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:28px;margin-bottom:clamp(32px,5vh,56px)}
.results-head .eyebrow{margin-bottom:20px}
.case-viewer{display:block;position:relative}
.case-stage{position:relative;height:min(84vh,820px);padding-bottom:124px;border:1px solid var(--hair);background:var(--navy-3);transition:border-color 0.3s}
.case-stage:hover,.case-stage:focus-within{border-color:rgba(109,179,255,0.5)}
.case-item{display:none;width:100%;height:100%;cursor:zoom-in}
.case-item.is-current{display:block;animation:fade 0.35s ease both}
.case-item:focus-visible{outline-offset:-6px}
.case-item img{width:100%;height:100%;object-fit:contain}
.case-meta{position:absolute;left:0;right:0;bottom:0;height:124px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-rows:auto auto;align-items:end;column-gap:24px;row-gap:4px;padding:16px clamp(16px,2.5vw,28px);border-top:1px solid var(--hair);background:var(--navy)}
.case-counter{grid-column:1;grid-row:1/3;display:flex;align-items:baseline;gap:12px}
.case-num{font-family:var(--display);font-variation-settings:'opsz' 96;font-size:clamp(2rem,3vw,2.6rem);font-weight:300;color:var(--accent);line-height:1}
.case-total{font-size:10px;letter-spacing:0.22em;text-transform:uppercase;font-weight:500;color:var(--label-dim)}
.case-tag{grid-column:2;grid-row:1;font-size:11px;letter-spacing:0.2em;text-transform:uppercase;font-weight:500;color:var(--clinical)}
.case-note{grid-column:2;grid-row:2;max-width:60ch;font-size:12.5px;line-height:1.5;color:var(--body-dim);font-weight:300}
.case-nav{grid-column:3;grid-row:1/3;display:flex;gap:10px}
.round-btn{width:52px;height:52px;flex:none;border-radius:50%;border:1px solid var(--ghost);color:var(--ink-body);font-family:var(--display);font-size:19px;line-height:1;display:inline-flex;align-items:center;justify-content:center;transition:border-color 0.25s,color 0.25s}
.round-btn:hover{border-color:var(--accent);color:var(--accent)}
@keyframes arrive{from{opacity:.3;transform:translateY(36px) scale(.97)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion: no-preference){
    .case-viewer{animation:arrive linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
  }
}

/* ===== TYPES + DENTIST ===== */
.hair-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--hair-2);border:1px solid var(--hair-2)}
.hair-grid > *{background:var(--bg)}
.hair-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.on-ground > *{background:var(--bg)}
.type{padding:clamp(24px,3vw,40px)}
.type-tag{font-size:9.5px;letter-spacing:0.2em;text-transform:uppercase;font-weight:500;color:var(--clinical)}
.type-name{margin-top:14px;font-family:var(--display);font-variation-settings:'opsz' 72,'SOFT' 30;font-weight:300;font-size:clamp(1.45rem,2.3vw,2rem);line-height:1.15;color:var(--ink)}
.type-text{margin-top:12px;font-size:14px;line-height:1.7;color:var(--body-dim);font-weight:300}
.type-text a,.faq-a a{color:var(--ink-body);border-bottom:1px solid var(--ghost);transition:color 0.25s,border-color 0.25s}
.type-text a:hover,.faq-a a:hover{color:var(--accent);border-bottom-color:var(--accent)}
.doc-strip{margin-top:clamp(40px,6vh,64px);padding-top:clamp(28px,4vh,40px);border-top:1px solid var(--hair-2);display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(20px,3vw,36px);align-items:center}
.doc-initials{width:clamp(64px,6vw,84px);aspect-ratio:1;border-radius:50%;border:1px solid var(--accent);color:var(--accent-text);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:300;font-size:clamp(1.3rem,2vw,1.7rem);letter-spacing:0.06em}
.doc-label{font-size:9.5px;letter-spacing:0.2em;text-transform:uppercase;font-weight:500;color:var(--label)}
.doc-name{margin-top:10px;font-family:var(--display);font-variation-settings:'opsz' 72,'SOFT' 30;font-weight:300;font-size:clamp(1.45rem,2.3vw,2rem);line-height:1.15;color:var(--ink)}
.doc-text{margin-top:10px;max-width:60ch;font-size:14.5px;line-height:1.7;color:var(--body-dim);font-weight:300}

/* ===== PRICING ===== */
.price-rows{border-top:1px solid var(--hair-2)}
.price-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:baseline;padding:clamp(18px,2.2vh,26px) 0;border-bottom:1px solid var(--hair-2)}
.price-name{font-family:var(--display);font-variation-settings:'opsz' 72,'SOFT' 30;font-size:clamp(1.2rem,1.9vw,1.65rem);font-weight:300;line-height:1.3;color:var(--ink)}
.price-note{margin-top:6px;font-size:12.5px;color:var(--label);font-weight:300}
.price-val{font-size:11px;letter-spacing:0.18em;text-transform:uppercase;font-weight:500;color:var(--clinical);white-space:nowrap;font-variant-numeric:tabular-nums}
.price-more{margin-top:clamp(22px,3vh,32px)}
.price-bar{margin-top:clamp(28px,4vh,44px);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;padding:26px 28px;border:1px solid rgba(109,179,255,0.4);background:rgba(109,179,255,0.07)}
.price-bar p{max-width:60ch;font-size:14px;line-height:1.7;color:var(--body-muted);font-weight:300}
.price-bar .pill{padding:15px 26px}

/* ===== FAQ ===== */
.faq-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:clamp(24px,4vw,64px);align-items:start}
.faq-grid .eyebrow{padding-top:14px}
.h2-faq{margin-top:24px;font-size:clamp(2rem,3.2vw,2.8rem);line-height:1.06}
.faq-intro{margin-top:18px;max-width:34ch;font-size:14px;line-height:1.7;color:var(--body-dim);font-weight:300}
.faq-list{border-top:1px solid var(--hair-2)}
.faq-item{border-bottom:1px solid var(--hair-2)}
.faq-q{width:100%;display:flex;align-items:baseline;justify-content:space-between;gap:24px;padding:clamp(20px,2.4vh,28px) 0;text-align:left}
.faq-q-text{font-family:var(--display);font-variation-settings:'opsz' 72,'SOFT' 30;font-size:clamp(1.15rem,1.8vw,1.5rem);font-weight:300;color:var(--faq-closed);line-height:1.3;transition:color 0.3s}
.faq-icon{flex:none;font-family:var(--display);font-size:1.4rem;color:var(--accent-text);line-height:1;transition:transform 0.35s ease}
.faq-item.is-open .faq-q-text{color:var(--ink)}
.faq-item.is-open .faq-icon{transform:rotate(45deg)}
.faq-a p{max-width:66ch;padding-bottom:26px;font-size:15px;line-height:1.75;color:var(--body-dim);font-weight:300}

/* ===== CONTACT ===== */
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(32px,5vw,80px);align-items:start}
.contact-copy .eyebrow{margin-bottom:20px}
.contact-copy .lede{max-width:46ch}
.contact-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.contact-cards{margin-top:clamp(32px,5vh,48px)}
.contact-cards > div{padding:22px}
.card-label{margin-bottom:10px;font-size:9.5px;letter-spacing:0.2em;text-transform:uppercase;font-weight:500;color:var(--label-dim)}
.card-value{display:block;font-size:14px;line-height:1.55;color:var(--ink-body)}
a.card-value{transition:color 0.25s}
a.card-value:hover{color:var(--accent)}
.card-value.email{font-size:13px;word-break:break-all}
.map{margin-top:20px;height:220px;border:1px solid var(--hair-2);overflow:hidden;background:var(--navy-3)}
.map iframe{display:block;width:100%;height:100%;border:0;filter:grayscale(1) invert(0.92) contrast(0.9)}
.form-panel{border:1px solid var(--hair-2);padding:clamp(24px,3vw,40px);background:var(--navy-2)}
.form-eyebrow{margin-bottom:26px;font-size:10px;letter-spacing:0.22em;text-transform:uppercase;font-weight:500;color:var(--clinical)}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.field{display:flex;flex-direction:column;gap:9px;min-width:0}
.field-wide{grid-column:1/-1}
.field-label{font-size:9.5px;letter-spacing:0.2em;text-transform:uppercase;font-weight:500;color:var(--label-dim)}
.field input,.field select,.field textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--ghost);border-radius:0;padding:10px 0;font-size:15px;color:var(--ink);outline:none;transition:border-color 0.25s}
.field select{background:var(--navy-2)}
.field textarea{resize:vertical;min-height:84px;line-height:1.5}
.field input:focus,.field select:focus,.field textarea:focus{border-bottom-color:var(--accent)}
.field input::placeholder,.field textarea::placeholder{color:var(--label)}
.form-submit{width:100%;margin-top:30px;padding:18px;font-size:11px;letter-spacing:0.22em}
.form-small{margin-top:16px;font-size:11.5px;line-height:1.6;color:var(--label);font-weight:300}
.form-small a{color:var(--body-muted);border-bottom:1px solid var(--hair-2);transition:color 0.25s}
.form-small a:hover{color:var(--accent)}

/* ===== FOOTER ===== */
.site-footer{position:relative;z-index:2;background:var(--navy-3);color:var(--ink-body)}
.footer-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,1fr));gap:clamp(28px,4vw,64px);padding-top:clamp(48px,7vh,80px);padding-bottom:34px}
.footer-name{font-family:var(--brand);font-size:30px;font-weight:300;letter-spacing:0.16em;color:var(--ink);line-height:1.1}
.footer-tag{margin-top:6px;font-size:8.5px;letter-spacing:0.34em;text-transform:uppercase;font-weight:400;color:var(--label-dim)}
.footer-desc{margin-top:24px;max-width:38ch;font-size:14px;line-height:1.7;color:var(--label);font-weight:300}
.footer-col{display:flex;flex-direction:column;align-items:flex-start;gap:12px;font-size:12.5px}
.footer-h{margin-bottom:6px;font-size:9.5px;letter-spacing:0.2em;text-transform:uppercase;font-weight:500;color:var(--label)}
.footer-col a{color:var(--body-muted);transition:color 0.25s}
.footer-col a:hover{color:var(--ink)}
.footer-bottom{padding-bottom:40px}
.footer-bar{border-top:1px solid var(--hair);padding-top:22px;display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;font-size:11px;color:var(--label)}
.footer-legal{flex-basis:100%}

/* ===== CONTACT RAIL ===== */
.rail{position:fixed;right:clamp(14px,2vw,26px);bottom:clamp(14px,2vw,26px);z-index:70;display:flex;flex-direction:column;gap:10px}
.rail .pill{padding:14px 22px;font-size:10px}
.rail .pill-solid{box-shadow:0 16px 40px rgba(20,28,37,0.28)}
.pill-dark{background:rgba(243,245,248,0.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-color:var(--ghost);color:var(--ink);box-shadow:0 10px 30px rgba(20,28,37,0.16)}
.pill-dark:hover{border-color:var(--ink)}

/* ===== CASE VIEWER (the lightbox) ===== */
.lightbox{position:fixed;inset:0;z-index:90;background:rgba(20,28,37,0.96);color:var(--ink-body);display:flex;flex-direction:column;gap:14px;padding:clamp(12px,3vw,36px) clamp(12px,3vw,36px) clamp(10px,2vw,20px);animation:fade 0.3s ease both}
.lb-figure{margin:0;flex:1 1 auto;min-height:0;width:100%;display:grid;grid-template-columns:100%;grid-template-rows:100%;place-items:center;cursor:zoom-out;touch-action:none}
.lb-figure.is-compare{cursor:pointer}
.lb-figure img{grid-area:1/1;max-width:100%;max-height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}
.lb-half{opacity:0;transition:opacity .22s ease}
.lb-half.is-shown{opacity:1}
.lb-bar{flex:none;width:100%;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px}
.lb-count{font-family:var(--display);font-weight:300;font-size:1.5rem;color:var(--accent);line-height:1}
.lb-count small{font-family:var(--ui);font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;color:var(--label-dim);margin-left:12px}
.lb-compare{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.lb-seg{font-family:var(--ui);font-weight:500;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--body-dim);border:1px solid var(--ghost);background:transparent;padding:10px 14px;border-radius:999px;cursor:pointer;transition:color .2s,border-color .2s,background .2s}
.lb-seg.is-on{background:var(--accent);border-color:var(--accent);color:var(--navy)}
.lb-seg:hover:not(.is-on){border-color:var(--accent);color:var(--accent)}
.lb-hint{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--label-dim);margin-left:8px}
.lb-nav{display:flex;align-items:center;gap:10px}
.lightbox-close{font-size:11px;letter-spacing:0.2em;text-transform:uppercase;font-weight:500;color:var(--body-dim);cursor:pointer;margin-left:8px;transition:color 0.25s}
.lightbox-close:hover{color:var(--ink)}

/* ===== SCROLL REVEALS & PROGRESS ===== */
@keyframes progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes riseIn{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion: no-preference){
    .site-header::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:1.5px;background:var(--blue);transform-origin:0 50%;animation:progress linear both;animation-timeline:scroll(root)}
    .split-head,.journey>li,.compare>div,.fix-list,.fix-close,.type,.doc-strip,.price-row,.faq-item,.contact-grid>*{animation:riseIn linear both;animation-timeline:view();animation-range:entry 0% entry 38%}
    .journey>li:nth-child(2),.type:nth-child(2),.price-row:nth-child(2){animation-range:entry 8% entry 46%}
    .journey>li:nth-child(3),.type:nth-child(3),.price-row:nth-child(3){animation-range:entry 16% entry 54%}
    .journey>li:nth-child(4){animation-range:entry 24% entry 62%}
    /* the second row of three steps staggers like the first */
    .journey-3>li:nth-child(4){animation-range:entry 0% entry 38%}
    .journey-3>li:nth-child(5){animation-range:entry 8% entry 46%}
    .journey-3>li:nth-child(6){animation-range:entry 16% entry 54%}
  }
}

/* ===== ARMENIAN OVERRIDES ===== */
/* Armenian micro-labels are not set in capitals: CSS uppercasing turns the ligature և
   into the classical ԵՒ (Երևան → ԵՐԵՒԱՆ), since browsers apply no Armenian case rules.
   Mixed case needs little tracking. Any new uppercase, tracked label belongs in this list */
html.lang-hy .eyebrow,html.lang-hy .nav-links,html.lang-hy .pill,html.lang-hy .text-link,
html.lang-hy .crumbs,html.lang-hy .updated,html.lang-hy .vx-chip,html.lang-hy .stat-label,
html.lang-hy .step-title,html.lang-hy .compare-label,html.lang-hy .type-tag,html.lang-hy .doc-label,
html.lang-hy .case-total,html.lang-hy .case-tag,html.lang-hy .price-val,
html.lang-hy .field-label,html.lang-hy .form-eyebrow,html.lang-hy .card-label,html.lang-hy .footer-h,html.lang-hy .footer-tag,
html.lang-hy .lightbox-close,html.lang-hy .lb-seg,html.lang-hy .lb-hint{text-transform:none;letter-spacing:0.04em}
html.lang-hy .footer-name{letter-spacing:0.1em}
html.lang-hy .vx-title{font-size:clamp(2.3rem,4.6vw,4.4rem);line-height:1.1;letter-spacing:-0.01em}
html.lang-hy .h2{line-height:1.14;letter-spacing:-0.01em}
html.lang-hy .w14,html.lang-hy .w16,html.lang-hy .w18{max-width:24ch}
/* single long Armenian words (հաղորդագրությունից) overrun the gutter at the 2.2rem minimum */
@media (max-width:400px){html.lang-hy .h2:not(.h2-faq){font-size:8.6vw}}

/* ===== RESPONSIVE ===== */
@media (max-width:860px){
  .nav-links,.lang-toggle{display:none}
  .hamburger{display:flex}
  .split-head,.vx-hero-grid,.vx-split,.faq-grid,.contact-grid{grid-template-columns:minmax(0,1fr)}
  .split-head .eyebrow,.faq-grid .eyebrow{padding-top:0}
  .vx-hero-grid{gap:44px}
  .vx-media{width:100%;max-width:560px}
  .vx-figure{max-width:560px}
  .stat-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stat,.stat:first-child{padding:22px 16px 22px 0}
  .stat:nth-child(2n){padding:22px 0 22px 16px;border-right:0}
  .stat:nth-child(n+3){border-top:1px solid var(--hair-2)}
  .fix-list li{grid-template-columns:40px minmax(0,1fr);row-gap:6px}
  .fix-text{grid-column:2}
  .case-stage{height:min(72vh,640px);padding-bottom:150px}
  .case-meta{height:150px;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto auto;row-gap:2px}
  .case-counter{grid-column:1;grid-row:1}
  .case-tag{grid-column:1;grid-row:2}
  .case-note{grid-column:1/-1;grid-row:3}
  .case-nav{grid-column:2;grid-row:1/3}
  .journey{grid-template-columns:repeat(2,minmax(0,1fr))}
  .journey li,.journey li:first-child{padding:28px 20px 32px 0}
  .journey li:nth-child(2n){padding:28px 0 32px 20px;border-right:0}
  .journey li:nth-child(n+3){border-top:1px solid var(--hair-2)}
  .hair-grid-3{grid-template-columns:minmax(0,1fr)}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-brand{grid-column:1/-1}
  .footer-bottom{padding-bottom:130px} /* keep the last line clear of the contact rail */
}
@media (max-width:560px){
  .header-cta{display:none}
  .pill{white-space:normal;text-align:center}
  .journey{grid-template-columns:minmax(0,1fr)}
  .journey li,.journey li:first-child,.journey li:nth-child(2n){padding:26px 0 28px;border-right:0}
  .journey li:nth-child(n+2){border-top:1px solid var(--hair-2)}
  .hair-grid,.form-grid,.compare{grid-template-columns:minmax(0,1fr)}
  .price-row{grid-template-columns:minmax(0,1fr);gap:8px}
  .case-stage{height:min(58vh,460px)}
  .price-bar{padding:22px 20px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:0.01ms !important;animation-delay:0s !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;transition-delay:0s !important}
}