/*
Theme Name: Educational Breakthroughs Child (Brand Palette)
Description: Brand-matched colorful child theme + extra EB blocks (Tutorpeers-style sections) for Educational Breakthroughs (Modern). Uses Google Fonts: Abril Fatface (titles) + Poppins (body).
Author: Freshpage Media
Template: educational-breakthroughs
Version: 1.0.0
*/

/* -------------------------
   Brand palette + typography
   ------------------------- */

:root{
  /* Palette */
  --eb-primary: #048652;    /* Dominant Green (60%) */
  --eb-primary-2: #101585;  /* Deep Navy */
  --eb-accent: #FFED00;     /* Subtle Yellow (10%) */
  --eb-bg: #F9FAFB;         /* Soft Cloud */
  --eb-surface: #FFFFFF;
  --eb-text: #0E1726;
  --eb-muted: #556476;
  --eb-border: rgba(16,21,133,.12);

  /* Fonts */
  --eb-font: Poppins, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  --eb-font-display: "Abril Fatface", Poppins, ui-serif, Georgia, serif;

  /* Shapes */
  --eb-radius: 20px;
}

/* Background: mostly Soft Cloud with subtle green glow */
body{
  background:
    radial-gradient(900px 420px at 15% 0%, rgba(4,134,82,.12), rgba(249,250,251,0)),
    radial-gradient(900px 420px at 85% 10%, rgba(16,21,133,.10), rgba(249,250,251,0)),
    var(--eb-bg);
  font-family: var(--eb-font);
}

/* Titles */
h1, h2, .entry-title{
  font-family: var(--eb-font-display);
  letter-spacing: -0.01em;
}
h3, h4, h5, .nav-menu a{
  font-family: var(--eb-font);
}

/* Nav hover: subtle green */
.nav-menu a:hover{
  background: rgba(4,134,82,.10);
}

/* Buttons: green → navy */
.btn, .wp-block-button__link{
  background: linear-gradient(90deg, var(--eb-primary), var(--eb-primary-2));
  box-shadow: 0 12px 26px rgba(16,21,133,.18);
}
.btn:hover, .wp-block-button__link:hover{
  box-shadow: 0 16px 32px rgba(16,21,133,.22);
}

/* Accent pill for small badges */
.eb-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background: rgba(255,237,0,.18);
  border: 1px solid rgba(255,237,0,.35);
  color: var(--eb-text);
  font-weight:600;
  font-size: 13px;
}

/* Hero: Tutorpeers-like colorful ellipses but on-brand */
.eb-hero__inner{
  position:relative;
  background:
    radial-gradient(420px 320px at 12% 15%, rgba(255,237,0,.16), rgba(255,255,255,0)),
    radial-gradient(560px 380px at 55% 0%, rgba(4,134,82,.18), rgba(255,255,255,0)),
    radial-gradient(520px 360px at 92% 20%, rgba(16,21,133,.14), rgba(255,255,255,0)),
    #fff;
  border: 1px solid rgba(16,21,133,.10);
}

/* CTA band: mostly green, with subtle yellow accent */
.eb-cta{
  background: linear-gradient(90deg, var(--eb-primary), rgba(4,134,82,.92), var(--eb-primary-2));
  position: relative;
}
.eb-cta::after{
  content:"";
  position:absolute;
  inset:-40px -60px auto auto;
  width:220px; height:220px;
  background: radial-gradient(circle, rgba(255,237,0,.45), rgba(255,255,255,0) 70%);
  border-radius: 999px;
  pointer-events:none;
}

/* Lists: yellow bullets (sparingly) */
.entry-content ul li::marker,
.eb-prose ul li::marker{
  color: var(--eb-accent);
}

/* -------------------------
   Extra EB blocks styling
   ------------------------- */

