/*
Theme Name: Hayruni Dental
Theme URI: https://hayrunidental.am
Author: Hayruni Dental Clinic
Author URI: https://hayrunidental.am
Description: Dark, gold-accented WordPress theme for Hayruni Dental Clinic in Yerevan. Implantology, aesthetic dentistry and a fully editable one-page front page.
Version: 2.1.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hayruni
Tags: dental, clinic, dark, one-page, custom-colors, custom-logo, custom-menu, translation-ready
*/

/* ============================================================
   HAYRUNI DENTAL CLINIC — design tokens
   ============================================================ */
:root{
  /* ---------- primitive: navy field ---------- */
  --navy-900:#0e1a31;
  --navy-850:#14243f;
  --navy-800:#1a2c4c;
  --navy-750:#213458;
  --navy-700:#293f66;
  --navy-600:#334b78;

  /* ---------- primitive: rose gold ---------- */
  --rose-300:#fbe0cd;
  --rose-400:#f2c7ad;
  --rose-500:#dda88c;
  --rose-600:#be8266;
  --rose-700:#9d6750;

  /* ---------- semantic: surfaces ---------- */
  --ink-900:var(--navy-900);
  --ink-850:var(--navy-850);
  --ink-800:var(--navy-800);
  --ink-750:var(--navy-750);
  --ink-700:var(--navy-700);
  --ink-600:var(--navy-600);

  /* ---------- semantic: accent ---------- */
  --gold-400:var(--rose-400);
  --gold-500:var(--rose-500);
  --gold-600:var(--rose-600);
  --silver-100:#fbf1ea;
  --silver-300:#e3d2c7;
  --silver-500:#ae9a8e;

  /* ---------- semantic: text ---------- */
  --tx-hi:#f2efec;
  --tx-mid:#b3bacb;
  --tx-low:#8996b0;
  --on-gold:#16233c;

  --line:rgba(255,255,255,.09);
  --line-gold:rgba(221,168,140,.38);

  /* ---------- semantic: misc ---------- */
  --photo-bg:#0b1526;
  --danger:#e89a90;

  /* ---------- component: monogram metal ---------- */
  --metal-1:#ffffff;
  --metal-2:#e4e8ee;
  --metal-3:#9aa3b2;
  --metal-4:#eef1f5;
  --metal-rule:#8d95a3;
  --metal-text:#e9ecf1;

  /* ---------- component: map artwork ---------- */
  --map-bg:#1b2b47;
  --map-grid:#25375a;
  --map-road:#2f4470;
  --map-block:#20314f;
  --map-label:#7e8ba6;

  /* type */
  --serif:"Cormorant Garamond","Noto Serif Armenian",Georgia,"Times New Roman",serif;
  --sans:"Jost","Noto Sans Armenian",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;

  /* rhythm */
  --sp-1:.5rem;  --sp-2:1rem;   --sp-3:1.5rem;
  --sp-4:2rem;   --sp-5:3rem;   --sp-6:4.5rem;
  --sp-7:7rem;
  --maxw:1180px;
  --r-sm:2px; --r-md:4px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--ink-900);
  color:var(--tx-mid);
  font-family:var(--sans);
  font-size:16px;
  font-weight:300;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
h1,h2,h3,h4{font-family:var(--serif);font-weight:400;color:var(--tx-hi);margin:0;line-height:1.2}

.wrap{width:min(100% - 2.5rem,var(--maxw));margin-inline:auto}
.center{text-align:center}

/* focus visibility */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:2px solid var(--gold-500);outline-offset:3px;border-radius:var(--r-sm);
}
.skip{position:absolute;left:-9999px;top:0;background:var(--gold-500);color:var(--on-gold);padding:.75rem 1.25rem;z-index:200}
.skip:focus{left:1rem;top:1rem}

/* ---------- section heading ---------- */
.eyebrow{
  font-family:var(--sans);font-size:.68rem;font-weight:400;
  letter-spacing:.42em;text-transform:uppercase;color:var(--gold-500);
  margin:0 0 var(--sp-2);
}
.sec-title{
  font-size:clamp(1.9rem,4vw,2.9rem);
  color:var(--gold-400);
  letter-spacing:.02em;
}
.sec-title.light{color:var(--tx-hi)}
.rule{
  width:180px;max-width:60%;height:14px;margin:1rem auto 1.75rem;
  display:block;opacity:.85;
}
.sub{max-width:60ch;margin:0 auto;color:var(--tx-low);font-size:.95rem}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.95rem 2.1rem;border-radius:var(--r-sm);
  font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;font-weight:400;
  border:1px solid var(--gold-600);
  transition:all .45s var(--ease);
  position:relative;overflow:hidden;
}
.btn-solid{background:linear-gradient(135deg,var(--gold-500),var(--gold-600));color:var(--on-gold);border-color:transparent;font-weight:500}
.btn-solid:hover{background:linear-gradient(135deg,var(--gold-400),var(--gold-500));transform:translateY(-2px);box-shadow:0 12px 30px -12px rgba(221,168,140,.65)}
.btn-ghost{color:var(--gold-400);background:transparent}
.btn-ghost:hover{background:rgba(221,168,140,.1);color:var(--gold-400);transform:translateY(-2px)}

/* ============================================================
   TOP BAR + NAV
   ============================================================ */
.topbar{
  background:var(--ink-850);
  border-bottom:1px solid var(--line);
  font-size:.72rem;letter-spacing:.12em;
  color:var(--tx-low);
}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:44px;flex-wrap:wrap}
.topbar-left{display:flex;gap:1.5rem;align-items:center;flex-wrap:wrap}
.topbar a:hover{color:var(--gold-400)}
.lang{display:flex;gap:.15rem;align-items:center}
.lang button{
  background:none;border:0;color:var(--tx-low);
  padding:.25rem .5rem;font-size:.7rem;letter-spacing:.12em;
  transition:color .3s var(--ease);
}
.lang button[aria-current="true"]{color:var(--gold-400)}
.lang button:hover{color:var(--tx-hi)}
.lang span{opacity:.3}

