/* BOSCO Beauty Club — главная и страницы услуг.
   Блог по-прежнему на assets/styles.css + blog/blog.css.
   Селекторы только по классам и id: никаких правил на голые nav/section. */
:root{
  --cream:#f8f3ea; --paper:#fffdf8; --stone:#ece3d3; --ink:#1d1815; --ink-soft:#5a5049;
  --wine:#6c2b35; --wine-dark:#4a1d24; --gold:#b8944f; --sand:#e9c98f;
  --line:rgba(29,24,21,.14);
  --display:'Bodoni Moda',Georgia,serif; --text:'Jost',system-ui,sans-serif;
  --wrap:1160px; --gutter:24px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; scroll-padding-top:84px; -webkit-text-size-adjust:100%;}
body{background:var(--cream); color:var(--ink); font-family:var(--text); font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased;}
img{max-width:100%; height:auto;}
a{color:inherit;}
:focus-visible{outline:2px solid var(--gold); outline-offset:3px;}
.container{max-width:var(--wrap); margin:0 auto; padding:0 var(--gutter);}
h1,h2,h3{font-family:var(--display); font-weight:500; line-height:1.12; letter-spacing:-.01em;}
h2{font-size:clamp(30px,4.2vw,46px);}
.eyebrow{display:none;}
.section-head{margin-bottom:36px;}

