/* =====================================================================
   Luxury Beauty Studio — design v3 (2027)
   Concept: a printed beauty journal — warm paper, editorial type,
   photographs that reveal like magazine plates. The hero is untouched.
   ===================================================================== */
:root{
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.16 0 0 0 0 0.12 0 0 0 0 0.1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --r-lg:15px; --r-md:15px;
  --shadow-1:0 1px 2px rgba(42,32,27,.05),0 8px 24px -12px rgba(42,32,27,.18);
  --shadow-2:0 2px 6px rgba(42,32,27,.06),0 30px 60px -28px rgba(42,32,27,.38);
  --spring:cubic-bezier(.22,1.2,.36,1);
}

/* ---------- global craft ---------- */
html{scrollbar-color:var(--accent) var(--cream)}
::selection{background:var(--accent);color:#fff}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:15px}
body::after{content:"";position:fixed;inset:0;z-index:2;pointer-events:none;background-image:var(--grain);opacity:.045}
h1,h2,h3{text-wrap:balance}
p,li{text-wrap:pretty}
img{-webkit-user-drag:none}
.btn{transition:background .3s var(--ease),color .3s,transform .4s var(--spring),box-shadow .3s}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0) scale(.98)}
.btn-primary:hover,.btn-accent:hover{box-shadow:0 14px 30px -14px rgba(143,93,62,.7)}

/* eyebrow becomes a numbered chapter mark on the homepage */
main{counter-reset:chapter}
main > section:not(.hero) .eyebrow{counter-increment:chapter}
main > section:not(.hero) .eyebrow::before{content:counter(chapter,decimal-leading-zero);width:auto;height:auto;background:none;font-family:var(--serif);font-style:italic;font-size:15px;letter-spacing:0;color:var(--accent-d);padding-right:12px;margin-right:2px;border-right:1px solid currentColor}

/* photo plates: reveal with the scroll (modern browsers), static elsewhere */
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion:no-preference){
    .about-photo img,.service-image img,.elite-view,.price-img img,.sp-service-img img,.post-card-img img,.featured-img img,.program-img img{
      animation:plate linear both;animation-timeline:view();animation-range:entry 0% cover 32%}
    @keyframes plate{from{clip-path:inset(14% 10% 14% 10% round 15px);transform:scale(1.08)}to{clip-path:inset(0 0 0 0 round 0);transform:none}}
    .video-bg-section{animation:inset-in linear both;animation-timeline:view();animation-range:entry 0% cover 40%}
    @keyframes inset-in{from{clip-path:inset(0 6% round 15px)}to{clip-path:inset(0 0 round 0)}}
  }
}

/* ---------- marquee ---------- */
.marquee{padding:20px 0;border-block:1px solid rgba(243,233,224,.08)}

/* ---------- about: editorial spread ---------- */
#about{position:relative;padding:140px 0 130px}
#about .wrap{grid-template-columns:.95fr 1.05fr;gap:110px}
#about .about-photo{max-width:none}
#about .about-photo img{border-radius:var(--r-lg);aspect-ratio:4/5;box-shadow:var(--shadow-2)}
#about .about-photo::after{inset:-18px 18px 18px -18px;border-radius:var(--r-lg);border-color:var(--accent-l)}
#about h2{font-size:clamp(48px,6.4vw,104px);line-height:.95;margin:22px 0 34px}
#about .about-text > p:not(.about-quote){font-size:17px;max-width:520px}
#about .about-quote{font-size:clamp(28px,3vw,42px);border-left:0;padding:0;margin:44px 0 30px;position:relative}
#about .about-quote::before{content:"“";position:absolute;left:-.55em;top:-.35em;font-size:3.2em;line-height:1;color:var(--accent-l);font-style:normal}
#about .about-sign{font-size:40px;color:var(--accent-d)}

/* ---------- services: staggered magazine plates ---------- */
#services{background:var(--cream);position:relative;overflow:hidden}
#services .sec-head h2{font-size:clamp(52px,7vw,112px);line-height:.92}
.services-grid{gap:26px;align-items:start}
.service-card{background:transparent;border-radius:0;overflow:visible;box-shadow:none!important}
.service-card:hover{transform:none}
.service-image{border-radius:var(--r-lg);aspect-ratio:3/4.2;box-shadow:var(--shadow-1);transition:box-shadow .6s var(--ease),transform .6s var(--ease)}
.service-card:hover .service-image{box-shadow:var(--shadow-2);transform:translateY(-6px)}
.service-image::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(29,22,18,.35));pointer-events:none}
.service-card .service-price{top:auto;bottom:16px;right:16px;z-index:2;background:rgba(252,248,244,.88);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-size:14px;padding:9px 16px;box-shadow:var(--shadow-1)}
.service-num{z-index:2;background:rgba(252,248,244,.18);border:1px solid rgba(252,248,244,.5)}
.service-content{padding:22px 4px 0;background:transparent}
.service-content h3{font-size:clamp(28px,2.4vw,36px)}
.service-actions .btn{height:46px}
.services-more{margin-top:70px}

/* ---------- price: a menu card ---------- */
.price-section .wrap{align-items:start}
.price-aside{position:sticky;top:110px}
.price-aside h2{font-size:clamp(64px,8vw,128px);line-height:.9}
.price-list{background:rgba(243,233,224,.035);border:1px solid rgba(243,233,224,.09);border-radius:var(--r-lg);padding:20px 40px 30px;backdrop-filter:blur(2px)}
.price-group{font-size:12px;margin-top:34px!important;padding-bottom:10px;border-bottom:1px solid rgba(243,233,224,.14);display:flex;justify-content:space-between}
.price-group:first-child{margin-top:16px!important}
.price-item{position:relative;padding:17px 0;transition:padding .35s var(--ease),background .35s}
.price-item::before{content:"";position:absolute;left:-18px;top:50%;width:6px;height:6px;border-radius:50%;background:var(--accent);transform:translateY(-50%) scale(0);transition:transform .35s var(--spring)}
.price-item:hover{padding-left:10px}
.price-item:hover::before{transform:translateY(-50%) scale(1)}
.price-item .service-price{font-size:28px;font-variant-numeric:lining-nums tabular-nums}