.nav{
  position:sticky;top:0;z-index:100;
  background:rgba(12,22,42,.92);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
  transition:box-shadow .4s var(--ease);
}
.nav.scrolled{box-shadow:0 12px 40px -18px rgba(0,0,0,.9)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:66px}
.nav-mark{display:flex;align-items:center;gap:.7rem}
.nav-mark svg{width:30px;height:auto}
.nav-mark .nm-txt{
  font-family:var(--serif);font-size:1.05rem;letter-spacing:.2em;color:var(--tx-hi);text-transform:uppercase;
}
.nav-links{display:flex;gap:1.9rem;list-style:none;margin:0;padding:0}
.nav-links a{
  font-size:.71rem;letter-spacing:.2em;text-transform:uppercase;color:var(--tx-mid);
  position:relative;padding:.35rem 0;transition:color .35s var(--ease);
}
.nav-links a::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:0;
  background:var(--gold-500);transition:width .4s var(--ease);
}
.nav-links a:hover,.nav-links a.active{color:var(--gold-400)}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
.nav-cta{display:none}
.burger{
  display:none;background:none;border:1px solid var(--line);
  width:42px;height:38px;border-radius:var(--r-sm);
  align-items:center;justify-content:center;flex-direction:column;gap:4px;
}
.burger i{display:block;width:17px;height:1px;background:var(--tx-hi);transition:transform .35s var(--ease),opacity .25s}
.burger[aria-expanded="true"] i:nth-child(1){transform:translateY(5px) rotate(45deg)}
.burger[aria-expanded="true"] i:nth-child(2){opacity:0}
.burger[aria-expanded="true"] i:nth-child(3){transform:translateY(-5px) rotate(-45deg)}

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative;min-height:clamp(560px,88vh,780px);
  display:grid;place-items:center;text-align:center;
  padding:var(--sp-6) 0 var(--sp-7);
  overflow:hidden;
  background:
    radial-gradient(120% 90% at 50% 0%,#2c4269 0%,#1b2c4b 42%,#101d35 78%,#0d1830 100%);
}
/* skyline silhouette + glow, drawn in CSS/SVG — no external assets */
.hero::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(60% 42% at 50% 78%,rgba(221,168,140,.20),transparent 70%),
    radial-gradient(45% 30% at 18% 88%,rgba(120,140,180,.16),transparent 70%);
  pointer-events:none;
}
.hero-sky{
  position:absolute;left:0;right:0;bottom:0;width:100%;height:44%;
  opacity:.55;pointer-events:none;
}
.hero-vig{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(11,21,40,.72) 0%,rgba(11,21,40,.15) 32%,rgba(11,21,40,.55) 72%,var(--ink-900) 100%);
}
.hero-inner{position:relative;z-index:3;padding-inline:1.25rem}
.hero-logo{width:min(320px,74vw);margin:0 auto var(--sp-3);filter:drop-shadow(0 18px 40px rgba(0,0,0,.75))}
.hero h1{
  font-size:clamp(1.6rem,4.4vw,2.7rem);letter-spacing:.06em;
  color:var(--silver-100);margin-bottom:.6rem;
}
.hero .arm{
  font-family:var(--sans);font-weight:300;
  font-size:clamp(.78rem,2vw,.95rem);letter-spacing:.34em;text-transform:uppercase;
  color:var(--gold-400);margin:0 0 1.4rem;
}
.hero p.lede{max-width:56ch;margin:0 auto 2.2rem;color:var(--tx-mid);font-size:1rem}
.hero-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.scroll-cue{
  position:absolute;bottom:26px;left:50%;transform:translateX(-50%);
  z-index:4;color:var(--gold-500);font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;
  display:flex;flex-direction:column;align-items:center;gap:.55rem;opacity:.75;
}
.scroll-cue i{display:block;width:1px;height:38px;background:linear-gradient(var(--gold-500),transparent);animation:cue 2.4s var(--ease) infinite}
@keyframes cue{0%{transform:scaleY(.2);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(.2);transform-origin:bottom}}

/* trust strip */
.trust{background:var(--ink-850);border-block:1px solid var(--line)}
.trust ul{
  list-style:none;margin:0;padding:var(--sp-3) 0;
  display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;text-align:center;
}
.trust li+li{border-left:1px solid var(--line)}
.trust b{
  display:block;font-family:var(--serif);font-size:1.9rem;color:var(--gold-400);
  line-height:1;margin-bottom:.4rem;
}
.trust small{font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--tx-low)}

/* ============================================================
   DOCTOR
   ============================================================ */
.doctor{
  background:linear-gradient(180deg,var(--ink-900),var(--ink-850));
  padding:var(--sp-7) 0;position:relative;
}
.doctor .grid{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-5);align-items:center;
}
.portrait{
  position:relative;aspect-ratio:4/5;margin:0;
  background:var(--photo-bg);                 /* matches the photo's own black ground */
  border:1px solid var(--line);
  overflow:hidden;
}
.portrait img{
  width:100%;height:100%;object-fit:cover;object-position:50% 8%;
  display:block;
}
.portrait::after{
  content:"";position:absolute;inset:14px;border:1px solid var(--line-gold);
  pointer-events:none;z-index:3;
}
.portrait figcaption{
  position:absolute;left:0;right:0;bottom:0;z-index:2;
  padding:3.5rem 1.5rem 1.6rem;text-align:center;
  background:linear-gradient(to top,rgba(9,18,36,.94) 30%,rgba(9,18,36,.55) 65%,transparent);
}
.portrait figcaption b{
  display:block;font-family:var(--serif);font-weight:400;
  font-size:1.15rem;color:var(--tx-hi);letter-spacing:.04em;
}
.portrait figcaption span{
  display:block;margin-top:.3rem;
  font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-500);
}
.doc-card{
  background:linear-gradient(160deg,rgba(40,60,96,.9),rgba(19,32,56,.95));
  border:1px solid var(--line);
  padding:clamp(1.75rem,4vw,3rem);
  position:relative;
}
.doc-card::before{
  content:"";position:absolute;inset:10px;border:1px solid rgba(255,255,255,.05);pointer-events:none;
}
.doc-card h2{font-size:clamp(1.6rem,3.4vw,2.2rem);color:var(--gold-400);margin-bottom:.35rem}
.doc-role{font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--tx-low);margin:0 0 1.4rem}
.doc-card p{font-size:.94rem;margin:0 0 1rem}
.creds{list-style:none;margin:0 0 1.8rem;padding:0;display:grid;gap:.7rem}
.creds li{display:flex;gap:.75rem;font-size:.88rem;color:var(--tx-mid);align-items:flex-start}
.creds svg{flex:0 0 16px;margin-top:.42rem;color:var(--gold-500)}

/* ============================================================
   SERVICES
   ============================================================ */
.services{
  padding:var(--sp-7) 0;
  background:
    linear-gradient(180deg,var(--ink-850) 0%,#1c2f51 45%,var(--ink-850) 100%);
  position:relative;
}
.services::before{
  content:"";position:absolute;inset:0;opacity:.45;pointer-events:none;
  background-image:radial-gradient(circle at 1px 1px,rgba(255,255,255,.045) 1px,transparent 0);
  background-size:26px 26px;
}
.services .wrap{position:relative;z-index:2}
/* One row, however many treatments there are. The carousel classes only take
   over on a narrow screen, where the row becomes a slider. */
.carousel--svc .carousel__track{
  display:grid;grid-template-columns:repeat(var(--svc-cols,5),minmax(0,1fr));
  gap:1.15rem;margin-top:var(--sp-4);align-items:stretch;
  overflow:visible;scroll-snap-type:none;padding:0;margin-inline:0;
}
.carousel--svc .carousel__nav,.carousel--svc .carousel__dots{display:none}
.svc-grid--tight{gap:.7rem}
.svc-grid--tight .svc{padding:1.7rem .7rem 1.3rem}
.svc-grid--tight .svc svg{width:48px;height:48px;margin-bottom:1rem}
.svc-grid--tight .svc h3{font-size:.62rem;letter-spacing:.14em}
.svc-grid--tight .svc p{font-size:.72rem}

/* The row of treatments is the one block that wants the whole screen: on a wide
   monitor it steps out of the centred column, and the cards grow back to their
   normal weight now that there is room. */
@media (min-width:1240px){
  /* percentages of the section, not of the viewport, so the gutters stay equal
     whether or not a scrollbar is showing */
  .services .wrap{width:min(100% - 4rem,2200px)}
  .svc-grid--tight{gap:1rem}
  .svc-grid--tight .svc{padding:1.9rem .85rem 1.4rem}
  .svc-grid--tight .svc svg{width:54px;height:54px;margin-bottom:1.2rem}
  .svc-grid--tight .svc h3{font-size:.64rem;letter-spacing:.16em}
  .svc-grid--tight .svc p{font-size:.75rem}
}
@media (min-width:1700px){
  .svc-grid--tight{gap:1.15rem}
  .svc-grid--tight .svc{padding:2.2rem 1.1rem 1.6rem}
  .svc-grid--tight .svc svg{width:62px;height:62px;margin-bottom:1.4rem}
  .svc-grid--tight .svc h3{font-size:.68rem;letter-spacing:.22em}
  .svc-grid--tight .svc p{font-size:.78rem}
}
.svc{
  background:linear-gradient(170deg,rgba(44,64,102,.55),rgba(20,36,63,.75));
  border:1px solid var(--line);
  padding:2.2rem 1rem 1.6rem;text-align:center;
  transition:transform .5s var(--ease),border-color .5s var(--ease),background .5s var(--ease);
  position:relative;
}
.svc:hover{transform:translateY(-8px);border-color:var(--line-gold);background:linear-gradient(170deg,rgba(96,72,60,.55),rgba(30,44,72,.85))}
.svc svg{width:62px;height:62px;color:var(--gold-500);margin:0 auto 1.4rem;transition:color .4s var(--ease),transform .5s var(--ease)}
.svc:hover svg{color:var(--gold-400);transform:scale(1.06)}
.svc h3{
  font-family:var(--sans);font-size:.68rem;font-weight:400;
  letter-spacing:.22em;text-transform:uppercase;color:var(--tx-hi);line-height:1.7;
}
.svc p{font-size:.78rem;color:var(--tx-low);margin:.65rem 0 0;line-height:1.6}

/* ============================================================
   WELCOME / OFFICE
   ============================================================ */
.office{
  position:relative;padding:var(--sp-7) 0;text-align:center;
  background:linear-gradient(180deg,#182844,#111e36);
  overflow:hidden;
}
.office::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background:
    linear-gradient(115deg,transparent 0 42%,rgba(255,255,255,.035) 42% 44%,transparent 44%),
    linear-gradient(115deg,transparent 0 62%,rgba(255,255,255,.025) 62% 63%,transparent 63%),
    radial-gradient(70% 55% at 50% 45%,rgba(221,168,140,.10),transparent 70%);
}
.office .wrap{position:relative;z-index:2}
.office h2{font-size:clamp(1.8rem,4vw,2.7rem);color:var(--gold-400)}
.office .arm-line{
  font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--tx-low);margin:.5rem auto 1.5rem;
}
.office p{max-width:62ch;margin:0 auto 1.1rem;font-size:.95rem}
.office .btn{margin-top:1.4rem}

