/* =========================================================
   BASE — tokens, fonts, reset, typography, shared components.
   Visual skin lives in variant-a.css / variant-b.css.
   ========================================================= */

/* ---- Fonts (self-hosted, latin + cyrillic subsets) ---- */
@font-face{
  font-family:"Manrope";
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/manrope-400-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Manrope";
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/manrope-400-cyrillic.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Manrope";
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url("../fonts/manrope-500-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Manrope";
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url("../fonts/manrope-500-cyrillic.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Manrope";
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("../fonts/manrope-600-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Manrope";
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("../fonts/manrope-600-cyrillic.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Manrope";
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("../fonts/manrope-700-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Manrope";
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("../fonts/manrope-700-cyrillic.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Cormorant Garamond";
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url("../fonts/cormorant-garamond-500-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Cormorant Garamond";
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url("../fonts/cormorant-garamond-500-cyrillic.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Cormorant Garamond";
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("../fonts/cormorant-garamond-600-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Cormorant Garamond";
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url("../fonts/cormorant-garamond-600-cyrillic.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Cormorant Garamond";
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("../fonts/cormorant-garamond-700-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Cormorant Garamond";
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("../fonts/cormorant-garamond-700-cyrillic.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Cormorant Garamond";
  font-style:italic;
  font-weight:500;
  font-display:swap;
  src:url("../fonts/cormorant-garamond-500italic-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Cormorant Garamond";
  font-style:italic;
  font-weight:500;
  font-display:swap;
  src:url("../fonts/cormorant-garamond-500italic-cyrillic.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Cormorant Garamond";
  font-style:italic;
  font-weight:600;
  font-display:swap;
  src:url("../fonts/cormorant-garamond-600italic-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Cormorant Garamond";
  font-style:italic;
  font-weight:600;
  font-display:swap;
  src:url("../fonts/cormorant-garamond-600italic-cyrillic.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* ---- Tokens ---- */
:root{
  --bg:#FFFFFF;
  --bg-alt:#F1E8DA;
  --accent:#5B2E2E;
  --text:#302C29;
  --text-muted:#4A4340;
  --line:#EBE2D2;
  --dark:#302C29;

  --ph-border:#DDCDB2;
  --dark-hover:rgba(255,255,255,0.08);
  --on-dark:#F3EBDD;
  --on-dark-muted:#C9BAA3;

  --font-heading:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --font-body:"Manrope",Arial,Helvetica,sans-serif;

  --radius-l:22px;
  --radius-m:16px;

  --hover-transition:background-color 0.18s ease,border-color 0.18s ease,color 0.18s ease;
}

/* ---- Reset ---- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img,svg{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul,ol{margin:0;padding:0;list-style:none;}
button,input{font:inherit;color:inherit;}
button{cursor:pointer;background:none;border:none;}
h1,h2,h3,h4,p,figure{margin:0;}

/* ---- Focus ---- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
[tabindex]:focus-visible,
summary:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
  border-radius:4px;
}
.on-dark :focus-visible{outline-color:var(--on-dark);}

/* ---- Typography ---- */
h1,h2,h3,h4{
  font-family:var(--font-heading);
  font-weight:600;
  line-height:1.15;
  color:var(--text);
}
.on-dark h1,.on-dark h2,.on-dark h3,.on-dark h4{color:var(--on-dark);}
h1{font-size:clamp(2.2rem,4vw + 1rem,3.6rem);}
h2{font-size:clamp(1.7rem,2.4vw + 1rem,2.6rem);}
h3{font-size:clamp(1.3rem,1.2vw + 1rem,1.7rem);}
.eyebrow{
  font-size:0.85rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--accent);
  font-weight:600;
}
.lead{
  font-size:1.15rem;
  color:var(--text-muted);
}
.section-head{
  max-width:640px;
  margin:0 0 2.5rem;
}
.section-head p{color:var(--text-muted);margin-top:0.75rem;}

/* ---- Layout helpers ---- */
.container{
  width:100%;
  max-width:1180px;
  margin:0 auto;
  padding-inline:24px;
}
main{display:block;}
section{padding-block:clamp(48px,7vw,96px);}

/* ---- Skip link ---- */
.skip-link{
  position:absolute;
  left:-9999px;
  top:0;
  background:var(--dark);
  color:var(--on-dark);
  padding:12px 20px;
  z-index:1000;
  border-radius:0 0 8px 0;
}
.skip-link:focus{left:0;}

/* ---- Top bar ---- */
.topbar{
  background:var(--bg-alt);
  font-size:0.9rem;
}
.topbar .container{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:16px;
  flex-wrap:wrap;
  padding-block:10px;
}
.topbar-meta{
  display:flex;
  align-items:center;
  gap:18px;
  flex-wrap:wrap;
}
.hours{white-space:nowrap;}
.anon-note{white-space:nowrap;color:var(--text-muted);}
.social-icons{
  display:flex;
  gap:6px;
}
.social-icons a{
  display:flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:50%;
  transition:var(--hover-transition);
}
.social-icons a:hover,.social-icons a:focus-visible{background:var(--bg);}
.social-icons svg{width:18px;height:18px;stroke:var(--text);fill:none;}

/* ---- Header ---- */
.site-header{
  background:var(--bg);
  border-bottom:1px solid var(--line);
}
.site-header .container{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding-block:18px;
  position:relative;
}
.brand{
  font-family:var(--font-heading);
  font-size:1.5rem;
  font-weight:600;
  white-space:nowrap;
}
.main-nav ul{
  display:flex;
  gap:4px;
  flex-wrap:wrap;
  justify-content:center;
}
.main-nav a{
  display:flex;
  align-items:center;
  min-height:44px;
  padding:0 14px;
  border-radius:10px;
  font-weight:500;
  transition:var(--hover-transition);
}
.main-nav a:hover,.main-nav a:focus-visible{background:var(--bg-alt);}
.main-nav a[aria-current="page"]{
  color:var(--accent);
  font-weight:700;
}

/* ---- Nav dropdown ("Направления"), native <details>/<summary> ---- */
.nav-dropdown{position:relative;}
.nav-dropdown summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:6px;
  min-height:44px;
  padding:0 14px;
  border-radius:10px;
  font-weight:500;
  transition:var(--hover-transition);
}
.nav-dropdown summary::-webkit-details-marker{display:none;}
.nav-dropdown summary::after{content:"▾";font-size:0.65em;color:var(--accent);}
.nav-dropdown summary:hover,.nav-dropdown summary:focus-visible{background:var(--bg-alt);}
.nav-dropdown[open] summary{background:var(--bg-alt);color:var(--accent);}
.nav-dropdown ul{padding-top:4px;}
.nav-dropdown ul a{font-weight:500;}
@media (min-width:769px){
  .nav-dropdown ul{
    position:absolute;
    top:100%;
    left:0;
    min-width:220px;
    background:#fff;
    border-radius:var(--radius-m);
    box-shadow:0 16px 32px rgba(48,44,41,0.16);
    margin-top:6px;
    padding:8px;
    z-index:20;
    display:flex;
    flex-direction:column;
    gap:2px;
  }
  .nav-dropdown ul a{border-radius:8px;}
}
@media (max-width:768px){
  .nav-dropdown ul{
    display:flex;
    flex-direction:column;
    gap:2px;
    padding-left:14px;
  }
}

.header-phone{
  font-weight:600;
  white-space:nowrap;
  min-height:44px;
  display:flex;
  align-items:center;
}
.burger{
  display:none;
  width:44px;
  height:44px;
  border-radius:10px;
  align-items:center;
  justify-content:center;
  transition:var(--hover-transition);
}
.burger:hover,.burger:focus-visible{background:var(--bg-alt);}
.burger span,
.burger span::before,
.burger span::after{
  content:"";
  display:block;
  width:22px;
  height:2px;
  background:var(--text);
  position:relative;
  transition:transform 0.2s ease,opacity 0.2s ease;
}
.burger span::before{position:absolute;top:-7px;}
.burger span::after{position:absolute;top:7px;}
.burger[aria-expanded="true"] span{background:transparent;}
.burger[aria-expanded="true"] span::before{transform:rotate(45deg);top:0;}
.burger[aria-expanded="true"] span::after{transform:rotate(-45deg);top:0;}

/* ---- Buttons ---- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 26px;
  border-radius:999px;
  font-weight:600;
  font-size:0.95rem;
  border:1.5px solid transparent;
  transition:var(--hover-transition);
  white-space:nowrap;
}
.btn-primary{
  background:var(--accent);
  color:#fff;
  border-color:var(--accent);
}
.btn-primary:hover,.btn-primary:focus-visible{background:#4a2525;border-color:#4a2525;}
.btn-outline{
  background:transparent;
  color:var(--text);
  border-color:var(--text);
}
.btn-outline:hover,.btn-outline:focus-visible{background:var(--bg-alt);}
.btn-block{width:100%;}
.btn[disabled]{opacity:0.5;cursor:not-allowed;}

/* on dark backgrounds */
.on-dark .btn-outline{color:var(--on-dark);border-color:var(--on-dark-muted);}
.on-dark .btn-outline:hover,.on-dark .btn-outline:focus-visible{background:var(--dark-hover);}

/* ---- Cards / facts / numbered items ---- */
.card{
  background:#fff;
  border-radius:var(--radius-m);
  padding:28px;
  transition:var(--hover-transition);
}
.card:hover{background:var(--bg-alt);}

.steps{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:28px;
}
.step-num{
  font-family:var(--font-heading);
  font-size:2.4rem;
  color:var(--accent);
  font-weight:600;
  display:block;
  margin-bottom:10px;
}

.stage-list{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.stage-list li{
  background:#fff;
  border-radius:var(--radius-m);
  padding:26px;
  transition:var(--hover-transition);
}
.stage-list li:hover{background:var(--bg-alt);}

/* ---- Direction cards (главная — Наркомания/Алкоголизм/Игромания) ---- */
.direction-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:28px;
}
.direction-card{
  display:block;
  background:#fff;
  border-radius:var(--radius-m);
  padding:30px 26px;
  transition:var(--hover-transition);
}
.direction-card:hover,.direction-card:focus-visible{background:var(--bg-alt);}
.direction-card h3{margin-bottom:10px;}
.direction-card p{color:var(--text-muted);}
.direction-card-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-top:16px;
  font-weight:600;
  color:var(--accent);
}

/* ---- Doctor cards (vrachi.html) ---- */
.doctor-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:28px;
}
.doctor-card{
  background:#fff;
  border-radius:var(--radius-m);
  padding:28px;
  transition:var(--hover-transition);
}
.doctor-card:hover{background:var(--bg-alt);}
.doctor-card .ph{margin-bottom:18px;}
.doctor-card h3{margin-bottom:4px;}
.doctor-role{
  display:block;
  color:var(--accent);
  font-weight:600;
  font-size:0.9rem;
  margin-bottom:12px;
}
.doctor-card p{color:var(--text-muted);}

/* ---- Trust-factor cards (photo + short claim) ---- */
.trust-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:28px;
}
.trust-card{
  background:#fff;
  border-radius:var(--radius-m);
  overflow:hidden;
  transition:var(--hover-transition);
}
.trust-card .ph{
  border-radius:0;
  min-height:0;
  aspect-ratio:4/3;
}
.trust-card-body{padding:22px 24px 26px;}
.trust-card h3{margin-bottom:8px;}
.trust-card p{color:var(--text-muted);}
.trust-card:hover{background:var(--bg-alt);}

/* ---- Process rows: alternating photo + text (richer than equal-card steps) ---- */
.process-detail{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  align-items:center;
  margin-bottom:56px;
}
.process-detail:last-child{margin-bottom:0;}
.process-detail .ph{min-height:260px;}
.process-detail:nth-child(even) .ph{order:-1;}
.process-detail-text .step-num{margin-bottom:14px;}
.process-detail-text h3{margin-bottom:10px;}
.process-detail-text p{color:var(--text-muted);}

/* ---- Breadcrumbs ---- */
.breadcrumbs{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  font-size:0.85rem;
  color:var(--text-muted);
  margin-bottom:18px;
}
.breadcrumbs a{color:var(--text-muted);text-decoration:underline;}
.breadcrumbs a:hover,.breadcrumbs a:focus-visible{color:var(--accent);}
.breadcrumbs .sep{opacity:0.6;}
.breadcrumbs [aria-current]{color:var(--text);}

/* ---- Page table of contents (оглавление) ---- */
.page-toc{
  background:#fff;
  border-radius:var(--radius-m);
  padding:22px 26px;
  margin-top:28px;
  max-width:520px;
}
.page-toc-title{font-weight:600;display:block;margin-bottom:12px;}
.page-toc ul{display:flex;flex-direction:column;gap:8px;}
.page-toc a{
  color:var(--text);
  text-decoration:underline;
  text-decoration-color:var(--line);
  text-underline-offset:3px;
}
.page-toc a:hover,.page-toc a:focus-visible{
  color:var(--accent);
  text-decoration-color:var(--accent);
}

/* ---- "Reviewed by" doctor byline ---- */
.reviewed-by{
  display:flex;
  align-items:center;
  gap:18px;
  background:#fff;
  border-radius:var(--radius-m);
  padding:20px 24px;
  margin-top:2.5rem;
}
.reviewed-by .ph{
  width:64px;
  height:64px;
  min-height:0;
  border-radius:50%;
  flex-shrink:0;
  padding:4px;
}
.reviewed-by .ph span{font-size:0.4rem;letter-spacing:0.02em;}
.reviewed-by-text{font-size:0.9rem;color:var(--text-muted);}
.reviewed-by-text strong{display:block;color:var(--text);font-size:1rem;}

/* ---- Checkmark list (alternative to dot .tips-list) ---- */
.check-list li{
  position:relative;
  padding-left:30px;
  margin-bottom:12px;
  color:var(--text-muted);
}
.check-list li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:0;
  color:var(--accent);
  font-weight:700;
}

/* ---- Review cards (otzyvy.html) ---- */
.review-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px;
}
.review-card{
  background:#fff;
  border-radius:var(--radius-m);
  padding:28px;
  transition:var(--hover-transition);
}
.review-card:hover{background:var(--bg-alt);}
.review-name{
  display:block;
  font-weight:600;
  margin-bottom:10px;
}
.review-card p{color:var(--text-muted);}

/* ---- Glossary (slovar.html) ---- */
.glossary-list dt{
  font-family:var(--font-heading);
  font-weight:600;
  font-size:1.15rem;
  margin-top:1.75rem;
}
.glossary-list dt:first-of-type{margin-top:0;}
.glossary-list dd{
  margin:6px 0 0;
  color:var(--text-muted);
  max-width:70ch;
}

/* ---- Fork notice (programma.html → lechenie-igromanii.html) ---- */
.fork-notice{
  background:var(--bg-alt);
  border-radius:var(--radius-m);
  padding:20px 24px;
  margin-bottom:2.5rem;
}
.fork-notice a{font-weight:600;text-decoration:underline;}

/* ---- Image placeholders ---- */
.ph{
  background:var(--bg-alt);
  border:1px solid var(--ph-border);
  border-radius:var(--radius-m);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  min-height:180px;
  padding:16px;
  overflow:hidden;
  position:relative;
  transition:var(--hover-transition);
}
.ph:hover{background:#e4d6bf;}
.ph span{
  font-size:0.75rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--text-muted);
  font-weight:600;
}
.ph img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:inherit;
}
.ph-hero{min-height:340px;border-radius:var(--radius-l);}
.ph-wide{min-height:260px;}
.ph-row{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}

/* ---- Relatives block ---- */
.relatives-block{background:var(--bg-alt);}
.relatives-block .container{
  max-width:760px;
  text-align:center;
}
.relatives-block .footnote{
  font-size:0.85rem;
  color:var(--text-muted);
  margin-top:14px;
}
.relatives-block .btn{margin-top:22px;}

/* ---- FAQ ---- */
.faq-item{
  border-bottom:1px solid var(--line);
}
.faq-item summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:20px 12px;
  font-weight:600;
  min-height:44px;
  border-radius:10px;
  transition:var(--hover-transition);
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary:hover,.faq-item summary:focus-visible{background:var(--bg-alt);}
.faq-item summary::after{
  content:"+";
  font-size:1.4rem;
  color:var(--accent);
  flex-shrink:0;
}
.faq-item[open] summary::after{content:"–";}
.faq-item p{
  padding:0 12px 20px;
  color:var(--text-muted);
  max-width:70ch;
}

/* ---- Application form block ---- */
.apply-block{
  background:var(--dark);
  color:var(--on-dark);
}
.apply-block .section-head p{color:var(--on-dark-muted);}
.apply-block .eyebrow{color:#c98a5c;}

/* ---- Forms ---- */
.form-grid{
  display:grid;
  gap:18px;
  max-width:640px;
}
.field{display:flex;flex-direction:column;gap:6px;}
.field label{font-weight:600;font-size:0.9rem;}
.field input[type="text"],
.field input[type="tel"],
.field input[type="email"]{
  min-height:48px;
  padding:0 16px;
  border-radius:10px;
  border:1px solid var(--ph-border);
  background:#fff;
  color:var(--text);
}
.on-dark .field input{
  background:rgba(255,255,255,0.06);
  border-color:rgba(255,255,255,0.25);
  color:var(--on-dark);
}
.radio-row{
  display:flex;
  gap:24px;
  flex-wrap:wrap;
}
.radio-option{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:44px;
}
.consent-row{
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-size:0.9rem;
}
.consent-row input{margin-top:4px;width:18px;height:18px;flex-shrink:0;}
.consent-row a{text-decoration:underline;}
.captcha-slot{
  border:1px dashed var(--ph-border);
  border-radius:10px;
  padding:14px;
  font-size:0.8rem;
  color:var(--text-muted);
  text-align:center;
}
.on-dark .captcha-slot{border-color:rgba(255,255,255,0.25);color:var(--on-dark-muted);}
.form-status{
  min-height:24px;
  font-size:0.9rem;
  font-weight:600;
}
.form-status[data-state="success"]{color:#3f7a4d;}
.form-status[data-state="error"]{color:#b23b3b;}
.on-dark .form-status[data-state="success"]{color:#8fd39f;}
.on-dark .form-status[data-state="error"]{color:#e79b9b;}

/* ---- Scroll-triggered offer panel ---- */
.scroll-offer{
  position:fixed;
  right:24px;
  bottom:24px;
  width:380px;
  max-width:calc(100vw - 32px);
  max-height:calc(100vh - 32px);
  overflow-y:auto;
  z-index:500;
  padding:28px;
  transform:translateY(16px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:transform 0.3s ease,opacity 0.3s ease,visibility 0.3s;
}
.scroll-offer.is-visible{
  transform:translateY(0);
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.scroll-offer .form-grid{gap:14px;}
.scroll-offer-close{
  position:absolute;
  top:10px;
  right:10px;
  width:36px;
  height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.4rem;
  line-height:1;
  border-radius:50%;
  transition:var(--hover-transition);
}
.scroll-offer-close:hover,.scroll-offer-close:focus-visible{background:var(--bg-alt);}
.scroll-offer-head{margin-bottom:18px;padding-right:24px;}
.scroll-offer-head h2{font-size:1.4rem;margin-bottom:6px;}
.scroll-offer-head p{color:var(--text-muted);font-size:0.9rem;}

@media (max-width:480px){
  .scroll-offer{
    left:0;
    right:0;
    bottom:0;
    width:auto;
    max-width:none;
    max-height:80vh;
    border-radius:0;
    transform:translateY(100%);
  }
}

/* ---- Footer ---- */
.site-footer{
  background:var(--dark);
  color:var(--on-dark-muted);
  padding-block:48px;
  font-size:0.9rem;
}
.site-footer .footer-top{
  display:flex;
  justify-content:space-between;
  gap:32px;
  flex-wrap:wrap;
  padding-bottom:24px;
  border-bottom:1px solid rgba(255,255,255,0.12);
  margin-bottom:24px;
}
.site-footer .brand{color:var(--on-dark);}
.site-footer address{font-style:normal;line-height:1.7;}
.site-footer a:hover,.site-footer a:focus-visible{color:var(--on-dark);}
.footer-heading{color:var(--on-dark);font-weight:600;margin-bottom:10px;}
.footer-links li{margin-bottom:8px;}
.site-footer .social-icons a{background:transparent;}
.site-footer .social-icons a:hover,.site-footer .social-icons a:focus-visible{background:var(--dark-hover);}
.site-footer .social-icons svg{stroke:var(--on-dark-muted);}
.site-footer .social-icons a:hover svg{stroke:var(--on-dark);}
.footer-contra{
  margin-top:20px;
  font-size:0.78rem;
  opacity:0.8;
  max-width:70ch;
}

/* ---- Sticky mobile CTA bar (call / WhatsApp) ---- */
.sticky-cta-bar{display:none;}
@media (max-width:768px){
  .sticky-cta-bar{
    display:flex;
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:600;
    background:var(--accent);
  }
  .sticky-cta-bar a{
    flex:1;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:56px;
    color:var(--on-dark);
    font-weight:600;
    font-size:0.95rem;
    transition:var(--hover-transition);
  }
  .sticky-cta-bar a:first-child{border-right:1px solid rgba(255,255,255,0.25);}
  .sticky-cta-bar a:hover,.sticky-cta-bar a:focus-visible{background:rgba(255,255,255,0.12);}
  .sticky-cta-bar svg{width:20px;height:20px;stroke:currentColor;fill:none;}
  body{padding-bottom:56px;}
  .scroll-offer{bottom:calc(24px + 56px);}
}
@media (max-width:480px){
  .scroll-offer{bottom:56px;}
}

/* ---- Scroll reveal (js/reveal.js adds .reveal-on to <html> up front,
   then .is-revealed to [data-reveal] elements as they enter the viewport).
   Without JS, without IntersectionObserver, or with prefers-reduced-motion,
   .reveal-on is never added, so nothing here applies and everything is
   visible immediately. ---- */
.reveal-on [data-reveal]{
  transition:opacity 0.6s ease,transform 0.6s ease;
}
.reveal-on [data-reveal]:not(.is-revealed){
  opacity:0;
  transform:translateY(24px);
}
.reveal-on [data-reveal="photo"]{
  transition-duration:0.75s;
}
.reveal-on [data-reveal="photo"]:not(.is-revealed){
  transform:translateY(16px);
}
[data-reveal-delay="1"]{transition-delay:0.09s;}
[data-reveal-delay="2"]{transition-delay:0.18s;}
[data-reveal-delay="3"]{transition-delay:0.27s;}
[data-reveal-delay="4"]{transition-delay:0.36s;}
@media print{
  [data-reveal]{opacity:1 !important;transform:none !important;}
}

/* ---- Utility ---- */
.text-muted{color:var(--text-muted);}
.mt-lg{margin-top:2.5rem;}
.grid-2x2{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:20px;
}
.map-ph{min-height:320px;}
.map-embed{
  border-radius:var(--radius-m);
  overflow:hidden;
  border:1px solid var(--ph-border);
}
.map-embed iframe{display:block;}

/* ---- Content page layout (internal pages) ---- */
.page-hero{padding-bottom:12px;}
.page-hero .lead{max-width:64ch;}

.two-col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  align-items:start;
}

.tips-list li{
  position:relative;
  padding-left:28px;
  margin-bottom:14px;
  color:var(--text-muted);
}
.tips-list li::before{
  content:"";
  position:absolute;
  left:2px;
  top:0.55em;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--accent);
}

.overdose-steps{
  padding-left:0;
  counter-reset:step;
  margin-top:20px;
}
.overdose-steps li{
  position:relative;
  padding-left:46px;
  margin-bottom:18px;
}
.overdose-steps li::before{
  counter-increment:step;
  content:counter(step);
  position:absolute;
  left:0;
  top:-2px;
  width:30px;
  height:30px;
  border-radius:50%;
  background:var(--bg-alt);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-size:0.9rem;
}

.contact-list li{margin-bottom:12px;}

.stage-detail{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:32px;
  align-items:center;
  margin-bottom:48px;
}
.stage-detail:last-child{margin-bottom:0;}
.stage-detail .ph{min-height:220px;}

.banner-section{margin-block:8px;border-radius:0;border-left:none;border-right:none;}

.policy-stub-section{padding-top:0;}

.policy-section h2{margin-top:2.5rem;margin-bottom:0.75rem;}
.policy-section .container>h2:first-child{margin-top:0;}
.policy-section p,.policy-section .tips-list{margin-bottom:1rem;}
.policy-section code{
  background:var(--bg-alt);
  border-radius:4px;
  padding:2px 6px;
  font-size:0.9em;
}

/* ---- Breakpoints ---- */
@media (max-width:1024px){
  .steps,.stage-list,.direction-cards,.trust-grid{grid-template-columns:repeat(2,1fr);}
  .ph-row{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:768px){
  .two-col,.stage-detail,.process-detail{grid-template-columns:1fr;}
  .stage-detail{margin-bottom:32px;}
  .process-detail{margin-bottom:36px;}
  .process-detail .ph{order:0;min-height:200px;}
  .main-nav{
    position:absolute;
    top:100%;
    left:0;
    right:0;
    background:var(--bg);
    border-bottom:1px solid var(--line);
    padding:12px 24px 20px;
    display:none;
  }
  .main-nav.is-open{display:block;}
  .main-nav ul{flex-direction:column;align-items:stretch;}
  .main-nav a{padding:12px;}
  .burger{display:inline-flex;}
  .site-header .container{flex-wrap:wrap;row-gap:8px;}
  .steps,.stage-list,.grid-2x2,.direction-cards,.doctor-grid,.review-grid,.trust-grid{grid-template-columns:1fr;}
  .ph-row{grid-template-columns:1fr;}
  .site-footer .footer-top{flex-direction:column;}
}
@media (max-width:480px){
  .topbar .container{flex-direction:column;align-items:flex-start;}
  .radio-row{flex-direction:column;gap:12px;}
  .btn{width:100%;white-space:normal;}
}