/* The Cliff — base: tokens, reset, typography, utilities
   Visual language rebuilt faithfully from an Escapora-style editorial travel layout:
   warm off-white canvas, single orange accent, two-tone display headings,
   sharp-cornered image cards, Poppins throughout. */

:root {
  --bg: #ffffff;
  --alt: #f9f5f4;            /* warm off-white section band */
  --dark: #141210;          /* near-black feature/CTA bands */
  --ink: #15110f;           /* body text */
  --muted: #6c655f;         /* secondary copy */
  --faint: #9a938c;
  --line: #e9e3df;          /* hairline borders */
  --line-dark: rgba(255,255,255,.16);

  --accent: #ef6640;        /* brand orange */
  --accent-2: #ff9c2a;      /* gradient partner / highlight */
  --accent-ink: #cf4a28;    /* darker orange for text on light (AA) */

  --radius-btn: 100px;      /* pill buttons */
  --radius-card: 0px;       /* sharp image cards (template tell) */
  --radius-soft: 14px;      /* panels */

  --container: 1300px;
  --gutter: 20px;
  --pad-y: clamp(56px, 8vw, 96px);

  --font: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;

  --ease-out: cubic-bezier(.165, .84, .44, 1);   /* Webflow outQuart */
  --ease-soft: cubic-bezier(.33, 1, .68, 1);
}

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.6;
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

img, picture, svg, iframe { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; cursor: pointer; background: none; border: 0; }
input, textarea, select { font: inherit; color: inherit; }
ul { list-style: none; padding: 0; }

h1, h2, h3, h4 { font-weight: 500; line-height: 1.08; letter-spacing: -.02em; }

h1 {
  font-size: clamp(2.6rem, 6.4vw, 5rem);
  letter-spacing: -.035em;
  line-height: 1.04;
}
h2 {
  font-size: clamp(2.1rem, 5vw, 4rem);
  line-height: 1.08;
}
h3 { font-size: clamp(1.4rem, 2.6vw, 2.5rem); font-weight: 400; letter-spacing: -.02em; }

p { color: var(--muted); }
strong { font-weight: 600; color: var(--ink); }

/* two-tone display heading: second half in brand orange */
.tint { color: var(--accent); }

/* ---- layout utilities ---- */
.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--gutter); }
.section { padding-block: var(--pad-y); }
.section--alt { background: var(--alt); }
.section--dark { background: var(--dark); color: #fff; }
.section--tight { padding-block: clamp(40px, 6vw, 64px); }

.eyebrow {
  font-size: .72rem; font-weight: 600; letter-spacing: .18em;
  text-transform: uppercase; color: var(--accent-ink);
}
.section--dark .eyebrow { color: var(--accent-2); }

.lede { font-size: clamp(1rem, 1.4vw, 1.12rem); color: var(--muted); max-width: 54ch; }
.section--dark .lede, .section--dark p { color: rgba(255,255,255,.72); }

.head-center { max-width: 640px; margin-inline: auto; text-align: center; }
.head-center .lede { margin: 14px auto 0; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; border-radius: 3px; }

/* ---- Lenis smooth scroll (reference parity) ---- */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: clip; }

/* offset anchored sections for the fixed header on hash navigation */
section[id], [id].section, main [id] { scroll-margin-top: 92px; }