/* ============================================================
   PRICES
   ============================================================ */
.prices{padding:var(--sp-7) 0;background:var(--ink-850)}
.price-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(285px,1fr));gap:1.5rem;margin-top:var(--sp-4)}
.price-card{
  border:1px solid var(--line);background:linear-gradient(170deg,rgba(40,60,96,.5),rgba(18,30,53,.7));
  padding:2rem 1.75rem;transition:border-color .45s var(--ease),transform .45s var(--ease);
}
.price-card:hover{border-color:var(--line-gold);transform:translateY(-4px)}
.price-card h3{
  font-family:var(--sans);font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;
  color:var(--gold-400);margin-bottom:1.4rem;padding-bottom:.9rem;border-bottom:1px solid var(--line);
}
.price-card dl{margin:0;display:grid;gap:.1rem}
.price-row{
  display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
  padding:.62rem 0;border-bottom:1px dashed rgba(255,255,255,.06);
}
.price-row:last-child{border-bottom:0}
.price-row dt{font-size:.86rem;color:var(--tx-mid)}
.price-row dd{margin:0;font-size:.86rem;color:var(--silver-300);white-space:nowrap;font-variant-numeric:tabular-nums}
.prices__more{display:flex;justify-content:center;margin-top:var(--sp-4)}
.price-note{margin-top:1.75rem;font-size:.76rem;color:var(--tx-low);text-align:center}

/* ============================================================
   TESTIMONIALS
   ============================================================ */
.testi{
  padding:var(--sp-7) 0;
  background:linear-gradient(160deg,#1a2b4a 0%,#122036 60%,#0e1930 100%);
  position:relative;overflow:hidden;
}
/* auto-fit so cards step 3 -> 2 -> 1 on their own content width, never squeezing */
.testi .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(265px,1fr));gap:1.5rem;margin-top:var(--sp-4)}
.quote{
  background:rgba(255,255,255,.03);border:1px solid var(--line);
  padding:2rem 1.75rem;position:relative;
  transition:border-color .45s var(--ease),background .45s var(--ease);
}
.quote:hover{border-color:var(--line-gold);background:rgba(221,168,140,.045)}
.quote .qm{
  font-family:var(--serif);font-size:3.4rem;line-height:.6;color:var(--gold-600);opacity:.55;
  display:block;margin-bottom:.6rem;
}
.quote p{font-size:.92rem;color:var(--tx-mid);font-style:italic;margin:0 0 1.3rem}
.stars{color:var(--gold-500);letter-spacing:.22em;font-size:.72rem;margin-bottom:.4rem}
.quote cite{font-style:normal;font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;color:var(--tx-low)}

/* ============================================================
   CONTACT / MAP
   ============================================================ */
.contact{background:var(--ink-850);padding:var(--sp-7) 0}
.contact .grid{display:grid;grid-template-columns:1.05fr .95fr;gap:var(--sp-5);align-items:stretch}
.map-card{
  position:relative;border:1px solid var(--line);min-height:400px;overflow:hidden;
  background:
    linear-gradient(150deg,#28405f,#1a2b49);
}
.map-card svg.mapart{position:absolute;inset:0;width:100%;height:100%;opacity:.85}
.map-pin{
  position:absolute;left:50%;top:46%;transform:translate(-50%,-100%);
  color:var(--gold-400);filter:drop-shadow(0 6px 12px rgba(0,0,0,.6));
  animation:pin 3s var(--ease) infinite;
}
@keyframes pin{0%,100%{transform:translate(-50%,-100%)}50%{transform:translate(-50%,-118%)}}
.map-badge{
  position:absolute;left:1.25rem;bottom:1.25rem;right:1.25rem;
  background:rgba(12,22,42,.88);border:1px solid var(--line-gold);
  backdrop-filter:blur(8px);padding:1.1rem 1.25rem;
}
.map-badge strong{display:block;color:var(--gold-400);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;margin-bottom:.35rem}
.map-badge span{font-size:.86rem;color:var(--tx-mid)}
.map-badge a{color:var(--silver-300);font-size:.78rem;border-bottom:1px solid var(--line-gold);padding-bottom:1px}
.map-badge a:hover{color:var(--gold-400)}

.info-list{list-style:none;margin:var(--sp-3) 0 0;padding:0;display:grid;gap:1.4rem}
.info-list li{display:flex;gap:1rem;align-items:flex-start}
.info-list svg{flex:0 0 20px;color:var(--gold-500);margin-top:.3rem}
.info-list b{display:block;font-family:var(--sans);font-weight:400;font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;color:var(--tx-low);margin-bottom:.25rem}
.info-list span,.info-list a{font-size:.95rem;color:var(--tx-hi)}
.info-list a:hover{color:var(--gold-400)}

/* ============================================================
   FOOTER
   ============================================================ */
footer{background:var(--ink-900);border-top:1px solid var(--line);padding:var(--sp-6) 0 0}
.foot-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr 1.4fr;gap:var(--sp-4)}
.foot-mark svg{width:118px;height:auto;margin-bottom:1.1rem}
.foot-mark p{font-size:.84rem;color:var(--tx-low);max-width:34ch}
footer h4{
  font-family:var(--sans);font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;
  color:var(--gold-400);margin:0 0 1.2rem;
}
.foot-links{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.foot-links a{font-size:.85rem;color:var(--tx-low);transition:color .3s var(--ease),padding-left .3s var(--ease)}
.foot-links a:hover{color:var(--gold-400);padding-left:5px}

form{display:grid;gap:.75rem}
.field{display:grid;gap:.35rem}
.field label{font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--tx-low)}
.field input,.field textarea{
  background:rgba(255,255,255,.04);border:1px solid var(--line);
  color:var(--tx-hi);padding:.7rem .85rem;font:inherit;font-size:.88rem;
  border-radius:var(--r-sm);transition:border-color .35s var(--ease),background .35s var(--ease);
}
.field input:focus,.field textarea:focus{border-color:var(--gold-600);background:rgba(255,255,255,.06)}
.field textarea{resize:vertical;min-height:78px}
form button{
  margin-top:.35rem;justify-content:center;width:100%;
}
.form-note{font-size:.7rem;color:var(--tx-low);margin:.3rem 0 0}
.form-note[data-state="ok"]{color:var(--gold-400)}

