/* ============================================================
   GROWTH PIXEL HUB — DESIGN SYSTEM
   Signature: the "pixel bar" motif — small square blocks that
   stack into rising bars, echoing the brand name (Pixel) and
   the brand promise (Growth). Used sparingly as the one bold
   accessory across an otherwise disciplined, premium dark UI.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@500;600&display=swap');

:root{
  /* --- Color tokens (brief: Deep Navy / Midnight Black, Electric Blue / Royal Purple, Emerald) --- */
  --navy-950:#05070f;
  --navy-900:#080c1c;
  --navy-800:#0e1430;
  --navy-700:#161d42;
  --navy-600:#202a56;

  --blue:#3366ff;
  --blue-light:#6d93ff;
  --purple:#8b5cf6;
  --purple-deep:#6425d0;
  --emerald:#12c48b;
  --emerald-light:#4de3b2;

  --text-hi:#f5f7fc;
  --text-mid:#aab4d4;
  --text-low:#7480a3;

  --line:rgba(255,255,255,.09);
  --line-strong:rgba(255,255,255,.16);
  --glass:rgba(255,255,255,.045);
  --glass-hover:rgba(255,255,255,.08);

  --grad-accent:linear-gradient(90deg,var(--blue) 0%,var(--purple) 100%);
  --grad-accent-v:linear-gradient(180deg,var(--blue) 0%,var(--purple) 100%);
  --grad-bg:radial-gradient(ellipse 120% 60% at 15% -10%,rgba(51,102,255,.20),transparent 55%),
            radial-gradient(ellipse 100% 60% at 90% 0%,rgba(139,92,246,.16),transparent 50%),
            linear-gradient(180deg,var(--navy-950) 0%,var(--navy-900) 40%,var(--navy-950) 100%);

  --radius-sm:10px;
  --radius-md:16px;
  --radius-lg:24px;
  --container:1200px;

  --shadow-soft:0 20px 60px -20px rgba(0,0,0,.6);
  --shadow-glow-blue:0 0 0 1px rgba(51,102,255,.35),0 20px 50px -15px rgba(51,102,255,.35);
  --shadow-glow-purple:0 0 0 1px rgba(139,92,246,.35),0 20px 50px -15px rgba(139,92,246,.35);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important;}
}

body{
  margin:0;
  background:var(--grad-bg);
  background-attachment:fixed;
  color:var(--text-mid);
  font-family:'Inter',sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

h1,h2,h3,h4{
  font-family:'Space Grotesk',sans-serif;
  color:var(--text-hi);
  line-height:1.15;
  margin:0 0 16px;
  font-weight:600;
  letter-spacing:-.01em;
}
h1{font-size:clamp(2.4rem,5vw,4rem);font-weight:700;letter-spacing:-.02em;}
h2{font-size:clamp(1.9rem,3.4vw,2.7rem);}
h3{font-size:1.35rem;}
p{margin:0 0 16px;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
ul{margin:0;padding:0;list-style:none;}
button{font-family:inherit;cursor:pointer;}
input,textarea,select{font-family:inherit;}

.mono{font-family:'IBM Plex Mono',monospace;}

.eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--blue-light);
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:16px;
  font-weight:600;
}
.eyebrow::before{
  content:'';
  width:7px;height:7px;
  background:var(--grad-accent);
  border-radius:2px;
  display:inline-block;
}

.container{
  width:100%;
  max-width:var(--container);
  margin:0 auto;
  padding:0 32px;
}
.section{padding:112px 0;position:relative;}
.section-tight{padding:72px 0;}
@media (max-width:768px){
  .section{padding:72px 0;}
  .container{padding:0 20px;}
}

.section-head{max-width:640px;margin-bottom:56px;}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center;}
.section-head p{color:var(--text-low);font-size:1.05rem;}

.text-gradient{
  background:var(--grad-accent);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:15px 28px;
  border-radius:100px;
  font-weight:600;
  font-size:.95rem;
  border:1px solid transparent;
  transition:transform .25s ease,box-shadow .25s ease,background .25s ease,border-color .25s ease;
  white-space:nowrap;
}
.btn-primary{
  background:var(--grad-accent);
  color:#fff;
  box-shadow:0 10px 30px -8px rgba(51,102,255,.55);
}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 36px -8px rgba(51,102,255,.7);}
.btn-ghost{
  background:var(--glass);
  color:var(--text-hi);
  border-color:var(--line-strong);
  backdrop-filter:blur(10px);
}
.btn-ghost:hover{background:var(--glass-hover);border-color:rgba(255,255,255,.3);transform:translateY(-2px);}
.btn-emerald{background:linear-gradient(90deg,var(--emerald),var(--emerald-light));color:#04231a;box-shadow:0 10px 30px -8px rgba(18,196,139,.5);}
.btn-emerald:hover{transform:translateY(-2px);}
.btn-sm{padding:10px 20px;font-size:.85rem;}
.btn-block{width:100%;}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none !important;}

