/* Studio Sarah — brand charter (CDC §11 / Specs §2.1)
   Ivory #F5EFE6 · Beige #E8DED1 · Taupe #C6B7A6 · Mocha #A68A75
   Charcoal #2B2B2B · Black #111111 · Dark Brown #4B362C */

:root{
  --ivory:#F3EBE1; --beige:#DFCFBB; --taupe:#B49A80; --mocha:#8A6244;
  --mocha-ink:#75533A; --charcoal:#2A2320; --black:#141010; --darkbrown:#4A3323;
  --white:#FFFFFF; --cream:#FBF7F2;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Jost","Helvetica Neue",Arial,sans-serif;
  --maxw:1180px;
  --r:2px;
  --shadow:0 22px 60px -32px rgba(20,16,16,.55);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--ivory);color:var(--charcoal);
  font-family:var(--sans);font-size:16px;line-height:1.7;font-weight:300;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--serif);color:var(--black);font-weight:400;line-height:1.15;margin:0 0 .5em}
h1{font-size:clamp(2.6rem,8vw,4.6rem);letter-spacing:.01em}
h2{font-size:clamp(2rem,5vw,3rem)}
h3{font-size:clamp(1.3rem,3vw,1.6rem)}
p{margin:0 0 1.1em}
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:22px}
.eyebrow{
  font-size:.72rem;letter-spacing:.28em;text-transform:uppercase;
  color:var(--mocha);font-weight:400;margin:0 0 1rem
}
.lead{font-size:clamp(1.02rem,2.2vw,1.16rem);color:var(--charcoal);max-width:62ch}
.center{text-align:center}
.center .lead{margin-inline:auto}
section{padding:clamp(34px,5vw,62px) 0}
.sec-beige{background:var(--beige)}
.sec-dark{background:var(--black);color:var(--beige)}
.sec-dark h2,.sec-dark h3{color:var(--ivory)}
.sec-dark .eyebrow{color:var(--taupe)}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  font-family:var(--sans);font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;
  padding:16px 30px;border:1px solid var(--black);background:var(--black);color:var(--ivory);
  border-radius:var(--r);cursor:pointer;transition:.25s ease;text-align:center
}
.btn:hover{background:var(--darkbrown);border-color:var(--darkbrown)}
.btn-ghost{background:transparent;color:var(--black)}
.btn-ghost:hover{background:var(--black);color:var(--ivory)}
.btn-light{background:var(--ivory);color:var(--black);border-color:var(--ivory)}
.btn-light:hover{background:var(--taupe);border-color:var(--taupe);color:var(--black)}
.btn-sm{padding:12px 22px;font-size:.7rem}
.btn-row{display:flex;flex-wrap:wrap;gap:14px}
.center .btn-row{justify-content:center}

/* ---------- header ---------- */
.hdr{
  position:sticky;top:0;z-index:60;background:rgba(245,239,230,.92);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--taupe)
}
.hdr-in{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 22px;max-width:var(--maxw);margin-inline:auto}
.logo{font-family:var(--serif);font-size:1.32rem;letter-spacing:.24em;text-transform:uppercase;color:var(--black);white-space:nowrap}
.logo small{display:block;font-family:var(--sans);font-size:.52rem;letter-spacing:.3em;color:var(--mocha-ink);margin-top:3px}
.nav{display:flex;align-items:center;gap:22px;flex-wrap:nowrap}
.nav a{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--charcoal);padding:6px 0;border-bottom:1px solid transparent;white-space:nowrap}
.nav .nav-book{display:none;color:var(--mocha)}
.nav a:hover,.nav a[aria-current="page"]{border-bottom-color:var(--mocha);color:var(--black)}
.hdr-cta{display:flex;align-items:center;gap:12px}
.burger{display:none;background:none;border:0;padding:8px;cursor:pointer}
.burger span{display:block;width:24px;height:1px;background:var(--black);margin:5px 0;transition:.25s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

@media(max-width:960px){
  .nav{
    position:fixed;inset:64px 0 auto 0;flex-direction:column;align-items:flex-start;gap:0;
    background:var(--ivory);border-bottom:1px solid var(--taupe);padding:8px 22px 24px;
    display:none
  }
  .nav.open{display:flex}
  .nav a{width:100%;padding:14px 0;border-bottom:1px solid var(--beige);font-size:.85rem}
  .nav .nav-book{display:block}
  .burger{display:block}
  .hdr-cta .btn{display:none}
}

/* ---------- sticky mobile CTA (A1) ---------- */
.sticky-cta{
  position:fixed;left:0;right:0;bottom:0;z-index:70;display:none;gap:10px;padding:10px 14px;
  background:rgba(17,17,17,.96);backdrop-filter:blur(6px)
}
.sticky-cta .btn{flex:1;padding:14px 10px}
.sticky-cta .btn-call{background:transparent;border-color:var(--taupe);color:var(--ivory);flex:0 0 auto;padding-inline:18px}
@media(max-width:760px){.sticky-cta{display:flex}body{padding-bottom:72px}}

/* ---------- hero ---------- */
.hero{
  position:relative;background:linear-gradient(160deg,#F7F2EA 0%,#E8DED1 55%,#C6B7A6 100%);
  padding:clamp(70px,13vw,150px) 0 clamp(60px,10vw,120px);overflow:hidden
}
.hero::after{
  content:"";position:absolute;right:-14%;top:-18%;width:58vw;height:58vw;max-width:720px;max-height:720px;
  border-radius:50%;background:radial-gradient(circle at 35% 35%,rgba(255,255,255,.75),rgba(166,138,117,.18) 62%,transparent 72%);
  pointer-events:none
}
.hero .wrap{position:relative;z-index:2;max-width:900px}
.hero h1{margin-bottom:.25em}
.hero .tagline{font-family:var(--serif);font-size:clamp(1.2rem,3.4vw,1.9rem);color:var(--darkbrown);font-style:italic;margin-bottom:1.1em}
.hero .lead{margin-bottom:2em}
.hero-meta{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:30px;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--darkbrown)}

.page-hero{background:var(--beige);padding:clamp(34px,5vw,60px) 0 clamp(26px,3.5vw,42px);border-bottom:1px solid var(--taupe)}
.page-hero h1{font-size:clamp(2.2rem,6vw,3.6rem)}

/* ---------- grids & cards ---------- */
.grid{display:grid;gap:22px}
.g2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.card{
  background:var(--white);border:1px solid var(--taupe);border-radius:var(--r);
  padding:30px 26px;display:flex;flex-direction:column;transition:.28s ease
}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.card h3{margin-bottom:.35em}
.card .price{font-family:var(--serif);font-size:1.85rem;color:var(--darkbrown);margin:0 0 .1em}
.card .meta{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mocha-ink);margin-bottom:1.1em}
.card p{font-size:.94rem}
.card .btn{margin-top:auto;align-self:flex-start}
.card-flat{background:var(--ivory)}
.sec-beige .card{background:var(--ivory)}