/* ---------- Contact Form 7, dressed as the theme's own form ---------- */
.hd-cf7 .wpcf7-form{display:grid;gap:1rem}
.hd-cf7 .hidden-fields-container{display:none}
.hd-cf7 .wpcf7-form-control-wrap{display:block}
.hd-cf7 .wpcf7-form p,.hd-cf7 .field p{margin:0}
.hd-cf7 .field{gap:0}
.hd-cf7 label br,.hd-cf7 .field br{display:none}
.hd-cf7 label{display:grid;gap:.35rem;font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--tx-low)}
.hd-cf7 input[type="text"],.hd-cf7 input[type="tel"],.hd-cf7 input[type="email"],
.hd-cf7 input[type="date"],.hd-cf7 select,.hd-cf7 textarea{
  width:100%;background:rgba(255,255,255,.04);border:1px solid var(--line);
  color:var(--tx-hi);padding:.7rem .85rem;font:inherit;font-size:.88rem;
  border-radius:var(--r-sm);transition:border-color .35s var(--ease),background .35s var(--ease);
}
.hd-cf7 input:focus,.hd-cf7 select:focus,.hd-cf7 textarea:focus{
  border-color:var(--gold-600);background:rgba(255,255,255,.06);outline:none;
}
.hd-cf7 textarea{resize:vertical;min-height:78px}
.hd-cf7 .wpcf7-submit{
  display:inline-flex;align-items:center;justify-content:center;width:100%;margin-top:.35rem;
  padding:.95rem 2.1rem;border-radius:var(--r-sm);cursor:pointer;
  font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;font-weight:500;
  background:linear-gradient(135deg,var(--gold-500),var(--gold-600));color:var(--on-gold);
  border:1px solid transparent;transition:all .45s var(--ease);
}
.hd-cf7 .wpcf7-submit:hover{
  background:linear-gradient(135deg,var(--gold-400),var(--gold-500));
  transform:translateY(-2px);box-shadow:0 12px 30px -12px rgba(221,168,140,.65);
}
.hd-cf7 .wpcf7-submit:disabled{opacity:.55;transform:none;box-shadow:none;cursor:default}
.hd-cf7 .wpcf7-not-valid-tip{font-size:.68rem;color:var(--danger);margin-top:.3rem}
.hd-cf7 .wpcf7-response-output{
  margin:.9rem 0 0;padding:.7rem .9rem;border:1px solid var(--line);border-radius:var(--r-sm);
  font-size:.72rem;color:var(--tx-low);background:rgba(255,255,255,.03);
}
.hd-cf7 form.sent .wpcf7-response-output{border-color:var(--line-gold);color:var(--gold-400)}
.hd-cf7 form.invalid .wpcf7-response-output,
.hd-cf7 form.failed .wpcf7-response-output{border-color:var(--danger);color:var(--danger)}
.hd-cf7 .wpcf7-spinner{margin:.6rem auto 0;display:block}

.socials{display:flex;gap:.6rem;margin-top:1.3rem}
.socials a{
  width:36px;height:36px;border:1px solid var(--line);display:grid;place-items:center;
  color:var(--tx-low);transition:all .4s var(--ease);border-radius:var(--r-sm);
}
.socials a:hover{border-color:var(--gold-600);color:var(--gold-400);transform:translateY(-3px)}

.colophon{
  margin-top:var(--sp-5);border-top:1px solid var(--line);
  /* extra bottom space so the floating call button never covers the credits */
  padding:1.4rem 0 5.5rem;font-size:.72rem;color:var(--tx-low);
  display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;
}
.colophon a{color:var(--silver-500)}
.colophon a:hover{color:var(--gold-400)}

/* floating call button */
.fab{
  position:fixed;right:20px;bottom:20px;z-index:120;
  width:56px;height:56px;border-radius:50%;
  background:linear-gradient(140deg,var(--gold-400),var(--gold-600));
  color:var(--on-gold);display:grid;place-items:center;
  box-shadow:0 14px 34px -10px rgba(221,168,140,.6);
  transition:transform .4s var(--ease);
}
.fab:hover{transform:scale(1.08)}
.fab::after{
  content:"";position:absolute;inset:0;border-radius:50%;
  border:1px solid var(--gold-500);animation:ping 2.6s ease-out infinite;
}
@keyframes ping{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.7);opacity:0}}

/* ---------- reveal on scroll ----------
   Guarded by .js so content is never hidden when scripting is unavailable. */
.js .rv{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js .rv.in{opacity:1;transform:none}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1024px){
  /* too narrow for one row of cards: three to a row */
  .carousel--svc .carousel__track{grid-template-columns:repeat(3,minmax(0,1fr))}
  /* price/testimonial grids size themselves via auto-fit */
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  :root{--sp-7:4.5rem;--sp-6:3.25rem}
  .nav-links{
    position:fixed;inset:66px 0 auto 0;background:rgba(11,21,40,.985);
    backdrop-filter:blur(18px);
    flex-direction:column;gap:0;padding:1rem 1.5rem 2rem;
    border-bottom:1px solid var(--line);
    transform:translateY(-12px);opacity:0;pointer-events:none;
    transition:opacity .35s var(--ease),transform .35s var(--ease);
    max-height:calc(100vh - 66px);overflow:auto;
  }
  .nav-links.open{opacity:1;transform:none;pointer-events:auto}
  .nav-links li{border-bottom:1px solid var(--line)}
  .nav-links a{display:block;padding:1rem 0;letter-spacing:.22em}
  .burger{display:flex}
  .doctor .grid,.contact .grid{grid-template-columns:1fr}

  .trust ul{grid-template-columns:repeat(2,1fr);gap:1.75rem 1rem}
  .trust li:nth-child(odd){border-left:0}
  .trust li:nth-child(3){border-left:0}
  .portrait{max-width:420px;margin-inline:auto;width:100%}
}
/* On a phone the row becomes a slider showing two treatments at a time. */
@media (max-width:720px){
  .carousel--svc .carousel__track{
    display:flex;grid-template-columns:none;gap:.85rem;
    overflow-x:auto;scroll-snap-type:x mandatory;
    padding:0;margin-inline:0;
  }
  /* Two cards and the gap between them fill the track exactly. A flex item will
     not shrink below its longest word on its own, and Armenian words are long,
     so the minimum is lifted and long words are allowed to break. */
  .carousel--svc .svc{flex:0 0 calc((100% - .85rem) / 2);min-width:0;scroll-snap-align:start}
  .carousel--svc .svc h3,.carousel--svc .svc p{overflow-wrap:break-word}
  .carousel--svc .svc-grid--tight .svc{padding:1.8rem .75rem 1.3rem}
  .carousel--svc .svc-grid--tight .svc svg{width:52px;height:52px}
  /* the long Armenian names fit on their own line at this tracking */
  .carousel--svc .svc-grid--tight .svc h3{font-size:.58rem;letter-spacing:.07em}
  .carousel--svc .carousel__dots{display:flex}
  .carousel--svc .carousel__nav{display:grid;width:38px;height:38px;font-size:19px}
  .carousel--svc .carousel__nav--prev{left:-6px}
  .carousel--svc .carousel__nav--next{right:-6px}
}
@media (max-width:640px){

  .foot-grid{grid-template-columns:1fr}
  .topbar-left{gap:.9rem;font-size:.68rem}
  .hero{min-height:78vh}
  .colophon{justify-content:center;text-align:center}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .rv{opacity:1;transform:none}
}
@media print{
  .nav,.fab,.scroll-cue,.hero-sky{display:none}
  body{background:#fff;color:#000}
}

/* ============================================================
   WORDPRESS — inner pages, posts, widgets, core classes
   ============================================================ */
.page-head{padding:calc(var(--sp-6) + 44px) 0 var(--sp-5);background:var(--ink-850);border-bottom:1px solid var(--line);text-align:center}
.page-head h1{font-size:clamp(2rem,5vw,3rem);color:var(--tx-hi)}
.page-head .eyebrow{margin-bottom:.9rem}
.page-head p{max-width:62ch;margin:1rem auto 0;color:var(--tx-low);font-size:.95rem}

.site-main{padding:var(--sp-6) 0}
.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:var(--sp-5)}
.content-grid.no-aside{grid-template-columns:minmax(0,1fr)}

