/* ============================================================
   Ofiyat Med — stylesheet

   Palette built from the clinic's supplied logo (assets/logo.svg):
   a crescent moon with an ECG trace and terminal ring, in #E2231A.
   That red is --brand-600; --brand-700 is a deepened form used for
   text and buttons, where #E2231A alone only reaches 4.7:1 on white.
   ============================================================ */

:root{
  --brand-950:#3A0705;   /* footer                              */
  --brand-900:#6B0D08;   /* dark bands                          */
  --brand-800:#97130C;
  --brand-700:#BD180F;   /* primary actions (6.4:1 on white)    */
  --brand-600:#E2231A;   /* the logo red                        */
  --brand-500:#EE4A3E;
  --brand-100:#FBD5D2;
  --brand-50:#FEF3F2;

  --ink:#1A0B09;
  --ink-2:#54423F;
  --ink-3:#8B7572;

  --bg:#FFFFFF;
  --surface:#FBF7F6;
  --line:#F1E5E3;

  --gold:#D99C2B;
  --tg:#229ED9;

  --r-sm:10px;
  --r:16px;
  --r-lg:22px;
  --r-xl:28px;

  --sh-1:0 1px 2px rgba(26,11,9,.05), 0 4px 14px rgba(26,11,9,.05);
  --sh-2:0 2px 6px rgba(26,11,9,.06), 0 16px 40px rgba(26,11,9,.09);
  --sh-3:0 30px 70px rgba(58,7,5,.22);

  --wrap:1200px;
  --gut:clamp(16px, 4vw, 32px);

  --ease:cubic-bezier(.4,.14,.3,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:92px; -webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color:var(--ink);
  background:var(--bg);
  font-size:16px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
img,svg,iframe{max-width:100%}
h1,h2,h3,h4{margin:0; line-height:1.16; letter-spacing:-.021em; font-weight:800}
p{margin:0}
ul{margin:0; padding:0; list-style:none}
a{color:inherit; text-decoration:none}
button{font:inherit; color:inherit}
dialog{border:0; padding:0}

.wrap{width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gut)}
.wrap--narrow{max-width:820px}
.muted{color:var(--ink-3)}
.centered{text-align:center}

.ico{width:20px; height:20px; flex:none; display:block}

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--brand-700); color:#fff; padding:12px 18px; border-radius:0 0 var(--r-sm) 0;
}
.skip-link:focus{left:0}

:where(a,button,summary,[tabindex]):focus-visible{
  outline:3px solid var(--brand-500); outline-offset:3px; border-radius:6px;
}

