:root {
  /* Brand colors extracted from the approved logo/specification. */
  --yc-deep-navy: #02235E;
  --yc-dark-blue: #074089;
  --yc-primary-blue: #065DBC;
  --yc-cyan-blue: #0281DB;
  --yc-light-cyan: #90B2D3;
  --yc-white: #FFFFFF;

  /* Website palette. */
  --yc-bg: #FFFFFF;
  --yc-bg-soft: #F7FAFC;
  --yc-bg-blue-soft: #EEF7FF;
  --yc-ink: #0B1220;
  --yc-text: #172033;
  --yc-muted: #5D6675;
  --yc-border: #D7DEE9;
  --yc-border-soft: rgba(2, 35, 94, 0.12);
  --yc-accent-warm: #E8A13A;

  /* Semantic aliases. */
  --yc-brand: var(--yc-primary-blue);
  --yc-brand-dark: var(--yc-deep-navy);
  --yc-brand-light: var(--yc-cyan-blue);
  --yc-focus: var(--yc-cyan-blue);

  /* Gradients. */
  --yc-gradient-brand: linear-gradient(135deg, var(--yc-deep-navy) 0%, var(--yc-primary-blue) 55%, var(--yc-cyan-blue) 100%);
  --yc-gradient-soft: radial-gradient(circle at top left, rgba(2, 129, 219, 0.16), transparent 34%), linear-gradient(180deg, #ffffff 0%, #f7fafc 100%);
  --yc-gradient-card: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(247,250,252,0.92));

  /* Typography. */
  --yc-font-heading: "Montserrat", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --yc-font-body: "Ubuntu", "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --yc-text-xs: clamp(0.72rem, 0.69rem + 0.08vw, 0.78rem);
  --yc-text-sm: clamp(0.82rem, 0.78rem + 0.12vw, 0.9rem);
  --yc-text-md: clamp(0.94rem, 0.9rem + 0.18vw, 1.03rem);
  --yc-text-lg: clamp(1.02rem, 0.96rem + 0.3vw, 1.2rem);
  --yc-text-xl: clamp(1.16rem, 1.05rem + 0.55vw, 1.42rem);
  --yc-text-2xl: clamp(1.38rem, 1.2rem + 0.9vw, 1.85rem);
  --yc-text-3xl: clamp(1.75rem, 1.42rem + 1.55vw, 2.7rem);
  --yc-text-4xl: clamp(2.2rem, 1.55rem + 3.1vw, 4.35rem);
  --yc-text-display: clamp(2.65rem, 1.75rem + 4.2vw, 5.75rem);

  /* Layout. */
  --yc-container-sm: 720px;
  --yc-container-md: 960px;
  --yc-container-lg: 1180px;
  --yc-container-xl: 1320px;
  --yc-gutter: clamp(1rem, 4vw, 2rem);
  --yc-section-padding: clamp(4rem, 7vw, 7.5rem);
  --yc-section-padding-sm: clamp(2.75rem, 5vw, 5rem);
  --yc-section-min-height: calc(100svh - var(--yc-header-height) - var(--yc-admin-offset));

  /* Spacing. */
  --yc-space-1: 0.25rem;
  --yc-space-2: 0.5rem;
  --yc-space-3: 0.75rem;
  --yc-space-4: 1rem;
  --yc-space-5: 1.25rem;
  --yc-space-6: 1.5rem;
  --yc-space-8: 2rem;
  --yc-space-10: 2.5rem;
  --yc-space-12: 3rem;
  --yc-space-16: 4rem;
  --yc-space-20: 5rem;
  --yc-space-24: 6rem;

  /* Shape. */
  --yc-radius-xs: 0.375rem;
  --yc-radius-sm: 0.5rem;
  --yc-radius-md: 0.875rem;
  --yc-radius-lg: 1.25rem;
  --yc-radius-xl: 1.75rem;
  --yc-radius-pill: 999px;

  /* Shadows. */
  --yc-shadow-xs: 0 2px 10px rgba(2, 35, 94, 0.05);
  --yc-shadow-sm: 0 8px 24px rgba(2, 35, 94, 0.08);
  --yc-shadow-md: 0 18px 45px rgba(2, 35, 94, 0.12);
  --yc-shadow-lg: 0 30px 80px rgba(2, 35, 94, 0.16);

  /* Motion. */
  --yc-motion-fast: 150ms;
  --yc-motion-normal: 240ms;
  --yc-motion-slow: 420ms;
  --yc-ease-out: cubic-bezier(0.16, 1, 0.3, 1);

  /* Header. */
  --yc-header-height: 82px;
  --yc-admin-offset: 0px;
}

.admin-bar {
  --yc-admin-offset: 32px;
}

@media (max-width: 782px) {
  .admin-bar {
    --yc-admin-offset: 46px;
  }
}


/* v0.3 laptop-first responsive refinements */
@media (max-width: 1440px) {
  :root {
    --yc-header-height: 72px;
    --yc-gutter: clamp(1rem, 3vw, 1.65rem);
    --yc-section-padding: clamp(3.5rem, 6vw, 6rem);
    --yc-section-padding-sm: clamp(2.25rem, 4.5vw, 4rem);
    --yc-text-xs: clamp(0.70rem, 0.68rem + 0.06vw, 0.76rem);
    --yc-text-sm: clamp(0.78rem, 0.75rem + 0.10vw, 0.86rem);
    --yc-text-md: clamp(0.88rem, 0.84rem + 0.14vw, 0.98rem);
    --yc-text-lg: clamp(0.96rem, 0.90rem + 0.22vw, 1.10rem);
    --yc-text-xl: clamp(1.06rem, 0.98rem + 0.34vw, 1.26rem);
    --yc-text-2xl: clamp(1.20rem, 1.08rem + 0.55vw, 1.55rem);
    --yc-text-3xl: clamp(1.55rem, 1.28rem + 1.05vw, 2.18rem);
    --yc-text-4xl: clamp(1.95rem, 1.45rem + 1.9vw, 3.05rem);
    --yc-text-display: clamp(2.15rem, 1.45rem + 2.55vw, 3.65rem);
  }
}

@media (max-width: 1440px) and (max-height: 820px) {
  :root {
    --yc-header-height: 68px;
    --yc-section-padding: clamp(3rem, 5vw, 5rem);
    --yc-section-padding-sm: clamp(2rem, 4vw, 3.25rem);
    --yc-text-3xl: clamp(1.45rem, 1.18rem + 0.95vw, 2.02rem);
    --yc-text-4xl: clamp(1.85rem, 1.38rem + 1.7vw, 2.76rem);
    --yc-text-display: clamp(2.05rem, 1.42rem + 2.18vw, 3.16rem);
  }
}

@media (max-width: 782px) {
  :root {
    --yc-header-height: 66px;
    --yc-text-display: clamp(2rem, 1.32rem + 7vw, 3rem);
  }
}