/* Webtrix theme v1 — dark hero & footer, light content sections, floating white cards */
:root{
  --t-ink:#0b1f33;--t-text:#43566a;--t-muted:#5c6f82;--t-line:#e2e8f0;--t-soft:#f3f6fa;
  --t-blue:#1463bf;--t-blue2:#2f86e8;--t-violet:#7b6cff;--t-blue-soft:#eaf3fd;--t-orange:#ff6a00;
  --t-shadow:0 1px 2px rgba(15,35,55,.05),0 18px 44px -24px rgba(15,35,55,.30);
  --t-shadow-hover:0 1px 2px rgba(15,35,55,.06),0 28px 56px -26px rgba(20,99,191,.40);
}

/* ---------- header ---------- */
.wx-page .wx-header{background:rgba(7,17,27,.86)!important;backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid rgba(255,255,255,.07)!important}

/* ---------- hero (dark, with depth) ---------- */
.wx-page .wx-plans-top{position:relative;overflow:hidden;padding:30px 0 96px!important;background:
  radial-gradient(900px 440px at 90% -12%,rgba(47,134,232,.30),transparent 62%),
  radial-gradient(700px 380px at -8% 105%,rgba(255,106,0,.10),transparent 60%),
  radial-gradient(600px 300px at 40% 120%,rgba(123,108,255,.12),transparent 60%),
  linear-gradient(180deg,#07111b,#0a1a2b)!important}
.wx-page .wx-plans-top::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:56px 56px;-webkit-mask:radial-gradient(ellipse 80% 70% at 50% 0%,#000 25%,transparent 75%);mask:radial-gradient(ellipse 80% 70% at 50% 0%,#000 25%,transparent 75%)}
.wx-page .wx-plans-top > .wx-shell{position:relative;z-index:1}
.wx-page .wx-plans-top h1{letter-spacing:-.035em;max-width:880px}
.wx-page .wx-plans-top .wx-plans-lead{font-size:18px!important;color:#b9cadb!important;max-width:720px;line-height:1.65}
.wx-page .wx-crumbs a{color:#9fd4ff}

/* white floating cards on the dark hero (pricing, cities) */
.wx-page .wx-plans-top .wx-card,.wx-page .wx-plans-top .wx-city{background:#fff!important;border:1px solid rgba(255,255,255,.7)!important;border-radius:20px!important;color:var(--t-text)!important;box-shadow:0 30px 60px -32px rgba(0,0,0,.65),0 2px 0 rgba(255,255,255,.4) inset!important;transition:transform .25s ease,box-shadow .25s ease}
.wx-page .wx-plans-top .wx-card:hover,.wx-page .wx-plans-top .wx-city:hover{transform:translateY(-4px);box-shadow:0 40px 70px -34px rgba(0,0,0,.7)!important}
.wx-page .wx-plans-top .wx-card h2,.wx-page .wx-plans-top .wx-card h3,.wx-page .wx-plans-top .wx-card strong,.wx-page .wx-plans-top .wx-city h2{color:var(--t-ink)!important}
.wx-page .wx-plans-top .wx-card p,.wx-page .wx-plans-top .wx-card li,.wx-page .wx-plans-top .wx-city p{color:var(--t-text)!important}
.wx-page .wx-plans-top .wx-card .wx-for{color:var(--t-muted)!important}
.wx-page .wx-plans-top .wx-card .wx-plan-price span,.wx-page .wx-plans-top .wx-card .wx-note,.wx-page .wx-plans-top .wx-city .wx-city-prov{color:var(--t-muted)!important}
.wx-page .wx-plans-top .wx-card .wx-plan-price strong{color:var(--t-ink)!important;letter-spacing:-.03em}
.wx .wx-plans-top .wx-card li:before{color:var(--t-blue)!important}
.wx-page .wx-plans-top .wx-card .wx-plan-ico,.wx-page .wx-plans-top .wx-card .wx-icon{background:var(--t-blue-soft)!important;border-color:#cfe1f5!important;color:var(--t-blue)!important}
.wx-page .wx-plans-top .wx-card .wx-btn{background:var(--t-ink)!important;border-color:var(--t-ink)!important;color:#fff!important}
.wx-page .wx-plans-top .wx-card .wx-btn:hover{background:#16324f!important}
.wx-page .wx-plans-top .wx-card .wx-btn span{color:#fff!important}
.wx-page .wx-plans-top .wx-featured{box-shadow:0 0 0 2px var(--t-blue2),0 36px 70px -30px rgba(47,134,232,.55)!important}
.wx-page .wx-plans-top .wx-featured .wx-btn{background:linear-gradient(135deg,var(--t-blue2),var(--t-violet))!important;border-color:transparent!important}
.wx-page .wx-plans-top .wx-badge{background:linear-gradient(135deg,var(--t-blue2),var(--t-violet))!important;color:#fff!important;border:0!important;box-shadow:0 8px 20px -8px rgba(47,134,232,.7)}
.wx-page .wx-plans-top .wx-card .wx-textlink,.wx-page .wx-plans-top .wx-city-links a{color:var(--t-blue)!important}
.wx-page .wx-plans-top .wx-card [class*="tld"] span,.wx-page .wx-plans-top .wx-card .wx-smallprice{color:var(--t-muted)!important}
.wx-page .wx-plans-top .wx-card input{background:#f6f9fc!important;color:var(--t-ink)!important;border-color:var(--t-line)!important}

/* ---------- light content sections ---------- */
.wx-page .wx-local,.wx-page .wx-more,.wx-page .wx-section{background:#fff!important;border-top:0!important;color:var(--t-text)}
.wx-page main > section.wx-local + section.wx-local,.wx-page .wx-more{background:var(--t-soft)!important}
.wx-page .wx-local h2,.wx-page .wx-local h3,.wx-page .wx-more h2,.wx-page .wx-more h3,.wx-page .wx-section h2,.wx-page .wx-section h3,.wx-page .wx-local strong{color:var(--t-ink)!important;letter-spacing:-.02em}
.wx-page .wx-local p,.wx-page .wx-more p,.wx-page .wx-section p,.wx-page .wx-local li{color:var(--t-text)!important}
.wx-page .wx-local .wx-lead{color:#2c4156!important;font-size:19px}
.wx-page .wx-local .wx-ey,.wx-page .wx-more .wx-ey,.wx-page .wx-section .wx-ey{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:var(--t-blue-soft);color:var(--t-blue)!important;font-size:12px!important;letter-spacing:.14em!important;text-transform:uppercase}
.wx-page .wx-local .wx-ey::before,.wx-page .wx-more .wx-ey::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--t-orange)}
.wx-page .wx-local .wx-sub{color:var(--t-ink)!important}
.wx-page .wx-local .wx-textlink,.wx-page .wx-more .wx-textlink{color:var(--t-blue)!important;font-weight:700}

/* cards in light sections */
.wx-page .wx-point,.wx-page .wx-local .wx-city,.wx-page .wx-local .wx-card{background:#fff!important;border:1px solid var(--t-line)!important;border-radius:18px!important;box-shadow:var(--t-shadow)!important;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.wx-page .wx-point:hover{transform:translateY(-3px);border-color:#c7dcf2!important;box-shadow:var(--t-shadow-hover)!important}
.wx-page .wx-point h3{color:var(--t-ink)!important}.wx-page .wx-point p{color:var(--t-text)!important}
.wx-page .wx-point .wx-ai-step,.wx-page .wx-local .wx-ai-step{background:var(--t-blue-soft)!important;color:var(--t-blue)!important}
.wx-page main > section.wx-local + section.wx-local .wx-point{background:#fff!important}

/* FAQ as cards */
.wx-page .wx-faq details{background:#fff;border:1px solid var(--t-line)!important;border-radius:14px;padding:18px 20px!important;margin-bottom:10px;box-shadow:0 1px 2px rgba(15,35,55,.04)}
.wx-page .wx-faq details:last-child{border-bottom:1px solid var(--t-line)!important}
.wx-page .wx-faq details[open]{border-color:#c7dcf2!important;box-shadow:var(--t-shadow)}
.wx-page .wx-faq summary{color:var(--t-ink)!important}
.wx-page .wx-faq summary::after{color:var(--t-blue)!important}
.wx-page .wx-faq details p{color:var(--t-text)!important}

/* city pills */
.wx-page .wx-local .wx-cities a,.wx-page .wx-more .wx-cities a{background:#fff!important;border:1px solid var(--t-line)!important;color:var(--t-ink)!important;box-shadow:0 1px 2px rgba(15,35,55,.05)}
.wx-page .wx-local .wx-cities a:hover,.wx-page .wx-local .wx-cities a[aria-current]{border-color:var(--t-blue2)!important;color:var(--t-blue)!important;background:var(--t-blue-soft)!important}

/* product rows */
.wx-page .wx-more .wx-product,.wx-page .wx-section .wx-product{background:#fff!important;border:1px solid var(--t-line)!important;border-radius:16px!important;box-shadow:0 1px 2px rgba(15,35,55,.04)}
.wx-page .wx-more .wx-products{background:transparent!important;border:0!important;gap:14px!important;overflow:visible!important;border-radius:0!important}
.wx-page .wx-more .wx-products:hover .wx-product{opacity:1!important;filter:none!important}
.wx-page .wx-more .wx-products:hover .wx-product:hover{background:#fff!important}
.wx-page .wx-more .wx-product:hover{border-color:#c7dcf2!important;box-shadow:var(--t-shadow-hover)!important;transform:translateY(-2px)}
.wx-page .wx-more .wx-product h3{color:var(--t-ink)!important}.wx-page .wx-more .wx-product p{color:var(--t-text)!important}
.wx-page .wx-more .wx-plan-ico,.wx-page .wx-section .wx-icon{background:var(--t-blue-soft)!important;border-color:#cfe1f5!important;color:var(--t-blue)!important}
.wx-page .wx-more .wx-more-link{color:var(--t-blue)!important}
.wx-page .wx-more .wx-product[aria-current="page"]{box-shadow:inset 3px 0 0 var(--t-blue2),0 1px 2px rgba(15,35,55,.04)!important}

/* CTA banner: dark contrast moment inside the light section */
.wx-page .wx-close{position:relative;overflow:hidden;margin-top:40px;padding:40px 44px!important;border-radius:24px!important;border:0!important;background:
  radial-gradient(500px 240px at 100% 0%,rgba(123,108,255,.35),transparent 65%),
  radial-gradient(420px 220px at 0% 100%,rgba(47,134,232,.35),transparent 65%),
  linear-gradient(135deg,#0b1f33,#0d2a47)!important;box-shadow:0 30px 60px -30px rgba(11,31,51,.6)}
.wx-page .wx-close h2{color:#fff!important}.wx-page .wx-close p{color:#c4d4e3!important}
.wx-page .wx-close .wx-btn{background:#fff!important;border-color:#fff!important;color:var(--t-ink)!important}
.wx-page .wx-close .wx-btn span{color:var(--t-ink)!important}

/* AI page: lower light section */
.wx-page .wx-local .wx-ai-compare > div{background:#fff!important;border:1px solid var(--t-line)!important;box-shadow:var(--t-shadow)}
.wx-page .wx-local .wx-ai-compare > div.is-ai{border-color:var(--t-blue2)!important;box-shadow:0 0 0 3px rgba(47,134,232,.14),var(--t-shadow)!important}
.wx-page .wx-local .wx-ai-compare .p{color:var(--t-ink)!important}
.wx .wx-local .wx-ai-includes li{color:var(--t-text)!important}
.wx .wx-local .wx-ai-includes li:before{background:#e3f6ec!important;color:#15894d!important}

/* ---------- footer ---------- */
.wx-page .wx-footer{position:relative;background:#07111b!important}
.wx-page .wx-footer::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--t-blue2) 25%,var(--t-violet) 55%,var(--t-orange) 80%,transparent)}

@media(max-width:640px){
  .wx-page .wx-plans-top{padding:22px 0 64px!important}
  .wx-page .wx-close{padding:28px 22px!important}
  .wx-page .wx-local .wx-ey,.wx-page .wx-more .wx-ey{font-size:11px!important}
}
@media(prefers-reduced-motion:reduce){.wx-page .wx-plans-top .wx-card,.wx-page .wx-point{transition:none}}
