/* ============================================================
   JEET CITY APP DOWNLOAD — style.css
   PREFIX: j7d  |  Theme: dark  |  Domain: jeetcityappdownload.com
   ============================================================ */

/* === 1. GOOGLE FONTS ========================================== */
@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@400;500;600;700&family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;1,400&display=swap');

/* === 2. RESET ================================================= */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
img,video,svg{display:block;max-width:100%}
button{cursor:pointer;font:inherit;border:none;background:none}
input,select,textarea{font:inherit}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
table{border-collapse:collapse;width:100%}

/* === 3. CSS VARIABLES ========================================= */
:root{
  /* — 7 core colour tokens — */
  --bg-base:     #0a0f1a;
  --bg-card:     #111827;
  --accent:      #3b6ef5;
  --highlight:   #fbbf24;
  --text:        #e8edf4;
  --muted:       #6b7e93;
  --border:      #1e2a3a;

  /* — derived from tokens only, no hardcoded hex outside :root — */
  --accent-hover:    color-mix(in srgb,var(--accent) 80%,#fff);
  --accent-dim:      color-mix(in srgb,var(--accent) 14%,transparent);
  --highlight-dim:   color-mix(in srgb,var(--highlight) 14%,transparent);
  --card-hover:      color-mix(in srgb,var(--bg-card) 85%,var(--accent));
  --shadow-accent:   0 4px 24px color-mix(in srgb,var(--accent) 30%,transparent);
  --shadow-sm:       0 1px 4px rgba(0,0,0,.35);
  --shadow-md:       0 4px 20px rgba(0,0,0,.45);
  --shadow-lg:       0 8px 40px rgba(0,0,0,.55);

  /* — typography — */
  --ff-display: 'Rajdhani', sans-serif;
  --ff-body:    'Plus Jakarta Sans', sans-serif;
  --fs-xs:  0.75rem;
  --fs-sm:  0.875rem;
  --fs-md:  1rem;
  --fs-lg:  1.125rem;
  --fs-xl:  1.25rem;
  --fs-2xl: 1.5rem;
  --fs-3xl: 2rem;
  --fs-4xl: 2.5rem;

  /* — spacing — */
  --sp-xs: 0.5rem;
  --sp-sm: 0.75rem;
  --sp-md: 1rem;
  --sp-lg: 1.5rem;
  --sp-xl: 2rem;
  --sp-2xl:3rem;
  --sp-3xl:4rem;
  --sp-4xl:6rem;

  /* — radius — */
  --r-sm:   6px;
  --r-md:   12px;
  --r-lg:   20px;
  --r-full: 9999px;

  /* — transitions — */
  --tr-fast: .15s ease;
  --tr-base: .25s ease;
  --tr-slow: .4s ease;
}

/* === 4. HTML / BODY + SCROLLBAR =============================== */
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--ff-body);
  font-size:var(--fs-md);
  line-height:1.72;
  color:var(--text);
  background:var(--bg-base);
  min-height:100vh;
  overflow-x:hidden;
}
::-webkit-scrollbar{width:7px;height:7px}
::-webkit-scrollbar-track{background:var(--bg-base)}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--r-full)}
::-webkit-scrollbar-thumb:hover{background:var(--accent)}

/* === 5. TYPOGRAPHY ============================================ */
h1,h2,h3,h4{
  font-family:var(--ff-display);
  font-weight:700;
  line-height:1.14;
  color:var(--text);
}
h1{font-size:clamp(1.9rem,4.2vw,3.2rem);letter-spacing:-.025em}
h2{font-size:clamp(1.45rem,3vw,2.1rem);letter-spacing:-.015em}
h3{font-size:clamp(1.1rem,2.4vw,1.55rem)}
h4{font-size:clamp(1rem,2vw,1.2rem)}
p{margin-bottom:var(--sp-md);color:var(--text)}
p:last-child{margin-bottom:0}
strong{font-weight:600;color:var(--text)}
a{color:var(--accent);transition:color var(--tr-fast)}
a:hover{color:var(--accent-hover)}
.j7d_text--highlight{color:var(--highlight)}
.j7d_text--muted{color:var(--muted)}
.j7d_text--accent{color:var(--accent)}