.entry{background:var(--ink-850);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;transition:border-color .4s var(--ease),transform .4s var(--ease)}
.entry:hover{border-color:var(--line-gold);transform:translateY(-4px)}
.entry-thumb{aspect-ratio:16/9;overflow:hidden;background:var(--ink-800)}
.entry-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.entry:hover .entry-thumb img{transform:scale(1.04)}
.entry-body{padding:1.5rem}
.entry-body h2{font-size:1.35rem;margin-bottom:.5rem}
.entry-body h2 a:hover{color:var(--gold-400)}
.entry-meta{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--tx-low);margin:0 0 .8rem}
.entry-body p{font-size:.88rem;color:var(--tx-low);margin:0}
.entry-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}

.prose{color:var(--tx-mid);font-size:1rem;line-height:1.85}
.prose > * + *{margin-top:1.2rem}
.prose h2{font-size:1.8rem;color:var(--gold-400);margin-top:2.4rem}
.prose h3{font-size:1.35rem;margin-top:2rem}
.prose h4{font-family:var(--sans);font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;color:var(--tx-low);margin-top:1.8rem}
.prose a{color:var(--gold-400);border-bottom:1px solid var(--line-gold)}
.prose a:hover{color:var(--gold-500)}
.prose ul,.prose ol{padding-left:1.3rem;display:grid;gap:.5rem}
.prose li::marker{color:var(--gold-600)}
.prose blockquote{margin:2rem 0;padding:1.2rem 1.6rem;border-left:2px solid var(--gold-600);background:rgba(255,255,255,.03);font-style:italic}
.prose blockquote p{margin:0}
.prose img,.prose figure{border-radius:var(--r-md)}
.prose figcaption{font-size:.74rem;color:var(--tx-low);margin-top:.5rem;text-align:center}
.prose code{background:rgba(255,255,255,.06);padding:.15em .45em;border-radius:var(--r-sm);font-size:.88em}
.prose pre{background:var(--ink-800);border:1px solid var(--line);padding:1.2rem;border-radius:var(--r-md);overflow-x:auto}
.prose pre code{background:none;padding:0}
.prose table{width:100%;border-collapse:collapse;font-size:.9rem}
.prose th,.prose td{border:1px solid var(--line);padding:.6rem .8rem;text-align:left}
.prose th{background:rgba(255,255,255,.04);color:var(--tx-hi);font-weight:500}
.prose hr{border:0;border-top:1px solid var(--line);margin:2.4rem 0}

.aside{display:grid;gap:var(--sp-3);align-content:start}
.widget{background:var(--ink-850);border:1px solid var(--line);border-radius:var(--r-md);padding:1.5rem}
.widget-title{font-family:var(--sans);font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-400);margin:0 0 1.1rem}
.widget ul{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.widget li a{font-size:.86rem;color:var(--tx-low)}
.widget li a:hover{color:var(--gold-400)}

.searchform{display:flex;gap:.5rem}
.searchform input[type=search]{flex:1;background:rgba(255,255,255,.04);border:1px solid var(--line);color:var(--tx-hi);padding:.7rem .85rem;font:inherit;font-size:.88rem;border-radius:var(--r-sm)}
.searchform input[type=search]:focus{border-color:var(--gold-600);outline:none}
.searchform button{border:1px solid var(--line-gold);background:transparent;color:var(--gold-400);padding:0 1rem;border-radius:var(--r-sm)}
.searchform button:hover{background:rgba(221,168,140,.1)}

.pagination{margin-top:var(--sp-5);display:flex;justify-content:center}
.pagination .nav-links{display:flex;gap:.5rem;flex-wrap:wrap}
.pagination .page-numbers{display:grid;place-items:center;min-width:40px;height:40px;padding:0 .6rem;border:1px solid var(--line);color:var(--tx-low);font-size:.8rem;border-radius:var(--r-sm);transition:all .3s var(--ease)}
.pagination .page-numbers:hover{border-color:var(--gold-600);color:var(--gold-400)}
.pagination .page-numbers.current{border-color:var(--gold-500);color:var(--gold-400);background:rgba(221,168,140,.1)}

.post-nav{margin-top:var(--sp-5);padding-top:var(--sp-3);border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.post-nav a{font-size:.8rem;color:var(--tx-low)}
.post-nav a:hover{color:var(--gold-400)}

.notice{background:var(--ink-850);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--sp-4);text-align:center}
.notice h2{font-size:1.5rem;margin-bottom:.7rem}
.notice p{color:var(--tx-low);font-size:.9rem;margin:0 0 1.4rem}

.err-code{font-family:var(--serif);font-size:clamp(5rem,18vw,10rem);line-height:1;color:var(--gold-500);opacity:.35;margin:0}

.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);white-space:nowrap}
.alignleft{float:left;margin:.4rem 1.5rem 1rem 0}
.alignright{float:right;margin:.4rem 0 1rem 1.5rem}
.aligncenter{margin-inline:auto}
.alignwide{width:min(100vw - 2.5rem,1320px);margin-inline:auto}
.alignfull{width:100vw;max-width:100vw;margin-left:calc(50% - 50vw)}
.wp-caption{max-width:100%}
.sticky .entry{border-color:var(--line-gold)}

.admin-bar .nav{top:32px}
.admin-bar .topbar{top:32px}
@media screen and (max-width:782px){
  .admin-bar .nav{top:46px}
  .admin-bar .topbar{top:46px}
}

.form-note[data-state="err"]{color:var(--danger)}
.hd-placeholder{display:grid;place-items:center;width:100%;height:100%;background:linear-gradient(150deg,var(--ink-750),var(--ink-850));color:var(--tx-low);font-size:.7rem;letter-spacing:.24em;text-transform:uppercase}

@media (max-width:900px){
  .content-grid{grid-template-columns:minmax(0,1fr)}
}

/* ============================================================
   SVG ARTWORK COLOURS
   The same tokens are set as presentation attributes on the SVG.
   Safari before 15 ignores var() there, so they are repeated as CSS
   rules, which win over the attribute and keep the palette in one place.
   ============================================================ */
#silver stop:nth-child(1){stop-color:var(--metal-1)}
#silver stop:nth-child(2){stop-color:var(--metal-2)}
#silver stop:nth-child(3){stop-color:var(--metal-3)}
#silver stop:nth-child(4){stop-color:var(--metal-4)}
#goldgrad stop:nth-child(1){stop-color:var(--gold-400)}
#goldgrad stop:nth-child(2){stop-color:var(--gold-600)}

.hd-mark-rule{stroke:var(--metal-rule)}
.hd-mark-text{fill:var(--metal-text)}
.hd-sky-light{fill:var(--gold-400)}

