/* ===== Общий стиль страниц заболеваний — клиника «Ваш Позвоночникофф» ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --green: #1f7a52; --green-dark: #155f3f; --green-darker: #0e3825; --green-deepest: #061a10;
  --teal: #0b4034; --gold: #b89760; --gold-soft: #cbb486;
  --green-soft: #e7f1ea; --beige: #e7d9bd; --beige-soft: #f4ecdb;
  --cream: #f8f4ec; --white: #ffffff; --text: #1c2a22; --muted: #66776c;
  --line: rgba(14,56,37,0.13); --shadow: 0 18px 50px rgba(14,56,37,0.16);
  --rgb-deepest: 6,26,16; --rgb-teal: 11,64,52; --rgb-dark: 14,56,37; --rgb-green: 31,122,82;
}
/* ===== ВАРИАНТЫ СТИЛЯ (синхронно с index.html) ===== */
html[data-theme="pine"]{ --green:#127a6c;--green-dark:#0e5c51;--green-darker:#093f38;--green-deepest:#03201d;--teal:#0a4a43;--gold:#b3936a;--gold-soft:#c9b48f;--green-soft:#e3f0ee;--beige:#dcd7c2;--beige-soft:#eef0ea;--cream:#f2f4f1;--text:#162622;--muted:#5f746f;--line:rgba(9,63,56,0.13);--shadow:0 18px 50px rgba(9,63,56,0.16);--rgb-deepest:3,32,29;--rgb-teal:10,74,67;--rgb-dark:12,60,54;--rgb-green:18,122,108; }
html[data-theme="sage"]{ --green:#4f7d50;--green-dark:#3c6140;--green-darker:#2a452e;--green-deepest:#16271a;--teal:#3a6147;--gold:#c0a35f;--gold-soft:#d3bd86;--green-soft:#eaf1e6;--beige:#e7dcbe;--beige-soft:#f5efdf;--cream:#f8f4ea;--text:#232c20;--muted:#6c7663;--line:rgba(42,69,46,0.13);--shadow:0 18px 50px rgba(42,69,46,0.15);--rgb-deepest:22,39,26;--rgb-teal:42,69,46;--rgb-dark:42,69,46;--rgb-green:79,125,80; }
html[data-theme="forest"]{ --green:#1b6e49;--green-dark:#0f4530;--green-darker:#0a2c1f;--green-deepest:#04130d;--teal:#0a3a30;--gold:#c0883f;--gold-soft:#d3a566;--green-soft:#e6efe9;--beige:#e3d6b8;--beige-soft:#f3ecda;--cream:#f7f2e8;--text:#19271f;--muted:#647469;--line:rgba(10,44,31,0.14);--shadow:0 18px 50px rgba(10,44,31,0.18);--rgb-deepest:4,19,13;--rgb-teal:10,58,48;--rgb-dark:10,44,31;--rgb-green:27,110,73; }
html { scroll-behavior: smooth; }
body { font-family: 'Montserrat', sans-serif; background: var(--cream); color: var(--text); line-height: 1.65; overflow-x: hidden; }
img { max-width: 100%; display: block; }
h1, h2, h3, h4 { font-family: 'Manrope', sans-serif; line-height: 1.2; }
a { color: var(--green-dark); }

.reveal { opacity: 0; transform: translateY(28px); transition: opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); }
.reveal.in { opacity: 1; transform: none; }
.reveal.d1 { transition-delay:.08s;} .reveal.d2{transition-delay:.16s;} .reveal.d3{transition-delay:.24s;}
.reveal.d4 { transition-delay:.32s;} .reveal.d5{transition-delay:.40s;} .reveal.d6{transition-delay:.48s;}
@media (prefers-reduced-motion: reduce){ .reveal{opacity:1;transform:none;transition:none;} }

/* NAV */
nav { position: sticky; top: 0; z-index: 200; background: rgba(250,246,238,0.88); backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line); padding: 0 40px; height: 70px; display: flex; align-items: center; justify-content: space-between; transition: box-shadow .3s, height .3s; }
nav.scrolled { box-shadow: 0 8px 30px rgba(31,98,67,0.1); height: 62px; }
.nav-logo { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--green-dark); }
.nav-logo-icon { width: 38px; height: 38px; border-radius: 11px; background: linear-gradient(135deg, var(--green), var(--green-dark)); display:flex;align-items:center;justify-content:center;color:#fff; }
.nav-logo b { font-family:'Manrope';font-weight:800;font-size:1.02rem; }
.nav-links { display: flex; gap: 24px; }
.nav-links a { color: var(--muted); text-decoration: none; font-size: .85rem; font-weight: 600; position: relative; transition: color .2s; }
.nav-links a::after { content:''; position:absolute; left:0; bottom:-6px; height:2px; width:0; background:var(--green); transition:width .25s; }
.nav-links a:hover { color: var(--green);} .nav-links a:hover::after{width:100%;}
.nav-cta { background: var(--green); color:#fff; padding:10px 22px; border-radius:50px; text-decoration:none; font-size:.84rem; font-weight:700; transition:background .2s, transform .2s; white-space:nowrap; }
.nav-cta:hover { background: var(--green-dark); transform: translateY(-1px); }

/* BREADCRUMBS */
.crumbs { max-width: 1160px; margin: 0 auto; padding: 18px 40px 0; font-size: .8rem; color: var(--muted); }
.crumbs a { color: var(--muted); text-decoration: none; } .crumbs a:hover { color: var(--green); }
.crumbs span { color: var(--green-dark); font-weight: 600; }

/* HERO */
.hero { position: relative; overflow: hidden; color: #fff; }
.hero-bg { position: absolute; inset: 0; z-index: 0; background-size: cover; background-position: center; transform: scale(1.07); animation: zoom 14s ease-out forwards; }
@keyframes zoom { to { transform: scale(1); } }
.hero-ov { position: absolute; inset: 0; z-index: 1; background: linear-gradient(105deg, rgba(var(--rgb-deepest),0.95) 0%, rgba(var(--rgb-teal),0.80) 55%, rgba(var(--rgb-dark),0.52) 100%); }
.hero-inner { position: relative; z-index: 2; max-width: 1160px; margin: 0 auto; padding: 70px 40px 78px; }
.hero-eyebrow { display:inline-block; font-size:.74rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-soft); font-weight:700; margin-bottom:16px; }
.hero h1 { font-size: clamp(1.9rem, 4vw, 3rem); font-weight: 800; max-width: 800px; margin-bottom: 18px; text-shadow: 0 2px 24px rgba(0,0,0,0.25); }
.hero-lead { font-size: clamp(1rem,1.6vw,1.15rem); color: rgba(255,255,255,0.92); max-width: 680px; margin-bottom: 30px; }
.hero-actions { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.btn-primary { position:relative; overflow:hidden; display:inline-block; background:#fff; color:var(--green-dark); font-family:'Manrope'; font-weight:800; font-size:1rem; padding:16px 36px; border-radius:50px; text-decoration:none; border:none; cursor:pointer; box-shadow:0 12px 34px rgba(0,0,0,0.25); transition:transform .2s, box-shadow .2s; animation: ctaBreathe 3s ease-in-out infinite; }
@keyframes ctaBreathe { 0%,100%{ box-shadow:0 12px 34px rgba(0,0,0,0.25), 0 0 0px 0px rgba(255,255,255,0.0); } 50%{ box-shadow:0 14px 38px rgba(0,0,0,0.28), 0 0 26px 5px rgba(255,255,255,0.42); } }
.btn-primary::after { content:''; position:absolute; top:0; left:0; width:60%; height:100%; background:linear-gradient(100deg, transparent 0%, rgba(21,95,63,0.22) 50%, transparent 100%); pointer-events:none; will-change:transform; transform:translateX(-220%) skewX(-20deg); animation: ctaShine 4.5s ease-in-out infinite; }
@keyframes ctaShine { 0%,68%{ transform:translateX(-220%) skewX(-20deg); } 86%,100%{ transform:translateX(300%) skewX(-20deg); } }
.btn-primary:hover { transform: translateY(-3px); box-shadow: 0 18px 44px rgba(0,0,0,0.33); animation-play-state: paused; }
@media (prefers-reduced-motion: reduce){ .btn-primary, .btn-primary::after { animation:none; } }
.btn-phone { color:#fff; text-decoration:none; font-weight:700; font-size:1.05rem; display:inline-flex; align-items:center; gap:8px; }
.hero-badges { display:flex; flex-wrap:wrap; gap:14px; margin-top:34px; }
.hbadge { display:flex; align-items:center; gap:9px; background:rgba(255,255,255,0.12); border:1px solid rgba(255,255,255,0.2); border-radius:50px; padding:9px 18px; font-size:.82rem; font-weight:600; }
.hbadge svg { width:17px; height:17px; color: var(--beige); flex-shrink:0; }

/* MARQUEE */
.marquee { background: var(--green-dark); color:#fff; overflow:hidden; white-space:nowrap; padding:14px 0; }
.marquee-track { display:inline-block; padding-left:100%; animation:marq 36s linear infinite; }
.marquee:hover .marquee-track { animation-play-state: paused; }
.marquee span b { color: var(--beige); margin:0 20px; }
@keyframes marq { 0%{transform:translateX(0);} 100%{transform:translateX(-100%);} }

/* SECTIONS */
section.block { padding: 80px 40px; }
.block-inner { max-width: 1160px; margin: 0 auto; }
.block-narrow { max-width: 820px; margin: 0 auto; }
.bg-white { background: var(--white); } .bg-beige { background: var(--beige-soft); }
.bg-green { background: linear-gradient(160deg, var(--green-dark) 0%, var(--teal) 55%, var(--green-deepest) 100%); color:#fff; }
.section-label { font-size:.73rem; letter-spacing:.18em; text-transform:uppercase; color:var(--green); font-weight:700; margin-bottom:12px; }
h2 { font-size: clamp(1.55rem, 2.6vw, 2.1rem); font-weight: 800; margin-bottom: 16px; color: var(--text); }
h3 { font-weight: 800; }
.lead { font-size: 1.05rem; color: var(--text); line-height: 1.8; }
.muted { color: var(--muted); }
.prose p { margin-bottom: 16px; color: var(--text); line-height: 1.85; }
.prose p:last-child { margin-bottom: 0; }

/* SYMPTOM / CAUSE LISTS */
.checklist { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(280px,1fr)); gap: 14px; margin-top: 8px; }
.checklist li { background: var(--white); border:1px solid var(--line); border-radius:14px; padding:16px 18px; display:flex; gap:12px; align-items:flex-start; font-size:.92rem; }
.checklist li svg { width:20px; height:20px; color: var(--green); flex-shrink:0; margin-top:1px; }
.bg-beige .checklist li { background: var(--white); }
.alert { margin-top: 24px; background: var(--green-soft); border-left: 4px solid var(--green); border-radius: 10px; padding: 18px 22px; font-size: .94rem; }
.alert b { color: var(--green-dark); }

/* METHODS */
.methods-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(280px,1fr)); gap:16px; margin-top: 8px; }
.method { background: var(--cream); border:1px solid var(--line); border-radius:16px; padding:22px 24px; transition: box-shadow .3s, transform .3s; }
.bg-white .method { background: var(--cream); }
.method:hover { box-shadow: var(--shadow); transform: translateY(-4px); }
.method h3 { font-size: 1rem; margin-bottom: 6px; }
.method p { font-size: .88rem; color: var(--muted); }

/* COURSE STRIP */
.course { display:flex; flex-wrap:wrap; align-items:center; gap:18px; background:var(--green-soft); border-radius:20px; padding:28px 32px; margin-top: 8px; }
.course-big { font-family:'Manrope'; font-weight:800; font-size:2.4rem; color:var(--green-dark); line-height:1; }
.course-tags { display:flex; flex-wrap:wrap; gap:8px; }
.course-tag { background:#fff; color:var(--green-dark); font-weight:700; font-size:.82rem; padding:7px 16px; border-radius:50px; border:1px solid var(--line); }

/* REVIEWER / E-E-A-T */
.reviewer { display:grid; grid-template-columns: 140px 1fr; gap:26px; align-items:center; background:var(--white); border:1px solid var(--line); border-radius:20px; padding:26px 28px; box-shadow: var(--shadow); }
.reviewer { border-top: 3px solid var(--gold-soft); }
.reviewer-photo { width:140px; height:170px; border-radius:18px; overflow:hidden; background:var(--green-soft); }
.reviewer-photo img { width:100%; height:100%; object-fit:cover; object-position: center 18%; }
.reviewer-tag { font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--green); font-weight:700; margin-bottom:6px; }
.reviewer h3 { font-size:1.1rem; margin-bottom:4px; }
.reviewer-spec { font-size:.85rem; color:var(--muted); margin-bottom:8px; }
.reviewer-meta { font-size:.8rem; color:var(--muted); }
.reviewer-meta b { color: var(--green-dark); }

/* DOCTORS */
.doctors-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(230px,1fr)); gap:24px; margin-top: 8px; }
.doctor-card { background:var(--white); border:1px solid var(--line); border-radius:20px; overflow:hidden; transition:transform .35s, box-shadow .35s; }
.doctor-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.doctor-photo { height:300px; overflow:hidden; background:var(--green-soft); }
.doctor-photo img { width:100%; height:100%; object-fit:cover; object-position:center 18%; transition:transform .7s; }
.doctor-card:hover .doctor-photo img { transform: scale(1.06); }
.doctor-info { padding:20px 22px; }
.doctor-info h3 { font-size:1rem; margin-bottom:4px; }
.doctor-spec { font-size:.74rem; color:var(--green); font-weight:700; text-transform:uppercase; letter-spacing:.05em; margin-bottom:8px; }
.doctor-exp { font-size:.72rem; font-weight:700; color:var(--green-dark); background:var(--green-soft); display:inline-block; padding:4px 11px; border-radius:50px; margin-bottom:10px; }
.doctor-info p { font-size:.83rem; color:var(--muted); }

/* STORY */
.story { background: rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.16); border-radius:20px; padding:30px; }
.story-meta { display:flex; align-items:center; gap:14px; margin-bottom:16px; }
.story-ava { width:48px; height:48px; border-radius:50%; background:var(--beige); color:var(--green-darker); display:flex; align-items:center; justify-content:center; font-family:'Manrope'; font-weight:800; flex-shrink:0; }
.story-name { font-weight:700; font-size:.95rem; } .story-diag { font-size:.76rem; color:var(--beige); }
.story p { font-size:.92rem; line-height:1.75; color:rgba(255,255,255,0.9); }
.story .result { margin-top:14px; padding-top:14px; border-top:1px solid rgba(255,255,255,0.16); font-weight:700; font-size:.85rem; color:var(--beige); display:flex; align-items:center; gap:8px; }

/* FAQ */
.faq-list { max-width: 820px; margin-top: 8px; }
.faq-item { border-bottom:1px solid var(--line); padding:20px 0; }
.faq-item summary { font-family:'Manrope'; font-weight:700; font-size:1rem; cursor:pointer; color:var(--text); list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.faq-item summary::after { content:'+'; font-size:1.5rem; color:var(--green); flex-shrink:0; }
.faq-item[open] summary::after { content:'−'; }
.faq-item p { font-size:.92rem; color:var(--muted); line-height:1.7; margin-top:12px; }

/* FORM */
.cta-section { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
.cta-text p { color:var(--muted); line-height:1.7; margin-bottom:24px; }
.cta-phone { display:flex; align-items:center; gap:10px; font-size:1.3rem; font-weight:800; color:var(--green-dark); text-decoration:none; font-family:'Manrope'; }
.cta-addr { margin-top:12px; font-size:.86rem; color:var(--muted); }
.form { background:var(--white); border:1px solid var(--line); border-radius:24px; padding:38px; box-shadow:var(--shadow); }
.form h3 { font-size:1.15rem; margin-bottom:20px; }
.form-group { margin-bottom:15px; }
.form-group label { display:block; font-size:.79rem; font-weight:700; color:var(--muted); margin-bottom:6px; }
.form-group input, .form-group select, .form-group textarea { width:100%; padding:13px 17px; border:1.5px solid var(--line); border-radius:12px; font-family:'Montserrat'; font-size:.94rem; background:var(--cream); color:var(--text); outline:none; transition:border-color .2s, box-shadow .2s; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color:var(--green); box-shadow:0 0 0 4px rgba(47,138,95,0.12); }
.form-group textarea { resize:vertical; min-height:78px; }
.form-submit { width:100%; background:linear-gradient(135deg,var(--green),var(--green-dark)); color:#fff; font-family:'Manrope'; font-weight:800; font-size:1rem; padding:16px; border-radius:50px; border:none; cursor:pointer; transition:transform .2s, box-shadow .2s; box-shadow:0 8px 26px rgba(31,98,67,0.3); margin-top:6px; }
.form-submit:hover { transform:translateY(-2px); box-shadow:0 12px 34px rgba(31,98,67,0.4); }
.form-note { font-size:.73rem; color:var(--muted); text-align:center; margin-top:12px; } .form-note a { color:var(--green); }
.consent { display:flex; gap:10px; align-items:flex-start; margin:14px 0 4px; font-size:.76rem; line-height:1.55; color:var(--muted); cursor:pointer; }
.consent input { margin-top:2px; width:16px; height:16px; flex:none; accent-color:var(--green); cursor:pointer; }
.consent a { color:var(--green); }
.hp-field { position:absolute; left:-9999px; top:-9999px; height:0; width:0; opacity:0; pointer-events:none; }

/* TRUST */
.trust-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap:20px; margin-top: 8px; }
.trust-item { background:var(--white); border:1px solid var(--line); border-radius:18px; padding:26px 24px; }
.trust-num { font-family:'Manrope'; font-weight:800; font-size:2rem; color:var(--green); line-height:1; margin-bottom:8px; }
.trust-item p { font-size:.86rem; color:var(--muted); }

/* RELATED */
.related-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); gap:16px; margin-top: 8px; }
.related-card { display:flex; align-items:center; justify-content:space-between; gap:12px; background:var(--white); border:1px solid var(--line); border-radius:14px; padding:18px 22px; text-decoration:none; color:var(--text); font-weight:700; font-size:.95rem; transition:border-color .25s, box-shadow .25s, transform .25s; }
.related-card:hover { border-color:var(--green); box-shadow:var(--shadow); transform:translateY(-3px); }
.related-card svg { width:20px; height:20px; color:var(--green); flex-shrink:0; }

/* DOC LINKS */
.docs-row { display:flex; flex-wrap:wrap; gap:12px; margin-top: 8px; }
.doc-link { display:inline-flex; align-items:center; gap:10px; text-decoration:none; color:var(--text); background:var(--white); border:1px solid var(--line); border-radius:50px; padding:11px 20px; font-size:.85rem; font-weight:600; transition:border-color .25s, box-shadow .25s; }
.doc-link:hover { border-color:var(--green); box-shadow:var(--shadow); }
.doc-link svg { width:17px; height:17px; color:var(--green); }

/* FOOTER */
footer { background: var(--green-darker); color: rgba(255,255,255,0.7); padding: 52px 40px 30px; }
.footer-inner { max-width:1160px; margin:0 auto; display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; }
.footer-brand b { font-family:'Manrope'; color:#fff; font-size:1.12rem; }
.footer-brand p { margin-top:10px; font-size:.85rem; line-height:1.7; }
.footer-col h4 { color:#fff; font-size:.8rem; letter-spacing:.1em; text-transform:uppercase; margin-bottom:13px; }
.footer-col a, .footer-col p { color:rgba(255,255,255,0.7); text-decoration:none; font-size:.85rem; line-height:1.9; display:block; }
.footer-col a:hover { color:#fff; }
.disclaimer { max-width:1160px; margin:32px auto 0; padding-top:22px; border-top:1px solid rgba(255,255,255,0.15); font-size:.75rem; color:rgba(255,255,255,0.5); line-height:1.8; }

@media (max-width:900px){
  nav{padding:0 20px;} .nav-links{display:none;}
  section.block{padding:56px 22px;} .crumbs{padding:16px 22px 0;} .hero-inner{padding:54px 22px 60px;}
  .cta-section{grid-template-columns:1fr; gap:34px;}
  .reviewer{grid-template-columns:1fr; text-align:center; justify-items:center;}
  .footer-inner{grid-template-columns:1fr; gap:26px;}
}
@media (max-width:520px){ .form{padding:26px;} }