/*
Theme Name: ContentGem Child
Theme URI: https://contentgem.ai
Description: ContentGem child theme for GeneratePress
Author: ContentGem
Template: generatepress
Version: 1.1.0
Text Domain: contentgem-child
*/

/* ============================================================
   TOKENS
   ============================================================ */
:root {
  --cg-navy:     #1E1B4B;
  --cg-indigo:   #2D2867;
  --cg-purple:   #7C3AED;
  --cg-purple-l: #8B5CF6;
  --cg-teal:     #06B6D4;
  --cg-teal-d:   #0891B2;
  --cg-blue:     #3B82F6;
  --cg-red:      #EF4444;
  --cg-green:    #10B981;
  --cg-amber:    #F59E0B;
  --cg-bg:       #08071A;
  --cg-card:     rgba(30,27,75,0.45);
  --cg-border:   rgba(124,58,237,0.2);
  --cg-text:     #F0EEFF;
  --cg-text-2:   #A5B4FC;
  --cg-text-3:   #8B8BAE;
  --cg-text-4:   #555577;
  --font-display:'Syne', sans-serif;
  --font-body:   'DM Sans', sans-serif;
  --radius:      12px;
  --radius-lg:   16px;
  --radius-xl:   20px;
}

/* ============================================================
   RESET / BASE — mobile-first
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-body) !important;
  background: var(--cg-bg) !important;
  color: var(--cg-text) !important;
  overflow-x: hidden;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
img, video { max-width: 100%; height: auto; display: block; }
a { color: var(--cg-teal); text-decoration: none; }
a:hover { color: var(--cg-purple-l); }

/* Hide GeneratePress chrome */
.site-header, .site-footer, .nav-primary, .sidebar-area { display: none !important; }
.site-main, .content-area { background: transparent !important; padding: 0 !important; }
.entry-content { max-width: none !important; }

/* ============================================================
   SR-ONLY / ACCESSIBILITY
   ============================================================ */
.sr-only { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap; }

/* ============================================================
   NAV — mobile first
   ============================================================ */
.cg-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 999;
  height: 64px;
  padding: 0 20px;
  display: flex; align-items: center; justify-content: space-between;
  background: rgba(8,7,26,0.9);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(124,58,237,0.15);
  transition: background 0.3s;
}
.cg-nav.scrolled { background: rgba(8,7,26,0.98); }

