/* =========================================================
   Startseite 2027 · christophnussbaumer.at
   Eigenes Bauteil-System (Präfix s-), nur auf index.html.
   Dunkel dominant, Creme als Atempause, Gold als Akzent.
   ========================================================= */
body.s27{
  --deep:#000829; --deep-2:#00051C; --navy-2:#0A1A52;
  --creme:#FBF6EA; --paper:#FFFCF5;
  --ink:rgba(8,16,40,.86); --ink-soft:rgba(8,16,40,.64); --line:rgba(8,16,40,.12);
  --gold-deep:#8A6A22; --gline:rgba(239,201,128,.22);
  --cr:rgba(255,250,236,.88); --cr-soft:rgba(255,250,236,.66); --cr-faint:rgba(255,250,236,.42);
  --ease:cubic-bezier(.22,.7,.2,1);
  --gut:clamp(1.25rem,5vw,3.5rem);
  --sec:clamp(5rem,10vw,8.5rem);
  background:var(--deep);
}
body.s27 main{overflow-x:clip;}

/* ---------- Grundbausteine ---------- */
.s-wrap{max-width:1180px;margin:0 auto;padding:0 var(--gut);}
.s-sec{position:relative;padding:var(--sec) 0;margin:0;}
.s-sec.dark{background:var(--navy);color:var(--cr);}
.s-sec.deep{background:var(--deep);color:var(--cr);}
.s-sec.light{background:var(--creme);color:var(--ink);}
.s-head{max-width:760px;margin:0 auto clamp(2.6rem,5vw,4rem);text-align:center;}
.s-head.left{margin-left:0;text-align:left;}
.s-kick{display:inline-flex;align-items:center;gap:.8rem;font-size:.7rem;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:var(--gold);}
.s-kick::before,.s-kick::after{content:"";width:26px;height:1px;background:currentColor;opacity:.6;}
.s-head.left .s-kick::before{display:none;}
.light .s-kick{color:var(--gold-deep);}
.s-h2{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(2.1rem,4.6vw,3.6rem);line-height:1.08;letter-spacing:-.015em;margin:1.1rem 0 0;color:#FFFAEC;}
.s-h2 em{font-style:italic;color:var(--gold);}
.light .s-h2{color:var(--navy);}
.light .s-h2 em{color:var(--navy);}
.s-lead{margin:1.3rem auto 0;max-width:58ch;font-size:1.05rem;line-height:1.75;color:var(--cr-soft);}
.light .s-lead{color:var(--ink-soft);}
.s-head.left .s-lead{margin-left:0;}

.s-btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;font-family:'Hanken Grotesk',sans-serif;font-weight:500;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;padding:1rem 2rem;border:1px solid var(--gold);color:#FFFAEC;background:transparent;transition:background .35s var(--ease),color .35s var(--ease),transform .35s var(--ease),box-shadow .35s var(--ease);}
.s-btn:hover,.s-btn:focus-visible{background:var(--gold);color:var(--navy);transform:translateY(-2px);}
.s-btn.gold{background:var(--gold);color:var(--navy);box-shadow:0 18px 40px -16px rgba(239,201,128,.55);}
.s-btn.gold:hover{box-shadow:0 22px 46px -14px rgba(239,201,128,.75);}
.light .s-btn{border-color:var(--navy);color:var(--navy);}
.light .s-btn:hover{background:var(--navy);color:#FFFAEC;}
.s-cta{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-top:clamp(2.4rem,4vw,3.4rem);}

/* Einblenden (gestaffelt über --d) */
.s-rv{opacity:0;transform:translateY(34px);transition:opacity 1s var(--ease),transform 1s var(--ease);transition-delay:var(--d,0s);}
.s-rv.on{opacity:1;transform:none;}

/* Fortschrittsleiste oben */
.s-progress{position:fixed;left:0;top:0;height:2px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#F8E4B4,#EFC980 45%,#C9A04E);z-index:1200;pointer-events:none;}

/* ---------- 1 · Hero ---------- */
.s-hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;overflow:hidden;isolation:isolate;padding:8rem 0 6rem;}
.s-hero-bg{position:absolute;inset:0;z-index:-2;overflow:hidden;}
.s-hero-bg img{width:100%;height:100%;object-fit:cover;object-position:68% 30%;animation:sKen 28s ease-in-out infinite alternate;transform-origin:65% 35%;}
.s-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(0,8,41,.94) 0%,rgba(0,8,41,.78) 38%,rgba(0,8,41,.25) 72%,rgba(0,8,41,.15) 100%),linear-gradient(0deg,rgba(0,8,41,.9) 0%,rgba(0,8,41,0) 32%);}
.s-hero-in{max-width:660px;}
.s-hero .s-eb{display:flex;flex-wrap:wrap;gap:.4rem .9rem;font-size:.7rem;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:var(--gold);}
.s-hero .s-eb .sep{opacity:.6;}
.s-hero h1{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(2.6rem,5.8vw,5rem);line-height:1.04;letter-spacing:-.02em;color:#FFFAEC;margin:1.5rem 0 0;}
.s-hero h1 em{font-style:italic;color:var(--gold);}
.s-hero-sub{margin-top:1.7rem;max-width:46ch;font-size:1.06rem;line-height:1.75;color:var(--cr-soft);}
.s-hero .s-cta{justify-content:flex-start;}
.s-trust{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;margin-top:2.4rem;font-size:.88rem;color:var(--cr-soft);}
.s-trust b{color:#FFFAEC;font-weight:600;}
.s-trust .star{color:var(--gold);}
.s-trust .sep{width:1px;height:14px;background:var(--gline);}
.s-scroll{position:absolute;left:50%;bottom:1.8rem;transform:translateX(-50%);width:26px;height:42px;border:1px solid rgba(239,201,128,.5);border-radius:14px;}
.s-scroll span{position:absolute;left:50%;top:8px;width:3px;height:8px;margin-left:-1.5px;border-radius:2px;background:var(--gold);animation:sScroll 2.2s ease-in-out infinite;}

/* ---------- 2 · Zahlen-Band ---------- */
.s-stats{display:grid;grid-template-columns:repeat(4,1fr);}
.s-stat{text-align:center;padding:.4rem 1rem;position:relative;}
.s-stat + .s-stat::before{content:"";position:absolute;left:0;top:10%;bottom:10%;width:1px;background:var(--gline);}
.s-stat .big{display:block;font-family:'Fraunces',serif;font-weight:300;font-size:clamp(2.8rem,5vw,4.3rem);line-height:1;color:#FFFAEC;letter-spacing:-.02em;}
.s-stat .big small{font-size:.48em;color:var(--gold);margin-left:.08em;}
.s-stat .lbl{display:block;margin:1rem auto 0;max-width:14rem;font-size:.66rem;font-weight:600;letter-spacing:.2em;line-height:1.6;text-transform:uppercase;color:var(--gold);}
.s-sec.stats{padding:clamp(3.6rem,7vw,5.5rem) 0;border-top:1px solid var(--gline);border-bottom:1px solid var(--gline);}

/* ---------- 3 · Problem ---------- */
.s-pains{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;}
.s-pain{background:var(--paper);border:1px solid var(--line);padding:2.2rem 2rem 2.3rem;transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .45s;}
.s-pain:hover{transform:translateY(-6px);box-shadow:0 26px 50px -30px rgba(0,14,61,.4);border-color:rgba(138,106,34,.35);}
.s-pain .n{display:block;font-family:'Fraunces',serif;font-style:italic;font-weight:300;font-size:2.6rem;line-height:1;color:var(--gold-deep);margin-bottom:1.3rem;}
.s-pain h3{font-family:'Fraunces',serif;font-weight:400;font-size:1.32rem;line-height:1.25;color:var(--navy);margin:0 0 .7rem;}
.s-pain p{font-size:.98rem;line-height:1.65;color:var(--ink-soft);margin:0;}
.s-turn{max-width:30ch;margin:clamp(3rem,5vw,4.2rem) auto 0;text-align:center;font-family:'Fraunces',serif;font-weight:300;font-size:clamp(1.5rem,2.8vw,2.3rem);line-height:1.3;color:var(--navy);}
.s-turn em{font-style:italic;color:var(--gold-deep);}

/* ---------- Wisch-Spuren (Handy) ---------- */
.s-track-nav{display:none;align-items:center;justify-content:center;gap:1rem;margin-top:1.6rem;}
.s-dots{display:flex;gap:.5rem;}
.s-dots button{width:7px;height:7px;border-radius:50%;border:0;padding:0;background:var(--gline);cursor:pointer;transition:background .3s,transform .3s;}
.s-dots button.on{background:var(--gold);transform:scale(1.25);}
.light .s-dots button{background:var(--line);}
.light .s-dots button.on{background:var(--gold-deep);}

/* ---------- 4 · Leistungen ---------- */
.s-svcs{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem;}
.s-svc{position:relative;display:flex;flex-direction:column;text-decoration:none;color:inherit;background:var(--deep);border:1px solid var(--gline);overflow:hidden;transition:transform .5s var(--ease),border-color .5s,box-shadow .5s var(--ease);}
.s-svc:hover{transform:translateY(-8px);border-color:rgba(239,201,128,.6);box-shadow:0 34px 60px -34px rgba(0,0,0,.8);}
.s-svc .pic{position:relative;aspect-ratio:4/5;overflow:hidden;}
.s-svc .pic img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease);}
.s-svc:hover .pic img{transform:scale(1.06);}
.s-svc .pic::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,8,41,.85) 0%,rgba(0,8,41,0) 55%);}
.s-svc .pic .price{position:absolute;left:1.3rem;bottom:1.1rem;z-index:1;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--cr-soft);}
.s-svc .pic .price b{display:block;margin-top:.2rem;font-family:'Fraunces',serif;font-weight:300;font-size:1.9rem;letter-spacing:0;text-transform:none;color:#FFFAEC;}
.s-svc .body{padding:1.5rem 1.4rem 1.6rem;display:flex;flex-direction:column;flex:1;}
.s-svc h3{font-family:'Fraunces',serif;font-weight:400;font-size:clamp(1.1rem,1.35vw,1.28rem);overflow-wrap:normal;word-break:keep-all;line-height:1.2;color:#FFFAEC;margin:0 0 .6rem;}
.s-svc p{font-size:.93rem;line-height:1.6;color:var(--cr-soft);margin:0;}
.s-svc .go{margin-top:auto;padding-top:1.3rem;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);display:flex;align-items:center;gap:.5rem;}
.s-svc .go::after{content:"→";transition:transform .35s var(--ease);}
.s-svc:hover .go::after{transform:translateX(5px);}
.s-fine{text-align:center;margin-top:1.8rem;font-size:.84rem;color:var(--cr-faint);}
.s-fine a{color:var(--gold);}

/* ---------- 5 · Zitat-Band ---------- */
.s-qband{position:relative;isolation:isolate;overflow:hidden;text-align:center;padding:clamp(6rem,14vw,10.5rem) var(--gut);color:#FFFAEC;}
.s-qband-bg{position:absolute;inset:0;z-index:-2;}
.s-qband-bg img{width:100%;height:100%;object-fit:cover;object-position:50% 35%;transform:scale(1.12);transition:transform 9s ease-out;}
.s-qband.on .s-qband-bg img{transform:scale(1);}
.s-qband::after{content:"";position:absolute;inset:0;z-index:-1;background:rgba(0,8,41,.72);}
.s-qband .stars{color:var(--gold);letter-spacing:.3em;font-size:1rem;}
.s-qband blockquote{max-width:940px;margin:1.4rem auto 0;font-family:'Fraunces',serif;font-style:italic;font-weight:300;font-size:clamp(2rem,4.8vw,3.9rem);line-height:1.15;}
.s-qband cite{display:block;margin-top:1.6rem;font-style:normal;font-size:.74rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);}

/* ---------- 6 · Zeitleiste ---------- */
.s-tl-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2.5rem,6vw,6rem);align-items:start;}
.s-tl-wrap .s-head{position:sticky;top:7rem;margin-bottom:0;}
.s-tl{position:relative;list-style:none;margin:0;padding:0 0 0 3rem;}
.s-tl::before{content:"";position:absolute;left:11px;top:8px;bottom:8px;width:1px;background:var(--line);}
.s-tl::after{content:"";position:absolute;left:11px;top:8px;width:1px;height:var(--fill,0px);background:var(--gold-deep);}
.s-tl li{position:relative;padding:0 0 2.8rem;}
.s-tl li:last-child{padding-bottom:0;}
.s-tl li::before{content:"";position:absolute;left:-3rem;top:.35rem;width:23px;height:23px;border-radius:50%;background:var(--creme);border:1px solid var(--gold-deep);box-sizing:border-box;transition:background .4s,box-shadow .4s;}
.s-tl li.on::before{background:var(--gold-deep);box-shadow:0 0 0 6px rgba(138,106,34,.12);}
.s-tl .when{font-size:.68rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-deep);}
.s-tl h3{font-family:'Fraunces',serif;font-weight:400;font-size:1.45rem;line-height:1.2;color:var(--navy);margin:.45rem 0 .55rem;}
.s-tl p{margin:0;font-size:1rem;line-height:1.7;color:var(--ink-soft);}
.s-tl a{color:var(--gold-deep);}