/* ---------- course: stacked program cards ---------- */
.course-section{background:linear-gradient(180deg,var(--paper),var(--cream))}
.course-title h2{font-size:clamp(46px,6.2vw,96px);line-height:.95}
.course-features{gap:16px}
.feature-item{background:var(--paper);border:1px solid var(--line)!important;border-radius:var(--r-md);padding:26px 26px 24px;box-shadow:var(--shadow-1);grid-template-columns:76px 1fr}
.feature-item:last-child{border-bottom:1px solid var(--line)}
.feature-number{font-size:52px}
@media (min-width:981px){
  .course-features .feature-item{position:sticky;top:110px}
  .course-features .feature-item:nth-child(2){top:126px}.course-features .feature-item:nth-child(3){top:142px}
  .course-features .feature-item:nth-child(4){top:158px}.course-features .feature-item:nth-child(5){top:174px}
  .course-description{top:110px}
}
.course-description{background:var(--dark);color:var(--on-dark);border-radius:var(--r-lg);box-shadow:var(--shadow-2)}
.course-description p,.course-description li{color:var(--on-dark-2)!important}
.course-description p strong{color:var(--on-dark)!important}
.course-list li{border-color:rgba(243,233,224,.12)!important}
.course-description .btn-primary{background:var(--accent-d);color:#fff}
.course-description .btn-ghost{border-color:rgba(243,233,224,.4);color:var(--on-dark)}
.course-description .btn-ghost:hover{background:var(--on-dark);color:var(--dark)}

/* ---------- gallery ---------- */
.elite-gallery-title{font-size:clamp(56px,7.4vw,120px);line-height:.92}
.elite-view{border-radius:var(--r-lg);box-shadow:var(--shadow-2);aspect-ratio:4/5}
.elite-count{position:absolute;left:20px;bottom:18px;z-index:3;font-family:var(--serif);font-style:italic;font-size:20px;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.4);pointer-events:none}
.elite-count b{font-size:34px;font-weight:500}
.elite-thumbs{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:6px 2px}
.elite-thumbs::-webkit-scrollbar{display:none}
.elite-thumbs button{flex:0 0 64px;scroll-snap-align:start;border-radius:15px;transition:opacity .3s,transform .4s var(--spring)}
.elite-thumbs button:hover{transform:translateY(-3px)}
.elite-nav{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}

/* ---------- video band ---------- */
.video-bg-section{height:86vh;min-height:520px}
.video-overlay p{font-size:clamp(40px,5.4vw,84px);max-width:860px}

/* ---------- master ---------- */
.master-section .wrap{max-width:1000px}
.master-title{font-size:clamp(46px,6vw,92px)}

/* ---------- contacts ---------- */
.contact-card{border-radius:15px;box-shadow:var(--shadow-2)}
.contact-info .section-title{font-size:clamp(56px,6.4vw,104px)}
.contact-form{box-shadow:var(--shadow-2)}

