/* Murakami — общие стили внутренних страниц (about, apparaty, procedury, franshiza, issledovaniya) */
:root{
  --navy:#0a1630; --red:#e53935; --cream:#f4eee3; --mint:#dbf7f6; --white:#fffdf8;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:Arial,Helvetica,sans-serif;color:var(--navy);font-size:18px;line-height:1.6;
  background:linear-gradient(180deg,#f4eee3 0%,#f6f0e2 34%,#eaf1f0 66%,#dbf7f6 100%) no-repeat;
  background-attachment:scroll;min-height:100vh}
h1,h2,h3,.serif{font-family:Georgia,'Times New Roman',serif;font-weight:600;line-height:1.25}
a{color:inherit}
.wrap{max-width:1160px;margin:0 auto;padding:0 20px}
.accent{color:var(--red)}

/* header — единые стили меню вынесены в nav.css */
.btn{display:inline-block;border-radius:30px;padding:13px 28px;font-size:17px;text-decoration:none;text-align:center;transition:transform .2s ease, box-shadow .2s ease}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(10,22,48,.25)}
.btn-red{background:var(--red);color:#fff}
.btn-outline{border:1.5px solid var(--navy);color:var(--navy)}
.btn-white{border:1.5px solid #fff;color:#fff}

/* hero — золотистый, как на главной */
.hero-gold{position:relative;overflow:hidden;color:var(--navy);
  background:linear-gradient(135deg,#bd9f63 0%,#ccae74 30%,#e2cc9a 55%,#efe1c2 80%,#f5efe4 100%)}
.hero-gold .wrap{position:relative;z-index:1;padding:84px 20px 76px}
.hero-gold h1{font-size:48px;max-width:820px;margin-bottom:20px;color:var(--navy)}
.hero-gold p.lead{font-size:21px;max-width:660px;margin-bottom:14px;color:#413620}
.hero-gold .chips{margin-top:30px}
.hero-gold .chip{background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.7);color:#3a3115}

/* hero-gold с фото справа (about.html) — колонки всегда одной высоты */
.hero-gold .split{grid-template-columns:1.25fr 1fr;align-items:stretch;padding:56px 20px}
.hero-gold .split .ph{aspect-ratio:unset}
.hero-gold .split h1{font-size:38px;margin-bottom:16px}
.hero-gold .split p.lead{font-size:19px;margin-bottom:18px}
.hero-gold .split .chips{margin-top:18px}

.hero{padding:72px 0 56px;background:linear-gradient(135deg,#bd9f63 0%,#ccae74 30%,#e2cc9a 55%,#efe1c2 80%,#f5efe4 100%)}
.hero h1{font-size:46px;max-width:860px;margin-bottom:20px}
.hero p.lead{font-size:21px;max-width:780px;margin-bottom:14px}
.hero .cta{margin-top:28px;display:flex;gap:16px;flex-wrap:wrap}
.chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:30px}
.chip{background:#fff;border:1px solid #e3dccb;border-radius:20px;padding:7px 16px;font-size:15px}

section{padding:60px 0}
h2{font-size:36px;margin-bottom:14px}
h3{font-size:24px}
.sub{font-size:19px;max-width:800px;margin-bottom:36px}

/* тёмная секция */
.dark{background:var(--navy);color:#fff}
.dark h2{color:#fff}
.dark .sub{color:#c9d2e4}
.dark .quote{background:rgba(255,255,255,.06);border-left:4px solid var(--red);border-radius:0 14px 14px 0;padding:22px 26px;font-size:20px;font-family:Georgia,serif}
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.dark p{margin-bottom:14px;font-size:18px;opacity:.95}

/* карточки */
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.cards2{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.card{background:var(--white);border-radius:18px;overflow:hidden;box-shadow:0 6px 24px rgba(10,22,48,.08);display:flex;flex-direction:column;transition:transform .25s ease, box-shadow .25s ease}
.card:hover{transform:scale(1.02);box-shadow:0 18px 44px rgba(10,22,48,.16)}
.card .img{background:var(--mint);padding:18px;text-align:center}
.card .img img{max-height:200px;max-width:100%;object-fit:contain}
.card .body{padding:22px 24px 26px;display:flex;flex-direction:column;flex:1}
.card h3{font-size:24px;margin-bottom:4px}
.card .tag{color:var(--red);font-size:15px;margin-bottom:12px}
.card p{font-size:17px;margin-bottom:14px}
.card .price{font-family:Georgia,serif;font-size:20px;margin:2px 0 16px;font-weight:700}
.card .btn{margin-top:auto}

/* сетка доверия / пунктов */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.t-item{background:#fff;border-radius:14px;padding:22px 24px}
.t-item b{display:block;font-family:Georgia,serif;font-size:20px;margin-bottom:8px}
.t-item span{font-size:16px;color:#3c455c}
/* .light теперь прозрачная — показывает золото→бежевый→голубой градиент body */
.light{background:transparent}

/* развёрнутая карточка аппарата */
.device{background:var(--white);border-radius:20px;box-shadow:0 6px 24px rgba(10,22,48,.08);overflow:hidden;margin-bottom:36px}
.device .head{display:grid;grid-template-columns:340px 1fr;gap:0}
.device .photo{background:var(--mint);display:flex;align-items:center;justify-content:center;padding:26px}
.device .photo img{max-width:100%;max-height:280px;object-fit:contain}
.device .intro{padding:30px 34px}
.device .intro h3{font-size:30px;margin-bottom:4px}
.device .intro .tag{color:var(--red);font-size:16px;margin-bottom:14px}
.device .intro p{font-size:17px;margin-bottom:12px}
.device .specs{padding:8px 34px 30px}
.spec-table{width:100%;border-collapse:collapse;font-size:16px}
.spec-table td{padding:9px 12px;border-bottom:1px solid #eee7d8;vertical-align:top}
.spec-table td:first-child{color:#6b7386;width:42%}
.device .foot{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:0 34px 30px}
.device .price{font-family:Georgia,serif;font-size:26px;font-weight:700}

/* шаги */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:step}
.step{background:#fff;border-radius:14px;padding:22px;position:relative}
.step:before{counter-increment:step;content:counter(step);display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:var(--navy);color:#fff;font-family:Georgia,serif;font-size:19px;margin-bottom:12px}
.step b{display:block;font-family:Georgia,serif;font-size:19px;margin-bottom:6px}
.step span{font-size:16px;color:#3c455c}

/* faq */
.faq details{background:#fff;border-radius:12px;margin-bottom:12px;padding:0;overflow:hidden}
.faq summary{cursor:pointer;padding:18px 22px;font-family:Georgia,serif;font-size:19px;list-style:none;position:relative;padding-right:46px}
.faq summary:after{content:'+';position:absolute;right:20px;top:14px;font-size:26px;color:var(--red)}
.faq details[open] summary:after{content:'–'}
.faq .a{padding:0 22px 18px;font-size:17px;color:#3c455c}

/* видео-заглушка на странице аппарата */
.video-frame{position:relative;border-radius:20px;overflow:hidden;aspect-ratio:16/9;background:var(--navy);box-shadow:0 18px 44px rgba(10,22,48,.16)}
.video-frame img{width:100%;height:100%;object-fit:cover;display:block;opacity:.45}
.video-frame .badge{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;gap:10px}
.video-frame .badge .play{width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,.14);border:1.5px solid rgba(255,255,255,.5);display:flex;align-items:center;justify-content:center;font-size:22px}
.video-frame .badge b{font-family:Georgia,serif;font-size:20px;font-weight:600}
.video-frame .badge span{font-size:15px;opacity:.85;max-width:360px}

/* FAQ под каждым аппаратом */
.device-faq{margin:-8px 0 36px}
.device-faq h3{margin-bottom:16px}

/* капилляроскопия: состояния */
.cap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cap{background:#fff;border-radius:14px;padding:22px}
.cap b{display:block;font-family:Georgia,serif;font-size:20px;margin-bottom:8px}
.cap .what{font-size:15px;color:var(--red);margin-bottom:8px}
.cap span{font-size:16px;color:#3c455c}

/* студии */
.st-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.st{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:22px}
.st b{display:block;font-family:Georgia,serif;font-size:22px;margin-bottom:6px}
.st span{display:block;font-size:15px;opacity:.85;margin-bottom:12px;min-height:44px}
.st a{color:var(--red);font-size:18px;text-decoration:none;font-weight:700}

/* финальная CTA */
.final{background:var(--mint);text-align:center}
.final h2{font-size:34px}
.final p{max-width:640px;margin:0 auto 26px}
.final .cta{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}

/* научные карточки */
.sci{background:#fff;border-radius:14px;padding:24px;margin-bottom:16px}
.sci b{font-family:Georgia,serif;font-size:20px}
.sci .src{font-size:15px;color:#6b7386;margin-top:8px}
.sci .src a{color:var(--red)}
.note{background:#fff;border-left:4px solid var(--red);border-radius:0 12px 12px 0;padding:20px 24px;font-size:17px;margin-top:28px}

/* === v2: визуальные компоненты === */

/* hero с фоновым фото */
.hero-img{position:relative;color:#fff;overflow:hidden;background:var(--navy)}
.hero-img .bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0}
.hero-img .bg:after{content:'';position:absolute;inset:0;background:linear-gradient(100deg,rgba(10,22,48,.92) 0%,rgba(10,22,48,.78) 44%,rgba(10,22,48,.35) 100%)}
.hero-img .wrap{position:relative;z-index:1;padding:96px 20px 84px}
.hero-img h1{font-size:48px;max-width:760px;margin-bottom:20px;color:#fff}
.hero-img p.lead{font-size:21px;max-width:620px;margin-bottom:14px;color:#e7ecf5}
.hero-img .chips{margin-top:30px}
.hero-img .chip{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);color:#fff}

/* сплит текст + картинка */
.split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.split.rev .txt{order:2}
.split .ph{border-radius:20px;overflow:hidden;box-shadow:0 18px 44px rgba(10,22,48,.16);aspect-ratio:4/3;background:var(--mint)}
.split .ph img{width:100%;height:100%;object-fit:cover;display:block}
.split h2{margin-bottom:16px}
.split p{margin-bottom:14px;font-size:18px}

/* фото-баннер-полоса */
.band{position:relative;color:#fff;text-align:center;overflow:hidden}
.band .bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0}
.band .bg:after{content:'';position:absolute;inset:0;background:rgba(10,22,48,.72)}
.band .wrap{position:relative;z-index:1;padding:66px 20px}
.band h2{color:#fff}
.band p{max-width:660px;margin:0 auto 22px;color:#e7ecf5;font-size:19px}

/* карточка процедуры с фото-шапкой */
.card .imgphoto{aspect-ratio:16/10;background:var(--mint);overflow:hidden}
.card .imgphoto img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}
.card:hover .imgphoto img{transform:scale(1.06)}

/* мини-фото в карточке доверия */
.t-item.withpic{padding:0;overflow:hidden}
.t-item.withpic .pic{aspect-ratio:16/9;overflow:hidden}
.t-item.withpic .pic img{width:100%;height:100%;object-fit:cover;display:block}
.t-item.withpic .tx{padding:20px 24px}
.t-item.withpic .tx b{margin-bottom:8px;display:block;font-family:Georgia,serif;font-size:20px}
.t-item.withpic .tx span{font-size:16px;color:#3c455c}

/* полоса статистики */
.statsband{padding:34px 0}
.statsband .stats{background:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.7);border-radius:18px;padding:30px 22px;box-shadow:0 8px 26px rgba(10,22,48,.06)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;text-align:center}
.stat .n{font-family:Georgia,serif;font-size:42px;color:var(--red);line-height:1}
.stat .l{font-size:16px;color:#3c455c;margin-top:8px}
.dark .stat .n{color:#ff7a75}
.dark .stat .l{color:#c9d2e4}

footer{background:var(--navy);color:#aab3c6;padding:30px 0;font-size:13px;line-height:1.6}
footer a{color:#dfe5f0}

@media (max-width:900px){
  .hero h1{font-size:34px}
  .hero-img h1,.hero-gold h1{font-size:34px}
  .hero-img .wrap,.hero-gold .wrap{padding:56px 20px 48px}
  h2{font-size:28px}
  .cards3,.grid3,.cap-grid,.steps{grid-template-columns:1fr}
  .cards2,.grid2{grid-template-columns:1fr}
  .st-grid,.stats{grid-template-columns:1fr 1fr}
  .cols2{grid-template-columns:1fr}
  .device .head{grid-template-columns:1fr}
  .split{grid-template-columns:1fr;gap:28px}
  .split.rev .txt{order:0}
  .hero-gold .split{grid-template-columns:1fr;padding:48px 20px}
  .hero-gold .split h1{font-size:30px}
  .hero-gold .split .ph{aspect-ratio:4/3;min-height:220px}
  body{font-size:17px}
}
@media (max-width:560px){
  .st-grid{grid-template-columns:1fr}
}