.thumb{
  aspect-ratio:4/5;background:linear-gradient(150deg,var(--beige),var(--taupe));
  border:1px solid var(--taupe);border-radius:var(--r);margin-bottom:20px;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);font-size:2.4rem;color:var(--white);letter-spacing:.08em
}
.thumb-wide{aspect-ratio:3/2;font-size:1.6rem}

/* ---------- steps ---------- */
.steps{counter-reset:s;display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.step{position:relative;padding-top:52px;border-top:1px solid var(--taupe)}
.step::before{
  counter-increment:s;content:"0" counter(s);position:absolute;top:14px;left:0;
  font-family:var(--serif);font-size:1.5rem;color:var(--mocha)
}
.step h3{font-size:1.12rem}
.step p{font-size:.92rem;margin:0}

/* ---------- pricing / table ---------- */
.tablewrap{overflow-x:auto;border:1px solid var(--taupe);border-radius:var(--r);background:var(--white)}
table{border-collapse:collapse;width:100%;min-width:520px;font-size:.94rem}
th,td{padding:15px 18px;text-align:left;border-bottom:1px solid var(--beige)}
th{font-family:var(--sans);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mocha-ink);font-weight:400;background:var(--ivory)}
tbody tr:last-child td{border-bottom:0}
td strong{font-weight:500;color:var(--black)}
.was{color:var(--taupe);text-decoration:line-through;margin-right:8px}

.plan{background:var(--white);border:1px solid var(--taupe);border-radius:var(--r);padding:36px 30px;display:flex;flex-direction:column}
.plan.featured{background:var(--black);color:var(--beige);border-color:var(--black)}
.plan.featured h3,.plan.featured .plan-price{color:var(--ivory)}
.plan.featured .plan-price span{color:var(--taupe)}
.plan-price{font-family:var(--serif);font-size:2.9rem;color:var(--black);margin:.1em 0 .4em}
.plan-price span{font-family:var(--sans);font-size:.8rem;letter-spacing:.12em;color:var(--mocha-ink)}
.ticks{list-style:none;margin:0 0 26px;padding:0}
.ticks li{position:relative;padding-left:26px;margin-bottom:11px;font-size:.94rem}
.ticks li::before{content:"";position:absolute;left:0;top:.62em;width:12px;height:1px;background:var(--mocha)}

/* ---------- reviews ---------- */
.quote{background:var(--ivory);border:1px solid var(--taupe);padding:30px 26px;border-radius:var(--r)}
.sec-beige .quote{background:var(--white)}
.quote p{font-family:var(--serif);font-size:1.16rem;font-style:italic;color:var(--darkbrown)}
.quote cite{display:block;font-style:normal;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mocha-ink)}
.stars{color:var(--mocha);letter-spacing:.2em;font-size:.85rem;margin-bottom:.6em}

/* ---------- last minute ---------- */
.lastmin{
  background:var(--darkbrown);color:var(--ivory);border-radius:var(--r);
  padding:clamp(34px,6vw,58px);display:flex;flex-wrap:wrap;align-items:center;
  justify-content:space-between;gap:26px
}
.lastmin h2{color:var(--ivory);margin-bottom:.2em}
.lastmin p{margin:0;max-width:52ch;color:var(--beige)}
.phone{font-family:var(--serif);font-size:clamp(1.5rem,4vw,2.1rem);color:var(--ivory);display:block;margin-top:.3em}

/* ---------- forms ---------- */
.form{background:var(--white);border:1px solid var(--taupe);border-radius:var(--r);padding:clamp(26px,4vw,42px)}
.sec-beige .form{background:var(--ivory)}
.field{margin-bottom:20px}
.field label{display:block;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mocha-ink);margin-bottom:8px}
.field input,.field select,.field textarea{
  width:100%;padding:14px 16px;border:1px solid var(--taupe);background:var(--ivory);
  border-radius:var(--r);font-family:var(--sans);font-size:1rem;color:var(--charcoal)
}
.sec-beige .field input,.sec-beige .field select,.sec-beige .field textarea{background:var(--white)}
.field input:focus,.field select:focus,.field textarea:focus{outline:1px solid var(--mocha);border-color:var(--mocha)}
.field textarea{min-height:130px;resize:vertical}
.field-row{display:grid;gap:0 20px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:.86rem;margin-bottom:22px}
.consent input{width:18px;height:18px;margin-top:4px;flex:0 0 auto}
.form-note{font-size:.8rem;color:var(--mocha-ink);margin-top:16px}
.notice{background:var(--beige);border-left:2px solid var(--mocha);padding:18px 22px;font-size:.92rem;border-radius:var(--r)}
.notice p:last-child{margin:0}

