/* =========================
   WELCOME — full CSS (with proper outer margins)
   ========================= */

/* Wider stage + responsive outer spacing */
.container.welcome-container{
  max-width: 1600px;                         /* wider than site default */
  margin-inline: auto;                        /* center container */
  margin-block: clamp(16px, 3vw, 48px);       /* ⬅️ top/bottom margin around the section */
  padding-inline: clamp(12px, 2.5vw, 24px);   /* ⬅️ side gutters */
  padding-block: 0;                           /* no extra top/bottom padding here */
}

/* Tokens + unified scaling (both lines stay proportional) */
.welcome-container{
  --brand:#800000; --accent:#ffba08; --ink:#0B1220; --text:#1A1A1A;

  /* scale driver */
  --w-base: clamp(1.4rem, 1.1rem + 2.3vw, 2.6rem);  /* school text size */
  --w-title-mult: 1.55;                              /* title = base * this */
  --w-gap: max(2px, calc(var(--w-base) * 0.14));     /* space between lines */

  /* shared width (measure) for BOTH lines */
  --welcome-measure: min(100%, 1300px);              /* tweak 1100–1400px if needed */

  margin: 0;
  padding: clamp(8px, 1.2vw, 14px) 0;                /* subtle inner breathing room */
}

/* Center the block */
.welcome-row{
  display: flex;
  justify-content: center;
  text-align: center;
}

/* Shared measuring wrapper — both lines use the same width */
.welcome{
  width: var(--welcome-measure);
  margin-inline: auto;
  display: block;
}

/* Reset default heading margins */
.welcome-container h1,
.welcome-container h2{ margin: 0; }

/* Optional eyebrow */
.welcome-label{
  margin: 0 0 clamp(4px, .5vw, 8px);
  color: var(--brand);
  font-family: var(--font-nav, Tahoma, Geneva, Verdana, sans-serif);
  font-size: clamp(.85rem, .8rem + .25vw, 1rem);
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  opacity: .95;
}

/* Both lines fill the shared width */
.welcome-school,
.welcome-value{
  display: block;
  width: 100%;
  text-align: center;
  text-wrap: balance;  /* nicer wrapping when it happens */
}

/* School line — script font, no underline */
.welcome-school{
  margin: 0 0 var(--w-gap);
  font-family: var(--font-tagline, "Allura", cursive);
  color: var(--brand);
  font-weight: 400;
  line-height: 1.05;
  font-size: var(--w-base);
}

/* Title line — Bitter 900 with accent underline */
.welcome-value{
  margin: 0;
  color: var(--brand);
  font-family: var(--font-site, "Bitter", Georgia, serif);
  font-weight: 900;
  line-height: 1.06;
  font-size: calc(var(--w-base) * var(--w-title-mult));

  /* accent underline */
  text-decoration: underline;
  text-decoration-color: #ffba08;
  text-underline-offset: clamp(6px, calc(var(--w-base) * 0.35), 14px);
  text-decoration-thickness: max(3px, calc(var(--w-base) * 0.16));
}

/* Desktop+ : keep each line to one line */
@media (min-width: 900px){
  .welcome-school,
  .welcome-value{
    white-space: nowrap;
  }
}

/* =========================
   Intro line under the welcome hero
   ========================= */

.home-intro{

  margin: 0 0 10px;
  font-family: var(--font-nav, Tahoma, Geneva, Verdana, sans-serif);
  font-size: 1rem;
  letter-spacing: .04em;
  color: #374151;

  text-align: center;
  line-height: 1.4;
  margin-left: auto;    /* center the block */
  margin-right: auto;   /* center the block */
  opacity: .95;
  text-wrap: balance;   /* nicer wrapping when needed */
}


/* =========================
   STATS — fully centered (section, row, and items)
   ========================= */

/* Stage container (mirrors welcome-container centering) */
.container.stats-container{
  max-width: 1600px;
  margin-inline: auto;                      /* center the whole section */
  margin-block: clamp(16px, 3vw, 48px);
  padding-inline: clamp(12px, 2.5vw, 24px); /* side gutters */
  padding-block: 0;
}

/* Brand tokens (no design changes) */
.stats-container{
  --brand:#800000; --accent:#ffba08; --ink:#0B1220; --text:#1A1A1A;
  margin: 0;
  padding: 0;
}

/* Grid row: centered tracks + centered items */
.stats-row{
  --gap: clamp(28px, 6vw, 72px);
  display: grid;
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap: var(--gap);

  /* keep grid from stretching too wide and center it */
  width: min(100%, 1100px);
  margin-inline: auto;

  /* center the items inside each grid cell */
  place-items: center; /* = align-items:center + justify-items:center */
}

/* Tablet: 2-up */
@media (max-width: 900px){
  .stats-row{
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }
}

/* Phone: 1-up */
@media (max-width: 560px){
  .stats-row{
    grid-template-columns: 1fr;
  }
}

/* --- Item content centered --- */
.stat{
  display: flex;
  flex-direction: column;
  align-items: center;  /* center label + value block */
  text-align: center;   /* center the text itself */
}

/* Visual styles (unchanged colors & fonts) */
.stat .label{
  margin:0 0 8px;
  color: var(--brand);
  font-family: var(--font-nav, Tahoma, Geneva, Verdana, sans-serif);
  font-size: clamp(.9rem, .85rem + .25vw, 1rem);
  font-weight: 800;
  letter-spacing:.06em;
  text-transform: uppercase;
  opacity:.95;
}

.stat .value{
  margin:0; line-height:1;
  font-family: var(--font-site, "Bitter", Georgia, serif);
  font-weight: 900;
  font-size: clamp(3rem, 7.5vw, 5.75rem);
  font-variant-numeric: tabular-nums lining-nums;
  -webkit-font-smoothing: antialiased;

  background: var(--brand);
  -webkit-background-clip: text; background-clip: text; color: transparent;

  text-shadow: 0 1px 0 rgba(0,0,0,.04);
  position: relative;
}

/* Underline centered under the number */
.stat .value::after{
  content:"";
  position:absolute; left:50%; bottom:-10px;
  height:4px; width:96px; border-radius:999px;
  background: var(--accent);
  opacity:.55;
  transform: translateX(-50%) scaleX(0);      /* start collapsed, centered */
  transform-origin: center;
  transition: transform .9s cubic-bezier(.22,.8,.2,1);
}
.stat .value.reveal::after{
  transform: translateX(-50%) scaleX(1);      /* animate out from center */
}

@media (prefers-reduced-motion: reduce){
  .stat .value::after{ transition:none; transform:none; }
}