.hd-map-bg{fill:var(--map-bg)}
.hd-map-grid{stroke:var(--map-grid)}
.hd-map-road{stroke:var(--map-road)}
.hd-map-route{stroke:var(--gold-500)}
.hd-map-block{fill:var(--map-block)}
.hd-map-label{fill:var(--map-label)}
.hd-pin-core{fill:var(--ink-850)}

/* single service head icon */
.svc-mark{width:72px;height:72px;margin:0 auto 1.4rem;color:var(--gold-500)}
.svc-mark svg{width:100%;height:100%}
.svc h3 a{transition:color .3s var(--ease)}
.svc h3 a:hover{color:var(--gold-400)}

/* ============================================================
   ABOUT PAGE — story, gallery carousel, team, values
   ============================================================ */
.story{padding:var(--sp-7) 0;background:linear-gradient(180deg,var(--ink-900),var(--ink-850))}
.story__grid{display:grid;grid-template-columns:1.35fr .65fr;gap:var(--sp-5);align-items:start}
.story__text h2{font-size:clamp(1.7rem,3.6vw,2.4rem);color:var(--gold-400);margin-bottom:.3rem}
.story__text .rule{margin:1rem 0 1.6rem}
.story__text p{margin:0 0 1.1rem;font-size:.98rem;line-height:1.85}
.story__figures{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.story__figure{background:var(--ink-800);padding:1.5rem 1.4rem;text-align:center}
.story__figure b{display:block;font-family:var(--serif);font-size:2.1rem;color:var(--gold-400);line-height:1;margin-bottom:.45rem}
.story__figure small{font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;color:var(--tx-low)}

.gal{padding:var(--sp-7) 0;background:var(--ink-850);border-block:1px solid var(--line)}
.staff-section{padding:var(--sp-7) 0;background:linear-gradient(180deg,var(--ink-850),var(--ink-900))}

/* ---------- carousel ---------- */
.carousel{position:relative;margin-top:var(--sp-4)}
.carousel__track{
  display:flex;gap:1.2rem;overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;padding:.25rem;margin:-.25rem;
  scrollbar-width:none;-ms-overflow-style:none;
}
.carousel__track::-webkit-scrollbar{display:none}
.carousel__track:focus-visible{outline:2px solid var(--gold-500);outline-offset:4px}
.carousel__slide{
  flex:0 0 clamp(260px,46%,540px);scroll-snap-align:start;margin:0;
  border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:var(--ink-800);
  transition:border-color .4s var(--ease);
}
.carousel__slide:hover{border-color:var(--line-gold)}
.carousel__slide img,.carousel__slide video{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.carousel__zoom{
  display:block;width:100%;padding:0;border:0;background:none;position:relative;cursor:zoom-in;
}
.carousel__hint{
  position:absolute;right:12px;bottom:12px;width:36px;height:36px;border-radius:50%;
  background:rgba(14,26,49,.8);color:var(--gold-400);display:grid;place-items:center;
  opacity:0;transition:opacity .35s var(--ease);backdrop-filter:blur(6px);
}
.carousel__slide figcaption{
  padding:.85rem 1rem;font-size:.78rem;color:var(--tx-low);border-top:1px solid var(--line);
}
.carousel__nav{
  position:absolute;top:calc(50% - 22px);width:44px;height:44px;border-radius:50%;
  border:1px solid var(--line-gold);background:rgba(14,26,49,.86);color:var(--gold-400);
  font-size:22px;line-height:1;display:grid;place-items:center;z-index:3;
  backdrop-filter:blur(8px);transition:all .35s var(--ease);
}
.carousel__nav:hover{background:var(--gold-500);color:var(--on-gold);border-color:transparent}
.carousel__nav[disabled]{opacity:.25;pointer-events:none}
.carousel__nav--prev{left:-8px}
.carousel__nav--next{right:-8px}
.carousel__dots{display:flex;gap:.5rem;justify-content:center;margin-top:1.5rem}
.carousel__dot{
  width:7px;height:7px;border-radius:50%;border:0;padding:0;
  background:var(--ink-600);transition:all .35s var(--ease);
}
.carousel__dot[aria-current="true"]{background:var(--gold-500);width:22px;border-radius:4px}

@media (hover:hover) and (pointer:fine){
  .carousel__zoom:hover .carousel__hint,.carousel__zoom:focus-visible .carousel__hint{opacity:1}
}

/* ---------- team card ---------- */
.carousel--staff .carousel__slide{flex:0 0 clamp(250px,32%,330px)}
.staff{
  flex:0 0 clamp(250px,32%,330px);scroll-snap-align:start;
  border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;
  background:linear-gradient(170deg,rgba(44,64,102,.5),rgba(20,36,63,.75));
  display:flex;flex-direction:column;transition:border-color .45s var(--ease),transform .45s var(--ease);
}
.staff:hover{border-color:var(--line-gold);transform:translateY(-6px)}
.staff__photo{aspect-ratio:4/5;overflow:hidden;background:var(--photo-bg);position:relative}
.staff__photo img{width:100%;height:100%;object-fit:cover;object-position:50% 12%;transition:transform .7s var(--ease)}
.staff:hover .staff__photo img{transform:scale(1.05)}
.staff__photo::after{
  content:"";position:absolute;inset:auto 0 0 0;height:45%;
  background:linear-gradient(to top,rgba(9,18,36,.9),transparent);
}
.staff__body{padding:1.4rem 1.3rem 1.6rem;display:flex;flex-direction:column;gap:.55rem;flex:1}
.staff__body h3{font-size:1.25rem;color:var(--tx-hi);line-height:1.25}
.staff__role{margin:0;font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-500)}
.staff__bio{margin:.35rem 0 0;font-size:.83rem;color:var(--tx-low);line-height:1.7}
.staff__tags{list-style:none;margin:auto 0 0;padding:.9rem 0 0;display:flex;flex-wrap:wrap;gap:.4rem}
.staff__tags li{
  font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--tx-mid);
  border:1px solid var(--line);padding:.3rem .6rem;border-radius:999px;
}

/* ---------- values ---------- */
.vals{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1.2rem;margin-top:var(--sp-4);text-align:left}
.val{
  border:1px solid var(--line);border-radius:var(--r-md);padding:1.8rem 1.5rem;
  background:linear-gradient(170deg,rgba(44,64,102,.42),rgba(20,36,63,.7));
  transition:border-color .45s var(--ease),transform .45s var(--ease);
}
.val:hover{border-color:var(--line-gold);transform:translateY(-5px)}
.val__icon{display:block;width:46px;height:46px;color:var(--gold-500);margin-bottom:1.1rem}
.val__icon svg{width:100%;height:100%}
.val h3{font-size:1.08rem;color:var(--tx-hi);margin-bottom:.5rem;line-height:1.3}
.val p{margin:0;font-size:.83rem;color:var(--tx-low);line-height:1.7}

/* ---------- lightbox ---------- */
.hd-lb{
  position:fixed;inset:0;z-index:300;display:grid;place-items:center;
  background:rgba(9,18,36,.94);backdrop-filter:blur(10px);padding:4vmin;
  opacity:0;pointer-events:none;transition:opacity .35s var(--ease);
}
.hd-lb.is-open{opacity:1;pointer-events:auto}
.hd-lb img{max-width:100%;max-height:82vh;border-radius:var(--r-md);display:block}
.hd-lb figcaption{margin-top:1rem;text-align:center;font-size:.82rem;color:var(--tx-low)}
.hd-lb__close{
  position:absolute;top:20px;right:24px;width:44px;height:44px;border-radius:50%;
  border:1px solid var(--line);background:rgba(14,26,49,.7);color:var(--tx-hi);
  font-size:24px;line-height:1;display:grid;place-items:center;
}
.hd-lb__close:hover{border-color:var(--gold-600);color:var(--gold-400)}