/* ---------- footer (all pages) ---------- */
.site-footer{position:relative;background:var(--dark);color:var(--on-dark);border-top:0;overflow:hidden;margin-top:0!important}
.sf-top{max-width:var(--wrap);margin:0 auto;padding:90px 32px 40px;display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:48px}
.sf-logo{display:inline-flex;flex-direction:column;font-family:var(--serif);font-style:italic;font-size:34px;line-height:1;color:var(--on-dark)}
.sf-logo span{font-family:var(--sans);font-style:normal;font-size:9.5px;letter-spacing:.42em;text-transform:uppercase;color:#d7ae92;margin-top:8px;font-weight:600}
.sf-brand p{color:var(--on-dark-2);font-size:14.5px;max-width:320px;margin:22px 0 26px}
.sf-cta{height:48px}
.sf-col{display:flex;flex-direction:column;gap:11px;font-size:14.5px}
.sf-col h3{font-family:var(--sans)!important;font-size:11px!important;font-weight:600!important;letter-spacing:.24em;text-transform:uppercase;color:#d7ae92!important;margin:6px 0 10px}
.sf-col a,.sf-col span{color:var(--on-dark-2);transition:color .25s}
.sf-col a:hover{color:var(--on-dark)}
.sf-phone{font-family:var(--serif);font-size:24px;color:var(--on-dark)!important}
.sf-social{display:flex;gap:10px;margin-top:8px}
.sf-social a{width:44px;height:44px;border-radius:50%;border:1px solid rgba(243,233,224,.22);display:grid;place-items:center;color:var(--on-dark)}
.sf-social a:hover{background:var(--on-dark);color:var(--dark)}
.sf-social svg{width:18px;height:18px}
.sf-word{font-family:var(--serif);font-style:italic;font-size:clamp(70px,15vw,250px);line-height:.8;text-align:center;color:transparent;-webkit-text-stroke:1px rgba(243,233,224,.14);white-space:nowrap;user-select:none;margin:0 0 6px;padding-bottom:.1em}
.site-footer .footer-content{position:relative;max-width:var(--wrap);border-top:1px solid rgba(243,233,224,.1);color:var(--on-dark-2)!important}
.site-footer .footer-content .left,.site-footer .footer-content .right{color:var(--on-dark-2)!important}
.site-footer .studio-link{color:#d7ae92!important}
body.v2.p-404 .site-footer{background:#14100d}

/* ---------- floating booking button & mobile action bar ---------- */
.m-bar{display:none}
@media (max-width:980px){
  .float-btn{display:none!important}
  .m-bar{position:fixed;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));z-index:900;display:flex;gap:8px;padding:6px;border-radius:15px;background:rgba(29,22,18,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 18px 40px -16px rgba(0,0,0,.55);transition:transform .45s var(--ease),opacity .3s}
  .m-bar a{display:flex;align-items:center;justify-content:center;gap:10px;height:50px;border-radius:15px;color:#fff;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
  .m-bar svg{width:19px;height:19px}
  .m-bar-call{width:50px;flex:none;border:1px solid rgba(255,255,255,.22)}
  .m-bar-book{flex:1;background:var(--accent-d)}
  .m-bar.hide,body:has(.hero-split) .m-bar:not(.show){transform:translateY(140%);opacity:0;pointer-events:none}
  html.lb-lock .m-bar,body:has(.mobile-menu.active) .m-bar,body:has(#popup.active) .m-bar{transform:translateY(140%);opacity:0}
  .site-footer{padding-bottom:84px}
  .sf-top{grid-template-columns:1fr 1fr;gap:36px 24px;padding:64px 20px 30px}
  .sf-brand,.sf-col:last-child{grid-column:1/-1}
}

/* ---------- inner pages ---------- */
body.v2 .sp-section-title{font-size:clamp(36px,4.6vw,64px)!important;line-height:1.02}
body.v2 .sp-service-block{gap:64px}
@media (min-width:1025px){body.v2 .sp-service-img{position:sticky;top:100px}}
body.v2 .sp-service-img img{border-radius:var(--r-lg)!important}
body.v2 .sp-why-card,body.v2 .sp-other-card,body.v2 .faq-item,body.v2 .post-card,body.v2 .featured-card,body.v2 .sidebar-widget{border-radius:var(--r-md)!important;transition:transform .5s var(--ease),box-shadow .5s var(--ease)!important}
body.v2 .sp-why-card:hover,body.v2 .sp-other-card:hover,body.v2 .post-card:hover,body.v2 .featured-card:hover{transform:translateY(-5px)!important;box-shadow:var(--shadow-2)!important}
body.v2 .post-card-img,body.v2 .featured-img{overflow:hidden;border-radius:15px}
body.v2 .post-card-img img,body.v2 .featured-img img{transition:transform 1s var(--ease)}
body.v2 .post-card:hover .post-card-img img,body.v2 .featured-card:hover .featured-img img{transform:scale(1.05)}
body.v2 .faq-item{overflow:hidden}
body.v2 .faq-question{padding-top:18px!important;padding-bottom:18px!important}
body.v2 .sp-hero h1{text-wrap:balance}
body.v2 .sp-step-num{box-shadow:0 0 0 6px var(--cream)}

/* reading progress on articles */
@supports (animation-timeline: scroll()){
  body.p-article::before{content:"";position:fixed;left:0;top:0;height:3px;width:100%;z-index:1100;background:linear-gradient(90deg,var(--accent-d),var(--accent));transform-origin:0 50%;animation:readbar linear both;animation-timeline:scroll(root)}
  @keyframes readbar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
}
body.v2 .article-content{font-size:17.5px;line-height:1.85}

/* booking */
body.v2.p-booking .salon-card{transition:transform .4s var(--spring),box-shadow .4s}
body.v2.p-booking .salon-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-2)!important}

/* ---------- responsive ---------- */
@media (max-width:980px){
  #about{padding:96px 0}
  #about .wrap{grid-template-columns:1fr;gap:56px}
  #about .about-photo{max-width:420px}
  #about .about-quote::before{left:-.3em}
  .price-aside{position:static}
  .price-list{padding:8px 22px 20px}
  .price-item::before{left:-12px}
  .feature-item{grid-template-columns:58px 1fr;padding:20px}
}
@media (max-width:620px){
  #about h2,.elite-gallery-title,.contact-info .section-title{font-size:54px}
  #services .sec-head h2,.price-aside h2{font-size:60px}
  .price-list{padding:6px 16px 16px;border-radius:15px}
  .price-item .service-price{font-size:22px}
  .video-bg-section{height:70vh;min-height:420px}
  .sf-word{font-size:15.5vw}
}
@media (prefers-reduced-motion:reduce){
  .btn:hover{transform:none}
  .m-bar{transition:none}
}

/* =====================================================================
   v3.1 — wide editorial layouts (no more narrow centred column)
   ===================================================================== */
:root{--gut:clamp(20px,4.6vw,96px);--wrap:1720px}
main > section:not(.hero) > .wrap{max-width:var(--wrap);padding-inline:var(--gut)}
.site-footer .sf-top,.site-footer .footer-content{max-width:var(--wrap);padding-inline:var(--gut)}

@media (min-width:1101px){
  /* ---- ABOUT: portrait bleeds to the left edge, text breathes on the right ---- */
  #about{padding:0;overflow:hidden}
  #about .wrap{grid-template-columns:minmax(0,.92fr) minmax(0,1fr);gap:clamp(48px,6vw,120px);align-items:stretch;padding-left:0}
  #about .about-photo{margin:0;min-height:min(92vh,980px);position:relative}
  #about .about-photo img{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;border-radius:0 var(--r-lg) var(--r-lg) 0;box-shadow:none;object-position:50% 18%}
  #about .about-photo::after{display:none}
  #about .about-text{align-self:center;padding:120px 0;max-width:700px}
  #about h2{font-size:clamp(64px,7.4vw,140px)}

  /* ---- PRICE: wide menu card in two columns ---- */
  .price-section .wrap{grid-template-columns:minmax(300px,.36fr) minmax(0,1fr);gap:clamp(48px,6vw,120px)}
  .price-section .price-list{columns:2;column-gap:64px;padding:28px 48px 36px}
  .price-section .price-group{break-after:avoid;break-inside:avoid}
  .price-section .price-item{break-inside:avoid}
  .price-img{max-width:none;aspect-ratio:4/3.2}

  /* ---- COURSE: title on the left, program + offer on the right ---- */
  .course-section .wrap{display:grid;grid-template-columns:minmax(280px,.34fr) minmax(0,1fr);column-gap:clamp(40px,5vw,110px)}
  .course-section .course-title{text-align:left;margin:0;position:sticky;top:120px;align-self:start}
  .course-section .course-title .eyebrow{justify-content:flex-start}
  .course-section .course-container{gap:clamp(24px,3vw,56px)}

  /* ---- CONTACTS: full-width card ---- */
  .contact-card{padding:clamp(56px,5vw,100px)}
}


@media (min-width:1101px){
  /* titles that live in the narrow left column */
  #services .sec-head h2,.elite-gallery-title{font-size:clamp(56px,5.2vw,104px);overflow-wrap:normal;word-break:keep-all;hyphens:none}
  /* course: title across the top again, program and offer side by side underneath */
  .course-section .wrap{display:block}
  .course-section .course-title{position:static;text-align:center;margin:0 auto 72px;max-width:1100px}
  .course-section .course-title .eyebrow{justify-content:center}
  .course-section .course-container{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(32px,4vw,80px)}
}
@media (min-width:1101px) and (max-width:1400px){.price-section .price-list{columns:1}}

/* =====================================================================
   v3.2 — clear layouts, wide pages, 15px radius everywhere
   ===================================================================== */
:root{--r:15px;--r-lg:15px;--r-md:15px;--radius:15px}

/* ---------- HERO: the whole photo, full length (as on the original site) ---------- */
@media (min-width:981px){
  .hero.hero-split{grid-template-columns:auto minmax(0,1fr)}
  .hero-media{height:calc(100vh - 84px);height:calc(100svh - 84px);min-height:560px;aspect-ratio:853/1280;width:auto}
  .hero-media img{object-fit:cover;object-position:50% 0}
}
@media (max-width:980px){
  .hero-media{height:auto;min-height:0;max-height:none;aspect-ratio:853/1280}
  .hero-media img{object-position:50% 0}
}

/* ---------- SERVICES: one clean row of equal cards (desktop) / a simple stack (mobile) ---------- */
#services .services-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,1.6vw,28px);align-items:stretch}
#services .service-card{margin:0!important;display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:15px;overflow:hidden;box-shadow:none;transition:box-shadow .5s var(--ease),transform .5s var(--ease)}
#services .service-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-2)!important}
#services .service-image{aspect-ratio:3/4;border-radius:0;box-shadow:none;transform:none!important}
#services .service-image::after{display:none}
#services .service-image img{object-position:50% 22%}
#services .service-card .service-price{top:16px;right:16px;bottom:auto}
#services .service-num{top:16px;left:16px}
#services .service-content{position:static;padding:24px 24px 26px;color:inherit;flex:1;display:flex;flex-direction:column}
#services .service-content h3{color:var(--ink);font-size:clamp(28px,2.1vw,36px);margin-bottom:8px}
#services .service-content p{color:var(--ink-2);flex:1}
#services .service-actions{margin-top:18px}
#services .services-more{display:flex;gap:34px;justify-content:flex-start;margin-top:44px}
@media (max-width:1100px){#services .services-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){
  #services .services-grid{grid-template-columns:1fr;gap:22px}
  #services .service-image{aspect-ratio:4/4.6}
  #services .services-more{flex-direction:column;gap:14px}
}

/* ---------- GALLERY ---------- */
/* phones & tablets: title → big photo → thumbnails under it */
@media (max-width:1100px){
  .elite-gallery-inner{display:flex!important;flex-direction:column;align-items:stretch;gap:0}
  .elite-gallery-text{display:contents}
  .elite-gallery-text > .eyebrow{order:1;align-self:flex-start}
  .elite-gallery-text > h2{order:2}
  .elite-gallery-text > p{order:3;margin-bottom:26px}
  .elite-view{order:4;width:100%;max-width:560px;align-self:center}
  .elite-thumbs{order:5;display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;margin:14px auto 0;max-width:560px;width:100%;overflow:visible;padding:0}
  .elite-thumbs button{aspect-ratio:3/4;border-radius:10px}
  .elite-gallery-text > .link-arrow{order:6;align-self:center;margin-top:28px!important}
}
/* desktop: a magazine mosaic of all 7 photos; any tile opens the viewer */
@media (min-width:1101px){
  .elite-gallery-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"eye eye" "title text" "title link" "grid grid";column-gap:clamp(40px,6vw,120px);align-items:end}
  .elite-gallery-text{display:contents}
  .elite-gallery-text > .eyebrow{grid-area:eye}
  .elite-gallery-text > h2{grid-area:title;margin-bottom:0}
  .elite-gallery-text > p{grid-area:text;max-width:520px;font-size:17px;margin:0 0 14px;justify-self:end;width:100%}
  .elite-gallery-text > .link-arrow{grid-area:link;margin:0!important;justify-self:end;width:100%;max-width:520px}
  .elite-view{display:none}
  .elite-thumbs{grid-area:grid;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin:56px 0 0;max-width:none;overflow:visible;padding:0}
  .elite-thumbs button{position:relative;aspect-ratio:2/3;border-radius:15px;overflow:hidden;opacity:1;outline:0;cursor:zoom-in;box-shadow:var(--shadow-1)}
  .elite-thumbs button:first-child{grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
  .elite-thumbs button img{object-position:50% 20%;transition:transform 1.2s var(--ease)}
  .elite-thumbs button::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(29,22,18,.35));opacity:0;transition:opacity .4s}
  .elite-thumbs button:hover{transform:none}
  .elite-thumbs button:hover img{transform:scale(1.05)}
  .elite-thumbs button:hover::after{opacity:1}
  .elite-thumbs button.active{outline:0}
}

/* ---------- MASTER: one calm, readable column ---------- */
.master-section .wrap{max-width:var(--wrap)}
.master-text{font-size:16.5px;line-height:1.85;color:var(--ink-2);max-width:780px;columns:auto!important}
.master-text p{margin:0 0 1.1em}
.master-text > p:first-of-type{font-family:var(--serif);font-size:clamp(22px,1.8vw,27px);line-height:1.5;color:var(--ink)}
.master-text h3{font-size:clamp(28px,2.2vw,36px);margin:1.4em 0 .5em}
.master-text:not(.expanded){max-height:430px}
.master-text::after{height:110px}
@media (min-width:1101px){
  .master-section .wrap{display:grid;grid-template-columns:minmax(260px,.4fr) minmax(0,1fr);column-gap:clamp(40px,6vw,120px);align-items:start}
  .master-section .wrap > .eyebrow{grid-column:1;grid-row:1}
  .master-section .master-title{grid-column:1;grid-row:2;margin-bottom:0}
  .master-section #masterText{grid-column:2;grid-row:1/4}
  .master-section .master-btn-wrapper{grid-column:2}
}

/* ---------- mobile action bar: docked to the bottom like an app bar ---------- */
@media (max-width:980px){
  .m-bar{left:0;right:0;bottom:0;gap:10px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));border-radius:15px 15px 0 0;background:rgba(252,248,244,.94);border-top:1px solid var(--line);box-shadow:0 -10px 30px -18px rgba(42,32,27,.35)}
  .m-bar a{height:48px;border-radius:15px;font-size:11.5px;letter-spacing:.16em}
  .m-bar-call{width:auto;flex:0 0 auto;padding:0 18px;border:1px solid var(--ink)!important;color:var(--ink)!important}
  .m-bar-book{flex:1;background:var(--ink)!important;color:var(--paper)!important}
  .m-bar.hide,body:has(.hero-split) .m-bar:not(.show){transform:translateY(110%)}
  body:has(.m-bar){padding-bottom:calc(68px + env(safe-area-inset-bottom))}
  body:has(.m-bar) .site-footer{padding-bottom:0}
}

