html { overflow-x:clip; }
body { margin:0; background:#F7F0E4; overflow-x:clip; max-width:100%; }
* { box-sizing:border-box; }
a { color:#E8548A; text-decoration:none; }
a:hover { color:#5E2E2C; }
details > summary { list-style:none; cursor:pointer; }
details > summary::-webkit-details-marker { display:none; }
details[open] .faq-plus { transform:rotate(45deg); }
.reveal-up { opacity:0; transform:translateY(20px); transition:opacity .7s cubic-bezier(.22,.68,0,1), transform .7s cubic-bezier(.22,.68,0,1); }
.reveal-up.in-view { opacity:1; transform:translateY(0); }
.split-reveal .word { display:inline-block; opacity:0; transform:translateY(14px); transition:opacity .5s ease, transform .5s ease; }
.split-reveal.in-view .word { opacity:1; transform:translateY(0); }
[data-sticker] { cursor:grab; touch-action:none; will-change:transform; }
[data-sticker]:active { cursor:grabbing; }
.flip-card-inner { display:grid; transition:transform 1.1s cubic-bezier(.22,.68,0,1.2); transform-style:preserve-3d; }
.flip-card-inner > div { grid-area:1/1; min-width:0; }
.flip-card-inner > div:last-child { position:relative !important; inset:auto !important; }
.flip-card.is-flipped .flip-card-inner { transform:rotateY(180deg); }
.marquee-track { display:flex; width:max-content; animation:marquee-h 72s linear infinite; will-change:transform; }
.marquee-track:hover { animation-play-state:paused; }
@keyframes marquee-h { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.accordion-panel { display:grid; grid-template-rows:0fr; transition:grid-template-rows .35s ease; }
.accordion-item.is-open .accordion-panel { grid-template-rows:1fr; }
.accordion-panel > div { overflow:hidden; }
.accordion-item.is-open .faq-plus { transform:rotate(45deg); }
[data-nav].nav-solid { background:rgba(247,240,228,0.88) !important; backdrop-filter:blur(12px) !important; border-bottom-color:rgba(94,46,44,0.08) !important; }
.nav-burger { display:none !important; }
body.nav-open [data-nav], body.nav-open [data-nav].nav-solid { background:#F7F0E4 !important; backdrop-filter:none !important; border-bottom-color:transparent !important; box-shadow:none !important; transition:none !important; }
body.nav-open [data-navtoggle] { background:transparent !important; border-color:transparent !important; }
.nav-links > a { transition:color .2s ease; }
.nav-links > a:not([href="#contact"]):hover { color:#E8548A !important; }
footer a { transition:color .2s ease; }
footer a:hover { color:#F7F0E4 !important; }
.nav-links > a { white-space:nowrap; }
@media (max-width: 1150px) {
  header[data-nav] { padding:12px 20px !important; }
  .nav-burger { display:inline-flex !important; }
  .nav-links { position:fixed !important; top:68px; left:0; right:0; flex-direction:column !important; align-items:stretch !important; gap:0 !important; padding:0 20px !important; background:#F7F0E4; border:0 !important; border-radius:0 0 28px 28px; box-shadow:none; pointer-events:none; clip-path:inset(0 -80px 100% -80px); transition:clip-path .5s cubic-bezier(.22,.9,.12,1), padding .5s cubic-bezier(.22,.9,.12,1), box-shadow .45s ease; }
  body.nav-open .nav-links { pointer-events:auto; clip-path:inset(0 -80px -80px -80px); padding:8px 20px 26px !important; box-shadow:0 22px 44px rgba(94,46,44,0.14); }
  .nav-links > a { padding:15px 4px !important; font-size:19px !important; opacity:0; transform:translateY(-10px); transition:opacity .4s ease, transform .45s cubic-bezier(.22,.68,0,1), color .2s ease; }
  body.nav-open .nav-links > a { opacity:1; transform:none; }
  body.nav-open .nav-links > a:nth-child(1) { transition-delay:.1s; }
  body.nav-open .nav-links > a:nth-child(2) { transition-delay:.16s; }
  body.nav-open .nav-links > a:nth-child(3) { transition-delay:.22s; }
  body.nav-open .nav-links > a:nth-child(4) { transition-delay:.28s; }
  body.nav-open .nav-links > a:nth-child(5) { transition-delay:.34s; }
  .nav-links > a[href="#contact"] { justify-content:center; margin-top:10px; padding:15px 22px !important; }
}
@media (max-width: 960px) {
  section { padding-left:20px !important; padding-right:20px !important; }
  section#hero { padding-top:104px !important; padding-bottom:64px !important; }
  section#marquee { padding-left:0 !important; padding-right:0 !important; }
  section#makeovers, section#contact { border-radius:32px 32px 0 0 !important; }
  footer { border-radius:0 !important; }

  .makeover-grid .flip-card p { font-size:20px !important; }
  section#makeovers > div > div:first-child { text-align:center; justify-content:center !important; }
  section#makeovers > div > div:first-child > div:last-child { margin-left:auto !important; margin-right:auto !important; justify-content:center !important; }
  section#makeovers > div > div:first-child > div:first-child { max-width:100% !important; }
  section#makeovers > div > div:first-child > div:first-child > p { margin-left:auto !important; margin-right:auto !important; }
  section#contact > div > div:first-child { text-align:center; }
  section#contact > div > div:first-child > p { margin-left:auto !important; margin-right:auto !important; }
  section#contact > div > div:first-child > div { justify-content:center; }
  section { position:relative !important; top:auto !important; }
  [style*="grid-template-columns"] { grid-template-columns:1fr !important; }
  [style*="minmax(150px"] { grid-template-columns:repeat(2,minmax(140px,1fr)) !important; }
  section .makeover-grid[style] { grid-template-columns:repeat(2,1fr) !important; gap:12px !important; }
  section h1 { font-size:44px !important; }
  section h2 { font-size:34px !important; }
  section h3 { font-size:26px !important; }
  section p, section li, section a, section span, section div, section input, section textarea, section button { text-wrap:pretty; }
  section#hero a[href="#contact"] + span { flex:1 1 100% !important; min-width:0; }
  section#hero a[href="#contact"] + span br { display:none; }
  .flip-card-inner > div:last-child { padding:20px 16px 16px !important; }
  .flip-card-inner > div:last-child ul { margin-top:14px !important; }
  .flip-card-inner > div:last-child li { font-size:15px !important; }
  .flip-card-inner > div:last-child a { flex-wrap:wrap; margin-top:18px !important; font-size:15px !important; padding:12px 10px !important; }
  .flip-card-inner > div:last-child > div:nth-child(2) { font-size:24px !important; }
  footer > div > div { flex:1 1 100%; }
  section#manon > div > div:first-child, section#manon img { max-width:100% !important; }
  section#manon > div > div:first-child > div:first-child { inset:14px 0 -14px 14px !important; }
  section#manon .about-chips + span { white-space:normal !important; font-size:30px !important; }
  section#contact h2 { font-size:30px !important; }
  section#contact p, section#contact > div > div { max-width:100% !important; }
  .hero-badge-a { top:-10px !important; left:4px !important; }
  .hero-badge-b { right:4px !important; top:auto !important; bottom:96px !important; }
  .hero-badge { scale:0.86; }
  [data-sticker] { scale:0.86; }
  [data-marquee] span { font-size:22px !important; gap:20px !important; }
  footer > div { flex-direction:column; align-items:flex-start !important; }
}
@media (max-width: 620px) {
  section h1 { font-size:36px !important; }
  section h2 { font-size:28px !important; }
  [data-sticker] { scale:0.74; }
}
.pain-card { transition:border-color .3s ease, transform .3s cubic-bezier(.22,.68,0,1), box-shadow .3s ease; }
.pain-card:hover { border-color:#E8548A; transform:translateY(-6px); box-shadow:0 14px 32px rgba(232,84,138,0.14); }
.pain-card > div:first-child { transition:color .3s ease; }
.pain-card:hover > div:first-child { color:#E8548A !important; }
.about-chips + span, .about-chips { align-items:center; }
@media (max-width: 620px) { .about-chips { grid-template-columns:1fr !important; } }
.pill-fx { transition:transform .25s cubic-bezier(.22,.68,0,1.2), background .2s ease, color .2s ease; }
.pill-fx:hover { transform:scale(.96) rotate(-1.5deg); }
@media (prefers-reduced-motion: reduce) {
  .reveal-up, .split-reveal .word { opacity:1 !important; transform:none !important; transition:none !important; }
  .marquee-track { animation:none; }
}

/* hover states */
.hv-1:hover {
background:#5E2E2C !important;
color:#FFFDF9 !important;
}
.hv-2:hover {
background:#5E2E2C !important;
}
.hv-3:hover {
background:#F6D3DA !important;
color:#5E2E2C !important;
}
.hv-4:hover {
background:#3A2422 !important;
}
