/* ===== Design polish layer (loads after site.css) — all colours come from theme variables ===== */
:root{--on-accent:#fff;--on-primary:#fff;--r-lg:calc(var(--radius) + 4px)}
body{font-size:16.5px;line-height:1.7}
h1,h2,h3{text-wrap:balance}p{text-wrap:pretty}
a{text-underline-offset:3px}
/* contrast-safe text on accent/primary */
.btn-accent,.num,.ribbon,.ac-price div.on,.tabbar .tb-book{color:var(--on-accent)!important}
[data-theme=royal] .btn-accent{color:var(--on-accent)!important}
.btn-primary{color:var(--on-primary)}
.btn-primary{background:linear-gradient(135deg,var(--primary),color-mix(in srgb,var(--primary) 78%,var(--dark)));box-shadow:0 10px 22px -10px color-mix(in srgb,var(--primary) 70%,transparent)}
.btn-primary:hover{background:linear-gradient(135deg,color-mix(in srgb,var(--primary) 90%,#fff),var(--primary-d))}
.btn-accent{box-shadow:0 10px 24px -10px color-mix(in srgb,var(--accent) 80%,transparent)}
.btn{border-radius:999px;padding:13px 26px}[data-theme=royal] .btn{border-radius:10px}
.btn-sm{padding:9px 16px}.btn-lg{padding:16px 32px}
.btn-3d{box-shadow:0 5px 0 var(--accent-d),0 18px 28px -10px color-mix(in srgb,var(--accent) 55%,transparent)}
/* header stack: calmer */
.announce{font-size:.82rem;padding:7px 14px;letter-spacing:.01em}
.topbar{font-size:.78rem}.topbar .wrap{padding-top:6px;padding-bottom:6px}
.site-head{box-shadow:0 1px 0 var(--line),0 12px 30px -24px rgba(0,0,0,.35)}
.head-in{min-height:76px}
.nav a{border-radius:999px}.nav .nav-cta{padding:10px 20px}
@media(max-width:1100px){.topbar .wrap>div:last-child{display:none}}
/* sections: more breathing room + consistent rhythm */
.sec{padding:104px 0;position:relative}
@media(max-width:820px){.sec{padding:64px 0}}
.sec-head{margin-bottom:56px}
.sec-head h2{position:relative;padding-bottom:18px}
.sec-head h2:after{content:"";position:absolute;left:50%;bottom:0;width:56px;height:4px;border-radius:4px;transform:translateX(-50%);background:linear-gradient(90deg,var(--primary),var(--accent))}
.sec-head p{font-size:1.08rem;line-height:1.7}
.eyebrow{letter-spacing:.1em;padding:7px 14px}
.sec.alt{background:linear-gradient(180deg,var(--alt),color-mix(in srgb,var(--alt) 55%,var(--bg)))}
.sec.dark{background:radial-gradient(900px 420px at 85% -10%,color-mix(in srgb,var(--primary) 32%,transparent),transparent 70%),radial-gradient(700px 380px at 0% 110%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 70%),var(--dk-bg)}
/* cards */
.svc,.why,.guide-card,.tool-card,.centre-card,.rev,.pay-card,.price-card,.step,.cc,.who-card{border-radius:var(--r-lg);border-color:color-mix(in srgb,var(--line) 80%,transparent);padding:30px;box-shadow:0 1px 2px rgba(15,23,42,.04),0 18px 40px -26px color-mix(in srgb,var(--dark) 45%,transparent)}
.svc,.why,.guide-card,.tool-card,.centre-card,.rev,.who-card{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.svc:hover,.why:hover,.guide-card:hover,.tool-card:hover,.centre-card:hover,.rev:hover,.who-card:hover{transform:translateY(-6px);border-color:color-mix(in srgb,var(--primary) 45%,var(--line));box-shadow:0 2px 4px rgba(15,23,42,.05),0 34px 60px -28px color-mix(in srgb,var(--primary) 55%,transparent)}
.svc-ic,.gi,.ti,.ci,.pi{width:60px;height:60px;border-radius:18px;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--primary) 22%,transparent)}
.svc h3,.why h3,.guide-card h3,.tool-card h3{margin-top:14px}
.svc li{margin:7px 0}
.more{display:inline-flex;gap:6px;align-items:center}.more:hover{gap:10px;text-decoration:none}
.reveal{transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
@media (scripting:none){.reveal{opacity:1;transform:none}}
/* hero */
.hero-in{padding-top:84px;padding-bottom:92px;min-height:680px;gap:44px}
.hero h1{font-size:clamp(2.3rem,5vw,4rem);line-height:1.06;letter-spacing:-.025em}
.hero .lead{font-size:1.2rem;line-height:1.7;max-width:580px}
.hero:after{content:"";position:absolute;inset:auto 0 0 0;height:90px;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--bg) 100%,transparent));z-index:-1;opacity:0}
.hero-trust{gap:10px 12px}.hero-trust li{background:color-mix(in srgb,var(--surface) 70%,transparent);border:1px solid color-mix(in srgb,var(--line) 70%,transparent);backdrop-filter:blur(8px);padding:6px 12px;border-radius:999px;font-size:.84rem;color:var(--ink)}
[data-theme=royal] .hero-trust li,[data-theme=midnight] .hero-trust li{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);color:#fff}
.stats{gap:16px;margin-top:6px}.stats>div{background:color-mix(in srgb,var(--surface) 78%,transparent);border:1px solid color-mix(in srgb,var(--line) 70%,transparent);backdrop-filter:blur(10px);border-radius:16px;padding:14px 20px;min-width:118px;box-shadow:0 14px 30px -22px rgba(0,0,0,.5)}
[data-theme=royal] .stats>div,[data-theme=midnight] .stats>div{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16)}
.stats b{font-size:1.9rem}
.strip{background:linear-gradient(90deg,var(--dark),color-mix(in srgb,var(--dark) 82%,var(--primary)))}
.strip-in{gap:10px 34px;padding-top:16px;padding-bottom:16px}
/* pricing */
.price-card{padding:38px 30px}
.price-card.popular{border:0;background:linear-gradient(var(--surface),var(--surface)) padding-box,linear-gradient(140deg,var(--accent),var(--primary)) border-box;border:2px solid transparent;box-shadow:0 40px 70px -34px color-mix(in srgb,var(--accent) 85%,transparent)}
.price-card h3{font-size:1.25rem}.amount{font-size:3.6rem;letter-spacing:-.03em}
.price-card li{border-bottom-style:solid;border-bottom-color:color-mix(in srgb,var(--line) 70%,transparent)}
.price-card:hover{transform:translateY(-8px)}.price-card.popular:hover{transform:translateY(-16px)}
/* steps connected */
.steps{position:relative;counter-reset:s}
@media(min-width:901px){.steps:before{content:"";position:absolute;left:12%;right:12%;top:52px;border-top:2px dashed color-mix(in srgb,var(--accent) 55%,transparent);z-index:0}.steps .step{position:relative;z-index:1}}
.num{width:54px;height:54px;font-size:1.4rem;background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 70%,var(--dark)))}
/* FAQ */
.faq details{border-radius:16px;padding:0 24px;transition:box-shadow .25s,border-color .25s}
.faq details[open]{border-color:color-mix(in srgb,var(--primary) 50%,var(--line))}
.faq summary{font-size:1.04rem;padding:20px 32px 20px 0}
/* CTA band */
.cta-band{padding:84px 0;background:radial-gradient(700px 300px at 90% 0%,color-mix(in srgb,var(--accent) 35%,transparent),transparent 70%),radial-gradient(600px 300px at 0% 100%,color-mix(in srgb,var(--primary) 45%,transparent),transparent 70%),var(--dark)}
.cta-band h2{font-size:clamp(1.7rem,3.2vw,2.5rem)}
/* inner page banners */
.page-hero{position:relative;overflow:hidden;padding:76px 0 64px;background:linear-gradient(120deg,color-mix(in srgb,var(--dark) 94%,transparent),color-mix(in srgb,var(--dark) 70%,transparent)),url(../img/hero-2.svg) center/cover,var(--dark)}
.page-hero:before{content:"";position:absolute;right:-120px;top:-140px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 45%,transparent),transparent 70%);pointer-events:none}
.page-hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:linear-gradient(90deg,var(--primary),var(--accent))}
.page-hero h1{font-size:clamp(1.9rem,4vw,3rem);margin-bottom:.3em}.page-hero.small{padding:56px 0 46px}
.crumbs{opacity:.85;font-weight:500}
/* forms: roomier + clearer */
.form-card{border-radius:var(--r-lg);padding:34px}
input,select,textarea{padding:13px 15px;border-radius:12px;background:color-mix(in srgb,var(--surface) 92%,var(--alt))}
input:hover,select:hover,textarea:hover{border-color:color-mix(in srgb,var(--primary) 40%,var(--line))}
label{font-size:.9rem;margin-bottom:6px}.grid2{gap:18px 20px}
.wizard-steps li{padding:10px 18px}
.pkg,.card-opt span{transition:border-color .2s,box-shadow .2s,transform .2s}
.summary{border-radius:16px;padding:22px}
/* articles */
.article{font-size:1.07rem;line-height:1.8}.article h2{margin-top:2em}
.article table{width:100%;border-collapse:collapse;margin:1.2em 0}.article td,.article th{border:1px solid var(--line);padding:10px 12px;text-align:left}.article th{background:var(--alt)}
.callout{border-radius:14px;padding:22px 24px}
/* footer */
.site-foot{background:radial-gradient(800px 320px at 100% 0%,color-mix(in srgb,var(--primary) 22%,transparent),transparent 70%),var(--dark);padding:76px 0 28px}
.site-foot h4{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:color-mix(in srgb,var(--accent) 55%,#fff);margin-bottom:18px}
.site-foot li{margin:9px 0}.site-foot a:hover{color:#fff;text-decoration:none}
.site-foot a:not(.btn):hover{text-decoration:underline}
/* floating helpers */
.wa-fab>button{box-shadow:0 18px 30px -12px rgba(37,211,102,.7)}
::-webkit-scrollbar{width:11px;height:11px}::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--primary) 45%,#9aa);border-radius:10px;border:3px solid var(--bg)}
/* midnight tweaks */
[data-theme=midnight] .sec.alt{background:linear-gradient(180deg,var(--alt),color-mix(in srgb,var(--alt) 70%,#000))}
[data-theme=midnight] .svc,[data-theme=midnight] .why,[data-theme=midnight] .rev{background:linear-gradient(160deg,color-mix(in srgb,var(--surface) 100%,#fff 3%),var(--surface))}
@media print{.page-hero:before,.page-hero:after{display:none}}
.hero h1{font-size:clamp(2.2rem,4.4vw,3.55rem)}
.stats{flex-wrap:wrap;gap:12px}.stats>div{padding:12px 16px;min-width:0;flex:0 1 auto}.stats b{font-size:1.7rem}.stats span{font-size:.78rem;white-space:nowrap}
@media(min-width:961px){.hero-in{grid-template-columns:1.12fr .88fr}}
/* mobile refinements */
@media(max-width:700px){
 body{font-size:16px}
 .announce{font-size:.76rem;padding:6px 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .topbar{display:none}
 .head-in{min-height:64px}.brand .logo,.brand .logo svg,.brand img.logo{height:46px}
 .hero-in{padding-top:36px;padding-bottom:40px;min-height:0;gap:26px}
 .hero h1{font-size:2.05rem}.hero .lead{font-size:1.04rem}
 .hero-cta .btn{flex:1 1 100%}
 .hero-trust li{font-size:.78rem}
 .stats>div{flex:1 1 calc(50% - 8px)}.stats span{white-space:normal}
 .scene3d{height:380px}
 .sec{padding:54px 0}.sec-head{margin-bottom:36px}
 .svc,.why,.guide-card,.tool-card,.centre-card,.rev,.pay-card,.price-card,.step,.cc,.who-card{padding:22px}
 .price-card.popular{transform:none}.amount{font-size:3rem}
 .cookie{left:10px;right:10px;bottom:calc(76px + env(safe-area-inset-bottom));max-width:none;padding:12px 14px;font-size:.84rem}
 .form-card{padding:22px}.page-hero{padding:44px 0 36px}
 .cta-band{padding:56px 0}
}
