:root { --ink:#171519; --ivory:#f4f0e9; --paper:#fbfaf7; --magenta:#d900e8; --mauve:#ad7bac; --line:rgba(23,21,25,.16); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial, Helvetica, sans-serif; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
.site-header { position:absolute; z-index:50; top:0; left:0; width:100%; height:112px; padding:22px 4vw; display:grid; grid-template-columns:180px 1fr 145px; align-items:center; border-bottom:1px solid rgba(255,255,255,.28); color:white; }
.logo { width:304px; overflow:hidden; display:block; }
.logo img { width:100%; height:auto; display:block; }
.main-nav { display:flex; align-items:center; justify-content:center; gap:clamp(18px,2.25vw,40px); font-size:12px; letter-spacing:.08em; text-transform:uppercase; }
.main-nav>a,.nav-group>a { padding:18px 0; position:relative; }
.main-nav>a:after,.nav-group>a:after { content:""; position:absolute; left:0; right:100%; bottom:10px; height:1px; background:var(--magenta); transition:.25s; }
.main-nav>a:hover:after,.nav-group>a:hover:after { right:0; }
.nav-group { position:relative; }
.nav-group>a span { font-size:13px; padding-left:3px; }
.flyout { position:absolute; top:50px; left:-25px; width:315px; padding:17px 22px; display:grid; background:rgba(20,17,21,.97); border-top:2px solid var(--magenta); opacity:0; visibility:hidden; transform:translateY(8px); transition:.22s; box-shadow:0 18px 50px rgba(0,0,0,.22); }
.nav-group:hover .flyout,.nav-group:focus-within .flyout { opacity:1; visibility:visible; transform:none; }
.flyout a { display:flex; justify-content:space-between; padding:11px 4px; color:#eee9e5; border-bottom:1px solid rgba(255,255,255,.1); font-size:11px; letter-spacing:.05em; }
.flyout a:hover { color:#ef8cf8; padding-left:9px; }
.account-button { justify-self:end; padding:13px 18px; border:1px solid rgba(255,255,255,.65); font-size:11px; letter-spacing:.1em; text-transform:uppercase; transition:.25s; }
.account-button:hover { background:white; color:var(--ink); }
.account-button span,.button span { margin-left:13px; }
.menu-toggle { display:none; }
.hero { height:100svh; min-height:690px; position:relative; overflow:hidden; color:white; background:#2b2928; }
.hero-image { position:absolute; inset:0; background:url('../images/joy-weight-loss-hero.png') center/cover no-repeat; transform:scale(1.01); animation:reveal 1.3s ease both; }
.hero-wash { position:absolute; inset:0; background:linear-gradient(90deg,rgba(18,15,18,.84) 0%,rgba(23,19,23,.56) 38%,rgba(23,19,23,.10) 72%),linear-gradient(0deg,rgba(10,8,10,.28),transparent 60%); }
@keyframes reveal { from{opacity:0; transform:scale(1.06)} to{opacity:1; transform:scale(1.01)} }
.hero-content { position:absolute; z-index:2; left:8vw; top:51%; transform:translateY(-45%); max-width:770px; }
.eyebrow,.section-kicker { font-size:11px; letter-spacing:.24em; text-transform:uppercase; font-weight:600; }
.eyebrow:before { content:""; display:inline-block; width:32px; height:1px; margin-right:14px; vertical-align:middle; background:var(--magenta); }
.hero h1,.philosophy h2,.care-heading h2,.renewal-copy h2,.membership-strip h2,.detail-title h1,.detail-intro h2,.detail-cta h2,.contact-panel h2 { font-family:Georgia,'Times New Roman',serif; font-weight:400; letter-spacing:-.045em; }
.hero h1 { font-size:clamp(58px,7.2vw,112px); line-height:.86; margin:24px 0 30px; }
em { font-weight:400; color:#e88cf0; }
.hero-copy { max-width:590px; font-size:17px; line-height:1.65; color:rgba(255,255,255,.82); }
.hero-actions { display:flex; align-items:center; gap:34px; margin-top:36px; }
.button { display:inline-flex; align-items:center; padding:17px 21px; text-transform:uppercase; font-size:10px; letter-spacing:.16em; transition:.25s; }
.button-dark { background:var(--ink); color:white; border:1px solid rgba(255,255,255,.16); }
.button-light { background:var(--paper); color:var(--ink); }
.button:hover { transform:translateY(-2px); box-shadow:0 12px 30px rgba(0,0,0,.15); }
.text-link { display:inline-flex; gap:22px; align-items:center; padding-bottom:8px; border-bottom:1px solid currentColor; font-size:11px; letter-spacing:.13em; text-transform:uppercase; }
.hero-note { position:absolute; right:5vw; bottom:8vh; z-index:2; border-left:1px solid rgba(255,255,255,.45); padding-left:20px; }
.hero-note span { font-size:9px; letter-spacing:.22em; color:#e59aeb; }.hero-note p{font-family:Georgia,serif;font-size:16px;line-height:1.4;margin:7px 0 0}
.scroll-cue { position:absolute; z-index:2; bottom:7vh; left:2.5vw; writing-mode:vertical-rl; text-transform:uppercase; font-size:9px; letter-spacing:.25em; display:flex; align-items:center; gap:12px; }.scroll-cue span{width:1px;height:40px;background:rgba(255,255,255,.55)}
.section-pad { padding:120px 8vw; }
.philosophy { display:grid; grid-template-columns:1fr 2fr; gap:9vw; background:var(--paper); }
.section-kicker { color:#7f7078; }.section-kicker:before{content:"✦";color:var(--magenta);font-size:8px;margin-right:10px}
.philosophy h2,.care-heading h2,.membership-strip h2 { margin:0 0 35px; font-size:clamp(48px,6vw,86px); line-height:1.02; }
.philosophy .lead { max-width:740px; margin:0 0 38px; }
.lead { font-family:Georgia,serif; font-size:clamp(16px,2.1vw,24px); line-height:1.2; color:#4c4449; }
.care-section { background:var(--ivory); }
.care-heading { display:flex; justify-content:space-between; align-items:end; gap:50px; margin-bottom:60px; }
.care-heading>p { max-width:410px; line-height:1.8; color:#665c62; }
.care-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.care-card { min-height:480px; padding:28px; position:relative; border-right:1px solid var(--line); border-bottom:1px solid var(--line); transition:.35s; overflow:hidden; }
.care-card:hover { background:#211d21; color:white; transform:translateY(-4px); }
.card-no { font-size:10px; letter-spacing:.2em; color:#8b7d84; }
.orb { width:140px; height:140px; border-radius:50%; margin:45px auto 65px; background:radial-gradient(circle at 34% 27%,#fff 0,#e6cfe5 14%,#a86ea8 42%,#392c3b 67%,#181519 100%); box-shadow:inset -20px -20px 30px rgba(0,0,0,.25),8px 16px 35px rgba(63,40,60,.22); transition:.5s; }
.care-card:nth-child(2) .orb { background:radial-gradient(circle at 35% 28%,#fff,#f0ddd5 20%,#a88f82 53%,#282225 78%); }.care-card:nth-child(3) .orb{background:radial-gradient(circle at 40% 30%,#fff,#e9a9ec 18%,#b108bc 48%,#321735 77%)}
.care-card:hover .orb { transform:scale(1.08) rotate(8deg); }
.care-card h3 { font-family:Georgia,serif; font-weight:400; font-size:28px; margin:0 0 15px; }.care-card p{max-width:280px;font-size:13px;line-height:1.7;color:#70656b}.care-card:hover p{color:#cfc6cc}.round-arrow{position:absolute;right:24px;bottom:25px;border:1px solid currentColor;width:39px;height:39px;border-radius:50%;display:grid;place-items:center}
.renewal-split { display:grid; grid-template-columns:1.08fr .92fr; min-height:660px; background:#19171a; color:white; }
.renewal-image { background:url('../images/joy-regenerative-longevity.png') center/cover no-repeat; min-height:540px; }
.renewal-copy { padding:9vw 8vw; display:flex; flex-direction:column; justify-content:center; }.renewal-copy h2{font-size:clamp(50px,6vw,84px);line-height:1.02;margin:28px 0}.renewal-copy>p:not(.section-kicker){max-width:480px;color:#c3b9c0;line-height:1.8;margin-bottom:35px}.renewal-copy .button{align-self:flex-start}
.membership-strip { text-align:center; background:linear-gradient(120deg,#f9f5ef,#efe1ed); }.membership-strip .section-kicker{margin-bottom:30px}.membership-strip>p:not(.section-kicker){color:#6c6167;margin:0 0 30px}.membership-strip .text-link{margin:auto}
.site-footer { background:#151316; color:#d8d1d6; padding:75px 8vw 25px; display:grid; grid-template-columns:2fr 1fr 1fr; gap:70px; font-size:12px; line-height:1.7; }
.footer-brand img{width:190px;height:auto}.footer-brand>p{max-width:330px;color:#8f858c;margin-top:25px}
.site-footer>div:not(.footer-brand):not(.footer-bottom){display:flex;flex-direction:column;gap:9px}.footer-label{color:#df8ee6!important;text-transform:uppercase;letter-spacing:.18em;font-size:9px}.footer-bottom{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.12);padding-top:22px;margin-top:35px;display:flex;justify-content:space-between;color:#766d73;font-size:10px}
.detail-page { background:var(--paper); }.detail-page+.site-footer{}
.detail-hero { min-height:680px; background:#181619; color:white; position:relative; display:flex; align-items:end; overflow:hidden; padding:160px 8vw 75px; }
.detail-visual { position:absolute; inset:0; background:url('../images/joy-regenerative-longevity.png') center/cover; opacity:.58; }
.detail-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(19,16,20,.85),rgba(19,16,20,.18)),linear-gradient(0deg,rgba(19,16,20,.8),transparent 55%)}.detail-visual>span{position:absolute;right:5vw;top:25%;font-family:Georgia,serif;font-size:22vw;color:rgba(255,255,255,.055);letter-spacing:-.1em}.detail-title{position:relative;z-index:2;max-width:1050px}.detail-title h1{font-size:clamp(52px,7vw,108px);line-height:.92;margin:24px 0 0;max-width:1050px}
.detail-intro { display:grid;grid-template-columns:1fr 2fr;gap:9vw}
.detail-intro h2{font-size:clamp(24px,5vw,56px);line-height:1.08;margin:0 0 30px}
.fine-line{display:block;width:70%;height:1px;background:var(--line);margin-top:25px}
.detail-points{padding-top:0;display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.point{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:28px 24px;min-height:150px}
.point+ .point{border-left:1px solid var(--line)}.point span{font-size:9px;color:var(--magenta);letter-spacing:.2em}
.point p{font-family:Georgia,serif;font-size:23px;line-height:1.3;margin:33px 0 0}
.detail-cta{padding:110px 8vw;text-align:center;background:#1a171b;color:white}
.detail-cta>p{text-transform:uppercase;letter-spacing:.19em;font-size:9px;color:#bbaab6}
.detail-cta h2{font-size:clamp(44px,5vw,75px);margin:25px auto 40px;max-width:850px}
.contact-panel{display:grid;grid-template-columns:1fr 1fr;gap:10vw;background:var(--ivory)}
.contact-panel h2{font-size:clamp(42px,5vw,70px);margin:26px 0}.contact-lines p{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:22px 0;text-transform:uppercase;letter-spacing:.14em;font-size:9px}.contact-lines span{text-transform:none;letter-spacing:0;font-family:Georgia,serif;font-size:18px}.medical-note{font-size:10px;line-height:1.7;color:#8d8288;max-width:850px;text-align:center;margin:0 auto;padding:28px 30px 50px}
.btn-submit{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;background-color:#640648;color:white;border:none;border-radius:4px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:.3s ease;box-shadow:0 4px 12px rgba(187,170,182,.2)}
.btn-submit:hover{background-color:#d877ae;transform:translateY(-2px);box-shadow:0 6px 16px rgba(187,170,182,.3)}
.btn-submit:active{transform:translateY(0);box-shadow:0 2px 6px rgba(187,170,182,.2)}
@media(max-width:1050px){.site-header{grid-template-columns:140px 1fr 125px}.main-nav{gap:15px;font-size:10px}
.account-button{padding:11px;font-size:9px}
.hero-content{left:7vw}.hero-note{display:none}}
@media(max-width:800px){.site-header{height:92px;padding:18px 22px;grid-template-columns:130px 1fr 42px}.logo{width:125px}.account-button{display:none}.menu-toggle{display:block;justify-self:end;width:38px;height:38px;border:1px solid rgba(255,255,255,.5);background:transparent;padding:10px}.menu-toggle span{display:block;height:1px;background:white;margin:5px 0}.main-nav{display:none;position:absolute;top:92px;left:0;right:0;background:#171519;padding:20px 25px 30px;align-items:stretch;flex-direction:column;gap:0}.main-nav.open{display:flex}.main-nav>a,.nav-group>a{display:block;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.1)}.flyout{position:static;width:auto;opacity:1;visibility:visible;transform:none;background:transparent;border:0;box-shadow:none;padding:0 0 5px 14px}.flyout a{font-size:9px;padding:8px 4px}.hero-content{left:24px;right:24px;top:48%}.hero h1{font-size:54px}.hero-copy{font-size:15px}.hero-actions{flex-direction:column;align-items:flex-start;gap:22px}.scroll-cue{display:none}.section-pad{padding:80px 24px}.philosophy,.detail-intro,.contact-panel{grid-template-columns:1fr;gap:35px}.care-heading{display:block}.care-grid,.detail-points{grid-template-columns:1fr}.care-card{min-height:390px}.orb{margin:30px auto 42px}.renewal-split{grid-template-columns:1fr}.renewal-image{min-height:390px}.renewal-copy{padding:75px 25px}.site-footer{grid-template-columns:1fr 1fr;padding:60px 25px 25px;gap:40px}.footer-brand{grid-column:1/-1}
.detail-hero{min-height:570px;padding:140px 24px 55px}.point+.point{border-left:0}.point{min-height:110px}.contact-lines span{font-size:15px}.footer-bottom{gap:20px;flex-direction:column}}
@media(max-width:480px){.hero h1{font-size:47px}.hero-image{background-position:62% center}.philosophy h2,.care-heading h2,.membership-strip h2{font-size:46px}.care-card{min-height:360px}.renewal-copy h2{font-size:48px}.site-footer{grid-template-columns:1fr}.footer-brand{grid-column:auto}.detail-title h1{font-size:50px}}
@media(prefers-reduced-motion:reduce){* {scroll-behavior:auto!important;animation:none!important;transition:none!important}}
.form-check {
  padding-top: .5rem;
  padding-bottom: .5rem;
  padding-left: .5rem;
  padding-right: 0rem;
  background-color: #f6f8fb;
  max-width: 200px;
}
.btn-brand{ background: linear-gradient(90deg, var(--brand-teal), var(--brand-purple)); border:none; }
.btn-brand:hover{ opacity:.92; }
.form-check {
  padding-top: .5rem;
  padding-bottom: .5rem;
  padding-left: .5rem;
  padding-right: 0rem;
  background-color: #f6f8fb;
  max-width: 200px;
}
.brand-mark { height: 44px; width: auto; }
.iv-card { overflow: hidden; }
.iv-card-header {font-family:Georgia,serif; background: #41343d; color: #fff; padding: .85rem 1rem; }
.iv-card-header h5 {font-family:Georgia,serif; font-size: 1.5rem; margin: 0; color: inherit; }
.iv-card-footer {font-family:Georgia,serif; background: #8a1663; color: #fff; font-weight: 700; padding: .65rem 1rem; font-size: 1.75rem; text-align: center; }