/* ---------- шапка ---------- */
#nav{position:fixed; inset:0 0 auto 0; z-index:50; height:68px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:0 max(var(--gutter), calc((100vw - var(--wrap))/2 + var(--gutter))); background:var(--ink); color:var(--cream);}
#nav .logo, .logo--footer{font-family:var(--display); font-size:22px; font-weight:600; letter-spacing:.02em; white-space:nowrap;}
.logo em{font-style:italic; font-weight:500; color:var(--sand);}
.nav-links{display:flex; align-items:center; gap:26px;}
.nav-links .nl{font-size:15px; text-decoration:none; opacity:.82;}
.nav-links .nl:hover{opacity:1;}
.lang-toggle{display:flex; border:1px solid rgba(248,243,234,.3); border-radius:20px; overflow:hidden; font-size:12px; font-weight:600;}
.lang-toggle a.lang-btn{padding:6px 10px; text-decoration:none; opacity:.65; white-space:nowrap;}
.lang-toggle a.lang-btn:hover{opacity:1;}
.lang-toggle a.lang-btn.active{background:var(--sand); color:var(--ink); opacity:1;}
.nav-cta{background:var(--sand); color:var(--ink); font-weight:600; font-size:15px; padding:10px 20px; border-radius:999px; text-decoration:none; white-space:nowrap;}
.nav-cta:hover{background:#f1d7a5;}
.burger{display:none; background:none; border:0; color:var(--cream); font-size:26px; line-height:1; padding:8px; cursor:pointer;}

/* ---------- кнопки ---------- */
.btn-solid{display:inline-block; background:var(--wine); color:#fff; font-weight:600; font-size:16px; padding:15px 28px; border-radius:999px; text-decoration:none; border:0; cursor:pointer; font-family:var(--text);}
.btn-solid:hover{background:var(--wine-dark);}

/* ---------- первый экран: обещание слева, заявка справа ---------- */
.hero{padding:calc(68px + 56px) 0 72px;}
.hero-grid{display:grid; grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr); gap:64px; align-items:center;}
.badge{display:inline-flex; align-items:center; gap:10px; font-size:15px; color:var(--ink-soft); margin-bottom:22px;}
.badge .dot{width:8px; height:8px; border-radius:50%; background:var(--wine);}
.hero h1{font-size:clamp(40px,6.2vw,78px); line-height:1.02; letter-spacing:-.02em; margin-bottom:24px;}
.hero h1 i{font-style:italic; color:var(--wine);}
.hero .sub{font-size:19px; color:var(--ink-soft); max-width:34em; margin-bottom:40px;}
.stat-row{display:flex; flex-wrap:wrap; gap:14px 44px; padding-top:28px; border-top:1px solid var(--line);}
.stat-row b{display:block; font-family:var(--display); font-weight:500; font-size:34px; line-height:1.1;}
.stat-row span{font-size:14px; color:var(--ink-soft);}
.stat-row{position:relative; padding-right:84px; min-height:132px;}
.award-badge.stat-award{position:absolute; right:0; top:22px; width:54px;}

.hero-ctas{display:flex; flex-wrap:wrap; align-items:center; gap:14px 26px; margin-bottom:40px;}
.hero .sub{margin-bottom:30px;}
.btn-line{font-size:16px; color:var(--ink); text-underline-offset:4px;}
.btn-line:hover{color:var(--wine);}
.hero-grid--plain{grid-template-columns:minmax(0,820px);}
.hero-media{position:relative;}
.hero-photo{display:block; width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:200px 200px 22px 22px;}
.hero-media--duo{padding:0 0 56px 64px;}
.hero-photo--small{position:absolute; left:0; bottom:0; width:44%; border-radius:18px; border:6px solid var(--cream);}

/* ---------- работы ---------- */
.gallery{padding:88px 0 0;}
.gallery h2{margin-bottom:30px;}
.gallery-strip{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
.gallery-strip img{display:block; width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:16px;}
.gallery + .services{background:var(--cream);}

/* ---------- заявка ---------- */
.lead-section{background:var(--wine); color:var(--cream); padding:80px 0;}
.lead-block{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,460px); grid-template-rows:auto auto 1fr; column-gap:72px; align-items:start;}
.lead-block h2{font-size:clamp(30px,4vw,44px); margin-bottom:14px;}
.lead-block .lead{font-size:18px; opacity:.85; margin-bottom:24px; max-width:26em;}
.lead-block .form-card{grid-column:2; grid-row:1 / span 3;}
.lead-block .form-alt{grid-column:1; grid-row:3; border-top:1px solid rgba(248,243,234,.22); max-width:26em;}
.hp{position:absolute; left:-9999px;}
.form-row{margin-bottom:14px;}
.form-row label{display:block; font-size:13.5px; opacity:.85; margin-bottom:6px;}
.form-row input, .form-row select{width:100%; font:inherit; font-size:16px; color:var(--ink); background:var(--paper); border:1px solid transparent; border-radius:12px; padding:13px 14px; appearance:none; -webkit-appearance:none;}
.form-row select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231d1815' stroke-width='1.6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; padding-right:38px;}
.form-row input:focus, .form-row select:focus{outline:2px solid var(--sand); outline-offset:1px;}
.form-row input::placeholder{color:#9c9189;}
.form-submit{width:100%; margin-top:6px; font:inherit; font-weight:600; font-size:17px; color:var(--ink); background:var(--sand); border:0; border-radius:999px; padding:16px 20px; cursor:pointer;}
.form-submit:hover{background:#f1d7a5;}
.form-submit:disabled{opacity:.6; cursor:default;}
.form-note{font-size:12.5px; opacity:.7; margin-top:12px; line-height:1.5;}
.form-err{display:none; margin-top:12px; font-size:14px; background:rgba(0,0,0,.25); border-radius:10px; padding:10px 12px;}
.form-ok{display:none; padding:18px 0 6px;}
.form-ok b{display:block; font-family:var(--display); font-weight:500; font-size:26px; margin-bottom:6px;}
.form-alt{font-size:15px; padding-top:18px; line-height:1.8;}
.form-alt span{opacity:.75;}
.form-alt a{color:var(--sand);}

/* ---------- акции ---------- */
.quick-nav{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:34px;}
.quick-nav a{font-size:15px; color:var(--ink); border:1px solid rgba(29,24,21,.28); border-radius:999px; padding:8px 15px; text-decoration:none; white-space:nowrap;}
.quick-nav a:hover{border-color:var(--ink);}
.quick-nav a.is-accent{background:var(--stone); border-color:var(--stone); color:var(--wine); font-weight:600;}
.hero-ctas{margin-bottom:22px;}
.offers{padding:72px 0; background:var(--stone);}
.offers h2{margin-bottom:28px;}
.offer-grid{display:grid; grid-template-columns:repeat(6,1fr); gap:14px;}
.offer{grid-column:span 2; display:flex; flex-direction:column; background:var(--paper); border-radius:18px; padding:24px 24px 22px;}
.offer:nth-child(-n+2){grid-column:span 3;}
.offer h3{font-size:24px; line-height:1.2; margin-bottom:8px;}
.offer p{font-size:15.5px; color:var(--ink-soft); margin-bottom:20px;}
.offer-foot{margin-top:auto; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px;}
.offer-price{font-family:var(--display); font-size:28px; color:var(--wine); white-space:nowrap;}
.offer-btn{font-size:15px; font-weight:600; color:var(--ink); border:1px solid var(--ink); border-radius:999px; padding:9px 16px; text-decoration:none; white-space:nowrap;}
.offer-btn:hover{background:var(--ink); color:var(--cream);}

/* ---------- подарок ---------- */
.promo{background:var(--ink); color:var(--cream);}
.promo-inner{display:flex; align-items:center; justify-content:space-between; gap:20px 40px; flex-wrap:wrap; padding-top:26px; padding-bottom:26px;}
.promo h2{font-size:clamp(20px,2.4vw,26px); max-width:24em;}
.timer-block{display:flex; align-items:center; gap:18px;}
.timer{display:flex; gap:8px;}
.chip{min-width:58px; text-align:center; border:1px solid rgba(248,243,234,.28); border-radius:12px; padding:6px 8px 5px;}
.chip b{display:block; font-family:var(--display); font-weight:500; font-size:24px; line-height:1.1; font-variant-numeric:tabular-nums;}
.chip span{font-size:11.5px; opacity:.7;}
.promo .btn-solid{background:var(--sand); color:var(--ink);}
.promo .btn-solid:hover{background:#f1d7a5;}

/* ---------- прайс как меню ---------- */
.services{padding:88px 0; background:var(--paper);}
.svc-tabs{display:flex; gap:6px 28px; flex-wrap:wrap; border-bottom:1px solid var(--line); margin-bottom:10px;}
.svc-tab{font-size:17px; color:var(--ink-soft); padding:10px 0 12px; cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px;}
.svc-tab:hover{color:var(--ink);}
.svc-tab.active{color:var(--ink); font-weight:600; border-bottom-color:var(--wine);}
.svc-panel{display:none;}
.svc-panel.active{display:block;}
.svc-tabs, .svc-panel, .faq-item{max-width:860px;}
.svc-row{display:flex; align-items:baseline; justify-content:space-between; gap:18px; padding:17px 0; border-bottom:1px dotted rgba(29,24,21,.3);}
.svc-row .name{font-size:18px;}
.svc-row .desc{font-size:14.5px; color:var(--ink-soft); margin-top:3px; max-width:36em;}
.svc-row .price{font-family:var(--display); font-size:21px; white-space:nowrap; color:var(--wine);}
.more-link{display:inline-block; margin-top:18px; font-size:15px; color:var(--wine); text-underline-offset:3px;}
.price-note{margin-top:22px; font-size:14px; color:var(--ink-soft);}
.services .btn-solid{margin-top:26px;}

/* ---------- о клубе ---------- */
.about{padding:88px 0;}
.about h2{margin-bottom:24px;}
.about p{font-size:18px; color:var(--ink-soft); max-width:40em; margin-bottom:14px;}

/* ---------- отзывы ---------- */
.reviews{padding:88px 0; background:var(--stone);}
.awards{display:flex; align-items:center; gap:28px; margin-bottom:44px;}
.award-badge{width:92px; flex:none;}
.awards-text b{font-family:var(--display); font-weight:500; font-size:24px;}
.awards-text p{font-size:15.5px; color:var(--ink-soft); max-width:34em; margin:4px 0 14px;}
.rating-badges{display:flex; gap:12px; flex-wrap:wrap;}
.rating-badge iframe{display:block; border:0; border-radius:8px;}
.review-grid{display:grid; grid-template-columns:repeat(3,1fr);}
.review-card{display:block; text-decoration:none; padding:6px 32px 6px 0;}
.review-card .who{text-decoration:underline; text-underline-offset:3px;}
.review-card:hover p{color:var(--wine);}
.review-card + .review-card{padding-left:32px; border-left:1px solid var(--line);}
.stars{color:var(--gold); letter-spacing:3px; font-size:15px; margin-bottom:12px;}
.review-card p{font-family:var(--display); font-size:21px; line-height:1.4; margin-bottom:16px;}
.who{font-size:14px; color:var(--ink-soft);}

/* ---------- вопросы ---------- */
.faq{padding:88px 0;}
.faq h2{margin-bottom:26px;}
.faq-item{border-bottom:1px solid var(--line);}
.faq-item summary{list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:baseline; gap:20px; padding:20px 0; font-size:19px; font-weight:500;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:'+'; font-family:var(--display); font-size:26px; line-height:.8; color:var(--wine); flex:none;}
.faq-item[open] summary::after{content:'–';}
.faq-item p{color:var(--ink-soft); max-width:42em; padding:0 0 22px;}
.faq .btn-solid{margin-top:34px;}

/* ---------- контакты ---------- */
.location{padding:88px 0; background:var(--paper);}
.loc-grid{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:56px; align-items:start;}
.loc-item{display:flex; gap:14px; padding:16px 0; border-bottom:1px solid var(--line);}
.loc-item .ico{display:none;}
.loc-item b{display:block; font-size:14px; font-weight:500; color:var(--ink-soft);}
.loc-item span{font-size:19px;}
.map-links{display:flex; gap:12px; flex-wrap:wrap; margin-top:24px;}
.map-links a{font-size:15px; border:1px solid var(--ink); border-radius:999px; padding:9px 18px; text-decoration:none;}
.map-links a:hover{background:var(--ink); color:var(--cream);}
.gis-widget iframe{display:block; width:100%; height:440px; border:0; border-radius:18px; background:var(--stone);}

/* ---------- подвал ---------- */
footer{background:var(--ink); color:rgba(248,243,234,.75); font-size:14.5px; padding:44px 0 40px;}
.foot-grid{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:18px 36px;}
.foot-grid > div{display:flex; gap:16px; flex-wrap:wrap;}
.logo--footer{color:var(--cream);}
footer a{text-decoration:none;}
footer a:hover{color:var(--cream); text-decoration:underline;}

/* ---------- закреплённая кнопка на телефоне ---------- */
.sticky-cta{display:none;}

@media (max-width:980px){
  .nav-links{display:none; position:absolute; top:68px; left:0; right:0; flex-direction:column; align-items:flex-start; gap:4px; background:var(--ink); padding:10px var(--gutter) 22px; border-top:1px solid rgba(248,243,234,.12);}
  .nav-links.open{display:flex;}
  .nav-links .nl{font-size:18px; padding:10px 0; width:100%;}
  .lang-toggle{margin:10px 0 14px; font-size:14px;}
  .lang-toggle a.lang-btn{padding:10px 16px;}
  .burger{display:block;}
  .hero{padding:calc(68px + 32px) 0 48px;}
  .hero-grid{grid-template-columns:1fr; gap:36px;}
  .hero-media{max-width:420px;}
  .offer, .offer:nth-child(-n+2){grid-column:span 3;}
  .lead-block{grid-template-columns:1fr; grid-template-rows:none;}
  .lead-block .form-card, .lead-block .form-alt{grid-column:1; grid-row:auto;}
  .lead-block .form-alt{margin-top:22px;}
  .gallery-strip{grid-template-columns:repeat(3,1fr);}
  .hero .sub{font-size:17.5px; margin-bottom:28px;}
  .loc-grid{grid-template-columns:1fr; gap:32px;}
  .review-grid{grid-template-columns:1fr;}
  .review-card, .review-card + .review-card{padding:24px 0; border-left:0;}
  .review-card + .review-card{border-top:1px solid var(--line);}
}
@media (max-width:640px){
  :root{--gutter:20px;}
  body{font-size:16.5px; padding-bottom:76px;}
  .services, .about, .reviews, .faq, .location{padding:60px 0;}
  .offers{padding:52px 0;}
  .offer, .offer:nth-child(-n+2){grid-column:span 6;}
  .offer{padding:16px 18px 16px;}
  .offer h3{font-size:19px; margin-bottom:4px;}
  .offer p{font-size:14.5px; line-height:1.45; margin-bottom:12px;}
  .offer-price{font-size:23px;}
  .offer-btn{font-size:14px; padding:8px 14px;}
  .offer-grid{gap:10px;}
  .offers h2{margin-bottom:18px;}
  /* по кнопке «Оставить заявку» форма встаёт вплотную под шапку, чтобы на экран помещались и ссылки под ней */
  .lead-section{padding:28px 0 36px; scroll-margin-top:-16px;}
  .lead-block h2{font-size:27px; margin-bottom:8px;}
  .lead-block .lead{font-size:16px; margin-bottom:14px;}
  .lead-block .form-row{margin-bottom:10px;}
  .lead-block .form-alt{margin-top:14px; padding-top:12px;}
  .gallery{padding-top:60px;}
  .gallery-strip{display:flex; overflow-x:auto; scroll-snap-type:x mandatory; margin:0 calc(-1*var(--gutter)); padding:0 var(--gutter); gap:10px; scrollbar-width:none;}
  .gallery-strip::-webkit-scrollbar{display:none;}
  .gallery-strip img{flex:0 0 68%; scroll-snap-align:center;}
  /* телефон: сначала фото работы, потом заголовок и кнопка — всё на первом экране */
  .hero{padding:calc(68px + 14px) 0 40px;}
  .hero-grid{display:flex; flex-direction:column; gap:20px;}
  .hero-copy{min-width:0; width:100%;}
  .hero-media, .hero-media--duo{order:-1; max-width:none; width:100%; padding:0;}
  .hero-photo{aspect-ratio:16/10; border-radius:18px; object-position:50% 45%;}
  .hero-photo--small{display:none;}
  .badge{font-size:13.5px; margin-bottom:12px;}
  .hero h1{font-size:34px; margin-bottom:14px;}
  .hero .sub{font-size:16px; margin-bottom:20px;}
  .hero-ctas{margin-bottom:18px;}
  .quick-nav{margin-bottom:26px; flex-wrap:nowrap; overflow-x:auto; margin-left:calc(-1*var(--gutter)); margin-right:calc(-1*var(--gutter)); padding:0 var(--gutter); scrollbar-width:none;}
  .quick-nav::-webkit-scrollbar{display:none;}
  .stat-row{gap:14px 28px; padding-right:96px; min-height:176px;}
  .award-badge.stat-award{width:72px; top:24px;}
  .stat-row b{font-size:27px;}
  .svc-tabs{gap:0 22px; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none;}
  .svc-tabs::-webkit-scrollbar{display:none;}
  .svc-tab{white-space:nowrap;}
  .svc-row .name{font-size:16.5px;}
  .svc-row .price{font-size:18px;}
  .awards{align-items:flex-start; gap:18px;}
  .award-badge{width:68px;}
  .promo-inner{flex-direction:column; align-items:flex-start;}
  .gis-widget iframe{height:360px;}
  .sticky-cta{display:flex; gap:10px; position:fixed; left:0; right:0; bottom:0; z-index:40; padding:10px 14px calc(10px + env(safe-area-inset-bottom)); background:rgba(248,243,234,.96); border-top:1px solid var(--line); transition:transform .25s;}
  .sticky-cta.is-hidden{transform:translateY(110%);}
  .sticky-cta .btn-solid{flex:1; text-align:center; padding:14px 18px;}
  .sticky-call{flex:none; width:52px; display:flex; align-items:center; justify-content:center; border:1px solid var(--ink); border-radius:999px; text-decoration:none; font-size:20px;}
}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} .sticky-cta{transition:none;} }