/* Ocaquatics Design System. Generated by `npm run build:css`. Do not edit. */
/* The global-CSS entry point. A list of @import lines only, never inline rules.
   `scripts/build-css.mjs` flattens this into a single file per build target. */
/* src/styles/tokens/fonts.css */
/* Poppins is the display face. Only 700 and 900 are licensed/shipped here.
   Every weight needs its own @font-face or the browser synthesizes it and the
   letterforms go soft.

   The url() prefix below is canonical: `scripts/build-css.mjs` rewrites
   "./assets/fonts/" to whatever is correct for each build target. Keep the
   filenames intact. */
@font-face{font-family:"Poppins";font-style:normal;font-weight:700;font-display:swap;src:url("./assets/fonts/poppins-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:900;font-display:swap;src:url("./assets/fonts/poppins-latin-900-normal.woff2") format("woff2")}

/* src/styles/tokens/colors.css */
:root{
  /* The four official brand colors */
  --oca-blue:#0079C1;
  --oca-yellow:#FFC425;
  --oca-navy:#2B3990;
  --oca-light-blue:#A1D4F3;

  /* Working shade: Blue one step down, gradient midpoint */
  --oca-deep:#0568AE;

  /* Tints and support, in daily use on the hub */
  --oca-foam:#F5FBFF;
  --oca-band:#EDEEF6;
  --oca-tint-blue:#E1F0FA;
  --oca-tint-yellow:#FFF3D1;
  --oca-line:#CFE8F7;
  --oca-muted:#4F5FA8;
  --oca-white:#fff;

  /* Reserved: Ripples of Impact cross-promotions only. Never internal pages. */
  --ripples-cyan:#18ADD3;
  --ripples-deep:#0783AE;

  /* Semantic aliases. No grey text ever: white, Blue, or Navy Blue only. */
  --text-heading:var(--oca-blue);
  --text-body:var(--oca-navy);
  --text-secondary:var(--oca-muted);
  --text-on-dark:var(--oca-white);
  --text-on-dark-secondary:rgba(255,255,255,.85);
  --text-link:var(--oca-blue);
  --text-link-hover:var(--oca-navy);
  --text-accent-on-dark:var(--oca-yellow);

  --surface-page:var(--oca-foam);
  --surface-card:var(--oca-white);
  --surface-band:var(--oca-band);
  --surface-chip:var(--oca-tint-blue);
  --surface-emphasis:var(--oca-tint-yellow);
  --surface-deep:var(--oca-navy);

  --border-card:var(--oca-line);
  --border-rule:var(--oca-line);

  --action-primary-bg:var(--oca-yellow);
  --action-primary-fg:var(--oca-navy);
  --action-secondary-bg:var(--oca-white);
  --action-secondary-fg:var(--oca-navy);
  --action-blue-bg:var(--oca-blue);
  --action-blue-fg:var(--oca-white);

  /* Hero gradient always runs Blue to Deep to Navy Blue */
  --gradient-hero:linear-gradient(120deg,var(--oca-navy) 0%,var(--oca-deep) 55%,var(--oca-blue) 100%);
  --gradient-hero-down:linear-gradient(180deg,var(--oca-blue) 0%,var(--oca-deep) 48%,var(--oca-navy) 100%);
}

/* src/styles/tokens/typography.css */
:root{
  --font-display:"Poppins",Arial,Helvetica,sans-serif;
  --font-body:Arial,Helvetica,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

  --weight-display:700;
  --weight-button:900;

  /* Display and headings, Poppins 700, tight tracking */
  --size-display:40px;
  --size-h1:34px;
  --size-h2:24px;
  --size-h3:22px;
  --size-card-title:19px;
  --tracking-display:-.02em;
  --leading-display:1.15;

  /* Kicker: Poppins 700, uppercase, wide tracking */
  --size-kicker:11.5px;
  --tracking-kicker:.12em;
  --size-band-label:11px;
  --tracking-band-label:.11em;

  /* Body, Arial */
  --size-body:16.5px;
  --leading-body:1.65;
  --size-secondary:13.5px;
  --leading-secondary:1.6;
  --size-chip:11px;
  --weight-chip:800;
  --size-link:12.5px;
  --size-button:14px;
}

/* src/styles/tokens/spacing.css */
:root{
  --space-1:4px;
  --space-2:6px;
  --space-3:8px;
  --space-4:10px;
  --space-5:14px;
  --space-6:18px;
  --space-7:22px;
  --space-8:24px;
  --space-9:26px;
  --space-10:32px;
  --space-11:44px;
  --space-12:64px;
  --space-13:88px;

  /* Layout */
  --page-max:1180px;
  --page-gutter:24px;
  --grid-columns:12; /* @kind other */
  --grid-gap:18px;
  --card-padding:24px;
  --section-gap:64px;

  /* Named component paddings, copied from the hub */
  --pill-padding:14px 22px;
  --chip-padding:4px 11px;
  --band-padding:18px 22px;
}

/* src/styles/tokens/shape.css */
:root{
  --radius-card:20px;
  --radius-panel:14px;
  --radius-icon:14px;
  --radius-pill:999px;
  --border-width-card:1.5px;

  --shadow-sm:0 1px 2px rgba(43,57,144,.06),0 1px 1px rgba(43,57,144,.04);
  --shadow-md:0 14px 34px rgba(43,57,144,.14),0 3px 8px rgba(43,57,144,.06);
  --shadow-icon:0 6px 14px rgba(43,57,144,.16);
  --shadow-logo-on-navy:drop-shadow(0 4px 10px rgba(0,0,0,.25));

  /* The transition out of a hero is always a wave, never a straight edge. */
  --wave-view-box:0 0 1440 96; /* @kind other */
  --wave-path:"M0,50 C240,116 420,-8 720,32 C1020,71 1240,11 1440,46 L1440,96 L0,96 Z"; /* @kind other */
  --wave-height:72px;
}

/* src/styles/tokens/motion.css */
:root{
  --ease-standard:ease; /* @kind other */
  --duration-hover:.18s; /* @kind other */
  --transition-tile:box-shadow .18s ease,transform .18s ease,border-color .18s ease; /* @kind other */
  --lift-hover:-3px;
  --nudge-hover:4px;
  --brighten-hover:brightness(1.05); /* @kind other */
}