/* Groot Academy / programs-first homepage, 19 October 2026.
 * Original styling informed by Great Learning's course discovery hierarchy.
 * Homepage-only; existing course data, lead handling and mobile shell are reused.
 */
html body.ga-learning-home .ga-lp {
  --ink:#142747; --muted:#58677d; --green:#1357cb; --paper:#f5f7fb;
  --line:#dfe5ee; --ga-brand-blue:#1357cb; --ga-brand-blue-hover:#1047a4;
}
html body.ga-learning-home .ga-lp .ga-wrap { max-width:1240px; }
html body.ga-learning-home .ga-lp .ga-hero {
  position:relative; overflow:hidden; padding:64px 0 68px;
  background:radial-gradient(ellipse at 85% 45%,#214d79 0,transparent 48%),#0d2342 !important;
  border:0;
}
html body.ga-learning-home .ga-lp .ga-hero-grid { grid-template-columns:1.1fr 1fr; gap:64px; }
html body.ga-learning-home .ga-lp .ga-hero .ga-eyebrow {
  color:#d1e4ff; background:transparent; border:0; padding:0;
  font-size:10px; letter-spacing:.13em;
}
html body.ga-learning-home .ga-lp .ga-hero .ga-eyebrow:before { background:#65d6cb; }
html body.ga-learning-home .ga-lp .ga-hero h1 {
  color:#fff !important; font-size:clamp(42px,4.8vw,64px); line-height:1.07;
  font-weight:750; letter-spacing:-.045em; margin:24px 0;
}
html body.ga-learning-home .ga-lp .ga-hero h1 em {
  color:#91d9ff !important; font-size:.88em; font-style:normal; font-weight:650; margin-top:9px;
}
html body.ga-learning-home .ga-lp .ga-hero-lead { color:#d3dfee !important; font-size:16px; line-height:1.8; max-width:510px; }
html body.ga-learning-home .ga-lp .ga-hero-actions { margin:28px 0; }
html body.ga-learning-home .ga-lp .ga-button { border-radius:6px; font-size:14px; min-height:50px; }
html body.ga-learning-home .ga-lp .ga-hero .ga-button-primary { background:#fff !important; border-color:#fff !important; color:#123c74 !important; box-shadow:none; }
html body.ga-learning-home .ga-lp .ga-hero .ga-button-primary:hover { background:#e5f2ff !important; }
html body.ga-learning-home .ga-lp .ga-hero .ga-button-outline { background:transparent !important; border-color:#7088a6; color:#fff !important; }
html body.ga-learning-home .ga-lp .ga-hero .ga-button-outline:hover { background:#203b5c !important; }
html body.ga-learning-home .ga-lp .ga-hero-stages { border-color:#3b526f; }
html body.ga-learning-home .ga-lp .ga-hero-stages span { color:#b9cbe0; font-size:11px; }
html body.ga-learning-home .ga-lp .ga-hero-visual {
  position:relative; background:#e9f3ff; border:1px solid #526e91; border-radius:18px 60px 18px 18px;
  padding:24px; box-shadow:0 24px 64px #020e2440; transform:rotate(-2deg);
}
html body.ga-learning-home .ga-lp .ga-hero-visual>* { transform:rotate(2deg); }
html body.ga-learning-home .ga-lp .ga-studio-heading { color:#335379; font-size:9px; }
html body.ga-learning-home .ga-lp .ga-hero-visual img { margin:16px 0; border-radius:12px; mix-blend-mode:multiply; }
html body.ga-learning-home .ga-lp .ga-hero-orbit { position:absolute; top:-23px; left:-22px; display:grid; place-items:center; width:58px; height:58px; border-radius:16px; background:#b3eee1; color:#124f4b; font-size:24px; font-weight:700; box-shadow:0 8px 20px #0002; }
html body.ga-learning-home .ga-lp .ga-studio-skills { border-color:#c8dbef; }
html body.ga-learning-home .ga-lp .ga-studio-skills span { background:#fff; border:0; padding:6px 13px; }
html body.ga-learning-home .ga-lp .ga-hero-note { display:flex; gap:12px; align-items:center; margin-top:20px; padding-top:18px; border-top:1px solid #c8dbef; }
html body.ga-learning-home .ga-lp .ga-hero-note>span { display:grid; place-items:center; width:38px; height:38px; background:#1357cb; color:#fff; border-radius:50%; font-size:23px; flex:none; }
html body.ga-learning-home .ga-lp .ga-hero-note strong { color:#17385e; font-size:13px; }
html body.ga-learning-home .ga-lp .ga-hero-note p { font-size:11px; margin-top:3px; color:#4b6280; }
html body.ga-learning-home .ga-lp .ga-learning-benefits { background:#fff; border-bottom:1px solid var(--line); padding:26px 0; }
html body.ga-learning-home .ga-lp .ga-benefit-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
html body.ga-learning-home .ga-lp .ga-benefit-grid>div { display:flex; align-items:center; gap:12px; }
html body.ga-learning-home .ga-lp .ga-benefit-grid>div>span { font-size:25px; color:#1457b9; flex:none; }
html body.ga-learning-home .ga-lp .ga-benefit-grid p { font-size:11px; line-height:1.7; }
html body.ga-learning-home .ga-lp .ga-benefit-grid strong { display:block; font-size:13px; color:var(--ink); }
html body.ga-learning-home .ga-lp .ga-section-nav { background:#f7f9fc; }
html body.ga-learning-home .ga-lp .ga-section-nav .ga-wrap { gap:28px; padding-block:4px; }
html body.ga-learning-home .ga-lp .ga-section { padding-block:72px; }
html body.ga-learning-home .ga-lp h2 { font-size:clamp(29px,3vw,40px); letter-spacing:-.035em; }
html body.ga-learning-home .ga-lp .ga-section-head p { font-size:15px; max-width:680px; margin-top:14px; }
html body.ga-learning-home .ga-lp .ga-eyebrow { font-size:10px; letter-spacing:.13em; }
html body.ga-learning-home .ga-lp .ga-catalogue { background:#f5f7fb; border-top:0; }
html body.ga-learning-home .ga-lp .ga-discovery-layout { display:grid; grid-template-columns:234px minmax(0,1fr); gap:28px; align-items:start; }
html body.ga-learning-home .ga-lp .ga-discovery-sidebar { padding:22px 18px; background:#fff; border:1px solid var(--line); border-radius:10px; }
html body.ga-learning-home .ga-lp .ga-discovery-title { font-size:16px; letter-spacing:-.02em; margin:0 0 20px; }
html body.ga-learning-home .ga-lp .ga-path-search { margin:0; }
html body.ga-learning-home .ga-lp .ga-path-search label { font-size:12px; }
html body.ga-learning-home .ga-lp .ga-path-search input { min-height:50px; padding:12px; border-radius:6px; }
html body.ga-learning-home .ga-lp .ga-path-search p { font-size:11px; line-height:1.6; margin-top:10px; }
html body.ga-learning-home .ga-lp .ga-filter-row { display:flex; flex-direction:column; gap:6px; margin:22px 0 0; }
html body.ga-learning-home .ga-lp .ga-filter { display:flex; align-items:center; justify-content:space-between; text-align:left; background:transparent; border:1px solid transparent; border-radius:5px; font-size:13px; padding:10px 12px; }
html body.ga-learning-home .ga-lp .ga-filter:after { content:'›'; font-size:20px; }
html body.ga-learning-home .ga-lp .ga-filter[aria-pressed="true"] { background:#eaf1ff; color:#134cae; border-color:#d9e5ff; }
html body.ga-learning-home .ga-lp .ga-courses-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
html body.ga-learning-home .ga-lp .ga-course-card {
  position:relative; padding:0 0 18px; border:1px solid #dce3ec; border-radius:10px;
  background:#fff; box-shadow:0 4px 14px #102a4305; overflow:hidden;
}
html body.ga-learning-home .ga-lp .ga-course-top { order:1; padding:16px 20px 0; margin:0 0 12px; gap:8px; }
html body.ga-learning-home .ga-lp .ga-course-symbol { width:28px; height:28px; border-radius:6px; background:var(--ga-track-soft); color:var(--ga-track-ink); font-size:13px; }
html body.ga-learning-home .ga-lp .ga-course-type { font-size:9px; letter-spacing:.06em; background:transparent; padding:0; }
html body.ga-learning-home .ga-lp .ga-course-image,
html body.ga-learning-home .ga-lp .ga-course-image.ga-course-illustration { order:0; margin:0; border-radius:0; aspect-ratio:16/8; background:#edf3f9; border-bottom:1px solid #edf0f5; }
html body.ga-learning-home .ga-lp .ga-course-card h3 { order:2; margin:0 20px 12px; font-size:21px; line-height:1.3; }
html body.ga-learning-home .ga-lp .ga-course-card>p { order:3; margin:0 20px 18px; font-size:13px; line-height:1.75; }
html body.ga-learning-home .ga-lp .ga-course-link { order:4; margin:auto 20px 0; border-top:1px solid #e5eaf1; padding:16px 0 0; gap:10px; color:#1357cb; font-size:13px; }
html body.ga-learning-home .ga-lp .ga-bottom-actions { justify-content:space-between; }
html body.ga-learning-home .ga-lp .ga-path-card { background:#fff; border:1px solid var(--line); border-radius:10px; padding:24px; min-height:240px; gap:20px; }
html body.ga-learning-home .ga-lp .ga-path-card .ga-path-icon { background:var(--ga-track-soft); box-shadow:none; }
html body.ga-learning-home .ga-lp .ga-path-card h3 { font-size:20px; }
html body.ga-learning-home .ga-lp .ga-method { background:#f7f9fc; }
html body.ga-learning-home .ga-lp .ga-featured { background:#eaf2ff; padding:70px 0; }
html body.ga-learning-home .ga-lp .ga-feature-art { border:0; box-shadow:none; border-radius:14px; }
html body.ga-learning-home .ga-lp .ga-project { border:1px solid var(--line); border-radius:10px; background:#fff; }
html body.ga-learning-home .ga-lp .ga-faq { background:#fff; }
html body.ga-learning-home .ga-lp .ga-contact { background:#0d2342; padding:72px 0; }
html body.ga-learning-home .ga-lp .ga-contact h2 { color:#fff; }
@media(max-width:1100px) {
  html body.ga-learning-home .ga-lp .ga-hero-grid { gap:36px; }
  html body.ga-learning-home .ga-lp .ga-discovery-layout { grid-template-columns:205px minmax(0,1fr); gap:20px; }
}
@media(max-width:991px) {
  html body.ga-learning-home .ga-lp .ga-hero-grid { grid-template-columns:1fr 1fr; gap:28px; }
  html body.ga-learning-home .ga-lp .ga-hero h1 { font-size:44px; }
  html body.ga-learning-home .ga-lp .ga-hero-actions { flex-direction:column; align-items:stretch; }
  html body.ga-learning-home .ga-lp .ga-hero-stages { grid-template-columns:1fr; gap:5px; }
  html body.ga-learning-home .ga-lp .ga-benefit-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  html body.ga-learning-home .ga-lp .ga-discovery-layout { grid-template-columns:1fr; }
  html body.ga-learning-home .ga-lp .ga-discovery-sidebar { padding:20px; }
  html body.ga-learning-home .ga-lp .ga-path-search { max-width:none; }
  html body.ga-learning-home .ga-lp .ga-filter-row { flex-direction:row; flex-wrap:wrap; margin-top:16px; }
  html body.ga-learning-home .ga-lp .ga-filter:after { display:none; }
}
@media(max-width:600px) {
  html body.ga-learning-home .ga-lp .ga-hero { padding:38px 0 40px; }
  html body.ga-learning-home .ga-lp .ga-hero-grid { grid-template-columns:1fr; gap:32px; }
  html body.ga-learning-home .ga-lp .ga-hero h1 { font-size:clamp(38px,10vw,52px); }
  html body.ga-learning-home .ga-lp .ga-hero .ga-eyebrow { font-size:9px; }
  html body.ga-learning-home .ga-lp .ga-hero-stages { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
  html body.ga-learning-home .ga-lp .ga-hero-stages span { font-size:10px; }
  html body.ga-learning-home .ga-lp .ga-hero-visual { transform:none; padding:18px; border-radius:12px 36px 12px 12px; width:calc(100% - 10px); margin:8px auto 0; }
  html body.ga-learning-home .ga-lp .ga-hero-visual>* { transform:none; }
  html body.ga-learning-home .ga-lp .ga-hero-orbit { width:40px; height:40px; font-size:18px; top:-15px; left:-10px; border-radius:10px; }
  html body.ga-learning-home .ga-lp .ga-hero-visual img { max-height:210px; margin:10px 0; }
  html body.ga-learning-home .ga-lp .ga-hero-note { margin-top:14px; padding-top:12px; }
  html body.ga-learning-home .ga-lp .ga-benefit-grid { gap:20px 12px; }
  html body.ga-learning-home .ga-lp .ga-benefit-grid>div { align-items:flex-start; gap:8px; }
  html body.ga-learning-home .ga-lp .ga-benefit-grid strong { font-size:12px; }
  html body.ga-learning-home .ga-lp .ga-benefit-grid p { font-size:10px; }
  html body.ga-learning-home .ga-lp .ga-benefit-grid>div>span { font-size:20px; }
  html body.ga-learning-home .ga-lp .ga-section { padding-block:46px; }
  html body.ga-learning-home .ga-lp .ga-courses-grid { grid-template-columns:1fr; gap:20px; }
  html body.ga-learning-home .ga-lp .ga-discovery-sidebar { padding:18px; }
  html body.ga-learning-home .ga-lp .ga-filter-row { flex-wrap:nowrap; overflow-x:auto; padding-bottom:6px; }
  html body.ga-learning-home .ga-lp .ga-filter { flex:none; font-size:12px; padding:10px; }
  html body.ga-learning-home .ga-lp .ga-path-grid { grid-template-columns:1fr; }
  html body.ga-learning-home .ga-lp .ga-path-card { min-height:0; }
  html body.ga-learning-home .ga-lp .ga-bottom-actions { align-items:flex-start; flex-direction:column; }
  html body.ga-learning-home .ga-lp .ga-featured,
  html body.ga-learning-home .ga-lp .ga-contact { padding-block:46px; }
}
@media(prefers-reduced-motion:reduce) {
  html body.ga-learning-home .ga-lp :is(a,.ga-course-card,.ga-path-card,.ga-project,.ga-course-image img) { transition:none; }
  html body.ga-learning-home .ga-lp :is(a,.ga-course-card,.ga-path-card,.ga-project):hover { transform:none; }
}
html body.ga-learning-home .ga-lp :is(.ga-discovery-sidebar,.ga-discovery-results) { min-width:0; }

/* Use maintained original Groot-branded course cards, not illustration stand-ins.
   Keep the complete artwork visible; no synthetic crops or image upscaling. */
html body.ga-learning-home .ga-lp .ga-course-image.ga-course-original {
  order:0;
  aspect-ratio:3/2;
  margin:0;
  border-radius:10px 10px 0 0;
  background:#f6f9fd;
}
html body.ga-learning-home .ga-lp .ga-course-image.ga-course-original img {
  width:100%;
  height:100%;
  object-fit:contain;
}
html body.ga-learning-home .ga-lp .ga-course-card:focus-within {
  border-color:#2457d6;
  box-shadow:0 0 0 2px #2457d626;
}

/* The shared career theme uses :is(h1, h1 em, .ga-hero-lead) with class-level
   specificity. On this navy hero its light-page ink hid the headline/lead.
   Resolve the cascade here, and keep the mobile learning stages readable. */
html body.ga-learning-home .ga-lp .ga-hero .ga-hero-grid :is(h1,.ga-hero-lead) {
  color:#f7fbff !important;
}
html body.ga-learning-home .ga-lp .ga-hero .ga-hero-grid h1 em {
  color:#91d9ff !important;
}
html body.ga-learning-home .ga-lp .ga-hero .ga-hero-stages span {
  color:#e7f1ff !important;
  background:rgba(255,255,255,.08) !important;
  border-color:rgba(255,255,255,.2) !important;
}

/* Mobile hero headline line break remains legible even under legacy theme rules. */
html body.ga-learning-home .ga-lp .ga-hero .ga-hero-grid h1 em { display:block !important; margin-top:6px; }