/* ---------- Nav ---------- */
.nav{
  position:sticky;top:0;z-index:200;
  padding:18px 0;
  border-bottom:1px solid transparent;
  transition:background .3s ease,border-color .3s ease,padding .3s ease;
}
.nav.scrolled{
  background:rgba(5,7,15,.78);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
  padding:12px 0;
}
.nav .container{display:flex;align-items:center;justify-content:space-between;gap:24px;}
.brand{display:flex;align-items:center;gap:10px;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:1.15rem;color:var(--text-hi);}
.brand-mark{
  width:34px;height:34px;border-radius:9px;
  background:var(--grad-accent);
  position:relative;
  flex-shrink:0;
  display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);gap:3px;padding:6px;
}
.brand-mark span{background:rgba(255,255,255,.85);border-radius:1px;}
.brand-mark span:nth-child(1){background:rgba(255,255,255,.95);}
.brand-mark span:nth-child(4){background:rgba(255,255,255,.55);}
.nav-links{display:flex;align-items:center;gap:0;}
.nav-links a{
  padding:9px 13px;border-radius:100px;font-size:.88rem;font-weight:500;color:var(--text-mid);transition:color .2s,background .2s;white-space:nowrap;
}
.nav-links a:hover{color:var(--text-hi);background:var(--glass);}
.nav-links a.active{color:var(--text-hi);background:var(--glass);}
.nav-cta{display:flex;align-items:center;gap:12px;}
.nav-toggle{display:none;background:none;border:1px solid var(--line-strong);border-radius:8px;padding:10px;color:var(--text-hi);}
.nav-toggle svg{width:20px;height:20px;display:block;}

@media (max-width:1240px){
  .nav-links{
    position:fixed;inset:0 0 0 auto;top:0;height:100vh;width:78%;max-width:340px;
    background:rgba(6,8,18,.98);backdrop-filter:blur(20px);
    flex-direction:column;align-items:stretch;padding:100px 24px 24px;gap:4px;
    border-left:1px solid var(--line);
    transform:translateX(100%);transition:transform .35s ease;
  }
  .nav-links.open{transform:translateX(0);}
  .nav-links a{padding:14px 16px;}
  .nav-toggle{display:block;}
  .mobile-cta{display:flex;flex-direction:column;gap:10px;margin-top:24px;padding-top:20px;border-top:1px solid var(--line);}
}
@media (max-width:420px){
  .nav-cta .btn-ghost{display:none;}
}
.mobile-cta{display:none;}

/* ---------- Hero pixel-bar signature ---------- */
.pixel-bars{display:flex;align-items:flex-end;gap:6px;height:220px;}
.pixel-col{display:flex;flex-direction:column-reverse;gap:5px;width:16px;}
.pixel-col span{
  width:100%;aspect-ratio:1/1;border-radius:2px;background:var(--navy-700);
  opacity:0;transform:translateY(6px);
  animation:pixelIn .5s ease forwards;
}
.pixel-col span.on{background:var(--grad-accent-v);}
.pixel-col span.on-em{background:linear-gradient(180deg,var(--emerald),var(--emerald-light));}
@keyframes pixelIn{to{opacity:1;transform:translateY(0);}}

.pixel-grid-bg{
  position:absolute;inset:0;
  background-image:radial-gradient(rgba(255,255,255,.10) 1px,transparent 1px);
  background-size:26px 26px;
  mask-image:radial-gradient(ellipse 60% 50% at 50% 0%,#000 40%,transparent 100%);
  pointer-events:none;
}

/* ---------- Reveal on scroll ---------- */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease;}
.reveal.in{opacity:1;transform:translateY(0);}

/* ---------- Glass card ---------- */
.card{
  background:var(--glass);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:32px;
  backdrop-filter:blur(10px);
  transition:transform .3s ease,border-color .3s ease,background .3s ease,box-shadow .3s ease;
}
.card:hover{transform:translateY(-4px);border-color:var(--line-strong);background:var(--glass-hover);}