/* ---------- 15px radius everywhere (pills and cards alike); circles stay round ---------- */
.btn,.master-btn,.hero-tags span,.service-price,.lang-btn,.lang-switch,.header-cta,.nav-cta,input,select,textarea,button[type=submit],.contact-card,.contact-form,.price-list,.course-description,.feature-item,.elite-view,.elite-thumbs button,#eliteModalImg,.sp-badges span{border-radius:15px}
.price-item::before,.sf-social a,.elite-nav,.elite-modal-nav,.service-num,.sp-step-num{border-radius:50%}

/* =====================================================================
   INNER PAGES — wide format
   ===================================================================== */
body.v2 .sp-container,body.v2 .blog-cats-inner,body.v2 .blog-layout,body.v2 .article-wrapper,
body.v2.p-kurs main .container,body.v2.p-kurs .course-program,body.v2.p-kurs .course-faq,body.v2.p-kurs .course-reviews{max-width:var(--wrap)!important;padding-left:var(--gut)!important;padding-right:var(--gut)!important;margin-left:auto!important;margin-right:auto!important;box-sizing:border-box}
body.v2 .sp-section-title{text-align:left!important}
body.v2 .sp-section-title::after{margin-left:0!important}

@media (min-width:1101px){
  /* intro: heading on the left, text on the right */
  body.v2 .sp-intro.no-photo .sp-container{max-width:var(--wrap)!important}
  body.v2 .sp-intro.no-photo .sp-intro-text{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(40px,6vw,120px);align-items:start}
  body.v2 .sp-intro.no-photo .sp-intro-text > h2{grid-column:1;grid-row:1/span 6;text-align:left!important;font-size:clamp(38px,3.4vw,58px)!important;line-height:1.08;margin:0}
  body.v2 .sp-intro.no-photo .sp-intro-text > *:not(h2){grid-column:2;max-width:720px}
  body.v2 .sp-intro.no-photo .sp-intro-text > p{font-size:17px;line-height:1.8}

  /* service block: bigger photo, text beside it */
  body.v2 .sp-service-block{grid-template-columns:minmax(0,.85fr) minmax(0,1fr)!important;gap:clamp(48px,6vw,120px)!important}
  body.v2 .sp-service-block--reverse{grid-template-columns:minmax(0,1fr) minmax(0,.85fr)!important}

  /* long text: side headings, readable measure */
  body.v2 .sp-service-extra,body.v2 .sp-care-content{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1fr);column-gap:clamp(40px,6vw,120px);max-width:none!important}
  body.v2 .sp-service-extra > h3,body.v2 .sp-care-content > h3{grid-column:1;margin-top:0!important;font-size:clamp(26px,2vw,34px)!important;line-height:1.2}
  body.v2 .sp-service-extra > :not(h3),body.v2 .sp-care-content > :not(h3){grid-column:2;max-width:760px;font-size:16.5px;line-height:1.8}
  body.v2 .sp-service-extra > h3 ~ h3,body.v2 .sp-care-content > h3 ~ h3{margin-top:36px!important}

  /* steps: a horizontal timeline of cards */
  body.v2 .sp-steps{max-width:none!important;display:grid!important;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:18px;padding:0!important}
  body.v2 .sp-steps::before,body.v2 .sp-step::before,body.v2 .sp-step::after{display:none!important}
  body.v2 .sp-step{display:flex!important;flex-direction:column;gap:16px;margin:0!important;padding:26px 24px 28px!important;background:var(--paper);border:1px solid var(--line);border-radius:15px}
  body.v2 .sp-step-content{padding:0!important}
  body.v2 .sp-step-content h3{font-size:26px!important;margin-bottom:8px!important}

  /* FAQ in two columns */
  body.v2 .sp-faq-list,body.v2.p-kurs .faq-list{max-width:none!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px;align-items:start}
  body.v2 .sp-faq-list .faq-item,body.v2.p-kurs .faq-list .faq-item{margin:0!important}

  /* contraindications: intro left, list right */
  body.v2 .sp-contraindications .sp-container > div{max-width:none!important;margin:0!important;display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1fr);column-gap:clamp(40px,6vw,120px);align-items:start}
  body.v2 .sp-contraindications .sp-container > div > ul{margin-top:0!important}
  body.v2 .sp-contraindications .sp-container > div > p{font-size:17px;line-height:1.75}
}
/* related services: cards in a row */
body.v2 .sp-related .sp-container > div{max-width:none!important;margin:0!important;display:grid!important;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px!important}
body.v2 .sp-related-link{display:flex!important;align-items:center;justify-content:space-between;gap:16px;padding:22px 24px!important;background:var(--paper)!important;border:1px solid var(--line)!important;border-radius:15px!important;color:var(--ink)!important;font-weight:500!important;line-height:1.45;transition:border-color .3s,transform .4s var(--ease),box-shadow .4s!important}
body.v2 .sp-related-link::after{content:"→";color:var(--accent-d);font-size:18px;flex:none}
body.v2 .sp-related-link:hover{border-color:var(--accent)!important;transform:translateY(-3px);box-shadow:var(--shadow-1)}
body.v2 .sp-related,body.v2 .sp-contraindications{background:var(--paper)!important}
body.v2 .sp-contraindications li span{color:var(--ink-2)!important}
body.v2 .sp-contraindications li i{color:var(--accent-d)!important}