/* ---------- 7 · Vorher/Nachher ---------- */
.s-bas{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;}
.s-ba{margin:0;}
.s-ba .pair{display:grid;grid-template-columns:1fr 1fr;gap:3px;overflow:hidden;border:1px solid var(--gline);}
.s-ba .pair div{position:relative;overflow:hidden;}
.s-ba img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;transition:transform 1.1s var(--ease);}
.s-ba:hover img{transform:scale(1.05);}
.s-ba .tag{position:absolute;left:.6rem;bottom:.6rem;font-size:.6rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;padding:.3rem .55rem;background:rgba(0,8,41,.75);color:#FFFAEC;}
.s-ba .pair div:last-child .tag{background:var(--gold);color:var(--navy);}
.s-ba figcaption{margin-top:1rem;text-align:center;font-family:'Fraunces',serif;font-size:1.15rem;color:#FFFAEC;}
.s-ba figcaption small{display:block;margin-top:.25rem;font-family:'Hanken Grotesk',sans-serif;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--cr-faint);}

/* ---------- 8 · Bewertungen (läuft) ---------- */
.s-score{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(3.4rem,7vw,5.4rem);line-height:1;color:#FFFAEC;margin-top:1rem;}
.s-score span{color:var(--gold);font-size:.55em;}
.s-score-l{margin-top:.7rem;font-size:.92rem;color:var(--cr-soft);}
.s-run{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);}
.s-run-track{display:flex;gap:1.2rem;width:max-content;animation:sMarquee 60s linear infinite;}
.s-run:hover .s-run-track{animation-play-state:paused;}
.s-rev{flex:0 0 380px;display:flex;flex-direction:column;background:rgba(255,250,236,.04);border:1px solid var(--gline);padding:2rem 1.9rem;}
.s-rev .st{color:var(--gold);letter-spacing:.25em;font-size:.85rem;}
.s-rev p{margin:1rem 0 0;font-size:.98rem;line-height:1.7;color:var(--cr);}
.s-rev .who{margin-top:auto;padding-top:1.3rem;font-family:'Fraunces',serif;font-size:1.05rem;color:#FFFAEC;}
.s-rev .src{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--cr-faint);}

/* ---------- 9 · Privatsalon ---------- */
.s-salon{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,6vw,5.5rem);align-items:center;}
.s-salon .pics{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;}
.s-salon .pics img{display:block;width:100%;aspect-ratio:2/3;object-fit:cover;border:1px solid var(--gline);}
.s-salon .pics img:last-child{margin-top:3rem;}
.s-salon p{color:var(--cr-soft);font-size:1.03rem;line-height:1.75;margin:1.2rem 0 0;}
.s-salon .one{font-family:'Fraunces',serif;font-style:italic;font-size:1.35rem;line-height:1.4;color:var(--gold);}
.s-salon .s-cta{justify-content:flex-start;}