/* ---------- Badges / trust strip ---------- */
.badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 14px;border-radius:100px;
  background:var(--glass);border:1px solid var(--line);
  font-size:.8rem;color:var(--text-mid);font-weight:500;
}
.badge .dot{width:6px;height:6px;border-radius:50%;background:var(--emerald);}

.stat-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden;}
.stat-strip .stat{background:var(--navy-900);padding:28px 20px;text-align:center;}
.stat-num{font-family:'Space Grotesk';font-size:2.1rem;font-weight:700;color:var(--text-hi);}
.stat-num span{color:var(--blue-light);}
.stat-label{font-size:.82rem;color:var(--text-low);margin-top:4px;}
@media (max-width:768px){.stat-strip{grid-template-columns:repeat(2,1fr);}}

/* ---------- Grids ---------- */
.grid{display:grid;gap:24px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
@media (max-width:980px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr);}}
@media (max-width:640px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}}

/* ---------- Service / feature card ---------- */
.icon-tile{
  width:52px;height:52px;border-radius:14px;
  background:linear-gradient(135deg,rgba(51,102,255,.18),rgba(139,92,246,.18));
  border:1px solid var(--line-strong);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:20px;
}
.icon-tile svg{width:24px;height:24px;stroke:var(--blue-light);}
.feature-card .learn{display:inline-flex;align-items:center;gap:6px;color:var(--blue-light);font-weight:600;font-size:.88rem;margin-top:4px;}
.feature-card .learn svg{width:14px;height:14px;transition:transform .2s;}
.feature-card:hover .learn svg{transform:translateX(3px);}

/* ---------- Portfolio ---------- */
.filter-bar{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:40px;}
.filter-btn{
  padding:9px 18px;border-radius:100px;border:1px solid var(--line);background:transparent;color:var(--text-mid);font-size:.85rem;font-weight:500;transition:all .2s;
}
.filter-btn.active,.filter-btn:hover{background:var(--glass-hover);color:var(--text-hi);border-color:var(--line-strong);}

.portfolio-thumb{
  aspect-ratio:16/10;border-radius:var(--radius-md) var(--radius-md) 0 0;
  background:linear-gradient(135deg,var(--navy-700),var(--navy-800));
  position:relative;overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--line);border-bottom:none;
}
.portfolio-thumb .pixel-grid-bg{mask-image:none;opacity:.5;}
.portfolio-thumb span{
  font-family:'IBM Plex Mono';font-size:.78rem;color:var(--text-low);
  border:1px dashed var(--line-strong);padding:8px 14px;border-radius:8px;background:rgba(0,0,0,.25);
  z-index:1;
}
.portfolio-card{border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--line);background:var(--glass);transition:transform .3s,border-color .3s;}
.portfolio-card:hover{transform:translateY(-4px);border-color:var(--line-strong);}
.portfolio-body{padding:24px;}
.portfolio-cat{font-family:'IBM Plex Mono';font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--emerald-light);margin-bottom:8px;display:block;}
.portfolio-result{margin-top:14px;padding-top:14px;border-top:1px solid var(--line);font-size:.85rem;color:var(--text-low);display:flex;align-items:center;gap:8px;}
.portfolio-result svg{width:16px;height:16px;stroke:var(--emerald-light);flex-shrink:0;}

/* ---------- Testimonials ---------- */
.testi-card{display:flex;flex-direction:column;height:100%;}
.testi-quote{color:var(--text-mid);font-size:.98rem;flex-grow:1;}
.testi-person{display:flex;align-items:center;gap:12px;margin-top:20px;padding-top:20px;border-top:1px solid var(--line);}
.avatar{
  width:44px;height:44px;border-radius:50%;flex-shrink:0;
  background:var(--grad-accent);
  display:flex;align-items:center;justify-content:center;
  font-family:'Space Grotesk';font-weight:700;color:#fff;font-size:.85rem;
}
.testi-name{color:var(--text-hi);font-weight:600;font-size:.9rem;}
.testi-role{font-size:.8rem;color:var(--text-low);}
.stars{margin-bottom:12px;color:var(--emerald-light);letter-spacing:3px;font-size:.95rem;}

