/* Palette from the uploaded Suddy's main logo. */
:root {
  --navy: #00134d;
  --royal-blue: #06349e;
  --bright-blue: #0084f5;
  --cyan: #00c5f4;
  --ice-blue: #c7f5fc;
  --purple: #b52cf1;
  --violet: #6500a7;
  --lavender: #de84ff;
  --yellow: #ffe000;
  --gold: #ffc000;
  --orange: #ef9900;
}
@font-face{font-family:SuddyRounded;src:url(assets/nunito.woff2) format('woff2');font-weight:200 1000;font-style:normal;font-display:swap}:root{--font-rounded:SuddyRounded}


:root{--background:#fff;--foreground:#00134d;--primary:var(--royal-blue);--primary-foreground:#fff;--accent:var(--cyan);--accent-foreground:#00134d;--border:#d7e5f0;--ring:var(--royal-blue);--radius:2rem;--font-sans:var(--font-geist-sans)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;color:var(--foreground);background:#fff;font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible{outline:3px solid #176fc1;outline-offset:6px}h1,h2,h3,p{margin:0}h1,h2,h3,.brand,.footer-brand{font-family:var(--font-rounded),Arial,sans-serif}h1,h2{font-weight:900;letter-spacing:-.065em}h2{font-size:clamp(2.5rem,4.4vw,4.1rem);line-height:1.05}.wrap{max-width:1260px;width:calc(100% - 112px);margin:auto}.notice{background:var(--royal-blue);color:white;text-align:center;padding:11px 20px;font-size:12px;font-weight:700;letter-spacing:.12em}.notice span{padding:0 19px;color:var(--cyan)}.nav{height:120px;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{display:flex;align-items:center;gap:10px;font-size:39px;font-weight:900;letter-spacing:-2px;line-height:.9}.brand small{display:block;font:700 11px Arial;letter-spacing:.24em;margin-top:9px;text-align:center}.brand-bubbles{width:43px;height:48px;position:relative;display:block}.brand-bubbles i{position:absolute;width:28px;height:28px;background:var(--cyan);border:3px solid #00134d;border-radius:50%;bottom:0;left:0}.brand-bubbles i:nth-child(2){width:23px;height:23px;left:20px;bottom:12px}.brand-bubbles i:nth-child(3){width:15px;height:15px;left:8px;bottom:33px}.nav nav{display:flex;gap:32px;font-size:14px;font-weight:700}.nav nav a:hover{color:var(--royal-blue)}.button{display:inline-flex;align-items:center;justify-content:center;gap:30px;border-radius:100px;background:var(--royal-blue);color:white;font-size:16px;font-weight:700;padding:20px 28px;transition:transform .2s,background .2s}.button:hover{background:var(--navy);transform:translateY(-2px)}.button.small{font-size:14px;padding:15px 23px;gap:17px}.hero{display:grid;grid-template-columns:1.04fr 1fr;align-items:center;min-height:590px;padding-top:14px;padding-bottom:65px;gap:20px}.eyebrow{font-size:12px;font-weight:800;letter-spacing:.16em;display:flex;align-items:center;gap:10px}.eyebrow>span{height:9px;width:9px;background:#237dcc;border-radius:50%}h1{font-size:clamp(3.8rem,6.4vw,6.25rem);line-height:.98;margin-top:24px}h1 span{color:var(--royal-blue);position:relative}h1 span:after{content:'';position:absolute;background:var(--cyan);bottom:2px;left:2px;right:0;height:13px;z-index:-1;border-radius:50%}.intro{font-size:17px;line-height:1.75;margin:26px 0 28px;color:#52647a}.hero-note{display:flex;align-items:center;gap:11px;font-size:13px;margin-top:24px;color:#52647a}.mini-circle{display:grid;place-items:center;background:var(--ice-blue);border-radius:50%;height:35px;width:35px;color:#00134d}.hero-art{position:relative;aspect-ratio:1;isolation:isolate}.photo-circle{position:absolute;inset:6%;border-radius:50%;overflow:hidden;background:var(--cyan);border:12px solid var(--cyan)}.photo-circle img{width:100%;height:100%;object-fit:cover}.orbit{position:absolute;inset:0;border:1px solid #cce8f3;border-radius:50%;transform:rotate(-20deg)}.round-stamp{position:absolute;right:-1%;bottom:0;width:158px;height:158px;background:var(--royal-blue);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:9px;transform:rotate(12deg);border:7px solid white;text-align:center}.round-stamp svg{color:var(--cyan)}.round-stamp strong{font-size:17px;line-height:1.1;letter-spacing:-.025em}.round-stamp span{font-size:8px;letter-spacing:.1em}.bubble{position:absolute;border-radius:50%;background:var(--cyan);border:1px solid #3899ed}.bubble-one{height:62px;width:62px;top:1%;right:9%}.bubble-two{height:25px;width:25px;top:17%;right:-1%;background:var(--ice-blue);border-color:#a5dfed}.bubble-three{height:40px;width:40px;bottom:5%;left:6%;background:var(--ice-blue);border-color:#b9e3ef}.spark{position:absolute;top:12%;left:0;font-size:72px;line-height:1;color:var(--royal-blue)}.ticker{overflow:hidden;display:flex;justify-content:space-around;align-items:center;gap:30px;white-space:nowrap;background:var(--cyan);font-size:34px;padding:22px 30px}.ticker span{font-size:17px;font-weight:900;letter-spacing:.06em}.washes{padding-top:85px;padding-bottom:80px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:36px}.section-heading h2{margin-top:15px}.section-heading>p{line-height:1.7;font-size:16px;color:#52647a;padding-bottom:5px}.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:21px}.plan{border-radius:32px;background:#f0f7fb;padding:29px;position:relative}.plan-1{background:var(--royal-blue);color:#fff}.plan-2{background:var(--ice-blue)}.plan-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.plan-icon{height:70px;width:70px;display:grid;place-items:center;border-radius:50%;background:white;color:var(--royal-blue)}.plan-1 .plan-icon{background:var(--cyan);color:#00134d}.plan-number{font-size:14px;opacity:.6}.plan h3{font-size:28px;font-weight:900;letter-spacing:-.04em;margin-bottom:10px}.plan>p{font-size:14px;line-height:1.6;opacity:.8;min-height:45px}.plan ul{list-style:none;padding:23px 0;margin:14px 0;border-top:1px solid #00134d20;display:grid;gap:14px}.plan-1 ul{border-color:#ffffff30}.plan li{display:flex;gap:10px;align-items:center;font-size:14px}.plan li svg{flex-shrink:0}.plan-link{display:flex;align-items:center;justify-content:space-between;font-weight:700;font-size:14px;padding:15px 0 0}.plan-link:hover{text-decoration:underline}.popular{position:absolute;top:-12px;right:28px;background:var(--cyan);color:#00134d;border-radius:30px;padding:8px 13px;font-size:10px;letter-spacing:.08em;font-weight:800}.availability{font-size:12px;color:#586b80;margin-top:19px;text-align:center}.difference{background:#f0f7fb;border-radius:60px 60px 0 0;padding:70px 0}.difference-inner{display:grid;grid-template-columns:1fr 1fr;gap:85px}.difference h2{margin:20px 0 24px}.difference h2 span{color:var(--royal-blue)}.difference p:not(.eyebrow){line-height:1.8;color:#52647a;font-size:16px}.benefits{display:grid;gap:29px;align-content:center}.benefits article{display:flex;align-items:center;gap:21px}.benefits article>span{width:70px;height:70px;flex-shrink:0;border-radius:50%;background:var(--cyan);display:grid;place-items:center}.benefits article:nth-child(2)>span{background:var(--royal-blue);color:#fff}.benefits article:nth-child(3)>span{background:#fff}.benefits h3{font-size:22px;font-weight:900;letter-spacing:-.03em;margin-bottom:3px}.benefits p{font-size:14px!important}.visit{text-align:center;position:relative;padding:85px 0 90px;overflow:hidden}.visit .eyebrow{justify-content:center}.visit h2{font-size:clamp(3.8rem,6vw,5.5rem);margin:20px 0}.visit>p:not(.eyebrow){line-height:1.7;color:#52647a;margin-bottom:27px}.visit-circle{position:absolute;width:240px;height:240px;border-radius:50%;background:var(--cyan);left:-80px;top:120px;font-size:130px;display:grid;place-items:center;color:var(--royal-blue);transform:rotate(20deg)}footer{border-top:1px solid #d7e5f0;display:flex;align-items:center;gap:30px;padding-top:32px;padding-bottom:30px;flex-wrap:wrap}.footer-brand{font-size:32px;font-weight:900;letter-spacing:-1.5px}.footer-brand span{font:700 9px Arial;letter-spacing:.18em;display:block;text-align:center}footer p{font-size:13px;color:#52647a;flex:1}footer>a:last-of-type{font-size:13px;display:flex;gap:10px;align-items:center}footer small{width:100%;font-size:12px;color:#63758a}
@media(min-width:1450px){.hero{min-height:670px}}@media(max-width:1000px){.wrap{width:calc(100% - 64px)}.nav nav{gap:18px}.hero{min-height:530px}h1{font-size:4.7rem}.hero-art{margin-right:0}.round-stamp{width:135px;height:135px}.plan{padding:23px}.plan h3{font-size:25px}.difference-inner{gap:40px}.visit-circle{left:-140px}}@media(max-width:760px){.wrap{width:calc(100% - 40px)}.notice{font-size:9px;letter-spacing:.08em}.notice span{padding:0 6px}.nav{height:95px;gap:15px}.brand{font-size:32px}.nav nav{display:none}.button.small{font-size:12px;padding:13px 17px;gap:10px}.hero{grid-template-columns:1fr;padding-top:20px;padding-bottom:35px;gap:35px}.hero-copy{text-align:center}.eyebrow{justify-content:center}h1{font-size:clamp(3.5rem,12vw,5.4rem);margin-top:19px}.intro{font-size:16px;margin:22px 0}.desktop{display:none}.hero-note{justify-content:center;margin-top:18px}.hero-art{width:min(430px,92%);margin:0 auto}.ticker{justify-content:flex-start;gap:28px;padding:18px 22px}.ticker span{font-size:14px}.washes{padding:55px 0}.section-heading{display:block;text-align:center}.section-heading>p{margin-top:20px}.plans{grid-template-columns:1fr;gap:26px}.plan{padding:30px}.plan>p{min-height:0}.plan-top{margin-bottom:20px}.plan h3{font-size:30px}.plan ul{margin-top:20px}.plan li,.plan>p,.plan-link{font-size:16px}.difference{border-radius:35px 35px 0 0;padding:48px 0}.difference-inner{grid-template-columns:1fr;gap:37px}.difference-inner>div:first-child{text-align:center}.benefits article{gap:16px}.benefits article>span{height:58px;width:58px}.benefits h3{font-size:22px}.visit{padding:55px 0}.visit-circle{height:100px;width:100px;font-size:60px;left:-64px;top:140px}footer{gap:24px}footer p{flex-basis:50%}footer>a:last-of-type{margin-left:auto}.availability{line-height:1.6}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}

/* Page navigation */
.nav nav{gap:25px}.nav nav a{padding:10px 0;position:relative}.nav nav a[aria-current="page"]{color:var(--royal-blue)}.nav nav a[aria-current="page"]:after{content:"";height:5px;width:5px;border-radius:50%;background:#258deb;position:absolute;left:calc(50% - 2px);bottom:0}
.page-intro{text-align:center;padding:50px 0 48px}.page-intro .eyebrow{justify-content:center}.page-intro h1{font-size:clamp(3.5rem,6vw,5.8rem)}.page-intro .intro{max-width:640px;margin:25px auto 0}.page-intro+.washes{padding-top:15px}.page-intro+.washes .section-heading{display:none}.info-band{display:flex;align-items:center;gap:50px;padding:0 0 75px}.info-orb{display:grid;place-items:center;flex-shrink:0;width:190px;height:190px;border-radius:50%;background:var(--cyan);color:var(--royal-blue);font-size:105px}.info-band h2{font-size:2.8rem}.info-band p{max-width:640px;line-height:1.8;margin-top:20px;color:#52647a}.membership-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:55px;margin-bottom:85px}.membership-feature{position:relative;overflow:hidden;background:var(--royal-blue);color:white;border-radius:40px;padding:50px}.membership-feature h2{margin:30px 0 25px}.membership-feature>p:not(.eyebrow){position:relative;line-height:1.8;max-width:340px}.membership-orb{position:absolute;right:-42px;top:-40px;width:190px;height:190px;border-radius:50%;background:var(--cyan);color:var(--royal-blue);display:grid;place-items:center;font-size:115px}.status-pill{display:inline-block;border-radius:50px;background:var(--cyan);color:#00134d;padding:12px 23px;font-weight:700;margin-top:28px}.membership-notes{display:grid;gap:30px;align-content:center}.membership-notes article{position:relative;padding-left:65px}.membership-notes article>span{position:absolute;left:0;top:0;border-radius:50%;width:45px;height:45px;background:var(--ice-blue);display:grid;place-items:center;font-weight:700}.membership-notes h3{font-size:25px;font-weight:900;letter-spacing:-.035em}.membership-notes p{line-height:1.7;color:#52647a;margin-top:10px}.text-link{display:inline-block;margin-top:12px;font-weight:700;color:var(--royal-blue)}.text-link:hover{text-decoration:underline}.location-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;margin-bottom:80px}.location-art{background:var(--ice-blue);border-radius:40px;aspect-ratio:1;display:grid;place-items:center;padding:30px}.location-orbit{border:1px solid #469de3;border-radius:50%;width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}.location-orbit>span{font-size:90px;color:var(--royal-blue)}.location-info h2{font-size:2.5rem;margin:20px 0}.location-info dl{margin:0}.location-info dl>div{padding:16px 0;border-bottom:1px solid #d7e5f0}.location-info dt{font-size:13px;font-weight:700;margin-bottom:6px}.location-info dd{margin:0;color:#52647a}.location-info>p:not(.eyebrow){line-height:1.7;color:#52647a;margin:23px 0}.about-note{text-align:center;padding:70px 0}.about-note .eyebrow{justify-content:center}.about-note h2{margin:24px 0}.about-note>p:not(.eyebrow){line-height:1.8;color:#52647a;max-width:590px;margin:0 auto 25px}
/* Float in as content loads and enters the viewport. JS only adds animation to visible content. */
.float-enter{animation:float-enter 850ms cubic-bezier(.18,.7,.24,1) both;animation-delay:var(--float-delay,0ms)}
@keyframes float-enter{from{opacity:0;translate:0 30px}to{opacity:1;translate:0 0}}
@keyframes bubble-drift{0%,100%{translate:0 0}50%{translate:0 -10px}}
.bubble{animation:bubble-drift 4.5s ease-in-out infinite}.bubble-two{animation-delay:-1.5s}.bubble-three{animation-delay:-3s}
@media(max-width:1000px){.nav nav{gap:16px}.nav{gap:18px}}
@media(max-width:760px){.nav{height:auto;min-height:120px;padding-top:20px;padding-bottom:13px;flex-wrap:wrap;justify-content:space-between}.nav nav{order:3;display:flex;width:100%;justify-content:space-between;gap:10px;font-size:14px}.nav>.button{margin-left:auto}.page-intro{padding-top:35px;padding-bottom:35px}.page-intro h1{font-size:clamp(3.2rem,11vw,4.6rem)}.info-band{flex-direction:column;text-align:center;gap:25px;padding-bottom:50px}.info-orb{width:130px;height:130px;font-size:80px}.membership-grid,.location-grid{grid-template-columns:1fr;gap:35px;margin-bottom:50px}.membership-feature{padding:35px 28px}.membership-feature .eyebrow{justify-content:flex-start;position:relative}.membership-orb{width:120px;height:120px;font-size:80px;right:-40px;top:-30px}.membership-notes article{padding-left:60px}.location-art{max-width:440px;width:100%;margin:auto}.location-info .eyebrow{justify-content:flex-start}.location-info h2{font-size:2.2rem}.about-note{padding:45px 0}.about-note h2{font-size:3rem}}
@media(prefers-reduced-motion:reduce){.float-enter,.bubble{animation:none!important;opacity:1;translate:none}}

/* Customer portal landing page */
.portal-card{text-align:center;background:#f0f7fb;border-radius:40px;max-width:650px;padding:40px;margin-bottom:70px}.portal-symbol{height:90px;width:90px;border-radius:50%;background:var(--cyan);color:var(--royal-blue);font-size:60px;display:grid;place-items:center;margin:0 auto 25px}.portal-card h2{font-size:3rem}.portal-card>p{max-width:440px;margin:22px auto 0;color:#52647a;line-height:1.8}.portal-card .text-link{display:block;margin-top:24px}.nav>.button{white-space:nowrap}@media(max-width:400px){.nav>.button{padding:12px;font-size:12px;gap:6px}.brand{font-size:29px}.brand-bubbles{width:37px}.portal-card{padding:30px 22px}}

/* Keep all five navigation links available at smaller widths. */
@media(min-width:761px) and (max-width:1100px){.nav{height:auto;min-height:120px;padding-top:22px;padding-bottom:15px;flex-wrap:wrap;justify-content:space-between}.nav nav{order:3;width:100%;justify-content:center;gap:30px}.nav>.button{margin-left:auto}}
@media(max-width:400px){.nav nav{font-size:13px;gap:8px}}

/* Seamless left-moving slogan banner. Matching groups make the loop continuous. */
.ticker{display:block;padding:22px 0;overflow:hidden}
.ticker-track{display:flex;width:max-content;animation:ticker-left 28s linear infinite}
.ticker-group{display:flex;flex:none;align-items:center;justify-content:space-around;gap:36px;min-width:100vw;padding-right:36px}
.ticker-group>span{flex:none}
.ticker-group>.ticker-star{font-size:34px;font-weight:400;line-height:1}
@keyframes ticker-left{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(max-width:760px){.ticker{padding:18px 0}.ticker-group{gap:28px;padding-right:28px}}
@media(prefers-reduced-motion:reduce){.ticker-track{animation:none}}

/* Detailing package availability */
.plan>.detail-price{min-height:0;margin-top:6px;font-size:16px;font-weight:700;opacity:1}

/* Membership: wash pricing, detailing packages, then benefits. */
.membership-washes{padding:12px 0 70px}.membership-washes .plan{display:flex;flex-direction:column}.membership-washes .plan>p{min-height:45px}.wash-pricing{display:grid;gap:12px;margin:20px 0 8px}.wash-pricing>div{padding:16px 18px;border:1px solid #00134d26;border-radius:20px}.wash-pricing dt{font-size:14px;margin-bottom:7px}.wash-pricing dd{margin:0;font-family:var(--font-rounded),Arial,sans-serif;font-size:24px;line-height:1.2;font-weight:900;letter-spacing:-.025em}.wash-pricing .monthly-price{background:#fff;color:#00134d;border-color:transparent}.plan-1 .wash-pricing>div{border-color:#ffffff55}.plan-1 .wash-pricing .monthly-price{background:var(--cyan);color:#00134d}.membership-washes .plan ul{margin-top:16px;margin-bottom:0}.membership-detailing{padding:65px 0;background:#f0f7fb;border-radius:55px 55px 0 0}.membership-detailing .plan-0{background:white}.membership-detailing .plan-0 .plan-icon{background:var(--ice-blue)}.membership-benefits{padding:70px 0}.benefit-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 50px}.benefit-list li{display:flex;gap:20px;align-items:flex-start;padding:26px 0;border-top:1px solid #d7e5f0}.benefit-check{flex:none;display:grid;place-items:center;height:48px;width:48px;border-radius:50%;background:var(--ice-blue);color:var(--royal-blue);font-size:23px;font-weight:bold}.benefit-list h3{font-size:23px;font-weight:900;letter-spacing:-.025em}.benefit-list p{margin-top:8px;font-size:16px;line-height:1.65;color:#52647a}
@media(max-width:760px){.membership-washes{padding:0 0 48px}.membership-washes .plan>p{min-height:0}.membership-detailing{padding:45px 0;border-radius:35px 35px 0 0}.membership-benefits{padding:45px 0}.benefit-list{grid-template-columns:1fr}.benefit-list li{gap:16px}.wash-pricing dd{font-size:26px}}

.price-unit{font-family:Arial,Helvetica,sans-serif;font-size:14px;font-weight:400;letter-spacing:0}.plan>.detail-price{font-family:var(--font-rounded),Arial,sans-serif;font-size:30px;font-weight:900}

/* Editorial detailing showcase */
.detail-hero{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:65px;padding:45px 0 85px}.detail-hero h1{font-size:clamp(3.8rem,6.5vw,6.1rem);margin:0}.detail-hero h1 span{color:var(--royal-blue)}.detail-hero-copy>p{max-width:480px;margin-top:30px;font-size:18px;line-height:1.8;color:#52647a}.detail-explore{display:inline-flex;align-items:center;gap:25px;margin-top:30px;font-weight:700}.detail-explore span{width:46px;height:46px;background:var(--ice-blue);border-radius:50%;display:grid;place-items:center;font-size:24px}.detail-explore:hover span{background:var(--cyan)}.detail-hero-visual{position:relative;aspect-ratio:1}.detail-photo{position:absolute;inset:4%;border-radius:50%;overflow:hidden;border:12px solid var(--cyan)}.detail-photo img{width:100%;height:100%;object-fit:cover}.detail-hero-visual:before{content:"";position:absolute;inset:0;border:1px solid #b9e3ef;border-radius:50%}.detail-accent{position:absolute;right:0;bottom:0;width:130px;height:130px;border:8px solid white;border-radius:50%;display:grid;place-items:center;background:var(--royal-blue);color:var(--cyan);font-size:83px}.detail-dot{position:absolute;width:40px;height:40px;border-radius:50%;background:var(--cyan);left:2%;top:8%}.detail-showcase{padding:0 0 25px}.detail-story{display:grid;grid-template-columns:.8fr 1.2fr;gap:100px;align-items:center;border-top:1px solid #d7e5f0;padding:70px 0}.detail-medallion{position:relative;border-radius:50%;background:var(--ice-blue);aspect-ratio:1;width:100%;max-width:310px;display:flex;align-items:center;justify-content:center;flex-direction:column;margin:auto}.detail-medallion:before{content:"";position:absolute;inset:15px;border:1px solid #469de3;border-radius:50%}.detail-medallion>span{position:relative}.detail-medallion svg{width:55px;height:55px}.detail-medallion strong{font:900 95px var(--font-rounded),Arial,sans-serif;line-height:1.1;letter-spacing:-.08em;margin-top:10px}.detail-story-1 .detail-medallion{background:var(--royal-blue);color:#fff}.detail-story-1 .detail-medallion:before{border-color:#ffffff55}.detail-story-2 .detail-medallion{background:#f0f7fb}.detail-story-2 .detail-medallion:before{border-color:#b9e3ef}.detail-story-copy h2{font-size:clamp(2.5rem,4vw,3.8rem)}.detail-story-copy h3{font-size:20px;font-weight:900;margin-top:25px}.detail-story-copy>p{font-size:17px;line-height:1.85;color:#52647a;margin-top:12px;max-width:600px}.detail-story-copy ul{list-style:none;padding:0;margin:25px 0 0;display:flex;flex-wrap:wrap;gap:9px}.detail-story-copy li{border:1px solid #d7e5f0;border-radius:30px;padding:9px 15px;font-size:14px}.detail-close{text-align:center;border-radius:40px;background:var(--ice-blue);margin-bottom:70px;padding:48px 30px}.detail-close>span{display:block;font-size:60px;color:var(--royal-blue);margin-bottom:15px}.detail-close h2{font-size:clamp(2.4rem,4vw,3.7rem)}.detail-close p{font-size:17px;color:#52647a;margin-top:22px}
@media(max-width:1000px){.detail-hero{gap:30px}.detail-story{gap:50px}.detail-medallion{max-width:260px}}@media(max-width:760px){.detail-hero{grid-template-columns:1fr;padding:25px 0 50px;gap:35px}.detail-hero-copy{text-align:center}.detail-hero h1{font-size:clamp(3.5rem,12vw,5.1rem)}.detail-hero-copy>p{font-size:16px;margin:24px auto 0}.detail-hero-visual{width:min(390px,94%);margin:auto}.detail-accent{width:110px;height:110px;font-size:65px}.detail-story{grid-template-columns:1fr;gap:28px;padding:40px 0;text-align:center}.detail-medallion{width:170px}.detail-medallion strong{font-size:53px}.detail-medallion svg{width:35px;height:35px}.detail-story-copy h3{margin-top:22px}.detail-story-copy>p{font-size:16px}.detail-story-copy ul{justify-content:center}.detail-close{margin-bottom:45px;padding:35px 22px}}


/* Supplied Suddy’s logo and solid wash-menu colors. */
:root {
  --wash-graphene: #6500a7;
  --wash-lava: #ef9900;
  --wash-signature: #00c5f4;
  --wash-basic: #c7f5fc;
}
.brand { display: block; flex: 0 0 auto; line-height: 0; }
.brand img { display: block; width: 182px; height: auto; }
.footer-brand { display: block; flex: 0 0 auto; line-height: 0; }
.footer-brand img { display: block; width: 150px; height: auto; }
.wash-plans { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.wash-plan { --wash-color: var(--wash-graphene); display: flex; flex-direction: column; padding: 25px 22px; background: var(--wash-color); color: #fff; }
.wash-plan--lava { --wash-color: var(--wash-lava); }
.wash-plan--signature { --wash-color: var(--wash-signature); color: var(--foreground); }
.wash-plan--basic { --wash-color: var(--wash-basic); color: #00134d; }
.wash-plan .plan-top { margin-bottom: 24px; }
.wash-plan .plan-icon { width: 58px; height: 58px; background: #fff; color: var(--wash-color); }
.wash-plan--signature .plan-icon, .wash-plan--basic .plan-icon { color: var(--foreground); }
.wash-plan .plan-number { opacity: 1; font-weight: 700; }
.wash-plan h3 { min-height: 2.2em; font-size: 28px; line-height: 1.1; }
.wash-plan > p { opacity: 1; }
.wash-plan .popular { top: -13px; right: 18px; background: #ffe000; color: #fff; }
.wash-plan .wash-pricing { background: #fff; color: #00134d; border-radius: 20px; gap: 0; margin: 16px 0 8px; }
.wash-plan .wash-pricing > div { padding: 16px; border: 0; border-radius: 0; }
.wash-plan .wash-pricing .monthly-price { border-top: 1px solid #e2e8ef; background: transparent; color: inherit; }
.wash-plan .wash-pricing dt { font-size: 13px; font-weight: 700; }
.wash-plan .wash-pricing dd { font-size: 30px; white-space: nowrap; }
.wash-plan .price-unit { font-size: 12px; }
.wash-plan ul { border-color: #ffffff55; margin-top: 16px; padding-top: 20px; }
.wash-plan--signature ul, .wash-plan--basic ul { border-color: #00134d33; }
.wash-plan li { align-items: flex-start; line-height: 1.5; }
.wash-plan li svg { margin-top: 2px; }
.wash-plan .plan-link { margin-top: auto; }
@media (max-width: 1150px) and (min-width: 761px) {
  .wash-plans { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
  .wash-plan h3 { min-height: 0; }
}
@media (max-width: 760px) {
  .brand img { width: 152px; }
  .nav { padding-top: 6px; }
  .wash-plans { grid-template-columns: 1fr; gap: 30px; }
  .wash-plan { padding: 28px; }
  .wash-plan h3 { min-height: 0; font-size: 32px; }
  .wash-plan .wash-pricing { grid-template-columns: 1fr 1fr; }
  .wash-plan .wash-pricing .monthly-price { border-top: 0; border-left: 1px solid #e2e8ef; }
  .wash-plan .wash-pricing dd { font-size: 28px; }
}
@media (max-width: 400px) {
  .brand img { width: 136px; }
  .wash-plan { padding: 24px; }
  .wash-plan .wash-pricing { grid-template-columns: 1fr; }
  .wash-plan .wash-pricing .monthly-price { border-left: 0; border-top: 1px solid #e2e8ef; }
}

/* Give the homepage detail preview its own space after the free amenities. */
.home-detailing { background: #fff; border-radius: 0; padding: 75px 0; }
.home-detailing .plan-0 { background: #f0f7fb; }
.home-detailing .plan-0 .plan-icon { background: #fff; }
.membership-detailing .plan { display: flex; flex-direction: column; }
.membership-detailing .detail-price { margin-top: auto; padding-top: 12px; }
.membership-detailing .availability { max-width: 800px; margin: 24px auto 0; line-height: 1.7; }
@media (max-width: 760px) {
  .home-detailing { padding: 50px 0; }
}
@media (max-width: 400px) {
  .nav nav { font-size: 12px; gap: 4px; }
  .nav nav a { white-space: nowrap; }
}
@media (max-width: 360px) {
  .brand img { width: 112px; }
  .nav { gap: 10px; }
  .nav nav { font-size: 11.5px; }
}

/* Suddy welcomes visitors where the decorative circle used to sit. */
.visit--mascot { display: grid; grid-template-columns: minmax(200px, .8fr) minmax(0, 1.2fr); align-items: center; gap: 48px; padding-top: 65px; padding-bottom: 65px; }
.visit-mascot { display: block; width: min(100%, 300px); height: auto; margin: auto; }
.visit-copy p { line-height: 1.7; color: #52647a; margin-bottom: 27px; }
@media (max-width: 760px) {
  .visit--mascot { grid-template-columns: 1fr; gap: 20px; padding-top: 45px; padding-bottom: 55px; }
  .visit-mascot { width: 210px; }
}

/* Purple from Suddy's mascot complements the established blue and cyan. */
:root {
  --mascot-purple: #6500a7;
  --purple-tint: #f4edfb;
  --purple-border: #de84ff;
}
.nav nav a[aria-current="page"]:after { background: var(--mascot-purple); }
.notice { background: var(--mascot-purple); }
.nav nav a[aria-current="page"], .nav nav a:hover, .text-link:hover,
h1 span, .difference h2 span { color: var(--mascot-purple); }
.hero .button, .visit .button { background: var(--mascot-purple); }
.hero .button:hover, .visit .button:hover { background: #00134d; }
.difference { background: var(--purple-tint); }
.benefits article:nth-child(2)>span { background: var(--mascot-purple); color: #fff; }
.membership-feature { background: var(--mascot-purple); }
.hero h1 span:after { background: var(--purple-border); }
.hero-art .spark { color: var(--mascot-purple); }
.hero-art .bubble-three { background: var(--purple-tint); border-color: var(--purple-border); }
.mini-circle, .benefits article:nth-child(3)>span,
.membership-notes article>span, .benefit-check {
  background: var(--purple-tint);
  color: var(--mascot-purple);
}
.membership-detailing .eyebrow { color: var(--mascot-purple); }
.membership-detailing .plan-2 .plan-icon { background: var(--purple-tint); color: var(--mascot-purple); }
footer { border-top-color: var(--purple-border); }

/* Logo proportions: crop only the supplied image's outer white padding in CSS. */
.brand img { width: 182px; height: 138px; object-fit: cover; }
.footer-brand img { width: 150px; height: 114px; object-fit: cover; }
.nav { min-height: 154px; height: auto; }
.notice { background: var(--royal-blue); border-bottom: 4px solid var(--yellow); }
.notice span { color: var(--yellow); }
a:focus-visible { outline-color: var(--violet); }
.photo-circle { border-color: var(--cyan); }
.round-stamp { background: var(--royal-blue); }
.round-stamp svg, .spark { color: var(--yellow); }
.bubble-one { background: var(--yellow); border-color: var(--gold); }
.hero-art .bubble-three { background: var(--purple); border-color: var(--violet); }
.hero h1 span:after { background: var(--yellow); }
.ticker { background: var(--cyan); color: var(--navy); border-block: 3px solid var(--royal-blue); }
.ticker-star { color: var(--violet); }
.wash-plan--lava { color: var(--navy); }
.wash-plan--lava .plan-icon { color: var(--navy); }
.wash-plan--lava ul { border-color: #00134d33; }
.wash-plan .popular { background: var(--yellow); color: var(--navy); }
.benefits article:nth-child(3)>span { background: var(--yellow); color: var(--navy); }
.benefits article:nth-child(4)>span { background: var(--lavender); color: var(--navy); }
.status-pill { background: var(--yellow); color: var(--navy); }
@media (max-width: 760px) {
  .nav { min-height: 120px; }
  .brand img { width: 152px; height: 115px; }
}
@media (max-width: 400px) { .brand img { width: 136px; height: 103px; } }
@media (max-width: 360px) { .brand img { width: 112px; height: 85px; } }

/* Branded location map stays uncropped so every street remains visible. */
.location-grid--map { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 42px; }
.location-map { display: block; overflow: hidden; border: 2px solid var(--ice-blue); border-radius: 28px; background: var(--ice-blue); }
.location-map img { display: block; width: 100%; height: auto; }
.location-map span { display: block; padding: 16px 20px; color: var(--navy); font-size: 14px; font-weight: 700; }
.location-map:hover span { background: var(--yellow); }
.location-info address { font-style: normal; line-height: 1.65; }
.location-info dd a:hover { text-decoration: underline; }
@media (max-width: 1000px) { .location-grid--map { grid-template-columns: 1fr; gap: 30px; } }

/* Privacy controls use native buttons and never imply consent from browsing. */
.footer-privacy { width: 100%; display: flex; flex-wrap: wrap; gap: 22px; align-items: center; }
.footer-privacy a, .footer-privacy button { font: 700 14px Arial, sans-serif; color: var(--violet); text-decoration: underline; }
.footer-privacy button { background: none; border: 0; padding: 8px 0; cursor: pointer; }
button:focus-visible { outline: 3px solid var(--violet); outline-offset: 4px; }
.cookie-banner { position: fixed; z-index: 1000; bottom: 20px; left: 20px; right: 20px; max-width: 1180px; margin: auto; display: flex; gap: 28px; align-items: center; background: #fff; color: var(--navy); border: 2px solid var(--royal-blue); border-top: 6px solid var(--yellow); border-radius: 24px; padding: 24px; box-shadow: 0 12px 50px #00134d30; max-height: calc(100dvh - 40px); overflow-y: auto; }
.cookie-banner[hidden], .cookie-banner [hidden] { display: none; }
.cookie-copy { flex: 1; min-width: 0; }
.cookie-copy h2 { font-size: 25px; letter-spacing: -.03em; line-height: 1.2; margin-bottom: 10px; }
.cookie-copy p { font-size: 14px; line-height: 1.6; margin-top: 8px; }
.cookie-copy a { color: var(--violet); text-decoration: underline; font-weight: 700; }
.cookie-status:empty { display: none; }
.cookie-actions { display: flex; flex-direction: column; gap: 10px; flex-shrink: 0; }
.cookie-actions button, .privacy-settings { padding: 14px 20px; border: 2px solid var(--royal-blue); border-radius: 30px; background: #fff; color: var(--royal-blue); font: 700 14px Arial, sans-serif; cursor: pointer; }
.cookie-actions button[data-consent="accepted"] { background: var(--royal-blue); color: #fff; }
.cookie-actions button:hover, .privacy-settings:hover { background: var(--ice-blue); color: var(--navy); }
.cookie-actions button:disabled { opacity: .55; cursor: not-allowed; }
.privacy-content { max-width: 850px; padding-bottom: 70px; }
.privacy-content h2 { font-size: 28px; letter-spacing: -.025em; line-height: 1.2; margin: 32px 0 14px; }
.privacy-content p { font-size: 16px; line-height: 1.8; margin-bottom: 16px; }
.privacy-content a { color: var(--violet); text-decoration: underline; overflow-wrap: anywhere; }
.privacy-content code { overflow-wrap: anywhere; }
@media (max-width: 760px) {
  .cookie-banner { bottom: 10px; left: 10px; right: 10px; max-height: calc(100dvh - 20px); padding: 20px; gap: 18px; flex-direction: column; align-items: stretch; }
  .cookie-actions { flex-direction: row; flex-wrap: wrap; }
  .cookie-actions button { flex: 1 1 180px; }
}

/* Shared footer contact information. */
.footer-contact { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; width: 100%; font-style: normal; font-size: 14px; line-height: 1.6; }
.footer-contact a { overflow-wrap: anywhere; }
.footer-contact a:hover { text-decoration: underline; }
@media (max-width: 760px) { .footer-contact { flex-direction: column; align-items: flex-start; gap: 10px; } }

/* Portal connection notice. */
.portal-notice { width: min(540px, calc(100% - 40px)); max-height: calc(100dvh - 40px); overflow-y: auto; padding: 42px 30px 30px; border: 2px solid var(--royal-blue); border-radius: 28px; color: var(--navy); background: #fff; box-shadow: 0 20px 70px #00134d30; }
.portal-notice::backdrop { background: #00134d99; }
.portal-notice h2 { font-size: clamp(26px, 5vw, 34px); line-height: 1.15; letter-spacing: -.03em; padding-right: 12px; }
.portal-notice p { margin-top: 20px; font-size: 16px; line-height: 1.7; }
.portal-notice p a { text-decoration: underline; overflow-wrap: anywhere; }
.portal-notice-close { position: absolute; right: 12px; top: 8px; width: 44px; height: 44px; border: 0; background: transparent; color: var(--navy); font-size: 30px; cursor: pointer; }
.portal-notice-done { margin-top: 24px; border: 0; cursor: pointer; }

/* Wash upgrade explanations. */
.wash-upgrades { padding-top: 20px; padding-bottom: 65px; }
.wash-upgrade-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.wash-upgrade-grid article { padding: 28px; border-radius: 24px; background: var(--ice-blue); }
.wash-upgrade-grid h3 { font-size: 25px; letter-spacing: -.03em; margin-bottom: 12px; }
.wash-upgrade-grid p { font-size: 16px; line-height: 1.7; }
.wash-upgrade-grid span { display: block; margin-top: 18px; font-size: 13px; font-weight: 700; line-height: 1.6; }
@media (max-width: 760px) { .wash-upgrade-grid { grid-template-columns: 1fr; } .wash-upgrades { padding-bottom: 45px; } }


.about-location-contact { grid-template-columns: 1fr; }

/* Keep directions directly below the footer's back-to-top link. */
.footer-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; margin-left: auto; }
.footer-actions > a:first-child { display: inline-flex; align-items: center; gap: 10px; font-size: 13px; }
.footer-actions .footer-directions { font-size: 14px; padding: 14px 22px; }

/* Responsive navigation and comfortable phone layouts. */
.menu-toggle, .nav nav .mobile-portal-link { display: none; }
img { max-width: 100%; }
.button { min-height: 44px; }
@media (max-width: 760px) {
  .wrap { width: calc(100% - 32px); }
  .notice { font-size: 10px; line-height: 1.6; padding: 10px 16px; letter-spacing: .06em; }
  .nav { min-height: 104px; gap: 8px 16px; padding-top: 0; padding-bottom: 10px; }
  .nav .brand img { width: 136px; height: 103px; }
  .nav > .button { display: none; }
  .nav .menu-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 10px; margin-left: auto; min-height: 48px; padding: 12px 18px; border: 2px solid var(--royal-blue); border-radius: 30px; background: #fff; color: var(--navy); font: 700 16px Arial, sans-serif; cursor: pointer; }
  .nav nav { display: flex; flex-direction: column; align-items: stretch; width: 100%; gap: 0; padding: 8px; border-radius: 20px; background: var(--purple-tint); font-size: 16px; }
  .nav.has-mobile-menu .menu-toggle[aria-expanded="false"] + nav { display: none; }
  .nav nav a { min-height: 48px; padding: 14px 16px; white-space: normal; border-radius: 12px; }
  .nav nav a[aria-current="page"] { background: #fff; }
  .nav nav a[aria-current="page"]:after { display: none; }
  .nav nav .mobile-portal-link { display: block; background: var(--royal-blue); color: #fff; margin-top: 8px; }
  .hero, .difference-inner, .membership-grid, .location-grid { min-width: 0; }
  .hero > *, .difference-inner > *, .membership-grid > *, .location-grid > *, .benefit-list li > div { min-width: 0; }
  h1, h2, h3 { overflow-wrap: break-word; }
  .page-intro { padding-top: 24px; padding-bottom: 32px; }
  .hero h1 { font-size: clamp(3.1rem, 12vw, 5.4rem); }
  .page-intro h1 { font-size: clamp(2.7rem, 11vw, 4.6rem); }
  .plan, .wash-plan { min-width: 0; }
  .wash-plan .wash-pricing { grid-template-columns: 1fr; }
  .wash-plan .wash-pricing .monthly-price { border-left: 0; border-top: 1px solid #e2e8ef; }
  .wash-plan .wash-pricing dd { white-space: normal; }
  .wash-plan .plan-link { min-height: 48px; }
  .benefits article > div { min-width: 0; }
  .benefits h3 { font-size: 21px; }
  .membership-feature { padding: 32px 24px; }
  .membership-feature .status-pill { max-width: 100%; overflow-wrap: anywhere; padding: 14px 18px; line-height: 1.5; }
  .membership-feature a, .location-info a { overflow-wrap: anywhere; }
  .membership-notes .text-link, .portal-card .text-link { min-height: 44px; padding: 12px 0; }
  .location-info h2 { font-size: clamp(1.9rem, 8vw, 2.5rem); }
  footer { align-items: flex-start; gap: 18px; padding-top: 24px; }
  footer p { flex: 1 1 120px; align-self: center; line-height: 1.6; }
  .footer-actions { width: 100%; margin-left: 0; gap: 8px; }
  .footer-actions > a:first-child { min-height: 44px; }
  .footer-contact { gap: 4px; }
  .footer-contact a { display: inline-flex; align-items: center; min-height: 44px; }
  .footer-privacy { gap: 12px 24px; }
  .footer-privacy a, .footer-privacy button { display: inline-flex; align-items: center; min-height: 44px; }
  .portal-notice { width: calc(100% - 24px); max-height: calc(100dvh - 24px); padding: 50px 22px 24px; }
  .portal-notice h2 { padding-right: 0; }
  .portal-notice p { margin-top: 16px; }
  .portal-notice-done { width: 100%; }
  .cookie-banner { padding: 18px; border-radius: 20px; }
  .cookie-actions button { min-height: 48px; }
}
@media (min-width: 540px) and (max-width: 760px) {
  .wash-plan .wash-pricing { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wash-plan .wash-pricing .monthly-price { border-top: 0; border-left: 1px solid #e2e8ef; }
}
/* A circular outline does not need rotation, which widened the page on phones. */
.hero-art .orbit { transform: none; }

/* Desktop navigation uses a filled tab to mark the current page. */
@media (min-width: 761px) {
  .nav nav a { padding: 13px 18px; border-radius: 100px; background: var(--purple-tint); }
  .nav nav a[aria-current="page"] { background: var(--violet); color: #fff; }
  .nav nav a[aria-current="page"]:after { display: none; }
  .nav nav a:hover { background: var(--ice-blue); color: var(--navy); }
}

/* Package menu inspired by the printed wash board. Background textures are replaceable. */
.package-menu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px;max-width:1050px;margin:40px auto}
.menu-package{position:relative;display:flex;flex-direction:column;min-width:0;border-radius:30px;background:#513080;color:white;box-shadow:8px 12px 14px #101a3b44;padding:26px 0 0;isolation:isolate}
.menu-package h3{font-size:clamp(30px,3.5vw,49px);line-height:1.02;text-transform:uppercase;font-weight:1000;letter-spacing:-1px;margin:0 24px 25px;text-align:center;color:white}
.menu-package ul{list-style:none;padding:0 32px;margin:0 0 30px;font-size:clamp(23px,2.7vw,36px);line-height:1.12;font-weight:1000;flex:1}
.menu-package--graphene{background:linear-gradient(rgba(29,4,55,.38),rgba(29,4,55,.38)),url("assets/graphene-supreme.webp") center / cover no-repeat}
.menu-package--lava{background:linear-gradient(rgba(48,5,0,.36),rgba(48,5,0,.36)),url("assets/lava-royale.webp") center / cover no-repeat}
.menu-package--signature{background:linear-gradient(rgba(0,39,67,.40),rgba(0,39,67,.40)),url("assets/signature-shine.webp") center / cover no-repeat}
.menu-package--basic{background:#929597}
.menu-package--basic ul{font-size:25px;line-height:1.18}
.menu-prices{display:grid;grid-template-columns:1fr 1fr;background:white;color:#080808;border-radius:28px;padding:17px 12px;gap:8px}
.menu-prices>div{text-align:center;display:flex;flex-direction:column;justify-content:center}
.menu-prices strong{font-size:40px;font-weight:1000;line-height:1.05;white-space:nowrap;letter-spacing:-1.5px}
.menu-prices sup{font-size:.52em;vertical-align:super;letter-spacing:0}
.menu-prices small{font-size:.48em;letter-spacing:0}
.menu-prices span{font-size:20px;line-height:1.1;font-weight:1000}
.menu-ribbon{position:absolute;right:-14px;top:145px;background:#ed181c;color:white;padding:13px 21px;font-size:22px;line-height:1;font-weight:1000;transform:rotate(13deg);text-align:center;box-shadow:0 4px 0 #b60816;z-index:2}
@media(max-width:650px){.package-menu{grid-template-columns:1fr;gap:32px;max-width:465px}.menu-package h3{font-size:clamp(29px,8vw,46px)}.menu-package ul{font-size:clamp(25px,7vw,35px);padding:0 25px}.menu-package--basic ul{font-size:23px}.menu-prices strong{font-size:clamp(29px,8vw,40px)}.menu-prices span{font-size:clamp(15px,4.4vw,20px)}.menu-ribbon{top:132px;font-size:18px}}

.menu-package h3,.menu-package ul{text-shadow:0 2px 5px #0007}

/* Home packages retain their existing grid and pricing layout. */
.home-wash-plans{align-items:start}
.home-wash-plans .wash-plan{color:#fff;background-position:center;background-size:cover;box-shadow:5px 9px 18px #101a3b2e}
.home-wash-plans .wash-plan--graphene{background-image:linear-gradient(#21043888,#21043888),url("assets/graphene-supreme.webp")}
.home-wash-plans .wash-plan--lava{background-image:linear-gradient(#30050088,#30050088),url("assets/lava-royale.webp")}
.home-wash-plans .wash-plan--signature{background-image:linear-gradient(#00274399,#00274399),url("assets/signature-shine.webp")}
.home-wash-plans .wash-plan--basic{background:#929597}
.home-wash-plans h3{text-transform:uppercase;font-weight:1000;color:#fff;text-shadow:0 2px 5px #0007}
.home-wash-plans .popular{background:#ed181c;color:#fff;box-shadow:0 3px 0 #b60816;transform:rotate(7deg)}
.home-wash-plans .wash-pricing{box-shadow:0 4px 8px #0002;color:#080808}
.home-wash-plans .package-details{margin-top:12px;border-top:1px solid #ffffff66}
.home-wash-plans .package-details summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;cursor:pointer;font-weight:800;list-style:none}
.home-wash-plans .package-details summary::-webkit-details-marker{display:none}
.home-wash-plans .package-details summary span{font-size:26px;transition:transform .18s}
.home-wash-plans .package-details[open] summary span{transform:rotate(45deg)}
.home-wash-plans .package-details summary:focus-visible{outline:3px solid #fff;outline-offset:3px;border-radius:5px}
.home-wash-plans .package-details ul{margin:0 0 18px;padding-top:12px;border-color:#ffffff55;color:#fff;text-shadow:0 1px 3px #0009}
.home-wash-plans .plan-link{border-color:#ffffff66;color:#fff}

.page-intro .membership-title{max-width:none;display:flex;flex-wrap:wrap;align-items:baseline;gap:0 .22em}.membership-title span{white-space:nowrap}

.home-wash-plans .package-details summary[aria-expanded="false"] span{transform:rotate(0)}
@media(prefers-reduced-motion:reduce){.home-wash-plans .package-details summary span{transition:none}}

/* Center page titles and allow natural wrapping across the full intro. */
.page-intro{text-align:center}
.page-intro h1{max-width:none;margin-left:auto;margin-right:auto}
.page-intro .membership-title{justify-content:center}
.page-intro .intro{margin-left:auto;margin-right:auto}
.hero-copy{text-align:center}
.hero-copy .hero-note{justify-content:center}

/* Headings use clean text without decorative underlines. */
h1,h2,h3,h4,h5,h6,h1 span,h2 span,h3 span,h4 span,h5 span,h6 span{text-decoration:none}
h1 span::after,h2 span::after,h3 span::after,h4 span::after,h5 span::after,h6 span::after{display:none}

/* Section titles follow the page-title typography, aligned to the left. */
main h2{font-family:var(--font-rounded),Arial,sans-serif;font-weight:900;letter-spacing:-.065em;line-height:1.05;text-align:left}
.section-heading{text-align:left}
.section-heading h2{max-width:none}
main h2 span{color:var(--mascot-purple)}

.difference{border-radius:0}

/* Free amenities sit below the section introduction in a horizontal row. */
.difference-inner{grid-template-columns:minmax(0,1fr);gap:32px}
.difference-inner>div:first-child{text-align:left;max-width:800px}
.difference .benefits{grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;align-items:start}
.difference .benefits article{flex-direction:column;align-items:flex-start;gap:16px;min-width:0}
@media(max-width:1000px){.difference .benefits{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.difference .benefits{grid-template-columns:minmax(0,1fr)}.difference .benefits article{flex-direction:row}}

/* Wide curved home banner, following the supplied layout sketch. */
.hero.hero--curved{width:100%;max-width:none;grid-template-columns:minmax(0,34fr) minmax(0,66fr);min-height:440px;padding:0;gap:0;overflow:hidden;align-items:stretch}
.hero--curved .hero-copy{align-self:center;padding:38px 20px 38px max(24px,calc((100vw - 1280px)/2));position:relative;z-index:2}
.hero.hero--curved h1{font-size:clamp(2.5rem,4.2vw,4.5rem);margin-top:0}
.hero--curved .intro{font-size:clamp(15px,1.3vw,19px);line-height:1.6;margin:20px auto 24px;max-width:390px}
.hero--curved .hero-note{font-size:12px;margin-top:18px}
.hero--curved .hero-art{width:100%;height:100%;min-height:440px;aspect-ratio:auto;margin:0}
.hero--curved .photo-circle{position:absolute;inset:0;width:100%;height:100%;border-radius:65% 0 0 0 / 100% 0 0 0;overflow:hidden;transform:none;border:0;box-shadow:inset 8px 0 0 var(--cyan)}
.hero--curved .photo-circle img{width:100%;height:100%;object-fit:cover;object-position:center 65%;transform:none}
.hero--curved .orbit,.hero--curved .round-stamp,.hero--curved .bubble,.hero--curved .spark{display:none}
.ticker{padding:7px 0;border-block-width:2px}
.ticker span{font-size:12px}
.ticker-group>.ticker-star{font-size:22px}
@media(max-width:760px){
 .hero.hero--curved{grid-template-columns:1fr;min-height:0}
 .hero--curved .hero-copy{padding:30px 24px}
 .hero.hero--curved h1{font-size:clamp(2.8rem,10vw,4rem)}
 .hero--curved .hero-art{min-height:290px}
 .hero--curved .photo-circle{border-radius:65% 0 0 0 / 75% 0 0 0}
 .hero--curved .hero-note{margin-top:16px}
}

/* Compact banner and soft navigation background. */
header.nav{background:#f1e8fc;box-shadow:0 0 0 100vmax #f1e8fc;clip-path:inset(0 -100vmax)}
.hero.hero--curved{grid-template-columns:minmax(0,48fr) minmax(0,52fr);height:400px;min-height:400px}
.hero--curved .hero-art{min-height:400px}
.hero--curved .hero-copy{padding-top:16px;padding-bottom:16px}
.hero.hero--curved h1{font-size:clamp(2.3rem,3.4vw,3.6rem)}
.hero--curved .intro{margin:12px auto 16px;max-width:490px;font-size:16px;line-height:1.45}
.hero--curved .hero-note{margin-top:10px}
@media(max-width:760px){
 .hero.hero--curved{grid-template-columns:1fr;height:auto;min-height:0}
 .hero--curved .hero-copy{padding:26px 24px}
 .hero--curved .hero-art{height:400px;min-height:400px}
}

/* Blend the logo's white canvas into the navigation color. */
header.nav .brand img{mix-blend-mode:multiply}

.hero--curved .hero-copy>.button{padding:10px 18px;font-size:13px;min-height:40px;gap:8px}
.hero--curved .hero-copy>.button svg{width:16px;height:16px}

.hero.hero--curved h1{text-align:left;font-size:clamp(1.7rem,3vw,3rem);white-space:nowrap;letter-spacing:-.065em}
@media(max-width:760px){.hero.hero--curved h1{font-size:clamp(1.4rem,5.8vw,2.6rem)}}

.hero--curved .hero-copy{text-align:left}
.hero--curved .hero-copy .intro{margin-left:0;margin-right:0}
.hero--curved .hero-copy .hero-note{justify-content:flex-start}

.hero--curved[data-banner-color]{background:var(--banner-bg);transition:background-color .5s}
.hero--curved[data-banner-color="purple"]{--banner-bg:#f1e8fc}
.hero--curved[data-banner-color="blue"]{--banner-bg:#e3edff}
.hero--curved[data-banner-color="cyan"]{--banner-bg:#c7f5fc}
.hero--curved[data-banner-color="yellow"]{--banner-bg:#fff7bc}
.hero--curved[data-banner-color="navy"]{--banner-bg:#00134d;color:#fff}
.hero--curved[data-banner-color="navy"] .intro,.hero--curved[data-banner-color="navy"] .hero-note{color:#fff}
.hero--curved[data-banner-color="navy"] h1 span{color:#de84ff}
.banner-colors{display:flex;align-items:center;gap:10px;margin-top:12px}
.banner-colors button{width:14px;height:14px;padding:0;border:1px solid #ffffff88;border-radius:50%;background:var(--swatch);cursor:pointer}
.banner-colors button[aria-pressed="true"]{outline:2px solid currentColor;outline-offset:3px}
.banner-colors .banner-pause{width:26px;height:24px;border:0;border-radius:5px;background:transparent;color:inherit;font-weight:700}
@media(prefers-reduced-motion:reduce){.hero--curved[data-banner-color]{transition:none}}

.hero--curved[data-banner-color]{transition:background-color 900ms cubic-bezier(.25,.1,.25,1)}
@media(prefers-reduced-motion:reduce){.hero--curved[data-banner-color]{transition:none}}

/* Clean header edge with a soft shadow below the navigation. */
header.nav{position:relative;z-index:5;border-bottom:0;box-shadow:0 0 0 100vmax #f1e8fc,0 6px 16px #00134d18;clip-path:inset(0 -100vmax -24px)}
.hero--curved .photo-circle{background:transparent;border:0;box-shadow:none}

/* Refreshed navigation: a shared link capsule and clear portal action. */
header.nav{gap:24px}
header.nav .brand{flex-shrink:0}
header.nav> .button{background:var(--violet);color:#fff;border:0;border-radius:14px;padding:14px 20px;box-shadow:0 4px 10px #6500a71c;font-size:13px}
header.nav> .button:hover{background:var(--navy)}
header.nav nav a{transition:background-color .2s,color .2s,box-shadow .2s}
@media(min-width:761px){
 header.nav{min-height:118px;height:118px;flex-wrap:nowrap}
 header.nav .brand img{width:146px;height:110px}
 header.nav nav{display:flex;flex-direction:row;align-items:center;justify-content:center;order:0;width:auto;gap:5px;padding:6px;background:#ffffff8c;border:1px solid #fff;border-radius:18px;font-size:14px}
 header.nav nav a{padding:12px 20px;border-radius:12px;background:transparent;color:var(--navy);white-space:nowrap}
 header.nav nav a[aria-current="page"]{background:var(--violet);color:#fff;box-shadow:0 3px 8px #6500a724}
 header.nav nav a:hover{background:#e4d1f6;color:var(--navy)}
 header.nav nav a[aria-current="page"]:hover{background:var(--violet);color:#fff}
}
@media(min-width:761px) and (max-width:1000px){header.nav{gap:12px}header.nav nav a{padding:12px}header.nav .brand img{width:120px;height:91px}header.nav>.button{padding:13px 14px;font-size:12px}}
@media(max-width:760px){
 header.nav .menu-toggle{border:1px solid #d7b8ee;background:#fff;color:var(--violet);border-radius:14px;box-shadow:0 3px 8px #6500a710}
 header.nav nav{background:#ffffffa8;border:1px solid #fff;border-radius:18px;padding:8px}
 header.nav nav a[aria-current="page"]{background:var(--violet);color:#fff}
 header.nav nav a{border-radius:12px}
}

.fade-enter{animation:site-fade-enter 650ms ease-out both;animation-delay:var(--float-delay,0ms)}
@keyframes site-fade-enter{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.fade-enter{animation:none!important;opacity:1}}

header.nav::after{content:"";position:absolute;left:calc((100% - 100vw)/2);bottom:0;width:100vw;height:1px;background:var(--navy);pointer-events:none}

/* Contain the navigation fill above its bottom edge. */
header.nav{box-shadow:none;clip-path:none;isolation:isolate}
header.nav::before{content:"";position:absolute;inset:0 calc((100% - 100vw)/2);background:#f1e8fc;box-shadow:0 6px 16px #00134d18;z-index:-1;pointer-events:none}

/* Shadow follows the curved photo silhouette. */
.hero--curved .hero-art{filter:drop-shadow(-9px 3px 9px #00134d50)}

.hero.hero--curved{position:relative}
.hero--curved>.banner-colors{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);z-index:4;margin:0;padding:7px 12px;border-radius:30px;background:#00134d40;color:#c7f5fc}
.hero--curved .banner-colors button[data-banner-choice]{background:#c7f5fc;border-color:#c7f5fc;width:10px;height:10px}
.hero--curved .banner-colors button[aria-pressed="true"]{outline-color:#c7f5fc}
.hero--curved .hero-copy{padding-bottom:42px}

.hero--curved>.banner-colors{left:max(24px,calc((100vw - 1280px)/2));transform:none}
@media(max-width:760px){.hero--curved>.banner-colors{left:24px}}

.hero--curved[data-banner-color="purple"]{--banner-dot:var(--purple)}
.hero--curved[data-banner-color="blue"]{--banner-dot:var(--bright-blue)}
.hero--curved[data-banner-color="cyan"]{--banner-dot:var(--cyan)}
.hero--curved[data-banner-color="yellow"]{--banner-dot:var(--yellow)}
.hero--curved[data-banner-color="navy"]{--banner-dot:var(--navy)}
.hero--curved .banner-colors button[data-banner-choice]{background:var(--banner-dot);border-color:#ffffff88;transition:background-color .5s}
.hero--curved .banner-colors button[aria-pressed="true"]{outline-color:var(--banner-dot)}
.hero--curved .hero-copy .hero-note{margin-top:0;margin-bottom:12px}

/* Fully rounded navigation pills. */
header.nav nav,header.nav nav a,header.nav>.button,header.nav .menu-toggle{border-radius:999px}

@media(max-width:760px){header.nav nav{border-radius:18px}}

/* Dot fills and active rings change in step with the banner. */
.hero--curved .banner-colors button[data-banner-choice]{transition:background-color 900ms cubic-bezier(.25,.1,.25,1),border-color 900ms cubic-bezier(.25,.1,.25,1),outline-color 900ms cubic-bezier(.25,.1,.25,1)}
@media(prefers-reduced-motion:reduce){.hero--curved .banner-colors button[data-banner-choice]{transition:none}}

.hero--curved[data-banner-color="purple"]{--banner-bg:#7135a5;color:#fff}
.hero--curved[data-banner-color="purple"] h1 span{color:#ffe000}
.hero--curved[data-banner-color="purple"] .intro,.hero--curved[data-banner-color="purple"] .hero-note{color:#fff}
.hero--curved[data-banner-color="purple"] .hero-copy>.button{background:#fff;color:#6500a7}
.hero--curved[data-banner-color="purple"] .hero-copy>.button:hover{background:#f1e8fc}

/* Ceramic charcoal replaces the blue slide. */
.hero--curved[data-banner-color="blue"]{--banner-bg:#303442;--banner-dot:#aeb7c2;color:#fff}
.hero--curved[data-banner-color="blue"] h1 span{color:#c7f5fc}
.hero--curved[data-banner-color="blue"] .intro,.hero--curved[data-banner-color="blue"] .hero-note{color:#fff}
.hero--curved[data-banner-color="blue"] .hero-copy>.button{background:#c7f5fc;color:#00134d}

/* Third slide uses the original blue banner palette. */
.hero--curved[data-banner-color="cyan"]{--banner-bg:#e3edff;--banner-dot:var(--bright-blue)}

.hero--curved[data-banner-color="navy"]{--banner-bg:#243b70}

/* Compact footer with a narrower content measure. */
footer.wrap{max-width:1040px;width:calc(100% - 64px);margin-left:auto;margin-right:auto;padding-top:18px;padding-bottom:18px;gap:12px 22px}
footer .footer-brand img{width:105px;height:80px}
footer p{font-size:12px}
footer .footer-actions{gap:8px}
footer .footer-actions .footer-directions{font-size:12px;padding:9px 15px;gap:8px}
footer .footer-contact{font-size:12px;gap:6px 22px;line-height:1.5}
footer small{font-size:11px}
footer .footer-privacy{gap:16px}
footer .footer-privacy a,footer .footer-privacy button{font-size:12px}
@media(max-width:760px){footer.wrap{width:calc(100% - 40px);gap:10px 18px}footer .footer-actions{width:auto;margin-left:auto}footer .footer-contact{gap:0}footer .footer-brand img{width:90px;height:68px}}

footer.wrap{max-width:1260px;width:calc(100% - 112px)}
@media(max-width:1000px){footer.wrap{width:calc(100% - 64px)}}
@media(max-width:760px){footer.wrap{width:calc(100% - 32px)}}

/* Footer sits one subtle shade below the white page background. */
footer.wrap{background:#f5f5f5;box-shadow:0 0 0 100vmax #f5f5f5;clip-path:inset(0 -100vmax)}

/* Light purple footer, slightly deeper than the navigation. */
footer.wrap{background:#e9def6;border-top:0;box-shadow:0 0 0 100vmax #e9def6}
footer .footer-brand img{mix-blend-mode:multiply}

/* Compact home package cards, with full details available on demand. */
.home-wash-plans--compact{gap:16px}
.home-wash-plans--compact .wash-plan{padding:20px 18px}
.home-wash-plans--compact .plan-top{margin-bottom:14px}
.home-wash-plans--compact .plan-icon{width:42px;height:42px}
.home-wash-plans--compact .plan-icon svg{width:24px;height:24px}
.home-wash-plans--compact .wash-plan h3{font-size:24px}
.home-wash-plans--compact .wash-pricing{margin:12px 0 6px;border-radius:16px}
.home-wash-plans--compact .wash-pricing>div{padding:12px}
.home-wash-plans--compact .wash-pricing dd{font-size:26px}
.home-wash-plans--compact .wash-pricing dt{font-size:12px;margin-bottom:4px}
.home-wash-plans--compact .package-details{margin-top:8px}
.home-wash-plans--compact .package-details summary{min-height:44px;font-size:14px}
.home-wash-plans--compact .plan-link{font-size:12px;min-height:44px}

/* One static curved banner on each interior page. */
.hero.page-banner{background:var(--page-banner-bg);margin-bottom:38px}
.hero.page-banner .hero-copy{padding:32px 24px 32px max(24px,calc((100vw - 1280px)/2));text-align:left}
.hero.page-banner h1{white-space:normal;text-align:left;font-size:clamp(2.5rem,4vw,4rem);line-height:1.05}
.hero.page-banner .membership-title{display:block}
.hero.page-banner .intro{margin:18px 0 0;max-width:520px}
@media(max-width:760px){.hero.page-banner .hero-copy{padding:30px 24px}.hero.page-banner .hero-art{height:260px;min-height:260px}.hero.page-banner h1{font-size:clamp(2.5rem,9vw,3.4rem)}}

/* Interior banners are half the home banner height. */
.hero.page-banner{height:200px;min-height:200px}
.hero.page-banner .hero-art{height:200px;min-height:200px}
.hero.page-banner .hero-copy{padding-top:20px;padding-bottom:20px}
.hero.page-banner h1{font-size:clamp(2rem,3vw,3rem)}
.hero.page-banner .intro{font-size:15px;line-height:1.45;margin-top:12px}
@media(max-width:760px){
 .hero.page-banner{grid-template-columns:minmax(0,60fr) minmax(0,40fr);height:200px;min-height:200px;gap:0}
 .hero.page-banner .hero-copy{padding:16px}
 .hero.page-banner h1{font-size:clamp(1.5rem,5vw,2rem)}
 .hero.page-banner .intro{font-size:12px;margin-top:10px}
 .hero.page-banner .hero-art{height:200px;min-height:200px}
}

/* Interior banner layout follows the supplied curved-edge reference. */
.hero.page-banner{grid-template-columns:minmax(0,36fr) minmax(0,64fr);background:#fff;gap:0}
.hero.page-banner .photo-circle{border-radius:6% 0 0 6% / 50% 0 0 50%;background:transparent}
.hero.page-banner .hero-copy{padding-right:24px}
.hero.page-banner h1{font-size:clamp(1.8rem,2.8vw,2.8rem)}
@media(max-width:760px){
 .hero.page-banner{grid-template-columns:minmax(0,55fr) minmax(0,45fr)}
 .hero.page-banner .photo-circle{border-radius:14% 0 0 14% / 50% 0 0 50%}
 .hero.page-banner .hero-copy{padding:16px}
 .hero.page-banner h1{font-size:clamp(1.4rem,4.8vw,2rem)}
}

.hero.page-banner{background:var(--page-banner-bg,#f1e8fc)}

.hero.page-banner,.hero.page-banner .hero-art{height:300px;min-height:300px}

.hero.page-banner{grid-template-columns:minmax(0,48fr) minmax(0,52fr)}
@media(max-width:760px){.hero.page-banner{grid-template-columns:minmax(0,65fr) minmax(0,35fr)}}

.hero.page-banner .photo-circle{border-radius:150px 0 0 150px}

/* Interior banners match the home banner geometry without rotation. */
.hero.page-banner{grid-template-columns:minmax(0,48fr) minmax(0,52fr);height:400px;min-height:400px}
.hero.page-banner .hero-art{height:400px;min-height:400px}
.hero.page-banner .photo-circle{border-radius:65% 0 0 0 / 100% 0 0 0}
.hero.page-banner .hero-copy{padding:16px 20px 42px max(24px,calc((100vw - 1280px)/2))}
.hero.page-banner h1{font-size:clamp(1.7rem,3vw,3rem);line-height:.98;letter-spacing:-.065em}
.hero.page-banner .intro{font-size:16px;line-height:1.45;margin:12px 0 16px;max-width:490px}
@media(max-width:760px){
 .hero.page-banner{grid-template-columns:1fr;height:auto;min-height:0}
 .hero.page-banner .hero-copy{padding:26px 24px}
 .hero.page-banner h1{font-size:clamp(1.4rem,5.8vw,2.6rem)}
 .hero.page-banner .hero-art{height:400px;min-height:400px}
 .hero.page-banner .photo-circle{border-radius:65% 0 0 0 / 75% 0 0 0}
}

.hero.page-banner .intro{max-width:550px;font-size:17px;line-height:1.65;margin:20px 0 14px}
.page-banner-note{font-size:13px;line-height:1.5;color:#52647a;margin:0 0 18px;max-width:550px}
.hero.page-banner .hero-copy{padding-top:24px;padding-bottom:24px}
@media(max-width:760px){.hero.page-banner .intro{font-size:15px;line-height:1.6}.page-banner-note{font-size:12px}}

/* Package features use two balanced columns. */
.home-wash-plans .package-details ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;align-content:start}
.home-wash-plans .package-details li{min-width:0;gap:7px;font-size:13px;line-height:1.5}
.home-wash-plans .package-details li svg{flex-shrink:0;width:15px;height:15px}

.home-wash-plans .wash-plan .plan-link{display:flex;justify-content:center;align-items:center;text-align:center;width:100%;gap:8px}

.wash-details-link{text-align:center;margin:28px 0 12px;font-size:15px;font-weight:700;color:var(--violet)}
.wash-details-link a{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px}
.wash-details-link a:hover{text-decoration:underline}

/* Cards in each package row match the tallest package. */
.home-wash-plans{align-items:stretch;grid-auto-rows:1fr}
.home-wash-plans .wash-plan{height:100%}

.home-wash-plans .wash-plan .package-details ul{padding-bottom:6px;margin-bottom:0}

/* Home dropdowns expand independently; membership cards keep equal heights. */
.home-wash-plans--compact{align-items:start;grid-auto-rows:auto}
.home-wash-plans--compact .wash-plan{height:auto}

/* Treatment cards with distinct accents and clear inclusion labels. */
.wash-upgrade-grid{gap:24px}
.wash-upgrade-grid .upgrade-card{--upgrade-accent:#6500a7;--upgrade-tint:#f2e9fc;position:relative;display:flex;flex-direction:column;padding:30px;background:#fff;border:1px solid #e7e2ed;border-top:4px solid var(--upgrade-accent);border-radius:20px;box-shadow:0 8px 24px #00134d09}
.wash-upgrade-grid .upgrade-card--ceramic{--upgrade-accent:#06349e;--upgrade-tint:#e9efff}
.wash-upgrade-grid .upgrade-card--wax{--upgrade-accent:#a83e14;--upgrade-tint:#fff0e7}
.wash-upgrade-grid .upgrade-card--storm{--upgrade-accent:#007797;--upgrade-tint:#e3f8fc}
.upgrade-icon{display:grid;place-items:center;width:54px;height:54px;border-radius:16px;background:var(--upgrade-tint);color:var(--upgrade-accent);margin-bottom:20px}
.wash-upgrade-grid h3{font-size:28px;color:var(--navy);margin-bottom:10px}
.wash-upgrade-grid p{color:#52647a;line-height:1.7;flex:1;margin-bottom:22px}
.wash-upgrade-grid article>span{margin-top:auto;align-self:flex-start;background:var(--upgrade-tint);color:var(--upgrade-accent);border-radius:999px;padding:8px 14px;font-size:12px}
@media(max-width:760px){.wash-upgrade-grid .upgrade-card{padding:24px}}

/* Compact treatment cards echo the wash packages. */
.wash-upgrade-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.wash-upgrade-grid .upgrade-card{padding:22px 18px;border:0;border-radius:24px;color:#fff;background:linear-gradient(#21043899,#21043899),url("assets/graphene-supreme.webp") center/cover;box-shadow:5px 9px 18px #101a3b2e}
.wash-upgrade-grid .upgrade-card--ceramic{background:linear-gradient(#303442b3,#303442b3),url("assets/signature-shine.webp") center/cover}
.wash-upgrade-grid .upgrade-card--wax{background:linear-gradient(#30050099,#30050099),url("assets/lava-royale.webp") center/cover}
.wash-upgrade-grid .upgrade-card--storm{background:linear-gradient(#00274399,#00274399),url("assets/signature-shine.webp") center/cover}
.wash-upgrade-grid .upgrade-icon{width:42px;height:42px;border-radius:50%;background:white;color:var(--upgrade-accent);margin-bottom:16px}
.wash-upgrade-grid .upgrade-icon svg{width:23px;height:23px}
.wash-upgrade-grid h3{color:#fff;text-transform:uppercase;font-size:23px;font-weight:900;line-height:1.1;margin-bottom:12px}
.wash-upgrade-grid p{color:#fff;font-size:14px;line-height:1.55;margin-bottom:18px;text-shadow:0 1px 3px #0005}
.wash-upgrade-grid article>span{background:#fff;color:#00134d;border-radius:14px;padding:10px 12px;font-size:11px;line-height:1.5;align-self:stretch}
@media(max-width:1100px){.wash-upgrade-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:539px){.wash-upgrade-grid{grid-template-columns:1fr;gap:16px}.wash-upgrade-grid .upgrade-card{padding:20px}}

/* Gradient treatment cards with a colored top edge. */
.wash-upgrade-grid .upgrade-card{background:linear-gradient(145deg,#fff,var(--upgrade-tint));border-top:4px solid var(--upgrade-accent);color:var(--navy)}
.wash-upgrade-grid h3{color:var(--navy)}
.wash-upgrade-grid p{color:#52647a;text-shadow:none}
.wash-upgrade-grid article>span{background:#ffffffb3;color:var(--upgrade-accent)}

.wash-upgrade-grid .upgrade-card--tire{--upgrade-accent:#303442;--upgrade-tint:#eceef2}
.wash-upgrade-grid .upgrade-card--wheels{--upgrade-accent:#06349e;--upgrade-tint:#e9efff}
.wash-upgrade-grid .upgrade-card--foam{--upgrade-accent:#9225b5;--upgrade-tint:#f8e7ff}
.wash-upgrade-grid .upgrade-card--clear{--upgrade-accent:#007797;--upgrade-tint:#e3f8fc}

/* Distinct accents for all eight treatment cards. */
.wash-upgrade-grid .upgrade-card--wheels{--upgrade-accent:#28734a;--upgrade-tint:#e7f4eb}
.wash-upgrade-grid .upgrade-card--foam{--upgrade-accent:#b52d73;--upgrade-tint:#fce8f2}
.wash-upgrade-grid .upgrade-card--clear{--upgrade-accent:#927000;--upgrade-tint:#fff6d5}

.wash-upgrade-grid .upgrade-card{border-bottom:4px solid var(--upgrade-accent)}

/* Little extras accordion. */
.extras-accordion{display:grid;gap:12px;margin-top:28px}
.extra-item{border:1px solid #e3d6ee;border-radius:18px;background:linear-gradient(110deg,#fff,#f6f0fc);overflow:hidden}
.extra-item summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 24px;list-style:none;cursor:pointer;font-family:var(--font-rounded),Arial,sans-serif;font-size:21px;font-weight:900;color:var(--navy)}
.extra-item summary::-webkit-details-marker{display:none}
.extra-item summary span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#e9def6;color:var(--violet);font:24px Arial;flex-shrink:0;transition:transform .25s}
.extra-item[open] summary span{transform:rotate(45deg)}
.extra-item[open]{border-color:#c8a2e5}
.extra-item summary:focus-visible{outline:3px solid var(--violet);outline-offset:-4px}
.extra-description{padding:0 24px 22px;color:#52647a;font-size:15px;line-height:1.7}
.extra-description p{margin:0}
@media(max-width:760px){.extra-item summary{padding:18px;font-size:19px}.extra-description{padding:0 18px 20px}}
@media(prefers-reduced-motion:reduce){.extra-item summary span{transition:none}}

/* Always-visible extras with checkmarks and fuller descriptions. */
.extras-list{display:grid;gap:16px;margin-top:28px}
.extra-row{display:flex;align-items:flex-start;gap:22px;padding:26px 28px;background:linear-gradient(110deg,#fff,#f3ebfa);border:1px solid #e4d7ef;border-radius:20px}
.extra-check{display:grid;place-items:center;flex-shrink:0;width:44px;height:44px;border-radius:50%;background:#e9def6;color:var(--violet);font-size:24px;font-weight:900}
.extra-row h3{font-size:23px;line-height:1.2;margin:0 0 9px;color:var(--navy)}
.extra-row p{font-size:16px;line-height:1.75;color:#52647a;max-width:900px;margin:0}
@media(max-width:760px){.extra-row{padding:20px;gap:16px}.extra-check{width:36px;height:36px;font-size:21px}.extra-row h3{font-size:21px}.extra-row p{font-size:15px}}

/* Membership disclosures resize independently from neighboring cards. */
.membership-washes .home-wash-plans{align-items:start;grid-auto-rows:auto}
.membership-washes .home-wash-plans .wash-plan{height:auto}

.home-wash-plans .package-details[open] ul{min-height:var(--expanded-features-height,0px)}

/* Shared navigation dimensions on every page. */
header.nav{flex-shrink:0}
header.nav .brand,header.nav>.button,header.nav .menu-toggle{flex-shrink:0}
@media(min-width:761px){
 header.nav{height:118px;min-height:118px;padding-top:0;padding-bottom:0}
 header.nav nav{flex-shrink:0}
 header.nav>.button{min-height:44px;white-space:nowrap}
}
@media(max-width:760px){header.nav{height:auto;min-height:104px}}

/* Reserve scrollbar space on short pages to prevent navigation width shifts. */
html{overflow-y:scroll;scrollbar-gutter:stable}

/* Detailing packages pair each price with its included wash. */
.detailing-packages{padding-top:20px;padding-bottom:65px}
.detail-package-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
.detail-package{border-radius:24px;box-shadow:5px 9px 18px #101a3b2e;color:#fff}
.detail-package--unused{display:none}
.detail-package.wash-plan--signature{background:linear-gradient(#00274399,#00274399),url("assets/signature-shine.webp") center/cover}
.detail-package.wash-plan--lava{background:linear-gradient(#30050099,#30050099),url("assets/lava-royale.webp") center/cover}
.detail-package.wash-plan--graphene{background:linear-gradient(#21043899,#21043899),url("assets/graphene-supreme.webp") center/cover}
.detail-label{font-size:12px;font-weight:800;letter-spacing:.08em}
.detail-package h3{color:#fff;text-transform:uppercase;font-size:28px;min-height:0;text-shadow:0 2px 5px #0005}
.detail-package-price{display:flex;flex-direction:column;background:#fff;color:#00134d;padding:18px;border-radius:20px;margin:18px 0}
.detail-package-price strong{font-size:40px;font-weight:900;line-height:1.1}
.detail-package-price span{font-size:13px;margin-top:5px}
.detail-package-includes{padding:4px 0 22px}
.detail-package-includes h4{font-size:12px;text-transform:uppercase;letter-spacing:.06em;margin:0 0 8px;color:#fff}
.detail-package-includes p{font-size:23px;font-weight:900;color:#fff}
.detail-package-link{margin-top:auto;font-size:13px;font-weight:700;color:#fff;min-height:44px;display:flex;align-items:center;border-top:1px solid #ffffff66}
.wash-upgrade-grid .upgrade-card--detail-signature{--upgrade-accent:#007797;--upgrade-tint:#e3f8fc}
.wash-upgrade-grid .upgrade-card--detail-lava{--upgrade-accent:#a83e14;--upgrade-tint:#fff0e7}
.wash-upgrade-grid .upgrade-card--detail-graphene{--upgrade-accent:#6500a7;--upgrade-tint:#f2e9fc}
@media(max-width:760px){.detail-package-grid{grid-template-columns:1fr}.detailing-packages{padding-bottom:45px}}

.detail-package .package-details{border-top:1px solid #ffffff66;margin-top:4px}
.detail-package .package-details summary{display:flex;justify-content:space-between;align-items:center;min-height:48px;list-style:none;cursor:pointer;font-weight:800;font-size:14px}
.detail-package .package-details summary::-webkit-details-marker{display:none}
.detail-package .package-details summary>span{font-size:24px}
.detail-package .package-details[open] summary>span{transform:rotate(45deg)}
.detail-package .package-details ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0;padding:12px 0 4px;border-top:1px solid #ffffff44}
.detail-package .package-details li{display:flex;gap:7px;font-size:13px;line-height:1.5;color:#fff}
.detail-draft-note{text-align:center;font-size:13px;color:#52647a;margin:22px 0 0;line-height:1.6}

/* Detailing photos matched to the three service tiers. */
.detail-package.wash-plan--graphene{background:linear-gradient(#16082cbb,#16082cdd),url("assets/detail-buffing.webp") center/cover}
.detail-package.wash-plan--lava{background:linear-gradient(#301008bb,#301008dd),url("assets/detail-exterior.webp") center/cover}
.detail-package.wash-plan--signature{background:linear-gradient(#00273bbb,#00273bdd),url("assets/detail-interior.webp") center/cover}

.detail-care-time{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:12px 0 16px;margin:0;color:#fff}
.detail-care-time span{font-size:12px}
.detail-care-time strong{font-size:16px}
.detail-package-grid{align-items:start;grid-auto-rows:auto}
.detail-package-grid .detail-package{height:auto}
.detail-package .package-details summary:focus-visible{outline:3px solid #fff;outline-offset:3px}

/* Express detailing menu supplied by Suddy’s. */
.detail-package-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.detail-package{position:relative}
.detail-package--revival{background:linear-gradient(#00273bc9,#00273be6),url("assets/detail-interior.webp") center/cover}
.detail-package--reset{background:linear-gradient(#210438bb,#210438e6),url("assets/detail-interior.webp") center/cover}
.detail-package--slate{background:linear-gradient(#12324ac9,#12324ae6),url("assets/detail-interior.webp") center/cover}
.detail-package--fresh{background:linear-gradient(#00273bc9,#00273be6),url("assets/detail-exterior.webp") center/cover}
.detail-package .detail-tagline{font-size:13px;color:#fff;line-height:1.5;margin-top:10px;min-height:3em}
.detail-package-grid .detail-package h3{font-size:25px;min-height:2.2em}
.detail-package-grid .detail-package-includes p{font-size:21px}
.detail-package-grid .package-details ul{grid-template-columns:1fr}
.detail-popular{position:absolute;top:-12px;right:14px;background:#ffe000;color:#00134d;border-radius:999px;padding:7px 12px;font-size:10px;font-weight:900}
.exterior-detail-callout{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-top:32px;border-radius:24px;padding:30px;background:linear-gradient(90deg,#00134df2,#00134d88),url("assets/detail-buffing.webp") center/cover;color:#fff}
.exterior-detail-callout h3{font-size:30px;margin-bottom:12px}
.exterior-detail-callout p{font-size:16px;line-height:1.6;max-width:600px}
.exterior-detail-callout>div:last-child{display:flex;flex-direction:column;gap:6px;flex-shrink:0}
.exterior-detail-callout strong{font-size:42px}
.exterior-detail-callout a{font-size:13px;text-decoration:underline;min-height:44px;display:flex;align-items:center}
.detail-member-note{text-align:center;background:#f1e8fc;color:#6500a7;border-radius:18px;padding:18px;margin-top:22px;font-weight:800;line-height:1.6}
@media(max-width:1100px){.detail-package-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.detail-package-grid{grid-template-columns:1fr}.exterior-detail-callout{flex-direction:column;align-items:flex-start;padding:24px}}

/* Service-specific detailing photography; existing service times retained. */
.detail-package--fresh{background:linear-gradient(#00273bb3,#00273be6),url("assets/detail-dashboard-clean.webp") 48% center/cover}
.detail-package--slate{background:linear-gradient(#12324ab3,#12324ae6),url("assets/detail-carpet-extraction.webp") 35% center/cover}
.detail-package--reset{background:linear-gradient(#210438b3,#210438e6),url("assets/detail-carpet-extraction.webp") 65% center/cover}
.detail-package--revival{background:linear-gradient(#00273bb3,#00273be6),url("assets/detail-dashboard-clean.webp") 70% center/cover}
.exterior-detail-callout{background-image:linear-gradient(90deg,#00134de6,#00134d99),url("assets/detail-decontamination.webp"),url("assets/detail-buffing-new.webp"),url("assets/detail-ceramic-application.webp");background-size:100% 100%,34% 100%,34% 100%,34% 100%;background-position:center,left center,center center,right center;background-repeat:no-repeat}

/* Detailing packages use two rows of two cards. */
.detail-package-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:600px){.detail-package-grid{grid-template-columns:minmax(0,1fr)}}

/* Detailing cards share the wash-card visual language. */
.detail-package-grid .detail-package{padding:25px 22px;color:#fff}
.detail-package-grid .detail-package .plan-top{margin-bottom:24px}
.detail-package-grid .detail-package .plan-icon{color:var(--violet);background:#fff}
.detail-package-grid .detail-package h3{font-size:28px;min-height:0;line-height:1.1}
.detail-package-grid .detail-tagline{min-height:0;margin:10px 0 0}
.detail-package-grid .wash-pricing{display:grid;grid-template-columns:1fr 1fr;background:#fff;color:#00134d;border-radius:20px;gap:0;margin:16px 0 8px}
.detail-package-grid .wash-pricing .monthly-price{border-top:0;border-left:1px solid #e2e8ef}
.detail-package-grid .wash-pricing dd.included-wash-name{font-size:20px;white-space:normal;line-height:1.2}
.detail-package-grid .package-details ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
.detail-package-grid .detail-care-time{padding:10px 0;font-size:13px}
.detail-package-grid .package-details summary{min-height:52px}
@media(max-width:600px){.detail-package-grid .detail-package{padding:24px}.detail-package-grid .wash-pricing{grid-template-columns:1fr}.detail-package-grid .wash-pricing .monthly-price{border-left:0;border-top:1px solid #e2e8ef}}

.detail-package-grid{max-width:920px;margin-left:auto;margin-right:auto;gap:24px}

.detail-package-grid{max-width:none;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.detail-package-grid .wash-pricing{grid-template-columns:1fr}
.detail-package-grid .wash-pricing .monthly-price{border-left:0;border-top:1px solid #e2e8ef}
@media(max-width:1100px){.detail-package-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.detail-package-grid{grid-template-columns:minmax(0,1fr)}}

/* Equal expanded detailing cards retain independent disclosure controls. */
.detail-package-grid{align-items:start;grid-auto-rows:auto}
.detail-package-grid .detail-package{height:auto}
.detail-package-grid .detail-package h3{min-height:2.2em}
.detail-package-grid .detail-tagline{min-height:var(--detail-tagline-height,3em)}
.detail-package-grid .package-details[open] ul{min-height:var(--expanded-features-height,0px)}
.detail-package-grid .detail-care-time{min-height:60px}
.detail-package-grid .package-details summary>span{transition:transform .18s}
@media(prefers-reduced-motion:reduce){.detail-package-grid .package-details summary>span{transition:none}}

/* Consistent spacing and readable wrapping within detailing cards. */
.detail-package-grid .detail-package{padding:24px 20px}
.detail-package-grid .detail-package .plan-top{margin-bottom:20px}
.detail-package-grid .detail-package h3{font-size:26px;line-height:1.15;letter-spacing:-.035em;margin:0}
.detail-package-grid .detail-tagline{font-size:13px;line-height:1.6;margin:10px 0 0}
.detail-package-grid .wash-pricing{margin:18px 0 8px}
.detail-package-grid .wash-pricing>div{padding:15px 16px}
.detail-package-grid .wash-pricing dt{line-height:1.4;margin-bottom:7px}
.detail-package-grid .wash-pricing dd{line-height:1.2;margin:0}
.detail-package-grid .wash-pricing dd.included-wash-name{font-size:19px;line-height:1.3}
.detail-package-grid .detail-care-time{gap:6px 10px;padding:12px 0 16px;line-height:1.5}
.detail-package-grid .detail-care-time strong{font-size:15px}
.detail-package-grid .package-details summary{padding:8px 0;line-height:1.5;gap:12px}
.detail-package-grid .package-details ul{padding:16px 0 6px;gap:14px 12px;margin:0;align-content:start}
.detail-package-grid .package-details li{font-size:13px;line-height:1.6;align-items:flex-start;gap:7px;overflow-wrap:break-word}
.detail-package-grid .package-details li>span{flex-shrink:0;line-height:1.6}
@media(min-width:1101px){.detail-package-grid .package-details ul{grid-template-columns:minmax(0,1fr)}}

/* Matching, comfortably sized headings for both treatment guides. */
#wash-upgrades-title,#detail-guide-title{font-size:clamp(1.8rem,3.2vw,3rem);line-height:1.12;letter-spacing:-.045em}

/* Show more detailing photography while retaining contrast behind copy. */
.detail-package--fresh{background:linear-gradient(180deg,#00273b55 0%,#00273b88 38%,#00273bc9 100%),url("assets/detail-dashboard-clean.webp") 48% center/cover}
.detail-package--slate{background:linear-gradient(180deg,#12324a55 0%,#12324a88 38%,#12324ac9 100%),url("assets/detail-carpet-extraction.webp") 35% center/cover}
.detail-package--reset{background:linear-gradient(180deg,#21043855 0%,#21043888 38%,#210438c9 100%),url("assets/detail-carpet-extraction.webp") 65% center/cover}
.detail-package--revival{background:linear-gradient(180deg,#00273b55 0%,#00273b88 38%,#00273bc9 100%),url("assets/detail-dashboard-clean.webp") 70% center/cover}
.detail-package .plan-top,.detail-package h3,.detail-package .detail-tagline,.detail-package .detail-care-time,.detail-package .package-details{text-shadow:0 1px 4px #000b}
.detail-package .plan-icon,.detail-package .wash-pricing{text-shadow:none}

/* Compact included-wash panel on preview and full detailing cards. */
.detail-package-grid .wash-pricing .monthly-price{padding:10px 14px}
.detail-package-grid .wash-pricing .monthly-price dt{font-size:11px;margin-bottom:4px;line-height:1.3}
.detail-package-grid .wash-pricing dd.included-wash-name{font-size:15px;line-height:1.25}

.detail-package-grid .wash-pricing .monthly-price{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:3px 8px;padding:8px 12px}
.detail-package-grid .wash-pricing .monthly-price dt{font-size:10px;line-height:1.3;margin:0}
.detail-package-grid .wash-pricing dd.included-wash-name{font-size:12px;line-height:1.3;margin:0}

.detail-package--reset{background:linear-gradient(180deg,#21043855 0%,#21043888 38%,#210438c9 100%),url("assets/detail-deep-reset.webp") center/cover}

/* Center pricing throughout wash and detailing packages. */
.wash-pricing{text-align:center}
.detail-package-grid .wash-pricing .monthly-price{justify-content:center;text-align:center}
.detail-package-price{text-align:center;align-items:center}
.exterior-detail-callout>div:last-child{text-align:center;align-items:center}

.exterior-detail-callout>div:last-child{text-align:right;align-items:flex-end}

/* Community fundraising introduction. */
.fundraising{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:64px;padding-top:20px;padding-bottom:70px;align-items:center}
.fundraising h2 span{color:var(--violet)}
.fundraising-copy>.intro{font-size:20px;line-height:1.5;margin:24px 0 18px}
.fundraising-copy>p:not(.intro){font-size:16px;line-height:1.8;color:#52647a;margin-bottom:18px}
.fundraising .button{margin-top:8px;font-size:14px;padding:14px 22px;background:var(--violet)}
.fundraising-copy .fundraising-phone{margin-top:18px;font-size:14px}
.fundraising-phone a{color:var(--violet);font-weight:700}
.fundraising-info{background:linear-gradient(135deg,#f8f3fc,#e9def6);border-radius:24px;border-top:4px solid var(--violet);padding:32px}
.fundraising-info h3{font-size:25px;margin-bottom:20px}
.fundraising-info ul{padding-left:20px;margin:0 0 20px;line-height:1.7;color:#52647a}
.fundraising-info li{margin-bottom:12px}
.fundraising-info p{font-size:14px;line-height:1.6;color:var(--violet)}
@media(max-width:760px){.fundraising{grid-template-columns:1fr;gap:28px;padding-bottom:45px}.fundraising-info{padding:24px}}

.detailing-disclaimer{padding:16px 20px;margin:0 0 28px;background:#f1e8fc;border-left:3px solid var(--violet);border-radius:0 14px 14px 0;font-size:14px;line-height:1.7;color:var(--navy)}

.home-faq{padding-top:65px;padding-bottom:55px}
.home-faq .extras-accordion{max-width:1000px;margin-left:auto;margin-right:auto}
.home-faq .extra-item summary{font-size:19px}
.home-faq .extra-description a{color:var(--violet);text-decoration:underline;overflow-wrap:anywhere}
@media(max-width:760px){.home-faq{padding-top:45px;padding-bottom:35px}.home-faq .extra-item summary{font-size:17px}}

/* About: brand story, approach, and mascot. */
.about-story,.about-mascot{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px;align-items:center;padding-top:35px;padding-bottom:65px}
.about-story h2 span,.about-mascot h2 span{color:var(--violet)}
.about-story .intro,.about-mascot .intro{font-size:21px;line-height:1.5;margin:24px 0 18px}
.about-story-copy>p:not(.intro),.about-mascot>div>p:not(.intro){font-size:16px;line-height:1.8;color:#52647a;margin-bottom:18px}
.about-story>img{width:100%;height:390px;object-fit:cover;border-radius:28px}
.about-story .button,.about-mascot .button{font-size:14px;padding:14px 22px;margin-top:8px;background:var(--violet)}
.about-difference{padding-top:20px;padding-bottom:50px}
.about-values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.about-values article{padding:28px;background:linear-gradient(135deg,#fff,#f1e8fc);border:1px solid #e9def6;border-radius:24px}
.about-value-number{display:grid;place-items:center;width:42px;height:42px;background:#e9def6;color:var(--violet);border-radius:50%;font-weight:900;margin-bottom:20px}
.about-values h3{font-size:25px;line-height:1.2;margin-bottom:14px}
.about-values p{font-size:15px;line-height:1.8;color:#52647a}
.about-mascot-art{background:radial-gradient(ellipse,#e9def6,transparent 70%);text-align:center}
.about-mascot-art img{display:block;width:auto;max-width:100%;height:440px;object-fit:contain;margin:auto}
@media(max-width:760px){.about-story,.about-mascot{grid-template-columns:1fr;gap:28px;padding-bottom:45px}.about-values{grid-template-columns:1fr}.about-story>img{height:280px}.about-mascot-art img{height:340px}.about-story .intro,.about-mascot .intro{font-size:19px}}

/* Larger touch targets retain the small banner dots. */
@media(max-width:760px){
 .hero--curved>.banner-colors{gap:2px;padding:4px 8px}
 .hero--curved .banner-colors button[data-banner-choice]{width:32px;height:32px;border:0;background:transparent;outline:none;display:grid;place-items:center}
 .hero--curved .banner-colors button[data-banner-choice]::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--banner-dot);border:1px solid #ffffff88;transition:background-color 900ms cubic-bezier(.25,.1,.25,1),outline-color 900ms cubic-bezier(.25,.1,.25,1)}
 .hero--curved .banner-colors button[aria-pressed="true"]::before{outline:2px solid var(--banner-dot);outline-offset:3px}
 .hero--curved .banner-colors .banner-pause{width:32px;height:32px}
 .hero--curved .banner-colors button:focus-visible{outline:2px solid white;outline-offset:1px}
}
@media(prefers-reduced-motion:reduce){.hero--curved .banner-colors button[data-banner-choice]::before{transition:none}}

/* Light blue bands behind both treatment guides, matching the blue banner. */
.wash-upgrades{background:#e3edff;box-shadow:0 0 0 100vmax #e3edff;clip-path:inset(0 -100vmax);padding-top:45px;padding-bottom:45px}

/* Mascot section uses the purple welcome-banner palette. */
.about-mascot{background:#7135a5;color:#fff;box-shadow:0 0 0 100vmax #7135a5;clip-path:inset(0 -100vmax);padding-top:50px;padding-bottom:50px}
.about-mascot h2 span{color:#ffe000}
.about-mascot .intro,.about-mascot>div>p:not(.intro){color:#fff}
.about-mascot .button{background:#fff;color:#6500a7}
.about-mascot .button:hover{background:#f1e8fc}
.about-mascot-art{background:radial-gradient(ellipse,#ffffff20,transparent 70%)}

/* Treatment guides stay compact until visitors choose to explore. */
.treatment-guide-disclosure>.guide-summary{list-style:none;cursor:pointer;align-items:center;margin-bottom:0;position:relative;padding-right:58px}
.treatment-guide-disclosure>.guide-summary::-webkit-details-marker{display:none}
.guide-toggle{position:absolute;right:0;top:50%;margin-top:-20px;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#fff;color:var(--violet);font:28px Arial,sans-serif;transition:transform .2s}
.treatment-guide-disclosure[open] .guide-toggle{transform:rotate(45deg)}
.treatment-guide-disclosure>.guide-summary:focus-visible{outline:3px solid var(--violet);outline-offset:8px;border-radius:8px}
.guide-content{padding-top:28px}
@media(prefers-reduced-motion:reduce){.guide-toggle{transition:none}}

/* Soft purple mascot section, matching the interior banner palette. */
.about-mascot{background:#f1e8fc;color:var(--navy);box-shadow:0 0 0 100vmax #f1e8fc}
.about-mascot h2 span{color:var(--violet)}
.about-mascot .intro{color:var(--navy)}
.about-mascot>div>p:not(.intro){color:#52647a}
.about-mascot .button{background:var(--violet);color:#fff}
.about-mascot .button:hover{background:var(--navy);color:#fff}
.about-mascot-art{background:radial-gradient(ellipse,#decbef88,transparent 70%)}

.treatment-guide-disclosure .guide-summary[aria-expanded="false"] .guide-toggle{transform:rotate(0)}