/* ==========================================================================
   TAMIM ISP BILLING SYSTEM — Marketing site design system
   Signature: "network pulse" motif — signal rings & dot-pings stand in for
   the usual numbered (01/02/03) markers, since modules aren't a sequence.
   ========================================================================== */

:root{
  /* Blue → purple gradient family */
  --c-blue-900:#0B1030;
  --c-blue-700:#123AA8;
  --c-blue-500:#2F6BFF;
  --c-purple-500:#7C3AED;
  --c-purple-300:#A78BFA;
  --c-cyan-300:#5FE0C8;

  --gradient-brand: linear-gradient(135deg, var(--c-blue-700) 0%, var(--c-blue-500) 45%, var(--c-purple-500) 100%);
  --gradient-text:  linear-gradient(90deg, var(--c-blue-500) 0%, var(--c-purple-500) 100%);
  --gradient-mesh:  radial-gradient(60% 60% at 20% 20%, rgba(47,107,255,.35) 0%, rgba(47,107,255,0) 60%),
                     radial-gradient(50% 50% at 85% 30%, rgba(124,58,237,.30) 0%, rgba(124,58,237,0) 60%);

  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;

  --font-display: 'Space Grotesk', 'Segoe UI', sans-serif;
  --font-body: 'Inter', 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;

  --shadow-glow: 0 20px 60px -20px rgba(47,107,255,.45);
  --transition: .28s cubic-bezier(.4,0,.2,1);
}

/* ---------------- Theme: Dark (default) ---------------- */
:root, [data-theme="dark"]{
  --bg-body:#070B18;
  --bg-alt:#0B1230;
  --text-main:#E7ECFF;
  --text-muted:#98A2C7;
  --text-soft:#6E7AA8;
  --border-soft: rgba(255,255,255,.10);
  --glass-bg: rgba(255,255,255,.055);
  --glass-bg-strong: rgba(255,255,255,.09);
  --glass-border: rgba(255,255,255,.14);
  --card-bg: rgba(255,255,255,.04);
  --nav-bg: rgba(7,11,24,.66);
  --input-bg: rgba(255,255,255,.06);
  --shadow-soft: 0 20px 50px -25px rgba(0,0,0,.65);
}

/* ---------------- Theme: Light ---------------- */
[data-theme="light"]{
  --bg-body:#F5F7FD;
  --bg-alt:#EDF1FC;
  --text-main:#101632;
  --text-muted:#4B5578;
  --text-soft:#727EA3;
  --border-soft: rgba(16,22,50,.08);
  --glass-bg: rgba(255,255,255,.55);
  --glass-bg-strong: rgba(255,255,255,.75);
  --glass-border: rgba(16,22,50,.08);
  --card-bg: rgba(255,255,255,.65);
  --nav-bg: rgba(245,247,253,.72);
  --input-bg: rgba(16,22,50,.04);
  --shadow-soft: 0 20px 50px -25px rgba(16,22,50,.18);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  font-family: var(--font-body);
  background: var(--bg-body);
  color: var(--text-main);
  transition: background var(--transition), color var(--transition);
  overflow-x:hidden;
  position:relative;
}
h1,h2,h3,h4,h5,h6{ font-family: var(--font-display); font-weight:600; letter-spacing:-.01em; }
a{ text-decoration:none; }
::selection{ background: var(--c-purple-500); color:#fff; }
code, .mono, .stat-number, .price-value{ font-family: var(--font-mono); }

/* Ambient gradient orbs behind content */
.bg-orb{ position:fixed; border-radius:50%; filter:blur(90px); z-index:-1; opacity:.35; pointer-events:none; }
.bg-orb-1{ width:520px;height:520px; top:-160px; left:-120px; background:var(--c-blue-500); }
.bg-orb-2{ width:460px;height:460px; bottom:-160px; right:-100px; background:var(--c-purple-500); }
[data-theme="light"] .bg-orb{ opacity:.22; }

/* ---------------- Preloader ---------------- */
#preloader{
  position:fixed; inset:0; z-index:9999; background:var(--bg-body);
  display:flex; align-items:center; justify-content:center;
  transition: opacity .5s ease, visibility .5s ease;
}
#preloader.loaded{ opacity:0; visibility:hidden; }
.preloader-mark{ display:flex; gap:10px; }
.signal-dot{ width:14px;height:14px;border-radius:50%; background:var(--gradient-brand); animation: pulse 1s ease-in-out infinite; }
.signal-dot:nth-child(2){ animation-delay:.15s; }
.signal-dot:nth-child(3){ animation-delay:.3s; }
@keyframes pulse{ 0%,100%{ transform:scale(.6); opacity:.5;} 50%{ transform:scale(1.15); opacity:1;} }

