/* =========================================================
   JUPITER SCIENCE HOMEPAGE  (v2 - brand-aligned)
   Uses the global --jps-* tokens already defined by the site
   header (:root). Fallbacks keep it safe if the header is absent.
   Page-only CSS: hero, subject cards, topic cloud, mentor block.
   Plugin sections are styled by the zbl2 profile "jupiter_embed".
========================================================= */

.jsci-home{
  --c-blue:var(--jps-blue,#002CD0);
  --c-blue-dark:var(--jps-blue-dark,#00219E);
  --c-violet:var(--jps-violet,#8A2BEF);
  --c-pink:var(--jps-pink,#FF3D7F);
  --c-yellow:var(--jps-yellow,#FFD23F);
  --c-sky:var(--jps-sky,#28C7FF);
  --c-deep:var(--jps-deep,#101B4D);
  --c-border:var(--jps-border,#E8ECFF);
  --c-soft:var(--jps-soft,#F3F6FF);
  --c-muted:#5A6684;
  --c-pink-ink:#C4155A;
  --c-amber-ink:#8A5A00;
  --f-head:Sora,Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --f-body:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;

  font-family:var(--f-body);
  color:var(--c-deep);
  background:linear-gradient(180deg,#fff 0%,#FFF8FE 40%,#F6F8FF 100%);
  overflow-x:clip;
}
.jsci-home *,.jsci-home *::before,.jsci-home *::after{box-sizing:border-box}
.jsci-home h1,.jsci-home h2,.jsci-home h3{font-family:var(--f-head);color:var(--c-deep)}

/* ---------- Layout ---------- */
.jsci-hero-inner,.jsci-section,.jsci-mentor-inner{max-width:1180px;margin:0 auto}
.jsci-section{padding:72px 20px}
.jsci-section-soft{max-width:none;background:var(--c-soft)}
.jsci-concept-zone{max-width:none}
.jsci-section-head{max-width:780px;margin:0 auto 36px;text-align:center}
.jsci-section-head h2{margin:0 0 12px;font-size:clamp(28px,3.6vw,44px);line-height:1.08;font-weight:800;letter-spacing:-.035em}
.jsci-section-head p{margin:0 auto;color:var(--c-muted);font-size:16px;line-height:1.7}
.jsci-more{margin:34px 0 0;text-align:center}

/* ---------- Eyebrow / kicker ---------- */
.jsci-kicker,.jsci-eyebrow{
  display:inline-flex;align-items:center;gap:8px;margin-bottom:14px;padding:7px 12px;
  border-radius:999px;background:rgba(0,44,208,.08);color:var(--c-blue);
  font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
}
.jsci-kicker::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--c-pink)}
.jsci-eyebrow.light{background:rgba(255,255,255,.16);color:#fff}

/* ---------- Buttons ---------- */
.jsci-btn{
  display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:12px 20px;
  border-radius:999px;font-family:var(--f-body);font-size:13px;font-weight:800;letter-spacing:.02em;
  text-decoration:none!important;border:1px solid transparent;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}
.jsci-btn:hover{transform:translateY(-2px)}
.jsci-btn-primary{color:#fff!important;background:linear-gradient(135deg,var(--c-blue),var(--c-violet));box-shadow:0 12px 26px rgba(0,44,208,.24)}
.jsci-btn-secondary{color:#fff!important;background:var(--c-deep);box-shadow:0 12px 26px rgba(16,27,77,.22)}
.jsci-btn-light{color:var(--c-blue-dark)!important;background:#fff;border-color:var(--c-border);box-shadow:0 8px 20px rgba(16,27,77,.08)}
.jsci-btn-yellow{color:var(--c-deep)!important;background:var(--c-yellow)}
.jsci-btn-outline{color:#fff!important;background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.4)}

/* ---------- Hero ---------- */
.jsci-hero{
  position:relative;padding:72px 20px 68px;overflow:hidden;
  background:
    radial-gradient(circle at 16% 12%,rgba(255,61,127,.12),transparent 30%),
    radial-gradient(circle at 86% 8%,rgba(255,210,63,.18),transparent 32%),
    linear-gradient(180deg,#fff 0%,#FFF8FE 100%);
  border-bottom:1px solid var(--c-border);
}
.jsci-orbit{position:absolute;border:1px solid rgba(0,44,208,.10);border-radius:50%;pointer-events:none}
.jsci-orbit-1{width:480px;height:180px;left:-160px;top:70px;transform:rotate(-18deg)}
.jsci-orbit-2{width:520px;height:220px;right:-180px;top:42px;transform:rotate(18deg)}
.jsci-hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:52px;align-items:center}
.jsci-hero h1{margin:0 0 18px;font-size:clamp(38px,5.6vw,72px);line-height:1;letter-spacing:-.045em;font-weight:800}
.jsci-hero-copy p{max-width:620px;margin:0;color:var(--c-muted);font-size:18px;line-height:1.7}
.jsci-hero-actions,.jsci-mentor-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}

/* Hero card: real formulae, no invented statistics */
.jsci-hero-card{
  position:relative;padding:28px;border-radius:28px;background:#fff;
  border:1px solid var(--c-border);box-shadow:0 26px 60px rgba(16,27,77,.12);
}
.jsci-hero-card::before{content:"";position:absolute;left:28px;right:28px;top:0;height:4px;border-radius:0 0 4px 4px;background:linear-gradient(90deg,var(--c-blue),var(--c-violet),var(--c-pink),var(--c-yellow))}
.jsci-card-badge{display:inline-block;padding:7px 12px;border-radius:999px;background:rgba(255,61,127,.10);color:var(--c-pink-ink);font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.jsci-card-title{max-width:300px;margin:16px 0 20px;font-size:24px;line-height:1.15;font-weight:800;letter-spacing:-.03em}
.jsci-planet{position:absolute;right:26px;top:24px;width:64px;height:64px;border-radius:50%;background:linear-gradient(150deg,var(--c-yellow),var(--c-pink) 55%,var(--c-violet))}
.jsci-planet::after{content:"";position:absolute;left:-14px;top:28px;width:92px;height:14px;border:3px solid rgba(16,27,77,.16);border-left-color:transparent;border-right-color:transparent;border-radius:50%;transform:rotate(-16deg)}
.jsci-formula-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.jsci-formula-list li{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border-radius:16px;background:var(--c-soft)}
.jsci-formula-list span{display:block;color:var(--c-deep);font-size:13px;font-weight:800}
.jsci-formula-list small{display:block;margin-top:2px;color:var(--c-muted);font-size:12px;font-weight:500}
.jsci-formula-list b{color:var(--c-blue);font-family:var(--f-head);font-size:15px;font-weight:700;white-space:nowrap}

/* ---------- Subject / practice cards ---------- */
.jsci-path-grid{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.jsci-path-card{
  position:relative;display:flex;flex-direction:column;min-height:220px;padding:24px;border-radius:22px;
  background:#fff;border:1px solid var(--c-border);box-shadow:0 14px 34px rgba(16,27,77,.07);overflow:hidden;
  color:var(--c-deep)!important;text-decoration:none!important;
  transition:transform .18s ease,box-shadow .18s ease;
}
.jsci-path-card:hover{transform:translateY(-4px);box-shadow:0 22px 46px rgba(16,27,77,.13)}
.jsci-path-card::before{content:"";position:absolute;left:0;top:0;width:100%;height:5px;background:var(--accent)}
.jsci-path-card span{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:12px;background:color-mix(in srgb,var(--accent),#fff 84%);color:var(--ink);font-size:13px;font-weight:800}
.jsci-path-card h3{margin:18px 0 8px;font-size:20px;line-height:1.15;font-weight:800;letter-spacing:-.02em}
.jsci-path-card p{margin:0 0 18px;color:var(--c-muted);font-size:14px;line-height:1.65}
.jsci-path-card b{margin-top:auto;color:var(--ink);font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.jsci-path-card.physics{--accent:#002CD0;--ink:#002CD0}
.jsci-path-card.maths{--accent:#8A2BEF;--ink:#8A2BEF}
.jsci-path-card.chemistry{--accent:#FF3D7F;--ink:var(--c-pink-ink)}
.jsci-path-card.biology{--accent:#FFD23F;--ink:var(--c-amber-ink)}

/* ---------- Topic cloud ---------- */
.jsci-topic-cloud{max-width:980px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.jsci-topic-cloud a{
  display:inline-flex;align-items:center;min-height:38px;padding:8px 14px;border-radius:999px;background:#fff;
  color:var(--c-blue)!important;border:1px solid var(--c-border);text-decoration:none!important;
  font-size:13px;font-weight:700;transition:background .18s ease,color .18s ease;
}
.jsci-topic-cloud a:hover{background:var(--c-blue);color:#fff!important;border-color:var(--c-blue)}

/* ---------- Mentor ---------- */
.jsci-mentor{padding:78px 20px;color:#fff;background:linear-gradient(135deg,#101B4D 0%,#00219E 55%,#8A2BEF 100%)}
.jsci-mentor-inner{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:48px;align-items:center}
.jsci-mentor h2{margin:0 0 16px;color:#fff;font-size:clamp(30px,4.2vw,50px);line-height:1.05;font-weight:800;letter-spacing:-.04em}
.jsci-mentor p{max-width:700px;margin:0;color:#fff;font-size:16px;line-height:1.75;opacity:.92}
.jsci-mentor-boxes{display:grid;gap:14px}
.jsci-mentor-boxes div{padding:20px 22px;border-radius:20px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18)}
.jsci-mentor-boxes strong{display:block;margin-bottom:4px;font-size:17px;color:#fff}
.jsci-mentor-boxes span{color:#fff;font-size:14px;opacity:.9}

/* ---------- Accessibility ---------- */
.jsci-home a:focus-visible{outline:3px solid var(--c-blue);outline-offset:3px}
.jsci-mentor a:focus-visible{outline-color:#fff}
@media (prefers-reduced-motion:reduce){
  .jsci-home *{transition:none!important}
  .jsci-btn:hover,.jsci-path-card:hover{transform:none}
}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .jsci-hero-inner,.jsci-mentor-inner{grid-template-columns:1fr}
  .jsci-path-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .jsci-hero{padding:48px 16px 52px}
  .jsci-section{padding:52px 16px}
  .jsci-mentor{padding:56px 16px}
  .jsci-hero-copy p,.jsci-section-head p{font-size:15px}
  .jsci-path-grid{grid-template-columns:1fr}
  .jsci-hero-card{padding:22px;border-radius:24px}
  .jsci-planet{width:52px;height:52px;right:20px;top:20px}
  .jsci-formula-list li{flex-direction:column;align-items:flex-start;gap:4px}
  .jsci-hero-actions,.jsci-mentor-actions{flex-direction:column}
  .jsci-btn{width:100%}
}