/* ---------- Pricing ---------- */
.price-card{position:relative;display:flex;flex-direction:column;}
.price-card.featured{border-color:rgba(139,92,246,.5);background:linear-gradient(180deg,rgba(139,92,246,.09),rgba(51,102,255,.05));box-shadow:var(--shadow-glow-purple);}
.price-tag{position:absolute;top:-13px;left:32px;background:var(--grad-accent);color:#fff;font-size:.72rem;font-weight:700;padding:5px 14px;border-radius:100px;letter-spacing:.03em;}
.price-name{font-family:'IBM Plex Mono';font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-low);margin-bottom:10px;}
.price-amount{font-family:'Space Grotesk';font-size:3rem;font-weight:700;color:var(--text-hi);display:flex;align-items:baseline;gap:6px;}
.price-amount small{font-size:1rem;color:var(--text-low);font-weight:500;}
.price-desc{margin:10px 0 24px;font-size:.9rem;}
.price-list{margin:0 0 28px;flex-grow:1;}
.price-list li{display:flex;align-items:flex-start;gap:10px;padding:9px 0;font-size:.92rem;color:var(--text-mid);border-bottom:1px dashed var(--line);}
.price-list li:last-child{border-bottom:none;}
.price-list svg{width:17px;height:17px;stroke:var(--emerald-light);flex-shrink:0;margin-top:2px;}

.compare-table{width:100%;border-collapse:collapse;font-size:.9rem;}
.compare-table th,.compare-table td{padding:16px 18px;text-align:left;border-bottom:1px solid var(--line);}
.compare-table th{font-family:'Space Grotesk';color:var(--text-hi);font-weight:600;}
.compare-table td:not(:first-child),.compare-table th:not(:first-child){text-align:center;}
.compare-table td:first-child{color:var(--text-mid);}
.compare-table svg.yes{width:18px;height:18px;stroke:var(--emerald-light);}
.compare-table svg.no{width:18px;height:18px;stroke:var(--text-low);opacity:.4;}
.compare-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--glass);}
.compare-table td,.compare-table th{white-space:nowrap;}

/* ---------- FAQ ---------- */
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{width:100%;background:none;border:none;color:var(--text-hi);padding:22px 4px;display:flex;justify-content:space-between;align-items:center;font-family:'Space Grotesk';font-size:1.02rem;font-weight:600;text-align:left;}
.faq-q svg{width:18px;height:18px;stroke:var(--blue-light);flex-shrink:0;transition:transform .3s;}
.faq-item.open .faq-q svg{transform:rotate(45deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease;}
.faq-a-inner{padding:0 4px 22px;color:var(--text-low);font-size:.92rem;}

/* ---------- Forms ---------- */
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
@media (max-width:640px){.form-row{grid-template-columns:1fr;}}
.field{margin-bottom:18px;}
.field label{display:block;font-size:.82rem;font-weight:600;color:var(--text-mid);margin-bottom:8px;}
.field input,.field select,.field textarea{
  width:100%;padding:13px 16px;border-radius:10px;
  background:rgba(255,255,255,.03);border:1px solid var(--line-strong);
  color:var(--text-hi);font-size:.92rem;transition:border-color .2s,background .2s;
}
.field input::placeholder,.field textarea::placeholder{color:var(--text-low);}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--blue);background:rgba(51,102,255,.06);}
.field textarea{resize:vertical;min-height:120px;}
.form-note{font-size:.78rem;color:var(--text-low);margin-top:10px;}
.form-success{
  display:none;align-items:center;gap:12px;padding:16px 18px;border-radius:12px;
  background:rgba(18,196,139,.1);border:1px solid rgba(18,196,139,.4);color:var(--emerald-light);font-size:.9rem;margin-top:16px;
}
.form-success.show{display:flex;}
.form-success svg{width:20px;height:20px;flex-shrink:0;}