/* ── Buttons ──────────────────────────────────────────────── */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:12px 20px; border-radius:999px; border:1.5px solid transparent;
  font-weight:700; font-size:.94rem; letter-spacing:-.005em;
  cursor:pointer; white-space:nowrap;
  transition:transform .18s var(--ease), box-shadow .18s var(--ease),
             background-color .18s var(--ease), color .18s var(--ease), border-color .18s var(--ease);
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn--lg{padding:15px 27px; font-size:1rem}
.btn--primary{background:var(--brand-700); color:#fff; box-shadow:0 6px 18px rgba(189,24,15,.30)}
.btn--primary:hover{background:var(--brand-600); box-shadow:0 10px 26px rgba(189,24,15,.36)}
.btn--outline{border-color:var(--line); background:#fff; color:var(--ink)}
.btn--outline:hover{border-color:var(--brand-600); color:var(--brand-700)}
.btn--ghost{background:transparent; color:var(--ink); padding:10px 14px}
.btn--ghost:hover{color:var(--brand-700)}
.btn--white{background:#fff; color:var(--brand-800)}
.btn--white:hover{background:var(--brand-50)}
.btn--onDark{border-color:rgba(255,255,255,.34); color:#fff}
.btn--onDark:hover{background:rgba(255,255,255,.12)}

.eyebrow{
  font-size:.78rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase;
  color:var(--brand-700); margin-bottom:12px;
}

/* ── Topbar ───────────────────────────────────────────────── */
.topbar{background:var(--brand-900); color:#F5CFC9; font-size:.83rem}
.topbar__inner{display:flex; align-items:center; gap:22px; min-height:40px; flex-wrap:wrap}
.topbar__item{display:inline-flex; align-items:center; gap:7px}
.topbar__item .ico{width:15px; height:15px; opacity:.7}
.langs{margin-left:auto; display:flex; gap:3px}
.lang{
  background:transparent; border:0; padding:5px 10px; border-radius:7px;
  font-size:.78rem; font-weight:700; letter-spacing:.06em; color:#D89C93; cursor:pointer;
  transition:background-color .15s, color .15s;
}
.lang:hover{color:#fff; background:rgba(255,255,255,.09)}
.lang.is-on{background:var(--brand-600); color:#fff}

/* ── Header ───────────────────────────────────────────────── */
.hdr{
  position:sticky; top:0; z-index:60; background:rgba(255,255,255,.86);
  backdrop-filter:blur(14px) saturate(1.6); -webkit-backdrop-filter:blur(14px) saturate(1.6);
  border-bottom:1px solid transparent; transition:border-color .2s, box-shadow .2s;
}
.hdr.is-stuck{border-bottom-color:var(--line); box-shadow:0 4px 20px rgba(26,11,9,.05)}
.hdr__inner{display:flex; align-items:center; gap:20px; min-height:74px}

.brand{display:inline-flex; align-items:center; gap:11px; flex:none}
.brand__mark{width:42px; height:42px; color:var(--brand-600)}
.brand__txt{display:flex; flex-direction:column; line-height:1.1}
.brand__txt strong{font-size:1.05rem; font-weight:800; letter-spacing:.03em}
.brand__txt em{font-style:normal; font-size:.7rem; font-weight:600; letter-spacing:.09em;
  text-transform:uppercase; color:var(--ink-3)}

.nav{display:flex; gap:4px; margin-left:8px}
.nav a{
  padding:9px 13px; border-radius:9px; font-size:.9rem; font-weight:600; color:var(--ink-2);
  white-space:nowrap; transition:background-color .15s, color .15s;
}
.nav a:hover{background:var(--brand-50); color:var(--brand-700)}
.nav a.is-active{color:var(--brand-700)}

.hdr__cta{margin-left:auto; display:flex; align-items:center; gap:10px}
.btn--phone span{font-variant-numeric:tabular-nums; font-weight:700}

.burger{display:none; background:none; border:0; width:42px; height:42px; padding:9px; cursor:pointer}
.burger span{display:block; height:2px; background:var(--ink); border-radius:2px; margin:4px 0;
  transition:transform .25s var(--ease), opacity .2s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* ── Hero ─────────────────────────────────────────────────── */
.hero{position:relative; overflow:hidden; padding:clamp(48px,7vw,84px) 0 clamp(56px,7vw,92px)}
.hero__bg{
  position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(900px 460px at 78% -12%, rgba(226,35,26,.14), transparent 62%),
    radial-gradient(700px 420px at 4% 8%, rgba(151,19,12,.10), transparent 60%),
    linear-gradient(180deg,#fff 0%, var(--brand-50) 100%);
}
.hero__bg::after{
  content:""; position:absolute; inset:0;
  background-image:radial-gradient(circle, rgba(151,19,12,.09) 1px, transparent 1px);
  background-size:26px 26px; mask-image:linear-gradient(180deg,#000,transparent 70%);
  -webkit-mask-image:linear-gradient(180deg,#000,transparent 70%);
}
.hero__inner{display:grid; grid-template-columns:1.35fr .95fr; gap:clamp(28px,4vw,56px); align-items:center}
.hero__title{font-size:clamp(2.05rem,4.6vw,3.5rem); margin-bottom:20px; max-width:15ch}
.hero__lead{font-size:clamp(1rem,1.25vw,1.14rem); color:var(--ink-2); max-width:56ch; margin-bottom:30px}
.hero__actions{display:flex; flex-wrap:wrap; gap:12px; margin-bottom:30px}
.hero__badges{display:flex; flex-wrap:wrap; gap:10px 22px}
.hero__badges li{display:inline-flex; align-items:center; gap:8px; font-size:.9rem; font-weight:600; color:var(--ink-2)}
.hero__badges .ico{width:17px; height:17px; color:var(--brand-600)}

.hero__card{
  background:#fff; border:1px solid var(--line); border-radius:var(--r-xl);
  padding:clamp(20px,2.4vw,28px); box-shadow:var(--sh-2);
}
.hero__cardTitle{font-size:1.16rem; margin-bottom:6px}
.hero__cardLead{font-size:.9rem; color:var(--ink-3); margin-bottom:18px}
.hero__row{
  display:flex; align-items:center; gap:13px; padding:13px; border-radius:var(--r);
  border:1px solid var(--line); margin-bottom:9px; background:#fff;
  transition:border-color .18s, background-color .18s, transform .18s var(--ease);
}
.hero__row:last-of-type{margin-bottom:0}
.hero__row:hover{border-color:var(--brand-500); background:var(--brand-50); transform:translateX(3px)}
.hero__rowIco{
  width:42px; height:42px; flex:none; border-radius:12px; display:grid; place-items:center;
  background:var(--brand-50); color:var(--brand-700);
}
.hero__rowIco--tg{background:rgba(34,158,217,.12); color:var(--tg)}
.hero__rowTxt{display:flex; flex-direction:column; line-height:1.35; min-width:0}
.hero__rowTxt strong{font-size:.93rem}
.hero__rowTxt em{font-style:normal; font-size:.84rem; color:var(--ink-3); font-variant-numeric:tabular-nums}
.hero__rowArrow{margin-left:auto; color:var(--ink-3); width:18px; height:18px}

/* ── Stats ────────────────────────────────────────────────── */
.stats{background:var(--brand-900); color:#fff; padding:clamp(26px,3vw,38px) 0}
.stats__grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; text-align:center}
.stat b{display:block; font-size:clamp(1.7rem,3vw,2.4rem); font-weight:800; letter-spacing:-.03em; color:#fff}
.stat span{font-size:.85rem; color:#EBAAA2; font-weight:600}

/* ── Sections ─────────────────────────────────────────────── */
.sec{padding:clamp(56px,7vw,96px) 0}
.sec--tint{background:var(--surface)}
.sec__head{max-width:720px; margin-bottom:clamp(28px,3.5vw,46px)}
.sec__title{font-size:clamp(1.6rem,3.1vw,2.35rem); margin-bottom:14px}
.sec__lead{color:var(--ink-2); font-size:1.03rem}

/* ── Service cards ────────────────────────────────────────── */
.cards{display:grid; grid-template-columns:repeat(auto-fill,minmax(268px,1fr)); gap:16px}
.card{
  text-align:left; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg);
  padding:22px; cursor:pointer; position:relative; overflow:hidden;
  transition:transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s;
}
.card::after{
  content:""; position:absolute; inset:auto -30% -60% auto; width:150px; height:150px;
  background:radial-gradient(circle, rgba(226,35,26,.15), transparent 70%);
  opacity:0; transition:opacity .25s;
}
.card:hover{transform:translateY(-4px); box-shadow:var(--sh-2); border-color:var(--brand-100)}
.card:hover::after{opacity:1}
.card__ico{
  width:46px; height:46px; border-radius:13px; display:grid; place-items:center;
  background:var(--brand-50); color:var(--brand-700); margin-bottom:15px;
}
.card__ico .ico{width:23px; height:23px}
.card__title{font-size:1.03rem; margin-bottom:7px}
.card__desc{font-size:.89rem; color:var(--ink-3); line-height:1.55}
.card__more{
  margin-top:14px; display:inline-flex; align-items:center; gap:6px;
  font-size:.83rem; font-weight:700; color:var(--brand-700);
  background:none; border:0; padding:0; cursor:pointer; font-family:inherit;
}
.card__more .ico{width:15px; height:15px; transition:transform .2s var(--ease)}
.card:hover .card__more .ico{transform:translateX(4px)}

/* ── Split panels ─────────────────────────────────────────── */
.split{display:grid; grid-template-columns:1fr 1fr; gap:18px}
.panel{background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:clamp(20px,2.4vw,30px)}
.panel__title{display:flex; align-items:center; gap:11px; font-size:1.16rem; margin-bottom:18px}
.panel__title .ico{width:23px; height:23px; color:var(--brand-600)}
.panel__note{margin-top:16px; padding-top:16px; border-top:1px dashed var(--line);
  font-size:.85rem; color:var(--ink-3)}

.ticks{display:grid; gap:9px}
.ticks li{position:relative; padding-left:27px; font-size:.93rem; color:var(--ink-2)}
.ticks li::before{
  content:""; position:absolute; left:0; top:.5em; width:16px; height:16px; border-radius:50%;
  background:var(--brand-100) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23BD180F' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 6'/%3E%3C/svg%3E") center/10px no-repeat;
}

/* ── Floors ───────────────────────────────────────────────── */
.floors{display:grid; gap:10px}
.floor{
  display:grid; grid-template-columns:76px 1fr; align-items:center; gap:22px;
  background:#fff; border:1px solid var(--line); border-radius:var(--r);
  padding:16px 22px; position:relative; overflow:hidden;
  transition:transform .2s var(--ease), border-color .2s, box-shadow .2s;
}
.floor:hover{transform:translateX(5px); border-color:var(--brand-100); box-shadow:var(--sh-1)}
.floor__n{
  font-size:1.12rem; font-weight:800; color:var(--brand-700); letter-spacing:-.02em;
  padding:7px 0; text-align:center; background:var(--brand-50); border-radius:10px;
}
.floor__b{display:flex; flex-direction:column; gap:3px}
.floor__t{font-size:1rem; font-weight:700}
.floor__d{font-size:.88rem; color:var(--ink-3)}

/* ── Features ─────────────────────────────────────────────── */
.feats{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:16px}
.feat{background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:24px}
.feat__ico{
  width:44px; height:44px; border-radius:12px; display:grid; place-items:center;
  background:linear-gradient(135deg,var(--brand-600),var(--brand-800)); color:#fff; margin-bottom:15px;
}
.feat__ico .ico{width:22px; height:22px}
.feat h3{font-size:1rem; margin-bottom:7px}
.feat p{font-size:.89rem; color:var(--ink-3)}

/* ── Doctors ──────────────────────────────────────────────── */
.chips{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:26px}
.chip{
  padding:8px 16px; border-radius:999px; border:1.5px solid var(--line); background:#fff;
  font-size:.85rem; font-weight:600; color:var(--ink-2); cursor:pointer;
  transition:border-color .16s, color .16s, background-color .16s;
}
.chip:hover{border-color:var(--brand-500); color:var(--brand-700)}
.chip.is-on{background:var(--brand-700); border-color:var(--brand-700); color:#fff}

.docs{display:grid; grid-template-columns:repeat(auto-fill,minmax(258px,1fr)); gap:16px; margin-bottom:26px}
.doc{
  background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:22px;
  display:flex; flex-direction:column; gap:5px;
  transition:transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s;
}
.doc:hover{transform:translateY(-3px); box-shadow:var(--sh-2); border-color:var(--brand-100)}
.doc__av{
  width:52px; height:52px; border-radius:50%; display:grid; place-items:center; margin-bottom:11px;
  background:linear-gradient(135deg,var(--brand-100),var(--brand-50));
  color:var(--brand-800); font-weight:800; font-size:1.02rem; letter-spacing:.02em;
}
.doc__name{font-size:1rem; font-weight:700; line-height:1.32}
.doc__spec{font-size:.87rem; color:var(--brand-700); font-weight:600}
.doc__meta{display:flex; flex-wrap:wrap; gap:6px; margin-top:9px}
.tag{
  font-size:.75rem; font-weight:700; padding:4px 10px; border-radius:999px;
  background:var(--surface); color:var(--ink-2); border:1px solid var(--line);
}
.tag--top{background:#FDF6E7; color:#8A6115; border-color:#F0E0BC}

/* ── Reviews ──────────────────────────────────────────────── */
.ratings{display:flex; flex-wrap:wrap; gap:14px; margin-bottom:26px}
.ratings .rating{
  display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--line);
  border-radius:var(--r); padding:15px 22px; transition:border-color .18s, transform .18s var(--ease);
}
.ratings .rating:hover{border-color:var(--brand-500); transform:translateY(-2px)}
.rating b{font-size:1.55rem; font-weight:800; letter-spacing:-.03em}
.rating__stars{color:var(--gold); letter-spacing:.06em; font-size:.95rem}
.rating em{font-style:normal; font-size:.83rem; color:var(--ink-3)}

.quotes{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px}
.quote{background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:24px;
  display:flex; flex-direction:column}
.quote__stars{color:var(--gold); font-size:.92rem; letter-spacing:.08em; margin-bottom:11px}
.quote__txt{font-size:.94rem; color:var(--ink-2); line-height:1.65; flex:1}
.quote__by{margin-top:15px; font-size:.83rem; font-weight:700}
.quote__src{font-size:.78rem; color:var(--ink-3); font-weight:500}

/* ── FAQ ──────────────────────────────────────────────────── */
.faq{display:grid; gap:10px}
.faq details{background:#fff; border:1px solid var(--line); border-radius:var(--r); overflow:hidden}
.faq details[open]{border-color:var(--brand-100); box-shadow:var(--sh-1)}
.faq summary{
  list-style:none; cursor:pointer; padding:18px 54px 18px 22px; position:relative;
  font-weight:700; font-size:.98rem;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:""; position:absolute; right:22px; top:50%; width:11px; height:11px;
  border-right:2.2px solid var(--brand-700); border-bottom:2.2px solid var(--brand-700);
  transform:translateY(-70%) rotate(45deg); transition:transform .22s var(--ease);
}
.faq details[open] summary::after{transform:translateY(-25%) rotate(-135deg)}
.faq p{padding:0 22px 20px; color:var(--ink-2); font-size:.93rem}

/* ── Contact ──────────────────────────────────────────────── */
.contact{display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:start}
.contact__info{display:grid; gap:10px}
.ccard{
  display:flex; gap:15px; align-items:flex-start; background:#fff; border:1px solid var(--line);
  border-radius:var(--r-lg); padding:20px;
  transition:border-color .18s, transform .18s var(--ease), box-shadow .18s;
}
.ccard:not(.ccard--static):hover{border-color:var(--brand-500); transform:translateY(-2px); box-shadow:var(--sh-1)}
.ccard--tg .ccard__ico{background:rgba(34,158,217,.12); color:var(--tg)}
.ccard__ico{width:44px; height:44px; flex:none; border-radius:12px; display:grid; place-items:center;
  background:var(--brand-50); color:var(--brand-700)}
.ccard__body{display:flex; flex-direction:column; gap:3px; min-width:0}
.ccard__body strong{font-size:.97rem}
.ccard__body em{font-style:normal; font-size:.88rem; color:var(--ink-2)}
.ccard__arrow{margin-left:auto; align-self:center; color:var(--ink-3); width:18px; height:18px}
.phones{display:grid; gap:2px; margin-top:3px}
.phones a{font-size:.9rem; font-weight:600; font-variant-numeric:tabular-nums; color:var(--ink-2)}
.phones a:hover{color:var(--brand-700)}
.phones i{font-style:normal; font-weight:500; color:var(--ink-3); font-size:.83rem}

.socials{display:flex; gap:9px; flex-wrap:wrap; margin-top:2px}
.socials a{
  display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border-radius:999px;
  border:1px solid var(--line); background:#fff; font-size:.87rem; font-weight:600;
  transition:border-color .16s, color .16s, transform .16s var(--ease);
}
.socials a:hover{border-color:var(--brand-500); color:var(--brand-700); transform:translateY(-2px)}

.contact__map{
  border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line);
  height:100%; min-height:460px; background:var(--brand-50);
}
.contact__map iframe{display:block; height:100%; min-height:460px; border:0}

/* ── Final CTA ────────────────────────────────────────────── */
.cta{
  padding:clamp(44px,5vw,68px) 0; color:#fff;
  background:linear-gradient(135deg,var(--brand-800) 0%, var(--brand-900) 62%, var(--brand-950) 100%);
  position:relative; overflow:hidden;
}
.cta::before{
  content:""; position:absolute; inset:-40% 55% 40% -10%;
  background:radial-gradient(circle, rgba(226,35,26,.28), transparent 65%);
}
.cta__inner{position:relative; display:flex; align-items:center; justify-content:space-between;
  gap:28px; flex-wrap:wrap}
.cta__title{font-size:clamp(1.45rem,2.6vw,2rem); margin-bottom:8px}
.cta__lead{color:#F0B6AD; max-width:46ch}
.cta__actions{display:flex; gap:11px; flex-wrap:wrap}

/* ── Footer ───────────────────────────────────────────────── */
.ftr{background:var(--brand-950); color:#CB9C94; padding:clamp(38px,4vw,56px) 0 26px; font-size:.9rem}
.ftr__inner{display:grid; grid-template-columns:1.3fr 1fr 1.2fr; gap:32px; padding-bottom:28px;
  border-bottom:1px solid rgba(255,255,255,.09)}
.ftr .brand__txt strong{color:#fff}
.ftr .brand__txt em{color:#AC7570}
.ftr__slogan{margin-top:12px; max-width:34ch; color:#CB9C94}
.ftr__nav{display:grid; gap:9px; align-content:start}
.ftr__nav a{transition:color .15s}
.ftr__nav a:hover{color:#fff}
.ftr__contact{display:grid; gap:9px; align-content:start}
.ftr__contact a{color:#fff; font-weight:700; font-size:1.02rem; font-variant-numeric:tabular-nums}
.ftr__legal{display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap;
  padding-top:20px; font-size:.8rem; color:#9F6D67}

/* Authorship notice — its own band so it reads as separate from the clinic's
   own copyright line above it, and stays legible rather than fading out. */
.ftr__credit{
  margin-top:24px; background:rgba(0,0,0,.28);
  border-top:2px solid var(--brand-600);
}
.ftr__creditInner{
  display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap;
  padding-block:16px;
}
.ftr__creditBy{font-size:.9rem; color:#E6C9C4}
.ftr__creditBy a{
  color:#fff; font-weight:800; margin-left:5px;
  border-bottom:1px solid var(--brand-500); padding-bottom:1px;
  transition:color .16s, border-color .16s;
}
.ftr__creditBy a:hover{color:var(--brand-500)}
.ftr__creditRights{font-size:.78rem; color:#A9827C}

/* ── FAB ──────────────────────────────────────────────────── */
.fab{
  position:fixed; right:16px; bottom:16px; z-index:70; display:none;
  align-items:center; gap:9px; padding:14px 22px; border-radius:999px;
  background:var(--tg); color:#fff; font-weight:700; font-size:.93rem;
  box-shadow:0 10px 30px rgba(34,158,217,.42);
}

/* ── Modal ────────────────────────────────────────────────── */
.modal{
  width:min(560px,calc(100vw - 32px)); border-radius:var(--r-xl); padding:clamp(24px,3vw,34px);
  box-shadow:var(--sh-3); color:var(--ink); background:#fff;
}
.modal::backdrop{background:rgba(6,31,34,.55); backdrop-filter:blur(3px)}
.modal__x{
  position:absolute; top:14px; right:16px; width:36px; height:36px; border-radius:50%;
  border:0; background:var(--surface); font-size:1.5rem; line-height:1; cursor:pointer; color:var(--ink-2);
  transition:background-color .16s;
}
.modal__x:hover{background:var(--brand-100)}
.modal__title{font-size:1.35rem; margin-bottom:9px; padding-right:36px}
.modal__lead{color:var(--ink-2); font-size:.94rem; margin-bottom:20px}
.modal__foot{display:flex; gap:10px; flex-wrap:wrap; margin-top:24px; padding-top:20px;
  border-top:1px solid var(--line)}

/* ── Reveal on scroll ─────────────────────────────────────── */
.reveal{opacity:0; transform:translateY(18px)}
.reveal.is-in{opacity:1; transform:none; transition:opacity .6s var(--ease), transform .6s var(--ease)}

/* ── Responsive ───────────────────────────────────────────── */
/* Russian nav labels are the widest — drop the phone button before the nav wraps.
   Measured: RU needs ~1324px of header content, so hide it below 1360 for margin. */
@media (max-width:1360px){
  .btn--phone{display:none}
}
@media (max-width:1180px){
  .nav{display:none}
  .burger{display:block; margin-left:auto}
  .hdr__cta{margin-left:0}
  .nav.is-open{
    display:flex; flex-direction:column; gap:2px; position:absolute; left:0; right:0; top:100%;
    background:#fff; border-bottom:1px solid var(--line); padding:12px var(--gut) 18px;
    box-shadow:var(--sh-2); margin:0;
  }
  .nav.is-open a{padding:13px 12px; font-size:1rem}
  .hdr__inner{position:relative}
}
@media (max-width:900px){
  .hero__inner{grid-template-columns:1fr}
  .hero__card{order:2}
  .split,.contact{grid-template-columns:1fr}
  .contact__map{min-height:340px}
  .contact__map iframe{min-height:340px}
  .stats__grid{grid-template-columns:repeat(2,1fr); gap:26px 20px}
  .ftr__inner{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  html{scroll-padding-top:76px}
  .topbar__item--addr{display:none}
  .hdr__inner{min-height:64px}
  .brand__mark{width:38px; height:38px}
  .hdr__cta .btn span{display:none}
  .hdr__cta .btn{padding:11px 13px}
  .hero__actions .btn{flex:1 1 100%}
  .floor{grid-template-columns:60px 1fr; gap:14px; padding:14px 16px}
  .fab{display:inline-flex}
  body{padding-bottom:78px}
  .cta__actions .btn{flex:1 1 100%}
  .ftr__inner{grid-template-columns:1fr; gap:26px}
  .ftr__legal{flex-direction:column; gap:8px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms !important; transition-duration:.01ms !important}
  .reveal{opacity:1; transform:none}
}

@media print{
  .topbar,.hdr__cta,.burger,.fab,.cta,.contact__map{display:none !important}
  .hdr{position:static}
  body{font-size:11pt}
}