/* === 6. CONTAINER ============================================= */
.container{
  max-width:1200px;
  margin:0 auto;
  padding:0 var(--sp-xl);
}

/* === 7. BUTTONS =============================================== */
.j7d_btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.45rem;
  font-family:var(--ff-display);
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  border-radius:var(--r-md);
  border:2px solid transparent;
  transition:all var(--tr-base);
  white-space:nowrap;
  cursor:pointer;
  text-decoration:none;
  line-height:1;
}
/* sizes */
.j7d_btn--sm  {padding:.4rem 1rem;font-size:var(--fs-sm)}
.j7d_btn--md  {padding:.65rem 1.4rem;font-size:var(--fs-md)}
.j7d_btn--lg  {padding:.9rem 2rem;font-size:var(--fs-lg)}
.j7d_btn--full{width:100%;padding:.9rem 1.4rem;font-size:var(--fs-md)}
/* variants */
.j7d_btn--primary{
  background:var(--accent);color:#fff;border-color:var(--accent);
  box-shadow:var(--shadow-accent);
}
.j7d_btn--primary:hover{
  background:var(--accent-hover);border-color:var(--accent-hover);
  transform:translateY(-2px);
  box-shadow:0 6px 32px color-mix(in srgb,var(--accent) 50%,transparent);
}
.j7d_btn--highlight{
  background:var(--highlight);
  color:var(--bg-base);
  border-color:var(--highlight);
}
.j7d_btn--highlight:hover{
  background:color-mix(in srgb,var(--highlight) 85%,#fff);
  transform:translateY(-2px);
  box-shadow:0 6px 28px color-mix(in srgb,var(--highlight) 38%,transparent);
}
.j7d_btn--outline{
  background:transparent;color:var(--accent);border-color:var(--accent);
}
.j7d_btn--outline:hover{background:var(--accent);color:#fff;transform:translateY(-2px)}
.j7d_btn--ghost{
  background:transparent;color:var(--muted);border-color:var(--border);
}
.j7d_btn--ghost:hover{color:var(--text);border-color:var(--muted)}

/* === 8. NAVIGATION ============================================ */
.j7d_nav{
  position:sticky;top:0;z-index:200;
  background:color-mix(in srgb,var(--bg-base) 92%,transparent);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border);
}
.j7d_nav-inner{
  display:flex;align-items:center;justify-content:space-between;
  padding:.9rem var(--sp-xl);max-width:1200px;margin:0 auto;gap:var(--sp-lg);
}
.j7d_logo{
  font-family:var(--ff-display);font-size:var(--fs-xl);font-weight:700;
  color:var(--text);letter-spacing:.02em;display:flex;align-items:center;
  gap:.35rem;flex-shrink:0;
}
.j7d_logo em{color:var(--accent);font-style:normal}
.j7d_nav-links{display:flex;align-items:center;gap:var(--sp-lg);flex:1}
.j7d_nav-link{
  font-family:var(--ff-display);font-size:var(--fs-md);font-weight:500;
  color:var(--muted);transition:color var(--tr-fast);letter-spacing:.02em;white-space:nowrap;
}
.j7d_nav-link:hover,.j7d_nav-link.active{color:var(--text)}
.j7d_nav-cta{margin-left:auto;flex-shrink:0}
/* hamburger */
#j7d-nav-toggle{
  display:none;flex-direction:column;gap:5px;padding:7px;
  border-radius:var(--r-sm);background:var(--bg-card);
}
#j7d-nav-toggle span{
  display:block;width:22px;height:2px;background:var(--text);
  border-radius:2px;transition:all var(--tr-base);
}
/* mobile nav */
#j7d-mobile-nav{
  position:fixed;inset:0;z-index:190;
  background:var(--bg-base);
  padding:var(--sp-4xl) var(--sp-xl) var(--sp-xl);
  overflow-y:auto;
  transform:translateX(100%);
  transition:transform var(--tr-slow);
  pointer-events:none;
}
#j7d-mobile-nav.open{transform:translateX(0);pointer-events:all}
.j7d_mobile-links{display:flex;flex-direction:column;gap:var(--sp-md)}
.j7d_mobile-link{
  font-family:var(--ff-display);font-size:var(--fs-2xl);font-weight:600;
  color:var(--text);border-bottom:1px solid var(--border);
  padding-bottom:var(--sp-md);display:block;
}
.j7d_mobile-cta{margin-top:var(--sp-xl)}

