/* ==========================================================================
   Raghu College of Pharmacy — design tokens
   Every value here is lifted from artboard 01 of the design canvas.
   Nothing outside this file may declare a raw colour, font or radius.
   ========================================================================== */

:root {
  /* ---- Colour -------------------------------------------------------- */
  --rcp-ink:          #16293D;  /* 14.80:1 on white — headings, running text */
  --rcp-ink-mid:      #25405C;  /* 10.68:1 on white — nav, secondary surfaces */
  --rcp-ink-deep:     #112133;  /* footer — one step below ink                */

  --rcp-accent:       #4E8B2C;  /*  4.16:1 — GRAPHICS ONLY. Never text.       */
  --rcp-accent-deep:  #467C27;  /*  5.03:1 on white — all green text & links  */
  --rcp-accent-light: #8FC15A;  /*  7.01:1 on ink — text/rules on navy only   */
  --rcp-signal:       #B0402A;  /*  5.81:1 — Apply Now, CTA, urgent notices   */

  --rcp-page:         #FFFFFF;
  --rcp-surface:      #F7F8F6;
  --rcp-hairline:     #ECEEEA;
  --rcp-divider:      #C9CEC7;
  --rcp-muted:        #5B6560;  /*  6.04:1 on white — secondary copy          */
  --rcp-on-dark:      #C9CEC7;  /* body copy inside navy sections             */
  --rcp-on-dark-dim:  #8A9490;  /* footer bottom bar                          */

  /* Tinted fills — derived, never hand-picked */
  --rcp-accent-wash:  rgba(78, 139, 44, .14);
  --rcp-accent-tint:  rgba(143, 193, 90, .24);
  --rcp-signal-wash:  rgba(176, 64, 42, .05);
  --rcp-signal-tint:  rgba(176, 64, 42, .12);
  --rcp-hairline-dark: rgba(255, 255, 255, .16);
  --rcp-signal-hover: #94341F;

  /* ---- Type ---------------------------------------------------------- */
  --rcp-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --rcp-sans:  "Source Sans 3", "Segoe UI", system-ui, -apple-system, sans-serif;
  --rcp-mono:  ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Desktop scale — size / line-height pairs from the brief */
  --rcp-display:    3.75rem;  --rcp-display-lh:    4rem;      /* 60 / 64 */
  --rcp-h1:         2.75rem;  --rcp-h1-lh:         3.125rem;  /* 44 / 50 */
  --rcp-h2:         2rem;     --rcp-h2-lh:         2.5rem;    /* 32 / 40 */
  --rcp-h3:         1.5rem;   --rcp-h3-lh:         2rem;      /* 24 / 32 */
  --rcp-h4:         1.1875rem;--rcp-h4-lh:         1.75rem;   /* 19 / 28 */
  --rcp-body-l:     1.125rem; --rcp-body-l-lh:     1.875rem;  /* 18 / 30 */
  --rcp-body:       1rem;     --rcp-body-lh:       1.6875rem; /* 16 / 27 */
  --rcp-small:      0.875rem; --rcp-small-lh:      1.375rem;  /* 14 / 22 */
  --rcp-eyebrow:    0.75rem;  --rcp-eyebrow-lh:    1rem;      /* 12 / 16 */
  --rcp-stat:       3.25rem;  --rcp-stat-lh:       3.5rem;    /* 52 / 56 */

  /* Micro-label tier — chrome only, never running prose */
  --rcp-micro:      0.8125rem;--rcp-micro-lh:      1.25rem;   /* 13 / 20 */
  --rcp-micro-sm:   0.6875rem;--rcp-micro-sm-lh:   1.0625rem; /* 11 / 17 */
  --rcp-micro-xs:   0.625rem; --rcp-micro-xs-lh:   1rem;      /* 10 / 16 */

  --rcp-tracking-eyebrow: .08em;
  --rcp-tracking-tight:  -.01em;
  --rcp-measure: 68ch;

  /* ---- Space — 8px base --------------------------------------------- */
  --rcp-1: 0.25rem;  /*  4 */
  --rcp-2: 0.5rem;   /*  8 */
  --rcp-3: 1rem;     /* 16 */
  --rcp-4: 1.5rem;   /* 24 */
  --rcp-5: 2rem;     /* 32 */
  --rcp-6: 3rem;     /* 48 */
  --rcp-7: 4rem;     /* 64 */
  --rcp-8: 6rem;     /* 96 */
  --rcp-9: 7.5rem;   /* 120 */

  /* ---- Layout ------------------------------------------------------- */
  --rcp-content: 1280px;
  --rcp-gutter: 1.5rem;   /* 24 */
  --rcp-margin: 5rem;     /* 80 desktop — (1440 - 1280) / 2 */
  --rcp-margin-sm: 2rem;  /* 32 minimum */
  --rcp-section: var(--rcp-8);      /* 96  */
  --rcp-section-lg: var(--rcp-9);   /* 120 */

  /* ---- Form language ------------------------------------------------ */
  --rcp-radius: 4px;        /* controls */
  --rcp-radius-card: 6px;   /* cards    */
  --rcp-radius-flat: 0;     /* images, tables */
  --rcp-border: 1px solid var(--rcp-hairline);
  --rcp-border-strong: 1px solid var(--rcp-divider);
  --rcp-elev: 0 1px 2px rgba(22, 41, 61, .06), 0 8px 24px rgba(22, 41, 61, .06);
  --rcp-scrim: linear-gradient(180deg, rgba(22, 41, 61, .24) 0%, rgba(22, 41, 61, .78) 100%);

  /* Control heights — never below 44 on touch */
  --rcp-control-lg: 3rem;    /* 48 */
  --rcp-control: 2.75rem;    /* 44 */
  --rcp-control-sm: 2.5rem;  /* 40 */

  /* ---- Focus -------------------------------------------------------- */
  --rcp-focus: 2px solid var(--rcp-accent);
  --rcp-focus-offset: 2px;

  /* ---- Motion ------------------------------------------------------- */
  --rcp-ease: cubic-bezier(.2, .6, .3, 1);
  --rcp-fast: 200ms;
  --rcp-slow: 300ms;
  --rcp-rise: 12px;
}

/* Mobile scale — only the display steps compress. Body never shrinks. */
@media (max-width: 767px) {
  :root {
    --rcp-display: 2.25rem;  --rcp-display-lh: 2.625rem; /* 36 / 42 */
    --rcp-h1:      1.75rem;  --rcp-h1-lh:      2.25rem;  /* 28 / 36 */
    --rcp-h2:      1.75rem;  --rcp-h2-lh:      2.25rem;  /* 28 / 36 */
    --rcp-h3:      1.5rem;   --rcp-h3-lh:      2rem;     /* 24 / 32 */
    --rcp-h4:      1.125rem; --rcp-h4-lh:      1.625rem; /* 18 / 26 */
    --rcp-stat:    2.375rem; --rcp-stat-lh:    2.625rem; /* 38 / 42 */

    --rcp-margin: var(--rcp-margin-sm);
    --rcp-section: 3.75rem;    /* 60 */
    --rcp-section-lg: 4rem;    /* 64 */
  }
}

@media (min-width: 768px) and (max-width: 1119px) {
  :root {
    --rcp-display: 3rem;    --rcp-display-lh: 3.25rem; /* 48 / 52 */
    --rcp-h1:      2.25rem; --rcp-h1-lh:      2.75rem; /* 36 / 44 */
    --rcp-margin: var(--rcp-4);
    --rcp-section: var(--rcp-7);
    --rcp-section-lg: var(--rcp-8);
  }
}