/* ---------- 10 · Über mich ---------- */
.s-about{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2.5rem,6vw,5.5rem);align-items:center;}
.s-about .pic{position:relative;isolation:isolate;}
.s-about .pic img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;position:relative;z-index:1;}
.s-about .pic::after{content:"";position:absolute;inset:1.1rem -1.1rem -1.1rem 1.1rem;border:1px solid var(--gold-deep);z-index:0;}
.s-about p{color:var(--ink-soft);font-size:1.03rem;line-height:1.75;margin:1.2rem 0 0;}
.s-creds{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1.8rem;}
.s-creds span{font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--navy);border:1px solid var(--line);padding:.5rem .8rem;background:var(--paper);white-space:nowrap;}
.s-about .s-cta{justify-content:flex-start;}

/* ---------- 11 · Magazin ---------- */
.s-mags{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;}
.s-mag{display:flex;flex-direction:column;text-decoration:none;color:inherit;border:1px solid var(--gline);background:rgba(255,250,236,.03);transition:transform .5s var(--ease),border-color .5s;}
.s-mag:hover{transform:translateY(-6px);border-color:rgba(239,201,128,.6);}
.s-mag .pic{position:relative;aspect-ratio:3/2;overflow:hidden;}
.s-mag .pic img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease);}
.s-mag:hover .pic img{transform:scale(1.05);}
.s-mag .body{padding:1.5rem 1.5rem 1.7rem;display:flex;flex-direction:column;flex:1;}
.s-mag .cat{font-size:.66rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);}
.s-mag h3{font-family:'Fraunces',serif;font-weight:400;font-size:1.28rem;line-height:1.25;color:#FFFAEC;margin:.6rem 0 0;}
.s-mag .go{margin-top:auto;padding-top:1.2rem;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);}
.s-mag .ai-badge{position:absolute;right:.6rem;bottom:.5rem;font-size:.3rem;letter-spacing:.06em;color:rgba(255,255,255,.75);text-shadow:0 1px 3px rgba(0,0,0,.6);}

/* ---------- 12 · FAQ ---------- */
.s-faq{max-width:860px;margin:0 auto;}
.s-faq details{border-bottom:1px solid var(--line);}
.s-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;padding:1.5rem 0;font-family:'Fraunces',serif;font-weight:400;font-size:1.2rem;line-height:1.35;color:var(--navy);}
.s-faq summary::-webkit-details-marker{display:none;}
.s-faq summary::after{content:"+";flex:none;width:34px;height:34px;border-radius:50%;border:1px solid var(--gold-deep);color:var(--gold-deep);display:grid;place-items:center;font-family:'Hanken Grotesk',sans-serif;font-size:1.2rem;transition:transform .35s var(--ease),background .35s,color .35s;}
.s-faq details[open] summary::after{transform:rotate(45deg);background:var(--gold-deep);color:var(--paper);}
.s-faq details p{margin:0 0 1.6rem;max-width:68ch;font-size:1rem;line-height:1.75;color:var(--ink-soft);}
.s-faq details a{color:var(--gold-deep);}