/* === 10. HERO — Layout A: Split Grid ========================= */
.j7d_hero{
  padding:var(--sp-4xl) 0 var(--sp-3xl);
  position:relative;overflow:hidden;
}
.j7d_hero::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse at 28% 55%,color-mix(in srgb,var(--accent) 12%,transparent) 0%,transparent 58%),
    radial-gradient(ellipse at 78% 18%,color-mix(in srgb,var(--highlight) 6%,transparent) 0%,transparent 48%);
  pointer-events:none;
}
.j7d_hero-inner{
  display:grid;grid-template-columns:1fr 410px;
  gap:var(--sp-3xl);align-items:center;
  max-width:1200px;margin:0 auto;padding:0 var(--sp-xl);
  position:relative;
}
.j7d_hero-tag{
  display:inline-flex;align-items:center;gap:.4rem;
  background:var(--accent-dim);
  color:var(--accent);
  border:1px solid color-mix(in srgb,var(--accent) 28%,transparent);
  border-radius:var(--r-full);
  padding:.3rem .9rem;
  font-family:var(--ff-display);font-size:var(--fs-sm);font-weight:600;
  letter-spacing:.07em;text-transform:uppercase;
  margin-bottom:var(--sp-md);display:inline-flex;
}
.j7d_hero-sub{
  font-size:var(--fs-lg);color:var(--muted);
  margin-bottom:var(--sp-xl);max-width:540px;line-height:1.62;
}
.j7d_hero-ctas{display:flex;gap:var(--sp-md);flex-wrap:wrap;margin-bottom:var(--sp-xl)}
.j7d_hero-trust{display:flex;gap:var(--sp-lg);flex-wrap:wrap}
.j7d_hero-trust-item{
  display:flex;align-items:center;gap:.4rem;
  font-size:var(--fs-sm);color:var(--muted);
}
.j7d_hero-trust-item::before{content:'✓';color:var(--accent);font-weight:700}
/* download widget */
.j7d_widget{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--r-lg);
  padding:var(--sp-xl);
  box-shadow:var(--shadow-lg);
  position:relative;overflow:hidden;
}
.j7d_widget::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--accent),var(--highlight));
}
.j7d_widget-title{
  font-family:var(--ff-display);font-size:var(--fs-xl);font-weight:700;
  margin-bottom:var(--sp-md);text-align:center;
}
.j7d_widget-bonus{
  background:var(--highlight-dim);
  border:1px solid color-mix(in srgb,var(--highlight) 24%,transparent);
  border-radius:var(--r-md);
  padding:var(--sp-md);margin-bottom:var(--sp-lg);text-align:center;
}
.j7d_widget-amount{
  font-family:var(--ff-display);font-size:2.8rem;font-weight:700;
  color:var(--highlight);line-height:1;display:block;
}
.j7d_widget-bonus-label{font-size:var(--fs-sm);color:var(--muted);margin-top:.3rem;display:block}
.j7d_widget-features{display:flex;flex-direction:column;gap:.45rem;margin-bottom:var(--sp-lg)}
.j7d_widget-feature{display:flex;align-items:center;gap:.5rem;font-size:var(--fs-sm);color:var(--muted)}
.j7d_widget-feature::before{content:'✓';color:var(--accent);font-weight:700;flex-shrink:0}
.j7d_widget-note{font-size:.68rem;color:var(--muted);text-align:center;margin-top:var(--sp-sm);line-height:1.4}
.j7d_widget-divider{border:none;border-top:1px solid var(--border);margin:var(--sp-md) 0}
.j7d_widget-platform{display:flex;flex-direction:column;gap:var(--sp-sm)}

