/* The original Lightning blueprint uses the foundation's canonical component styles. */

.ocf-hero__eyebrow {
    display: none;
}

/* Harbor tokens: final shared rules and responsive variants. */
:root {
  --container-max: 1440px;
  --container-pad: 72px;
  --section-pad: var(--ocf-section-pad, 96px);
  --font-body-size: var(--ocf-font-body-size, 18px);
}

@media (min-width: 1800px) {
  :root {
    --container-max: 1600px;
  }
}

@media (max-width: 1199px) {
  :root {
    --container-pad: 32px;
    --section-pad: 64px;
  }
}

@media (max-width: 599px) {
  :root {
    --container-pad: 24px;
    --section-pad: 56px;
    --font-body-size: 16px;
  }
}

html[data-theme="dark"] {
  --hb-accent-text: var(--ocf-secondary);
  --ocf-bg-alt: color-mix(in srgb, var(--ocf-bg) 97%, #fff 3%);
  --hb-bg-soft: color-mix(in srgb, var(--ocf-bg) 98%, #fff 2%);
}

:root {
  --font-heading: var(--ocf-font-heading), sans-serif;
  --font-body: var(--ocf-font-body), sans-serif;
  --font-h2-size: var(--ocf-font-h2-size, 44px);
  --font-h3-size: var(--ocf-font-h3-size, 26px);
  --button-shadow: var(--ocf-button-shadow, none);
  --button-shadow-hover: var(--ocf-button-shadow-hover, none);
  --card-shadow: var(--ocf-card-shadow, none);
  --image-shadow: var(--ocf-image-shadow, var(--card-shadow));
  --font-weight-bold: 500;
  --hb-accent-text: var(--ocf-primary);
  --hb-hero-warm-neutral: #d8c9b7;
  --ocf-font-eyebrow-size: 20px;
  --ocf-review-star-color: #fbbc04;
  --ocf-bg-alt: color-mix(in srgb, var(--ocf-bg) 97%, #000 3%);
  --hb-bg-soft: color-mix(in srgb, var(--ocf-bg) 98%, #000 2%);
  --hb-button-width: 220px;
  --ocf-radius: 8px;
  --ocf-radius-sm: 8px;
  --ocf-radius-lg: 8px;
  --ocf-card-radius: 8px;
  --ocf-card-radius-lg: 8px;
  --ocf-image-radius: 8px;
  --ocf-button-radius: 8px;
  --hb-radius: var(--ocf-radius, 8px);
  --hb-control-radius: var(--ocf-radius, 8px);
}
