:root{
  --ink:#070605;
  --ink-soft:#0d0b09;
  --gold:#c9952b;
  --gold-light:#dfb65c;
  --paper:#f2ede4;
  --muted:#cfc4b5;
  --rail:72px;
  --header:62px;
}
*{box-sizing:border-box}
html{background:var(--ink)}
body{margin:0;background:var(--ink);color:var(--paper);font-family:Georgia,"Times New Roman",serif;min-width:320px}
button{font:inherit}
.site-shell{min-height:100vh;background:var(--ink)}
.house-rail{
  position:fixed;z-index:80;inset:0 auto 0 0;width:var(--rail);
  border-right:1px solid rgba(201,149,43,.55);
  background:#050504;display:flex;flex-direction:column;align-items:center
}
.rail-mark{height:96px;padding-top:14px;font-size:52px;line-height:1;color:white;font-weight:100}
.rail-title{
  flex:1;display:flex;align-items:center;justify-content:center;
  writing-mode:vertical-rl;text-orientation:mixed;color:var(--gold);
  letter-spacing:.13em;font-size:17px
}
.rail-tools{display:flex;flex-direction:column;width:100%;padding-bottom:12px}
.rail-tools button{
  min-height:58px;border:0;background:transparent;color:var(--gold);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer
}
.rail-tools button span{font:8px Arial,sans-serif;text-transform:uppercase;letter-spacing:.08em}
.house-header{
  position:fixed;z-index:70;top:0;left:var(--rail);right:0;height:var(--header);
  display:flex;align-items:center;gap:24px;padding:0 22px;
  background:rgba(5,5,4,.94);border-bottom:1px solid rgba(201,149,43,.25);
  backdrop-filter:blur(12px)
}
.consultation-button{
  flex:0 0 auto;border:1px solid rgba(201,149,43,.75);background:transparent;color:white;
  padding:10px 18px;text-transform:uppercase;font-size:12px;cursor:pointer
}
.primary-nav{display:flex;align-items:center;justify-content:space-between;gap:18px;width:100%}
.primary-nav button{
  position:relative;border:0;background:transparent;color:white;text-transform:uppercase;
  font-size:11px;white-space:nowrap;cursor:pointer;padding:21px 0
}
.primary-nav button.is-current::after{
  content:"";position:absolute;left:0;right:0;bottom:12px;height:1px;background:var(--gold)
}
.header-mark{font-size:36px;line-height:1}
.pages{margin-left:var(--rail);padding-top:var(--header)}
.page{display:none;position:relative;min-height:calc(100vh - var(--header))}
.page.is-active{display:block}
.atelier-page{overflow:hidden;background:#080706}
.atelier-hero{position:absolute;inset:0;min-height:1040px;overflow:hidden}
.atelier-hero img{
  position:absolute;right:0;top:0;width:68%;height:100%;object-fit:cover;object-position:51% 26%;
  filter:none;transform:none
}
.hero-shade{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,#080706 0%,#080706 25%,rgba(8,7,6,.88) 38%,rgba(8,7,6,.15) 62%,rgba(8,7,6,.05) 100%),
    linear-gradient(0deg,#080706 0%,transparent 22%)
}
.atelier-content{
  position:relative;z-index:2;width:min(690px,52vw);padding:48px 0 54px 54px;min-height:1040px
}
.architectural-return{
  border:0;background:transparent;color:var(--gold);text-transform:uppercase;font-size:12px;
  letter-spacing:.05em;padding:0;margin:0 0 42px;cursor:pointer
}
.eyebrow{margin:0 0 10px;color:var(--gold);text-transform:uppercase;font-size:17px;letter-spacing:.06em}
h1{margin:0;font-size:58px;font-weight:400;line-height:1.08}
.gold-rule{width:320px;height:1px;background:rgba(201,149,43,.7);margin:22px 0}
.atelier-content h2{margin:0;color:var(--gold);font-size:18px;text-transform:uppercase;font-weight:400;letter-spacing:.05em}
.intro{font-size:19px;line-height:1.55;margin:18px 0 48px;color:#eee6da}
.experiences h3,.house-method h3{
  margin:0 0 18px;color:var(--gold);font-size:18px;text-transform:uppercase;font-weight:400
}
.experience-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.experience-card{
  padding:0;border:1px solid rgba(201,149,43,.5);background:rgba(8,7,6,.88);
  color:white;text-align:left;cursor:pointer;min-width:0
}
.experience-card:hover,.experience-card:focus-visible{outline:none;border-color:var(--gold-light);transform:translateY(-2px)}
.experience-card img{display:block;width:100%;aspect-ratio:.83;object-fit:cover}
.card-copy{position:relative;display:flex;min-height:142px;flex-direction:column;padding:14px 12px 12px}
.card-copy strong{text-transform:uppercase;font-size:13px;font-weight:400;white-space:nowrap}
.card-copy em{margin-top:14px;color:#e7ded0;font-size:13px;font-style:normal;line-height:1.55}
.card-copy b{position:absolute;right:12px;bottom:10px;color:var(--gold);font-size:22px;font-weight:400}
.house-method{
  display:grid;grid-template-columns:1fr 190px;gap:24px;margin-top:16px;padding:22px 26px;
  border:1px solid rgba(201,149,43,.5);background:rgba(7,6,5,.92)
}
.house-method h3{margin-bottom:9px}
.method-line{margin:0 0 16px;color:#ece3d6}
.house-method p{font-size:14px;line-height:1.55;margin:0;color:#e1d8ca}
.founder-signature{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.signature-script{font-family:"Brush Script MT",cursive;font-size:35px;transform:rotate(-5deg);margin-bottom:10px}
.founder-signature strong{text-transform:uppercase;font-size:12px;letter-spacing:.08em}
.founder-signature span{text-transform:uppercase;color:#cdbfae;font-size:10px;letter-spacing:.12em;margin-top:4px}
.studio-page{background:#080706;min-height:calc(100vh - var(--header));overflow:auto}
.studio-page>img{display:block;width:100%;height:auto;min-height:calc(100vh - var(--header));object-fit:contain;background:#080706}
.studio-entry{
  position:fixed;z-index:75;right:28px;bottom:28px;padding:13px 18px;border:1px solid var(--gold);
  background:rgba(8,7,6,.92);color:var(--gold-light);text-transform:uppercase;cursor:pointer
}
.experience-page{height:calc(100vh - var(--header));background:#080706;overflow:hidden}
.experience-page>img{display:block;width:100%;height:100%;object-fit:contain;background:#080706}
.experience-controls{
  position:absolute;z-index:6;left:18px;bottom:18px;display:flex;gap:8px
}
.experience-controls button{
  padding:10px 14px;border:1px solid rgba(201,149,43,.6);background:rgba(8,7,6,.9);
  color:var(--gold-light);text-transform:uppercase;font:10px Arial,sans-serif;letter-spacing:.08em;cursor:pointer
}
.house-footer{
  position:relative;z-index:5;margin-left:var(--rail);display:grid;grid-template-columns:repeat(4,1fr);
  gap:0;border-top:1px solid rgba(201,149,43,.4);background:#0a0908
}
.house-footer article{
  min-height:165px;display:grid;grid-template-columns:108px 1fr;gap:18px;padding:20px;
  border-right:1px solid rgba(201,149,43,.15)
}
.footer-image{width:108px;height:125px;border:1px solid rgba(201,149,43,.2);background:#15110c}
.footer-image.amber{background:radial-gradient(circle at 35% 65%,#a45c17 0 7%,transparent 8%),linear-gradient(90deg,#1b120a,#6f3a12,#1b120a)}
.footer-image.cream{background:linear-gradient(90deg,#17120c,#bca87c,#2a1a0d)}
.footer-image.botanical{display:grid;place-items:center;background:#d7c7a6;color:#655033;font-size:55px}
.footer-image.laboratory{background:radial-gradient(circle at 50% 55%,#9c5d1c 0 13%,transparent 14%),linear-gradient(#0e0c09,#302112)}
.house-footer h3{margin:4px 0 13px;color:var(--gold);font-size:13px;text-transform:uppercase;font-weight:400;line-height:1.4}
.house-footer p{font-size:13px;line-height:1.5;color:#d4cabd}
.house-footer button{padding:0;border:0;background:transparent;color:var(--gold);text-transform:uppercase;font-size:11px;cursor:pointer}
.notice{
  position:fixed;z-index:120;left:50%;bottom:22px;transform:translateX(-50%);
  padding:12px 18px;border:1px solid rgba(201,149,43,.65);background:#171008;color:#f0deb6;
  font:11px Arial,sans-serif;letter-spacing:.05em
}
.notice[hidden]{display:none}
@media(max-width:1180px){
  .primary-nav button:nth-of-type(6),.primary-nav button:nth-of-type(7),.primary-nav button:nth-of-type(8){display:none}
  .atelier-content{width:58vw;padding-left:36px}
  .experience-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:820px){
  :root{--rail:0px;--header:58px}
  .house-rail{display:none}
  .house-header{left:0;padding:0 12px}
  .primary-nav button{display:none}
  .primary-nav button.is-current{display:block}
  .header-mark{margin-left:auto}
  .pages{margin-left:0}
  .atelier-page{overflow:visible}
  .atelier-hero{position:relative;min-height:58vh}
  .atelier-hero img{width:100%;height:100%;object-position:50% 22%}
  .hero-shade{background:linear-gradient(0deg,#080706 0%,transparent 55%)}
  .atelier-content{width:auto;min-height:0;padding:28px 18px 38px;margin-top:-70px}
  h1{font-size:42px}.gold-rule{width:220px}
  .architectural-return{margin-bottom:24px}
  .experience-grid{grid-template-columns:repeat(2,1fr)}
  .house-method{grid-template-columns:1fr}
  .house-footer{margin-left:0;grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
  .consultation-button{font-size:10px;padding:9px 11px}
  .experience-grid{grid-template-columns:1fr 1fr}
  .card-copy strong{font-size:11px}.card-copy em{font-size:11px}
  .house-footer{grid-template-columns:1fr}
}

/* =========================================================
   Hair Cuts Atelier Production V1.3 — Native Experience System
   ========================================================= */

/* Landing cards: large, clean, photographic, and free of embedded UI. */
.atelier-content{width:min(1040px,72vw)}
.experience-grid{grid-template-columns:repeat(4,minmax(210px,1fr));gap:18px}
.experience-card{
  min-height:545px;
  border:1px solid rgba(201,149,43,.5);
  background:rgba(8,7,6,.94);
  overflow:hidden;
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease
}
.experience-card:hover,.experience-card:focus-visible{
  transform:translateY(-4px);
  border-color:var(--gold-light);
  box-shadow:0 16px 36px rgba(0,0,0,.4)
}
.experience-card img{
  width:100%;
  min-height:360px;
  aspect-ratio:.8;
  object-fit:cover;
  object-position:center top
}
.card-copy{min-height:176px;padding:18px 16px}
.card-copy strong{font-size:16px}
.card-copy em{font-size:15px;line-height:1.6}
.card-copy b{font-size:26px;right:16px;bottom:14px}
.experience-card.is-selected{border-color:var(--gold-light)}
.house-method{margin-top:24px}

/* Experience page now uses clean photography + native interface. */
.experience-page{
  min-height:calc(100vh - var(--header));
  background:#080706;
  overflow:hidden;
  position:relative
}
.experience-photo{position:absolute;inset:0;overflow:hidden}
.experience-photo img{
  width:100%;height:100%;object-fit:cover;object-position:center center;
  display:block
}
.experience-photo-shade{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(4,4,3,.97) 0%,rgba(4,4,3,.84) 27%,rgba(4,4,3,.24) 58%,rgba(4,4,3,.08) 100%),
    linear-gradient(0deg,rgba(4,4,3,.72) 0%,transparent 34%)
}
.experience-heading{
  position:relative;z-index:3;
  width:min(500px,37vw);
  padding:54px 0 0 52px
}
.experience-return{
  padding:0;border:0;background:transparent;color:var(--gold);
  text-transform:uppercase;font-size:12px;letter-spacing:.05em;cursor:pointer;margin-bottom:42px
}
.experience-heading>p:first-of-type{
  color:var(--gold);text-transform:uppercase;font-size:17px;letter-spacing:.05em;margin:0 0 8px
}
.experience-heading h1{
  font-size:53px;line-height:1.04;margin:0;font-weight:400
}
.experience-heading h2{
  color:var(--gold);font-size:18px;line-height:1.35;text-transform:uppercase;
  font-weight:400;letter-spacing:.04em;margin:0 0 16px
}
.experience-heading>p:last-child{
  font-size:18px;line-height:1.55;color:#ede5da;max-width:430px
}

/* One real close button. No embedded decorative X remains. */
.experience-x{
  position:fixed;z-index:120;right:22px;top:calc(var(--header) + 18px);
  width:52px;height:52px;border:1px solid rgba(201,149,43,.85);
  background:rgba(8,7,6,.94);color:var(--gold-light);
  font-size:34px;line-height:1;display:grid;place-items:center;cursor:pointer
}
.experience-x:hover,.experience-x:focus-visible{
  outline:none;border-color:#f4d184;background:#24180c;color:#fff1c4
}

/* Native editorial panel. */
.experience-panel{
  position:absolute;z-index:4;right:30px;bottom:28px;
  width:min(760px,54vw);
  background:#eee5d8;color:#1d1712;
  border:1px solid #b69255;
  box-shadow:0 22px 60px rgba(0,0,0,.46)
}
.experience-switcher{
  display:grid;grid-template-columns:repeat(4,1fr);
  background:#0b0a08;border-bottom:1px solid rgba(201,149,43,.45)
}
.experience-switcher button{
  padding:15px 10px;border:0;border-right:1px solid rgba(201,149,43,.25);
  background:transparent;color:#d9c8a4;text-transform:uppercase;
  letter-spacing:.07em;font:10px Arial,sans-serif;cursor:pointer
}
.experience-switcher button:last-child{border-right:0}
.experience-switcher button:hover,
.experience-switcher button:focus-visible,
.experience-switcher button.is-current{
  outline:none;background:#20150a;color:#f1cf83
}
.experience-editorial{padding:26px 28px 22px}
.experience-editorial header p{
  color:#956319;text-transform:uppercase;font-size:11px;letter-spacing:.09em;margin:0 0 5px
}
.experience-editorial header h2{
  margin:0;font-size:37px;font-weight:400;line-height:1
}
.experience-editorial header em{
  display:block;color:#9f6333;font-size:18px;margin-top:8px
}
.panel-summary{
  margin:18px 0;padding-bottom:18px;border-bottom:1px solid rgba(149,99,25,.35);
  font-size:15px;line-height:1.5
}
.editorial-columns{
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-bottom:18px
}
.editorial-columns section{
  padding:0 14px;border-right:1px solid rgba(149,99,25,.28)
}
.editorial-columns section:first-child{padding-left:0}
.editorial-columns section:last-child{border-right:0;padding-right:0}
.editorial-columns h3,.consultation-row h3{
  margin:0 0 8px;text-transform:uppercase;font-size:11px;letter-spacing:.04em;font-weight:400
}
.editorial-columns p,.consultation-row p{
  margin:0;font-size:12px;line-height:1.55
}
.consultation-row{
  display:grid;grid-template-columns:1.45fr .75fr;gap:20px;
  padding-top:17px;border-top:1px solid rgba(149,99,25,.35)
}
.consultation-row button{
  margin-top:14px;padding:11px 16px;border:0;background:#0b0a08;color:#eee5d8;
  text-transform:uppercase;font-size:10px;letter-spacing:.06em;cursor:pointer
}
.consultation-row blockquote{
  margin:0;padding-left:17px;border-left:1px solid rgba(149,99,25,.35)
}
.consultation-row blockquote span{
  color:#a46e1f;font-size:34px;line-height:.7
}
.consultation-row blockquote p{
  font-style:italic;font-size:14px;line-height:1.55;margin:4px 0 10px
}
.consultation-row cite{font-style:normal;font-size:11px}
.experience-controls{
  position:absolute;z-index:5;left:52px;bottom:30px;display:flex;gap:8px
}
.experience-controls button{
  padding:11px 15px;border:1px solid rgba(201,149,43,.65);
  background:rgba(8,7,6,.9);color:var(--gold-light);
  text-transform:uppercase;font:10px Arial,sans-serif;letter-spacing:.07em;cursor:pointer
}

@media(max-width:1280px){
  .atelier-content{width:min(850px,72vw)}
  .experience-grid{grid-template-columns:repeat(2,minmax(280px,1fr))}
  .experience-panel{width:min(700px,58vw)}
}
@media(max-width:980px){
  .experience-heading{width:50vw;padding-left:30px}
  .experience-panel{position:relative;right:auto;bottom:auto;width:calc(100% - 40px);margin:320px 20px 30px}
  .experience-page{overflow:auto}
  .experience-controls{position:relative;left:auto;bottom:auto;margin:0 20px 30px}
}
@media(max-width:820px){
  .atelier-content{width:auto}
  .experience-grid{grid-template-columns:1fr 1fr;gap:12px}
  .experience-card{min-height:0}
  .experience-card img{min-height:240px}
  .experience-heading{width:auto;padding:34px 18px 0}
  .experience-heading h1{font-size:42px}
  .experience-panel{margin-top:280px;width:calc(100% - 24px);margin-left:12px;margin-right:12px}
  .experience-switcher{grid-template-columns:1fr 1fr}
  .editorial-columns{grid-template-columns:1fr 1fr;row-gap:18px}
  .editorial-columns section:nth-child(2){border-right:0}
  .consultation-row{grid-template-columns:1fr}
}
@media(max-width:540px){
  .experience-grid{grid-template-columns:1fr}
  .editorial-columns{grid-template-columns:1fr}
  .editorial-columns section{border-right:0;padding:0 0 14px}
}


/* =========================================================
   Hair Cuts Atelier Production V1.4 — Photography refinement
   ========================================================= */

/*
  Preserve the wider approved compositions rather than forcing the images
  to fill the entire viewport. This keeps hair, model, scissors, comb, and
  stylist's hands visible together.
*/
.experience-photo{
  background:
    radial-gradient(circle at 72% 22%,rgba(80,48,20,.24),transparent 38%),
    #080706;
}
.experience-photo img{
  width:72%;
  height:auto;
  max-height:58vh;
  position:absolute;
  top:20px;
  right:0;
  left:auto;
  object-fit:contain;
  object-position:right top;
  filter:brightness(1.08) contrast(1.03);
}

/* Reduce the previous darkness while retaining readable editorial text. */
.experience-photo-shade{
  background:
    linear-gradient(90deg,
      rgba(4,4,3,.98) 0%,
      rgba(4,4,3,.88) 24%,
      rgba(4,4,3,.46) 39%,
      rgba(4,4,3,.08) 59%,
      rgba(4,4,3,0) 100%),
    linear-gradient(0deg,
      rgba(4,4,3,.45) 0%,
      rgba(4,4,3,.05) 34%,
      transparent 60%);
}

/* Give the image more room above the native information panel. */
.experience-panel{
  bottom:24px;
}
.experience-heading{
  width:min(480px,35vw);
  padding-top:48px;
}
.experience-heading>p:last-child{
  max-width:400px;
}

/* Service-specific framing without altering the source photography. */
.experience-page[data-current-experience="long"] .experience-photo img{
  width:70%;
  right:0;
}
.experience-page[data-current-experience="curly"] .experience-photo img{
  width:72%;
  right:0;
}
.experience-page[data-current-experience="shape"] .experience-photo img{
  width:72%;
  right:0;
}
.experience-page[data-current-experience="mens"] .experience-photo img{
  width:72%;
  right:0;
}

@media(max-width:1280px){
  .experience-photo img{
    width:76%;
    max-height:52vh;
  }
}
@media(max-width:980px){
  .experience-photo img{
    width:100%;
    max-height:none;
    height:auto;
    top:0;
    right:0;
  }
  .experience-photo-shade{
    background:
      linear-gradient(90deg,rgba(4,4,3,.92) 0%,rgba(4,4,3,.42) 48%,rgba(4,4,3,.04) 100%),
      linear-gradient(0deg,rgba(4,4,3,.6) 0%,transparent 48%);
  }
}


/* =========================================================
   Hair Cuts Atelier Production V1.5 — Split Editorial Experience
   ========================================================= */

.experience-page{
  min-height:calc(100vh - var(--header));
  background:#070605;
  overflow:auto;
}
.split-stage{
  display:grid;
  grid-template-columns:minmax(510px,1.04fr) minmax(660px,.96fr);
  min-height:calc(100vh - var(--header));
  gap:0;
}
.atelier-reference{
  position:relative;
  overflow:hidden;
  min-height:calc(100vh - var(--header));
  border-right:1px solid rgba(201,149,43,.45);
}
.atelier-reference>img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
}
.atelier-reference-shade{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(5,5,4,.95) 0%,rgba(5,5,4,.72) 40%,rgba(5,5,4,.18) 75%,rgba(5,5,4,.08) 100%),
    linear-gradient(0deg,rgba(5,5,4,.82) 0%,transparent 42%);
}
.atelier-reference-copy{
  position:relative;
  z-index:2;
  padding:58px 34px 34px 40px;
  max-width:670px;
}
.atelier-reference-copy>p:first-child{
  color:var(--gold);
  text-transform:uppercase;
  font-size:16px;
  letter-spacing:.05em;
  margin:0 0 8px;
}
.atelier-reference-copy h1{
  font-size:52px;
  line-height:1.03;
  margin:0;
  font-weight:400;
}
.atelier-reference-copy h2{
  color:var(--gold);
  font-size:17px;
  text-transform:uppercase;
  font-weight:400;
  margin:0 0 16px;
}
.reference-intro{
  font-size:16px;
  line-height:1.55;
  margin:0 0 34px;
}
.atelier-reference-copy h3{
  color:var(--gold);
  text-transform:uppercase;
  font-size:15px;
  font-weight:400;
  margin:0 0 12px;
}
.reference-cards{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}
.reference-cards button{
  border:1px solid rgba(201,149,43,.55);
  background:rgba(8,7,6,.9);
  color:white;
  padding:0;
  cursor:pointer;
}
.reference-cards button.is-current{
  border-color:var(--gold-light);
  box-shadow:0 0 0 1px rgba(223,182,92,.45);
}
.reference-cards img{
  width:100%;
  aspect-ratio:.72;
  object-fit:cover;
  display:block;
}
.reference-cards span{
  display:block;
  min-height:54px;
  padding:12px 7px;
  font-size:11px;
  text-transform:uppercase;
}
.reference-method{
  margin-top:14px;
  border:1px solid rgba(201,149,43,.5);
  background:rgba(8,7,6,.9);
  padding:17px 20px;
}
.reference-method h3{margin-bottom:8px}
.reference-method p{
  margin:0 0 6px;
  font-size:12px;
  line-height:1.5;
}

.service-overlay{
  position:relative;
  margin:20px 20px 20px 0;
  border:1px solid rgba(201,149,43,.55);
  background:#0a0908;
  min-height:calc(100vh - var(--header) - 40px);
  box-shadow:0 18px 48px rgba(0,0,0,.45);
  display:flex;
  flex-direction:column;
}
.experience-return{
  align-self:flex-start;
  margin:30px 0 0 32px;
  padding:0;
  border:0;
  background:transparent;
  color:var(--gold);
  text-transform:uppercase;
  font-size:11px;
  letter-spacing:.05em;
  cursor:pointer;
}
.experience-x{
  position:absolute;
  top:18px;
  right:18px;
  width:42px;
  height:42px;
  border:0;
  background:transparent;
  color:white;
  font-size:34px;
  line-height:1;
  cursor:pointer;
  z-index:5;
}
.service-overlay-header{
  padding:18px 34px 18px;
}
.service-overlay-header h1{
  font-size:44px;
  line-height:1;
  margin:0;
  font-weight:400;
}
.service-overlay-header em{
  display:block;
  margin-top:8px;
  color:var(--gold);
  font-size:18px;
}
.service-overlay-body{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(230px,.72fr);
  min-height:0;
  flex:1;
  border-top:1px solid rgba(201,149,43,.28);
  border-bottom:1px solid rgba(201,149,43,.28);
}
.service-image-wrap{
  min-height:510px;
  background:#0a0908;
  overflow:hidden;
}
.service-image-wrap img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
  filter:brightness(1.08) contrast(1.02);
}
.service-copy{
  padding:28px 26px;
  background:linear-gradient(90deg,#0b0a08,#11100e);
  border-left:1px solid rgba(201,149,43,.28);
}
.service-copy section+section{
  margin-top:22px;
  padding-top:20px;
  border-top:1px solid rgba(201,149,43,.32);
}
.service-copy h3{
  margin:0 0 14px;
  color:var(--gold);
  text-transform:uppercase;
  font-size:14px;
  font-weight:400;
  line-height:1.4;
}
.service-copy p,
.service-copy li{
  font-size:14px;
  line-height:1.6;
  color:#eee6da;
}
.service-copy p{margin:0}
.service-copy ul{
  padding:0;
  margin:0;
  list-style:none;
}
.service-copy li{
  position:relative;
  padding-left:15px;
  margin-bottom:9px;
}
.service-copy li::before{
  content:"•";
  position:absolute;
  left:0;
  color:var(--gold);
}
.service-navigation{
  display:grid;
  grid-template-columns:1fr 100px 1fr;
  align-items:center;
  min-height:88px;
  padding:0 28px;
}
.service-navigation button{
  border:0;
  background:transparent;
  color:white;
  cursor:pointer;
  display:grid;
  grid-template-columns:auto 1fr;
  gap:2px 12px;
  align-items:center;
  text-align:left;
}
.service-navigation button:last-child{
  grid-template-columns:1fr auto;
  text-align:right;
}
.service-navigation button span{
  grid-row:1/3;
  color:var(--gold);
  font-size:28px;
}
.service-navigation button small{
  text-transform:uppercase;
  font-size:10px;
  letter-spacing:.06em;
  color:#bfb4a5;
}
.service-navigation button strong{
  font-size:14px;
  font-weight:400;
}
.service-count{
  text-align:center;
  color:var(--gold);
}
.grid-mark{
  display:block;
  font-size:24px;
  margin-bottom:5px;
}
.service-count strong{
  font-size:12px;
  font-weight:400;
}

@media(max-width:1280px){
  .split-stage{grid-template-columns:1fr}
  .atelier-reference{
    min-height:760px;
    border-right:0;
    border-bottom:1px solid rgba(201,149,43,.45);
  }
  .service-overlay{
    margin:20px;
    min-height:820px;
  }
}
@media(max-width:820px){
  .reference-cards{grid-template-columns:repeat(2,1fr)}
  .service-overlay-body{grid-template-columns:1fr}
  .service-copy{border-left:0;border-top:1px solid rgba(201,149,43,.28)}
  .service-image-wrap{min-height:420px}
}
@media(max-width:520px){
  .atelier-reference-copy{padding:36px 18px}
  .atelier-reference-copy h1{font-size:42px}
  .service-overlay{margin:10px}
  .service-overlay-header{padding:18px}
  .experience-return{margin-left:18px}
  .service-navigation{grid-template-columns:1fr 70px 1fr;padding:0 12px}
}


/* =========================================================
   Hair Cuts Atelier Production V1.6 — Asset & Navigation Repair
   ========================================================= */

/* Canonical protected House logo replaces all placeholder glyphs. */
.rail-mark{
  height:100px;
  width:100%;
  padding:12px 20px 8px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.rail-mark img{
  display:block;
  width:28px;
  height:72px;
  object-fit:contain;
}
.header-mark{
  width:34px;
  height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}
.header-mark img{
  display:block;
  width:18px;
  height:42px;
  object-fit:contain;
}
.house-header{
  border-bottom-color:rgba(201,149,43,.42);
}
.house-rail{
  border-right-color:rgba(201,149,43,.68);
}

/* Landing cards: image-led, shorter boxes, less empty text area. */
.experience-grid{
  grid-template-columns:repeat(4,minmax(190px,1fr));
  gap:14px;
}
.experience-card{
  min-height:0;
}
.experience-card img{
  min-height:0;
  aspect-ratio:.80;
  height:auto;
  object-fit:cover;
  object-position:center top;
}
.card-copy{
  min-height:116px;
  padding:12px 13px 10px;
}
.card-copy strong{
  font-size:13px;
}
.card-copy em{
  margin-top:8px;
  font-size:12px;
  line-height:1.45;
}
.card-copy b{
  right:12px;
  bottom:8px;
  font-size:20px;
}

/* Left-side reference cards in the split experience. */
.reference-cards{
  gap:8px;
}
.reference-cards button{
  min-height:0;
}
.reference-cards img{
  aspect-ratio:.80;
  object-fit:cover;
  object-position:center top;
}
.reference-cards span{
  min-height:42px;
  padding:9px 5px;
  font-size:10px;
}

/*
  Critical image repair:
  show the full approved wide composition rather than cropping it to fill
  a tall box. The black frame becomes intentional negative space.
*/
.service-overlay-body{
  grid-template-columns:minmax(0,1.75fr) minmax(220px,.62fr);
}
.service-image-wrap{
  min-height:470px;
  background:#070605;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:10px;
}
.service-image-wrap img{
  width:100%;
  height:100%;
  max-height:500px;
  object-fit:contain;
  object-position:center center;
  filter:none;
  background:#070605;
}

/* Give the photography more visual width and reduce editorial compression. */
.service-copy{
  padding:24px 22px;
}
.service-copy p,
.service-copy li{
  font-size:13px;
  line-height:1.55;
}

/* Keep the complete Atelier hero visible on the left without excessive crop. */
.atelier-reference>img{
  object-fit:cover;
  object-position:52% 16%;
}
.atelier-reference-copy{
  max-width:690px;
}

/* House navigation remains persistent and visually consistent. */
.primary-nav{
  gap:14px;
}
.primary-nav button{
  font-size:10px;
}
.consultation-button{
  border-color:rgba(201,149,43,.85);
}

/* Tablet behavior maintains full image composition. */
@media(max-width:1280px){
  .experience-grid{
    grid-template-columns:repeat(4,minmax(145px,1fr));
  }
  .service-image-wrap{
    min-height:420px;
  }
  .service-image-wrap img{
    max-height:440px;
  }
}
@media(max-width:980px){
  .experience-grid{
    grid-template-columns:repeat(2,minmax(220px,1fr));
  }
  .service-overlay-body{
    grid-template-columns:1fr;
  }
  .service-image-wrap{
    min-height:360px;
  }
  .service-image-wrap img{
    max-height:380px;
  }
}

/* Studio A Recovery Master — protected hero + one canonical Atelier bar */
body.studio-open .house-rail,
body.studio-open .house-header{display:none!important}
.studio-page{
  position:fixed!important;
  inset:0!important;
  min-height:100vh!important;
  overflow:hidden!important;
  background:#080706!important;
}
.studio-page>img{
  position:absolute;
  inset:0 0 172px 0;
  width:100%!important;
  height:calc(100% - 172px)!important;
  min-height:0!important;
  object-fit:cover!important;
  object-position:center top!important;
}
.atelier-lower-bar{
  position:absolute;
  z-index:20;
  left:0;
  right:0;
  bottom:0;
  height:172px;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  background:linear-gradient(180deg,#171109 0%,#0d0a07 100%);
  border-top:1px solid rgba(199,162,91,.56);
  box-shadow:0 -22px 50px rgba(0,0,0,.34);
}
.atelier-lower-bar button{
  display:grid;
  grid-template-columns:128px minmax(0,1fr);
  align-items:center;
  gap:18px;
  min-width:0;
  padding:14px 20px;
  border:0;
  border-right:1px solid rgba(199,162,91,.22);
  background:transparent;
  color:#f1e7d7;
  text-align:left;
  cursor:pointer;
}
.atelier-lower-bar button:last-child{border-right:0}
.atelier-lower-bar button:hover,
.atelier-lower-bar button:focus-visible{outline:none;background:linear-gradient(135deg,rgba(199,162,91,.14),rgba(199,162,91,.02))}
.atelier-lower-bar img{width:122px;height:142px;object-fit:cover;border:1px solid rgba(199,162,91,.34)}
.atelier-lower-bar span{display:flex;min-width:0;flex-direction:column}
.atelier-lower-bar small{color:var(--gold);font:9px Arial,sans-serif;letter-spacing:.17em;text-transform:uppercase}
.atelier-lower-bar strong{margin:8px 0 14px;font-size:23px;font-weight:400;line-height:1.05}
.atelier-lower-bar em{color:#d0ad68;font:9px Arial,sans-serif;letter-spacing:.11em;text-transform:uppercase;font-style:normal}
@media(max-width:980px){
  .studio-page>img{bottom:280px;height:calc(100% - 280px)!important}
  .atelier-lower-bar{height:280px;grid-template-columns:1fr 1fr}
  .atelier-lower-bar button{grid-template-columns:92px 1fr;padding:12px 14px}
  .atelier-lower-bar img{width:88px;height:112px}
}

/* Hair Cuts Experience Image Refinement — 2026-07-22
   Fill the large image field and crop closer to the model.
   No Studio A, landing page, navigation, or card changes. */
.experience-overlay__image{
  overflow:hidden;
  background:#090807;
}
.experience-overlay__image img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 32%;
  transform:scale(1.13);
  transform-origin:center center;
}

/* Individual focal calibration for the four approved images. */
.experience-overlay__image img[src*="long-layers"]{
  object-position:center 28%;
  transform:scale(1.16);
}
.experience-overlay__image img[src*="curly"]{
  object-position:center 30%;
  transform:scale(1.17);
}
.experience-overlay__image img[src*="shape-texture"]{
  object-position:center 29%;
  transform:scale(1.15);
}
.experience-overlay__image img[src*="mens"]{
  object-position:center 27%;
  transform:scale(1.16);
}

@media(max-width:900px){
  .experience-overlay__image{
    min-height:52vh;
  }
  .experience-overlay__image img{
    height:100%;
    aspect-ratio:auto;
    object-fit:cover;
  }
}


/* =========================================================
   Extensions Atelier Production Build — 2026-07-22
   Uses the existing Atelier and split editorial folio system.
   Approved photography is displayed without reinterpretation.
   ========================================================= */

.extensions-page .atelier-hero img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
}
.extensions-page .hero-shade{
  background:
    linear-gradient(90deg,#080706 0%,rgba(8,7,6,.96) 23%,rgba(8,7,6,.72) 40%,rgba(8,7,6,.16) 66%,rgba(8,7,6,.05) 100%),
    linear-gradient(0deg,#080706 0%,transparent 25%);
}
.extensions-content{
  width:min(1120px,74vw);
}
.extensions-grid{
  grid-template-columns:repeat(5,minmax(160px,1fr));
}
.extensions-grid .experience-card img{
  aspect-ratio:.90;
  object-fit:cover;
  object-position:center center;
}
.pending-card{
  cursor:default;
  opacity:.72;
}
.pending-card:hover{
  transform:none;
  border-color:rgba(201,149,43,.5);
  box-shadow:none;
}
.pending-image{
  aspect-ratio:.90;
  display:grid;
  place-items:center;
  background:
    linear-gradient(145deg,rgba(201,149,43,.12),rgba(8,7,6,.82)),
    #0b0907;
  border-bottom:1px solid rgba(201,149,43,.28);
}
.pending-image span{
  color:rgba(223,182,92,.58);
  font-size:38px;
  font-weight:400;
}
.extensions-reference>img{
  object-position:center center;
}
.extension-reference-cards{
  grid-template-columns:repeat(5,1fr);
}
.extension-reference-cards .is-pending{
  min-height:145px;
  opacity:.55;
  cursor:default;
  display:flex;
  align-items:end;
}
.extension-reference-cards .is-pending span{
  width:100%;
}
.extension-image-wrap{
  padding:0;
  min-height:520px;
}
.extension-image-wrap img{
  width:100%;
  height:100%;
  max-height:none;
  object-fit:cover;
  object-position:center center;
  background:#070605;
}
.extension-experience-page[data-current-extension="volume"] .extension-image-wrap img{
  object-position:center center;
}
.extension-experience-page[data-current-extension="length"] .extension-image-wrap img{
  object-position:center center;
}

@media(max-width:1280px){
  .extensions-grid{grid-template-columns:repeat(3,minmax(190px,1fr))}
  .extension-reference-cards{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:820px){
  .extensions-grid{grid-template-columns:repeat(2,1fr)}
  .extension-reference-cards{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){
  .extensions-grid{grid-template-columns:1fr}
  .extension-reference-cards{grid-template-columns:1fr 1fr}
}

.extension-experience-page[data-current-extension="density"] .extension-image-wrap img{
  object-position:center center;
}


/* Editorial Atelier — inherits the locked Studio A Atelier system */
.editorial-hero img,
.editorial-reference > img{
  object-position: center 18%;
}
.editorial-page .intro{
  max-width: 42rem;
}
.editorial-grid .experience-card img{
  object-position: center 18%;
}
.editorial-reference-cards button img{
  object-position: center 16%;
}
.editorial-image-wrap img{
  object-fit: cover;
  object-position: center 16%;
}
.editorial-service-overlay{
  animation: folioSlideOpen .62s cubic-bezier(.22,.78,.18,1) both;
}
@keyframes folioSlideOpen{
  from{opacity:0;transform:translateX(3.5rem)}
  to{opacity:1;transform:translateX(0)}
}


/* =========================================================
   The Treatment Production Master — 2026-07-22
   Exact approved master artwork. No generative reinterpretation.
   ========================================================= */
body.treatment-open .house-rail,
body.treatment-open .house-header{display:none!important}
.treatment-page{
  position:fixed!important;
  inset:0!important;
  min-height:100vh!important;
  overflow:hidden!important;
  background:#050504!important;
}
.treatment-page>img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
  background:#050504;
}
.treatment-return{
  position:absolute;
  z-index:30;
  left:84px;
  bottom:18px;
  border:1px solid rgba(201,149,43,.72);
  background:rgba(5,5,4,.92);
  color:#dfb65c;
  padding:10px 14px;
  text-transform:uppercase;
  font:10px Arial,sans-serif;
  letter-spacing:.08em;
  cursor:pointer;
  opacity:0;
  transition:opacity .2s ease;
}
.treatment-page:hover .treatment-return,
.treatment-return:focus-visible{opacity:1}

/* Production Build 1.2.1 — clickable Treatment route over the locked Studio A master.
   The button is transparent and sits over the baked-in “THE TREATMENT” navigation label;
   no approved artwork is altered. */
.studio-treatment-hotspot{
  position:absolute;
  z-index:35;
  top:0;
  left:52.2%;
  width:10.8%;
  height:6.2%;
  min-width:118px;
  border:0;
  padding:0;
  background:transparent;
  color:transparent;
  cursor:pointer;
  overflow:hidden;
  text-indent:-9999px;
}
.studio-treatment-hotspot:focus-visible{
  outline:1px solid rgba(201,149,43,.9);
  outline-offset:-3px;
}
@media(max-width:980px){
  .studio-treatment-hotspot{left:50%;width:14%;height:7%;}
}

/* =========================================================
   Production Build 1.3 — Complete Treatment Suite
   Approved page masters are displayed intact; navigation is additive.
   ========================================================= */
body.treatment-open .pages{margin:0!important;padding:0!important}
.treatment-discipline-page{
  position:fixed!important;
  inset:0!important;
  min-height:100vh!important;
  overflow:auto!important;
  background:#030303!important;
  scroll-behavior:smooth;
}
.treatment-discipline-page>img{
  display:block;
  width:100%;
  height:auto;
  min-height:100vh;
  object-fit:contain;
  object-position:top center;
  margin:0 auto;
  background:#030303;
}
.treatment-discipline-nav{
  position:absolute;
  z-index:40;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  display:flex;
  border:1px solid rgba(190,138,28,.62);
  background:rgba(3,3,3,.9);
  backdrop-filter:blur(10px);
  opacity:.2;
  transition:opacity .25s ease;
}
.treatment-page:hover .treatment-discipline-nav,
.treatment-discipline-nav:focus-within{opacity:1}
.treatment-discipline-nav button{
  min-width:150px;
  border:0;
  border-right:1px solid rgba(190,138,28,.35);
  background:transparent;
  color:#ddd2be;
  padding:10px 14px;
  cursor:pointer;
  text-align:left;
  text-transform:uppercase;
}
.treatment-discipline-nav button:last-child{border-right:0}
.treatment-discipline-nav small{display:block;color:#c99527;font:20px Georgia,serif}
.treatment-discipline-nav span{font:10px Arial,sans-serif;letter-spacing:.08em}
.treatment-suite-controls{
  display:none;
  position:fixed;
  z-index:100;
  right:18px;
  bottom:18px;
  align-items:center;
  gap:1px;
  border:1px solid rgba(190,138,28,.58);
  background:rgba(2,2,2,.92);
  backdrop-filter:blur(10px);
  opacity:.18;
  transition:opacity .25s ease;
}
body.treatment-open .treatment-suite-controls{display:flex}
.treatment-suite-controls:hover,
.treatment-suite-controls:focus-within{opacity:1}
.treatment-suite-controls button,
.treatment-suite-controls span{
  border:0;
  border-right:1px solid rgba(190,138,28,.3);
  background:transparent;
  color:#d8b05a;
  padding:10px 12px;
  text-transform:uppercase;
  font:10px Arial,sans-serif;
  letter-spacing:.08em;
}
.treatment-suite-controls button{cursor:pointer}
.treatment-suite-controls span{color:#eee0c4;min-width:145px;text-align:center}
.treatment-suite-controls>*:last-child{border-right:0}
@media(max-width:900px){
  .treatment-discipline-nav{left:10px;right:10px;transform:none;overflow-x:auto}
  .treatment-discipline-nav button{min-width:125px}
  .treatment-suite-controls{left:8px;right:8px;bottom:8px;justify-content:center}
  .treatment-suite-controls span{min-width:0;flex:1}
}


/* =========================================================
   Production Build 1.3.1 — Treatment operational tabs + slider
   Transparent controls preserve the approved master artwork.
   ========================================================= */
.treatment-master-hotspots{
  position:absolute;z-index:70;left:4.72%;right:1.52%;bottom:0;height:9.05%;
  display:grid;grid-template-columns:repeat(6,1fr);margin:0;padding:0;
}
.treatment-master-hotspots button,
.treatment-discipline-hotspots button,
.treatment-close-hotspot{
  border:0;background:transparent;color:transparent;cursor:pointer;padding:0;
}
.treatment-master-hotspots button:focus-visible,
.treatment-discipline-hotspots button:focus-visible,
.treatment-close-hotspot:focus-visible{
  outline:1px solid rgba(218,166,49,.95);outline-offset:-3px;
}
.treatment-discipline-page{z-index:80;will-change:transform,opacity;}
.treatment-discipline-page.is-active{
  display:block;animation:treatmentSlideIn .58s cubic-bezier(.22,.78,.18,1) both;
}
.treatment-discipline-page.is-sliding-in{transform:translateX(100%);opacity:.98;}
.treatment-discipline-page.is-sliding-out{
  display:block!important;animation:treatmentSlideOut .54s cubic-bezier(.55,.08,.52,.95) both;
}
@keyframes treatmentSlideIn{from{transform:translateX(100%);opacity:.96}to{transform:translateX(0);opacity:1}}
@keyframes treatmentSlideOut{from{transform:translateX(0);opacity:1}to{transform:translateX(100%);opacity:.96}}
.treatment-close-hotspot{
  position:fixed;z-index:120;right:1.1%;top:1.2%;width:8.5%;height:5.2%;min-width:74px;
}
.treatment-discipline-hotspots{
  position:fixed;z-index:115;left:0;right:0;bottom:0;height:6.75%;
  display:grid;grid-template-columns:1.05fr repeat(6,1fr);margin:0;padding:0;
}
/* The artwork already contains its navigation; hide the temporary control bar. */
.treatment-discipline-nav,.treatment-suite-controls{display:none!important;}
@media(max-width:900px){
  .treatment-master-hotspots{left:4.5%;right:1.2%;height:10%;}
  .treatment-discipline-hotspots{height:8%;}
  .treatment-close-hotspot{width:14%;height:7%;}
}

/* =========================================================
   Recovery 2.2 — Operational House navigation in The Treatment
   The approved master artwork remains untouched. Transparent HTML
   hotspots align to its baked-in top navigation and left exit arrow.
   ========================================================= */
.treatment-house-hotspots{
  display:none;
  position:fixed;
  z-index:210;
  top:0;
  left:4.72%;
  right:1.5%;
  height:5.9%;
  grid-template-columns:10.8% 8.5% 8.4% 13.1% 9.6% 4.8% 11.6% 13.2% 10.1% 6.8% 8.1%;
  margin:0;
  padding:0;
  pointer-events:none;
}
body.treatment-open .treatment-house-hotspots{display:grid;}
.treatment-house-hotspots a,
.treatment-house-hotspots span{
  display:block;
  min-width:0;
  border:0;
  background:transparent;
  pointer-events:auto;
}
.treatment-house-hotspots a{cursor:pointer;}
.treatment-house-hotspots a:focus-visible{
  outline:1px solid rgba(218,166,49,.95);
  outline-offset:-3px;
  background:rgba(201,149,43,.08);
}
.treatment-rail-exit{
  display:none;
  position:fixed;
  z-index:210;
  left:0;
  bottom:0;
  width:4.72%;
  height:11.5%;
  min-width:44px;
  background:transparent;
}
body.treatment-open .treatment-rail-exit{display:block;}
.treatment-rail-exit:focus-visible{
  outline:1px solid rgba(218,166,49,.95);
  outline-offset:-3px;
  background:rgba(201,149,43,.08);
}
@media(max-width:900px){
  .treatment-house-hotspots{left:4.4%;right:1%;height:7.2%;}
  .treatment-rail-exit{width:5.5%;height:13%;}
}


/* =========================================================
   Recovery 2.3 — deterministic Treatment routing
   A restrained live navigation layer remains available over every
   discipline master. It prevents dead ends without altering artwork.
   ========================================================= */
.treatment-house-hotspots button{
  display:block;min-width:0;border:0;background:transparent;
  pointer-events:auto;cursor:pointer;padding:0;
}
.treatment-house-hotspots button:focus-visible{
  outline:1px solid rgba(218,166,49,.95);outline-offset:-3px;
  background:rgba(201,149,43,.08);
}
.treatment-recovery-nav{
  display:none;position:fixed;z-index:260;top:8px;left:50%;
  transform:translateX(-50%);align-items:center;white-space:nowrap;
  border:1px solid rgba(190,138,28,.48);background:rgba(3,3,3,.86);
  backdrop-filter:blur(10px);opacity:.18;transition:opacity .22s ease;
}
body.treatment-open .treatment-recovery-nav{display:flex;}
.treatment-recovery-nav:hover,.treatment-recovery-nav:focus-within{opacity:1;}
.treatment-recovery-nav a,.treatment-recovery-nav button{
  border:0;border-right:1px solid rgba(190,138,28,.26);background:transparent;
  color:#d8b05a;text-decoration:none;padding:9px 11px;cursor:pointer;
  text-transform:uppercase;font:9px Arial,sans-serif;letter-spacing:.08em;
}
.treatment-recovery-nav>*:last-child{border-right:0;}
.treatment-recovery-nav a:focus-visible,.treatment-recovery-nav button:focus-visible{
  outline:1px solid rgba(218,166,49,.95);outline-offset:-3px;
}
@media(max-width:900px){
  .treatment-recovery-nav{left:8px;right:8px;transform:none;overflow-x:auto;justify-content:flex-start;}
  .treatment-recovery-nav a,.treatment-recovery-nav button{padding:9px 10px;}
}


/* =========================================================
   Production 2.5 — Universal House Overlay Engine
   One persistent overlay-control language for Studio and Treatment.
   The protected Treatment artwork remains unchanged beneath it.
   ========================================================= */
.house-overlay-chrome{
  display:none;
  position:fixed;
  inset:0;
  z-index:420;
  pointer-events:none;
}
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-overlay-chrome{
  display:block;
}
.house-overlay-close{
  position:absolute;
  top:18px;
  right:18px;
  width:44px;
  height:44px;
  border:1px solid rgba(201,149,43,.78);
  background:rgba(7,6,5,.92);
  color:#fff;
  font:34px/1 Georgia,serif;
  cursor:pointer;
  pointer-events:auto;
  display:grid;
  place-items:center;
  padding:0 0 4px;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.house-overlay-close:hover,
.house-overlay-close:focus-visible{
  background:#c9952b;
  color:#090705;
  border-color:#dfb65c;
  outline:none;
}
.house-overlay-nav{
  position:absolute;
  top:18px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  white-space:nowrap;
  border:1px solid rgba(201,149,43,.58);
  background:rgba(5,4,3,.9);
  backdrop-filter:blur(10px);
  pointer-events:auto;
}
.house-overlay-nav a,
.house-overlay-nav button{
  border:0;
  border-right:1px solid rgba(201,149,43,.28);
  background:transparent;
  color:#d8b05a;
  text-decoration:none;
  padding:11px 13px;
  cursor:pointer;
  text-transform:uppercase;
  font:9px Arial,sans-serif;
  letter-spacing:.09em;
}
.house-overlay-nav>*:last-child{border-right:0}
.house-overlay-nav a:hover,
.house-overlay-nav button:hover,
.house-overlay-nav a:focus-visible,
.house-overlay-nav button:focus-visible{
  background:rgba(201,149,43,.16);
  color:#fff;
  outline:none;
}
/* Retire the recovery-only duplicate bar when the universal chrome is active. */
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-recovery-nav{
  display:none!important;
}
/* The old invisible close hotspot remains as a fallback, but the visible X is primary. */
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-close-hotspot{
  pointer-events:none;
}
@media(max-width:900px){
  .house-overlay-close{top:10px;right:10px;width:42px;height:42px}
  .house-overlay-nav{
    top:auto;
    left:8px;
    right:8px;
    bottom:8px;
    transform:none;
    overflow-x:auto;
    justify-content:flex-start;
  }
  .house-overlay-nav a,.house-overlay-nav button{padding:11px 12px}
}


/* Production 2.6 — deterministic image-aligned Treatment navigation. */
.treatment-recovery-nav{display:none!important}
.treatment-master-hotspots{
  position:fixed!important;z-index:360!important;left:0;right:auto;bottom:auto;height:auto;width:auto;
  display:grid!important;grid-template-columns:repeat(6,1fr);pointer-events:auto;
}
.treatment-master-hotspots button{display:block!important;pointer-events:auto!important;cursor:pointer!important}
.treatment-master-hotspots button:hover{background:rgba(201,149,43,.08)}
.treatment-master-hotspots button:focus-visible{background:rgba(201,149,43,.12)}
/* The baked-in top navigation remains clickable and is aligned by JavaScript to the rendered master. */
.treatment-house-hotspots{position:fixed!important;z-index:350!important;left:0!important;right:auto!important;top:0!important;height:auto!important;width:auto!important}
body.treatment-open .treatment-house-hotspots{display:grid!important}
/* On the overview, do not show any extra pop-up navigation. The artwork itself is the interface. */
body.treatment-open:not(:has(.treatment-discipline-page.is-active)) .house-overlay-chrome{display:none!important}

/* =========================================================
   Production 2.7 — Embedded Treatment Navigation Integration
   The visible box navigation is retired. Operational hotspots now
   follow the navigation and close controls already embedded in each
   approved Treatment master image.
   ========================================================= */
body.treatment-open .treatment-overlay-chrome{display:none!important}
body.treatment-open .house-overlay-chrome{display:none!important}
body.treatment-open .treatment-close-hotspot{
  display:block!important;
  position:fixed!important;
  z-index:430!important;
  pointer-events:auto!important;
  border:0!important;
  background:transparent!important;
}
body.treatment-open .treatment-close-hotspot:hover{
  background:rgba(201,149,43,.08)!important;
}
body.treatment-open .treatment-house-hotspots{
  display:grid!important;
  position:fixed!important;
  z-index:425!important;
  pointer-events:none!important;
}
body.treatment-open .treatment-house-hotspots a,
body.treatment-open .treatment-house-hotspots button,
body.treatment-open .treatment-house-hotspots span{
  pointer-events:auto!important;
}
body.treatment-open .treatment-discipline-hotspots{
  display:grid!important;
  position:fixed!important;
  z-index:425!important;
  pointer-events:none!important;
}
body.treatment-open .treatment-discipline-hotspots button{
  display:block!important;
  pointer-events:auto!important;
}


/* =========================================================
   Production 2.8 — Treatment overlay navigation restoration
   One dependable overlay system, matching Editorial and Extensions.
   ========================================================= */
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-overlay-chrome,
body.treatment-open:has(.treatment-discipline-page.is-active) .house-overlay-chrome{
  display:block!important;
  pointer-events:none!important;
}
body.treatment-open:has(.treatment-discipline-page.is-active) .house-overlay-close,
body.treatment-open:has(.treatment-discipline-page.is-active) .house-overlay-nav{
  pointer-events:auto!important;
}
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-house-hotspots{
  display:none!important;
}
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-close-hotspot{
  display:none!important;
  pointer-events:none!important;
}
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-discipline-hotspots{
  display:grid!important;
  grid-template-columns:repeat(7,1fr)!important;
  position:fixed!important;
  z-index:425!important;
  pointer-events:none!important;
}
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-discipline-hotspots button{
  display:block!important;
  pointer-events:auto!important;
  cursor:pointer!important;
  border:0!important;
  background:transparent!important;
}
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-discipline-hotspots button:hover,
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-discipline-hotspots button:focus-visible{
  background:rgba(201,149,43,.09)!important;
  outline:1px solid rgba(201,149,43,.5)!important;
}
/* The overview continues to use only the navigation baked into its master. */
body.treatment-open:not(:has(.treatment-discipline-page.is-active)) .treatment-overlay-chrome,
body.treatment-open:not(:has(.treatment-discipline-page.is-active)) .house-overlay-chrome{
  display:none!important;
}

/* =========================================================
   Production 2.9 — Unified embedded Treatment navigation
   The approved navigation visible in each Treatment master is the
   only visible navigation. HTML hotspots precisely follow it.
   ========================================================= */
body.treatment-open .treatment-overlay-chrome,
body.treatment-open .house-overlay-chrome,
body.treatment-open .treatment-suite-controls,
body.treatment-open .treatment-recovery-nav{display:none!important;}

/* House navigation follows the embedded top strip on overview and disciplines. */
body.treatment-open .treatment-house-hotspots{
  display:grid!important;
  position:fixed!important;
  z-index:1200!important;
  pointer-events:none!important;
  margin:0!important;
  padding:0!important;
}
body.treatment-open .treatment-house-hotspots a,
body.treatment-open .treatment-house-hotspots button,
body.treatment-open .treatment-house-hotspots span{
  display:block!important;
  min-width:0!important;
  height:100%!important;
  pointer-events:auto!important;
  border:0!important;
  background:transparent!important;
  padding:0!important;
}
body.treatment-open .treatment-house-hotspots a:hover,
body.treatment-open .treatment-house-hotspots button:hover,
body.treatment-open .treatment-house-hotspots a:focus-visible,
body.treatment-open .treatment-house-hotspots button:focus-visible{
  background:rgba(201,149,43,.08)!important;
  outline:1px solid rgba(201,149,43,.45)!important;
  outline-offset:-2px!important;
}

/* Discipline close control follows the embedded CLOSE × box. */
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-close-hotspot{
  display:block!important;
  position:fixed!important;
  z-index:1220!important;
  pointer-events:auto!important;
  background:transparent!important;
  border:0!important;
}
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-close-hotspot:hover,
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-close-hotspot:focus-visible{
  background:rgba(201,149,43,.08)!important;
  outline:1px solid rgba(201,149,43,.45)!important;
  outline-offset:-2px!important;
}

/* Embedded discipline footer tabs remain the visible and operational control. */
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-discipline-hotspots{
  display:grid!important;
  position:fixed!important;
  z-index:1210!important;
  grid-template-columns:1.16fr repeat(6,1fr)!important;
  pointer-events:auto!important;
}
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-discipline-hotspots button{
  display:block!important;
  height:100%!important;
  pointer-events:auto!important;
  background:transparent!important;
  border:0!important;
}
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-discipline-hotspots button:hover,
body.treatment-open:has(.treatment-discipline-page.is-active) .treatment-discipline-hotspots button:focus-visible{
  background:rgba(201,149,43,.08)!important;
  outline:1px solid rgba(201,149,43,.4)!important;
  outline-offset:-2px!important;
}

/* Landing-page discipline tabs use the exact baked-in six-column footer. */
body.treatment-open:not(:has(.treatment-discipline-page.is-active)) .treatment-master-hotspots{
  display:grid!important;
  position:fixed!important;
  z-index:1210!important;
  grid-template-columns:repeat(6,1fr)!important;
  pointer-events:auto!important;
}

/* =========================================================
   Treatment Production 3.1 — Studio-matched side-swipe folio
   ========================================================= */
body.treatment-open .treatment-discipline-page{display:none!important}
body.treatment-open .treatment-suite-controls,
body.treatment-open .treatment-house-hotspots{display:none!important}
.treatment-page{transition:filter .65s ease,transform .65s cubic-bezier(.22,.61,.36,1)}
body.treatment-folio-open .treatment-page{transform:translateX(-8vw);filter:brightness(.48)}
.treatment-folio{
  position:fixed;z-index:500;top:0;right:0;width:min(72vw,1120px);height:100dvh;
  padding:18px 18px 18px 0;transform:translateX(105%);visibility:hidden;
  transition:transform .72s cubic-bezier(.22,.61,.36,1),visibility 0s linear .72s;
  pointer-events:none;background:linear-gradient(90deg,transparent,rgba(0,0,0,.58) 6%);
}
body.treatment-folio-open .treatment-folio{transform:translateX(0);visibility:visible;transition-delay:0s;pointer-events:auto}
.treatment-folio-frame{height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;background:#090807;border:1px solid rgba(201,149,43,.58);box-shadow:-28px 0 70px rgba(0,0,0,.64)}
.treatment-folio-return{justify-self:start;margin:22px 28px 18px;border:0;background:none;color:#c9952b;font:11px Arial,sans-serif;letter-spacing:.09em;text-transform:uppercase;cursor:pointer}
.treatment-folio-scroll{min-height:0;overflow:auto;background:#070605;border-top:1px solid rgba(201,149,43,.26);border-bottom:1px solid rgba(201,149,43,.26);scrollbar-width:thin}
.treatment-folio-scroll img{display:block;width:100%;height:auto;min-height:100%;object-fit:contain;object-position:center top;background:#070605}
.treatment-folio-navigation{display:grid;grid-template-columns:1fr 150px 1fr;align-items:stretch;min-height:92px}
.treatment-folio-navigation button,.treatment-folio-navigation>div{border:0;background:none;color:#f4eee5;padding:18px 26px;display:grid;align-content:center;gap:4px}
.treatment-folio-navigation button{cursor:pointer;grid-template-columns:auto 1fr;column-gap:12px;text-align:left}
.treatment-folio-navigation button:last-child{grid-template-columns:1fr auto;text-align:right}
.treatment-folio-navigation button+div,.treatment-folio-navigation div+button{border-left:1px solid rgba(201,149,43,.26)}
.treatment-folio-navigation small{color:#c9952b;text-transform:uppercase;letter-spacing:.08em;font:9px Arial,sans-serif}
.treatment-folio-navigation strong{font:15px Georgia,serif;font-weight:400}
.treatment-folio-navigation>div{text-align:center}
.treatment-folio-navigation span{align-self:center;color:#c9952b;font-size:20px}
.treatment-master-hotspots{z-index:90!important;pointer-events:auto!important}
.treatment-master-hotspots button{pointer-events:auto!important;cursor:pointer!important}
@media(max-width:820px){
 .treatment-folio{width:96vw;padding:8px 8px 8px 0}
 body.treatment-folio-open .treatment-page{transform:translateX(-18vw)}
 .treatment-folio-navigation{grid-template-columns:1fr 86px 1fr;min-height:78px}
 .treatment-folio-navigation button,.treatment-folio-navigation>div{padding:12px 10px}
 .treatment-folio-navigation strong{font-size:12px}
}
@media(prefers-reduced-motion:reduce){.treatment-folio,.treatment-page{transition:none!important}}


/* Production 3.5 — unified, deterministic navigation */
.primary-nav a,.primary-nav button{border:0;background:none;color:inherit;text-decoration:none;font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer;padding:8px 0;white-space:nowrap}
.primary-nav a:hover,.primary-nav button:hover,.primary-nav a:focus-visible,.primary-nav button:focus-visible{color:var(--gold);outline:none}
.consultation-button{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}
.treatment-house-hotspots,.treatment-rail-exit,.treatment-suite-controls,.treatment-discipline-page{display:none!important}
body.treatment-open .treatment-master-hotspots{
  display:grid!important;position:absolute!important;z-index:2000!important;
  left:4.7%!important;right:1.5%!important;bottom:0!important;top:auto!important;
  width:auto!important;height:9.2%!important;grid-template-columns:repeat(6,1fr)!important;
  pointer-events:auto!important;
}
body.treatment-open .treatment-master-hotspots button{
  display:block!important;position:relative!important;inset:auto!important;width:auto!important;height:auto!important;
  border:0!important;background:transparent!important;pointer-events:auto!important;cursor:pointer!important;
}
body.treatment-open .treatment-master-hotspots button:hover,
body.treatment-open .treatment-master-hotspots button:focus-visible{background:rgba(201,149,43,.09)!important;outline:1px solid rgba(201,149,43,.35)!important;outline-offset:-1px}
.treatment-folio{z-index:3000!important}
@media(max-width:900px){
 .primary-nav{overflow-x:auto;justify-content:flex-start!important;gap:15px!important;padding-right:10px}
 .primary-nav a,.primary-nav button{display:block!important;font-size:9px!important}
 body.treatment-open .treatment-master-hotspots{left:4.3%!important;right:1%!important;height:10%!important}
}

/* =========================================================
   Production 3.6 — canonical photography + live editorial UI
   No navigation or editorial typography is embedded in imagery.
   ========================================================= */
.restored-room{position:relative;min-height:100vh;overflow:hidden;background:#070605}
.restored-room-image{position:absolute!important;inset:0;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;min-height:0!important}
.restored-room-vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(4,4,3,.96) 0%,rgba(4,4,3,.78) 25%,rgba(4,4,3,.22) 47%,rgba(4,4,3,0) 72%),linear-gradient(0deg,rgba(4,4,3,.55),transparent 24%)}
.room-live-copy{position:absolute;z-index:6;left:4%;top:50%;width:min(420px,32vw);transform:translateY(-52%);text-shadow:0 2px 18px rgba(0,0,0,.8)}
.room-kicker{margin:0 0 12px;color:#d4a33d;font-size:25px;font-style:italic}
.room-live-copy h1{font-size:72px;line-height:.98;font-weight:400;color:#fff}
.room-rule{width:310px;height:1px;margin:22px 0;background:linear-gradient(90deg,#c9952b,rgba(201,149,43,.15))}
.room-live-copy h2{margin:0 0 22px;color:#d4a33d;font-size:22px;line-height:1.35;text-transform:uppercase;letter-spacing:.06em;font-weight:400}
.room-live-copy>p:not(.room-kicker){font-size:19px;line-height:1.45;color:#f2ede4}
.room-live-copy>button{margin-top:22px;padding:0;border:0;background:none;color:#d4a33d;text-transform:uppercase;letter-spacing:.06em;font-size:17px;cursor:pointer}
.room-live-copy>button span{font-size:25px;margin-left:10px}
.studio-page.restored-room{min-height:100vh}
.live-lower-bar{z-index:8!important}
.treatment-page.restored-room{min-height:calc(100vh + 112px);padding-bottom:112px}
.treatment-vignette{background:linear-gradient(90deg,rgba(4,4,3,.99) 0%,rgba(4,4,3,.91) 31%,rgba(4,4,3,.40) 43%,rgba(4,4,3,.03) 70%)}
.treatment-live-copy{top:45%;left:3%;width:min(470px,34vw)}
.treatment-live-copy .room-kicker{font-style:normal;text-transform:uppercase;font-size:18px;letter-spacing:.04em}
.treatment-live-copy h1{font-size:52px;line-height:1.02;text-transform:uppercase}
.treatment-live-copy h2{font-size:20px}
.treatment-intro{font-size:16px!important;line-height:1.45!important;margin:12px 0 24px}
.treatment-pillars{display:grid;grid-template-columns:1fr 1fr;gap:22px 30px}
.treatment-pillars article{display:grid;grid-template-columns:44px 1fr;gap:10px}
.treatment-pillars b{display:grid;place-items:center;width:38px;height:38px;border:1px solid rgba(201,149,43,.65);border-radius:50%;color:#d4a33d;font-weight:400}
.treatment-pillars strong{display:block;text-transform:uppercase;font-size:12px;font-weight:400;color:#fff;margin-bottom:5px}
.treatment-pillars p{margin:0;font-size:13px;line-height:1.45;color:#e8dfd2}
.treatment-live-copy blockquote{margin:28px 0 0 42px;color:#d4a33d;font-size:21px;line-height:1.35;font-style:italic;text-align:center}
.treatment-live-copy cite{display:block;color:#fff;font-size:13px;font-style:normal;margin-top:8px}
.treatment-live-tabs{position:absolute;z-index:20;left:0;right:0;bottom:0;height:112px;display:grid;grid-template-columns:repeat(7,1fr);background:rgba(5,5,4,.97);border-top:1px solid rgba(201,149,43,.75)}
.treatment-live-tabs button{position:relative;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:14px;padding:17px 18px;border:0;border-right:1px solid rgba(201,149,43,.48);background:transparent;color:#fff;text-align:left;cursor:pointer}
.treatment-live-tabs button:hover,.treatment-live-tabs button:focus-visible{outline:none;background:rgba(201,149,43,.09)}
.treatment-live-tabs span{color:#d4a33d;font-size:39px;line-height:1}
.treatment-live-tabs strong{text-transform:uppercase;font-size:14px;line-height:1.35;font-weight:400}
.treatment-live-tabs em{position:absolute;right:13px;bottom:10px;color:#d4a33d;font-size:20px;font-style:normal}
.treatment-master-hotspots{display:none!important}
.treatment-page>.treatment-return{z-index:25}
body.treatment-open .house-header{display:flex!important}
body.treatment-open .house-rail{display:flex!important}
body.treatment-open .pages{margin-left:var(--rail)!important;padding-top:var(--header)!important}
body.treatment-folio-open .house-header,body.treatment-folio-open .house-rail{display:none!important}
body.treatment-folio-open .pages{margin:0!important;padding:0!important}
@media(max-width:1000px){
 .room-live-copy{left:5%;width:42vw}.room-live-copy h1{font-size:54px}
 .treatment-live-copy{width:43vw;top:42%}.treatment-pillars{grid-template-columns:1fr;gap:12px}.treatment-pillars article:nth-child(n+3){display:none}
 .treatment-live-tabs{overflow-x:auto;grid-template-columns:repeat(7,minmax(180px,1fr))}
}
@media(max-width:820px){
 .restored-room{min-height:100svh}.room-live-copy{left:20px;right:20px;top:auto;bottom:145px;width:auto;transform:none}
 .restored-room-vignette{background:linear-gradient(0deg,rgba(4,4,3,.96) 0%,rgba(4,4,3,.72) 43%,transparent 72%)}
 .room-live-copy h1{font-size:46px}.room-live-copy>p:not(.room-kicker){font-size:16px}
 .treatment-live-copy{bottom:130px}.treatment-live-copy h1{font-size:42px}.treatment-pillars,.treatment-live-copy blockquote{display:none}
 .treatment-live-tabs{height:105px;grid-template-columns:repeat(7,minmax(170px,1fr))}
 body.treatment-open .house-rail{display:none!important}body.treatment-open .pages{margin-left:0!important}
}

/* =========================================================
   Production 4.8 — Treatment hero framing correction
   Preserve the canonical image; reduce crop and protect live headings.
   ========================================================= */
.treatment-page.restored-room{
  height:calc(100vh - var(--header));
  min-height:720px;
  padding-bottom:112px;
  overflow:hidden;
}
.treatment-page.restored-room>.restored-room-image{
  inset:0 0 112px 0!important;
  width:100%!important;
  height:auto!important;
  object-fit:contain!important;
  object-position:center center!important;
  background:#070605;
}
.treatment-page.restored-room>.restored-room-vignette{
  inset:0 0 112px 0;
}
.treatment-live-copy{
  top:clamp(28px,4.5vh,58px);
  left:3%;
  width:min(470px,34vw);
  transform:none;
  max-height:calc(100% - 160px);
}
@media(max-height:820px) and (min-width:821px){
  .treatment-live-copy{top:22px;width:min(450px,34vw)}
  .treatment-live-copy h1{font-size:44px}
  .treatment-live-copy h2{font-size:17px;margin-bottom:12px}
  .treatment-intro{font-size:14px!important;line-height:1.35!important;margin:8px 0 14px}
  .treatment-pillars{gap:12px 22px}
  .treatment-pillars p{font-size:11.5px}
  .treatment-live-copy blockquote{margin-top:14px;font-size:17px}
}
@media(max-width:820px){
  .treatment-page.restored-room{height:auto;min-height:100svh;padding-bottom:112px}
  .treatment-page.restored-room>.restored-room-image{inset:0 0 112px 0!important;object-fit:cover!important;object-position:center center!important}
  .treatment-page.restored-room>.restored-room-vignette{inset:0 0 112px 0}
  .treatment-live-copy{top:auto;bottom:130px;max-height:none}
}

/* =========================================================
   Production 4.9 — Treatment responsive safe-area correction
   Preserve canonical photography. Prevent editorial clipping beneath
   the fixed House rail and allow natural vertical scrolling on short screens.
   ========================================================= */
.treatment-page.restored-room{
  box-sizing:border-box;
  height:auto!important;
  min-height:max(780px,calc(100svh - var(--header)))!important;
  padding-bottom:112px!important;
  overflow:hidden!important;
}
.treatment-page.restored-room>.restored-room-image{
  inset:0 0 112px 0!important;
  width:100%!important;
  height:calc(100% - 112px)!important;
  object-fit:cover!important;
  object-position:center center!important;
}
.treatment-page.restored-room>.restored-room-vignette{
  inset:0 0 112px 0!important;
}
.treatment-live-copy{
  left:clamp(56px,4.5vw,82px)!important;
  right:auto!important;
  top:clamp(30px,4.5vh,58px)!important;
  bottom:auto!important;
  width:min(470px,calc(43vw - 40px))!important;
  max-width:calc(100% - 112px)!important;
  max-height:none!important;
  transform:none!important;
}

/* Short desktop windows scroll instead of cropping the manuscript. */
@media (max-height:820px) and (min-width:821px){
  .treatment-page.restored-room{
    min-height:780px!important;
  }
  .treatment-live-copy{
    left:clamp(52px,4vw,70px)!important;
    top:24px!important;
    width:min(445px,calc(45vw - 34px))!important;
  }
  .treatment-live-copy h1{font-size:44px!important;line-height:1.01!important}
  .treatment-live-copy h2{font-size:17px!important;margin-bottom:11px!important}
  .treatment-intro{font-size:14px!important;line-height:1.34!important;margin:8px 0 13px!important}
  .treatment-pillars{gap:11px 20px!important}
  .treatment-pillars article{grid-template-columns:38px 1fr!important;gap:8px!important}
  .treatment-pillars b{width:34px!important;height:34px!important}
  .treatment-pillars strong{font-size:11px!important}
  .treatment-pillars p{font-size:11.5px!important;line-height:1.35!important}
  .treatment-live-copy blockquote{margin:13px 0 0 28px!important;font-size:17px!important}
}

/* Narrow desktop/tablet: retain the House rail safe area and stack pillars. */
@media (max-width:1100px) and (min-width:821px){
  .treatment-live-copy{
    left:clamp(48px,4vw,62px)!important;
    width:min(430px,44vw)!important;
  }
  .treatment-pillars{grid-template-columns:1fr!important;gap:10px!important}
  .treatment-pillars article:nth-child(n+3){display:none!important}
}

/* Mobile remains full-width, with text safely inset and page allowed to grow. */
@media (max-width:820px){
  .treatment-page.restored-room{
    min-height:760px!important;
    padding-bottom:105px!important;
  }
  .treatment-page.restored-room>.restored-room-image{
    inset:0 0 105px 0!important;
    height:calc(100% - 105px)!important;
    object-fit:cover!important;
  }
  .treatment-page.restored-room>.restored-room-vignette{inset:0 0 105px 0!important}
  .treatment-live-copy{
    left:24px!important;
    right:24px!important;
    top:auto!important;
    bottom:128px!important;
    width:auto!important;
    max-width:none!important;
  }
}

/* =========================================================
   Production 5.0 — final House responsive master alignment
   Additional protected space resolves the remaining first-letter
   and header clipping at reduced desktop browser dimensions.
   ========================================================= */
.treatment-live-copy{
  left:var(--house-editorial-safe-left,96px)!important;
  top:var(--house-editorial-safe-top,48px)!important;
  padding-left:8px!important;
  padding-top:4px!important;
  width:min(470px,calc(46vw - 56px))!important;
  max-width:calc(100% - var(--house-editorial-safe-left,96px) - var(--house-editorial-safe-right,40px))!important;
  overflow:visible!important;
}
.treatment-live-copy h1,
.treatment-live-copy .room-kicker,
.treatment-live-copy h2{
  overflow:visible!important;
  text-indent:0!important;
}

@media (max-height:820px) and (min-width:821px){
  .treatment-page.restored-room{min-height:810px!important;}
  .treatment-live-copy{
    left:var(--house-editorial-safe-left,92px)!important;
    top:var(--house-editorial-safe-top,40px)!important;
    padding-left:8px!important;
    width:min(448px,calc(47vw - 52px))!important;
  }
}

@media (max-width:1100px) and (min-width:821px){
  .treatment-live-copy{
    left:var(--house-editorial-safe-left,88px)!important;
    top:var(--house-editorial-safe-top,44px)!important;
    width:min(430px,calc(48vw - 48px))!important;
  }
}

@media (max-width:820px){
  .treatment-live-copy{
    left:var(--house-editorial-safe-left,24px)!important;
    right:var(--house-editorial-safe-right,24px)!important;
    top:auto!important;
    padding:0!important;
    width:auto!important;
    max-width:none!important;
  }
}


/* Production 6.3.4 — persistent Treatment close control and Continuity home ritual. */
.treatment-folio-frame{position:relative}
.treatment-folio-close{
 position:absolute;z-index:10;top:15px;right:18px;width:48px;height:48px;border:1px solid rgba(201,149,43,.76);
 border-radius:50%;background:rgba(9,8,7,.92);color:#c9952b;font:300 31px/1 Arial,sans-serif;cursor:pointer;
 display:grid;place-items:center
}
.treatment-folio-close:hover,.treatment-folio-close:focus-visible{color:#fff1ca;border-color:#e4b95d;outline:none}
.treatment-folio-return{padding-right:70px}
.continuity-folio{
 min-height:100%;padding:clamp(76px,10vh,120px) clamp(34px,8vw,110px);box-sizing:border-box;
 background:radial-gradient(circle at 78% 18%,rgba(116,91,44,.22),transparent 35%),linear-gradient(145deg,#10120d,#080806 58%,#151008);
 color:#f1ece3;display:flex;flex-direction:column;justify-content:center
}
.continuity-folio[hidden]{display:none!important}
.continuity-eyebrow{margin:0 0 18px;color:#c9952b;font:10px Arial,sans-serif;letter-spacing:.24em;text-transform:uppercase}
.continuity-folio h2{margin:0;color:#e0b85f;font:400 clamp(48px,7vw,90px)/.95 Georgia,serif}
.continuity-folio h3{margin:14px 0 34px;color:#f4eee5;font:italic 400 clamp(22px,3vw,36px)/1.2 Georgia,serif}
.continuity-folio>p{max-width:670px;margin:0 0 18px;font:17px/1.75 Georgia,serif;color:#ddd5c9}
.continuity-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.continuity-actions a{min-width:230px;padding:17px 22px;text-decoration:none;text-transform:uppercase;letter-spacing:.08em;font:10px Arial,sans-serif;text-align:center;transition:.25s ease}
.continuity-primary{background:#c9952b;color:#090807;border:1px solid #c9952b}
.continuity-secondary{color:#e5c47b;border:1px solid rgba(201,149,43,.7);background:rgba(0,0,0,.2)}
.continuity-actions a:hover,.continuity-actions a:focus-visible{transform:translateY(-2px);filter:brightness(1.12);outline:none}
@media(max-width:820px){
 .treatment-folio-close{top:10px;right:10px;width:42px;height:42px}
 .continuity-folio{padding:80px 25px 46px}
 .continuity-actions{display:grid}.continuity-actions a{min-width:0}
}


/* Production 6.3.5 — one close control and clean Continuity transition. */
.treatment-folio-scroll{position:relative}
.treatment-folio-scroll img[hidden]{display:none!important}
/* Approved discipline masters contain a legacy CLOSE × in their upper-right artwork.
   This restrained mask removes that obsolete control while preserving the manuscript. */
.treatment-folio-scroll::before{
  content:"";
  position:absolute;
  z-index:5;
  top:0;
  right:0;
  width:clamp(112px,14vw,168px);
  height:clamp(50px,6vw,76px);
  background:#070605;
  pointer-events:none;
}
.treatment-folio-close{z-index:12}
@media(max-width:820px){
  .treatment-folio-scroll::before{width:112px;height:54px}
}

/* Production 10.1 — Treatment Editorial Engine 1.0 */
.treatment-editorial{color:#eee7dc;background:#0b0907;min-height:100%;font-family:Georgia,"Times New Roman",serif}
.treatment-editorial[hidden]{display:none!important}
.te-opening{padding:clamp(44px,6vw,92px) clamp(34px,7vw,110px);border-bottom:1px solid rgba(201,149,43,.28);max-width:1100px}
.te-eyebrow,.te-number,.te-continue small,.te-reflection small{font:10px Arial,sans-serif;letter-spacing:.18em;color:#c9952b;text-transform:uppercase}
.te-opening h2{font-size:clamp(44px,6vw,82px);line-height:.95;font-weight:400;margin:14px 0 22px}
.te-deck{font-size:clamp(18px,2vw,27px);line-height:1.5;max-width:800px;color:#d8cfc3}
.te-feature,.te-collection{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);border-bottom:1px solid rgba(201,149,43,.22)}
.te-feature figure{margin:0;min-height:430px;background:#111}
.te-feature figure img,.te-collection>img{width:100%;height:100%;display:block;object-fit:cover}
.te-copy,.te-collection>div{padding:clamp(38px,5vw,72px)}
.te-copy h3,.te-text h3,.te-biology h3,.te-elements h3,.te-collection h3{font-size:clamp(27px,3vw,42px);font-weight:400;line-height:1.08;margin:10px 0 22px}
.te-copy p,.te-text p,.te-biology p,.te-elements p,.te-collection p{font-size:16px;line-height:1.75;color:#d5ccc0}
.te-note{font-style:italic;color:#a99b8a!important;font-size:13px!important;border-left:1px solid #c9952b;padding-left:16px;margin-top:28px}
.te-text,.te-biology{padding:clamp(50px,7vw,100px) clamp(34px,8vw,130px);border-bottom:1px solid rgba(201,149,43,.22)}
.te-biology{display:grid;grid-template-columns:1fr .8fr;gap:70px}
.te-terms{display:grid;align-content:center}
.te-terms span{padding:16px 0;border-bottom:1px solid rgba(201,149,43,.22);font-size:18px}
.te-elements{padding:clamp(50px,7vw,100px) clamp(34px,7vw,110px);border-bottom:1px solid rgba(201,149,43,.22)}
.te-elements>header{max-width:760px;margin-bottom:40px}
.te-element-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.te-element-grid article{border:1px solid rgba(201,149,43,.22);padding-bottom:28px}
.te-element-grid img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.te-element-grid h4{font-size:25px;font-weight:400;margin:24px 28px 8px}
.te-element-grid p{margin:0 28px}
.te-continue{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid rgba(201,149,43,.25)}
.te-continue>div{padding:42px 34px;min-height:230px}
.te-continue>div+div{border-left:1px solid rgba(201,149,43,.22)}
.te-continue h4{font-size:22px;font-weight:400;margin:12px 0}
.te-continue p{font-size:14px;line-height:1.6;color:#bfb4a7}
.te-continue a,.te-continue button{border:0;background:none;padding:0;color:#c9952b;font:11px Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;cursor:pointer}
.te-reflection{padding:60px clamp(34px,8vw,130px) 80px;background:#12100c}
.te-reflection p{font-size:clamp(22px,3vw,36px);line-height:1.45;max-width:900px;margin:18px 0 0;color:#e7ddcf}
@media(max-width:850px){.te-feature,.te-collection,.te-biology,.te-element-grid,.te-continue{grid-template-columns:1fr}.te-feature figure{min-height:280px}.te-continue>div+div{border-left:0;border-top:1px solid rgba(201,149,43,.22)}}


/* Production 10.1.1 — Treatment editorial image legibility correction */
.te-feature{
  align-items:center;
}
.te-feature figure{
  overflow:hidden;
}
.te-tool-image{
  margin:clamp(34px,5vw,70px);
  min-height:0!important;
  align-self:center;
  justify-self:center;
  width:min(100%,360px);
  background:transparent!important;
}
.te-tool-image img{
  width:100%!important;
  height:auto!important;
  object-fit:contain!important;
  object-position:center!important;
  display:block;
}
.te-feature-observation{
  grid-template-columns:minmax(0,1fr) minmax(260px,.55fr);
}
.te-feature-steam{
  grid-template-columns:minmax(0,1fr) minmax(260px,.55fr);
}
.te-steam-image{
  width:min(100%,330px);
}
.te-living-foundation{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);
  border-bottom:1px solid rgba(201,149,43,.22);
  align-items:stretch;
}
.te-living-foundation figure{
  margin:0;
  min-height:520px;
  overflow:hidden;
  background:#111;
}
.te-living-foundation figure img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:64% center;
  display:block;
}
.te-element-grid{
  align-items:start;
}
.te-element-grid article{
  overflow:hidden;
}
.te-element-grid img{
  height:auto!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  object-position:center!important;
  max-height:320px;
  background:#0b0907;
}
.te-collection>img{
  height:auto!important;
  max-height:430px;
  object-fit:contain!important;
  object-position:center!important;
  align-self:center;
  background:#0b0907;
}
@media(max-width:850px){
  .te-feature-observation,.te-feature-steam,.te-living-foundation{grid-template-columns:1fr}
  .te-tool-image{margin:28px auto 40px}
  .te-living-foundation figure{min-height:320px}
}

/* Production 10.2 — Discipline 02 Follicular Stimulation */
.te-red-light-placeholder{margin:clamp(34px,5vw,70px);min-height:320px!important;display:grid;place-items:center;border:1px solid rgba(201,149,43,.3);background:radial-gradient(circle at center,rgba(120,0,0,.32),rgba(15,7,6,.96))!important}
.te-red-light-placeholder div{text-align:center;padding:40px}
.te-red-light-placeholder span,.te-red-light-placeholder small{display:block;font:10px Arial,sans-serif;letter-spacing:.15em;color:#a99887;text-transform:uppercase}
.te-red-light-placeholder strong{display:block;font:400 clamp(28px,4vw,48px) Georgia,serif;color:#e9ded0;margin:18px 0}

/* Production 10.5 — Hair Fiber Restoration */
.te-fiber-preparations{grid-template-columns:repeat(3,1fr)}
.te-product-placeholder{aspect-ratio:16/10;display:grid;place-items:center;border-bottom:1px solid rgba(201,149,43,.22);font:11px Arial,sans-serif;letter-spacing:.18em;color:#c9952b;background:#12100c}
@media(max-width:850px){.te-fiber-preparations{grid-template-columns:1fr}}

/* Production 10.5.2 — Continuity at Home cleanup */
.continuity-home{padding:clamp(50px,7vw,100px) clamp(34px,8vw,120px);background:#0b0907;color:#eee7dc;min-height:100%}
.continuity-home h2{font:400 clamp(42px,6vw,78px)/1 Georgia,"Times New Roman",serif;margin:16px 0 26px}
.continuity-home>p:not(.te-eyebrow){max-width:760px;font:18px/1.7 Georgia,"Times New Roman",serif;color:#d5ccc0}
.continuity-home-links{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:54px}
.continuity-home-links a{min-height:190px;border:1px solid rgba(201,149,43,.3);padding:32px;text-decoration:none;color:#eee7dc;display:flex;flex-direction:column;justify-content:flex-end}
.continuity-home-links strong{font:400 30px Georgia,serif;margin-bottom:14px}
.continuity-home-links span{font:11px Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#c9952b}
@media(max-width:700px){.continuity-home-links{grid-template-columns:1fr}}

.continuity-brand{margin:48px 0 10px;font:400 clamp(34px,5vw,64px) Georgia,serif;letter-spacing:.16em;color:#eee7dc;border-top:1px solid rgba(201,149,43,.25);padding-top:40px}


/* Production 10.5.3 — dedicated Continuity at Home */
.continuity-destinations{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
  padding:clamp(45px,6vw,90px) clamp(34px,7vw,110px);
  border-bottom:1px solid rgba(201,149,43,.22);
}
.continuity-destination{
  min-height:420px;
  border:1px solid rgba(201,149,43,.28);
  padding:clamp(32px,4vw,52px);
  text-decoration:none;
  color:#eee7dc;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  transition:transform .25s ease,border-color .25s ease,background .25s ease;
}
.continuity-destination:hover{
  transform:translateY(-3px);
  border-color:#c9952b;
  background:#12100c;
}
.continuity-logo{
  margin:auto 0;
  text-align:center;
  color:#eee7dc;
}
.continuity-logo-biomethod{
  font:400 clamp(44px,6vw,78px) Georgia,"Times New Roman",serif;
  letter-spacing:.06em;
}
.continuity-logo-hairquiz{
  font:400 clamp(44px,6vw,78px) Georgia,"Times New Roman",serif;
  letter-spacing:-.03em;
}
.continuity-destination h3{
  font:400 28px/1.1 Georgia,"Times New Roman",serif;
  margin:30px 0 12px;
}
.continuity-destination p{
  font:15px/1.65 Georgia,"Times New Roman",serif;
  color:#bfb4a7;
  max-width:520px;
}
.continuity-destination span{
  margin-top:24px;
  font:11px Arial,sans-serif;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#c9952b;
}
@media(max-width:800px){
  .continuity-destinations{grid-template-columns:1fr}
  .continuity-destination{min-height:330px}
}

/* Production 10.6.4 — Follicular Stimulation approved imagery */
.te-feature-follicular{grid-template-columns:minmax(0,1fr) minmax(320px,.8fr)}
.te-feature-follicular figure,.te-red-light figure,.te-follicular-image{min-height:430px}
.te-feature-follicular figure img,.te-red-light figure img,.te-follicular-image img{width:100%;height:100%;object-fit:contain;background:#0b0907;display:block}
@media(max-width:850px){.te-feature-follicular{grid-template-columns:1fr}.te-feature-follicular figure,.te-red-light figure,.te-follicular-image{min-height:280px}}

/* Production 10.6.5 — editorial photography insertion only */
.te-editorial-image{margin:clamp(34px,5vw,70px);overflow:hidden;background:#0f0d0a}
.te-editorial-image img{display:block;width:100%;height:auto;object-fit:contain}
.te-fiber-preparation-image{margin-bottom:clamp(24px,3vw,42px)}

/* Production 10.6.6 — Hair Fiber Restoration approved imagery */
.te-product-image{margin:0;border-bottom:1px solid rgba(201,149,43,.22);background:#12100c;overflow:hidden;aspect-ratio:4/5}
.te-product-image img{display:block;width:100%;height:100%;object-fit:contain;background:#12100c}
.te-fiber-structure-image,.te-two-treatment-image{margin-top:clamp(24px,3vw,42px)}
.te-fiber-structure-image img,.te-two-treatment-image img{object-fit:contain}
/* Production 10.6.8 — Ampoule System approved editorial imagery */
.te-ampoule-editorial-image{margin:0 0 clamp(24px,3vw,42px);max-width:980px}
.te-ampoule-editorial-image img,.te-ampoule-photo img,.te-ampoule-pair img{width:100%;height:auto;display:block;object-fit:contain}
.te-ampoule-photo{background:#f4f1ec!important;display:grid;place-items:center;padding:clamp(12px,2vw,26px)}
.te-ampoule-pair{margin:0 0 clamp(24px,3vw,42px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2vw,26px);max-width:1100px}
.te-ampoule-pair img{max-height:720px}
@media(max-width:700px){.te-ampoule-pair{grid-template-columns:1fr}.te-ampoule-pair img{max-height:none}}


/* Production 10.6.9 — Continuity branded gateways */
.biomethod-wordmark{display:inline-block;font-family:Arial,Helvetica,sans-serif;font-weight:300;letter-spacing:-.045em;color:#d8d8d8;border-bottom:4px solid #1683a7;padding:0 .05em .06em;line-height:.9}
.biomethod-wordmark::first-letter{color:#d8d8d8}
.hairquiz-wordmark{display:inline-block;font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:.02em;color:#eee7dc}
.continuity-hairquiz .hairquiz-gold-bar{display:block;margin-top:28px;background:#c9952b;color:#0b0907;padding:18px 24px;text-align:center;font:11px Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;transition:filter .2s ease,transform .2s ease}
.continuity-hairquiz:hover .hairquiz-gold-bar{filter:brightness(1.12);transform:translateY(-1px)}
.continuity-biomethod .continuity-logo{font-size:clamp(44px,6vw,78px)}

/* Production 10.6.10 — Continuity at Home approved gateway artwork */
.continuity-logo img{display:block;max-width:100%;height:auto;margin:0 auto}
.continuity-logo-biomethod img{width:min(520px,88%)}
.continuity-logo-hairquiz img{width:min(560px,92%)}
.continuity-hairquiz .hairquiz-gold-bar{background:transparent;padding:0;display:block;margin-top:28px;text-align:center}
.continuity-hairquiz .hairquiz-gold-bar img{display:block;width:260px;max-width:100%;height:auto;margin:0 auto}
.continuity-hairquiz:hover .hairquiz-gold-bar{filter:none;transform:none}
.continuity-hairquiz:hover .hairquiz-gold-bar img{filter:brightness(1.06);transform:translateY(-1px)}

/* Production 10.6.12 — Discipline 07 Protection Editorial Engine */
.treatment-editorial-protection .te-protection-opening,
.treatment-editorial-protection .te-protection-guide{grid-template-columns:minmax(320px,.82fr) minmax(0,1.18fr)}
.treatment-editorial-protection .te-protection-detail{grid-template-columns:minmax(0,1fr) minmax(320px,.9fr)}
.treatment-editorial-protection .te-editorial-image{margin:0;min-height:460px;background:#0b0907;overflow:hidden}
.treatment-editorial-protection .te-editorial-image img{width:100%;height:100%;display:block;object-fit:contain;background:#0b0907}
.treatment-editorial-protection .te-protection-elements .te-element-grid img{object-fit:contain;background:#0b0907}
@media(max-width:850px){
 .treatment-editorial-protection .te-protection-opening,
 .treatment-editorial-protection .te-protection-guide,
 .treatment-editorial-protection .te-protection-detail{grid-template-columns:1fr}
 .treatment-editorial-protection .te-editorial-image{min-height:300px}
}






/* =========================================================
   Production 11.0 — Definitive Treatment discipline strip alignment
   Desktop: seven equal columns, no horizontal scroll, protected side margins.
   Narrow screens: deliberate horizontal rail with forced left-origin reset.
   ========================================================= */
.treatment-live-tabs{
  left:28px!important;
  right:28px!important;
  width:auto!important;
  padding:0!important;
  margin:0!important;
  display:grid!important;
  grid-template-columns:repeat(7,minmax(0,1fr))!important;
  overflow-x:hidden!important;
  overflow-y:hidden!important;
  background:rgba(5,5,4,.97);
}
.treatment-live-tabs button{
  min-width:0!important;
  width:auto!important;
  padding:17px 12px!important;
  gap:10px!important;
  overflow:visible!important;
}
.treatment-live-tabs button:first-child{
  padding-left:18px!important;
}
.treatment-live-tabs span{
  display:block!important;
  min-width:42px!important;
  width:42px!important;
  overflow:visible!important;
  white-space:nowrap!important;
}
.treatment-live-tabs strong{
  min-width:0!important;
  overflow:visible!important;
}

/* Only genuinely narrow layouts become a scroll rail. */
@media(max-width:1180px){
  .treatment-live-tabs{
    left:18px!important;
    right:18px!important;
    display:grid!important;
    grid-template-columns:repeat(7,minmax(178px,1fr))!important;
    overflow-x:auto!important;
    overscroll-behavior-x:contain;
    scroll-snap-type:none!important;
    scroll-padding-left:0!important;
  }
  .treatment-live-tabs button:first-child{
    padding-left:20px!important;
  }
}
@media(max-width:820px){
  .treatment-live-tabs{
    left:10px!important;
    right:10px!important;
    grid-template-columns:repeat(7,minmax(170px,1fr))!important;
  }
}




/* =========================================================
   Production 11.0 — Treatment lower navigation FINAL realignment
   Shift the entire seven-discipline strip inward as one unit.
   ========================================================= */
.treatment-live-tabs{
  left:44px!important;
  right:24px!important;
  width:auto!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:repeat(7,minmax(0,1fr))!important;
  overflow:hidden!important;
}
.treatment-live-tabs button{
  min-width:0!important;
  width:100%!important;
  box-sizing:border-box!important;
  padding:17px 10px!important;
  gap:8px!important;
  overflow:visible!important;
}
.treatment-live-tabs button:first-child{
  padding-left:24px!important;
}
.treatment-live-tabs button:first-child span{
  display:block!important;
  width:52px!important;
  min-width:52px!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  white-space:nowrap!important;
  text-indent:0!important;
  transform:none!important;
}
.treatment-live-tabs span{
  overflow:visible!important;
  white-space:nowrap!important;
}

/* Tablet: keep a substantial protected left gutter, then allow intentional scroll. */
@media(max-width:1180px) and (min-width:821px){
  .treatment-live-tabs{
    left:40px!important;
    right:20px!important;
    grid-template-columns:repeat(7,minmax(176px,1fr))!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-padding-left:0!important;
  }
}

/* Mobile has no House rail, but retain a clear screen-edge gutter. */
@media(max-width:820px){
  .treatment-live-tabs{
    left:20px!important;
    right:12px!important;
    grid-template-columns:repeat(7,minmax(170px,1fr))!important;
    overflow-x:auto!important;
  }
  .treatment-live-tabs button:first-child{
    padding-left:20px!important;
  }
}


/* =========================================================
   Production 11.0 — Treatment Discipline Index
   Luxury clinical / spa navigation. This block intentionally
   supersedes all prior Treatment lower-tab alignment patches.
   ========================================================= */
.treatment-live-tabs{
  position:absolute!important;
  z-index:30!important;
  left:28px!important;
  right:28px!important;
  bottom:18px!important;
  width:auto!important;
  height:88px!important;
  margin:0!important;
  padding:0!important;
  display:grid!important;
  grid-template-columns:repeat(7,minmax(0,1fr))!important;
  overflow:visible!important;
  background:rgba(10,9,7,.94)!important;
  border:1px solid rgba(201,149,43,.52)!important;
  box-shadow:0 14px 36px rgba(0,0,0,.30)!important;
  backdrop-filter:blur(14px)!important;
  box-sizing:border-box!important;
}
.treatment-live-tabs button{
  position:relative!important;
  min-width:0!important;
  width:auto!important;
  height:86px!important;
  margin:0!important;
  padding:14px 13px 13px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:6px!important;
  border:0!important;
  border-right:1px solid rgba(201,149,43,.22)!important;
  background:transparent!important;
  color:#f1eadf!important;
  text-align:left!important;
  overflow:hidden!important;
  cursor:pointer!important;
  box-sizing:border-box!important;
}
.treatment-live-tabs button:last-child{
  border-right:0!important;
}
.treatment-live-tabs button::after{
  content:""!important;
  position:absolute!important;
  left:13px!important;
  right:13px!important;
  bottom:8px!important;
  height:1px!important;
  background:#c9952b!important;
  transform:scaleX(0)!important;
  transform-origin:left!important;
  transition:transform .22s ease!important;
}
.treatment-live-tabs button:hover,
.treatment-live-tabs button:focus-visible{
  outline:none!important;
  background:rgba(201,149,43,.055)!important;
}
.treatment-live-tabs button:hover::after,
.treatment-live-tabs button:focus-visible::after{
  transform:scaleX(1)!important;
}
.treatment-live-tabs span{
  display:block!important;
  width:auto!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  color:#c9952b!important;
  font:10px/1 Arial,sans-serif!important;
  letter-spacing:.17em!important;
  white-space:nowrap!important;
  overflow:visible!important;
}
.treatment-live-tabs strong{
  display:block!important;
  min-width:0!important;
  margin:0!important;
  color:#eee7d8!important;
  font:400 11px/1.28 Arial,sans-serif!important;
  letter-spacing:.075em!important;
  text-transform:uppercase!important;
  white-space:normal!important;
}
.treatment-live-tabs em{
  display:none!important;
}

/* The room image and manuscript stop above the floating treatment index. */
.treatment-page.restored-room{
  padding-bottom:124px!important;
}
.treatment-page.restored-room>.restored-room-image{
  inset:0 0 124px 0!important;
  height:calc(100% - 124px)!important;
}
.treatment-page.restored-room>.restored-room-vignette{
  inset:0 0 124px 0!important;
}

/* Compact desktop / tablet: a true swipeable index with a deliberate,
   fully visible leading gutter — never a partially clipped first number. */
@media(max-width:1180px){
  .treatment-live-tabs{
    left:22px!important;
    right:22px!important;
    bottom:16px!important;
    height:86px!important;
    display:flex!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x proximity!important;
    scrollbar-width:none!important;
    padding-left:0!important;
  }
  .treatment-live-tabs::-webkit-scrollbar{display:none!important}
  .treatment-live-tabs button{
    flex:0 0 176px!important;
    width:176px!important;
    height:84px!important;
    scroll-snap-align:start!important;
  }
}

/* Mobile: still elegant, but clearly a horizontal treatment index. */
@media(max-width:820px){
  .treatment-live-tabs{
    left:12px!important;
    right:12px!important;
    bottom:10px!important;
    height:82px!important;
  }
  .treatment-live-tabs button{
    flex-basis:158px!important;
    width:158px!important;
    height:80px!important;
    padding:12px 12px!important;
  }
  .treatment-live-tabs strong{font-size:10px!important}
  .treatment-page.restored-room{padding-bottom:106px!important}
  .treatment-page.restored-room>.restored-room-image{
    inset:0 0 106px 0!important;
    height:calc(100% - 106px)!important;
  }
  .treatment-page.restored-room>.restored-room-vignette{
    inset:0 0 106px 0!important;
  }
}