/* ---------- Footer ---------- */
.footer{border-top:1px solid var(--line);padding:72px 0 28px;}
.footer-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1.3fr;gap:32px;margin-bottom:56px;}
@media (max-width:980px){.footer-top{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.footer-top{grid-template-columns:1fr;}}
.footer h4{font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-hi);font-family:'IBM Plex Mono';margin-bottom:18px;}
.footer ul li{margin-bottom:12px;}
.footer ul a{color:var(--text-low);font-size:.9rem;transition:color .2s;}
.footer ul a:hover{color:var(--text-hi);}
.footer-brand p{font-size:.88rem;color:var(--text-low);max-width:280px;}
.social-row{display:flex;gap:10px;margin-top:20px;}
.social-row a{width:36px;height:36px;border-radius:9px;background:var(--glass);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;transition:all .2s;}
.social-row a:hover{background:var(--glass-hover);border-color:var(--line-strong);}
.social-row svg{width:16px;height:16px;stroke:var(--text-mid);}
.newsletter-mini{display:flex;gap:8px;margin-top:6px;}
.newsletter-mini input{flex-grow:1;padding:11px 14px;border-radius:9px;background:rgba(255,255,255,.03);border:1px solid var(--line-strong);color:var(--text-hi);font-size:.85rem;}
.newsletter-mini button{padding:11px 16px;border-radius:9px;border:none;background:var(--grad-accent);color:#fff;font-weight:600;font-size:.85rem;}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-top:28px;border-top:1px solid var(--line);font-size:.82rem;color:var(--text-low);}
.footer-bottom .legal-links{display:flex;gap:20px;}
.footer-bottom .legal-links a:hover{color:var(--text-hi);}

/* ---------- WhatsApp float ---------- */
.wa-float{
  position:fixed;bottom:24px;right:24px;z-index:300;
  width:60px;height:60px;border-radius:50%;
  background:linear-gradient(135deg,#1fd45f,#12c48b);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 12px 30px -6px rgba(18,196,139,.6);
  animation:waPulse 2.6s infinite;
}
.wa-float svg{width:28px;height:28px;fill:#fff;}
@keyframes waPulse{0%,100%{box-shadow:0 12px 30px -6px rgba(18,196,139,.6);}50%{box-shadow:0 12px 30px -6px rgba(18,196,139,.95),0 0 0 10px rgba(18,196,139,.08);}}
@media (max-width:640px){.wa-float{width:52px;height:52px;bottom:16px;right:16px;}.wa-float svg{width:24px;height:24px;}}

/* ---------- Exit intent popup ---------- */
.overlay{
  position:fixed;inset:0;z-index:400;background:rgba(3,4,10,.78);backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;padding:20px;
  opacity:0;pointer-events:none;transition:opacity .3s ease;
}
.overlay.show{opacity:1;pointer-events:auto;}
.popup{
  width:100%;max-width:460px;background:var(--navy-900);border:1px solid var(--line-strong);border-radius:var(--radius-lg);
  padding:40px;position:relative;box-shadow:var(--shadow-soft);
  transform:scale(.94);transition:transform .3s ease;
}
.overlay.show .popup{transform:scale(1);}
.popup-close{position:absolute;top:18px;right:18px;background:var(--glass);border:1px solid var(--line);width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--text-mid);}
.popup-close svg{width:16px;height:16px;}

/* ---------- Utility ---------- */
.flex{display:flex;}
.flex-center{display:flex;align-items:center;justify-content:center;}
.gap-12{gap:12px;}
.mt-0{margin-top:0;}
.text-center{text-align:center;}
.small{font-size:.85rem;}
.divider{height:1px;background:var(--line);margin:40px 0;}
.tag-pill{display:inline-block;padding:4px 12px;border-radius:100px;background:var(--glass);border:1px solid var(--line);font-size:.75rem;color:var(--text-mid);margin:0 6px 6px 0;}

/* ---------- Page hero (inner pages) ---------- */
.page-hero{padding:150px 0 80px;position:relative;overflow:hidden;}
.page-hero .container{position:relative;z-index:1;}
.page-hero p.lead{max-width:620px;font-size:1.08rem;color:var(--text-low);}

/* ---------- Breadcrumb-ish crumbs ---------- */
.crumbs{font-size:.8rem;color:var(--text-low);margin-bottom:18px;font-family:'IBM Plex Mono';}
.crumbs a{color:var(--text-low);}
.crumbs a:hover{color:var(--text-hi);}

/* ---------- Blog / KB cards ---------- */
.post-card{overflow:hidden;}
.post-thumb{aspect-ratio:16/9;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--navy-700),var(--navy-800));border:1px solid var(--line);margin-bottom:20px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.post-meta{display:flex;gap:14px;font-size:.78rem;color:var(--text-low);margin-bottom:10px;font-family:'IBM Plex Mono';}
.post-cat{color:var(--blue-light);}

.kb-item{display:flex;gap:20px;padding:28px 0;border-bottom:1px solid var(--line);}
.kb-num{font-family:'Space Grotesk';font-size:1rem;font-weight:700;color:var(--text-low);width:36px;flex-shrink:0;}
.kb-item:last-child{border-bottom:none;}

/* ---------- Dashboard ---------- */
.dash-shell{display:grid;grid-template-columns:260px 1fr;min-height:100vh;}
@media (max-width:900px){.dash-shell{grid-template-columns:1fr;}}
.dash-sidebar{border-right:1px solid var(--line);padding:28px 20px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;}
@media (max-width:900px){.dash-sidebar{display:none;}}
.dash-nav a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:10px;color:var(--text-mid);font-size:.92rem;font-weight:500;margin-bottom:4px;}
.dash-nav a.active,.dash-nav a:hover{background:var(--glass);color:var(--text-hi);}
.dash-nav svg{width:18px;height:18px;}
.dash-main{padding:36px 40px;}
@media (max-width:640px){.dash-main{padding:24px 20px;}}
.dash-topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px;flex-wrap:wrap;gap:16px;}
.progress-bar{width:100%;height:8px;border-radius:100px;background:var(--navy-800);overflow:hidden;}
.progress-bar span{display:block;height:100%;background:var(--grad-accent);border-radius:100px;}
.table-simple{width:100%;border-collapse:collapse;font-size:.9rem;}
.table-simple th{text-align:left;color:var(--text-low);font-weight:500;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;padding:0 16px 12px;font-family:'IBM Plex Mono';}
.table-simple td{padding:16px;border-top:1px solid var(--line);color:var(--text-mid);}
.table-simple tr td:first-child,.table-simple tr th:first-child{padding-left:20px;}
.status-pill{padding:4px 12px;border-radius:100px;font-size:.75rem;font-weight:600;}
.status-paid{background:rgba(18,196,139,.14);color:var(--emerald-light);}
.status-pending{background:rgba(251,191,36,.14);color:#fbbf24;}
.login-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;}
.login-card{width:100%;max-width:420px;padding:44px;}
.tab-row{display:flex;gap:8px;margin-bottom:28px;border-bottom:1px solid var(--line);}
.tab-btn{padding:12px 4px;margin-right:24px;background:none;border:none;color:var(--text-low);font-weight:600;font-size:.92rem;border-bottom:2px solid transparent;margin-bottom:-1px;}
.tab-btn.active{color:var(--text-hi);border-color:var(--blue);}
.tab-pane{display:none;}
.tab-pane.active{display:block;}
.upload-zone{border:1.5px dashed var(--line-strong);border-radius:var(--radius-md);padding:40px;text-align:center;color:var(--text-low);font-size:.9rem;}
.upload-zone svg{width:32px;height:32px;stroke:var(--text-low);margin-bottom:12px;}

