/* ===== BROTHER'S HOST — clean redesign (loads after main.css) ===== */
:root{--grad:linear-gradient(90deg,#0564FF,#4F46E5);--card-line:#E3EAF7;--header-h:68px}
body{background:#fff}
/* promo marquee */
.promo-bar{background:linear-gradient(90deg,#0564FF,#5B3DF0);color:#fff;overflow:hidden;white-space:nowrap;font-weight:600;font-size:15px;line-height:1;height:42px;display:flex;align-items:center}
.promo-track{display:inline-flex;flex-shrink:0;min-width:200%;animation:promo-scroll 38s linear infinite}
.promo-bar:hover .promo-track{animation-play-state:paused}
.promo-track span{padding:0 28px;display:inline-flex;align-items:center;gap:10px}
.promo-track b{background:#fff;color:#0846C4;border-radius:8px;padding:3px 9px;letter-spacing:.06em}
@keyframes promo-scroll{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.promo-track{animation:none}}
/* header */
.site-header{box-shadow:0 2px 14px rgba(14,27,61,.06);border-bottom:none}
.nav-toggle{border:none;background:#F1F5FD;border-radius:12px;width:42px;height:42px}
.nav-toggle:hover{background:var(--sky)}
.btn{box-shadow:none!important;border-radius:12px}
.btn-primary{background:var(--grad);color:#fff}
.btn-primary:hover{background:var(--grad);filter:brightness(1.08);transform:none}
.btn-white,.btn-amber{background:#fff;color:var(--ink);border-color:var(--card-line)}
.btn-ghost-light{border-color:var(--card-line);color:var(--ink)}
.nav-link{border-radius:10px}
/* drawer */
.mobile-drawer{border-radius:0;width:min(88vw,380px)}
.drawer-hot,.ft-hot{display:flex;align-items:center;gap:14px;background:#F4F3FF;border:1px solid #E4E1FF;border-radius:14px;padding:12px 14px;margin:14px 14px 4px}
.drawer-hot i,.ft-hot i{width:42px;height:42px;border-radius:50%;background:#5B3DF0;color:#fff;display:grid;place-items:center;font-size:18px;flex-shrink:0}
.drawer-hot small,.ft-hot small{display:block;color:#5B3DF0;font-size:13px;line-height:1.2}
.drawer-hot b,.ft-hot b{color:var(--ink);font-size:18px;line-height:1.3}
.drawer-link{border-bottom:1px solid #EEF2FA;border-radius:0;gap:12px;justify-content:flex-start}
.drawer-link .di{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:var(--sky);color:var(--blue);font-size:17px}
.drawer-link .chev{margin-left:auto}
.drawer-link:hover{background:#F8FAFF}
/* hero */
.hero{background:#F7FAFF;padding:44px 0 8px;text-align:center}
.hero::before,.hero::after{display:none}
.hero-grid{display:block}
.hero h1{font-size:clamp(32px,5.4vw,56px);max-width:760px;margin:0 auto 14px}
.hero .lead{margin:0 auto 6px;max-width:560px}
.hero .lead strong{background:#EAF1FF;color:var(--blue-deep);border-radius:8px}
/* tabs */
.tabs{display:flex;justify-content:center;gap:10px;padding:26px 0 34px;flex-wrap:wrap}
.tab{border:none;background:#EEF2FA;color:var(--muted);font:600 16px var(--font-body);padding:12px 24px;border-radius:12px;cursor:pointer;transition:background .15s,color .15s}
.tab[aria-selected=true]{background:#4F46E5;color:#fff;box-shadow:0 8px 18px rgba(79,70,229,.28)}
.tab:not([aria-selected=true]):hover{background:var(--sky);color:var(--blue)}
.plans-wrap{background:#F7FAFF;padding-top:0}
.panel-note{text-align:center;margin:0 auto 26px;font-size:15px}
.panel-note b{color:var(--ink)}
/* plan cards */
.plan-grid{max-width:1040px;margin:0 auto}
.plan{background:#fff;border:1px solid var(--card-line);border-radius:20px;padding:30px 26px;box-shadow:0 10px 30px rgba(14,27,61,.05);text-align:center;transition:box-shadow .2s}
.plan:hover{transform:none;box-shadow:0 14px 36px rgba(14,27,61,.1)}
.plan.is-pick{border:2px solid #4F46E5}
.plan h3{font-size:26px;margin:0 0 10px}
.plan-flag{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:#4F46E5;color:#fff;font-size:13px;font-weight:700;border-radius:99px;padding:3px 14px;white-space:nowrap}
.plan-price{display:block;background:none;border:none;padding:0;margin:0}
.plan-price b{font-size:46px;color:#4F46E5}
.plan-price span{margin-left:4px}
.plan-price s{display:block;margin:2px 0 0;font-size:14.5px}
.plan-off{display:inline-block;margin:10px 0 0;background:#EAF1FF;color:var(--blue-deep);font-size:13.5px;font-weight:700;border-radius:99px;padding:3px 12px}
.plan .btn-primary{background:var(--grad);margin:22px 0 6px;padding:15px;font-size:16.5px}
.plan-list{text-align:left;gap:0;margin:16px 0 0}
.plan-list li{padding:12px 0;border-top:1px solid #EEF2FA;align-items:center;gap:14px}
.plan-list i{color:#5B3DF0;font-size:19px;margin:0;width:22px;text-align:center}
.plan-for{background:#F7FAFF;text-align:left;margin:18px 0 0}
.plans-foot{margin-top:28px}
/* sections */
.section{padding:72px 0}
.why-card{background:#fff;border:1px solid var(--card-line);box-shadow:none;border-radius:16px;flex-direction:row;align-items:center;padding:20px}
.why-card .ico{background:var(--sky);color:var(--blue);border-radius:12px;width:48px;height:48px;flex-shrink:0}
.faq-item{background:#fff;border:1px solid var(--card-line);border-radius:14px}
.faq-item.is-open{border-color:#4F46E5}
.faq-item.is-open .chev{background:#4F46E5;color:#fff}
.cta-banner{background:linear-gradient(110deg,#0564FF,#5B3DF0);border-radius:24px}
.cta-banner::before,.cta-banner::after{display:none}
.cta-banner .btn-white{color:var(--blue-deep)}
.cta-banner .btn-ghost-light{color:#fff;border-color:rgba(255,255,255,.7)}
/* footer */
.site-footer{background:#F7FAFF;color:var(--text);margin-top:0;border-top:1px solid var(--line);padding:44px 0 0}
.ft-grid{display:grid;gap:30px}
@media (min-width:860px){.ft-grid{grid-template-columns:1.3fr 1fr 1fr 1.2fr}}
.ft-brand img{height:46px;width:auto;margin-bottom:12px}
.ft-brand p{font-size:15px;max-width:320px}
.ft-col h6{font-size:17px;margin:0 0 6px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.ft-col li a{display:flex;align-items:center;gap:12px;padding:8px 4px;font-size:15.5px;color:var(--text)}
.ft-col li a::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--blue)}
.ft-col li a:hover{color:var(--blue)}
.ft-col.alt li a::before{background:#E83E8C}
.ft-hot{margin:0 0 16px;background:#fff;border-color:var(--line)}
.ft-social{display:flex;gap:10px}
.ft-social a{width:42px;height:42px;border-radius:10px;background:#EEF2FA;display:grid;place-items:center;color:var(--ink);font-size:18px}
.ft-social a:hover{background:var(--blue);color:#fff}
.ft-bottom{border-top:1px solid var(--line);margin-top:34px;padding:18px 0;font-size:14px;color:var(--muted);display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:space-between}
.ft-bottom a:hover{color:var(--blue)}
.wa-float{box-shadow:0 8px 20px rgba(14,27,61,.22)}
/* fixes */
.plan{position:relative}
.hero h1{color:#0E1B3D}
.hero .lead{color:#26324F}
.tab{background:#fff;border:1px solid #DCE6F8;color:#26324F}
.tab[aria-selected=true]{border-color:#4F46E5}
.tg-float{background:#229ED9;box-shadow:0 8px 20px rgba(34,158,217,.4)}
.drawer-hot i,.ft-hot i{background:#229ED9}
.drawer-hot,.ft-hot{background:#EEF8FD;border-color:#CFE9F6}
.drawer-hot small,.ft-hot small{color:#1B7FAE}
.section.plans-wrap{padding-top:0}
/* robustness: avoid GPU compositing glitches (washed-out text, edge shadow) on some phones */
.site-header{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}
.promo-bar{contain:paint;position:relative;z-index:250}
.promo-track{will-change:transform}
.mobile-drawer{visibility:hidden;transition:transform .28s ease,visibility .28s}
.mobile-drawer.is-open{visibility:visible}
.hero,.hero *{-webkit-text-fill-color:currentColor}
/* inner pages: same clean look as home */
.page-hero{background:#F7FAFF;padding:34px 0 38px;border-bottom:1px solid var(--line)}
.page-hero::before,.page-hero::after{display:none}
.eyebrow{border:1px solid #DCE6F8;background:#fff}
.policy-card,.policy-toc{border:1px solid var(--card-line);box-shadow:0 8px 24px rgba(14,27,61,.04)}
.callout{border-radius:14px}
/* premium promo coupon (offers page) */
.coupon{position:relative;display:grid;max-width:860px;margin:0 auto;border-radius:24px;overflow:hidden;color:#fff;background:radial-gradient(120% 140% at 0% 0%,#2A3FD6 0%,#12206B 55%,#0A1236 100%);box-shadow:0 24px 60px rgba(10,18,54,.35)}
@media (min-width:760px){.coupon{grid-template-columns:1.25fr 1fr}}
.coupon-main{padding:34px 30px 38px}
.coupon-badge{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:14px;color:#F5C451;background:rgba(245,196,81,.12);border:1px solid rgba(245,196,81,.45);border-radius:99px;padding:5px 14px}
.coupon h3{color:#fff;font-size:clamp(28px,4.4vw,38px);margin:16px 0 10px}
.coupon-main p{color:rgba(255,255,255,.78);margin:0 0 18px}
.coupon-perks{display:grid;gap:8px}
.coupon-perks li{display:flex;justify-content:space-between;gap:12px;padding:10px 14px;border-radius:12px;background:rgba(255,255,255,.07);font-weight:600}
.coupon-perks s{color:rgba(255,255,255,.5);font-weight:500;margin-right:8px}
.coupon-perks b{color:#F5C451}
.coupon-stub{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:34px 28px;text-align:center;background:linear-gradient(160deg,#FFF6D6,#F5C451);color:#2A1E00}
.coupon-stub::before,.coupon-stub::after{content:"";position:absolute;width:30px;height:30px;border-radius:50%;background:#fff}
.coupon-stub::before{left:-15px;top:-15px}
.coupon-stub::after{left:-15px;bottom:-15px}
@media (max-width:759px){.coupon-stub::before{left:-15px;top:-15px}.coupon-stub::after{left:auto;right:-15px;top:-15px;bottom:auto}}
@media (min-width:760px){.coupon-stub{border-left:2px dashed rgba(42,30,0,.35)}.coupon-stub::before{left:-16px;top:-16px}.coupon-stub::after{left:-16px;bottom:-16px}}
.coupon-stub small{font-weight:700;color:#6B4E00;font-size:14px}
.coupon-code{font-family:var(--font-display);font-weight:800;font-size:52px;letter-spacing:.12em;line-height:1;padding:12px 22px;border:2px dashed #2A1E00;border-radius:14px;background:rgba(255,255,255,.5)}
.coupon-copy{border:none;cursor:pointer;background:#0A1236;color:#fff;font:700 16px var(--font-body);border-radius:12px;padding:13px 24px;width:100%;max-width:260px}
.coupon-copy:hover{background:#12206B}
.coupon-copy em{font-style:normal;display:inline-flex;gap:8px;align-items:center}
.coupon-cta{font-weight:700;color:#2A1E00;text-decoration:underline;text-underline-offset:4px}
.coupon-note{margin:0;font-size:13px;color:#6B4E00}