/* === 11. TRUST BAR =========================================== */
.j7d_trust-bar{
  background:var(--bg-card);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  padding:var(--sp-md) 0;
}
.j7d_trust-bar-inner{
  display:flex;align-items:center;justify-content:center;
  flex-wrap:wrap;gap:var(--sp-xl);
  max-width:1200px;margin:0 auto;padding:0 var(--sp-xl);
}
.j7d_trust-item{
  display:flex;align-items:center;gap:.45rem;
  font-size:var(--fs-sm);color:var(--muted);white-space:nowrap;
}
.j7d_trust-item strong{color:var(--text)}
.j7d_trust-icon{
  width:18px;height:18px;flex-shrink:0;
  fill:none;stroke:var(--accent);stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;
}

/* === 12. CONTENT SECTIONS ==================================== */
.j7d_section{padding:var(--sp-3xl) 0}
.j7d_section--alt{
  background:var(--bg-card);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.j7d_section-header{margin-bottom:var(--sp-2xl)}
.j7d_section-tag{
  display:inline-block;
  background:var(--accent-dim);color:var(--accent);
  border-radius:var(--r-full);
  padding:.2rem .75rem;
  font-family:var(--ff-display);font-size:var(--fs-xs);font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;
  margin-bottom:var(--sp-sm);
}
.j7d_section-sub{color:var(--muted);font-size:var(--fs-lg);max-width:620px;margin-top:.5rem}

/* cards */
.j7d_cards-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(255px,1fr));
  gap:var(--sp-lg);
}
.j7d_card{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:var(--sp-xl);
  transition:border-color var(--tr-base),transform var(--tr-base);
}
.j7d_card:hover{border-color:var(--accent);transform:translateY(-3px)}
.j7d_card-icon{
  font-size:1.9rem;margin-bottom:var(--sp-md);display:block;
}
.j7d_card-title{
  font-family:var(--ff-display);font-size:var(--fs-lg);font-weight:600;
  margin-bottom:var(--sp-xs);
}
.j7d_card-text{font-size:var(--fs-sm);color:var(--muted);margin:0}

/* platform cards */
.j7d_platform-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-xl);margin:var(--sp-lg) 0}
.j7d_platform-card{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--r-lg);
  padding:var(--sp-xl);
  text-align:center;
  transition:border-color var(--tr-base),box-shadow var(--tr-base);
  position:relative;overflow:hidden;
}
.j7d_platform-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:var(--accent);transform:scaleX(0);transform-origin:left;
  transition:transform var(--tr-base);
}
.j7d_platform-card:hover::before{transform:scaleX(1)}
.j7d_platform-card:hover{border-color:var(--accent);box-shadow:var(--shadow-accent)}
.j7d_platform-icon{font-size:2.8rem;margin-bottom:var(--sp-md);display:block}
.j7d_platform-title{
  font-family:var(--ff-display);font-size:var(--fs-2xl);font-weight:700;margin-bottom:.3rem;
}
.j7d_platform-sub{font-size:var(--fs-sm);color:var(--muted);margin-bottom:var(--sp-lg)}
.j7d_platform-specs{display:flex;flex-direction:column;gap:.4rem;margin-bottom:var(--sp-lg);text-align:left}
.j7d_platform-spec{
  display:flex;justify-content:space-between;
  font-size:var(--fs-sm);padding:.3rem 0;
  border-bottom:1px solid var(--border);
}
.j7d_platform-spec:last-child{border-bottom:none}
.j7d_platform-spec-label{color:var(--muted)}
.j7d_platform-spec-value{font-weight:600}