/* Stat strip */
.eb-stats{
  margin: 10px 0 34px;
}
.eb-stats .wp-block-columns{
  gap: 14px;
}
.eb-stats .wp-block-column{
  background: var(--eb-surface);
  border: 1px solid rgba(16,21,133,.10);
  border-radius: var(--eb-radius);
  padding: 18px;
  box-shadow: 0 12px 28px rgba(14,23,38,.08);
}
.eb-stats .wp-block-column h3{
  margin:0 0 4px;
  font-size: 28px;
  color: var(--eb-primary-2);
}
.eb-stats .wp-block-column p{
  margin:0;
  color: var(--eb-muted);
}

/* Feature tiles */
.eb-feature-tiles .wp-block-column{
  position:relative;
  overflow:hidden;
}
.eb-feature-tiles .wp-block-column::before{
  content:"";
  position:absolute;
  inset:-80px auto auto -80px;
  width:180px; height:180px;
  background: radial-gradient(circle, rgba(4,134,82,.18), rgba(255,255,255,0) 70%);
  border-radius:999px;
  pointer-events:none;
}
.eb-feature-tiles .wp-block-column::after{
  content:"";
  position:absolute;
  inset:auto -80px -80px auto;
  width:180px; height:180px;
  background: radial-gradient(circle, rgba(255,237,0,.18), rgba(255,255,255,0) 70%);
  border-radius:999px;
  pointer-events:none;
}

/* Subject cards */
.eb-subject-cards .wp-block-column{
  padding:0;
}
.eb-subject-cards .wp-block-image img{
  border-radius: calc(var(--eb-radius) - 6px);
}
.eb-subject-cards .wp-block-group{
  padding: 16px 18px 18px;
}
.eb-price{
  display:inline-block;
  font-weight:700;
  color: var(--eb-primary);
  background: rgba(4,134,82,.10);
  border: 1px solid rgba(4,134,82,.18);
  padding:6px 10px;
  border-radius:999px;
  font-size: 13px;
}

/* FAQ */
.eb-faq details{
  background: var(--eb-surface);
  border: 1px solid rgba(16,21,133,.10);
  border-radius: var(--eb-radius);
  padding: 12px 14px;
  box-shadow: 0 10px 22px rgba(14,23,38,.06);
}
.eb-faq details + details{ margin-top: 12px; }
.eb-faq summary{
  cursor:pointer;
  font-weight:700;
  list-style:none;
}
.eb-faq summary::-webkit-details-marker{ display:none; }
.eb-faq summary::after{
  content:"+";
  float:right;
  color: var(--eb-primary-2);
  font-weight:800;
}
.eb-faq details[open] summary::after{ content:"–"; }

/* Headings in dominant green */
h1, h2, h3, h4, h5, h6,
.entry-title,
.wp-block-heading,
.eb-hero__content h1,
.eb-cta h2,
.eb-stats .wp-block-column h3{
  color: var(--eb-primary) !important; /* #048652 */
}

/* Optional: keep links inside headings consistent */
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a,
.entry-title a{
  color: inherit !important;
}

/* Headings default: dominant green */
h1, h2, h3, h4, h5, h6,
.entry-title,
.wp-block-heading{
  color: var(--eb-primary) !important; /* #048652 */
}

/* If headings are inside a colored/dark section, make them white */
.eb-cta h1, .eb-cta h2, .eb-cta h3, .eb-cta h4, .eb-cta h5, .eb-cta h6,
.has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6,
.wp-block-cover h1, .wp-block-cover h2, .wp-block-cover h3, .wp-block-cover h4, .wp-block-cover h5, .wp-block-cover h6{
  color: #fff !important;
}

/* Optional: keep links inside those headings white too */
.eb-cta h1 a, .eb-cta h2 a, .eb-cta h3 a, .eb-cta h4 a, .eb-cta h5 a, .eb-cta h6 a,
.has-background h1 a, .has-background h2 a, .has-background h3 a, .has-background h4 a, .has-background h5 a, .has-background h6 a,
.wp-block-cover h1 a, .wp-block-cover h2 a, .wp-block-cover h3 a, .wp-block-cover h4 a, .wp-block-cover h5 a, .wp-block-cover h6 a{
  color: #fff !important;
}