/* ---------- 13 · Abschluss ---------- */
.s-end{position:relative;isolation:isolate;overflow:hidden;text-align:center;padding:clamp(7rem,15vw,11rem) var(--gut);}
.s-end-bg{position:absolute;inset:0;z-index:-2;}
.s-end-bg img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;animation:sKen 30s ease-in-out infinite alternate;}
.s-end::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,8,41,.88),rgba(0,5,28,.94));}
.s-end .stack{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(2.1rem,4.8vw,3.8rem);line-height:1.2;color:#FFFAEC;}
.s-end .stack em{font-style:italic;color:var(--gold);}
.s-end .sign{margin-top:1.4rem;font-family:'Fraunces',serif;font-style:italic;color:var(--gold);font-size:1.2rem;}

/* ---------- Animationen ---------- */
@keyframes sKen{0%{transform:scale(1) translate3d(0,0,0);}100%{transform:scale(1.1) translate3d(-1.5%,-1%,0);}}
@keyframes sScroll{0%{opacity:0;transform:translateY(0);}30%{opacity:1;}100%{opacity:0;transform:translateY(14px);}}
@keyframes sMarquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ---------- Tablet ---------- */
@media(max-width:1020px){
  .s-svcs{grid-template-columns:repeat(2,1fr);}
  .s-bas{grid-template-columns:1fr 1fr;}
  .s-bas .s-ba:last-child{display:none;}
}

/* ---------- Handy ---------- */
@media(max-width:760px){
  .s-hero{align-items:flex-end;padding:7rem 0 4.5rem;}
  .s-hero-bg img{object-position:72% 20%;}
  .s-hero::after{background:linear-gradient(0deg,rgba(0,8,41,.97) 0%,rgba(0,8,41,.85) 42%,rgba(0,8,41,.25) 75%,rgba(0,8,41,.35) 100%);}
  .s-hero .s-eb{font-size:.62rem;letter-spacing:.24em;}
  .s-hero .s-cta .s-btn{width:100%;}
  .s-trust .sep{display:none;}
  .s-scroll{display:none;}

  .s-stats{grid-template-columns:1fr 1fr;row-gap:2.4rem;}
  .s-stat:nth-child(3)::before{display:none;}

  /* Wisch-Spuren */
  .s-swipe{display:flex !important;overflow-x:auto;scroll-snap-type:x mandatory;gap:.9rem;margin-inline:calc(var(--gut) * -1);padding:0 var(--gut) .4rem;scrollbar-width:none;}
  .s-swipe::-webkit-scrollbar{display:none;}
  .s-swipe > *{flex:0 0 82%;scroll-snap-align:center;}
  .s-swipe.s-bas .s-ba:last-child{display:block;}
  .s-track-nav{display:flex;}

  .s-tl-wrap{grid-template-columns:1fr;gap:2.4rem;}
  .s-tl-wrap .s-head{position:static;}
  .s-tl{padding-left:2.4rem;}
  .s-tl li::before{left:-2.4rem;}

  .s-rev{flex-basis:300px;}
  .s-run-track{animation-duration:45s;}

  .s-salon,.s-about{grid-template-columns:1fr;}
  .s-salon .pics{order:-1;}
  .s-about .pic{max-width:360px;margin:0 auto 1rem;width:calc(100% - 1.1rem);}
  .s-salon .s-cta,.s-about .s-cta{justify-content:center;}
  .s-salon .s-cta .s-btn,.s-about .s-cta .s-btn{width:100%;}
  .s-cta .s-btn{width:100%;}
  .s-faq summary{font-size:1.08rem;}
}

@media(prefers-reduced-motion:reduce){
  .s-hero-bg img,.s-end-bg img,.s-scroll span{animation:none;}
  .s-run-track{animation:none;}
  .s-rv{opacity:1;transform:none;transition:none;}
  .s-qband-bg img{transform:none;transition:none;}
}

/* Feinschliff */
.s-salon .s-kick::before,.s-about .s-kick::before{display:none;}
.s-about .ai-badge{position:absolute;right:.7rem;bottom:.55rem;z-index:2;font-size:.3rem;letter-spacing:.06em;color:rgba(255,255,255,.78);text-shadow:0 1px 3px rgba(0,0,0,.6);}

/* =========================================================
   fx27 · Startseite im Stil der NUBA-Website 2027 (18.10.2026)
   Bisherige Salon-Farben (nicht dunkler, Christoph 18.10.), Goldschimmer, changierende Karten.
   Effekte selbst liegen in fx27.css (gemeinsam für alle Seiten).
   ========================================================= */

/* Texte und Überschriften stehen sofort da, nur Karten und Fotos gleiten herein (.fx-in) */
.s-rv{opacity:1 !important;transform:none !important;transition:none !important;}

/* Fraunces im CI-Gewicht 340 */
.s27 :is(.s-hero h1,.s-h2,.s-stat .big,.s-turn,.s-qband blockquote,.s-end .stack,.s-score,.s-svc .pic .price b,.s-pain .n){font-weight:340;font-variation-settings:'wght' 340;}

/* Hero: bisheriges Dunkel, dazu warmes Licht links oben */
.s-hero::after{background:
  radial-gradient(45% 55% at 8% 18%,rgba(239,201,128,.10),transparent 70%),
  linear-gradient(90deg,rgba(0,8,41,.94) 0%,rgba(0,8,41,.78) 38%,rgba(0,8,41,.25) 72%,rgba(0,8,41,.15) 100%),
  linear-gradient(0deg,rgba(0,8,41,.9) 0%,rgba(0,8,41,0) 32%);}

/* Zahlen-Band + Laufband: keine doppelte Linie */
.s-sec.stats + .fx-band{border-top:0;}
.s-stat .big small{color:var(--gold);}

/* Problem-Karten: dunkel und changierend auf Creme */
.s-pain.fx-sheen h3{color:#FFFAEC;}
.s-pain.fx-sheen p{color:var(--cr-soft);}
.s-pain.fx-sheen .n{color:var(--gold);}
@media(hover:hover){.light .fx-sheen:hover{box-shadow:0 46px 90px -40px rgba(0,8,41,.7),0 30px 70px -28px rgba(239,201,128,.55);}}


/* Zeitleiste jetzt dunkel: goldene Linie wächst mit, Punkte leuchten auf */
#ablauf .s-tl::before{background:rgba(239,201,128,.2);}
#ablauf .s-tl::after{left:10px;width:3px;border-radius:3px;background:linear-gradient(180deg,#F8E4B4,#EFC980 40%,#C9A04E);box-shadow:0 0 12px rgba(239,201,128,.55);}
#ablauf .s-tl li::before{background:var(--abyss);border-color:var(--gold-mid);transition:background .5s var(--ease),box-shadow .5s var(--ease),transform .5s var(--ease);}
#ablauf .s-tl li.on::before{background:var(--gold);border-color:var(--gold);box-shadow:0 0 0 6px rgba(239,201,128,.16),0 0 22px rgba(239,201,128,.6);transform:scale(1.06);}
#ablauf .s-tl .when{color:var(--gold);}
#ablauf .s-tl h3{color:#FFFAEC;}
#ablauf .s-tl p{color:var(--cr-soft);}
#ablauf .s-tl a{color:var(--gold);}

/* Vorher/Nachher und Fotos: Goldrand beim Hovern */
.s-ba .pair,.s-salon .pics img{transition:border-color .5s,box-shadow .5s var(--ease),transform .5s var(--ease);}
@media(hover:hover){
  .s-ba:hover .pair{border-color:rgba(239,201,128,.7);box-shadow:0 30px 70px -34px rgba(239,201,128,.45);}
  .s-salon .pics img:hover{border-color:rgba(239,201,128,.7);box-shadow:0 30px 70px -34px rgba(239,201,128,.45);transform:translateY(-6px);}
}

/* Bewertungen: Karten changieren im Lauf */
.s-rev.fx-sheen{border-color:rgba(239,201,128,.22);}


/* Schluss: Fotoreihe mit Ken Burns statt Einzelbild */
.s-end.fx-end::after{display:none;}
.s-end.fx-end .s-wrap{position:relative;z-index:1;}

@media(max-width:760px){
  .s-hero::after{background:
    radial-gradient(70% 40% at 20% 55%,rgba(239,201,128,.08),transparent 70%),
    linear-gradient(0deg,rgba(0,8,41,.97) 0%,rgba(0,8,41,.85) 42%,rgba(0,8,41,.25) 75%,rgba(0,8,41,.35) 100%);}
  .s-pain.fx-sheen{padding:1.8rem 1.5rem 1.9rem;}
  .s-pain.fx-sheen .n{font-size:2.1rem;margin-bottom:1rem;}
  .fx-band{padding:1rem 0;}
  .fx-band-set li::after{margin:0 1.5rem;}
  .s-end.fx-end{min-height:78vh;}
}

/* ---------- Übergabe Builder 18.10.: Paket-Hinweis, Haargesundheit, Educator, Warteliste ---------- */
.s-svc .incl{display:block;margin:-.2rem 0 .7rem;font-size:.66rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);}

/* Haargesundheit: breite, changierende Karte unter den Leistungen */
.s-health{display:grid;grid-template-columns:1.1fr 1fr;margin-top:1.4rem;text-decoration:none;color:inherit;overflow:hidden;}
/* Vorher/Nachher-Paar ganz zeigen: eingerahmt in der Karte, nie beschnitten */
.s-health .pic{position:relative;align-self:center;padding:clamp(1.2rem,2.4vw,2rem) 0 clamp(1.2rem,2.4vw,2rem) clamp(1.2rem,2.4vw,2rem);}
.s-health .pic img{width:100%;height:auto;aspect-ratio:1400/875;object-fit:cover;display:block;border:1px solid var(--gline);transition:border-color .5s;}
.s-health:hover .pic img{border-color:rgba(239,201,128,.6);}
.s-health .body{padding:clamp(1.8rem,3.5vw,3rem);display:flex;flex-direction:column;justify-content:center;}
.s-health .s-kick::before{display:none;}
.s-health h3{font-family:'Fraunces',serif;font-weight:340;font-variation-settings:'wght' 340;font-size:clamp(1.4rem,2.2vw,1.9rem);line-height:1.2;color:#FFFAEC;margin:.9rem 0 .8rem;}
.s-health p{font-size:.98rem;line-height:1.7;color:var(--cr-soft);margin:0;}
.s-health .price{margin-top:1.4rem;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--cr-soft);}
.s-health .price b{display:inline-block;margin-left:.7rem;font-family:'Fraunces',serif;font-weight:340;font-variation-settings:'wght' 340;font-size:1.6rem;letter-spacing:0;text-transform:none;color:#FFFAEC;vertical-align:-.15em;}
.s-health .price small{display:block;margin-top:.3rem;font-size:.66rem;letter-spacing:.14em;color:var(--cr-faint);}
.s-health .go{margin-top:1.3rem;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);display:flex;align-items:center;gap:.5rem;}
.s-health .go::after{content:"→";transition:transform .35s var(--ease);}
.s-health:hover .go::after{transform:translateX(5px);}

/* Educator */
.s-edu{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2.5rem,6vw,5.5rem);align-items:center;}
.s-edu .s-kick::before{display:none;}
.s-edu p{color:var(--cr-soft);font-size:1.03rem;line-height:1.75;margin:1.2rem 0 0;}
.s-edu .one{font-family:'Fraunces',serif;font-style:italic;font-weight:340;font-variation-settings:'wght' 340;font-size:1.35rem;line-height:1.4;color:var(--gold);}
.s-edu .s-cta{justify-content:flex-start;}
.s-edu-pics{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;}
.s-edu-pics img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border:1px solid var(--gline);transition:border-color .5s,box-shadow .5s var(--ease),transform .5s var(--ease);}
.s-edu-pics img:nth-child(even){margin:2.4rem 0 -2.4rem;}
.s-edu-pics{padding-bottom:2.4rem;}
@media(hover:hover){.s-edu-pics img:hover{border-color:rgba(239,201,128,.7);box-shadow:0 30px 70px -34px rgba(239,201,128,.45);transform:translateY(-6px);}}