.cg-nav-logo {
  font-family: var(--font-display); font-weight: 800; font-size: 1.25rem;
  letter-spacing: -0.02em;
  background: linear-gradient(135deg,#93C5FD,#C4B5FD,#67E8F9);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text; text-decoration: none;
  flex-shrink: 0;
}

/* Mobile: links hidden by default */
.cg-nav-links {
  display: none;
  list-style: none;
}

.cg-nav-links.open {
  display: flex; flex-direction: column;
  position: fixed;
  top: 64px; left: 0; right: 0;
  background: rgba(8,7,26,0.99);
  border-bottom: 1px solid rgba(124,58,237,0.2);
  padding: 16px;
  max-height: calc(100vh - 64px);
  overflow-y: auto;
  gap: 4px;
  z-index: 998;
}

.cg-nav-links > li { position: relative; width: 100%; }
.cg-nav-links > li > a {
  display: flex; align-items: center; justify-content: space-between;
  color: #A5B4FC; font-size: 0.95rem; font-weight: 400;
  padding: 12px 14px; border-radius: 8px;
  transition: all 0.2s;
  min-height: 44px; /* tap target */
}
.cg-nav-links > li > a:hover, .cg-nav-links > li > a.active {
  color: #fff; background: rgba(124,58,237,0.12);
}

/* Dropdown — mobile: always visible when parent open */
.cg-dropdown {
  display: none;
  list-style: none;
  background: rgba(124,58,237,0.06);
  border-radius: 8px;
  padding: 4px 0 4px 12px;
  margin: 2px 0 4px;
}
.cg-nav-links > li.open > .cg-dropdown { display: block; }
.cg-dropdown li a {
  display: block; padding: 10px 14px;
  font-size: 0.88rem; color: #A5B4FC;
  border-radius: 6px; transition: all 0.18s;
  min-height: 44px; display: flex; align-items: center;
}
.cg-dropdown li a:hover { background: rgba(124,58,237,0.15); color: #fff; }

.cg-nav-cta {
  background: var(--cg-purple) !important;
  color: #fff !important; -webkit-text-fill-color: #fff !important;
  padding: 12px 18px !important; border-radius: 8px !important;
  font-weight: 500 !important; margin-top: 8px;
  justify-content: center !important;
}
.cg-nav-cta:hover { background: var(--cg-purple-l) !important; }

.cg-hamburger {
  display: flex; flex-direction: column; gap: 5px;
  cursor: pointer; padding: 10px; background: none; border: none;
  min-width: 44px; min-height: 44px; align-items: center; justify-content: center;
}
.cg-hamburger span {
  display: block; width: 22px; height: 2px;
  background: #A5B4FC; border-radius: 2px; transition: all 0.3s;
}
.cg-hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.cg-hamburger.open span:nth-child(2) { opacity: 0; }
.cg-hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Desktop nav */
@media (min-width: 900px) {
  .cg-nav { padding: 0 40px; height: 68px; }
  .cg-nav-logo { font-size: 1.35rem; }
  .cg-hamburger { display: none; }
  .cg-nav-links {
    display: flex !important; flex-direction: row;
    align-items: center; gap: 4px;
    position: static; background: none; border: none;
    padding: 0; max-height: none; overflow: visible;
    width: auto;
  }
  .cg-nav-links > li { width: auto; }
  .cg-nav-links > li > a {
    font-size: 0.88rem; padding: 8px 12px; min-height: auto;
    justify-content: flex-start;
  }
  .cg-dropdown {
    position: absolute; top: calc(100% + 8px); left: 0;
    background: rgba(14,12,40,0.97);
    border: 1px solid rgba(124,58,237,0.25);
    border-radius: var(--radius); padding: 8px;
    min-width: 220px; z-index: 999;
    backdrop-filter: blur(20px);
    display: block;
    opacity: 0; visibility: hidden;
    transform: translateY(8px);
    transition: all 0.2s;
    margin: 0;
  }
  .cg-nav-links > li:hover .cg-dropdown,
  .cg-nav-links > li.open .cg-dropdown {
    opacity: 1; visibility: visible; transform: translateY(0);
  }
  .cg-nav-cta { margin-top: 0; }
}

/* ============================================================
   BREADCRUMBS
   ============================================================ */
.cg-breadcrumbs {
  padding: 80px 20px 0;
  max-width: 1200px; margin: 0 auto;
}
.cg-breadcrumbs nav[aria-label="Breadcrumb"] ol {
  display: flex; flex-wrap: wrap; gap: 4px 6px;
  list-style: none; font-size: 0.76rem; color: var(--cg-text-4);
}
.cg-breadcrumbs ol li + li::before { content: '/'; margin-right: 6px; }
.cg-breadcrumbs ol li a { color: var(--cg-text-3); }
.cg-breadcrumbs ol li a:hover { color: var(--cg-teal); }
.cg-breadcrumbs ol li[aria-current="page"] { color: var(--cg-text-2); }
@media (min-width: 900px) {
  .cg-breadcrumbs { padding-top: 100px; }
}

/* ============================================================
   HERO
   ============================================================ */
.cg-hero {
  min-height: 100svh;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
  padding: 100px 20px 60px;
  position: relative; overflow: hidden;
}
@media (min-width: 768px) { .cg-hero { padding: 130px 24px 80px; } }

.cg-orb {
  position: absolute; border-radius: 50%;
  filter: blur(80px); opacity: 0.3;
  animation: cgDrift 14s ease-in-out infinite;
  pointer-events: none;
}
.cg-orb-1 { width: min(500px,90vw); height: min(500px,90vw); background: radial-gradient(circle,#7C3AED,transparent 70%); top: -80px; left: -80px; animation-delay: 0s; }
.cg-orb-2 { width: min(420px,80vw); height: min(420px,80vw); background: radial-gradient(circle,#06B6D4,transparent 70%); top: 60px; right: -60px; animation-delay: -5s; }
.cg-orb-3 { width: min(360px,70vw); height: min(360px,70vw); background: radial-gradient(circle,#2D2867,transparent 70%); bottom: 0; left: 35%; animation-delay: -10s; }

.cg-grid-bg {
  position: absolute; inset: 0;
  background-image: linear-gradient(rgba(124,58,237,.07) 1px,transparent 1px), linear-gradient(90deg,rgba(124,58,237,.07) 1px,transparent 1px);
  background-size: 60px 60px;
  mask-image: radial-gradient(ellipse 80% 80% at 50% 50%,black,transparent);
  pointer-events: none;
}

@keyframes cgDrift {
  0%,100% { transform: translate(0,0) scale(1); }
  33%      { transform: translate(20px,-15px) scale(1.04); }
  66%      { transform: translate(-15px,20px) scale(0.96); }
}

.cg-hero-content { position: relative; z-index: 1; max-width: 880px; width: 100%; }

.cg-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(124,58,237,.14); border: 1px solid rgba(124,58,237,.35);
  border-radius: 100px; padding: 6px 14px;
  font-size: 0.72rem; letter-spacing: 0.09em; text-transform: uppercase;
  color: #C4B5FD; margin-bottom: 24px;
  animation: cgFadeUp 0.6s ease both;
}
.cg-badge-dot { width:6px;height:6px;border-radius:50%;background:var(--cg-teal);animation:cgPulse 2s ease-in-out infinite; }
@keyframes cgPulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.5;transform:scale(1.4)} }

.cg-h1 {
  font-family: var(--font-display);
  font-size: clamp(2.2rem, 8vw, 5.4rem);
  font-weight: 800; line-height: 1.06;
  letter-spacing: -0.03em; margin-bottom: 20px;
  animation: cgFadeUp 0.6s 0.15s ease both;
}
.cg-h1-base { color: #F0EEFF; display: block; }
.cg-h1-accent {
  background: linear-gradient(135deg,#A78BFA,#67E8F9,#A78BFA);
  background-size: 200% auto;
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: cgShimmer 4s linear infinite;
}
@keyframes cgShimmer { to { background-position: 200% center; } }

.cg-hero-sub {
  font-size: clamp(0.95rem, 2.5vw, 1.15rem);
  color: #A5B4FC; max-width: 600px; margin: 0 auto 36px;
  font-weight: 300; line-height: 1.7;
  animation: cgFadeUp 0.6s 0.3s ease both;
}

.cg-hero-actions {
  display: flex; gap: 12px;
  justify-content: center; flex-wrap: wrap;
  animation: cgFadeUp 0.6s 0.45s ease both;
}

@keyframes cgFadeUp { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }

/* Dashboard mockup — hidden on small phones */
.cg-dash-wrap {
  position: relative; z-index: 1;
  margin-top: 48px; width: 100%; max-width: 920px;
  animation: cgFadeUp 0.8s 0.6s ease both;
  display: none; /* hidden mobile */
}
@media (min-width: 640px) { .cg-dash-wrap { display: block; } }

.cg-dashboard {
  width: 100%; background: rgba(30,27,75,0.7);
  border: 1px solid rgba(124,58,237,0.3); border-radius: var(--radius-lg);
  overflow: hidden; backdrop-filter: blur(20px);
  box-shadow: 0 0 0 1px rgba(124,58,237,.2), 0 30px 80px rgba(124,58,237,.2);
}
.cg-dash-bar {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 16px; border-bottom: 1px solid rgba(124,58,237,.2);
  background: rgba(8,7,26,.5);
}
.cg-dot { width:10px;height:10px;border-radius:50%; }
.cg-dot-r{background:#EF4444} .cg-dot-y{background:#F59E0B} .cg-dot-g{background:#10B981}
.cg-dash-url { flex:1;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:5px;padding:4px 12px;font-size:.72rem;color:#7C7A9A;margin:0 12px;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.cg-dash-inner { display: grid; grid-template-columns: 160px 1fr; min-height: 340px; }
.cg-dash-sb { background:rgba(10,8,32,.85);padding:16px 0;border-right:1px solid rgba(124,58,237,.15); }
.cg-dash-sb-logo { font-family:var(--font-display);font-weight:800;font-size:.9rem;background:linear-gradient(135deg,#93C5FD,#C4B5FD);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;padding:0 14px 14px;display:block;border-bottom:1px solid rgba(124,58,237,.15);margin-bottom:6px; }
.cg-dash-item { padding:8px 14px;font-size:.72rem;color:#7C7A9A;cursor:default;transition:all .2s; }
.cg-dash-item.active { background:var(--cg-purple);color:#fff;font-weight:500; }
.cg-dash-main { padding:18px;background:rgba(8,7,26,.3); }
.cg-dash-head { display:flex;justify-content:space-between;align-items:center;margin-bottom:14px; }
.cg-dash-title { font-family:var(--font-display);font-size:1rem;font-weight:700;color:#F0EEFF; }
.cg-dash-btn { background:var(--cg-purple-l);color:#fff;padding:5px 12px;border-radius:5px;font-size:.7rem;font-weight:500;white-space:nowrap; }
.cg-row-grid { display:grid;grid-template-columns:1fr 130px 44px 72px 80px;align-items:center;gap:8px;padding:8px 10px;background:rgba(255,255,255,.03);border:1px solid rgba(124,58,237,.1);border-radius:7px;margin-bottom:6px;font-size:.68rem; }
.cg-cluster-name { color:#C4B5FD;font-weight:500; }
.cg-prog { height:4px;background:rgba(255,255,255,.08);border-radius:10px;overflow:hidden; }
.cg-prog-fill { height:100%;border-radius:10px; }
.fill-red{background:var(--cg-red)} .fill-amber{background:var(--cg-amber)} .fill-teal{background:var(--cg-teal)}
.cg-pct { font-weight:600;font-size:.68rem; }
.pct-red{color:var(--cg-red)} .pct-amber{color:var(--cg-amber)} .pct-good{color:var(--cg-green)}
.cg-link-sm { color:var(--cg-blue);font-size:.66rem; }
.cg-gap-sm  { color:var(--cg-teal);font-size:.66rem; }

/* ============================================================
   BUTTONS
   ============================================================ */
.cg-btn {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-body); font-size: 0.95rem; font-weight: 500;
  padding: 13px 26px; border-radius: 8px;
  cursor: pointer; border: none; text-decoration: none;
  transition: all 0.25s; position: relative; overflow: hidden;
  min-height: 48px; /* accessibility tap target */
  white-space: nowrap;
}
.cg-btn-primary { background: var(--cg-purple); color: #fff; }
.cg-btn-primary:hover { background: var(--cg-purple-l); transform: translateY(-2px); box-shadow: 0 8px 28px rgba(124,58,237,.4); color: #fff; }
.cg-btn-secondary { background: transparent; color: #C4B5FD; border: 1px solid rgba(124,58,237,.4); }
.cg-btn-secondary:hover { border-color: var(--cg-purple-l); color: #fff; background: rgba(124,58,237,.1); }
.cg-btn-teal { background: var(--cg-teal-d); color: #fff; }
.cg-btn-teal:hover { background: var(--cg-teal); transform: translateY(-2px); color: #fff; }
.cg-btn-lg { padding: 15px 36px; font-size: 1.05rem; }

/* ============================================================
   SECTION LAYOUT
   ============================================================ */
.cg-section { padding: 70px 20px; max-width: 1140px; margin: 0 auto; }
.cg-section-full { padding: 70px 20px; }
.cg-section-dark { background: rgba(30,27,75,.2); border-top: 1px solid rgba(124,58,237,.1); border-bottom: 1px solid rgba(124,58,237,.1); }

@media (min-width: 768px) {
  .cg-section { padding: 100px 24px; }
  .cg-section-full { padding: 100px 24px; }
}

.cg-section-label { display:inline-block;font-size:.71rem;text-transform:uppercase;letter-spacing:.15em;color:var(--cg-teal);font-weight:600;margin-bottom:12px; }
.cg-section-title { font-family:var(--font-display);font-size:clamp(1.7rem,4vw,3rem);font-weight:800;letter-spacing:-.03em;color:#F0EEFF;margin-bottom:14px;line-height:1.08; }
.cg-section-sub { font-size:clamp(.9rem,2vw,1.05rem);color:#A5B4FC;max-width:560px;font-weight:300;line-height:1.7; }

/* ============================================================
   STATS BAR
   ============================================================ */
.cg-stats-bar { display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:rgba(124,58,237,.12);border-top:1px solid rgba(124,58,237,.12);border-bottom:1px solid rgba(124,58,237,.12); }
@media (min-width:600px) { .cg-stats-bar { grid-template-columns:repeat(4,1fr); } }
.cg-stat { background:var(--cg-bg);padding:28px 16px;text-align:center; }
.cg-stat-num { font-family:var(--font-display);font-size:clamp(1.8rem,4vw,2.4rem);font-weight:800;letter-spacing:-.04em;background:linear-gradient(135deg,#A78BFA,#67E8F9);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;display:block; }
.cg-stat-label { font-size:.76rem;color:var(--cg-text-4);margin-top:4px;line-height:1.4; }

/* ============================================================
   CARDS
   ============================================================ */
.cg-cards-grid { display:grid;grid-template-columns:1fr;gap:16px;margin-top:48px; }
@media (min-width:540px) { .cg-cards-grid { grid-template-columns:repeat(2,1fr); } }
@media (min-width:900px) { .cg-cards-grid { grid-template-columns:repeat(3,1fr);gap:20px; } }
.cg-cards-grid-2 { grid-template-columns:1fr; }
@media (min-width:640px) { .cg-cards-grid-2 { grid-template-columns:repeat(2,1fr); } }

.cg-card { background:var(--cg-card);border:1px solid var(--cg-border);border-radius:var(--radius-lg);padding:24px;transition:all .3s;position:relative;overflow:hidden; }
@media (min-width:768px) { .cg-card { padding: 32px; } }
.cg-card::before { content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(124,58,237,.6),transparent);opacity:0;transition:opacity .3s; }
.cg-card:hover { border-color:rgba(124,58,237,.5);transform:translateY(-3px);box-shadow:0 16px 48px rgba(124,58,237,.14);background:rgba(30,27,75,.7); }
.cg-card:hover::before { opacity:1; }

.cg-card-icon { width:46px;height:46px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;margin-bottom:16px; }
.cg-icon-purple{background:rgba(124,58,237,.2)} .cg-icon-teal{background:rgba(6,182,212,.15)} .cg-icon-blue{background:rgba(59,130,246,.15)} .cg-icon-green{background:rgba(16,185,129,.15)}
.cg-card-title { font-family:var(--font-display);font-size:1.05rem;font-weight:700;color:#F0EEFF;margin-bottom:10px; }
.cg-card-desc { font-size:.87rem;color:var(--cg-text-3);line-height:1.65; }
.cg-ai-tag { display:inline-block;background:rgba(6,182,212,.12);border:1px solid rgba(6,182,212,.25);color:var(--cg-teal);font-size:.63rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:3px 8px;border-radius:4px;margin-bottom:10px; }

/* ============================================================
   PRICING
   ============================================================ */
.cg-pricing-grid { display:grid;grid-template-columns:1fr;gap:20px;margin-top:48px; }
@media (min-width:640px) { .cg-pricing-grid { grid-template-columns:repeat(2,1fr); } }

.cg-pricing-card { background:var(--cg-card);border:1px solid var(--cg-border);border-radius:var(--radius-xl);padding:32px 28px;position:relative;transition:all .3s; }
@media (min-width:768px) { .cg-pricing-card { padding: 40px 36px; } }
.cg-pricing-card:hover { border-color:rgba(124,58,237,.5);transform:translateY(-3px); }
.cg-pricing-card.featured { background:rgba(124,58,237,.15);border-color:var(--cg-purple);box-shadow:0 0 40px rgba(124,58,237,.2); }
@media (min-width:640px) { .cg-pricing-card.featured { transform:scale(1.03); } .cg-pricing-card.featured:hover { transform:scale(1.03) translateY(-3px); } }

.cg-featured-badge { position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,var(--cg-purple),var(--cg-teal));color:#fff;font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:5px 18px;border-radius:100px;white-space:nowrap; }
.cg-plan-name { font-family:var(--font-display);font-size:.82rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--cg-teal);margin-bottom:10px; }
.cg-plan-price { font-family:var(--font-display);font-size:clamp(2.4rem,5vw,3.2rem);font-weight:800;letter-spacing:-.04em;color:#F0EEFF;line-height:1;margin-bottom:4px; }
.cg-plan-price span { font-size:.95rem;font-weight:400;color:var(--cg-text-4); }
.cg-plan-alt { font-size:.8rem;color:var(--cg-teal);margin-bottom:8px;font-weight:500; }
.cg-plan-desc { font-size:.84rem;color:var(--cg-text-3);margin-bottom:24px;line-height:1.55; }
.cg-plan-features { list-style:none;margin:0 0 28px;padding:0;display:flex;flex-direction:column;gap:10px; }
.cg-plan-features li { font-size:.85rem;color:#C4B5FD;display:flex;align-items:flex-start;gap:10px;line-height:1.45; }
.cg-plan-features li::before { content:'✓';color:var(--cg-green);font-weight:700;flex-shrink:0; }
.cg-plan-features li.dim { color:var(--cg-text-4); }
.cg-plan-features li.dim::before { color:#333355; }

/* ============================================================
   HOW IT WORKS
   ============================================================ */
.cg-steps { display:grid;grid-template-columns:1fr;gap:32px;margin-top:48px;position:relative; }
@media (min-width:640px) { .cg-steps { grid-template-columns:repeat(2,1fr); } }
@media (min-width:900px) {
  .cg-steps { grid-template-columns:repeat(4,1fr);gap:0; }
  .cg-steps::before { content:'';position:absolute;top:27px;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,rgba(124,58,237,.4),rgba(6,182,212,.4),transparent); }
}
.cg-step { text-align:center;padding:0 12px; }
.cg-step-num { width:54px;height:54px;border-radius:50%;background:var(--cg-bg);border:2px solid var(--cg-purple);display:flex;align-items:center;justify-content:center;margin:0 auto 18px;font-family:var(--font-display);font-weight:800;font-size:1.1rem;color:#C4B5FD;position:relative;z-index:1; }
.cg-step-title { font-family:var(--font-display);font-weight:700;font-size:.96rem;color:#F0EEFF;margin-bottom:8px; }
.cg-step-desc { font-size:.83rem;color:var(--cg-text-3);line-height:1.6; }

/* ============================================================
   TESTIMONIALS
   ============================================================ */
.cg-testimonials { display:grid;grid-template-columns:1fr;gap:16px;margin-top:48px; }
@media (min-width:640px) { .cg-testimonials { grid-template-columns:repeat(2,1fr); } }
@media (min-width:900px) { .cg-testimonials { grid-template-columns:repeat(3,1fr); } }
.cg-testimonial { background:rgba(30,27,75,.35);border:1px solid rgba(124,58,237,.18);border-radius:var(--radius-lg);padding:24px; }
.cg-stars { color:var(--cg-amber);font-size:.85rem;margin-bottom:12px; }
.cg-testimonial-text { font-size:.88rem;color:#A5B4FC;line-height:1.7;margin-bottom:18px;font-style:italic; }
.cg-author { display:flex;align-items:center;gap:12px; }
.cg-avatar { width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.78rem;color:#fff;flex-shrink:0; }
.cg-author-name { font-size:.83rem;font-weight:600;color:#E8E6F0; }
.cg-author-role { font-size:.73rem;color:var(--cg-text-4); }

/* ============================================================
   FAQ
   ============================================================ */
.cg-faq { max-width:760px;margin:48px auto 0; }
.cg-faq-item { border-bottom:1px solid rgba(124,58,237,.15); }
.cg-faq-q { width:100%;background:none;border:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:18px 0;font-family:var(--font-body);font-size:.93rem;font-weight:600;color:#F0EEFF;text-align:left;gap:16px;min-height:56px; }
.cg-faq-icon { color:var(--cg-purple-l);font-size:1.2rem;flex-shrink:0;transition:transform .3s; }
.cg-faq-item.open .cg-faq-icon { transform:rotate(45deg); }
.cg-faq-a { max-height:0;overflow:hidden;transition:max-height .35s ease; }
.cg-faq-item.open .cg-faq-a { max-height:400px; }
.cg-faq-a p { font-size:.87rem;color:var(--cg-text-3);line-height:1.7;padding-bottom:18px; }

/* ============================================================
   COMPARISON TABLE
   ============================================================ */
.cg-compare-wrap { overflow-x: auto; margin-top: 40px; -webkit-overflow-scrolling: touch; }
.cg-compare-table { width:100%;border-collapse:collapse;font-size:.88rem;min-width:480px; }
.cg-compare-table th { padding:14px 16px;text-align:left;font-family:var(--font-display);font-weight:700;color:#F0EEFF;border-bottom:1px solid rgba(124,58,237,.25); }
.cg-compare-table th.featured-col { background:rgba(124,58,237,.15);color:#C4B5FD;border-radius:10px 10px 0 0; }
.cg-compare-table td { padding:12px 16px;border-bottom:1px solid rgba(124,58,237,.1);color:var(--cg-text-3); }
.cg-compare-table td.featured-col { background:rgba(124,58,237,.07);color:#C4B5FD;font-weight:500; }
.cg-compare-table tr:hover td { background:rgba(124,58,237,.04); }
.cg-check { color:var(--cg-green);font-weight:700; }
.cg-cross { color:var(--cg-red); }
.cg-partial { color:var(--cg-amber); }

/* ============================================================
   INNER HERO (non-home)
   ============================================================ */
.cg-inner-hero { padding: 100px 20px 60px; text-align:center; position:relative; overflow:hidden; }
@media (min-width:768px) { .cg-inner-hero { padding: 130px 24px 80px; } }

/* ============================================================
   CTA SECTION
   ============================================================ */
.cg-cta-section { text-align:center;padding:80px 20px;position:relative;overflow:hidden; }
@media (min-width:768px) { .cg-cta-section { padding: 120px 24px; } }
.cg-cta-bg { position:absolute;inset:0;background:radial-gradient(ellipse 60% 70% at 50% 50%,rgba(124,58,237,.18),transparent);z-index:0;pointer-events:none; }
.cg-cta-ring { position:absolute;border-radius:50%;border:1px solid rgba(124,58,237,.12);top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none; }
.cg-cta-content { position:relative;z-index:1;max-width:640px;margin:0 auto; }
.cg-cta-content h2 { font-family:var(--font-display);font-size:clamp(1.8rem,5vw,3.4rem);font-weight:800;letter-spacing:-.03em;color:#F0EEFF;line-height:1.1;margin-bottom:18px; }
.cg-cta-content p { font-size:clamp(.9rem,2vw,1rem);color:#A5B4FC;margin-bottom:32px;font-weight:300; }
.cg-cta-note { margin-top:14px;font-size:.76rem;color:var(--cg-text-4); }

/* ============================================================
   INTERNAL LINKS CLUSTER BOX
   ============================================================ */
.cg-cluster-links { background:rgba(30,27,75,.35);border:1px solid rgba(124,58,237,.18);border-radius:var(--radius-lg);padding:24px;margin-top:48px; }
.cg-cluster-links h3 { font-family:var(--font-display);font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--cg-text-4);margin-bottom:16px; }
.cg-cluster-links ul { list-style:none;display:flex;flex-direction:column;gap:8px; }
.cg-cluster-links ul li a { font-size:.87rem;color:#A5B4FC;transition:color .2s; }
.cg-cluster-links ul li a:hover { color:var(--cg-teal); }
.cg-cluster-links ul li span { font-size:.8rem;color:var(--cg-text-4); }
@media (min-width:640px) {
  .cg-cluster-links ul { display:grid;grid-template-columns:repeat(2,1fr);gap:10px 20px; }
}

/* ============================================================
   FOOTER
   ============================================================ */
.cg-footer { border-top:1px solid rgba(124,58,237,.12);padding:48px 20px 32px; }
@media (min-width:768px) { .cg-footer { padding: 64px 40px 40px; } }
.cg-footer-inner { max-width:1140px;margin:0 auto; }
.cg-footer-top { display:grid;grid-template-columns:1fr;gap:32px;margin-bottom:40px; }
@media (min-width:540px) { .cg-footer-top { grid-template-columns:repeat(2,1fr); } }
@media (min-width:900px) { .cg-footer-top { grid-template-columns:2fr repeat(4,1fr);gap:40px; } }

.cg-footer-brand p { font-size:.83rem;color:var(--cg-text-4);line-height:1.7;margin-top:12px;max-width:280px; }
.cg-footer-col h4 { font-family:var(--font-display);font-weight:700;font-size:.83rem;color:#F0EEFF;margin-bottom:14px;letter-spacing:.02em; }
.cg-footer-col ul { list-style:none;display:flex;flex-direction:column;gap:8px; }
.cg-footer-col ul li a { font-size:.81rem;color:var(--cg-text-4);transition:color .2s; }
.cg-footer-col ul li a:hover { color:#A5B4FC; }
.cg-footer-bottom { display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-top:24px;border-top:1px solid rgba(124,58,237,.1); }
.cg-footer-bottom p { font-size:.76rem;color:#333355; }
.cg-footer-bottom ul { list-style:none;display:flex;gap:16px;flex-wrap:wrap; }
.cg-footer-bottom ul li a { font-size:.76rem;color:#333355;transition:color .2s; }
.cg-footer-bottom ul li a:hover { color:#A5B4FC; }

/* ============================================================
   SCROLL REVEAL
   ============================================================ */
.cg-reveal { opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease; }
.cg-reveal.visible { opacity:1;transform:translateY(0); }

/* ============================================================
   BLOG POST CONTENT
   ============================================================ */
.cg-post-content { color:var(--cg-text-3);font-size:clamp(.9rem,2vw,.97rem);line-height:1.8; }
.cg-post-content h2 { font-family:var(--font-display);font-size:clamp(1.3rem,3vw,1.6rem);font-weight:800;color:#F0EEFF;letter-spacing:-.02em;margin:40px 0 14px;line-height:1.15; }
.cg-post-content h3 { font-family:var(--font-display);font-size:clamp(1.1rem,2.5vw,1.2rem);font-weight:700;color:#E8E6F0;margin:32px 0 10px; }
.cg-post-content h4 { font-family:var(--font-display);font-size:1rem;font-weight:700;color:#C4B5FD;margin:24px 0 8px; }
.cg-post-content p { margin-bottom:18px; }
.cg-post-content a { color:var(--cg-teal);text-decoration:underline;text-decoration-color:rgba(6,182,212,.3); }
.cg-post-content a:hover { color:var(--cg-purple-l); }
.cg-post-content ul,.cg-post-content ol { margin:0 0 18px;padding-left:22px;display:flex;flex-direction:column;gap:7px; }
.cg-post-content li { line-height:1.65; }
.cg-post-content ul li::marker { color:var(--cg-teal); }
.cg-post-content ol li::marker { color:var(--cg-purple-l);font-weight:700; }
.cg-post-content strong { color:#E8E6F0;font-weight:600; }
.cg-post-content em { color:#C4B5FD; }
.cg-post-content blockquote { border-left:3px solid var(--cg-purple);margin:24px 0;padding:14px 20px;background:rgba(124,58,237,.08);border-radius:0 8px 8px 0;font-style:italic;color:#A5B4FC; }
.cg-post-content code { background:rgba(124,58,237,.15);border:1px solid rgba(124,58,237,.2);border-radius:4px;padding:2px 6px;font-size:.87em;color:#C4B5FD; }
.cg-post-content pre { background:rgba(8,7,26,.8);border:1px solid rgba(124,58,237,.2);border-radius:10px;padding:18px;overflow-x:auto;margin:20px 0; }
.cg-post-content pre code { background:none;border:none;padding:0;font-size:.87rem;color:#A5B4FC; }
.cg-post-content img { border-radius:10px;margin:20px 0;border:1px solid rgba(124,58,237,.15); }
.cg-post-content table { width:100%;border-collapse:collapse;margin:20px 0;font-size:.86rem;overflow-x:auto;display:block; }
.cg-post-content table th { padding:10px 14px;text-align:left;color:#F0EEFF;font-weight:600;border-bottom:2px solid rgba(124,58,237,.3); }
.cg-post-content table td { padding:10px 14px;border-bottom:1px solid rgba(124,58,237,.1);color:var(--cg-text-3); }
.cg-post-content hr { border:none;border-top:1px solid rgba(124,58,237,.2);margin:36px 0; }

/* ============================================================
   PAGINATION
   ============================================================ */
.page-numbers { list-style:none;display:flex;gap:8px;margin:0;padding:0;flex-wrap:wrap;justify-content:center; }
.page-numbers li a, .page-numbers li span { display:flex;align-items:center;justify-content:center;min-width:44px;height:44px;padding:0 12px;border-radius:8px;font-family:var(--font-body);font-size:.85rem;background:rgba(30,27,75,.4);border:1px solid rgba(124,58,237,.2);color:#A5B4FC;text-decoration:none;transition:all .2s; }
.page-numbers li a:hover { background:rgba(124,58,237,.2);border-color:var(--cg-purple);color:#fff; }
.page-numbers li .current { background:var(--cg-purple);border-color:var(--cg-purple);color:#fff; }

/* ============================================================
   UTILITY
   ============================================================ */
.cg-text-center { text-align: center; }
.cg-mt-sm { margin-top: 16px; }
.cg-mt-md { margin-top: 32px; }
.cg-mt-lg { margin-top: 48px; }

/* Two-col responsive grid for inner pages */
.cg-two-col-grid { grid-template-columns: 1fr; }
@media (min-width: 700px) { .cg-two-col-grid { grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; } }