/* ---------------- Glassmorphism ---------------- */
.glass-panel, .card-glass, .tamim-navbar{
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
}
.glass-panel{ border-radius: var(--radius-lg); padding:2.5rem; box-shadow: var(--shadow-soft); }
.card-glass{ border-radius: var(--radius-md); padding:1.75rem; transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition); }
.card-glass:hover{ transform: translateY(-6px); box-shadow: var(--shadow-glow); border-color: rgba(124,58,237,.35); }

/* ---------------- Navbar ---------------- */
.tamim-navbar{ background:var(--nav-bg); border-left:none; border-right:none; border-top:none; padding:.85rem 0; z-index:1030; transition: padding var(--transition), background var(--transition); }
.tamim-navbar.scrolled{ padding:.5rem 0; box-shadow: var(--shadow-soft); }
.navbar-brand{ display:flex; align-items:center; gap:.6rem; font-family:var(--font-display); font-weight:700; font-size:1.25rem; color:var(--text-main) !important; }
.brand-mark{ width:38px;height:38px; border-radius:11px; background:var(--gradient-brand); display:flex; align-items:center; justify-content:center; color:#fff; font-size:1rem; box-shadow: var(--shadow-glow); }
.brand-accent{ background:var(--gradient-text); -webkit-background-clip:text; background-clip:text; color:transparent; }
.nav-link{ color:var(--text-muted) !important; font-weight:500; padding:.5rem 1rem !important; position:relative; transition: color var(--transition); }
.nav-link:hover, .nav-link.active{ color:var(--text-main) !important; }
.nav-link.active::after{ content:""; position:absolute; left:1rem; right:1rem; bottom:.1rem; height:2px; background:var(--gradient-text); border-radius:2px; }
.nav-actions{ margin-left:.5rem; }
.navbar-toggler{ border:1px solid var(--border-soft); color:var(--text-main); }
.navbar-toggler:focus{ box-shadow:none; }

.theme-toggle{
  width:42px; height:42px; border-radius:50%; border:1px solid var(--border-soft);
  background: var(--input-bg); color:var(--text-main); display:flex; align-items:center; justify-content:center;
  cursor:pointer; transition: transform var(--transition), background var(--transition);
}
.theme-toggle:hover{ transform: rotate(15deg); }
.theme-toggle .moon-icon{ display:none; }
[data-theme="light"] .theme-toggle .sun-icon{ display:none; }
[data-theme="light"] .theme-toggle .moon-icon{ display:inline-block; }

/* ---------------- Buttons ---------------- */
.btn{ font-weight:600; border-radius:12px; padding:.65rem 1.4rem; transition: all var(--transition); }
.btn-tamim-primary{ background:var(--gradient-brand); color:#fff; border:none; box-shadow: var(--shadow-glow); }
.btn-tamim-primary:hover{ color:#fff; transform: translateY(-2px); box-shadow: 0 24px 55px -18px rgba(124,58,237,.55); }
.btn-tamim-outline{ background:transparent; border:1px solid var(--border-soft); color:var(--text-main); }
.btn-tamim-outline:hover{ border-color: var(--c-purple-300); color:var(--text-main); background:var(--glass-bg-strong); }
.btn-tamim-outline-light{ border:1px solid rgba(255,255,255,.5); color:#fff; }
.btn-tamim-outline-light:hover{ background:rgba(255,255,255,.15); color:#fff; }
.btn-lg{ padding:.9rem 2rem; font-size:1.05rem; }
.btn-ghost-play{ display:inline-flex; align-items:center; gap:.6rem; color:var(--text-main); font-weight:600; }
.btn-ghost-play .play-circle{ width:52px;height:52px;border-radius:50%; border:1px solid var(--border-soft); background:var(--glass-bg); display:flex; align-items:center; justify-content:center; transition: var(--transition); }
.btn-ghost-play:hover .play-circle{ background:var(--gradient-brand); color:#fff; transform:scale(1.06); }

/* ---------------- Eyebrow / section labels (signature: signal-dot marker, not 01/02/03) ---------------- */
.eyebrow{ display:inline-flex; align-items:center; gap:.55rem; font-family:var(--font-mono); font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--c-purple-300); margin-bottom:1rem; }
.eyebrow::before{ content:""; width:8px;height:8px;border-radius:50%; background:var(--gradient-brand); box-shadow:0 0 0 4px rgba(124,58,237,.18); }
.section-title{ font-size:clamp(1.8rem, 3vw, 2.6rem); margin-bottom:.85rem; }
.section-sub{ color:var(--text-muted); font-size:1.05rem; max-width:640px; }
.text-grad{ background:var(--gradient-text); -webkit-background-clip:text; background-clip:text; color:transparent; }
section{ padding:6rem 0; position:relative; }
@media (max-width:768px){ section{ padding:4rem 0; } }
.bg-alt-section{ background:var(--bg-alt); }

/* ---------------- Hero ---------------- */
.hero{ padding:7rem 0 5rem; overflow:hidden; }
.hero::before{ content:""; position:absolute; inset:0; background:var(--gradient-mesh); z-index:-1; }
.hero-badge{ display:inline-flex; align-items:center; gap:.5rem; padding:.45rem .9rem; border-radius:100px; background:var(--glass-bg); border:1px solid var(--glass-border); font-size:.85rem; color:var(--text-muted); margin-bottom:1.5rem; }
.hero-badge .signal-dot{ width:8px;height:8px; }
.hero h1{ font-size:clamp(2.3rem, 5vw, 3.6rem); line-height:1.12; margin-bottom:1.25rem; }
.hero p.lead{ color:var(--text-muted); font-size:1.15rem; max-width:560px; }
.hero-actions{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:2rem; }
.hero-meta{ display:flex; gap:2rem; margin-top:2.5rem; flex-wrap:wrap; }
.hero-meta div strong{ display:block; font-family:var(--font-display); font-size:1.4rem; }
.hero-meta div span{ color:var(--text-soft); font-size:.85rem; }

/* Network pulse graphic (signature element) */
.pulse-visual{ position:relative; width:100%; max-width:480px; margin:0 auto; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; }
.pulse-ring{ position:absolute; border-radius:50%; border:1px solid rgba(124,58,237,.35); animation: ringGrow 3.2s ease-out infinite; }
.pulse-ring:nth-child(1){ width:40%; height:40%; }
.pulse-ring:nth-child(2){ width:65%; height:65%; animation-delay:.7s; }
.pulse-ring:nth-child(3){ width:90%; height:90%; animation-delay:1.4s; }
@keyframes ringGrow{ 0%{ transform:scale(.7); opacity:.9; } 100%{ transform:scale(1.25); opacity:0; } }
.pulse-core{ position:relative; z-index:2; width:130px; height:130px; border-radius:32px; background:var(--gradient-brand); display:flex; align-items:center; justify-content:center; font-size:2.6rem; color:#fff; box-shadow: var(--shadow-glow); }
.pulse-node{ position:absolute; width:46px; height:46px; border-radius:14px; background:var(--glass-bg-strong); border:1px solid var(--glass-border); backdrop-filter:blur(10px); display:flex; align-items:center; justify-content:center; color:var(--c-cyan-300); animation: floaty 5s ease-in-out infinite; }
.pulse-node.n1{ top:6%; left:12%; animation-delay:0s; }
.pulse-node.n2{ top:14%; right:6%; animation-delay:1.2s; color:var(--c-purple-300); }
.pulse-node.n3{ bottom:10%; left:4%; animation-delay:2s; color:var(--c-blue-500); }
.pulse-node.n4{ bottom:4%; right:14%; animation-delay:.6s; }
@keyframes floaty{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-14px);} }
@media (prefers-reduced-motion: reduce){
  .pulse-ring, .pulse-node, .signal-dot{ animation:none !important; }
}

/* ---------------- Dashboard mockup (used in hero + screenshots) ---------------- */
.mockup-frame{ border-radius: var(--radius-lg); overflow:hidden; box-shadow: var(--shadow-soft); border:1px solid var(--glass-border); background:var(--card-bg); }
.mockup-topbar{ display:flex; align-items:center; gap:6px; padding:.7rem 1rem; background:var(--glass-bg-strong); border-bottom:1px solid var(--glass-border); }
.mockup-topbar span{ width:10px;height:10px;border-radius:50%; background:var(--border-soft); }
.mockup-topbar span:nth-child(1){ background:#ff5f57; }
.mockup-topbar span:nth-child(2){ background:#febc2e; }
.mockup-topbar span:nth-child(3){ background:#28c840; }
.mockup-body{ padding:1.25rem; }
.mockup-kpi-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem; margin-bottom:1rem; }
.mockup-kpi{ background:var(--glass-bg); border:1px solid var(--glass-border); border-radius:14px; padding:.9rem; }
.mockup-kpi .k-label{ font-size:.72rem; color:var(--text-soft); text-transform:uppercase; letter-spacing:.06em; }
.mockup-kpi .k-value{ font-family:var(--font-mono); font-size:1.15rem; font-weight:600; margin-top:.2rem; }
.mockup-chart{ height:120px; border-radius:14px; background:var(--glass-bg); border:1px solid var(--glass-border); display:flex; align-items:flex-end; gap:6px; padding:.9rem; }
.mockup-chart span{ flex:1; border-radius:4px 4px 0 0; background:var(--gradient-brand); opacity:.85; }
.mockup-row-list{ margin-top:1rem; display:flex; flex-direction:column; gap:.5rem; }
.mockup-row-list .row-item{ display:flex; justify-content:space-between; align-items:center; padding:.6rem .8rem; background:var(--glass-bg); border:1px solid var(--glass-border); border-radius:10px; font-size:.85rem; }
.status-pill{ font-size:.68rem; padding:.15rem .55rem; border-radius:20px; font-weight:600; }
.status-pill.paid{ background:rgba(40,200,90,.15); color:#28c85a; }
.status-pill.due{ background:rgba(255,159,10,.15); color:#ff9f0a; }
.status-pill.over{ background:rgba(255,69,58,.15); color:#ff453a; }

/* ---------------- Feature cards ---------------- */
.feature-card{ height:100%; }
.feature-icon{ width:52px;height:52px; border-radius:14px; background:var(--gradient-brand); display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.3rem; margin-bottom:1.1rem; }
.feature-card h5{ margin-bottom:.5rem; font-size:1.05rem; }
.feature-card p{ color:var(--text-muted); font-size:.92rem; margin:0; }

/* ---------------- Why choose ---------------- */
.why-item{ display:flex; gap:1.1rem; padding:1.4rem 0; border-bottom:1px solid var(--border-soft); }
.why-item:last-child{ border-bottom:none; }
.why-icon{ flex:0 0 auto; width:46px;height:46px;border-radius:12px; background:var(--glass-bg); border:1px solid var(--glass-border); display:flex; align-items:center; justify-content:center; color:var(--c-purple-300); }
.why-item h6{ margin-bottom:.3rem; }
.why-item p{ color:var(--text-muted); font-size:.92rem; margin:0; }

/* ---------------- Modules ---------------- */
.module-card{ display:flex; flex-direction:column; height:100%; }
.module-icon{ width:58px;height:58px; border-radius:16px; background:var(--glass-bg-strong); border:1px solid var(--glass-border); display:flex; align-items:center; justify-content:center; font-size:1.5rem; color:var(--c-cyan-300); margin-bottom:1.2rem; }
.module-card ul{ list-style:none; padding:0; margin:1rem 0 0; }
.module-card ul li{ display:flex; align-items:center; gap:.55rem; font-size:.88rem; color:var(--text-muted); padding:.3rem 0; }
.module-card ul li i{ color:var(--c-purple-300); font-size:.75rem; }

/* ---------------- Stats / counters ---------------- */
.stat-box{ text-align:center; padding:1.5rem; }
.stat-number{ font-size:clamp(2rem,4vw,2.8rem); font-weight:700; background:var(--gradient-text); -webkit-background-clip:text; background-clip:text; color:transparent; }
.stat-label{ color:var(--text-muted); font-size:.9rem; margin-top:.4rem; }

/* ---------------- Trusted brands strip ---------------- */
.trusted-strip{ display:flex; flex-wrap:wrap; gap:2.5rem; align-items:center; justify-content:center; opacity:.75; }
.trusted-strip span{ font-family:var(--font-display); font-weight:600; font-size:1.05rem; color:var(--text-soft); }

/* ---------------- Testimonials ---------------- */
.testimonial-card{ height:100%; }
.testimonial-stars{ color:#ffb400; margin-bottom:1rem; font-size:.9rem; }
.testimonial-text{ color:var(--text-main); font-size:1rem; margin-bottom:1.5rem; }
.testimonial-person{ display:flex; align-items:center; gap:.8rem; }
.avatar-badge{ width:44px;height:44px;border-radius:50%; background:var(--gradient-brand); display:flex; align-items:center; justify-content:center; color:#fff; font-weight:700; font-family:var(--font-display); }
.testimonial-person strong{ display:block; font-size:.92rem; }
.testimonial-person span{ font-size:.8rem; color:var(--text-muted); }
.swiper-pagination-bullet{ background:var(--text-soft); opacity:.4; }
.swiper-pagination-bullet-active{ background:var(--c-purple-500); opacity:1; }

/* ---------------- Pricing ---------------- */
.pricing-card{ height:100%; display:flex; flex-direction:column; text-align:left; position:relative; }
.pricing-card.featured{ border-color: var(--c-purple-500); background: var(--glass-bg-strong); transform: scale(1.03); }
.pricing-badge{ position:absolute; top:-14px; right:24px; background:var(--gradient-brand); color:#fff; font-size:.72rem; padding:.3rem .8rem; border-radius:20px; font-weight:700; letter-spacing:.03em; }
.pricing-card h4{ margin-bottom:.3rem; }
.pricing-card .plan-desc{ color:var(--text-muted); font-size:.88rem; min-height:2.6em; }
.price-value{ font-size:2.5rem; font-weight:700; margin:1rem 0 .1rem; }
.price-value small{ font-size:.95rem; font-weight:500; color:var(--text-muted); font-family:var(--font-body); }
.price-period{ color:var(--text-soft); font-size:.8rem; margin-bottom:1.5rem; }
.pricing-card ul{ list-style:none; padding:0; margin:0 0 1.75rem; flex-grow:1; }
.pricing-card ul li{ display:flex; align-items:flex-start; gap:.6rem; padding:.45rem 0; font-size:.92rem; color:var(--text-muted); border-bottom:1px dashed var(--border-soft); }
.pricing-card ul li:last-child{ border-bottom:none; }
.pricing-card ul li i{ color:var(--c-cyan-300); margin-top:.2rem; }
.pricing-card .btn{ width:100%; margin-bottom:.6rem; }

/* ---------------- FAQ (accordion) ---------------- */
.accordion-item{ background:var(--card-bg); border:1px solid var(--border-soft); border-radius:var(--radius-md) !important; margin-bottom:1rem; overflow:hidden; }
.accordion-button{ background:transparent; color:var(--text-main); font-weight:600; font-family:var(--font-display); box-shadow:none !important; }
.accordion-button:not(.collapsed){ background:var(--glass-bg-strong); color:var(--text-main); }
.accordion-button::after{ filter: invert(.5); }
[data-theme="light"] .accordion-button::after{ filter:none; }
.accordion-body{ color:var(--text-muted); }

/* ---------------- Screenshots device frames ---------------- */
.device-frame{ position:relative; margin:0 auto; }
.device-laptop{ width:100%; max-width:640px; }
.device-laptop .screen{ border-radius:14px 14px 0 0; border:10px solid #1a1f33; border-bottom:none; background:var(--card-bg); }
.device-laptop .base{ height:16px; background:linear-gradient(#2a3050,#171b30); border-radius:0 0 10px 10px; position:relative; }
.device-laptop .base::after{ content:""; position:absolute; left:50%; top:0; transform:translateX(-50%); width:70px; height:6px; background:#0e1122; border-radius:0 0 6px 6px; }
.device-phone{ width:220px; margin:0 auto; border:8px solid #1a1f33; border-radius:34px; overflow:hidden; background:var(--card-bg); box-shadow:var(--shadow-soft); }
.device-phone .notch{ width:70px;height:16px; background:#1a1f33; border-radius:0 0 12px 12px; margin:0 auto; }

/* ---------------- Docs page ---------------- */
.docs-layout{ display:flex; gap:2.5rem; align-items:flex-start; }
.docs-sidebar{ flex:0 0 260px; position:sticky; top:100px; }
.docs-sidebar ul{ list-style:none; padding:0; margin:0; }
.docs-sidebar li a{ display:block; padding:.55rem .9rem; border-radius:10px; color:var(--text-muted); font-size:.9rem; margin-bottom:.15rem; }
.docs-sidebar li a:hover, .docs-sidebar li a.active{ background:var(--glass-bg); color:var(--text-main); }
.docs-content h3{ margin-top:2.2rem; }
.docs-content h3:first-child{ margin-top:0; }
.docs-content pre{ background:var(--bg-alt); border:1px solid var(--border-soft); border-radius:12px; padding:1.1rem; overflow-x:auto; font-family:var(--font-mono); font-size:.85rem; }
.docs-content code{ font-family:var(--font-mono); }
@media (max-width:991px){ .docs-layout{ flex-direction:column; } .docs-sidebar{ position:static; width:100%; flex:none; } }

/* ---------------- Blog ---------------- */
.blog-card{ height:100%; }
.blog-thumb{ height:170px; border-radius:14px; background: var(--gradient-mesh), var(--bg-alt); border:1px solid var(--glass-border); display:flex; align-items:center; justify-content:center; margin-bottom:1.2rem; font-size:2rem; color:var(--c-purple-300); }
.blog-cat{ font-family:var(--font-mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; color:var(--c-cyan-300); }
.blog-date{ color:var(--text-soft); font-size:.8rem; }

/* ---------------- Contact ---------------- */
.contact-method{ display:flex; align-items:center; gap:1rem; padding:1.1rem; }
.contact-method .why-icon{ flex-shrink:0; }
.map-frame{ border-radius: var(--radius-md); overflow:hidden; border:1px solid var(--glass-border); filter: saturate(.4) brightness(.9); }
[data-theme="light"] .map-frame{ filter:none; }
.form-control, .form-select{ background:var(--input-bg); border:1px solid var(--border-soft); color:var(--text-main); border-radius:12px; padding:.7rem 1rem; }
.form-control:focus, .form-select:focus{ background:var(--input-bg); color:var(--text-main); border-color:var(--c-purple-500); box-shadow:0 0 0 .2rem rgba(124,58,237,.18); }
.form-control::placeholder{ color:var(--text-soft); }
label.form-label{ font-size:.88rem; color:var(--text-muted); margin-bottom:.4rem; }

/* ---------------- Newsletter / footer CTA ---------------- */
.footer-cta{ margin-top:-8rem; margin-bottom:4rem; z-index:2; }
.footer-cta h3{ margin-bottom:.5rem; }
.footer-cta p{ color:var(--text-muted); margin:0; }
.newsletter-form{ display:flex; gap:.6rem; }
.newsletter-form .form-control{ flex:1; }
.footer-cta-buttons{ display:flex; gap:.7rem; margin-top:1rem; }

.tamim-footer{ background:var(--bg-alt); padding-top:9rem; padding-bottom:2rem; border-top:1px solid var(--border-soft); }
.footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:2.5rem; padding-bottom:2.5rem; }
.footer-col h6{ text-transform:uppercase; letter-spacing:.06em; font-size:.8rem; color:var(--text-soft); margin-bottom:1.1rem; }
.footer-col ul{ list-style:none; padding:0; margin:0; }
.footer-col ul li{ margin-bottom:.65rem; }
.footer-col ul li a{ color:var(--text-muted); font-size:.92rem; }
.footer-col ul li a:hover{ color:var(--text-main); }
.footer-brand-col p{ color:var(--text-muted); font-size:.9rem; margin:.9rem 0 1.2rem; max-width:280px; }
.contact-list li{ display:flex; gap:.6rem; color:var(--text-muted); font-size:.88rem; align-items:flex-start; }
.social-links{ display:flex; gap:.7rem; }
.social-links a{ width:38px;height:38px;border-radius:50%; background:var(--glass-bg); border:1px solid var(--glass-border); display:flex; align-items:center; justify-content:center; color:var(--text-main); transition:var(--transition); }
.social-links a:hover{ background:var(--gradient-brand); color:#fff; }
.footer-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:.6rem; padding-top:1.6rem; border-top:1px solid var(--border-soft); color:var(--text-soft); font-size:.85rem; }
.footer-bottom i{ color:var(--c-purple-300); }
@media (max-width:991px){ .footer-grid{ grid-template-columns:1fr 1fr; } .footer-cta{ margin-top:-4rem; } }
@media (max-width:576px){ .footer-grid{ grid-template-columns:1fr; } .newsletter-form{ flex-direction:column; } }

/* ---------------- Back to top ---------------- */
#backToTop{
  position:fixed; bottom:24px; right:24px; width:48px;height:48px; border-radius:50%;
  background:var(--gradient-brand); color:#fff; border:none; display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow-glow); opacity:0; visibility:hidden; transform:translateY(10px);
  transition: all var(--transition); z-index:999; cursor:pointer;
}
#backToTop.show{ opacity:1; visibility:visible; transform:translateY(0); }

/* ---------------- Page hero (inner pages) ---------------- */
.page-hero{ padding:8rem 0 3.5rem; text-align:center; }
.page-hero .eyebrow{ justify-content:center; }
.page-hero h1{ font-size:clamp(2rem,4vw,2.9rem); }
.page-hero p{ color:var(--text-muted); max-width:640px; margin:0 auto; }

/* ---------------- Misc utility ---------------- */
.divider-fade{ height:1px; background:linear-gradient(90deg, transparent, var(--border-soft), transparent); margin:0; }
.badge-soft{ background:var(--glass-bg); border:1px solid var(--glass-border); color:var(--text-muted); padding:.35rem .8rem; border-radius:20px; font-size:.78rem; }

/* ================= MOBILE HORIZONTAL SCROLL FIX (consolidated) =================
   Only stops the whole page from being dragged/scrolled sideways on phones.
   Does not resize, reposition, or restyle any menu/section/component. */
html {
  overflow-x: hidden;
  max-width: 100%;
  overscroll-behavior-x: none;
}
body {
  overflow-x: hidden;
  max-width: 100%;
  width: 100%;
  position: relative;
  overscroll-behavior-x: none;
}
@media (max-width: 768px){
  html, body { overflow-x: hidden; overscroll-behavior-x: none; }
  .container, .container-fluid { max-width: 100%; overflow-x: hidden; }
  .tamim-navbar .navbar-collapse { overflow-x: hidden; }
  .hero, .page-hero { overflow-x: hidden; }
  .row { margin-left: 0; margin-right: 0; }
}
@media (max-width: 576px){
  .navbar-nav { width: 100%; }
  .pricing-card.featured { transform: none; }
}
/* ================= END MOBILE HORIZONTAL SCROLL FIX ================= */