/* ---------- Booking widget ---------- */
.booking-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;}
@media (max-width:768px){.booking-grid{grid-template-columns:1fr;}}
.day-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;}
.day-cell{aspect-ratio:1/1;border-radius:9px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:.85rem;color:var(--text-mid);background:transparent;}
.day-cell:disabled{opacity:.25;}
.day-cell.selected{background:var(--grad-accent);color:#fff;border-color:transparent;}
.day-cell:not(:disabled):hover{border-color:var(--line-strong);}
.slot-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;}
.slot-btn{padding:12px;border-radius:9px;border:1px solid var(--line);background:transparent;color:var(--text-mid);font-size:.88rem;}
.slot-btn.selected{background:var(--grad-accent);color:#fff;border-color:transparent;}
.slot-btn:hover{border-color:var(--line-strong);}

/* ---------- Legal pages ---------- */
.legal-body h2{margin-top:44px;font-size:1.4rem;}
.legal-body h2:first-child{margin-top:0;}
.legal-body p,.legal-body li{color:var(--text-mid);}
.legal-body ul{margin:12px 0 20px;padding-left:20px;list-style:disc;}
.legal-body li{margin-bottom:8px;}
.legal-updated{color:var(--text-low);font-size:.85rem;margin-bottom:40px;}

/* ---------- CTA band ---------- */
.cta-band{
  border-radius:var(--radius-lg);
  padding:64px;
  background:linear-gradient(135deg,rgba(51,102,255,.16),rgba(139,92,246,.16));
  border:1px solid var(--line-strong);
  position:relative;overflow:hidden;
  text-align:center;
}
.cta-band h2{margin-bottom:12px;}
.cta-band .btn-row{margin-top:28px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
@media (max-width:640px){.cta-band{padding:40px 24px;}}

.btn-row{display:flex;gap:14px;flex-wrap:wrap;}