/* steps */
.j7d_steps{display:flex;flex-direction:column;gap:var(--sp-md)}
.j7d_step{
  display:flex;gap:var(--sp-lg);align-items:flex-start;
  padding:var(--sp-lg);
  background:var(--bg-card);border:1px solid var(--border);
  border-radius:var(--r-md);
  transition:border-color var(--tr-base);
}
.j7d_step:hover{border-color:var(--accent)}
.j7d_step-num{
  width:40px;height:40px;background:var(--accent);
  border-radius:var(--r-full);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--ff-display);font-size:var(--fs-lg);font-weight:700;
  color:#fff;flex-shrink:0;
}
.j7d_step-content{}
.j7d_step-title{font-family:var(--ff-display);font-size:var(--fs-lg);font-weight:600;margin-bottom:.35rem}
.j7d_step-text{font-size:var(--fs-sm);color:var(--muted);margin:0}

/* tables */
.j7d_table-wrap{
  overflow-x:auto;border-radius:var(--r-md);
  border:1px solid var(--border);margin:var(--sp-lg) 0;
}
.j7d_table{min-width:480px}
.j7d_table thead{background:color-mix(in srgb,var(--bg-card) 70%,var(--bg-base))}
.j7d_table th{
  padding:var(--sp-sm) var(--sp-md);text-align:left;
  font-family:var(--ff-display);font-size:var(--fs-sm);font-weight:600;
  color:var(--muted);text-transform:uppercase;letter-spacing:.05em;
  border-bottom:1px solid var(--border);
}
.j7d_table td{
  padding:var(--sp-sm) var(--sp-md);font-size:var(--fs-sm);
  color:var(--text);border-bottom:1px solid var(--border);
}
.j7d_table tr:last-child td{border-bottom:none}
.j7d_table tr:hover td{background:color-mix(in srgb,var(--border) 20%,transparent)}
.j7d_table .ok{color:#22c55e;font-weight:600}
.j7d_table .no{color:#ef4444}

/* highlight / warning boxes */
.j7d_highlight-box{
  background:var(--accent-dim);
  border:1px solid color-mix(in srgb,var(--accent) 26%,transparent);
  border-left:4px solid var(--accent);
  border-radius:var(--r-md);
  padding:var(--sp-lg);margin:var(--sp-lg) 0;
}
.j7d_highlight-box p{margin:0;font-size:var(--fs-sm)}
.j7d_warning-box{
  background:color-mix(in srgb,var(--highlight) 10%,transparent);
  border:1px solid color-mix(in srgb,var(--highlight) 28%,transparent);
  border-left:4px solid var(--highlight);
  border-radius:var(--r-md);
  padding:var(--sp-lg);margin:var(--sp-lg) 0;
}
.j7d_warning-box p{margin:0;font-size:var(--fs-sm)}

/* badge */
.j7d_badge{
  display:inline-flex;align-items:center;
  padding:.18rem .55rem;border-radius:var(--r-full);
  font-size:var(--fs-xs);font-weight:600;
  font-family:var(--ff-display);letter-spacing:.05em;text-transform:uppercase;
}
.j7d_badge--accent  {background:var(--accent-dim);color:var(--accent)}
.j7d_badge--hl      {background:var(--highlight-dim);color:var(--highlight)}
.j7d_badge--green   {background:rgba(34,197,94,.14);color:#22c55e}
.j7d_badge--red     {background:rgba(239,68,68,.14);color:#ef4444}

/* 2-col layout */
.j7d_2col{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2xl);align-items:start}
.j7d_2col--60-40{display:grid;grid-template-columns:1.4fr 1fr;gap:var(--sp-2xl);align-items:start}

/* checklist */
.j7d_checklist{display:flex;flex-direction:column;gap:.55rem;margin:var(--sp-md) 0}
.j7d_checklist-item{display:flex;align-items:flex-start;gap:.7rem;font-size:var(--fs-sm);color:var(--muted)}
.j7d_checklist-item::before{content:'✓';color:var(--accent);font-weight:700;flex-shrink:0;margin-top:.05rem}
.j7d_checklist--warn .j7d_checklist-item::before{content:'!';color:var(--highlight)}

/* compatibility grid */
.j7d_compat-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(175px,1fr));
  gap:var(--sp-md);margin:var(--sp-lg) 0;
}
.j7d_compat-item{
  padding:var(--sp-md);background:var(--bg-card);
  border:1px solid var(--border);border-radius:var(--r-md);text-align:center;
}
.j7d_compat-os{font-family:var(--ff-display);font-size:var(--fs-md);font-weight:600;margin-bottom:.25rem}
.j7d_compat-ver{font-size:var(--fs-xs);color:var(--muted)}

/* author card */
.j7d_author-card{
  display:flex;align-items:flex-start;gap:var(--sp-lg);
  padding:var(--sp-xl);background:var(--bg-card);
  border:1px solid var(--border);border-radius:var(--r-md);
  margin:var(--sp-xl) 0;
}
.j7d_author-avatar{
  width:64px;height:64px;border-radius:var(--r-full);
  background:var(--accent);display:flex;align-items:center;justify-content:center;
  font-family:var(--ff-display);font-size:var(--fs-xl);font-weight:700;
  color:#fff;flex-shrink:0;
}
.j7d_author-name{font-family:var(--ff-display);font-size:var(--fs-lg);font-weight:700}
.j7d_author-role{font-size:var(--fs-sm);color:var(--muted);margin:.2rem 0 .5rem}
.j7d_author-bio{font-size:var(--fs-sm);color:var(--muted);margin:0}

/* RG disclaimer */
.j7d_rg-disclaimer{
  padding:var(--sp-lg) var(--sp-xl);
  background:color-mix(in srgb,var(--border) 35%,var(--bg-base));
  border:1px solid var(--border);border-radius:var(--r-md);
  font-size:var(--fs-xs);color:var(--muted);line-height:1.65;
  margin:var(--sp-xl) 0;
}

/* === 13. FAQ ================================================== */
.j7d_faq{display:flex;flex-direction:column;gap:var(--sp-xs)}
.j7d_faq-item{
  background:var(--bg-card);border:1px solid var(--border);
  border-radius:var(--r-md);overflow:hidden;
  transition:border-color var(--tr-fast);
}
.j7d_faq-item.open{border-color:var(--accent)}
.j7d_faq-btn{
  width:100%;display:flex;align-items:center;justify-content:space-between;
  gap:var(--sp-md);padding:var(--sp-lg);
  font-family:var(--ff-display);font-size:var(--fs-md);font-weight:600;
  color:var(--text);text-align:left;transition:color var(--tr-fast);
}
.j7d_faq-btn:hover{color:var(--accent)}
.j7d_faq-icon{
  width:20px;height:20px;flex-shrink:0;position:relative;
}
.j7d_faq-icon::before,.j7d_faq-icon::after{
  content:'';position:absolute;background:var(--muted);
  border-radius:2px;transition:all var(--tr-base);
}
.j7d_faq-icon::before{width:12px;height:2px;top:50%;left:50%;transform:translate(-50%,-50%)}
.j7d_faq-icon::after {width:2px;height:12px;top:50%;left:50%;transform:translate(-50%,-50%)}
.j7d_faq-item.open .j7d_faq-icon::after{transform:translate(-50%,-50%) rotate(90deg);opacity:0}
.j7d_faq-item.open .j7d_faq-icon::before{background:var(--accent)}
.j7d_faq-answer{
  display:none;padding:0 var(--sp-lg) var(--sp-lg);
  font-size:var(--fs-sm);color:var(--muted);line-height:1.72;
}
.j7d_faq-item.open .j7d_faq-answer{display:block}

/* === 14. CTA BAND ============================================= */
.j7d_cta-band{
  padding:var(--sp-3xl) 0;
  background:linear-gradient(135deg,
    color-mix(in srgb,var(--accent) 14%,var(--bg-base)),
    color-mix(in srgb,var(--highlight) 7%,var(--bg-base)));
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  text-align:center;
}
.j7d_cta-band-title{font-size:clamp(1.55rem,3vw,2.3rem);margin-bottom:.5rem}
.j7d_cta-band-sub{color:var(--muted);margin-bottom:var(--sp-xl);font-size:var(--fs-lg)}
.j7d_cta-band-btns{display:flex;gap:var(--sp-md);justify-content:center;flex-wrap:wrap}

/* === 15. FOOTER =============================================== */
.j7d_footer{
  background:var(--bg-card);
  border-top:1px solid var(--border);
  padding:var(--sp-3xl) 0 var(--sp-xl);
}
.j7d_footer-inner{max-width:1200px;margin:0 auto;padding:0 var(--sp-xl)}
.j7d_footer-top{
  display:grid;grid-template-columns:1.6fr 1fr 1fr;
  gap:var(--sp-2xl);margin-bottom:var(--sp-2xl);
}
.j7d_footer-logo{
  font-family:var(--ff-display);font-size:var(--fs-xl);font-weight:700;
  margin-bottom:var(--sp-md);
}
.j7d_footer-logo em{color:var(--accent);font-style:normal}
.j7d_footer-desc{font-size:var(--fs-sm);color:var(--muted);line-height:1.65;margin-bottom:var(--sp-lg)}
.j7d_footer-col-title{
  font-family:var(--ff-display);font-size:var(--fs-md);font-weight:600;
  margin-bottom:var(--sp-md);color:var(--text);
}
.j7d_footer-links{display:flex;flex-direction:column;gap:.45rem}
.j7d_footer-link{font-size:var(--fs-sm);color:var(--muted);transition:color var(--tr-fast)}
.j7d_footer-link:hover{color:var(--text)}
.j7d_footer-bottom{border-top:1px solid var(--border);padding-top:var(--sp-xl)}
.j7d_footer-disclaimer{font-size:var(--fs-xs);color:var(--muted);line-height:1.65;margin-bottom:var(--sp-md)}
.j7d_footer-meta{
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:var(--sp-md);font-size:var(--fs-xs);color:var(--muted);
}
.j7d_footer-rg{display:flex;gap:var(--sp-md);flex-wrap:wrap}

/* === 16. STICKY MOBILE CTA ==================================== */
.j7d_sticky-cta{
  display:none;position:fixed;bottom:0;left:0;right:0;z-index:50;
  background:var(--bg-card);border-top:1px solid var(--border);
  padding:var(--sp-sm) var(--sp-md);
  box-shadow:0 -4px 20px rgba(0,0,0,.45);
}
.j7d_sticky-cta-inner{display:flex;gap:var(--sp-sm);align-items:center}
.j7d_sticky-cta-text{flex:1;font-size:var(--fs-xs);color:var(--muted);line-height:1.35}
.j7d_sticky-cta-text strong{color:var(--text);display:block;font-size:var(--fs-sm)}

/* === STANDARD PAGE STYLES ==================================== */
.j7d_page-hero{
  padding:var(--sp-3xl) 0 var(--sp-2xl);
  background:linear-gradient(to bottom,color-mix(in srgb,var(--accent) 6%,var(--bg-base)),var(--bg-base));
}
.j7d_breadcrumb{
  display:flex;align-items:center;gap:.45rem;
  font-size:var(--fs-sm);color:var(--muted);margin-bottom:var(--sp-lg);flex-wrap:wrap;
}
.j7d_breadcrumb a{color:var(--muted);transition:color var(--tr-fast)}
.j7d_breadcrumb a:hover{color:var(--accent)}
.j7d_breadcrumb-sep{color:var(--border)}
.j7d_prose h2{margin:var(--sp-2xl) 0 var(--sp-md)}
.j7d_prose h3{margin:var(--sp-xl) 0 var(--sp-sm)}
.j7d_prose p{color:var(--muted)}
.j7d_prose ul{display:flex;flex-direction:column;gap:.4rem;margin:var(--sp-md) 0 var(--sp-lg) var(--sp-md)}
.j7d_prose ul li{font-size:var(--fs-sm);color:var(--muted);position:relative;padding-left:1.1rem}
.j7d_prose ul li::before{content:'—';position:absolute;left:0;color:var(--accent)}
.j7d_prose ol{display:flex;flex-direction:column;gap:.4rem;margin:var(--sp-md) 0 var(--sp-lg);counter-reset:j7d-ol}
.j7d_prose ol li{counter-increment:j7d-ol;font-size:var(--fs-sm);color:var(--muted);padding-left:1.75rem;position:relative}
.j7d_prose ol li::before{content:counter(j7d-ol)'.';position:absolute;left:0;color:var(--accent);font-weight:600}
.j7d_max-prose{max-width:800px}

/* helplines */
.j7d_helpline-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));
  gap:var(--sp-md);margin:var(--sp-lg) 0;
}
.j7d_helpline-card{
  background:var(--bg-card);border:1px solid var(--border);
  border-radius:var(--r-md);padding:var(--sp-lg);
}
.j7d_helpline-name{font-family:var(--ff-display);font-weight:600;margin-bottom:.3rem}
.j7d_helpline-num{
  font-family:var(--ff-display);font-size:var(--fs-xl);font-weight:700;
  color:var(--accent);display:block;margin-bottom:.3rem;
}
.j7d_helpline-url{font-size:var(--fs-xs);color:var(--muted)}