/* ---------- faq ---------- */
.faq-item{border-bottom:1px solid var(--taupe)}
.faq-item summary{
  cursor:pointer;list-style:none;padding:22px 40px 22px 0;position:relative;
  font-family:var(--serif);font-size:1.12rem;color:var(--black)
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";position:absolute;right:6px;top:20px;font-size:1.4rem;color:var(--mocha);transition:.2s}
.faq-item[open] summary::after{content:"–"}
.faq-item .answer{padding:0 0 22px;font-size:.96rem;max-width:78ch}
.faq-group{margin-bottom:48px}

/* ---------- legal / prose ---------- */
.prose{max-width:76ch}
.prose h2{font-size:clamp(1.5rem,3.4vw,2rem);margin-top:2em}
.prose h3{font-size:1.15rem;margin-top:1.6em}
.prose ul{padding-left:20px}
.prose li{margin-bottom:.5em}

/* ---------- footer ---------- */
.ftr{background:var(--black);color:var(--taupe);padding:70px 0 28px;font-size:.9rem}
.ftr a{color:var(--beige)}
.ftr a:hover{color:var(--white)}
.ftr h4{font-family:var(--sans);font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--mocha-ink);margin:0 0 18px}
.ftr .logo{color:var(--ivory)}
.ftr-grid{display:grid;gap:38px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));margin-bottom:48px}
.ftr ul{list-style:none;margin:0;padding:0}
.ftr li{margin-bottom:10px}
.social{display:flex;gap:16px;margin-top:16px}
.social a{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase}
.ftr-btm{border-top:1px solid #2a2a2a;padding-top:22px;display:flex;flex-wrap:wrap;gap:14px 26px;justify-content:space-between;font-size:.76rem;color:#7d7367}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;position:fixed;z-index:99;background:var(--black);color:var(--ivory);padding:12px 18px}

/* ======================================================================
   V2 — richer contrast, photography, new modules
   ====================================================================== */

/* deeper section tints */
.sec-beige{background:var(--beige)}
.sec-cream{background:var(--cream)}
.sec-mocha{background:var(--darkbrown);color:var(--beige)}
.sec-mocha h2,.sec-mocha h3{color:var(--ivory)}
.sec-mocha .eyebrow{color:var(--taupe)}
.sec-dark{background:var(--black)}
.card{border-color:#CDB59B}
.hdr{background:rgba(243,235,225,.94);border-bottom:1px solid var(--taupe)}
.btn-ghost{border-color:var(--darkbrown);color:var(--darkbrown)}
.btn-ghost:hover{background:var(--darkbrown);color:var(--ivory)}
.eyebrow{color:var(--mocha-ink)}

/* ---------- photo hero ---------- */
.hero-photo{position:relative;min-height:min(86vh,760px);display:flex;align-items:flex-end;
  background:var(--darkbrown);overflow:hidden;padding:0}
.hero-photo::after{display:none}
.hero-photo img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:72% 30%}
.hero-photo .veil{position:absolute;inset:0;
  background:linear-gradient(100deg,rgba(15,11,11,.92) 0%,rgba(15,11,11,.78) 40%,rgba(15,11,11,.40) 70%,rgba(15,11,11,.22) 100%),
             linear-gradient(180deg,rgba(15,11,11,.50) 0%,rgba(15,11,11,0) 32%)}
@media(max-width:760px){
  .hero-photo .veil{background:linear-gradient(180deg,rgba(15,11,11,.60) 0%,rgba(15,11,11,.70) 45%,rgba(15,11,11,.92) 100%)}
  .hero-photo img.bg{object-position:70% 26%}
}
.hero-photo .wrap{position:relative;z-index:3;padding-top:104px;padding-bottom:clamp(40px,6vw,72px);max-width:var(--maxw)}
.hero-photo .btn-outline{background:rgba(255,255,255,.10);border:1px solid #F3EBE1;color:#F3EBE1;backdrop-filter:blur(2px)}
.hero-photo .btn-outline:hover{background:#F3EBE1;color:var(--black)}
.hero-photo h1,.hero-photo .tagline{color:var(--ivory)}
.hero-photo .lead{color:#EDE2D5}
.hero-photo .eyebrow{color:var(--taupe)}
.hero-photo .hero-meta{color:#EADFCF}
.hero-name{font-family:var(--serif);color:var(--ivory);letter-spacing:.30em;text-transform:uppercase;
  font-size:clamp(1.1rem,3vw,1.5rem);margin:0 0 18px;line-height:1;white-space:nowrap}

/* ---------- media & split ---------- */
.media{position:relative;border-radius:var(--r);overflow:hidden;background:var(--beige)}
.media img{width:100%;height:100%;object-fit:cover;display:block}
.media-4x5{aspect-ratio:4/5}
.media-3x2{aspect-ratio:3/2}
.media-3x4{aspect-ratio:3/4}
.media-1x1{aspect-ratio:1/1}
.split{display:grid;gap:clamp(28px,5vw,64px);grid-template-columns:repeat(auto-fit,minmax(320px,1fr));align-items:center}
.split-text h2{margin-top:0}
.badge{display:inline-block;font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;
  background:var(--darkbrown);color:var(--ivory);padding:6px 12px;border-radius:var(--r);margin-bottom:14px}
.badge-light{background:var(--beige);color:var(--darkbrown)}

/* ---------- service cards with photo ---------- */
.svc{background:var(--white);border:1px solid #CDB59B;border-radius:var(--r);overflow:hidden;
  display:flex;flex-direction:column;transition:.28s ease}
.svc:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.svc .media{border-radius:0}
.svc-body{padding:26px 24px 28px;display:flex;flex-direction:column;flex:1}
.svc-body h3{margin-bottom:.25em}
.svc .price{font-family:var(--serif);font-size:1.7rem;color:var(--darkbrown);margin:0}
.svc .meta{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mocha-ink);margin:2px 0 14px}
.svc p{font-size:.93rem}
.svc .btn{margin-top:auto;align-self:flex-start}
.svc-row{display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(270px,1fr))}
.svc-wide{display:grid;grid-template-columns:minmax(240px,1fr) 1.35fr;gap:0;background:var(--white);
  border:1px solid #CDB59B;border-radius:var(--r);overflow:hidden;margin-bottom:26px}
.svc-wide .media{border-radius:0;height:100%;min-height:230px}
.svc-wide .svc-body{padding:clamp(24px,3.4vw,40px)}
@media(max-width:700px){.svc-wide{grid-template-columns:1fr}}

/* ---------- visual steps (how it works) ---------- */
.vsteps{display:grid;gap:0;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));counter-reset:v}
.vstep{position:relative;padding:34px 22px;background:var(--white);border:1px solid #CDB59B;margin:-.5px}
.vstep-ico{width:56px;height:56px;border-radius:50%;background:var(--darkbrown);color:var(--ivory);
  display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:1.35rem;margin-bottom:20px}
.vstep h3{font-size:1.08rem;margin-bottom:.3em}
.vstep p{font-size:.9rem;margin:0}
.vstep-or{display:block;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mocha-ink);margin-top:10px}

/* ---------- accordion ---------- */
.acc{border-top:1px solid var(--taupe)}
.acc details{border-bottom:1px solid var(--taupe)}
.acc summary{cursor:pointer;list-style:none;padding:20px 40px 20px 0;position:relative;
  font-family:var(--serif);font-size:1.1rem;color:var(--black)}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";position:absolute;right:6px;top:18px;font-size:1.4rem;color:var(--mocha)}
.acc details[open] summary::after{content:"\2013"}
.acc .answer{padding:0 0 20px;font-size:.95rem;max-width:74ch}

/* ---------- loyalty progress ---------- */
.progress{background:var(--white);border:1px solid #CDB59B;border-radius:var(--r);padding:clamp(26px,4vw,40px);text-align:center}
.dots{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:0 0 22px}
.dot{width:34px;height:34px;border-radius:50%;border:1px solid var(--taupe);background:var(--ivory);
  display:flex;align-items:center;justify-content:center;font-size:.72rem;color:var(--taupe)}
.dot.on{background:var(--darkbrown);border-color:var(--darkbrown);color:var(--ivory)}
.dot.gift{background:var(--mocha);border-color:var(--mocha);color:var(--ivory);font-size:.9rem}
.progress .count{font-family:var(--serif);font-size:1.6rem;color:var(--black);margin:0 0 .2em}
.progress .until{font-size:.86rem;letter-spacing:.06em;color:var(--mocha-ink);margin:0}

/* ---------- artist cards ---------- */
.artist{display:block;background:var(--white);border:1px solid #CDB59B;border-radius:var(--r);
  overflow:hidden;transition:.28s ease;color:inherit}
.artist:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.artist .media{border-radius:0}
.artist-body{padding:22px 22px 26px}
.artist-body h3{margin-bottom:.15em}
.artist-body .meta{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mocha-ink);margin-bottom:12px}
.artist-body p{font-size:.92rem;margin-bottom:.7em}
.artist-link{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--darkbrown);border-bottom:1px solid var(--taupe);padding-bottom:3px}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.tag{font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;background:var(--beige);color:var(--darkbrown);padding:5px 10px;border-radius:var(--r)}
.gallery{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}

/* ---------- helper / chooser ---------- */
.chooser{background:var(--darkbrown);color:var(--beige);border-radius:var(--r);padding:clamp(28px,5vw,52px)}
.chooser h2{color:var(--ivory);margin-bottom:.3em}
.chooser p{color:var(--beige)}
.chooser select{width:100%;max-width:420px;padding:14px 16px;border:1px solid var(--taupe);
  background:var(--ivory);color:var(--charcoal);font-family:var(--sans);font-size:1rem;border-radius:var(--r)}
.chooser-out{margin-top:22px;padding:20px 22px;background:rgba(243,235,225,.10);
  border-left:2px solid var(--taupe);border-radius:var(--r);display:none}
.chooser-out.show{display:block}
.chooser-out h3{margin-bottom:.2em}
.chooser-out p{margin-bottom:1em}

/* ---------- misc ---------- */
.pill-row{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 0}
.pill{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;border:1px solid var(--taupe);
  color:var(--darkbrown);padding:8px 14px;border-radius:999px}
.quote{background:var(--white);border-color:#CDB59B}
.sec-beige .quote{background:var(--cream)}
.figure-caption{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mocha-ink);margin-top:10px}
.vstep-num{font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;color:var(--mocha);margin:0 0 6px}
.vstep-ico svg{stroke:var(--ivory)}

/* ======================================================================
   V3 — compact rhythm, service finder, artist tweaks
   ====================================================================== */

/* compact Last Minute banner (replaces the full-height block) */
.lastmin-bar{
  background:var(--darkbrown);color:var(--beige);border-radius:var(--r);
  padding:26px clamp(22px,3.4vw,38px);display:flex;flex-wrap:wrap;align-items:center;
  justify-content:space-between;gap:18px 30px
}
.lastmin-bar h3{color:var(--ivory);margin:0 0 4px;font-size:1.3rem}
.lastmin-bar p{margin:0;color:var(--beige);font-size:.92rem;max-width:64ch}
.lastmin-bar .btn{flex:0 0 auto}

/* tighter sections — the site was too airy */
.sec-tight{padding:clamp(26px,3.4vw,40px) 0}
/* Deux sections de meme fond qui se suivent ne doivent pas cumuler leurs marges. */
.sec-beige + .sec-beige,.sec-tight + .sec-tight{padding-top:0}
.sec-tight h2{margin-bottom:.35em}
/* Trois avantages : plus d'air vertical, titres un cran au-dessus, et une
   separation tres fine entre les colonnes plutot que trois blocs poses. */
.pillars{display:grid;gap:0;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.pillar{display:flex;gap:16px;align-items:flex-start;padding:34px 34px 34px 0}
.pillar + .pillar{border-left:1px solid rgba(138,98,68,.16);padding-left:34px}
.pillar-n{font-family:var(--serif);font-size:1.25rem;color:var(--mocha);line-height:1.25;flex:0 0 auto}
.pillar h3{font-size:1.14rem;margin:0 0 .35em;letter-spacing:.01em}
.pillar p{font-size:.92rem;margin:0}
@media (max-width:719px){
  .pillar{padding:22px 0}
  .pillar + .pillar{border-left:0;border-top:1px solid rgba(138,98,68,.16);padding-left:0;padding-top:22px}
}

/* centred CTA under a card row */
.cta-center{display:flex;justify-content:center;margin-top:38px}

/* slimmer brown membership strip */
.strip{
  background:var(--darkbrown);color:var(--beige);border-radius:var(--r);
  padding:26px clamp(22px,3.4vw,38px);display:flex;flex-wrap:wrap;align-items:center;
  justify-content:space-between;gap:16px 30px
}
.strip h3{color:var(--ivory);margin:0 0 3px;font-size:1.25rem}
.strip p{margin:0;color:var(--beige);font-size:.92rem;max-width:62ch}
.strip .btn{flex:0 0 auto}

/* service finder */
.finder{background:var(--white);border:1px solid #CDB59B;border-radius:var(--r);padding:clamp(26px,4vw,44px)}
.finder-grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin-top:26px}
.finder .field{margin:0}
.finder-out{margin-top:26px;border-top:1px solid var(--taupe);padding-top:26px;display:none}
.finder-out.show{display:block}
.finder-res{display:grid;gap:24px;grid-template-columns:minmax(180px,240px) 1fr;align-items:start}
@media(max-width:640px){.finder-res{grid-template-columns:1fr}}
.finder-res h3{margin:.1em 0 .2em}
.finder-price{font-family:var(--serif);font-size:1.5rem;color:var(--darkbrown);margin:0 0 .3em}
.finder-hint{font-size:.82rem;color:var(--mocha);margin-top:16px}
.finder-alt{font-size:.88rem;margin-top:14px}

/* two clearly distinct offers (lesson vs training) */
.offer{border:1px solid #CDB59B;border-radius:var(--r);overflow:hidden;background:var(--white);display:grid;
  grid-template-columns:minmax(200px,.8fr) 1.4fr}
.offer + .offer{margin-top:26px}
.offer .media{border-radius:0;height:100%;min-height:210px}
.offer-body{padding:clamp(22px,3vw,34px)}
.offer-kicker{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mocha);margin:0 0 8px}
.offer-pro{background:var(--black);color:var(--beige);border-color:var(--black)}
.offer-pro h3{color:var(--ivory)}
.offer-pro .offer-kicker{color:var(--taupe)}
.offer-pro .ticks li::before{background:var(--taupe)}
@media(max-width:700px){.offer{grid-template-columns:1fr}}

/* ---------- real logo (client artwork) ---------- */
.logo img{height:32px;width:auto;display:block}
.logo{display:block;line-height:1}
.logo small{display:block;font-family:var(--sans);font-size:.5rem;letter-spacing:.28em;color:var(--mocha-ink);margin-top:7px;text-transform:uppercase}
.logo-ftr img{height:34px;margin-bottom:4px}
.hero-logo-img{width:min(340px,62vw);height:auto;margin:0 0 26px}
@media(max-width:960px){.logo img{height:22px}.logo small{font-size:.45rem;letter-spacing:.24em}}

/* ======================================================================
   V4 — Sarah Lascar : resserrage, finder redesign, uniformite
   ====================================================================== */

/* ---- Service Finder redesign (fini le look formulaire) ---- */
.finder{background:linear-gradient(160deg,var(--white),#F7F1E9);border:1px solid #CDB59B;
  border-radius:6px;padding:clamp(24px,3.4vw,40px);box-shadow:var(--shadow)}
.finder-step{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mocha);margin:0 0 12px;display:block}
.finder-grid{display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin-top:8px}
/* chips a la place des selects */
.chips{display:flex;flex-wrap:wrap;gap:9px}
.chip-btn{font-family:var(--sans);font-size:.82rem;letter-spacing:.02em;padding:10px 15px;border-radius:999px;
  border:1px solid var(--taupe);background:var(--ivory);color:var(--charcoal);cursor:pointer;transition:.18s ease;line-height:1}
.chip-btn:hover{border-color:var(--mocha);color:var(--black)}
.chip-btn[aria-pressed="true"]{background:var(--darkbrown);border-color:var(--darkbrown);color:var(--ivory)}
/* ---- Chips de formulaire (cases a cocher presentees en pastilles) ---- */
.chips-label{display:block;font-family:var(--sans);font-size:.78rem;letter-spacing:.09em;text-transform:uppercase;
  color:var(--mocha-ink);margin-bottom:11px}
.chip{display:inline-block;cursor:pointer;line-height:0}
.chip input{position:absolute;opacity:0;width:1px;height:1px}
.chip span{display:inline-block;font-family:var(--sans);font-size:.82rem;letter-spacing:.02em;padding:10px 15px;
  border-radius:999px;border:1px solid var(--taupe);background:var(--ivory);color:var(--charcoal);
  transition:.18s ease;line-height:1;user-select:none}
.chip:hover span{border-color:var(--mocha);color:var(--black)}
.chip input:checked + span{background:var(--darkbrown);border-color:var(--darkbrown);color:var(--ivory)}
.chip input:focus-visible + span{outline:2px solid var(--darkbrown);outline-offset:3px}

/* ---- Espace client : panneaux a deux colonnes ---- */
.acc-two{display:grid;grid-template-columns:1.05fr .95fr;gap:22px;align-items:start}
@media(max-width:820px){.acc-two{grid-template-columns:1fr}}
.card-soft{background:#FCFAF7;border:1px solid rgba(138,98,68,.16)}
.acc-table td.num,.acc-table th.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}

/* ---- Reservation : completion d'adresse ---- */
.bk-ac{position:relative}
.bk-ac-list{position:absolute;z-index:40;left:0;right:0;top:calc(100% - 42px);margin:0;padding:6px 0;
  list-style:none;background:#fff;border:1px solid var(--taupe);border-radius:4px;
  box-shadow:0 10px 26px rgba(60,40,25,.13);max-height:250px;overflow:auto}
.bk-ac-list li{padding:10px 14px;font-size:.9rem;cursor:pointer;line-height:1.35}
.bk-ac-list li:hover,.bk-ac-list li:focus{background:#F7F2EC;outline:none}
.bk-ok{color:#2a7a2a}



.finder-block h3{font-family:var(--serif);font-size:1.12rem;margin:0 0 14px}
.finder-hint{font-size:.82rem;color:var(--mocha);margin-top:20px}
.finder-hint a{color:var(--darkbrown);border-bottom:1px solid var(--taupe)}
.finder-out{margin-top:26px;border-top:1px solid var(--taupe);padding-top:26px;display:none}
.finder-out.show{display:block}

/* ---- How it works : 5 etapes aerees, 3+2 ---- */
.vsteps{gap:20px}
.vstep{padding:30px 24px;border-radius:4px}
.vsteps.v32{grid-template-columns:repeat(3,1fr)}
.vsteps.v32 .vstep:nth-child(4),.vsteps.v32 .vstep:nth-child(5){grid-column:span 1}
.vsteps-row2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;max-width:66%;margin:20px auto 0}
@media(max-width:820px){.vsteps.v32{grid-template-columns:1fr 1fr}.vsteps-row2{grid-template-columns:1fr;max-width:none}}
@media(max-width:560px){.vsteps.v32{grid-template-columns:1fr}}
.cta-center{margin-top:30px}

/* ---- Our Artists : cartes allegees, portraits uniformes ---- */
.artist .media{aspect-ratio:3/4}
.artist-body{padding:20px 20px 24px}
.tags{gap:7px;margin:0 0 12px}
.tag{font-size:.6rem;padding:4px 9px}

/* ---- Membership : moins de vide dans/autour des cartes ---- */
.plan{padding:30px 26px}
.plan .ticks li{margin-bottom:9px}
.acc summary{padding:16px 40px 16px 0;font-size:1.05rem}
.acc .answer{padding:0 0 16px}

/* ---- alternance de fond douce (evite le tout-beige) ---- */
.sec-cream{background:var(--cream)}

/* ---- page-hero un peu plus compact deja fait globalement ---- */
.page-hero h1{margin-bottom:.15em}
.page-hero .lead{max-width:60ch}

/* ---- V5 : carte artiste unique (fondatrice seule) ne s'étire pas ---- */
.grid.g3:has(> .artist:only-child){grid-template-columns:minmax(0,360px);justify-content:center}
@media(min-width:760px){
  .grid.g3:has(> .artist:only-child){justify-content:start}
}

/* V4 - booking journey + soft strip */
.journey{list-style:none;margin:36px 0 0;padding:0;display:grid;gap:22px;grid-template-columns:repeat(4,1fr);counter-reset:j}
.journey li{position:relative;padding:22px 20px 20px;background:var(--ivory,#FBF7F1);border:1px solid #DFCFBB;border-radius:var(--r)}
.journey-n{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--darkbrown,#4A3323);color:#F3EBE1;font-family:var(--serif);font-size:1.1rem;margin-bottom:12px}
.journey h3{font-size:1.15rem;margin:0 0 6px}
.journey p{font-size:.9rem;margin:0}
.journey li:not(:last-child)::after{content:"\2192";position:absolute;right:-17px;top:50%;transform:translateY(-50%);color:#8A6244;font-size:1rem}
@media(max-width:900px){.journey{grid-template-columns:1fr 1fr}.journey li::after{display:none}}
@media(max-width:560px){.journey{grid-template-columns:1fr}}
.strip.strip-soft{background:var(--beige,#EFE6DA);color:inherit}
.strip.strip-soft h3,.strip.strip-soft p{color:inherit}
.field .label{display:block;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px}
@media(min-width:1000px){.svc-row{grid-template-columns:repeat(4,1fr);gap:20px}.svc-body h3{font-size:1.3rem}}
/* V4 - header account */
.hdr-account{display:inline-flex;align-items:center;gap:6px;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--charcoal);text-decoration:none;margin-right:6px}
.hdr-account:hover{color:var(--mocha)}
@media(max-width:960px){.hdr-account span{display:none}}
/* V4 - demo banner */
.demo-banner{background:#FFF8EC;border:1px dashed var(--taupe);padding:12px 16px;font-size:.88rem;margin-bottom:26px;border-radius:var(--r)}
.page-hero-sm{padding-top:48px;padding-bottom:36px}
/* V4 - booking */
.bk-progress{list-style:none;display:flex;gap:8px;padding:0;margin:0 0 28px;counter-reset:bp;flex-wrap:wrap}
.bk-progress li{counter-increment:bp;flex:1;min-width:130px;border-top:3px solid var(--beige);padding-top:8px;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--taupe)}
.bk-progress li::before{content:counter(bp) ". "}
.bk-progress li.on{border-color:var(--darkbrown);color:var(--darkbrown)}
.bk-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:34px;align-items:start}
@media(max-width:900px){.bk-layout{grid-template-columns:minmax(0,1fr)}}
.bk-main h2{margin-top:0}
.bk-sub{font-size:1.05rem;margin:24px 0 10px}
.bk-services{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-bottom:18px}
.bk-svc{display:grid;grid-template-columns:1fr auto;gap:2px 10px;text-align:left;background:#fff;border:1px solid #DFCFBB;border-radius:var(--r);padding:14px 16px;cursor:pointer;font:inherit;color:inherit}
.bk-svc:hover{border-color:var(--mocha)}
.bk-svc.on{border-color:var(--darkbrown);box-shadow:inset 0 0 0 1px var(--darkbrown);background:#FBF7F1}
.bk-svc-name{font-family:var(--serif);font-size:1.12rem}
.bk-svc-meta{grid-column:1;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mocha)}
.bk-svc-price{grid-column:2;grid-row:1/3;align-self:center;font-family:var(--serif);font-size:1.3rem}
.bk-opt-note{font-size:.9rem;color:var(--mocha);margin:6px 0}
.bk-days{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px}
.bk-day{flex:0 0 70px;display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 4px;background:#fff;border:1px solid #DFCFBB;border-radius:var(--r);cursor:pointer;font:inherit;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:inherit}
.bk-day strong{font-family:var(--serif);font-size:1.4rem;font-weight:400;letter-spacing:0}
.bk-day.on{background:var(--darkbrown);color:#F3EBE1;border-color:var(--darkbrown)}
.bk-day:disabled{opacity:.35;cursor:not-allowed;text-decoration:line-through}
.bk-times{display:flex;flex-wrap:wrap;gap:8px}
.bk-times .chip-btn:disabled{opacity:.35;cursor:not-allowed;text-decoration:line-through}
.bk-times .chip-btn.on{background:var(--darkbrown);color:#F3EBE1}
.bk-card{border:1px solid #DFCFBB;background:#fff;padding:16px 18px;border-radius:var(--r);margin:18px 0}
.bk-inline{display:flex;gap:8px;align-items:center}.bk-inline input{flex:1}
.bk-summary{position:sticky;top:96px;background:#fff;border:1px solid #DFCFBB;border-radius:var(--r);padding:22px}
.bk-line{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid #EFE6DA;font-size:.92rem}
.bk-muted{color:var(--mocha);font-size:.85rem}
.bk-good{color:#3F6B45}
.bk-total{font-family:var(--serif);font-size:1.25rem;border-bottom:0;padding-top:12px}
.bk-done{text-align:center;background:#fff;border:1px solid #DFCFBB;padding:36px 26px;border-radius:var(--r)}
.bk-done #bk-done-summary{text-align:left;max-width:420px;margin:18px auto}
.bk-check{width:56px;height:56px;border-radius:50%;background:var(--darkbrown);color:#F3EBE1;display:flex;align-items:center;justify-content:center;font-size:1.6rem;margin:0 auto 10px}
/* V4 - account */
.acc-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:34px;align-items:start}
@media(max-width:820px){.acc-layout{grid-template-columns:1fr}}
.acc-nav{display:flex;flex-direction:column;border:1px solid #DFCFBB;background:#fff;border-radius:var(--r)}
@media(max-width:820px){.acc-nav{flex-direction:row;overflow-x:auto}}
.acc-nav a{padding:13px 18px;border-bottom:1px solid #EFE6DA;text-decoration:none;color:var(--charcoal);font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.acc-nav a.on{background:var(--darkbrown);color:#F3EBE1}
.acc-main h2{margin-top:0}
.acc-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.acc-appt{display:flex;justify-content:space-between;gap:18px;align-items:center;flex-wrap:wrap;background:#fff;border:1px solid #DFCFBB;border-radius:var(--r);padding:18px 20px;margin-bottom:12px}
.acc-appt h3{margin:4px 0}.acc-appt p{margin:0}
.acc-appt.is-cancelled{opacity:.5}
.acc-table{width:100%;border-collapse:collapse;background:transparent;font-size:.95rem}
.acc-table th,.acc-table td{text-align:left;padding:17px 20px;border-bottom:1px solid rgba(138,98,68,.14)}
.acc-table thead th{font-family:var(--sans);font-size:.67rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--mocha-ink);font-weight:500;background:transparent;padding-bottom:12px;
  border-bottom:1px solid rgba(138,98,68,.34)}
.acc-table tbody tr:last-child td{border-bottom:0}
.acc-table tbody td:first-child{font-family:var(--serif);font-size:1.02rem;color:var(--black);font-weight:400}
.acc-table td.num,.acc-table th.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.acc-table .hi{background:rgba(138,98,68,.05)}
.acc-table thead th.hi{color:var(--darkbrown);background:rgba(138,98,68,.07)}
.acc-table tbody td.hi{color:var(--black);font-weight:500}
.acc-table tbody tr:hover td{background:rgba(138,98,68,.035)}
.acc-table tbody tr:hover td.hi{background:rgba(138,98,68,.085)}
@media(max-width:620px){.acc-table th,.acc-table td{padding:13px 12px;font-size:.88rem}
  .acc-table tbody td:first-child{font-size:.95rem}}
.acc-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}
.acc-photos figure{margin:0}
.bk-inline input{font:inherit;padding:11px 12px;border:1px solid #CDB59B;background:#fff;border-radius:var(--r);color:inherit}
.bk-main .field input{background:#fff}

/* ---- V4.1: account details, 48h lock, receipts, reviews, allergies ---- */
.bk-q{margin:0 0 10px;font-size:.95rem}
.acc-appt-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.acc-lock{font-size:.8rem;color:var(--mocha);max-width:260px;margin:0}
.acc-details{flex-basis:100%;border-top:1px solid #EFE6DA;padding-top:14px;margin-top:4px}
.acc-details dl{display:grid;grid-template-columns:minmax(120px,190px) 1fr;gap:6px 16px;margin:0;font-size:.9rem}
.acc-details dt{color:var(--mocha);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;padding-top:3px}
.acc-details dd{margin:0}
@media(max-width:560px){.acc-details dl{grid-template-columns:1fr}.acc-details dd{margin-bottom:6px}}
.acc-history td:last-child{white-space:nowrap}
.acc-history a,.acc-history button.linklike{margin-right:10px}
.linklike{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;cursor:pointer}
.stars{display:flex;gap:4px}
.stars button{background:none;border:0;font-size:1.7rem;line-height:1;color:#DFCFBB;cursor:pointer;padding:0 2px}
.stars button.on{color:var(--darkbrown)}
.acc-review-item{background:#fff;border:1px solid #DFCFBB;border-radius:var(--r);padding:14px 18px;margin-top:14px}
.receipt{background:#fff;border:1px solid #DFCFBB;border-radius:var(--r);padding:34px;max-width:720px}
.rc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;border-bottom:1px solid #EFE6DA;padding-bottom:18px;margin-bottom:18px}
.rc-head img{width:170px;height:auto}
.rc-head h1{margin:0;font-size:2rem;text-align:right}.rc-head p{margin:0;text-align:right;color:var(--mocha)}
.rc-parties{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:18px}
.rc-parties p{margin:0}
.rc-table td:last-child{text-align:right}
.rc-table tr.rc-total td{font-family:var(--serif);font-size:1.25rem;border-bottom:0}
.lang-switch{display:flex;gap:2px;align-items:center;font-size:.72rem;letter-spacing:.1em}
.lang-switch a{padding:4px 5px;text-decoration:none;color:var(--mocha)}
.lang-switch a[aria-current="true"]{color:var(--black);font-weight:500;border-bottom:1px solid currentColor}
@media print{
  .hdr,.ftr,.sticky-cta,.no-print,.skip{display:none!important}
  body{background:#fff}.receipt{border:0;padding:0;max-width:none}
}
.logo{flex-shrink:0}
.lang-switch{flex-shrink:0}
@media(min-width:961px) and (max-width:1320px){
  .nav{gap:16px}.nav a{font-size:.7rem;letter-spacing:.1em}
  .hdr-cta{gap:8px}.hdr-account span{display:none}.hdr-account{margin-right:0}
}
@media(min-width:961px) and (max-width:1140px){
  .hdr-in{gap:12px}.logo img{height:24px}
  .nav{gap:12px}.nav a{font-size:.64rem;letter-spacing:.06em}
  .hdr-cta .btn-sm{padding-left:14px;padding-right:14px}
}

/* ---- V4.2: slim final CTA, service categories, accordion ---- */
.sec-cta-slim{padding:44px 0}
.cta-slim{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.cta-slim h2{margin:0 0 4px;font-size:1.9rem}
@media(max-width:700px){.cta-slim{justify-content:flex-start}}
.cat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin-top:34px}
.cat{margin:0}
.cat-btn{display:block;width:100%;text-align:left;background:#fff;border:1px solid #DFCFBB;border-radius:var(--r);padding:0;cursor:pointer;font:inherit;color:inherit;overflow:hidden}
.cat-btn:hover{border-color:var(--mocha)}
.cat-btn[aria-expanded="true"]{border-color:var(--darkbrown);box-shadow:inset 0 0 0 1px var(--darkbrown)}
.cat-btn .media{border-radius:0}
.cat-body{display:block;padding:18px 20px 22px}
.cat-title{display:block;font-family:var(--serif);font-size:1.45rem;margin-bottom:6px}
.cat-list{display:block;font-size:.85rem;color:var(--mocha);margin-bottom:14px}
.cat-cta{display:inline-block;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;border-bottom:1px solid var(--mocha);padding-bottom:3px}
.cat-panel{background:#fff;border:1px solid #DFCFBB;border-radius:var(--r);padding:30px 32px;margin-top:20px}
.cat-panel h3{margin-top:0}
.cat-panel h4{margin:10px 0 6px;font-size:1.15rem}
.svc-detail{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:26px;margin:22px 0 10px}
/* separation nette entre la lecon et la formation (demande de Sarah, 24/09) */
.svc-split{gap:0}
.svc-split>div{padding:4px 34px}
.svc-split>div:first-child{padding-left:0}
.svc-split>div:last-child{padding-right:0;border-left:1px solid rgba(138,98,68,.22)}
@media(max-width:760px){
  .svc-split>div{padding:0}
  .svc-split>div:last-child{border-left:0;border-top:1px solid rgba(138,98,68,.22);margin-top:26px;padding-top:26px}
}
@media(max-width:600px){.cat-panel{padding:22px 20px}}

/* ---- V4.2: multi-service cart + automatic travel zone ---- */
.bk-cart{margin:18px 0 6px}
.bk-item{background:#fff;border:1px solid #DFCFBB;border-radius:var(--r);padding:12px 14px;margin-bottom:10px}
.bk-item-main{display:flex;justify-content:space-between;gap:12px;font-size:.95rem}
.bk-item-price{font-family:var(--serif);font-size:1.1rem}
.bk-item-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:8px;font-size:.85rem}
.bk-item-row label{display:flex;align-items:center;gap:8px;margin:0}
.bk-item-row input[type=number]{width:70px;padding:6px 8px}
.bk-zone-box{margin-top:10px;padding:12px 14px;border-radius:var(--r);background:var(--beige);font-size:.88rem}
.bk-zone-box.is-ok{background:#F1F5EE;border-left:2px solid #5E7F5B}
.bk-zone-box.is-quote{background:#FFF4E8;border-left:2px solid var(--mocha)}
.bk-zone-box .btn{margin-top:8px}
/* Travel page: slightly tighter vertical rhythm (client request 17/09) */
.page-travel section{padding:clamp(32px,4.4vw,56px) 0}
.page-travel .sec-tight{padding:clamp(24px,3.2vw,40px) 0}
.page-travel .split{gap:30px}

/* --------------------------------------------------------------------------
   Tableaux larges sur petits ecrans - corrige le 25/09/2026.
   Mesure avant correction : la page membership.html s'etendait sur 542 px
   dans une fenetre de 390 px, soit 152 px de defilement horizontal, et les
   colonnes "Member price" et "You save" etaient hors de l'ecran.
   Le tableau defile desormais a l'interieur de lui-meme ; la page ne
   s'elargit plus. (point A3 de l'audit du 24/09)
   -------------------------------------------------------------------------- */
/* Sur petit ecran, le defilement lateral n'a pas suffi : confirme sur un
   vrai telephone par Sarah Lascar le 25/09/2026 a 16h03. On retire donc la
   colonne "You save", qui se deduit des deux autres (public - membre), et on
   resserre la typographie. Trois colonnes tiennent dans 390 px. */
@media (max-width: 620px){
  /* Un tableau ne peut pas etre plus etroit que son contenu minimal : c'est
     ce qui elargissait la page a 542 px. table-layout:fixed force les
     colonnes a respecter la largeur disponible au lieu de l'imposer. */
  /* CAUSE REELLE, trouvee le 25/09 a 16h10 : la regle generale
     "table{min-width:520px}" (ligne 158) s'applique aussi a .acc-table, qui
     n'est pas dans un .tablewrap a defilement. C'est ce min-width qui
     elargissait la page a 542 px, et non le contenu du tableau - c'est
     pourquoi masquer une colonne n'avait rien change. */
  /* Deux cas differents, et une seule regle ne peut pas les servir.

     a) Les tableaux de 3 ou 4 colonnes (prix membres) tiennent dans 390 px
        si on lève le min-width herite de la regle generale "table" et si on
        retire la colonne deductible. Ils restent lisibles.

     b) Les tableaux de 5 colonnes (frais de deplacement) ne tiennent pas :
        les y forcer coupe les mots au milieu - "SERVIC ES AT THE SAME
        ADDRE SS". Signale par Sarah Lascar le 25/09 a 17h11. Ceux-la
        doivent DEFILER dans leur propre cadre, pas se comprimer. */

  /* (a) jusqu'a 4 colonnes : on fait tenir */
  .acc-table{ font-size:.86rem; min-width:0; }
  .acc-table th,.acc-table td{ padding:12px 10px; }
  .acc-table td.num,.acc-table th.num{ white-space:normal; }
  .acc-table.fit{ width:100%; max-width:100%; table-layout:fixed; }
  .acc-table.fit th:nth-child(4),
  .acc-table.fit td:nth-child(4){ display:none; }

  /* (b) au-dela : defilement dans le cadre, mots jamais coupes */
  .acc-table.wide{ display:block; overflow-x:auto; -webkit-overflow-scrolling:touch;
                   white-space:nowrap; }
  .acc-table.wide th,.acc-table.wide td{ white-space:nowrap; }
}

/* Indication de defilement, visible sur petit ecran uniquement : un tableau
   qui defile dans son cadre ne le dit pas, et rien ne signale qu'il reste des
   colonnes a droite. */
.scroll-hint{display:none}
@media (max-width: 620px){
  .scroll-hint{
    display:block;margin:10px 0 0;font-family:var(--sans);font-size:.74rem;
    letter-spacing:.12em;text-transform:uppercase;color:var(--mocha-ink);opacity:.8;
  }
}

/* Conditions repliables sur mobile (Membership) */
.m-fold>summary{display:none}
@media (max-width:720px){
  .m-fold{margin-top:22px;border-top:1px solid var(--taupe);border-bottom:1px solid var(--taupe)}
  .m-fold>summary{display:block;cursor:pointer;list-style:none;position:relative;padding:14px 36px 14px 0;
    font-family:var(--sans);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mocha-ink)}
  .m-fold>summary::-webkit-details-marker{display:none}
  .m-fold>summary::after{content:"+";position:absolute;right:6px;top:10px;font-size:1.3rem;color:var(--mocha)}
  .m-fold[open]>summary::after{content:"\2013"}
  .m-fold>.notice,.m-fold>.grid{margin-top:8px!important}
}

#choose-plan[hidden]{display:none}

/* Contact : respiration entre les categories (Sarah, 29/09) */
.reach p{margin:0 0 22px}
.reach a{text-decoration:underline;text-underline-offset:3px}

/* Travel : tableau unique (Sarah, 29/09) */
.tt-one .tr-group td{font-family:var(--sans)!important;font-size:.68rem!important;letter-spacing:.16em;text-transform:uppercase;color:var(--mocha)!important;background:rgba(138,98,68,.07);padding:12px 20px}
.tt-one .tr-sub th{font-size:.82rem;letter-spacing:.04em;text-transform:none;color:var(--darkbrown);font-weight:500;padding-top:2px}
.tt-one .tt-note{font-family:var(--sans);font-size:.78rem;color:var(--mocha)}
.link-u{text-decoration:underline;text-underline-offset:3px}

/* Travel : version mobile du tableau, par zone (Sarah, 29/09) */
.tt-mob{display:none}
@media (max-width:720px){
  .tt-desk,.tt-desk + .scroll-hint{display:none!important}
  .tt-mob{display:block;margin-top:24px}
  .tt-free{display:flex;justify-content:space-between;align-items:baseline;background:#fff;border:1px solid #DFCFBB;border-radius:var(--r);padding:16px 18px;margin-bottom:10px;font-family:var(--serif);font-size:1.1rem}
  .tt-free strong{font-family:var(--sans);font-weight:500;font-size:.95rem}
  .tt-zone{background:#fff;border:1px solid #DFCFBB;border-radius:var(--r);margin-bottom:10px}
  .tt-zone summary{list-style:none;cursor:pointer;position:relative;padding:16px 44px 16px 18px;display:flex;flex-direction:column;gap:2px}
  .tt-zone summary::-webkit-details-marker{display:none}
  .tt-zone summary span{font-family:var(--serif);font-size:1.1rem;color:var(--black)}
  .tt-zone summary small{font-size:.85rem;letter-spacing:.02em;color:var(--darkbrown);font-weight:500}
  .tt-zone summary::after{content:"+";position:absolute;right:18px;top:16px;font-size:1.4rem;color:var(--mocha)}
  .tt-zone[open] summary::after{content:"\2013"}
  .tt-zone ul{list-style:none;margin:0;padding:0 18px 12px}
  .tt-zone li{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-top:1px solid rgba(138,98,68,.14);font-size:.92rem}
  .tt-zone li strong{font-weight:500;white-space:nowrap;font-variant-numeric:tabular-nums}
  .tt-zone li.tt-h{display:block;border-top:0;padding:14px 0 4px;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mocha)}
}

/* Mobile : la page ne doit jamais depasser la largeur de l'ecran (29/09) */
.bk-main,.bk-step{min-width:0}
.receipt,.receipt *{overflow-wrap:anywhere}
@media (max-width:720px){
  /* Glow Club Family : la colonne Travel benefit passe sous chaque ligne au lieu d'etre masquee (29/09) */
  .acc-table.fit.fam thead,.acc-table.fit.fam tbody{display:block}
  .acc-table.fit.fam tr{display:grid;grid-template-columns:1.3fr 1fr 1fr;border-bottom:1px solid rgba(138,98,68,.14)}
  .acc-table.fit.fam th,.acc-table.fit.fam td{border-bottom:0}
  .acc-table.fit.fam th:nth-child(4){display:none}
  .acc-table.fit.fam td:nth-child(4){display:block;grid-column:1/-1;padding-top:0;font-size:.8rem;color:var(--mocha)}
  /* Historique : les liens Recu / Avis passent a la ligne au lieu d'elargir la page */
  .acc-history td:last-child{white-space:normal}
  .acc-history td:last-child a,.acc-history td:last-child button{display:inline-block;margin:2px 10px 2px 0}
}