/* Warteliste: sanft, unter dem Schluss-Button */
.s-wait{max-width:40ch;margin:2rem auto 0;padding-top:1.6rem;position:relative;font-family:'Fraunces',serif;font-weight:340;font-variation-settings:'wght' 340;font-size:clamp(1.1rem,1.6vw,1.3rem);line-height:1.5;color:#FFFAEC;}
.s-wait::before{content:"";position:absolute;top:0;left:50%;width:64px;height:1px;margin-left:-32px;background:var(--grad-gold);box-shadow:0 0 8px rgba(239,201,128,.5);}
.s-wait em{font-style:italic;display:inline-block;margin-top:.2em !important;}

@media(max-width:1020px){
  .s-health{grid-template-columns:1fr;}
  .s-health .pic{padding:0;}
  .s-health .pic img{border:0;border-bottom:1px solid var(--gline);}
}
@media(max-width:760px){
  .s-health .body{padding:1.6rem 1.4rem 1.8rem;}
  .s-edu{grid-template-columns:1fr;}
  .s-edu .s-cta .s-btn{width:100%;}
  .s-edu-pics{gap:.6rem;}
  .s-edu-pics img:nth-child(even){margin:1.6rem 0 -1.6rem;}
  .s-edu-pics{padding-bottom:1.6rem;}
}

/* ---------- Bewertungen als Slideshow zum Selberblättern (18.10.) ---------- */
.s-revs-track{display:flex;align-items:stretch;gap:1.2rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:1rem 0 2.4rem;margin-top:-1rem;outline:none;}
.s-revs-track::-webkit-scrollbar{display:none;}
.s-revs-track:focus-visible{outline:1px solid rgba(239,201,128,.5);outline-offset:4px;}
.s-revs .s-rev{flex:0 0 calc((100% - 2.4rem) / 3);scroll-snap-align:start;}
.s-revs-nav{display:flex;align-items:center;gap:1.2rem;margin-top:.4rem;}
.s-revs-btn{flex:none;width:52px;height:52px;border-radius:50%;border:1px solid rgba(239,201,128,.55);background:transparent;color:var(--gold);font-size:1.6rem;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0 0 .15rem;transition:background .3s,color .3s,border-color .3s,opacity .3s;}
.s-revs-btn:hover:not(:disabled),.s-revs-btn:focus-visible{background:var(--grad-gold);color:var(--navy);border-color:transparent;}
.s-revs-btn:disabled{opacity:.3;cursor:default;}
.s-revs-bar{flex:1;height:2px;background:rgba(239,201,128,.18);position:relative;overflow:hidden;border-radius:2px;}
.s-revs-bar i{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--grad-gold);transition:width .4s var(--ease);}
.s-revs-count{font-family:'Fraunces',serif;font-weight:340;font-variation-settings:'wght' 340;color:var(--cr-soft);letter-spacing:.06em;white-space:nowrap;min-width:4.5em;text-align:center;}
@media(max-width:1020px){.s-revs .s-rev{flex-basis:calc((100% - 1.2rem) / 2);}}
@media(max-width:760px){
  .s-revs-track{margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut);scroll-padding-inline:var(--gut);gap:.9rem;}
  .s-revs .s-rev{flex-basis:84%;padding:1.7rem 1.5rem;}
  .s-revs-btn{width:46px;height:46px;}
}
/* lange Bewertungen: 8 Zeilen, Rest zum Aufklappen (Text bleibt vollständig) */
.s-revs .s-rev p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:8;overflow:hidden;}
.s-revs .s-rev.open p{display:block;-webkit-line-clamp:unset;overflow:visible;}
.s-rev-more{align-self:flex-start;margin-top:.8rem;padding:0;border:0;background:none;font-family:'Hanken Grotesk',sans-serif;font-size:.68rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);cursor:pointer;border-bottom:1px solid rgba(239,201,128,.45);}
.s-rev-more:hover{color:#FFFAEC;}

/* =========================================================
   Unterseiten 2027 (body.s27-sub) · neue Struktur im NUBA-Stil (18.10.2026)
   Muster: /balayage/
   ========================================================= */
/* Hero geteilt: Text links, zwei Fotos rechts, Fakten-Leiste unten */
.s-phero{position:relative;overflow:hidden;isolation:isolate;padding:clamp(7.5rem,11vw,9.5rem) 0 0;color:var(--cr);background:
  radial-gradient(45% 60% at 6% 12%,rgba(239,201,128,.12),transparent 70%),
  radial-gradient(55% 70% at 96% 60%,rgba(36,64,160,.26),transparent 70%),
  var(--deep);}
.s-phero-in{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(2.5rem,5vw,5rem);align-items:center;padding-bottom:clamp(3.5rem,6vw,5.5rem);}
.s-phero .s-eb{display:flex;flex-wrap:wrap;gap:.4rem .9rem;font-size:.7rem;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:var(--gold);margin:0;}
.s-phero .s-eb .sep{opacity:.6;}
.s-phero h1{font-family:'Fraunces',serif;font-weight:340;font-variation-settings:'wght' 340;font-size:clamp(2.5rem,5vw,4.3rem);line-height:1.05;letter-spacing:-.02em;color:#FFFAEC;margin:1.4rem 0 0;max-width:15ch;}
.s-phero-sub{margin:1.6rem 0 0;max-width:52ch;font-size:1.03rem;line-height:1.75;color:var(--cr-soft);}
.s-phero .s-cta{justify-content:flex-start;margin-top:2.2rem;}
.s-phero-pics{position:relative;padding:0 0 3.2rem 3.2rem;}
.s-phero-pics::before{content:"";position:absolute;top:1.2rem;right:-1.2rem;bottom:4.4rem;left:4.4rem;border:1px solid rgba(239,201,128,.45);z-index:0;}
.s-phero-pics img{display:block;object-fit:cover;position:relative;z-index:1;}
.s-phero-pics .big{width:100%;aspect-ratio:4/5;object-position:50% 35%;box-shadow:0 50px 90px -40px rgba(0,0,0,.85);}
.s-phero-pics .small{position:absolute;left:0;bottom:0;width:40%;aspect-ratio:4/5;z-index:2;border:4px solid var(--deep);box-shadow:0 30px 60px -24px rgba(0,0,0,.8);}
.s-facts{border-top:1px solid var(--gline);background:rgba(0,3,15,.35);}
.s-facts-in{display:grid;grid-template-columns:repeat(4,1fr);}
.s-facts-in > div{padding:1.4rem 1rem;text-align:center;position:relative;}
.s-facts-in > div + div::before{content:"";position:absolute;left:0;top:25%;bottom:25%;width:1px;background:var(--gline);}
.s-facts .k{display:block;font-size:.62rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);}
.s-facts .v{display:block;margin-top:.35rem;font-family:'Fraunces',serif;font-weight:340;font-variation-settings:'wght' 340;font-size:1.12rem;color:#FFFAEC;}

/* Techniken: changierende Karten, Handy = Wisch-Reihe */
.s-techs{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;}
.s-tech{display:flex;flex-direction:column;padding:2.2rem 2rem 2rem;}
.s-tech .n{font-family:'Fraunces',serif;font-style:italic;font-weight:340;font-variation-settings:'wght' 340;font-size:2.4rem;line-height:1;color:var(--gold);}
.s-tech h3{font-family:'Fraunces',serif;font-weight:400;font-size:1.32rem;line-height:1.25;color:#FFFAEC;margin:1.2rem 0 .7rem;}
.s-tech p{font-size:.95rem;line-height:1.65;color:var(--cr-soft);margin:0;}
.s-tech .price{margin-top:auto;padding-top:1.5rem;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--cr-faint);}
.s-tech .price b{margin-left:.5rem;font-family:'Fraunces',serif;font-weight:340;font-variation-settings:'wght' 340;font-size:1.6rem;letter-spacing:0;text-transform:none;color:#FFFAEC;}

/* Vorher/Nachher groß */
.s-ba-big{max-width:880px;margin:0 auto;}
.s-ba-big .tag{font-size:.66rem;padding:.4rem .7rem;left:.9rem;bottom:.9rem;}

/* Galerie zum Blättern (gleiche Steuerung wie die Bewertungen) */
.s-gal .s-gal-it{flex:0 0 calc((100% - 3.6rem) / 4);margin:0;scroll-snap-align:start;overflow:hidden;border:1px solid var(--line);transition:border-color .5s,box-shadow .5s var(--ease),transform .5s var(--ease);}
.s-gal .s-gal-it img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;transition:transform 1.1s var(--ease);}
@media(hover:hover){.s-gal .s-gal-it:hover{border-color:rgba(138,106,34,.6);box-shadow:0 30px 60px -34px rgba(0,14,61,.55);transform:translateY(-6px);}.s-gal .s-gal-it:hover img{transform:scale(1.04);}}
.light .s-revs-btn{border-color:rgba(138,106,34,.5);color:var(--gold-deep);}
.light .s-revs-btn:hover:not(:disabled),.light .s-revs-btn:focus-visible{background:var(--navy);color:var(--gold);border-color:var(--navy);}
.light .s-revs-bar{background:var(--line);}
.light .s-revs-bar i{background:var(--grad-gold-deep);}
.light .s-revs-count{color:var(--ink-soft);}

/* FAQ zweispaltig, auf dunkel */
.s-faq2{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2.5rem,6vw,6rem);align-items:start;}
.s-faq2 .s-head{position:sticky;top:7rem;margin:0;}
.s-faq2 .s-head .s-cta{justify-content:flex-start;margin-top:2rem;}
.s-faq2 .s-faq{max-width:none;margin:0;}
.s-sec:not(.light) .s-faq details{border-bottom-color:var(--gline);}
.s-sec:not(.light) .s-faq details:first-child{border-top:1px solid var(--gline);}
.s-sec:not(.light) .s-faq summary{color:#FFFAEC;}
.s-sec:not(.light) .s-faq summary::after{border-color:rgba(239,201,128,.6);color:var(--gold);}
.s-sec:not(.light) .s-faq details[open] summary::after{background:var(--gold);color:var(--navy);}
.s-sec:not(.light) .s-faq details p{color:var(--cr-soft);}
.s-sec:not(.light) .s-faq details a{color:var(--gold);}

/* Sticky-Leiste: erscheint nach dem Hero, verschwindet am Schluss */
.s-sticky{position:fixed;left:0;right:0;bottom:0;z-index:60;transform:translateY(110%);transition:transform .5s var(--ease);
  background:rgba(0,8,41,.9);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid rgba(239,201,128,.25);
  padding-bottom:env(safe-area-inset-bottom);}
.s-sticky.on{transform:none;}
.s-sticky-in{max-width:1180px;margin:0 auto;padding:.75rem var(--gut);display:flex;align-items:center;justify-content:space-between;gap:1rem;}
.s-sticky .t{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cr-soft);line-height:1.3;}
.s-sticky .t b{font-family:'Fraunces',serif;font-weight:340;font-variation-settings:'wght' 340;font-size:1.15rem;letter-spacing:0;text-transform:none;color:#FFFAEC;margin-left:.3rem;}
.s-sticky .t small{display:block;margin-top:.15rem;font-size:.6rem;letter-spacing:.14em;color:var(--gold);}
.s-sticky .s-btn{padding:.8rem 1.3rem;font-size:.68rem;white-space:nowrap;width:auto !important;}

@media(max-width:1020px){
  .s-techs{grid-template-columns:repeat(2,1fr);}
  .s-gal .s-gal-it{flex-basis:calc((100% - 2.4rem) / 3);}
}
@media(max-width:860px){
  .s-phero-in{grid-template-columns:1fr;}
  .s-phero-pics{order:-1;padding:0 0 2.2rem 2.2rem;max-width:520px;}
  .s-phero-pics::before{right:-.8rem;left:3rem;bottom:3rem;top:.8rem;}
  .s-phero-pics .big{aspect-ratio:5/4;}
  .s-facts-in{grid-template-columns:1fr 1fr;}
  .s-facts-in > div:nth-child(3)::before{display:none;}
  .s-facts-in > div:nth-child(n+3){border-top:1px solid var(--gline);}
  .s-faq2{grid-template-columns:1fr;gap:2rem;}
  .s-faq2 .s-head{position:static;}
}
@media(max-width:760px){
  .s-phero{padding-top:6.2rem;}
  .s-phero h1{font-size:clamp(2.2rem,9.4vw,2.9rem);}
  .s-phero .s-eb{font-size:.6rem;letter-spacing:.22em;}
  .s-phero-sub{font-size:1rem;}
  .s-phero .s-cta .s-btn{width:100%;}
  .s-phero-pics{padding:0 0 1.6rem 1.6rem;margin-right:.8rem;}
  .s-phero-pics::before{left:2.4rem;bottom:2.4rem;}
  .s-facts-in > div{padding:1.1rem .6rem;}
  .s-facts .v{font-size:1rem;}
  .s-tech{padding:1.8rem 1.5rem 1.7rem;}
  .s-tech .n{font-size:2rem;}
  .s-gal .s-gal-it{flex-basis:72%;}
  .s-gal .s-revs-track{margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut);scroll-padding-inline:var(--gut);gap:.8rem;}
  .s-sticky .t small{display:none;}
}

/* KI-Kennzeichnung auf Fotos: einheitlich klein (Christoph 18.10.: 50 % kleiner) */
.ai-badge{position:absolute;right:.6rem;bottom:.5rem;z-index:2;font-size:.3rem;letter-spacing:.06em;color:rgba(255,255,255,.75);text-shadow:0 1px 3px rgba(0,0,0,.6);pointer-events:none;}

/* ---------- Handy: nur Fotos werden gewischt (Christoph 18.10., wie NUBA 2027) ----------
   Reihen ohne Bilder stehen schmal untereinander, Nummer links, Text rechts. */
@media(max-width:760px){
  .s-swipe:not(:has(img)){display:grid !important;grid-template-columns:1fr;gap:.7rem;overflow:visible;scroll-snap-type:none;margin-inline:0;padding:0;}
  .s-swipe:not(:has(img)) > *{flex:none !important;width:auto;padding:1.15rem 1.25rem 1.2rem !important;}
  .s-swipe:not(:has(img)) > :has(> .n){display:grid;grid-template-columns:2.6rem 1fr;column-gap:.9rem;align-items:start;}
  .s-swipe:not(:has(img)) > :has(> .n) > *{grid-column:2;}
  .s-swipe:not(:has(img)) > :has(> .n) > .n{grid-column:1;grid-row:1 / span 6;font-size:1.9rem !important;line-height:1.05;margin:0 !important;}
  .s-swipe:not(:has(img)) > * h3{margin:0 0 .35rem !important;font-size:1.12rem;}
  .s-swipe:not(:has(img)) > * p{font-size:.92rem;line-height:1.55;}
  .s-swipe:not(:has(img)) > * .price{padding-top:.7rem;}
  .s-swipe:not(:has(img)) + .s-track-nav{display:none !important;}
}

/* ---------- Titelzeile: ruhig statt Laufband (Christoph 20.10.) ---------- */
.s-titles{background:var(--deep);border-top:1px solid var(--gline);border-bottom:1px solid var(--gline);padding:1.6rem 0;}
.s-titles ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem 0;}
.s-titles li{display:flex;align-items:center;white-space:nowrap;font-family:'Fraunces',serif;font-style:italic;font-weight:340;font-variation-settings:'wght' 340;font-size:clamp(.95rem,1.2vw,1.04rem);line-height:1.4;color:var(--cr-soft);}
.s-titles li:not(:last-child)::after{content:"";width:5px;height:5px;background:var(--gold);opacity:.75;transform:rotate(45deg);margin:0 .85rem;flex:none;}
.s-titles ul{flex-wrap:nowrap;}
.s-titles .s-wrap{overflow:hidden;max-width:none;padding:0 clamp(1rem,3vw,3rem);}
.s-titles li{font-size:clamp(.9rem,1.05vw,1rem);}
.s-titles li::after,.s-titles.run li:last-child::after{margin:0 .7rem !important;}
.s-titles.run .s-wrap{max-width:none;padding:0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);}
.s-titles.run ul{justify-content:flex-start;width:max-content;animation:sMarquee 45s linear infinite;}
.s-titles.run li:last-child::after{content:"";width:5px;height:5px;background:var(--gold);opacity:.75;transform:rotate(45deg);margin:0 .85rem;flex:none;}
@media(max-width:760px){.s-titles{padding:1.2rem 0;}.s-titles.run ul{animation-duration:32s;}}
@media(prefers-reduced-motion:reduce){.s-titles.run ul{animation:none;}.s-titles.run .s-wrap{overflow-x:auto;}}