/* self-assess */
.j7d_assess-list{display:flex;flex-direction:column;gap:.7rem;margin:var(--sp-lg) 0}
.j7d_assess-item{
  display:flex;align-items:flex-start;gap:var(--sp-md);
  padding:var(--sp-md) var(--sp-lg);
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-md);
  font-size:var(--fs-sm);color:var(--muted);
}
.j7d_assess-q{font-weight:500;color:var(--text)}

/* === 17. ANIMATIONS =========================================== */
@keyframes j7d-fadein{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes j7d-slidein{from{opacity:0;transform:translateX(-22px)}to{opacity:1;transform:translateX(0)}}
@keyframes j7d-pulse{
  0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 40%,transparent)}
  50%{box-shadow:0 0 0 8px transparent}
}
.j7d_animate{opacity:0;transform:translateY(22px);transition:opacity .5s ease,transform .5s ease}
.j7d_visible{opacity:1!important;transform:translateY(0)!important}
.j7d_hero-content{animation:j7d-fadein .7s ease both}
.j7d_widget{animation:j7d-fadein .7s .15s ease both}

/* === 18. RESPONSIVE =========================================== */
@media(max-width:1024px){
  .j7d_hero-inner{grid-template-columns:1fr 360px;gap:var(--sp-2xl)}
  .j7d_footer-top{grid-template-columns:1fr 1fr}
  .j7d_footer-top>:first-child{grid-column:1/-1}
}
@media(max-width:768px){
  .j7d_nav-links,.j7d_nav-cta{display:none}
  #j7d-nav-toggle{display:flex}
  .j7d_hero-inner{grid-template-columns:1fr}
  .j7d_widget{order:-1}
  .j7d_2col,.j7d_2col--60-40{grid-template-columns:1fr}
  .j7d_platform-grid{grid-template-columns:1fr}
  .j7d_cards-grid{grid-template-columns:1fr 1fr}
  .j7d_footer-top{grid-template-columns:1fr}
  .j7d_footer-meta{flex-direction:column;align-items:flex-start}
  .j7d_trust-bar-inner{gap:var(--sp-md)}
  .j7d_hero-ctas{flex-direction:column}
  .j7d_cta-band-btns{flex-direction:column;align-items:center}
  .j7d_sticky-cta{display:block}
  body{padding-bottom:80px}
}
@media(max-width:480px){
  .j7d_cards-grid{grid-template-columns:1fr}
  .j7d_nav-inner{padding:.7rem var(--sp-md)}
  .j7d_section{padding:var(--sp-2xl) 0}
  .j7d_widget-amount{font-size:2.2rem}
  .j7d_helpline-grid{grid-template-columns:1fr}
  .j7d_compat-grid{grid-template-columns:1fr 1fr}
}