@media (max-width:900px){
  .story__grid{grid-template-columns:1fr}
  .story__figures{grid-template-columns:repeat(2,1fr)}
  .carousel__nav--prev{left:2px}
  .carousel__nav--next{right:2px}
}
@media (max-width:640px){
  .carousel__slide{flex:0 0 88%}
  .staff{flex:0 0 82%}
  .story__figures{grid-template-columns:1fr 1fr}
}

/* ============================================================
   CERTIFICATES
   Diplomas come in mixed orientations, so they are contained
   inside a fixed frame rather than cropped to fill it.
   ============================================================ */
.certs{padding:var(--sp-7) 0;background:var(--ink-850);border-block:1px solid var(--line)}
.carousel--certs .carousel__track{align-items:stretch}
.cert{
  flex:0 0 clamp(220px,26%,300px);scroll-snap-align:start;margin:0;
  border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;
  background:linear-gradient(170deg,rgba(44,64,102,.45),rgba(20,36,63,.72));
  display:flex;flex-direction:column;
  transition:border-color .45s var(--ease),transform .45s var(--ease);
}
.cert:hover{border-color:var(--line-gold);transform:translateY(-5px)}
.cert__zoom{
  display:block;width:100%;padding:1rem;border:0;background:none;
  position:relative;cursor:zoom-in;
}
.cert__zoom img{
  width:100%;aspect-ratio:3/4;object-fit:contain;display:block;
  filter:drop-shadow(0 10px 24px rgba(0,0,0,.45));
}
.cert figcaption{
  padding:.8rem 1rem 1.1rem;font-size:.74rem;color:var(--tx-low);
  border-top:1px solid var(--line);text-align:center;line-height:1.5;
}
.certs__more{display:flex;justify-content:center;margin-top:var(--sp-4)}
.certs__count{
  display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;
  margin-left:.6rem;border-radius:999px;background:rgba(221,168,140,.16);
  color:var(--gold-400);font-size:.62rem;font-weight:500;
}

@media (max-width:640px){
  .cert{flex:0 0 74%}
}

/* ============================================================
   NAV DROPDOWN
   ============================================================ */
.nav-links li{position:relative}
.nav-links .sub-toggle{
  display:none;border:0;background:none;color:var(--tx-low);
  padding:0 .35rem;font-size:.7rem;line-height:1;transition:color .3s var(--ease);
}
.subnav{
  position:absolute;top:100%;left:50%;transform:translate(-50%,8px);
  min-width:250px;list-style:none;margin:0;padding:.5rem;
  background:rgba(20,36,63,.97);border:1px solid var(--line);
  border-radius:var(--r-md);backdrop-filter:blur(14px);
  box-shadow:0 24px 60px -20px rgba(0,0,0,.85);
  opacity:0;visibility:hidden;pointer-events:none;z-index:60;
  transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s;
}
.subnav::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.subnav a{
  display:block;padding:.6rem .8rem;border-radius:var(--r-sm);
  font-size:.78rem;letter-spacing:.06em;text-transform:none;color:var(--tx-mid);
  white-space:normal;line-height:1.45;
}
.subnav a::after{display:none}
.subnav a:hover,.subnav a:focus-visible,.subnav a.active{background:rgba(221,168,140,.12);color:var(--gold-400)}

@media (hover:hover) and (pointer:fine){
  .has-sub:hover > .subnav{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
}
.has-sub:focus-within > .subnav{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}

/* ============================================================
   SINGLE SERVICE PAGE
   ============================================================ */
.crumbs{
  display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;
  padding-top:calc(var(--sp-5) + 44px);
  font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--tx-low);
}
.crumbs a:hover{color:var(--gold-400)}
.crumbs__current{color:var(--gold-500)}

.svc-hero{
  position:relative;padding-bottom:var(--sp-6);
  background:radial-gradient(120% 80% at 50% 0%,#2c4269 0%,#1b2c4b 42%,#101d35 78%,#0d1830 100%);
  border-bottom:1px solid var(--line);
}
.svc-hero__inner{padding:var(--sp-5) 0 var(--sp-4)}
.svc-hero__mark{width:78px;height:auto;margin:0 auto var(--sp-3);display:block;opacity:.9}
.svc-hero__badge{
  display:inline-flex;align-items:center;gap:.5rem;margin:0 0 1rem;
  padding:.4rem 1rem;border:1px solid var(--line-gold);border-radius:999px;
  font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-400);
}
.svc-hero__star{color:var(--gold-500);font-size:.6rem}
.svc-hero h1{font-size:clamp(1.9rem,4.6vw,3.1rem);color:var(--tx-hi);margin-bottom:.2rem}
.svc-hero__lede{max-width:62ch;margin:1.2rem auto 2rem;color:var(--tx-mid);font-size:1rem}

.svc-stats{
  list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;
  background:rgba(20,36,63,.55);backdrop-filter:blur(8px);
}
.svc-stats li{padding:1.5rem 1.2rem;text-align:center;border-right:1px solid var(--line)}
.svc-stats li:last-child{border-right:0}
.svc-stats b{display:block;font-family:var(--serif);font-size:1.9rem;color:var(--gold-400);line-height:1;margin-bottom:.45rem}
.svc-stats small{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--tx-low)}

.svc-process{padding:var(--sp-7) 0;background:var(--ink-850)}
.svc-process__grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:var(--sp-5);align-items:start}
.svc-process__photo{margin:0 0 1.2rem;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.svc-process__photo img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.spec{
  display:flex;gap:.9rem;align-items:flex-start;margin-bottom:.8rem;
  padding:1.1rem 1.2rem;border:1px solid var(--line);border-radius:var(--r-md);
  background:linear-gradient(170deg,rgba(44,64,102,.42),rgba(20,36,63,.7));
}
.spec__icon{flex:0 0 20px;color:var(--gold-500);margin-top:.15rem}
.spec b{display:block;color:var(--tx-hi);font-family:var(--sans);font-size:.86rem;font-weight:500;margin-bottom:.3rem}
.spec p{margin:0;font-size:.8rem;color:var(--tx-low);line-height:1.65}
.svc-process__steps h2{font-size:clamp(1.6rem,3.4vw,2.2rem);color:var(--gold-400)}
.svc-process__steps .rule{margin:1rem 0 2rem}

.steps{list-style:none;margin:0;padding:0;display:grid;gap:1rem}
.step{
  display:flex;gap:1.2rem;padding:1.4rem 1.5rem;
  border:1px solid var(--line);border-left:2px solid var(--gold-600);border-radius:var(--r-md);
  background:linear-gradient(170deg,rgba(44,64,102,.38),rgba(20,36,63,.66));
  transition:border-color .4s var(--ease),transform .4s var(--ease);
}
.step:hover{border-color:var(--line-gold);border-left-color:var(--gold-400);transform:translateX(4px)}
.step__no{
  flex:0 0 auto;font-family:var(--serif);font-size:1.6rem;color:var(--gold-500);
  line-height:1;opacity:.8;min-width:2ch;
}
.step h3{font-size:1.05rem;color:var(--tx-hi);margin-bottom:.4rem;line-height:1.35}
.step p{margin:0;font-size:.85rem;color:var(--tx-low);line-height:1.7}

/* ---------- before / after ---------- */
.svc-results{padding:var(--sp-7) 0;background:var(--ink-900)}
.ba{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--sp-4);margin-top:var(--sp-4);align-items:stretch}
.ba__stage{
  position:relative;overflow:hidden;border:1px solid var(--line);border-radius:var(--r-md);
  aspect-ratio:4/3;background:var(--photo-bg);user-select:none;touch-action:pan-y;
}
.ba__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ba__after{position:absolute;inset:0;width:50%;overflow:hidden;will-change:width}
.ba__after .ba__img{width:var(--ba-w,100%);max-width:none}
.ba__label{
  position:absolute;bottom:14px;padding:.35rem .8rem;border-radius:2px;
  font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;
  background:rgba(9,18,36,.8);border:1px solid var(--line);color:var(--tx-mid);backdrop-filter:blur(4px);
}
.ba__label--before{left:14px}
.ba__label--after{right:14px;color:var(--gold-400);border-color:var(--line-gold)}
.ba__handle{
  position:absolute;top:0;bottom:0;left:50%;width:2px;background:var(--gold-400);
  transform:translateX(-50%);cursor:ew-resize;z-index:3;
}
.ba__handle:focus-visible{outline:2px solid var(--gold-400);outline-offset:6px}
.ba__grip{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:42px;height:42px;border-radius:50%;
  background:var(--gold-400);border:2px solid var(--ink-900);
  box-shadow:0 8px 24px rgba(0,0,0,.5);
}
.ba__grip::before,.ba__grip::after{
  content:"";position:absolute;top:50%;width:0;height:0;
  border-top:5px solid transparent;border-bottom:5px solid transparent;
}
.ba__grip::before{left:9px;border-right:7px solid var(--on-gold);transform:translateY(-50%)}
.ba__grip::after{right:9px;border-left:7px solid var(--on-gold);transform:translateY(-50%)}
.ba__hint{
  position:absolute;top:14px;left:50%;transform:translateX(-50%);margin:0;
  padding:.35rem .9rem;border-radius:999px;background:rgba(9,18,36,.75);
  font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--tx-mid);
  transition:opacity .4s var(--ease);backdrop-filter:blur(4px);
}
.ba.is-touched .ba__hint{opacity:0}

