/* =====================================================================
   Rank Booster Officials – colour theme (loads after style.css)
   Palette: navy #0F1E36 · cobalt #1D4ED8 · violet #7C3AED · teal #0D9488
            amber #F5B83D · coral #F43F5E · mint #10B981
   ===================================================================== */
:root{
  --violet:#7C3AED; --violet-l:#F1EAFE;
  --teal:#0D9488;   --teal-l:#E2F7F4;
  --coral:#E11D48;  --coral-l:#FDE8EE;
  --amber-l:#FFF5DE;
  --grad-main:linear-gradient(135deg,#1D4ED8 0%,#7C3AED 100%);
  --grad-warm:linear-gradient(135deg,#F59E0B 0%,#F43F5E 100%);
  --grad-cool:linear-gradient(135deg,#0D9488 0%,#1D4ED8 100%);
  --grad-dark:linear-gradient(135deg,#0B1730 0%,#162A55 55%,#2A1B5C 100%);
  --shadow-sm:0 6px 18px -8px rgba(15,30,54,.18);
  --shadow-md:0 18px 40px -18px rgba(15,30,54,.28);
}
body{background:#F7F8FD}
::selection{background:#C7D7FE;color:#0F1E36}

/* ---------- Buttons ---------- */
.btn{transition:transform .18s ease,box-shadow .18s ease,background .18s,color .18s,border-color .18s}
.btn-primary{background:var(--grad-main);border:0;box-shadow:0 10px 24px -10px rgba(76,58,237,.65)}
.btn-primary:hover{background:linear-gradient(135deg,#173FAE 0%,#6D28D9 100%);transform:translateY(-2px);box-shadow:0 14px 28px -10px rgba(76,58,237,.75)}
.btn-ghost:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}

/* ---------- Header ---------- */
.site-header{background:rgba(255,255,255,.92);border-bottom:0;box-shadow:0 1px 0 #E4E8F2}
.site-header::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:3px;background:linear-gradient(90deg,#1D4ED8,#7C3AED,#0D9488,#F5B83D)}
.brand-mark{background:var(--grad-main)}
.nav ul a{position:relative}
.nav ul a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:2px;background:var(--grad-main);transform:scaleX(0);transition:transform .2s}
.nav ul a:hover::after,.nav ul a[aria-current]::after{transform:scaleX(1)}
.nav ul a[aria-current]{color:var(--cobalt)}
@media (max-width:1080px){.nav ul{background:#fff}.nav ul a::after{display:none}}

/* ---------- Home hero ---------- */
.hero{position:relative;overflow:hidden;background:
  radial-gradient(600px 380px at 8% 10%,rgba(29,78,216,.14),transparent 70%),
  radial-gradient(520px 360px at 92% 20%,rgba(124,58,237,.16),transparent 70%),
  radial-gradient(500px 300px at 60% 100%,rgba(13,148,136,.12),transparent 70%),#F7F8FD}
.hero h1{background:linear-gradient(120deg,#0F1E36 30%,#1D4ED8 70%,#7C3AED 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.proposal{border:0;box-shadow:0 30px 70px -25px rgba(42,27,92,.45)}
.proposal-top{background:var(--grad-dark)}

/* ---------- Sub-page hero ---------- */
.page-hero{position:relative;overflow:hidden;background:
  radial-gradient(520px 320px at 0% 0%,rgba(29,78,216,.16),transparent 70%),
  radial-gradient(480px 320px at 100% 30%,rgba(124,58,237,.16),transparent 70%),
  linear-gradient(180deg,#EEF2FF 0%,#F7F8FD 100%)}
.page-hero h1{background:linear-gradient(120deg,#0F1E36 35%,#1D4ED8 75%,#7C3AED 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.crumbs a{color:var(--cobalt)}

/* ---------- Strip (3 promises) ---------- */
.strip{background:#fff;border:0}
.strip-grid{gap:20px;padding-block:40px}
.strip-grid>div{background:#fff;border-radius:16px;padding:24px 24px 22px;box-shadow:var(--shadow-sm);border-top:4px solid var(--cobalt)}
.strip-grid>div:nth-child(2){border-top-color:var(--violet)}
.strip-grid>div:nth-child(3){border-top-color:var(--teal)}

/* ---------- Section colour rhythm (home) ---------- */
#services{background:#fff}
.svc-row{border-radius:14px;padding:26px 22px;border-bottom:1px solid #E7EBF3;transition:background .2s,box-shadow .2s,transform .2s;position:relative}
.svc-row::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:4px;border-radius:4px;background:var(--cobalt)}
.svc-row:nth-child(4n+2)::before{background:var(--violet)}
.svc-row:nth-child(4n+3)::before{background:var(--teal)}
.svc-row:nth-child(4n+4)::before{background:#F59E0B}
.svc-row:hover{background:#F6F8FF;box-shadow:var(--shadow-sm);transform:translateX(4px)}
#why{background:linear-gradient(180deg,#ECFDF7 0%,#F7F8FD 100%)}
#browse{background:linear-gradient(180deg,#FFF8E8 0%,#FFFFFF 100%)!important;border:0!important}
#standards{background:linear-gradient(180deg,#F5F0FF 0%,#F7F8FD 100%)}
#niches{background:#F7F8FD;padding-top:56px!important}
#pricing{background:linear-gradient(180deg,#EEF4FF 0%,#FFFFFF 100%)!important;border:0!important}
#faq{background:#fff}

/* ---------- Panels ---------- */
.panel{border:0;border-radius:18px;box-shadow:var(--shadow-sm);position:relative;overflow:hidden}
.panel::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:var(--grad-cool)}
.two-col .panel:nth-child(2)::before{background:var(--grad-warm)}
.panel h3{font-size:1.35rem}

/* ---------- Dark sections (process, contact, CTA) ---------- */
.dark{position:relative;overflow:hidden;background:var(--grad-dark)}
.dark::before{content:"";position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(420px 260px at 90% 0%,rgba(124,58,237,.35),transparent 70%),
  radial-gradient(380px 240px at 0% 100%,rgba(13,148,136,.28),transparent 70%)}
.dark>.wrap{position:relative}
.steps li{border-top:0;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:20px 18px;transition:transform .2s,background .2s}
.steps li:hover{transform:translateY(-4px);background:rgba(255,255,255,.1)}
.steps li::before{background:var(--grad-warm);color:#fff}
.steps li:nth-child(2)::before{background:linear-gradient(135deg,#60A5FA,#7C3AED)}
.steps li:nth-child(3)::before{background:linear-gradient(135deg,#2DD4BF,#0D9488)}
.steps li:nth-child(4)::before{background:linear-gradient(135deg,#FBBF24,#F59E0B);color:#0F1E36}
.steps li:nth-child(5)::before{background:linear-gradient(135deg,#F472B6,#E11D48)}
form.quote{border-radius:20px;box-shadow:0 30px 60px -25px rgba(0,0,0,.55)}
.direct li{border-top-color:rgba(255,255,255,.14)}

/* ---------- Niche chips ---------- */
.chips li{border:0;font-weight:600;transition:transform .18s}
.chips li:hover{transform:translateY(-2px)}
.chips li:nth-child(6n+1){background:#E8EEFD;color:#173FAE}
.chips li:nth-child(6n+2){background:var(--violet-l);color:#5B21B6}
.chips li:nth-child(6n+3){background:var(--teal-l);color:#0F766E}
.chips li:nth-child(6n+4){background:var(--amber-l);color:#92400E}
.chips li:nth-child(6n+5){background:var(--coral-l);color:#9F1239}
.chips li:nth-child(6n+6){background:#E6F9F0;color:#047857}

/* ---------- Pricing / package tiers ---------- */
.tier{border:0;border-radius:20px;box-shadow:var(--shadow-sm);transition:transform .2s,box-shadow .2s;position:relative;overflow:hidden}
.tier::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:var(--grad-cool)}
.tier:nth-child(3)::before{background:var(--grad-warm)}
.tier:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.tier.feat{border:0;background:linear-gradient(#fff,#fff) padding-box,var(--grad-main) border-box;border:2px solid transparent;box-shadow:0 26px 50px -24px rgba(124,58,237,.55)}
.tier.feat::before{background:var(--grad-main)}
.tier.feat::after{content:"Most popular";position:absolute;top:18px;right:18px;background:var(--grad-main);color:#fff;font:700 .75rem var(--font-body);padding:5px 12px;border-radius:999px;letter-spacing:.02em}
.tier .price{background:var(--grad-main);-webkit-background-clip:text;background-clip:text;color:transparent}
.tier .price small{-webkit-text-fill-color:var(--muted)}

/* ---------- FAQ ---------- */
.faq details{background:#fff;border:1px solid #E7EBF3;border-radius:14px;padding:4px 20px;margin-bottom:12px;transition:box-shadow .2s,border-color .2s}
.faq details:hover{border-color:#C9D6FB}
.faq details[open]{box-shadow:var(--shadow-sm);border-color:#C9D6FB;border-left:4px solid var(--violet)}
.faq summary::after{color:var(--violet)}
.faq details p{padding-right:0}

/* ---------- Website list section (service pages) ---------- */
#sites{background:linear-gradient(180deg,#F7F8FD 0%,#EEF3FF 60%,#F7F8FD 100%)}
#sites h2{display:inline-block;background:var(--grad-main);-webkit-background-clip:text;background-clip:text;color:transparent}
#packages{background:linear-gradient(180deg,#F7F8FD 0%,#F3EEFF 100%)}
.sites-tools select{border-radius:999px;border-color:#C9D6FB;background:#fff}
.sites .btn-sm{box-shadow:none}

/* ---------- Long-form text on service pages ---------- */
.section .wrap.prose:not(.article){background:#fff;border-radius:24px;padding:44px 48px;box-shadow:var(--shadow-sm);max-width:900px}
@media (max-width:700px){.section .wrap.prose:not(.article){padding:28px 22px;border-radius:18px;margin:0 12px}}
.prose h2{position:relative;padding-left:16px}
.prose h2::before{content:"";position:absolute;left:0;top:.18em;bottom:.18em;width:5px;border-radius:4px;background:var(--grad-main)}
.prose h2:nth-of-type(3n+2)::before{background:var(--grad-cool)}
.prose h2:nth-of-type(3n+3)::before{background:var(--grad-warm)}
.prose ul li::marker{color:var(--violet)}
.prose ol li::marker{color:var(--cobalt);font-weight:700}
.page-hero .prose,.page-hero .wrap.prose{background:none!important;box-shadow:none!important;padding:0 24px!important}
.page-hero .prose h2::before,.page-hero h1::before{display:none}

/* ---------- Related service cards ---------- */
.rel{border:0;border-radius:18px;box-shadow:var(--shadow-sm);position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s;padding:22px 24px 22px 28px}
.rel::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--cobalt)}
.rel:nth-child(6n+2)::before{background:var(--violet)}
.rel:nth-child(6n+3)::before{background:var(--teal)}
.rel:nth-child(6n+4)::before{background:#F59E0B}
.rel:nth-child(6n+5)::before{background:var(--coral)}
.rel:nth-child(6n+6)::before{background:#10B981}
.rel:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.rel strong::after{content:" \2192";transition:margin .2s}
.rel:hover strong::after{margin-left:4px}

/* ---------- Blog ---------- */
.post-card{border:0;border-radius:18px;box-shadow:var(--shadow-sm);overflow:hidden;transition:transform .2s,box-shadow .2s;padding-top:28px}
.post-card::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:var(--grad-main)}
.post-grid .post-card:nth-child(4n+2)::before{background:var(--grad-cool)}
.post-grid .post-card:nth-child(4n+3)::before{background:var(--grad-warm)}
.post-grid .post-card:nth-child(4n+4)::before{background:linear-gradient(135deg,#10B981,#0D9488)}
.post-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md)}
.post-card .read::after{content:" \2192"}
.post-meta .tag{background:var(--violet-l);color:#5B21B6}
.pager .pg.cur{background:var(--grad-main);border:0}
.pager a.pg:hover{border-color:var(--violet);color:var(--violet)}
.toc{border:0;border-left:5px solid var(--violet);background:linear-gradient(135deg,#F5F0FF,#EEF4FF);border-radius:16px}
.article h2{position:relative;padding-left:16px}
.article h2::before{content:"";position:absolute;left:0;top:.18em;bottom:.18em;width:5px;border-radius:4px;background:var(--grad-main)}
.article a{text-decoration-color:rgba(124,58,237,.4);text-decoration-thickness:2px}
.article a:hover{text-decoration-color:var(--violet)}
.article strong{color:#0F1E36}

/* Reading progress bar (articles) */
.rb-progress{position:fixed;left:0;top:0;height:4px;width:0;z-index:200;background:linear-gradient(90deg,#1D4ED8,#7C3AED,#F43F5E)}

/* ---------- Footer ---------- */
.site-footer{background:linear-gradient(160deg,#0A1526 0%,#14123A 100%);position:relative}
.site-footer::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,#1D4ED8,#7C3AED,#0D9488,#F5B83D)}
.site-footer h3{color:#FCD34D}
.site-footer a:hover{color:#fff}

/* ---------- Chatbot ---------- */
.cb-fab{background:var(--grad-main);box-shadow:0 14px 30px -8px rgba(124,58,237,.6)}
.cb-fab:hover{background:linear-gradient(135deg,#173FAE,#6D28D9)}
.cb-head{background:var(--grad-dark)}
.cb-msg.me{background:var(--grad-main)}
.cb-chips button{background:var(--violet-l);color:#5B21B6}

/* ---------- Scroll reveal (only when JS adds .rb-anim) ---------- */
.rb-anim .rb-reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.rb-anim .rb-reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .rb-anim .rb-reveal{opacity:1;transform:none;transition:none}
  .btn,.tier,.rel,.post-card,.svc-row,.steps li,.chips li{transition:none}
}
