@font-face { font-family: "Instrument Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/instrument-sans-400.woff2") format("woff2"); }
@font-face { font-family: "Instrument Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/instrument-sans-500.woff2") format("woff2"); }
/* Hedgelore holding page: shared styles
   Tokens and components from the Hedgelore component library. */
@font-face { font-family: "Trust 3A"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/trust-3a-regular.woff2") format("woff2"); }
@font-face { font-family: "Trust 3A"; font-style: italic; font-weight: 400; font-display: swap; src: url("fonts/trust-3a-italic.woff2") format("woff2"); }

:root {
  color-scheme: light;
  --hl-primrose: #f2e98a;
  --hl-wood: #2b1408;
  --hl-n-50: #ffffff; --hl-n-100: #f8f8f6; --hl-n-200: #e9e4e2; --hl-n-300: #dad2cd; --hl-n-400: #b9a590;
  --hl-n-500: #9f8368; --hl-n-600: #7a5f4d; --hl-n-700: #534038; --hl-n-800: #483934; --hl-n-900: #110803;
  --hl-wild-rose: #ce7e96; --hl-calendula: #d98d4a; --hl-hawthorn: #99a659; --hl-cornflower: #8cb1d9; --hl-heather: #b38bc1;
  --hl-elderberry: #531c2a; --hl-rowan: #532b11; --hl-moss: #354020; --hl-bilberry: #262d40; --hl-blackthorn: #442244;
  --need-foundation: var(--hl-hawthorn); --need-digestion: var(--hl-cornflower); --need-energy: var(--hl-primrose);
  --need-calm: var(--hl-heather); --need-vitality: var(--hl-calendula); --need-skin: var(--hl-wild-rose);

  --font-display: "Trust 3A", Georgia, serif;
  --font-sans: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

  --gutter: clamp(1rem, 0.6286rem + 1.5238vw, 2rem);
  --indent: clamp(2.375rem, 0.2857rem + 8.5714vw, 8rem);
  --display: clamp(2.75rem, 1.45rem + 5.3333vw, 6.25rem);
  --numeral: clamp(5.5rem, 3.6429rem + 7.619vw, 10.5rem);
  --title: clamp(2.75rem, 2.1rem + 2.6667vw, 4.5rem);
  --h1: clamp(2.5rem, 1.9429rem + 2.2857vw, 4rem);
  --h2: clamp(1.875rem, 1.4571rem + 1.7143vw, 3rem);
  --h3: clamp(1.5rem, 1.1286rem + 1.5238vw, 2.5rem);
  --h4: clamp(1.25rem, 0.9714rem + 1.1429vw, 2rem);
  --h5: clamp(1.125rem, 0.9857rem + 0.5714vw, 1.5rem);
  --body-lg: clamp(1rem, 0.9071rem + 0.381vw, 1.25rem);
  --body-md: clamp(0.875rem, 0.8286rem + 0.1905vw, 1rem);
  --body-sm: clamp(0.75rem, 0.7036rem + 0.1905vw, 0.875rem);
  --label-md: clamp(0.6875rem, 0.6643rem + 0.0952vw, 0.75rem);
  --label-sm: 0.6875rem;
  --tap: 44px;

  --ease: cubic-bezier(0, 0, 0.2, 1);
  --t-state: 200ms; --t-card: 250ms; --t-panel: 300ms;
}
@media (prefers-reduced-motion: reduce) { :root { --t-state: 0ms; --t-card: 0ms; --t-panel: 0ms; } }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--hl-n-100); color: var(--hl-wood); font-family: var(--font-sans); font-size: var(--body-md); line-height: 1.3; }
img, video { max-width: 100%; display: block; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
:focus-visible { outline: 2px solid var(--hl-wood); outline-offset: 3px; }
.on-dark :focus-visible { outline-color: var(--hl-primrose); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.gut { padding-left: max(var(--gutter), env(safe-area-inset-left, 0px)); padding-right: max(var(--gutter), env(safe-area-inset-right, 0px)); }

/* Type */
.statement { font-family: var(--font-display); font-weight: 400; line-height: 0.9; margin: 0; text-wrap: balance; padding-block: 0.04em; }
.statement em { display: block; font-style: italic; padding-inline-start: var(--indent); }
.lbl { font-family: var(--font-sans); font-weight: 500; text-transform: uppercase; letter-spacing: 0.02em; line-height: 1.2; font-size: var(--label-md); }
.lbl-sm { font-size: var(--label-sm); letter-spacing: 0.03em; }
.num { font-variant-numeric: lining-nums tabular-nums; }

/* Buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 16px 24px; border-radius: 100px; font-size: var(--label-md); font-weight: 500; letter-spacing: 0.02em; text-transform: uppercase; line-height: 1.2; white-space: nowrap; border: 1px solid transparent; transition: background-color var(--t-state) var(--ease), color var(--t-state) var(--ease), border-color var(--t-state) var(--ease); text-decoration: none; }
.btn--sm { padding: 10px 16px; }
@media (max-width: 767px) { .btn { padding: 14px 20px; min-height: var(--tap); } .btn--sm { padding: 9px 14px; } }
.btn--dark.btn--solid { background: var(--hl-wood); color: var(--hl-n-100); }
.btn--dark.btn--solid:hover { background: var(--hl-n-700); }
.btn--dark.btn--outline { border-color: var(--hl-wood); color: var(--hl-wood); }
.btn--dark.btn--outline:hover { background: var(--hl-wood); color: var(--hl-n-100); }
.btn--light.btn--solid { background: var(--hl-primrose); color: var(--hl-wood); }
.btn--light.btn--solid:hover { background: var(--hl-n-50); }
.btn--light.btn--outline { border-color: var(--hl-primrose); color: var(--hl-primrose); }
.btn--light.btn--outline:hover { border-color: var(--hl-n-50); color: var(--hl-n-50); }

/* Email field (snippet/email-field), dark ink and light ink */
.efield { width: min(448px, 100%); display: grid; gap: 8px; }
.efield .field { display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid currentColor; padding-block: 14px; }
.efield .field:focus-within { border-bottom-width: 2px; padding-bottom: 13px; }
.efield input { flex: 1; min-width: 0; border: 0; background: none; font: inherit; font-size: var(--body-md); line-height: 1.3; color: inherit; padding: 0; outline: none; }
.efield input::placeholder { color: var(--hl-n-600); opacity: 1; }
.efield .go { display: inline-flex; align-items: center; gap: 4px; font-size: var(--label-md); font-weight: 500; letter-spacing: 0.02em; text-transform: uppercase; white-space: nowrap; min-height: var(--tap); }
.efield .go svg { width: 16px; height: 16px; transition: transform var(--t-state) var(--ease); }
.efield .go:hover svg { transform: translateX(4px); }
.efield { position: relative; }
/* The message hangs below the line, so the line itself lines up with neighbouring text */
.efield .msg { position: absolute; left: 0; right: 0; top: 100%; padding-top: 6px; font-size: 0.75rem; line-height: 1.4; margin: 0; }
.efield[data-state="error"] .field { border-bottom-color: var(--hl-elderberry); }
.efield[data-state="error"] .msg { color: var(--hl-elderberry); }
.efield .done { display: none; align-items: center; gap: 12px; border-bottom: 1px solid currentColor; padding-block: 14px; font-size: var(--body-md); }
.efield .done svg { width: 20px; height: 20px; flex: none; }
.efield[data-state="success"] .field { display: none; }
.efield[data-state="success"] .done { display: flex; }
.efield--light { color: var(--hl-n-100); }
.efield--light input::placeholder { color: var(--hl-n-400); }
.efield--light[data-state="error"] .field { border-bottom-color: var(--hl-wild-rose); }
.efield--light[data-state="error"] .msg { color: var(--hl-wild-rose); }
@media (pointer: coarse), (max-width: 767px) { .efield input { font-size: 16px; } }

/* Fine print */
.fine { font-size: 0.75rem; line-height: 1.4; color: var(--hl-n-600); margin: 0; max-width: 46ch; }
.on-dark .fine { color: var(--hl-n-400); }

/* Video stage */
.stage { position: relative; isolation: isolate; background: var(--hl-moss); overflow: hidden; }
.stage__media { position: absolute; inset: 0; z-index: -2; }
.stage__media video, .stage__media img { width: 100%; height: 100%; object-fit: cover; }
.stage__shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(17,8,3,0.55) 0%, rgba(17,8,3,0.05) 35%, rgba(17,8,3,0.1) 55%, rgba(17,8,3,0.7) 100%); }

/* Concept bar: review only, removed before going live */
.cbar { transition: transform 0.4s var(--ease), opacity 0.4s var(--ease); }
.cbar.is-away { transform: translateY(calc(100% + 24px)); opacity: 0; }
.cbar { position: fixed; z-index: 90; right: max(12px, env(safe-area-inset-right, 0px)); bottom: calc(12px + env(safe-area-inset-bottom, 0px)); display: flex; align-items: center; gap: 2px; padding: 4px; border-radius: 100px; background: rgba(17, 8, 3, 0.86); color: var(--hl-n-100); font-family: var(--font-sans); font-size: 0.75rem; box-shadow: 0 8px 24px rgba(17,8,3,0.3); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); max-width: calc(100vw - 24px); }
.cbar a { color: inherit; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; min-width: 36px; height: 36px; padding: 0 12px; border-radius: 100px; white-space: nowrap; }
.cbar a:hover { background: rgba(248, 248, 246, 0.14); }
.cbar .cbar__name { padding: 0 8px; font-weight: 500; letter-spacing: 0.02em; text-transform: uppercase; font-size: 0.6875rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cbar :focus-visible { outline-color: var(--hl-primrose); }
