/* MySocietyDesk v4.18.2 — Public homepage refinement
   Refinement-only layer over v4.18.1. Preserves Civic Signal visual identity and routes. */
:root{
 --v4182-ink:#10233f;--v4182-muted:#60748a;--v4182-line:#dbe6ef;
 --v4182-soft:#f6f9fc;--v4182-blue:#146fe8;--v4182-green:#58ba2d;
}

/* 1) Hero: keep the message, make it faster to read and more compact. */
.msd-hero-v2{
 min-height:680px!important;
 padding-top:78px!important;
 padding-bottom:78px!important;
 gap:48px!important;
}
.msd-hero-v2 h1{
 max-width:780px!important;
 margin:16px 0 18px!important;
 font-size:clamp(46px,4.75vw,72px)!important;
 line-height:1.01!important;
 letter-spacing:-.047em!important;
 text-wrap:balance;
}
.msd-hero-v2 p{
 max-width:720px!important;
 font-size:17px!important;
 line-height:1.64!important;
}
.msd-hero-v2 .msd-actions{margin:26px 0 18px!important}
.msd-role-pills{margin:2px 0 16px!important}
.msd-role-pills span{padding:7px 10px!important}
.msd-trust-v2{padding-top:14px!important}
.msd-dashboard-3d{transform:scale(.96);transform-origin:center}

/* 2) Command strip: denser, clearer capability scan. */
.msd-command-strip{margin-top:-28px!important;padding:19px 21px!important;border-radius:23px!important}
.command-intro{padding-bottom:15px!important}
.command-intro>strong{font-size:16px!important}
.command-items{padding-top:13px!important}
.command-items>div{padding:10px 8px!important}
.command-items i{flex-basis:31px!important;height:31px!important}
.command-items small{font-size:9px!important}

/* 3) Global homepage rhythm: reduce long gaps without flattening the design. */
.msd-role-experience{padding-top:82px!important;padding-bottom:78px!important}
.msd-section-intro{padding-top:82px!important;padding-bottom:82px!important}
.msd-smart-gate{padding-top:82px!important;padding-bottom:82px!important}
.msd-ops-section{padding-top:76px!important;padding-bottom:78px!important}
.msd-security-section{padding-top:78px!important;padding-bottom:78px!important}
.msd-product-spotlight{padding-top:84px!important;padding-bottom:84px!important}
.msd-plans-v2{padding-top:82px!important;padding-bottom:82px!important}
#bouquet.msd-section{padding-top:78px!important;padding-bottom:78px!important}
.msd-how-section{padding-top:76px!important;padding-bottom:76px!important}
.msd-faq-section{padding-top:76px!important;padding-bottom:72px!important}
.msd-contact-teaser{padding-top:54px!important;padding-bottom:54px!important}
.msd-final-cta{padding-top:72px!important;padding-bottom:72px!important}

.msd-section-heading{margin-bottom:32px!important}
.msd-section-heading.centered{margin-bottom:34px!important}
.msd-section-heading h2{
 margin:10px 0 13px!important;
 font-size:clamp(34px,3.75vw,52px)!important;
 line-height:1.07!important;
 text-wrap:balance;
}
.msd-section-heading p{font-size:16px!important;line-height:1.62!important}