/* Sprungmarken (z. B. /expertise/#intercoiffure) nicht unter der fixen Navigation verstecken */
.s27 section[id],.s27 header[id]{scroll-margin-top:84px;}
.s-about p a{color:var(--gold-deep);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;transition:color .3s;}.s-about p a:hover{color:var(--navy);}
.s-sec:not(.light) .s-about p a{color:var(--gold);}.s-sec:not(.light) .s-about p a:hover{color:#FFFAEC;}

/* Startseite: kleine Zeile über der Überschrift gehört jetzt zur H1 (Google: «Friseur St. Pölten», Christoph 20.10.) */
.s-hero h1.s-h1eb{margin-top:0;}
.s-hero h1.s-h1eb .s-eb{display:flex;margin:0 0 1.5rem;font-family:'Hanken Grotesk',sans-serif;font-style:normal;font-weight:600;font-variation-settings:normal;line-height:1.5;letter-spacing:.32em;}
@media(max-width:760px){.s-hero h1.s-h1eb .s-eb{font-size:.56rem;letter-spacing:.15em;gap:.3rem .55rem;flex-wrap:nowrap;white-space:nowrap;}}

/* Barrierefreiheit: ganz kleine helle Schrift kräftiger (Kontrast mind. 4,5:1, Audit 21.10.) */
body.s27{--cr-faint:rgba(255,250,236,.56);}

/* Prüfung 21.10.: Handy-Feinschliff */
@media(max-width:760px){
  /* Hero-Fotos im Querformat: Haar von oben zeigen */
  .s-phero-pics .big,.s-phero-pics .small{object-position:50% 12%;}
  /* Buttons einzeilig halten */
  .s-btn{letter-spacing:.13em;padding-left:1.1rem;padding-right:1.1rem;}
  /* Tippflächen mind. 44 px */
  .foot-nav a,footer .links a{display:inline-block;padding:.7rem .35rem;}
  .s-rev-more{padding:.8rem 0;}
}

/* Hero-Foto: Kopf ganz sichtbar (Christoph 21.10.) */
@keyframes sKenTop{0%{transform:scale(1);}100%{transform:scale(1.07) translate3d(-1.5%,0,0);}}
@media(min-width:761px){
  .s-hero-bg{top:5.5rem;}
  .s-hero-bg img{object-position:68% 0%;transform-origin:65% 0%;animation-name:sKenTop;}
}
@media(max-width:760px){
  .s-hero{display:block;min-height:0;padding:4.95rem 0 4.5rem;}
  .s-hero-bg{position:relative;inset:auto;height:56svh;min-height:330px;}
  .s-hero-bg img{object-position:71% 6%;animation:none;}
  .s-hero::after{inset:4.95rem 0 auto 0;height:56svh;min-height:330px;background:linear-gradient(0deg,var(--black) 0%,color-mix(in srgb,var(--black) 60%,transparent) 24%,transparent 50%);}
  .s-hero > .s-wrap{position:relative;margin-top:-3.2rem;}
}

/* Unterseiten: kleine Zeile steht in der H1 (Google liest Ort mit), große Zeile ohne «in St. Pölten» (Christoph 22.10.) */
.s-phero h1.s-h1eb{margin-top:0;}
.s-phero h1.s-h1eb .s-eb{display:flex;margin:0 0 1.4rem;max-width:none;font-family:'Hanken Grotesk',sans-serif;font-style:normal;font-weight:600;font-variation-settings:normal;line-height:1.5;}
/* «Mehr erfahren»-Link in Preiskarten mit Zusatzleistung (aus /duennes-haar/ übernommen, 22.10.2026) */
.s-tech .t-more{align-self:flex-start;justify-self:start;width:max-content;max-width:100%;margin:.8rem 0 1.1rem;font-size:.8rem;letter-spacing:.06em;color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(239,201,128,.4);padding-bottom:.15rem;}
.s-tech .t-more:hover{border-bottom-color:var(--gold);}

/* Vorher/Nachher-Schildchen auf den Kopfbildern (Seite Vorher & Nachher, 23.10.2026) */
.s-phero-pics .ph-tag{position:absolute;z-index:3;font-size:.62rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;padding:.38rem .65rem;line-height:1.2;}
.s-phero-pics .ph-big{right:.9rem;bottom:calc(3.2rem + .9rem);background:var(--gold);color:var(--navy);}
.s-phero-pics .ph-small{left:.6rem;bottom:.6rem;background:rgba(0,8,41,.8);color:#FFFAEC;}
@media(max-width:860px){.s-phero-pics .ph-big{bottom:calc(2.2rem + .7rem);right:.7rem;}}
@media(max-width:760px){.s-phero-pics .ph-big{bottom:calc(1.6rem + .6rem);right:.6rem;font-size:.56rem;}.s-phero-pics .ph-small{font-size:.56rem;}}
@media(max-width:760px){.s-phero h1.s-h1eb .s-eb{font-size:.56rem;letter-spacing:.16em;gap:.3rem .55rem;flex-wrap:nowrap;white-space:nowrap;}}

/* Handy-Sichtprüfung 23.10.: saubere Umbrüche */
h1,h2,h3,.s-kick,.s-facts .k,.s-end h2,summary,.s-btn{text-wrap:balance;}
p,li{text-wrap:pretty;}
.nw{white-space:nowrap;}
@media(max-width:760px){
  .s-kick{display:inline-block;max-width:100%;line-height:1.8;letter-spacing:.26em;}
  .s-kick::before,.s-kick::after{display:inline-block;vertical-align:middle;margin:0 .75rem;}
  .s-kick::before{margin-left:0;}
  .s-kick::after{margin-right:0;}
  footer .links .dot{display:none;}
  footer .links a{padding:.7rem .65rem;}
  .s-kick .kd{display:block;height:0;overflow:hidden;}
  .s-phero p.s-eb{font-size:.56rem;letter-spacing:.16em;gap:.3rem .55rem;flex-wrap:nowrap;white-space:nowrap;}
}
