/* ==========================================================================
   SCHMINKRAUM · Kurse, Ausbildung, Gutschein (loaded only on these three pages)
   Puderwolke hero · steps · bands · voucher over the studio photo · photo strip
   ========================================================================== */

/* noir hero: the shared eyebrow rule covers .dark/.cta/.hero, not .hsplit */
.hsplit:not(.light) .eyebrow{color:var(--gold-soft)}

/* ---- Puderwolke hero (fx-powder.js): photo with a brush, powder spills into the noir around it ---- */
@media (min-width:1081px){.k-hero .hsplit-in{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.k-hero .visual{max-width:560px}
.k-powder{--pt:clamp(3rem,7vw,6rem);--pl:clamp(1.6rem,6vw,5rem);padding:var(--pt) 0 0 var(--pl)}
.k-powder::before{content:"";position:absolute;z-index:-1;inset:calc(var(--pt) + 16px) -16px -16px calc(var(--pl) + 16px);
  border:1px solid rgba(210,180,126,.5);pointer-events:none}
/* fixed crop: data-origin is measured on this 4:5 box (object-position 44%); a framed photo does not do the brush "tap" */
.k-powder>.fx-powder-brush{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:44% 50%;
  background:var(--noir-3);translate:none!important}
/* Ausbildung: smaller echo, full 3:2 photo, the cloud rises above it */
.k-echo .k-powder{--pt:clamp(2.6rem,6vw,5rem);--pl:0px}
.k-echo .k-powder>.fx-powder-brush{aspect-ratio:auto}
@media (max-width:1080px){.k-hero .visual{max-width:min(480px,100%)}}

.k-badge{display:inline-flex;align-items:center;gap:.75rem;min-height:44px;margin:-1rem 0 1.5rem;
  font-size:.75rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-soft)}
.k-badge::before{content:"";flex:none;width:6px;height:6px;background:currentColor;transform:rotate(45deg)}
a.k-badge{text-decoration:underline;text-decoration-color:rgba(210,180,126,.4);text-underline-offset:.5em}
@media (hover:hover) and (pointer:fine){a.k-badge:hover{text-decoration-color:currentColor}}

/* ---- rhythm helpers ---- */
.k-after{margin-top:clamp(1.6rem,3vw,2.4rem)}
.head.k-stack{grid-template-columns:minmax(0,1fr)}   /* long heading: text goes below, no hyphenated "Schmink-raum" */
.head.k-stack p{max-width:60ch}
main h2{-webkit-hyphens:manual;hyphens:manual}   /* never "Schmink-raum"; longest h2 word fits at 390 px */
.k-jump{margin:-1rem 0 clamp(1.6rem,3vw,2.4rem)}
.k-jump a{display:inline-flex;align-items:center;min-height:44px}
main .tlink{position:relative}
main .tlink::after{content:"";position:absolute;inset:-.75rem -.4rem}   /* ≥ 44 px tap area, same look */
main .tlink:hover svg:not(.arr){transform:none}   /* WhatsApp icon in "Kurs anfragen" stays put, only arrows slide */

/* two-column band: heading + text | list or call to action */
.k-band{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.k-band h2:not(:last-child){margin-bottom:1.5rem}
.k-band .ticks{margin:0}
.k-band .ticks+.note{margin-top:1.6rem}
@media (max-width:1080px){.k-band{grid-template-columns:1fr}}

/* ---- Ablauf: numbered steps (4 → 2 → 1, three → 1) ---- */
.k-steps{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1.8rem,3.5vw,3.2rem)}
.k-steps.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.k-steps .step h3{font-size:clamp(1.4rem,1.05rem + 1vw,1.9rem)}
@media (max-width:1080px){.k-steps:not(.three){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.k-steps.k-steps{grid-template-columns:1fr}}
.step a[href^="tel:"]{white-space:nowrap}

/* ---- Ausbildung: courses + curriculum, prices ---- */
.k-curr{margin-top:clamp(1.6rem,3vw,2.4rem)}
.k-course2{margin-top:clamp(3rem,6vw,5rem)}
.k-prices .pr b{font-size:clamp(1.3rem,1.05rem + .9vw,1.75rem)}

/* ---- Gutschein: voucher card over the studio photo ---- */
.g-visual{padding-bottom:22%}
.g-room{display:block;width:84%;height:auto;margin-left:auto;background:var(--ph);box-shadow:0 40px 70px -40px rgba(18,14,12,.45)}
.g-visual .voucher{position:absolute;left:0;bottom:0;width:70%}
.g-visual .v-brand small{letter-spacing:.2em;white-space:nowrap}
@media (max-width:560px){.g-visual{padding-bottom:30%}.g-visual .voucher{width:82%}.g-visual .v-kind{display:none}}

/* photo strip: one 3:2 + two 3:4, equal heights (2fr = 2 × 1fr) */
.g-strip{display:grid;grid-template-columns:2fr 1fr 1fr;gap:clamp(.55rem,1.3vw,1rem)}
.g-strip a{display:block;overflow:hidden;aspect-ratio:3/4;background:var(--ph);cursor:zoom-in}
.g-strip a:first-child{aspect-ratio:3/2}
.g-strip img{width:100%;height:100%;object-fit:cover}
@media (max-width:600px){.g-strip{grid-template-columns:1fr 1fr}.g-strip a:first-child{grid-column:1/-1}}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .g-strip img{transition:scale 1s var(--ease,ease)}
  .g-strip a:hover img{scale:1.035}
}
