:root{--ink:#0b0b0a;--paper:#eee7da;--paper2:#f7f1e8;--muted:#b8ae9f;--line:rgba(11,11,10,.18);--serif:Georgia,'Times New Roman',serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}a{color:inherit}img{max-width:100%;display:block}.reveal{opacity:0;transform:translateY(30px);transition:.8s cubic-bezier(.2,.7,.2,1)}.reveal.in{opacity:1;transform:none}
/* NAV */
.navbar{height:72px;background:rgba(238,231,218,.96);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:center;position:sticky;top:0;z-index:1000;backdrop-filter:blur(12px)}.navbar ul{list-style:none;display:flex;align-items:center;justify-content:center;gap:0;margin:0;padding:0}.navbar a{display:block;text-decoration:none;padding:27px 24px;font-size:12px;font-weight:700;letter-spacing:.15em}.navbar a:hover,.navbar a.active{background:var(--ink);color:var(--paper2)}
/* HERO */
.editorial-hero{min-height:calc(100vh - 72px);display:grid;grid-template-columns:46% 54%;background:var(--paper);position:relative;overflow:hidden}.hero-copy{padding:9vh 6vw;display:flex;flex-direction:column;justify-content:center;position:relative;z-index:3}.hero-kicker{font-size:11px;letter-spacing:.32em;margin:0 0 28px}.hero-copy h1{font-family:var(--serif);font-size:clamp(64px,8vw,142px);font-weight:400;letter-spacing:-.07em;line-height:.72;margin:0}.hero-copy h1 span{font-style:italic}.hero-script{font-family:var(--serif);font-style:italic;font-size:clamp(24px,2.6vw,44px);margin:30px 0 10px}.hero-intro{max-width:510px;line-height:1.8;font-size:14px}.hero-actions{display:flex;gap:22px;align-items:center;margin-top:26px}.btn-dark,.btn-outline{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;text-transform:uppercase;letter-spacing:.13em;font-size:11px;font-weight:700;padding:15px 22px;border:1px solid var(--ink)}.btn-dark{background:var(--ink);color:var(--paper2)}.btn-outline:hover{background:var(--ink);color:var(--paper2)}
.hero-art{position:relative;background:var(--ink);min-height:650px;overflow:hidden}.hero-art:before{content:'MOS';position:absolute;right:-2vw;bottom:-6vw;font:italic 400 clamp(160px,27vw,520px)/.7 var(--serif);color:rgba(238,231,218,.035);letter-spacing:-.08em}.hero-word{position:absolute;color:var(--paper);font:italic 400 clamp(55px,7vw,125px)/.8 var(--serif);letter-spacing:-.06em;white-space:nowrap;z-index:5}.hero-word-top{top:10%;left:-11%}.hero-word-bottom{right:4%;bottom:8%}.hero-stamp{position:absolute;right:7%;top:8%;width:90px;height:90px;border:1px solid rgba(238,231,218,.55);border-radius:50%;color:var(--paper);display:grid;place-content:center;text-align:center;font:22px/1 var(--serif);z-index:5}.hero-stamp small{font:8px Arial;letter-spacing:.2em}.hair-svg{position:absolute;inset:8% 7% 13% 8%;width:85%;height:79%}.hair-path{fill:none;stroke:#d6c8b4;stroke-width:1.4;stroke-linecap:round;stroke-dasharray:1800;stroke-dashoffset:1800;animation:drawHair 3.6s ease forwards .25s}.hair-path.ghost{stroke:rgba(214,200,180,.24);stroke-width:.8;animation-delay:.9s}.scissor{position:absolute;left:49%;top:45%;width:92px;height:92px;z-index:7;animation:scissorTravel 5.8s cubic-bezier(.45,0,.25,1) infinite}.scissor svg{width:100%;height:100%;overflow:visible}.blade{transform-origin:50% 50%;animation:snip .65s ease-in-out infinite alternate}.blade.b{animation-direction:alternate-reverse}.scissor circle,.scissor path{fill:none;stroke:var(--paper);stroke-width:2}
@keyframes drawHair{to{stroke-dashoffset:0}}@keyframes snip{from{transform:rotate(-8deg)}to{transform:rotate(8deg)}}@keyframes scissorTravel{0%,100%{transform:translate(-140px,-160px) rotate(-28deg)}50%{transform:translate(130px,130px) rotate(12deg)}}
/* KEEP: specialization banner */
.editorial-marquee{background:#000;color:#fff;min-height:66px;display:flex;align-items:center;justify-content:center;gap:28px;overflow:hidden;font:italic 400 clamp(20px,2.1vw,35px) var(--serif);letter-spacing:.04em;white-space:nowrap}.editorial-marquee i{font-style:normal;color:#a79d8d}
/* INTRO + SERVICE CARDS */
.intro{padding:100px 7vw 70px;text-align:center}.eyebrow{font-size:10px;letter-spacing:.3em;text-transform:uppercase}.display-title{font:400 clamp(42px,6vw,96px)/.95 var(--serif);letter-spacing:-.05em;margin:18px auto 28px;max-width:1100px}.intro p:last-child{max-width:780px;margin:auto;line-height:1.85;color:#403c36}.services{background:var(--ink);color:var(--paper2);padding:80px 6vw;display:grid;grid-template-columns:repeat(3,1fr);gap:1px}.service-card{border:1px solid rgba(247,241,232,.24);padding:48px 34px;min-height:330px;position:relative;overflow:hidden}.service-no{font:italic 400 74px var(--serif);color:rgba(247,241,232,.15)}.service-card h3{font:400 28px var(--serif);margin:30px 0 16px}.service-card p{color:#c9c0b4;line-height:1.7}.service-line{position:absolute;left:34px;right:34px;bottom:38px;height:1px;background:rgba(247,241,232,.3);overflow:visible}.mini-scissor{position:absolute;bottom:22px;left:34px;font-size:26px;transition:1s cubic-bezier(.2,.7,.2,1)}.service-card:hover .mini-scissor{left:calc(100% - 65px)}
/* EDITORIAL CHAPTERS */
.chapters{background:var(--paper)}.chapter{min-height:340px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:16% 1fr 1fr;align-items:center;padding:35px 7vw;position:relative;overflow:hidden}.chapter-num{font:italic 400 clamp(80px,11vw,190px)/1 var(--serif);color:rgba(11,11,10,.09)}.chapter h3{font:400 clamp(35px,4vw,68px)/1 var(--serif);margin:0}.chapter p{max-width:450px;line-height:1.8}.chapter:after{content:'✂';position:absolute;right:5vw;top:25px;font-size:32px;opacity:.16;transform:rotate(-20deg);transition:.6s}.chapter:hover:after{right:9vw;transform:rotate(10deg)}
/* BRAND MARQUEE preserved */
.brand-marquee{width:100%;overflow:hidden;background:#000;padding:38px 0}.brand-track{display:flex;width:max-content;animation:brandLoop 35s linear infinite}.brand-set{display:flex;align-items:center;flex-shrink:0;gap:100px;padding-right:100px}.brand-set img{flex-shrink:0;width:auto;height:75px;max-width:240px;object-fit:contain;background:transparent}.brand-set img[src*='ghd'],.brand-set img[src*='great']{filter:grayscale(1) brightness(2)}@keyframes brandLoop{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* TEAM */
.team{background:var(--ink);color:var(--paper2);padding:90px 6vw}.team-head{display:flex;justify-content:space-between;align-items:end;border-bottom:1px solid rgba(247,241,232,.25);padding-bottom:35px}.team-head h1,.team-head h2{font:400 clamp(48px,7vw,110px)/.85 var(--serif);letter-spacing:-.05em;margin:0}.team-list{counter-reset:team}.team-row{counter-increment:team;display:grid;grid-template-columns:100px 1.2fr 1fr 40px;align-items:center;min-height:145px;border-bottom:1px solid rgba(247,241,232,.2);transition:.35s;padding:10px 18px}.team-row:before{content:'0' counter(team);font:italic 26px var(--serif);color:#a79d8d}.team-row h3{font:400 clamp(30px,4vw,62px) var(--serif);margin:0}.team-row p{color:#c9c0b4}.team-row .arrow{font-size:26px;transition:.35s}.team-row:hover{background:var(--paper);color:var(--ink);padding-left:35px}.team-row:hover p{color:#514b43}.team-row:hover .arrow{transform:translateX(8px) rotate(45deg)}
/* SALON */
.salon-hero,.page-hero{background:var(--ink);color:var(--paper);padding:100px 7vw 70px;position:relative;overflow:hidden}.page-hero h1{font:italic 400 clamp(60px,10vw,170px)/.8 var(--serif);letter-spacing:-.06em;margin:20px 0}.page-hero p{max-width:650px;line-height:1.8;color:#c9c0b4}.salon-grid{padding:80px 6vw;display:grid;grid-template-columns:1.35fr .65fr;grid-auto-rows:310px;gap:18px}.salon-shot{overflow:hidden;background:#d8d0c3;position:relative}.salon-shot:first-child{grid-row:span 2}.salon-shot img{width:100%;height:100%;object-fit:cover;transition:1.2s}.salon-shot:hover img{transform:scale(1.04)}.salon-shot figcaption{position:absolute;left:18px;bottom:18px;background:var(--ink);color:var(--paper);padding:10px 14px;font-size:10px;letter-spacing:.16em;text-transform:uppercase}
/* SERVICE PAGE */
.svc-list{background:var(--paper)}.svc-item{display:grid;grid-template-columns:110px 1fr 1.1fr;gap:35px;align-items:center;padding:60px 7vw;border-bottom:1px solid var(--line);min-height:280px}.svc-index{font:italic 400 65px var(--serif);color:#a89d8d}.svc-item h2{font:400 clamp(35px,4vw,65px)/1 var(--serif);margin:0}.svc-item p{line-height:1.8;margin:0}.svc-cutline{grid-column:2/4;height:1px;background:var(--ink);position:relative}.svc-cutline:after{content:'✂';position:absolute;top:-18px;left:0;font-size:30px;transition:1s}.svc-item:hover .svc-cutline:after{left:calc(100% - 32px)}
/* JOBS / CONTACT */
.content-section{padding:80px 7vw}.info-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}.info-card{padding:35px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.info-card h3{font:400 26px var(--serif)}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--ink);margin-top:40px}.contact-card{background:var(--paper2);padding:45px}.contact-card h3{font:400 34px var(--serif)}.contact-card a{text-decoration:none}.hours-row{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line)}.map-wrap{height:420px}.map-wrap iframe{width:100%;height:100%;border:0}
/* SHOWCASE */
.showcase{background:var(--ink);color:var(--paper);min-height:470px;position:relative;display:grid;place-items:center;overflow:hidden}.showcase:before{content:'✂';position:absolute;font-size:340px;opacity:.025;transform:rotate(-20deg)}.showcase-content{text-align:center;position:relative;z-index:2;padding:60px 20px}.showcase-content h3{font:italic 400 clamp(38px,5vw,78px)/1.05 var(--serif);margin:0 0 30px}.showcase .btn-outline{border-color:var(--paper);color:var(--paper)}.showcase .btn-outline:hover{background:var(--paper);color:var(--ink)}
/* FOOTER */
.site-footer{background:#000;color:#fff;padding:55px 6vw 30px}.footer-grid{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center}.foot-center{text-align:center}.foot-logo{height:85px;margin:0 auto 12px}.foot-phone,.foot-link{color:#fff;text-decoration:none}.foot-right{text-align:right;display:flex;gap:20px;justify-content:flex-end}.foot-social{display:flex;gap:10px;justify-content:center;margin-top:14px}.sbtn img{width:22px;height:22px;object-fit:contain}
@media(max-width:800px){.navbar{height:auto}.navbar ul{overflow:auto;justify-content:flex-start;width:100%}.navbar a{padding:20px 16px;white-space:nowrap}.editorial-hero{grid-template-columns:1fr}.hero-copy{padding:70px 7vw}.hero-art{min-height:560px}.hero-word-top{left:3%}.services{grid-template-columns:1fr}.chapter{grid-template-columns:90px 1fr}.chapter p{grid-column:2}.team-row{grid-template-columns:55px 1fr 30px}.team-row p{grid-column:2}.salon-grid{grid-template-columns:1fr;grid-auto-rows:280px}.salon-shot:first-child{grid-row:span 1}.svc-item{grid-template-columns:70px 1fr}.svc-item p{grid-column:2}.svc-cutline{grid-column:2}.info-grid,.contact-grid,.footer-grid{grid-template-columns:1fr}.foot-left,.foot-right{text-align:center;justify-content:center;margin:18px 0}.brand-set{gap:60px;padding-right:60px}.brand-set img{height:52px;max-width:180px}.brand-track{animation-duration:30s}}


/* =========================================================
   V2 — ORIGINAL HOMEPAGE HERO + VISUAL SALON SECTION
   ========================================================= */

/* Original hero from the previous homepage */
.editorial-hero{
  display:grid;
  grid-template-columns:43% 57%;
  min-height:100vh;
  background:var(--paper);
  overflow:hidden;
  border-bottom:1px solid var(--ink);
  position:relative;
}
.editorial-hero .hero-copy{
  padding:130px 5.5vw 90px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  position:relative;
  z-index:2;
}
.editorial-hero .hero-copy::before{
  content:"MOS";
  position:absolute;
  left:5vw;
  top:74px;
  font-family:var(--serif);
  font-size:12px;
  letter-spacing:.32em;
}
.editorial-hero h1{
  font-family:var(--serif);
  font-size:clamp(88px,10.8vw,180px);
  font-weight:400;
  line-height:.70;
  letter-spacing:-.065em;
  margin:0;
  text-transform:uppercase;
  position:relative;
  z-index:4;
}
.editorial-hero h1 span{font-style:italic;font-size:.54em;letter-spacing:-.03em}
.hero-kicker{font-size:11px;letter-spacing:.32em;margin:0 0 28px;text-transform:uppercase}
.hero-script{font-family:var(--serif);font-style:italic;font-size:clamp(24px,3vw,46px);margin:30px 0 20px}
.hero-intro{max-width:470px;line-height:1.7;font-size:14px;margin:0;color:#4d473f}
.hero-actions{display:flex;align-items:center;gap:26px;margin-top:36px;flex-wrap:wrap}
.editorial-btn{display:inline-block;text-decoration:none;padding:15px 22px;text-transform:uppercase;letter-spacing:.14em;font-size:11px}
.editorial-btn.dark{background:var(--ink);color:var(--paper)}
.editorial-link{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--ink);padding-bottom:4px;font-family:var(--serif);font-style:italic;font-size:18px}
.hero-portrait{position:relative;min-height:100vh;background:#d8caba;overflow:hidden}
.hero-portrait img{width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block;filter:saturate(.62) sepia(.12) contrast(.96)}
.hero-portrait::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(238,229,216,.16),transparent 34%,rgba(0,0,0,.05));pointer-events:none}
.hero-word{position:absolute;z-index:2;color:rgba(247,241,232,.92);font-family:var(--serif);letter-spacing:-.055em;line-height:.8;mix-blend-mode:screen;pointer-events:none}
.hero-word-top{left:-13%;top:15%;font-size:clamp(72px,9vw,150px)}
.hero-word-bottom{right:3%;bottom:9%;font-size:clamp(62px,8vw,130px);font-style:italic}
.hero-stamp{position:absolute;z-index:3;right:5%;top:48%;width:104px;height:104px;border:1px solid rgba(247,241,232,.8);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;font-family:var(--serif);font-size:25px;text-align:center;letter-spacing:.08em}
.hero-stamp small{font-family:Arial,sans-serif;font-size:8px;letter-spacing:.25em;margin-top:4px}

/* More imagery on homepage: salon only, no staff/customer portraits */
.home-salon{
  background:var(--paper);
  color:var(--ink);
  padding:110px 6vw 120px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.home-salon-head{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:8vw;
  align-items:end;
  margin:0 auto 50px;
  max-width:1450px;
}
.home-salon-head .display-title{margin:8px 0 0}
.home-salon-head>p{max-width:520px;line-height:1.85;color:#514b43;margin:0 0 8px}
.home-salon-grid{
  max-width:1450px;
  margin:auto;
  display:grid;
  grid-template-columns:1.45fr .75fr;
  grid-template-rows:320px 320px;
  gap:18px;
}
.home-salon-photo{
  position:relative;
  overflow:hidden;
  background:#d8caba;
  display:block;
  color:#fff;
}
.home-salon-photo--large{grid-row:1 / 3}
.home-salon-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform 1.15s cubic-bezier(.2,.7,.2,1),filter .8s ease;
}
.home-salon-photo::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 50%,rgba(0,0,0,.58));
  pointer-events:none;
}
.home-salon-photo span{
  position:absolute;
  left:24px;
  bottom:22px;
  z-index:2;
  font-size:10px;
  letter-spacing:.22em;
}
.home-salon-photo:hover img{transform:scale(1.045);filter:contrast(1.03)}
.home-salon-link{max-width:1450px;margin:28px auto 0;text-align:right}
.home-salon-link a{color:var(--ink);text-decoration:none;font-family:var(--serif);font-size:22px;border-bottom:1px solid var(--ink);padding-bottom:5px}
.home-salon-link span{display:inline-block;transition:transform .3s ease}
.home-salon-link a:hover span{transform:translate(4px,-4px)}

@media(max-width:900px){
  .editorial-hero{grid-template-columns:1fr;min-height:auto}
  .editorial-hero .hero-copy{padding-top:120px}
  .hero-portrait{min-height:68vh}
  .home-salon{padding:80px 6vw}
  .home-salon-head{grid-template-columns:1fr;gap:20px}
  .home-salon-grid{grid-template-columns:1fr 1fr;grid-template-rows:430px 260px}
  .home-salon-photo--large{grid-column:1 / 3;grid-row:auto}
}
@media(max-width:620px){
  .editorial-hero .hero-copy::before{top:76px;left:24px}
  .home-salon{padding:65px 20px}
  .home-salon-grid{display:grid;grid-template-columns:1fr;grid-template-rows:none}
  .home-salon-photo,.home-salon-photo--large{grid-column:auto;grid-row:auto;height:280px}
  .home-salon-photo--large{height:390px}
}


/* ===== GOOGLE REVIEWS – ORIGINAL ===== */
.google-reviews{background:#f3ede4;padding:100px 6vw;color:#11100d}
.reviews-head{text-align:center;max-width:800px;margin:0 auto 60px}
.reviews-kicker{display:block;font-size:11px;letter-spacing:.25em;margin-bottom:18px;text-transform:uppercase;opacity:.65}
.reviews-head h2{font-family:Georgia,"Times New Roman",serif;font-size:clamp(42px,5vw,75px);font-weight:400;line-height:1;margin:0 0 28px}
.google-rating{display:flex;justify-content:center;align-items:center;gap:15px}
.rating-number{font-family:Georgia,"Times New Roman",serif;font-size:30px}
.rating-stars,.review-stars{letter-spacing:4px;font-size:18px}
.google-label{margin-top:10px;font-size:13px;opacity:.55}
.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1300px;margin:0 auto}
.review-card{border:1px solid rgba(17,16,13,.18);padding:42px 35px;min-height:250px;display:flex;flex-direction:column;justify-content:space-between;transition:.35s ease}
.review-card:hover{background:#11100d;color:#f3ede4;transform:translateY(-5px)}
.review-stars{margin-bottom:25px}
.review-card p{font-family:Georgia,"Times New Roman",serif;font-size:20px;line-height:1.5;margin:0 0 30px}
.review-name{font-size:11px;text-transform:uppercase;letter-spacing:.15em;opacity:.6}
.review-actions{display:flex;justify-content:center;margin-top:55px}
.google-review-btn{display:inline-block;background:#11100d;color:#fff;padding:18px 34px;font-size:11px;letter-spacing:.18em;text-decoration:none;transition:.3s ease}
.google-review-btn:hover{background:#b3ac91;color:#11100d}
@media(max-width:800px){.google-reviews{padding:70px 22px}.reviews-grid{grid-template-columns:1fr}.review-card{min-height:auto}}

/* ===== V5: MOS EXPERIENCE ===== */
.mos-world{position:relative;overflow:hidden;background:#080808;color:#f3ede4;padding:120px 5vw 0;border-top:1px solid rgba(255,255,255,.14)}
.mos-world::before{content:"MOS";position:absolute;top:-70px;right:-25px;font-family:Georgia,"Times New Roman",serif;font-size:clamp(180px,30vw,520px);line-height:1;color:transparent;-webkit-text-stroke:1px rgba(243,237,228,.055);pointer-events:none}
.mos-world-head{position:relative;z-index:2;max-width:1450px;margin:0 auto 70px;display:grid;grid-template-columns:1.1fr .55fr;column-gap:8vw;align-items:end}
.mos-world-kicker{grid-column:1/-1;margin:0 0 20px;font-size:10px;letter-spacing:.34em;opacity:.58}
.mos-world-head h2{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:clamp(58px,8vw,126px);font-weight:400;line-height:.82;letter-spacing:-.055em}
.mos-world-head h2 em{font-weight:400;color:#b3ac91}
.mos-world-copy{margin:0 0 8px;max-width:440px;line-height:1.8;color:rgba(243,237,228,.62);font-size:14px}
.mos-world-stage{position:relative;z-index:2;max-width:1450px;margin:auto;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(255,255,255,.18);border-left:1px solid rgba(255,255,255,.18)}
.world-panel{min-height:560px;position:relative;overflow:hidden;padding:44px;border-right:1px solid rgba(255,255,255,.18);border-bottom:1px solid rgba(255,255,255,.18);isolation:isolate}
.world-panel-number{position:absolute;right:28px;top:18px;z-index:5;font-family:Georgia,"Times New Roman",serif;font-size:clamp(74px,8vw,132px);line-height:1;color:transparent;-webkit-text-stroke:1px rgba(243,237,228,.22);transition:transform .7s,color .5s}
.world-panel-copy{position:absolute;left:44px;right:44px;bottom:42px;z-index:5;max-width:590px}
.world-panel-copy>span{display:block;margin-bottom:13px;font-size:9px;letter-spacing:.28em;opacity:.58}
.world-panel-copy h3{margin:0 0 14px;font-family:Georgia,"Times New Roman",serif;font-size:clamp(44px,5vw,78px);font-weight:400;letter-spacing:-.045em}
.world-panel-copy p{max-width:480px;margin:0;line-height:1.75;color:rgba(243,237,228,.66)}
.world-panel:hover .world-panel-number{transform:translateY(10px) rotate(-4deg);color:rgba(179,172,145,.09)}
.world-panel--image{padding:0;background:#111}
.world-panel--image>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(.28) contrast(1.03) brightness(.72);transition:transform 1.4s cubic-bezier(.2,.7,.2,1),filter .8s}
.world-panel--image:hover>img{transform:scale(1.07);filter:grayscale(0) contrast(1.02) brightness(.82)}
.world-image-shade{position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(0,0,0,.05) 15%,rgba(0,0,0,.82) 100%)}
.world-arrow{position:absolute;z-index:6;top:38px;left:42px;width:58px;height:58px;border:1px solid rgba(255,255,255,.62);border-radius:50%;display:grid;place-items:center;font-size:24px;transition:.45s}
.world-panel--image:hover .world-arrow{transform:rotate(45deg);background:#f3ede4;color:#080808}
.world-panel--craft{background:radial-gradient(circle at 78% 18%,rgba(179,172,145,.14),transparent 25%),#080808}
.craft-motion{position:absolute;left:8%;right:8%;top:43%;height:90px;transform:rotate(-8deg)}
.craft-line{position:absolute;left:0;right:0;top:44px;height:1px;background:linear-gradient(90deg,transparent,#b3ac91 12%,#f3ede4 50%,#b3ac91 88%,transparent)}
.craft-scissor{position:absolute;top:12px;left:0;font-size:42px;transform:rotate(8deg);animation:worldCut 6s ease-in-out infinite;filter:grayscale(1)}
@keyframes worldCut{0%,8%{left:0;transform:rotate(8deg) scale(1)}45%{transform:rotate(8deg) scale(1.12)}82%,100%{left:calc(100% - 52px);transform:rotate(8deg) scale(1)}}
.world-panel--brands{background:linear-gradient(145deg,#0a0a0a,#12110f)}
.world-brand-cloud{position:absolute;left:44px;right:44px;top:105px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.world-brand{height:112px;background:#f3ede4;display:flex;align-items:center;justify-content:center;padding:24px;overflow:hidden;transition:transform .4s,background .4s}
.world-brand:nth-child(2),.world-brand:nth-child(3){transform:translateY(18px)}
.world-brand:hover{transform:translateY(-5px) rotate(-1deg);background:#fff}
.world-brand:nth-child(2):hover,.world-brand:nth-child(3):hover{transform:translateY(13px) rotate(1deg)}
.world-brand img{max-width:100%;max-height:60px;object-fit:contain;filter:grayscale(1) contrast(1.1)}
.world-ring{position:absolute;z-index:5;right:34px;top:34px;width:112px;height:112px;border:1px solid rgba(255,255,255,.65);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:Georgia,"Times New Roman",serif;font-size:28px;transition:transform 1s}
.world-ring small{font-family:Arial,sans-serif;font-size:7px;letter-spacing:.24em;margin-top:4px}
.world-panel--detail:hover .world-ring{transform:rotate(360deg)}
.mos-world-ticker{margin:80px -5vw 0;overflow:hidden;border-top:1px solid rgba(255,255,255,.15);padding:22px 0 24px;white-space:nowrap}
.mos-world-ticker div{width:max-content;font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:22px;letter-spacing:.08em;color:rgba(243,237,228,.42);animation:mosWorldTicker 120s linear infinite}
@keyframes mosWorldTicker{to{transform:translateX(-50%)}}
@media(max-width:900px){.mos-world{padding:85px 22px 0}.mos-world-head{grid-template-columns:1fr;gap:24px}.mos-world-stage{grid-template-columns:1fr}.world-panel{min-height:520px}.mos-world-ticker{margin-left:-22px;margin-right:-22px}}
@media(max-width:560px){.world-panel{padding:28px;min-height:470px}.world-panel-copy{left:28px;right:28px;bottom:28px}.world-brand-cloud{left:28px;right:28px;top:105px;gap:8px}.world-brand{height:92px;padding:17px}.world-panel-number{right:18px}}


/* =========================================================
   V6 — PUNKT 01: SCHERE + HAAR + SPRAY
   ========================================================= */
.craft-motion{display:none!important}
.craft-studio{
  position:absolute;
  left:5%;
  right:5%;
  top:19%;
  height:285px;
  overflow:hidden;
}
.hair-art{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hair-strand{
  fill:none;
  stroke:#f3ede4;
  stroke-width:1.5;
  stroke-linecap:round;
  opacity:.72;
  stroke-dasharray:1000;
  stroke-dashoffset:1000;
  animation:drawHair 5.4s ease-in-out infinite;
}
.hair-strand.h2{opacity:.45;animation-delay:.22s}
.hair-strand.h3{opacity:.28;animation-delay:.42s}
.cut-guide{
  fill:none;
  stroke:#b3ac91;
  stroke-width:1;
  stroke-dasharray:7 12;
  opacity:.65;
}
@keyframes drawHair{
  0%{stroke-dashoffset:1000;opacity:0}
  18%{opacity:.75}
  55%,86%{stroke-dashoffset:0}
  100%{stroke-dashoffset:-1000;opacity:0}
}
.animated-scissors{
  position:absolute;
  left:3%;
  top:68%;
  z-index:4;
  font-size:48px;
  filter:grayscale(1);
  transform:rotate(-10deg);
  animation:scissorCut 5.4s cubic-bezier(.55,.05,.25,1) infinite;
}
@keyframes scissorCut{
  0%,12%{left:3%;transform:rotate(-10deg) scale(1)}
  25%{transform:rotate(-4deg) scale(.88)}
  40%{transform:rotate(-11deg) scale(1.08)}
  58%{transform:rotate(-5deg) scale(.9)}
  78%{left:84%;transform:rotate(-10deg) scale(1.05)}
  100%{left:84%;opacity:.2}
}
.spray-bottle{
  position:absolute;
  right:4%;
  top:9%;
  width:54px;
  height:118px;
  transform:rotate(-18deg);
  animation:sprayBottle 5.4s ease-in-out infinite;
}
.spray-body{
  position:absolute;left:10px;bottom:0;width:38px;height:76px;
  border:1px solid rgba(243,237,228,.75);
  border-radius:8px 8px 13px 13px;
  background:linear-gradient(90deg,rgba(243,237,228,.05),rgba(179,172,145,.18));
}
.spray-neck{
  position:absolute;left:20px;top:25px;width:18px;height:22px;
  border:1px solid rgba(243,237,228,.7);
}
.spray-head{
  position:absolute;left:17px;top:13px;width:32px;height:14px;
  border:1px solid rgba(243,237,228,.75);
  border-radius:2px;
}
.spray-head::after{
  content:"";position:absolute;right:-15px;top:3px;width:15px;height:5px;
  border-top:1px solid rgba(243,237,228,.75);
}
@keyframes sprayBottle{
  0%,32%,100%{transform:rotate(-18deg) translateY(0)}
  38%{transform:rotate(-24deg) translateY(4px)}
  45%{transform:rotate(-18deg) translateY(0)}
}
.spray-mist{
  position:absolute;
  right:10%;
  top:9%;
  width:180px;
  height:105px;
  transform:rotate(-10deg);
}
.spray-mist i{
  position:absolute;
  right:0;
  top:48%;
  width:4px;height:4px;border-radius:50%;
  background:#f3ede4;
  opacity:0;
  animation:sprayParticle 5.4s ease-out infinite;
}
.spray-mist i:nth-child(2){animation-delay:.05s;--x:-55px;--y:-28px}
.spray-mist i:nth-child(3){animation-delay:.09s;--x:-85px;--y:8px}
.spray-mist i:nth-child(4){animation-delay:.13s;--x:-120px;--y:-15px}
.spray-mist i:nth-child(5){animation-delay:.17s;--x:-145px;--y:24px}
.spray-mist i:nth-child(6){animation-delay:.21s;--x:-75px;--y:35px}
.spray-mist i:nth-child(7){animation-delay:.25s;--x:-110px;--y:-38px}
.spray-mist i:nth-child(8){animation-delay:.29s;--x:-155px;--y:-5px}
.spray-mist i:nth-child(9){animation-delay:.33s;--x:-130px;--y:42px}
.spray-mist i:first-child{--x:-45px;--y:4px}
@keyframes sprayParticle{
  0%,34%{transform:translate(0,0) scale(.5);opacity:0}
  38%{opacity:.8}
  52%{transform:translate(var(--x),var(--y)) scale(1.35);opacity:0}
  100%{opacity:0}
}

/* =========================================================
   V6 — PUNKT 03: BILD ALS HINTERGRUND
   ========================================================= */
.world-panel--brands{background:#0b0b0b}
.brand-panel-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  filter:grayscale(.25) brightness(.43) contrast(1.08);
  transform:scale(1.02);
  transition:transform 1.4s cubic-bezier(.2,.7,.2,1),filter .8s ease;
  z-index:-2;
}
.brand-panel-shade{
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(180deg,rgba(0,0,0,.22),rgba(0,0,0,.72) 62%,rgba(0,0,0,.94));
}
.world-panel--brands:hover .brand-panel-bg{
  transform:scale(1.075);
  filter:grayscale(0) brightness(.5) contrast(1.04);
}
.world-panel--brands .world-brand{
  background:rgba(243,237,228,.93);
  backdrop-filter:blur(7px);
  box-shadow:0 14px 45px rgba(0,0,0,.16);
}
.world-panel--brands .world-panel-copy{text-shadow:0 2px 18px rgba(0,0,0,.7)}

@media (prefers-reduced-motion:reduce){
  .hair-strand,.animated-scissors,.spray-bottle,.spray-mist i{animation:none!important}
}
/* ===== MOS WORLD – BILD ZOOM PUNKT 1 + 3 ===== */

.world-panel--craft .brand-panel-bg,
.world-panel--brands .brand-panel-bg {
  position: absolute;
  inset: 0;

  width: 100%;
  height: 100%;

  object-fit: cover;

  z-index: -2;

  transform: scale(1.02);
  filter: brightness(.48) grayscale(.15);

  transition:
    transform 1.4s cubic-bezier(.2,.7,.2,1),
    filter .8s ease;
}


/* HOVER ZOOM */
.world-panel--craft:hover .brand-panel-bg,
.world-panel--brands:hover .brand-panel-bg {
  transform: scale(1.09);
  filter: brightness(.56) grayscale(0);
}


/* DUNKLER VERLAUF DAMIT TEXT LESBAR BLEIBT */
.world-panel--craft .brand-panel-shade,
.world-panel--brands .brand-panel-shade {
  position: absolute;
  inset: 0;
  z-index: -1;

  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,.10) 0%,
      rgba(0,0,0,.30) 45%,
      rgba(0,0,0,.82) 100%
    );

  pointer-events: none;
}


/* WICHTIG DAMIT BILD INNERHALB DER KARTE BLEIBT */
.world-panel--craft,
.world-panel--brands {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
/* =========================================================
   MOS – TERMINBEREICH
   BILD + TEXT + BUTTON + HÖRER + PARALLAX
   ========================================================= */

   .showcase {
    position: relative !important;
    width: 100%;
    height: clamp(520px, 52vw, 680px);
    overflow: hidden !important;
    background: #080808;
    isolation: isolate;
  }
  
  
  /* =========================================================
     PARALLAX BILD
     ========================================================= */
  
  .showcase .showcase-bg {
    position: absolute !important;
  
    /*
      Das Bild ist größer als der sichtbare Bereich.
      Dadurch kann es beim Scrollen hoch/runter fahren.
    */
    top: -18%;
    left: 0;
  
    width: 100%;
    height: 136%;
  
    z-index: 0 !important;
  
    /*
      WICHTIG:
      KEIN !important bei transform.
      Dein JavaScript verändert --pb.
    */
    transform: translate3d(
      0,
      var(--pb, 0px),
      0
    );
  
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
  
    pointer-events: none;
  }
  
  
  .showcase .showcase-bg img {
    display: block !important;
  
    width: 100% !important;
    height: 100% !important;
  
    object-fit: cover !important;
    object-position: center center;
  
    opacity: 1 !important;
    visibility: visible !important;
  
    filter:
      brightness(.58)
      contrast(1.04);
  
    transform: scale(1.03);
  }
  
  
  /* =========================================================
     ALTES ::BEFORE BILD DEAKTIVIEREN
     ========================================================= */
  
  .showcase::before {
    display: none !important;
  }
  
  
  /* =========================================================
     DUNKLER VERLAUF
     ========================================================= */
  
  .showcase::after {
    content: "";
  
    position: absolute;
    inset: 0;
  
    z-index: 1 !important;
  
    pointer-events: none;
  
    background:
      linear-gradient(
        90deg,
        rgba(0,0,0,.62) 0%,
        rgba(0,0,0,.38) 42%,
        rgba(0,0,0,.12) 75%,
        rgba(0,0,0,.05) 100%
      ),
      linear-gradient(
        0deg,
        rgba(0,0,0,.42) 0%,
        rgba(0,0,0,.08) 60%,
        rgba(0,0,0,.10) 100%
      );
  }
  
  
  /* =========================================================
     OVERLAY
     ========================================================= */
  
  .showcase .showcase-overlay {
    position: relative !important;
  
    z-index: 10 !important;
  
    width: 100% !important;
    height: 100% !important;
  
    box-sizing: border-box;
  
    display: flex !important;
  
    align-items: center !important;
    justify-content: center !important;
  
    padding:
      40px
      clamp(35px, 6vw, 95px) !important;
  }
  
  
  /* =========================================================
     TEXTBLOCK
     ========================================================= */
  
  .showcase .showcase-content {
    position: relative !important;
  
    z-index: 20 !important;
  
    display: block !important;
  
    width: min(1180px, 92%) !important;
    max-width: 1180px !important;
  
    margin: 0 auto !important;
    padding: 0 !important;
  
    text-align: left !important;
  
    color: #f3ede4 !important;
  
    /*
      Direkt sichtbar.
      Dadurch funktioniert es auch auf Unterseiten,
      auf denen kein eigenes Reveal-Script läuft.
    */
    opacity: 1 !important;
    visibility: visible !important;
  
    transform: translateY(15px);
  }
  
  
  /* =========================================================
     KLEINE ZEILE
     ========================================================= */
  
  .showcase .showcase-kicker {
    display: block !important;
  
    margin: 0 0 22px !important;
    padding: 0 !important;
  
    font-family:
      Arial,
      Helvetica,
      sans-serif !important;
  
    font-size: 10px !important;
    font-weight: 500 !important;
  
    line-height: 1.4 !important;
  
    letter-spacing: .30em !important;
  
    text-transform: uppercase;
  
    color:
      rgba(243,237,228,.78) !important;
  
    opacity: 1 !important;
    visibility: visible !important;
  }
  
  
  /* =========================================================
     GROSSE SCHRIFT
     ========================================================= */
  
  .showcase .showcase-content h3 {
    display: block !important;
  
    margin: 0 0 36px !important;
    padding: 0 !important;
  
    max-width: 1100px;
  
    font-family:
      Georgia,
      "Times New Roman",
      serif !important;
  
    font-size:
      clamp(45px, 5.3vw, 78px) !important;
  
    font-style: normal !important;
    font-weight: 400 !important;
  
    letter-spacing:
      -.045em !important;
  
    line-height:
      .98 !important;
  
    color:
      #f3ede4 !important;
  
    opacity: 1 !important;
    visibility: visible !important;
  
    text-shadow:
      0 4px 25px
      rgba(0,0,0,.32) !important;
  }
  
  
  .showcase .showcase-content h3 em {
    font-family:
      Georgia,
      "Times New Roman",
      serif !important;
  
    font-style: italic !important;
    font-weight: 400 !important;
  
    color:
      #b3ac91 !important;
  }
  
  
  /* =========================================================
     TERMIN BUTTON
     ========================================================= */
  
  .showcase .showcase-btn {
    position: relative !important;
  
    z-index: 25 !important;
  
    display: inline-flex !important;
  
    align-items: center !important;
    justify-content: space-between !important;
  
    gap: 42px !important;
  
    min-width: 220px !important;
  
    padding:
      17px 22px !important;
  
    box-sizing: border-box;
  
    border:
      1px solid
      rgba(243,237,228,.68) !important;
  
    border-radius: 0 !important;
  
    background:
      rgba(0,0,0,.08) !important;
  
    color:
      #f3ede4 !important;
  
    text-decoration:
      none !important;
  
    opacity: 1 !important;
    visibility: visible !important;
  
    transition:
      background .35s ease,
      color .35s ease,
      transform .35s ease,
      border-color .35s ease !important;
  }
  
  
  .showcase .showcase-btn-text {
    display: inline-block !important;
  
    font-family:
      Arial,
      Helvetica,
      sans-serif !important;
  
    font-size:
      10px !important;
  
    font-weight:
      600 !important;
  
    line-height:
      1 !important;
  
    letter-spacing:
      .23em !important;
  
    color:
      inherit !important;
  }
  
  
  .showcase .showcase-arrow {
    display: inline-block !important;
  
    font-family:
      Arial,
      Helvetica,
      sans-serif !important;
  
    font-size:
      18px !important;
  
    line-height:
      1 !important;
  
    color:
      inherit !important;
  
    transition:
      transform .35s ease;
  }
  
  
  .showcase .showcase-btn:hover {
    background:
      #f3ede4 !important;
  
    color:
      #080808 !important;
  
    border-color:
      #f3ede4 !important;
  
    transform:
      translateY(-3px) !important;
  }
  
  
  .showcase .showcase-btn:hover
  .showcase-arrow {
    transform:
      translate(3px,-3px);
  }
  
  
  /* =========================================================
     TELEFONHÖRER
     ========================================================= */
  
  .showcase .phone-fab {
    position: absolute !important;
  
    top:
      clamp(28px,4vw,55px) !important;
  
    right:
      clamp(28px,5vw,70px) !important;
  
    left: auto !important;
    bottom: auto !important;
  
    z-index:
      30 !important;
  
    width:
      68px !important;
  
    height:
      68px !important;
  
    margin: 0 !important;
    padding: 0 !important;
  
    display:
      flex !important;
  
    align-items:
      center !important;
  
    justify-content:
      center !important;
  
    border:
      1px solid
      rgba(243,237,228,.65) !important;
  
    border-radius:
      50% !important;
  
    background:
      rgba(0,0,0,.14) !important;
  
    color:
      #f3ede4 !important;
  
    text-decoration:
      none !important;
  
    opacity: 1 !important;
    visibility: visible !important;
  
    backdrop-filter:
      blur(6px);
  
    -webkit-backdrop-filter:
      blur(6px);
  
    box-shadow:
      none !important;
  
    transition:
      background .3s ease,
      color .3s ease,
      transform .3s ease,
      border-color .3s ease !important;
  }
  
  
  /* =========================================================
     MODERNER HÖRER
     ========================================================= */
  
  .showcase .phone-fab svg {
    display: block !important;
  
    width:
      23px !important;
  
    height:
      23px !important;
  
    fill:
      currentColor !important;
  
    color:
      inherit !important;
  
    transform:
      rotate(3deg);
  
    transition:
      transform .3s ease;
  }
  
  
  .showcase .phone-fab:hover {
    background:
      #f3ede4 !important;
  
    color:
      #080808 !important;
  
    border-color:
      #f3ede4 !important;
  
    transform:
      scale(1.06) !important;
  }
  
  
  .showcase .phone-fab:hover svg {
    transform:
      rotate(8deg)
      scale(1.04);
  }
  
  
  /* =========================================================
     PARALLAX
     WICHTIG: KEIN !important
     ========================================================= */
  
  .showcase.parallax .showcase-bg {
    transform: translate3d(
      0,
      var(--pb, 0px),
      0
    );
  }
  
  
  /* =========================================================
     MOBILE
     ========================================================= */
  
  @media (max-width: 700px) {
  
    .showcase {
      height:
        570px !important;
    }
  
  
    .showcase .showcase-bg {
      top:
        -14%;
  
      height:
        128%;
    }
  
  
    .showcase .showcase-bg img {
      object-position:
        center center !important;
    }
  
  
    .showcase .showcase-overlay {
      padding:
        40px 22px !important;
    }
  
  
    .showcase .showcase-content {
      width:
        100% !important;
  
      transform:
        translateY(10px);
    }
  
  
    .showcase .showcase-kicker {
      margin-bottom:
        17px !important;
  
      font-size:
        9px !important;
  
      letter-spacing:
        .24em !important;
    }
  
  
    .showcase .showcase-content h3 {
      margin-bottom:
        28px !important;
  
      font-size:
        clamp(38px,10vw,54px) !important;
  
      line-height:
        1 !important;
    }
  
  
    .showcase .showcase-btn {
      min-width:
        205px !important;
  
      padding:
        15px 18px !important;
  
      gap:
        30px !important;
    }
  
  
    .showcase .phone-fab {
      width:
        55px !important;
  
      height:
        55px !important;
  
      top:
        22px !important;
  
      right:
        22px !important;
    }
  
  
    .showcase .phone-fab svg {
      width:
        20px !important;
  
      height:
        20px !important;
    }
  
  }
  
  
  /* =========================================================
     REDUCED MOTION
     ========================================================= */
  
  @media (prefers-reduced-motion: reduce) {
  
    .showcase .showcase-bg {
      transform:
        none !important;
    }
  
  
    .showcase .showcase-btn,
    .showcase .phone-fab {
      transition:
        none !important;
    }
  
  }