/* NukuBafaan design tokens.
   Single source of truth. Vik's brand bible may change these.
   Changing a value here changes it everywhere. */

:root {
  /* Colour, taken from the logo SVG source, not from memory */
  --orange:          #F06823;  /* the only accent */
  --orange-body-bg:  #F06823;  /* background behind body paragraphs on orange.
                                  Set to #C4551D to take white body copy to 4.50:1
                                  and clear the AA failure. Currently matches
                                  --orange by client decision, see README Job 6. */
  --ink:             #272A2B;  /* not pure black */
  --body:            #4a5052;
  --white:           #ffffff;
  --wash:            #FDF3EC;  /* one tinted section only, the client logo band */
  --hairline:        #e9e9e9;
  --orange-on-wash:  #B5490F;  /* same hue as --orange, 4.89:1 on --wash */
  --muted:           #6d7477;  /* scroll cue and quiet labels, 4.5:1 on white */
  --muted-on-wash:   #6b6259;
  --placeholder:     #cfcfcf;  /* form field placeholder text */
  --error:           #B3261E;  /* form validation only. Added in Job 7, the
                                  design had no error state. 6.2:1 on white.
                                  Vik's brand bible may want to change it. */

  /* Channels for the translucent surfaces below. Same two colours, nothing new. */
  --ink-rgb:   39, 42, 43;
  --white-rgb: 255, 255, 255;

  /* Translucent surfaces and shadows, all derived from the two channels above */
  --nav-scrolled-bg: rgba(var(--white-rgb), .82);
  --rail-dot:        rgba(var(--ink-rgb), .35);
  --rail-dot-dark:   rgba(var(--white-rgb), .7);
  --footer-hairline: rgba(var(--white-rgb), .35);
  --hairline-on-ink: rgba(var(--white-rgb), .18);  /* card and row rules on an --ink ground.
                                                      --hairline is invisible there and
                                                      --footer-hairline at .35 is too loud. */
  --shadow-card:     0 14px 30px rgba(var(--ink-rgb), .07);
  --shadow-tile:     0 12px 26px rgba(var(--ink-rgb), .09);
  --shadow-team:     drop-shadow(0 14px 22px rgba(var(--ink-rgb), .28));

  /* Type */
  --font-display: "Acens", sans-serif;   /* all uppercase, never condensed */
  --font-body:    "Poppins", sans-serif; /* paragraph copy only */

  --fs-h1:        clamp(44px, 6.4vw, 94px);
  --lh-h1:        1.0;
  --fs-h2:        clamp(31px, 4.1vw, 55px);
  --fs-h3:        clamp(26px, 3.1vw, 43px);
  --fs-statement: clamp(38px, 5.9vw, 82px);
  --fs-body:      clamp(14px, 1.05vw, 15.5px);
  --lh-body:      1.78;
  --fs-label:     11px;
  --ls-label:     2.6px;

  /* Component type scale, lifted out of the approved design in Job 1 so that
     no size, tracking or line height is hardcoded outside this file. */
  --fs-kicker:         clamp(11px, 1vw, 13px);
  --fs-hero-h2:        clamp(28px, 3.3vw, 46px);
  --fs-cta-h2:         clamp(24px, 3.1vw, 42px);
  --fs-contact-h1:     clamp(36px, 4.9vw, 68px);
  --fs-thanks-h1:      clamp(38px, 5.4vw, 76px);
  --fs-lockup:         clamp(34px, 3.9vw, 54px);
  --fs-standout:       clamp(17px, 1.8vw, 24px);
  --fs-team-name:      clamp(15px, 1.4vw, 19px);
  --fs-nav:            13px;
  --fs-nav-panel:      20px;
  --fs-menu-close:     22px;
  --fs-btn:            13px;
  --fs-btn-outline:    12.5px;
  --fs-card-title:     17px;
  --fs-numeral:        30px;  /* the 01 to 04 card numerals in the brand bible section */
  --fs-field:          14px;
  --fs-placeholder:    11.5px;
  --fs-cue:            10.5px;
  --fs-addr:           12px;
  --fs-footer-word:    34px;
  --fs-footer-name:    15px;
  --fs-footer-body:    13.5px;
  --fs-micro:          10px;
  --fs-micro-sm:       9.5px;

  --lh-h2:         1.05;
  --lh-h3:         1.1;
  --lh-hero-h2:    1.06;
  --lh-cta-h2:     1.08;
  --lh-contact-h1: 1.02;
  --lh-thanks-h1:  1.04;
  --lh-statement:  1.06;
  --lh-lockup:     .94;
  --lh-card-title: 1.25;
  --lh-standout:   1.25;
  --lh-addr:       2;
  --lh-footer:     1.9;

  --ls-h1:          .5px;
  --ls-tight:       .6px;
  --ls-name:        1px;
  --ls-footer-name: 1.4px;
  --ls-nav:         1.6px;
  --ls-btn:         2px;
  --ls-role:        2.2px;
  --ls-field:       2.4px;
  --ls-lockup:      5px;
  --ls-lockup-sm:   4.4px;

  --fw-display: 400;   /* Acens has one weight */
  --fw-light:   300;   /* Poppins Light, paragraph copy */

  /* Shape and rhythm */
  --radius-card:  20px;
  --radius-tile:  14px;
  --radius-pill:  26px;
  --radius-field: 24px;
  --radius-map:   4px;
  --gutter:       clamp(20px, 5vw, 64px);
  --maxw:         1240px;
  --band-slope:   5vw;   /* diagonal on the welcome band */
  --nav-h:        92px;
  --nav-h-small:  68px;
  --logo-h:       52px;
  --logo-h-small: 40px;

  /* Motion */
  --rise:         18px;
  --stagger:      80ms;
  --ease-reveal:  cubic-bezier(.2,.7,.3,1);
  --ease-wipe:    cubic-bezier(.65,0,.2,1);
  --dur-reveal:   .7s;
  --dur-wipe:     1.05s;
  --dur-nav:      .35s;
  --dur-hover:    .25s;
  --dur-card:     .3s;
  --dur-menu:     .4s;
  --ease-menu:    cubic-bezier(.6,0,.2,1);
}
