/* Visit Cocos Island theme: "Abyss". The ONE place for every colour, font, size and shadow on the site.
   Change a value here and the whole site follows. Layout and components: site.css. */
:root {
  /* colour */
  --ab-ink: #e8f3f6; --ab-dim: #9bb7c2; --ab-glow: #3ee6d0; --ab-glow-soft: rgba(62, 230, 208, .16);
  --ab-sea-0: #05141c; --ab-sea-1: #071d29; --ab-sea-2: #0b2a3a; --ab-sea-3: #10364a; --ab-trench: #02090d;
  --ab-line: rgba(155, 183, 194, .18); --ab-badge: #f4f8f9; --ab-veil: rgba(5, 20, 28, .4); --ab-overlay: rgba(2, 9, 13, .94);
  --ab-shade: linear-gradient(180deg, rgba(5, 20, 28, .25) 0%, rgba(5, 20, 28, .6) 55%, var(--ab-sea-0) 100%);
  --ab-plain: radial-gradient(120% 90% at 20% 0%, var(--ab-sea-3), var(--ab-sea-0) 70%);
  --ab-shadow: 0 2px 12px #000;
  /* type */
  --ab-display: "Fraunces", Georgia, serif; --ab-body: "Manrope", system-ui, sans-serif;
  --ab-base: 16px; --ab-read: 18px; --ab-lede-size: 19px; --ab-small: 13px; --ab-tiny: 11px;
  --ab-h1: clamp(48px, 9vw, 128px); --ab-h1-page: clamp(36px, 6vw, 76px); --ab-h2: clamp(30px, 4vw, 54px);
  --ab-h2-read: clamp(26px, 3vw, 34px); --ab-h3: 22px; --ab-h3-read: 22px;
  /* space and shape */
  --ab-max: 1320px; --ab-read-max: 720px; --ab-gut: clamp(16px, 4vw, 48px); --ab-gap: clamp(14px, 2vw, 24px);
  --ab-r: 14px; --ab-pill: 999px; --ab-sec-pad: 96px; --ab-hero-h: 100vh; --ab-hero-post: 78vh; --ab-hero-small: 52vh;
  --ab-float: 42%; --ab-logo-h: 58px; --ab-logo-h-phone: 46px; --ab-logo-foot: 64px; --ab-press-h: 52px;
}