.ba__panel{
  border:1px solid var(--line);border-radius:var(--r-md);padding:var(--sp-3);
  background:linear-gradient(170deg,rgba(44,64,102,.42),rgba(20,36,63,.72));
  display:flex;flex-direction:column;gap:.7rem;
}
.ba__panel h3{font-size:1.35rem;color:var(--tx-hi);line-height:1.3}
.ba__text{margin:0;font-size:.86rem;color:var(--tx-low);line-height:1.75}
.ba__facts{margin:.6rem 0 0;display:grid;gap:.1rem}
.ba__facts > div{display:flex;justify-content:space-between;gap:1rem;padding:.7rem 0;border-bottom:1px dashed var(--line)}
.ba__facts dt{font-size:.78rem;color:var(--tx-low)}
.ba__facts dd{margin:0;font-size:.78rem;color:var(--gold-400);text-align:right}
.ba__doctor{display:flex;align-items:center;gap:.5rem;margin:auto 0 0;padding-top:1rem;font-size:.76rem;color:var(--tx-mid)}
.ba__doctor svg{color:var(--gold-500);flex:0 0 16px}

.ba__thumbs{list-style:none;margin:var(--sp-4) 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1rem}
.ba__thumb{
  display:flex;gap:.9rem;align-items:center;width:100%;text-align:left;
  padding:.6rem;border:1px solid var(--line);border-radius:var(--r-md);
  background:rgba(20,36,63,.55);transition:all .4s var(--ease);
}
.ba__thumb:hover{border-color:var(--line-gold)}
.ba__thumb[aria-pressed="true"]{border-color:var(--gold-500);background:rgba(221,168,140,.1)}
.ba__thumb-img{flex:0 0 62px;height:52px;border-radius:var(--r-sm);background-size:cover;background-position:center}
.ba__thumb-body{display:flex;flex-direction:column;gap:.2rem;min-width:0}
.ba__thumb-body small{font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-500)}
.ba__thumb-body strong{font-family:var(--sans);font-weight:400;font-size:.8rem;color:var(--tx-hi);line-height:1.3}

/* ---------- price table ---------- */
.svc-prices{padding:var(--sp-7) 0;background:var(--ink-850)}
.ptable{margin-top:var(--sp-4);border:1px solid var(--line);border-radius:var(--r-md);overflow-x:auto}
.ptable table{width:100%;border-collapse:collapse;min-width:640px}
.ptable th{
  padding:1rem 1.2rem;text-align:left;background:rgba(9,18,36,.5);
  font-family:var(--sans);font-weight:400;font-size:.6rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--tx-low);border-bottom:1px solid var(--line);
}
.ptable td{padding:1.2rem;border-bottom:1px solid var(--line);vertical-align:middle}
.ptable tr:last-child td{border-bottom:0}
.ptable tbody tr{transition:background .3s var(--ease)}
.ptable tbody tr:hover{background:rgba(221,168,140,.04)}
.ptable td strong{display:block;font-family:var(--sans);font-weight:500;font-size:.92rem;color:var(--tx-hi);margin-bottom:.25rem}
.ptable td span{font-size:.76rem;color:var(--tx-low)}
.ptable__material{font-size:.78rem;color:var(--tx-mid);white-space:nowrap}
.ptable__now{font-size:1rem;color:var(--gold-400);white-space:nowrap;font-variant-numeric:tabular-nums}

.finance{
  display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap;
  margin-top:var(--sp-3);padding:1.5rem 1.8rem;
  border:1px solid var(--line-gold);border-radius:var(--r-md);
  background:linear-gradient(140deg,rgba(221,168,140,.1),rgba(20,36,63,.6));
}
.finance__icon{flex:0 0 auto;color:var(--gold-400)}
.finance > div{flex:1;min-width:220px}
.finance b{display:block;font-family:var(--sans);font-weight:500;font-size:.96rem;color:var(--tx-hi);margin-bottom:.25rem}
.finance p{margin:0;font-size:.8rem;color:var(--tx-low)}

/* ---------- booking ---------- */
.svc-book{padding:var(--sp-7) 0;background:linear-gradient(180deg,var(--ink-900),var(--ink-850))}
.svc-book__grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-5);align-items:start}
.svc-book__side h2{font-size:clamp(1.6rem,3.4vw,2.2rem);color:var(--gold-400)}
.svc-book__side .rule{margin:1rem 0 1.4rem}
.svc-book__lede{color:var(--tx-mid);font-size:.95rem;margin:0}
.svc-book__form{
  border:1px solid var(--line);border-radius:var(--r-md);padding:var(--sp-4);
  background:linear-gradient(170deg,rgba(44,64,102,.42),rgba(20,36,63,.75));
}

@media (max-width:1024px){
  .svc-process__grid,.ba,.svc-book__grid{grid-template-columns:1fr}
  .ba__stage{aspect-ratio:16/10}
}
@media (max-width:860px){
  .nav-links .sub-toggle{
    display:block;position:absolute;right:0;top:.35rem;
    width:38px;height:38px;font-size:.9rem;color:var(--tx-mid);
  }
  .nav-links .has-sub > a{padding-right:44px}
  .subnav{
    position:static;transform:none;opacity:1;visibility:visible;pointer-events:auto;
    min-width:0;max-height:0;overflow:hidden;padding:0 0 0 1rem;margin:0;
    background:none;border:0;box-shadow:none;backdrop-filter:none;
    transition:max-height .4s var(--ease),padding .4s var(--ease);
  }
  .has-sub.is-open > .subnav{max-height:600px;padding:0 0 .6rem 1rem}
  .has-sub:focus-within > .subnav{transform:none}
  .subnav a{padding:.7rem 0;font-size:.75rem;letter-spacing:.14em}
  .svc-stats li{border-right:0;border-bottom:1px solid var(--line)}
}