/* 4) Role cards: same content, lower visual weight and less dead space. */
.role-experience-grid{margin-top:32px!important;gap:16px!important}
.role-card{min-height:318px!important;padding:25px!important;border-radius:22px!important}
.role-icon{width:48px!important;height:48px!important;margin-bottom:20px!important;border-radius:15px!important}
.role-card h3{font-size:24px!important;margin-bottom:10px!important}
.role-card p{font-size:13px!important;line-height:1.58!important;color:#62778b!important}
.role-flow{left:25px!important;right:25px!important;bottom:22px!important}

/* 5) Feature cards: stronger contrast, smaller density, more usable scanning. */
.msd-feature-bento{gap:16px!important}
.msd-feature-bento article{min-height:245px!important;padding:27px!important;border-radius:23px!important}
.msd-feature-bento .feature-large{min-height:510px!important}
.msd-feature-bento .feature-wide{min-height:285px!important;gap:28px!important}
.msd-feature-bento h3{font-size:25px!important;margin-bottom:9px!important;color:#153650!important}
.msd-feature-bento p{font-size:13.5px!important;line-height:1.58!important;color:#607488!important}
.msd-feature-bento ul{gap:7px!important;margin-top:18px!important}
.msd-feature-bento li{font-size:12.5px!important;line-height:1.45!important;color:#415b72!important}
.feature-tags{gap:7px!important}
.feature-tags span{font-size:10.5px!important;border:1px solid #e3ebf2!important;background:#fff!important;color:#486078!important}

/* 6) Smart Gate & secondary role section: retain both, but keep them moving. */
.gate-copy h2{font-size:clamp(36px,4vw,54px)!important;margin-bottom:15px!important}
.gate-copy>p{font-size:16px!important;line-height:1.62!important}
.gate-steps{margin-top:25px!important;gap:10px!important}
.gate-steps>div{padding:12px!important}
.gate-phone-wrap{min-height:510px!important;transform:scale(.92);transform-origin:center}
.role-grid{gap:16px!important}
.role-grid article{min-height:250px!important;padding:25px!important}
.role-grid article:before{left:25px!important;right:25px!important}
.role-grid h3{font-size:23px!important;margin:13px 0 8px!important}
.role-grid p{font-size:13px!important;line-height:1.58!important;color:#607488!important}
.role-grid b{left:25px!important;bottom:23px!important}

/* 7) Security and platform spotlight: preserve identity, reduce the long mid-page plateau. */
.security-visual{min-height:410px!important;transform:scale(.9);transform-origin:center}
.spotlight-copy h2{font-size:clamp(36px,3.8vw,52px)!important;margin-bottom:14px!important}
.spotlight-copy>p{font-size:14.5px!important;line-height:1.62!important}
.spotlight-checks{margin:23px 0!important;gap:9px 18px!important}
.spotlight-stack{min-height:410px!important;transform:scale(.94);transform-origin:center}
.spot-card{padding:19px 21px!important}

/* 8) Plans: make each option easier to scan and bring action closer. */
.msd-plan-grid-v2{gap:15px!important}
.msd-plan-card{
 min-height:520px!important;
 padding:25px 23px 68px!important;
 border-radius:23px!important;
}
.msd-plan-card.featured{transform:translateY(-3px)!important;box-shadow:0 18px 44px rgba(8,120,215,.14)!important}
.msd-plan-card h3{font-size:24px!important;margin-bottom:8px!important}
.plan-price-v2{font-size:17px!important;margin-bottom:9px!important}
.msd-plan-card p.plan-description{min-height:58px!important;margin-bottom:15px!important;font-size:12.5px!important;line-height:1.52!important;color:#607589!important}
.plan-features{padding-top:14px!important}
.plan-includes{margin-bottom:9px!important}
.plan-features li{margin-bottom:7px!important;font-size:11.5px!important;line-height:1.4!important}
.plan-link{left:23px!important;bottom:23px!important}
.plan-compare-wrap{margin-top:28px!important;border-radius:21px!important}
.plan-compare-head{padding:22px 25px 18px!important}
.plan-compare-head h3{font-size:22px!important}
.plan-compare-table th,.plan-compare-table td{padding:11px 14px!important}
.plan-note{margin-top:20px!important}

/* 9) Build Your Bouquet: turn a long catalog into a compact, readable catalog. */
#bouquet .msd-section-heading p{max-width:690px;margin-left:auto;margin-right:auto}
.msd415-bouquet{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important;margin-top:20px!important}
.msd415-bouquet-group{padding:15px!important;border-radius:15px!important;box-shadow:0 8px 22px rgba(20,60,93,.035)}
.msd415-bouquet-group h3{font-size:15px!important;margin-bottom:8px!important;color:#20405b!important}
.msd415-bouquet-list{grid-template-columns:1fr!important;gap:5px!important}
.msd415-bouquet-item{padding:8px 9px!important;border-radius:9px!important;background:#f8fafc!important}
.msd415-bouquet-item strong{font-size:11.5px!important;color:#2a485f!important}
.msd415-bouquet-item small{font-size:9.5px!important;line-height:1.35!important;color:#738597!important}

/* 10) Onboarding, FAQ and closing CTA: compact but still substantial. */
.how-grid{margin-top:28px!important;gap:12px!important}
.how-grid article{min-height:185px!important;padding:21px!important;border-radius:18px!important}
.how-grid b{width:38px!important;height:38px!important;border-radius:12px!important}
.how-grid h3{font-size:18px!important;margin:18px 0 8px!important}
.how-grid p{font-size:12.5px!important;line-height:1.52!important}
.faq-list{margin-top:22px!important}
.faq-list summary{padding-top:16px!important;padding-bottom:16px!important}
.faq-list summary:after{top:12px!important}
.contact-teaser-copy h2{font-size:clamp(31px,3.5vw,46px)!important}
.contact-teaser-copy p{font-size:14px!important;line-height:1.58!important}
.msd-final-cta img{width:270px!important;margin-bottom:13px!important}
.msd-final-cta h2{font-size:clamp(35px,4vw,54px)!important;margin:13px auto!important}
.msd-final-cta p{font-size:15px!important;line-height:1.6!important}
.centered-actions{margin-top:24px!important}

/* Keep anchored navigation comfortable below the sticky header. */
#features,#smart-gate,#plans,#bouquet,#faq{scroll-margin-top:88px}

/* Tablet */
@media(max-width:1100px){
 .msd-hero-v2{min-height:auto!important;padding-top:66px!important;padding-bottom:70px!important}
 .msd-dashboard-3d{transform:scale(.93)}
 .msd415-bouquet{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .gate-phone-wrap{transform:scale(.88)}
 .spotlight-stack{transform:none}
}

/* Mobile / narrow viewport polish */
@media(max-width:820px){
 .msd-hero-v2{padding:52px 18px 58px!important;gap:30px!important}
 .msd-hero-v2 h1{font-size:clamp(39px,11vw,52px)!important;line-height:1.02!important;max-width:12ch!important}
 .msd-hero-v2 p{font-size:15.5px!important;line-height:1.58!important}
 .msd-hero-v2 .msd-actions{display:grid!important;gap:9px!important;margin-top:22px!important}
 .msd-hero-v2 .msd-actions .msd-btn{width:100%;box-sizing:border-box;text-align:center;justify-content:center}
 .msd-product-stage{max-width:100%!important;overflow:visible}
 .msd-dashboard-3d{transform:scale(.92);transform-origin:top center}
 .float-card{max-width:72vw!important}
 .msd-command-strip{margin:-12px 12px 0!important;padding:16px!important}
 .command-items{grid-template-columns:1fr 1fr!important}
 .msd-role-experience,.msd-section-intro,.msd-ops-section,#bouquet.msd-section{padding:62px 18px!important}
 .msd-smart-gate,.msd-security-section,.msd-product-spotlight{padding:64px 18px!important}
 .msd-plans-v2,.msd-how-section,.msd-faq-section{padding-top:62px!important;padding-bottom:62px!important}
 .msd-section-heading h2{font-size:clamp(31px,8.6vw,42px)!important}
 .msd-section-heading p{font-size:14.5px!important}
 .role-card{min-height:300px!important}
 .msd-feature-bento .feature-large,.msd-feature-bento article,.msd-feature-bento .feature-wide{min-height:auto!important}
 .gate-phone-wrap{min-height:470px!important;transform:scale(.82);margin:-30px 0}
 .role-grid article{min-height:225px!important}
 .security-visual{min-height:340px!important;transform:scale(.78);margin:-35px 0}
 .spotlight-stack{min-height:auto!important}
 .msd-plan-card{min-height:auto!important;padding-bottom:67px!important}
 .msd-plan-card p.plan-description{min-height:0!important}
 .msd415-bouquet{grid-template-columns:1fr 1fr!important}
 .plan-compare-scroll{-webkit-overflow-scrolling:touch}
 .plan-compare-scroll:after{content:"Swipe to compare →";display:block;position:sticky;left:0;width:max-content;padding:8px 14px;color:#71869a;font-size:10px}
 .msd-contact-teaser{grid-template-columns:1fr!important;padding:46px 18px!important}
 .contact-teaser-actions{justify-content:flex-start!important}
}

@media(max-width:540px){
 .msd-hero-v2 h1{font-size:39px!important;max-width:11ch!important}
 .msd-role-pills{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%}
 .msd-role-pills span{text-align:center;white-space:normal}
 .msd-trust-v2{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}
 .command-items{grid-template-columns:1fr!important}
 .role-card{padding:22px!important}
 .role-flow{position:static!important;margin-top:19px!important}
 .msd-feature-bento article{padding:22px!important}
 .msd-feature-bento .feature-wide{display:block!important}
 .community-stack{margin-top:18px!important}
 .gate-steps{grid-template-columns:1fr!important}
 .gate-phone-wrap{transform:scale(.74);margin:-70px 0}
 .msd415-bouquet{grid-template-columns:1fr!important}
 .how-grid{grid-template-columns:1fr 1fr!important}
 .how-grid article{min-height:170px!important;padding:18px!important}
 .msd-final-cta{padding:58px 18px!important;border-radius:25px 25px 0 0!important}
 .msd-final-cta img{width:225px!important}
 .centered-actions{display:grid!important;gap:9px!important}
 .centered-actions .msd-btn{width:100%;box-sizing:border-box;justify-content:center}
}

@media(max-width:390px){
 .msd-hero-v2 h1{font-size:36px!important}
 .msd-role-pills,.msd-trust-v2,.how-grid{grid-template-columns:1fr!important}
 .msd-plan-card{padding-left:20px!important;padding-right:20px!important}
 .plan-link{left:20px!important}
}