/* booking CTA on service pages: form title was light-on-light */
body.v2 .sp-cta-form h3{color:var(--ink)!important;font-family:var(--serif);font-size:clamp(26px,2vw,32px)!important;line-height:1.2;margin-bottom:18px!important}
body.v2 .sp-cta-form{padding:clamp(28px,3vw,48px)!important;border-radius:15px!important}
body.v2 .sp-cta-form select{border-radius:15px!important;border:1px solid var(--line)!important;background:transparent!important}
body.v2 .sp-contacts-list > div{color:var(--on-dark-2)!important;font-size:15px!important}
body.v2 .sp-contact-link{color:var(--on-dark)!important}
@media (min-width:1101px){
  body.v2 .sp-cta-inner{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(48px,6vw,120px);align-items:center}
  body.v2 .sp-cta-text h2{font-size:clamp(44px,4.4vw,76px)!important;line-height:1}
}

/* ---------- course page: contacts rebuilt ---------- */
body.v2.p-kurs .contact-section .container{max-width:var(--wrap);padding-inline:var(--gut)}
body.v2.p-kurs .contact-section .section-title{text-align:left;color:var(--on-dark);font-size:clamp(44px,4.4vw,76px);margin:0 0 40px}
body.v2.p-kurs .contact-wrapper{max-width:none;gap:clamp(40px,6vw,120px);align-items:center}
body.v2.p-kurs .contact-info .city,body.v2.p-kurs .contact-info .phone{position:relative;margin:0;padding:18px 0 18px 30px;border-bottom:1px solid rgba(243,233,224,.14);border-top:0;color:var(--on-dark)!important;font-size:17px;font-weight:400}
body.v2.p-kurs .contact-info .city::before,body.v2.p-kurs .contact-info .phone::before{content:""!important;position:absolute;left:0;top:50%;width:16px;height:16px;transform:translateY(-50%);background:var(--accent);-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
body.v2.p-kurs .contact-info .city{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5 7 13 7 13s7-8 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E")}
body.v2.p-kurs .contact-info .phone{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15 15 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1z'/%3E%3C/svg%3E");font-family:var(--serif)!important;font-size:26px!important}
body.v2.p-kurs .social-icons{display:flex;gap:12px;margin-top:28px}
body.v2.p-kurs .social-icons a{width:48px;height:48px;border-radius:50%;border:1px solid rgba(243,233,224,.25);display:grid;place-items:center;transition:background .3s}
body.v2.p-kurs .social-icons a:hover{background:rgba(243,233,224,.12)}
body.v2.p-kurs .social-icons img{width:22px!important;height:22px!important}
body.v2.p-kurs .contact-form{background:var(--paper)!important;border-radius:15px!important;padding:clamp(28px,3vw,48px)!important;box-shadow:var(--shadow-2);border:0!important}
body.v2.p-kurs .contact-form form{background:transparent!important;box-shadow:none!important;padding:0!important;border:0!important;margin:0!important;max-width:none!important}
body.v2.p-kurs .contact-form input,body.v2.p-kurs .contact-form textarea{width:100%;background:transparent!important;border:0!important;border-bottom:1px solid var(--line)!important;border-radius:0!important;padding:16px 4px!important;margin:0 0 6px!important;font:inherit;color:var(--ink)!important;box-shadow:none!important}
body.v2.p-kurs .contact-form button[type=submit]{width:100%;height:54px;margin-top:22px;background:var(--accent-d)!important;color:#fff!important;border:0;border-radius:15px!important;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}

/* ---------- blog & articles: wider, text kept readable ---------- */
@media (min-width:1101px){
  body.v2 .blog-layout,body.v2 .article-wrapper{grid-template-columns:minmax(0,1fr) 360px!important;gap:clamp(32px,3vw,56px)!important}
  body.v2 .article-content > p,body.v2 .article-content > ul,body.v2 .article-content > ol,body.v2 .article-content > h2,body.v2 .article-content > h3{max-width:860px}
  body.v2.p-booking .main{max-width:1240px!important}
}

/* ---------- services mega-menu: makeup | brows & lashes in two tidy columns ---------- */
@media (min-width:981px){
  .nav-dropdown-menu{columns:auto;display:grid;grid-template-columns:230px 1fr 1fr;column-gap:0;row-gap:2px;width:min(940px,calc(100vw - 40px));padding:0 0 22px;overflow:hidden;border-radius:15px;
    background:linear-gradient(90deg,var(--cream) 0 230px,var(--paper) 230px)}
  .nav-dropdown-menu li{margin:0}
  .nav-dropdown-menu li:nth-child(7){display:none}
  .nav-dropdown-menu li:nth-child(-n+6){grid-column:1;padding:0 26px}
  .nav-dropdown-menu li:nth-child(8){grid-column:2/4;grid-row:1;padding:0 28px;border-bottom:1px solid var(--line);margin-bottom:8px}
  .nav-dropdown-menu li:nth-child(n+9){padding:0 28px}
  .nav-dropdown-menu li:nth-child(n+9):nth-child(-n+16){grid-column:2}
  .nav-dropdown-menu li:nth-child(n+17){grid-column:3;padding-left:8px}
  .nav-dropdown-menu .dropdown-section-label{display:block;padding:26px 0 12px;margin:0;font-family:var(--serif);font-style:italic;font-size:22px;color:var(--ink)}
  .nav-dropdown-menu li:nth-child(1) .dropdown-section-label{border-bottom:1px solid var(--line);margin-bottom:8px}
  .nav-dropdown-menu a{display:block;padding:8px 10px;margin:0 -10px;border-radius:10px;font-size:14px;line-height:1.35;color:var(--ink-2);transition:background .25s,color .25s}
  .nav-dropdown-menu a:hover{background:rgba(178,123,88,.1);color:var(--ink);padding-left:10px}
  .nav-dropdown-menu li:nth-child(2) a,.nav-dropdown-menu li:nth-child(9) a{color:var(--accent-d);font-weight:600}
  .nav-dropdown-menu a{white-space:nowrap}
  .nav-dropdown-menu{background:linear-gradient(90deg,var(--cream) 0 230px,var(--paper) 230px)}
  .nav-dropdown-menu li:nth-child(2){grid-row:2}
  .nav-dropdown-menu li:nth-child(3){grid-row:3}
  .nav-dropdown-menu li:nth-child(4){grid-row:4}
  .nav-dropdown-menu li:nth-child(5){grid-row:5}
  .nav-dropdown-menu li:nth-child(6){grid-row:6}
  .nav-dropdown-menu li:nth-child(9){grid-row:2}
  .nav-dropdown-menu li:nth-child(10){grid-row:3}
  .nav-dropdown-menu li:nth-child(11){grid-row:4}
  .nav-dropdown-menu li:nth-child(12){grid-row:5}
  .nav-dropdown-menu li:nth-child(13){grid-row:6}
  .nav-dropdown-menu li:nth-child(14){grid-row:7}
  .nav-dropdown-menu li:nth-child(15){grid-row:8}
  .nav-dropdown-menu li:nth-child(16){grid-row:9}
  .nav-dropdown-menu li:nth-child(17){grid-row:2}
  .nav-dropdown-menu li:nth-child(18){grid-row:3}
  .nav-dropdown-menu li:nth-child(19){grid-row:4}
  .nav-dropdown-menu li:nth-child(20){grid-row:5}
  .nav-dropdown-menu li:nth-child(21){grid-row:6}
  .nav-dropdown-menu li:nth-child(22){grid-row:7}
  .nav-dropdown-menu li:nth-child(23){grid-row:8}
}
@media (min-width:981px){
  .nav-dropdown-menu{left:-190px;transform:translate(0,8px)}
  .nav-dropdown:hover .nav-dropdown-menu,.nav-dropdown:focus-within .nav-dropdown-menu{transform:translate(0,0)}
}

/* ---------- PRICE: the photo becomes the backdrop of the intro panel ---------- */
.price-section .price-aside{position:relative;isolation:isolate;overflow:hidden;border-radius:15px;padding:clamp(28px,3.4vw,56px);display:flex;flex-direction:column;justify-content:flex-end;min-height:560px;box-shadow:var(--shadow-2)}
.price-section .price-img{position:absolute;inset:0;z-index:-1;margin:0;max-width:none;aspect-ratio:auto;border-radius:0}
.price-section .price-img img{width:100%;height:100%;object-fit:cover;object-position:50% 25%;animation:none!important;clip-path:none!important;transform:none!important}
.price-section .price-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(29,22,18,.15) 0%,rgba(29,22,18,.35) 40%,rgba(29,22,18,.92) 100%)}
.price-section .price-aside h2{margin-top:14px;text-shadow:0 2px 24px rgba(0,0,0,.35)}
.price-section .price-aside p{color:rgba(243,233,224,.86);text-shadow:0 1px 10px rgba(0,0,0,.4)}
.price-section .price-aside .eyebrow{color:#e9c6ad}
.price-section .price-aside .eyebrow::before{color:#e9c6ad!important}
@media (min-width:1101px){
  .price-section .wrap{align-items:stretch}
  .price-section .price-aside{position:sticky;top:100px;align-self:start;height:min(calc(100vh - 140px),860px);min-height:620px}
}
@media (max-width:620px){.price-section .price-aside{min-height:520px}}
@media (min-width:1101px){
  .elite-thumbs button img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .price-section .wrap{grid-template-columns:minmax(0,.5fr) minmax(0,1fr)!important}
  .price-section .price-aside h2{font-size:clamp(64px,6vw,112px);white-space:nowrap}
}
/* booking: language buttons in the mobile menu */
.m-langs{display:flex;gap:8px;margin:22px 0 4px}
.m-langs button{flex:1;height:44px;border-radius:15px;border:1px solid rgba(243,233,224,.25);background:transparent;color:var(--on-dark);font:600 12px/1 var(--sans);letter-spacing:.16em;cursor:pointer}
.m-langs button.active{background:var(--on-dark);color:var(--dark)}
body.v2.p-kurs .contact-info .city,body.v2.p-kurs .contact-info .phone{display:block;width:100%;box-sizing:border-box}
body.v2.p-kurs .contact-info{width:100%}

/* =====================================================================
   v3.3 — fixes from the live review
   ===================================================================== */
/* hero (desktop): one colour — the studio backdrop of the photo continues across the screen */
@media (min-width:981px){
  .hero.hero-split{background:radial-gradient(120% 90% at 30% 40%,#dcdad8 0%,#d3d0ce 55%,#cbc7c4 100%)}
  .hero.hero-split::before{display:none}
  .hero-media{background:transparent;-webkit-mask-image:linear-gradient(90deg,#000 78%,transparent 100%);mask-image:linear-gradient(90deg,#000 78%,transparent 100%)}
  .hero-split .hero-tags span{background:rgba(255,255,255,.35);border-color:rgba(42,32,27,.14)}
  .hero-split h1{border-top-color:rgba(42,32,27,.14)}
}

/* form fields: clean rounded boxes everywhere (no half-rounded underlines) */
#popup input:not(.hp),#popup textarea,.contact-form input:not(.hp),.contact-form textarea,.sp-cta-form input,.sp-cta-form textarea,.sp-cta-form select,
body.v2.p-kurs .contact-form input,body.v2.p-kurs .contact-form textarea{
  width:100%;box-sizing:border-box;background:#fff!important;border:1px solid var(--line)!important;border-radius:15px!important;
  padding:15px 18px!important;margin:0 0 12px!important;font:inherit;font-size:16px;color:var(--ink)!important;box-shadow:none!important;outline:0;transition:border-color .25s,box-shadow .25s}
#popup input:focus,#popup textarea:focus,.contact-form input:focus,.contact-form textarea:focus,.sp-cta-form input:focus,.sp-cta-form textarea:focus,.sp-cta-form select:focus{border-color:var(--accent)!important;box-shadow:0 0 0 3px rgba(178,123,88,.15)!important}
#popup textarea,.contact-form textarea,.sp-cta-form textarea{min-height:110px;resize:vertical}
.contact-form label:not(.sr-only){margin-bottom:6px}

/* contacts: Instagram / Telegram buttons never overflow */
.contact-card .social-icons{display:flex;flex-wrap:wrap;gap:10px}
.contact-card .social-icons a{flex:1 1 130px;min-width:0;justify-content:center;border-radius:15px!important}

/* booking popup on phones: a proper bottom sheet */
@media (max-width:620px){
  #popup{align-items:flex-end!important;padding:0!important}
  #popup .popup-content{width:100%!important;max-width:none!important;margin:0!important;border-radius:15px 15px 0 0!important;padding:26px 20px calc(22px + env(safe-area-inset-bottom))!important;max-height:92svh;overflow-y:auto;animation:sheetUp .45s var(--ease) both}
  #popup .popup-content::before{content:"";display:block;width:44px;height:4px;border-radius:4px;background:var(--line);margin:-10px auto 16px}
  #popup h3{font-size:34px!important;margin:0 0 4px!important}
  #popup .popup-service{margin-bottom:18px!important}
  #popup .close-popup{top:14px!important;right:14px!important;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:var(--cream);font-size:24px}
  #popup button[type=submit]{height:54px;border-radius:15px!important;margin-top:6px}
  @keyframes sheetUp{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
}

/* mobile: no empty strip under the footer — the space for the bottom bar lives inside the footer */
@media (max-width:980px){
  body:has(.m-bar){padding-bottom:0}
  body:has(.m-bar) .site-footer{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
  .course-description .btn{width:100%;justify-content:center}
  .course-description .course-btns{display:flex;flex-direction:column;gap:12px}
}
.contact-card .social-icons a svg{width:18px;height:18px;flex:none}
.price-section .price-img{display:block!important}
@media (max-width:1100px){
  .price-section .wrap{display:flex!important;flex-direction:column;gap:28px}
  .price-section .price-aside{height:auto;min-height:540px}
  .price-section .price-list{margin:0!important}
  .hero-split .hero-tags{gap:8px}
  .hero-split .hero-tags span{font-size:11.5px;padding:8px 14px}
}
@media (max-width:1100px){.price-section .price-aside{top:auto!important}}
