/* ── CSS Custom Properties ─────────────────────────────────────────────────── *
 * Single source of truth for all design tokens.
 *
 * Colors use raw R,G,B channels so they compose with rgb(var(--x)) and
 * rgba(var(--x), alpha) throughout the stylesheet.
 *
 * The WordPress admin panel (Appearance → Theme Customizer) overrides the
 * values below at runtime via wp_head. Edit defaults here; live values in
 * the admin panel. Every variable used anywhere in the theme must have a
 * default defined here.
 * ────────────────────────────────────────────────────────────────────────── */

:root {
  /* ── Base — Brand Colors ──────────────────────────────────────────────── */
  --bg-body: #fff; /* dark background */
  --color-body: #000; /* body text */
  --color-heading: #fff; /* headings */
  --color-link: 255, 255, 255; /* links */
  --color-border: 255, 255, 255; /* borders (used with alpha) */
  --alpha-border: 0.1;
  --color-shadow: 0, 0, 0;
  --media-overlay-gradient-mobile: none;
  --media-overlay-gradient-desktop: none;

  /* ── Base — Typography ────────────────────────────────────────────────── */
  --font-body-family: "Jost", sans-serif;
  --font-body-style: normal;
  --font-body-weight: 400;
  --font-body-scale: 1;
  --font-heading-family: "Poppins", sans-serif;
  --font-heading-style: normal;
  --font-heading-weight: 700;
  --font-heading-scale: 1;
  --font-heading-letter-spacing: -0.02em;
  --font-heading-text-transform: none;
  --font-weight-normal: 400;
  --font-weight-bold: 700;
  --font-italic-family: "Jost", sans-serif;
  --font-italic-style: italic;
  --font-italic-weight: 400;
  --font-italic-scale: 1;
  --font-button-family: "Jost", sans-serif;

  /* ── Base — Font Size Scale ───────────────────────────────────────────── */
  --font-size-static-extra-small: 1.1rem;
  --font-size-static-small: 1.3rem;
  --font-size-static-medium: 1.5rem;
  --font-size-static-large: 1.8rem;
  --font-size-static-extra-large: 2.4rem;
  --font-size-static-2x-large: 3.2rem;
  --font-size-static-h1: 3.2rem;
  --font-size-static-h2: 2.8rem;
  --font-size-static-h3: 2.4rem;
  --font-size-static-h4: 2rem;
  --font-size-static-h5: 1.8rem;
  --font-size-static-h6: 1.6rem;
  --font-size-static-h7: 1.4rem;

  /* ── Base — Spacing & Rhythm ──────────────────────────────────────────── */
  --letter-spacing-small: 0.13rem;
  --letter-spacing-medium: 0.05rem;
  --h1-multiplier: 8rem;
  --h2-multiplier: 6.1rem;
  --h3-multiplier: 4.7rem;
  --h4-multiplier: 3.6rem;
  --h5-multiplier: 2.7rem;
  --h6-multiplier: 2.1rem;
  --line-height-h1: 0.87;
  --line-height-h2: 0.87;
  --line-height-h3: 0.87;
  --line-height-h4: 0.87;
  --line-height-h5: 1;
  --line-height-h6: 1;

  /* ── Base — Layout ────────────────────────────────────────────────────── */
  --page-width: 1440px;
  --page-gutter: 3.5rem;
  --card-corner-radius: 0px;
  --grid-spacing: 1.6rem;
  --section-spacing-unit-size: 0.5rem;
  --spacing-unit-size-static: 1rem;
  --max-w-narrow-multiplier: 0.7;
  --max-w-narrower-multiplier: 0.5;
  --card-media-aspect-ratio: auto;
  --card-media-object-fit: cover;
  --input-border-radius: 0rem;
  --badge-border-radius: 0rem;

  /* ── Base — Animations ────────────────────────────────────────────────── */
  --duration-short: 0.1s;
  --duration-default: 0.2s;
  --duration-long: 0.5s;
  --duration-extra-long: 1s;

  /* ── Base — Z-index ───────────────────────────────────────────────────── */
  --z-header:   100;  /* sticky header */
  --z-floating: 150;  /* floating UI (Book Now button) — above header, below drawers */
  --z-modals:   200;  /* drawers, overlays — covers floating elements when open */
  --z-lightbox: 9999; /* full-screen media overlays */

  /* ── Section — Announcement ─────────────────────────────────────────────────── */
  --testimonial-section-bg: #fff;
  --testimonial-main-rating-color: #ffae03;
  --testimonial-rating-star-color: #ffae03;
  --testimonial-main-head-color: #000;
  --testimonial-card-bg: #fff;
  /* ── Section — Announcement ─────────────────────────────────────────────────── */
  --announcement-bar-landing-bg: #000;
  --announcement-bar-landing-text: #fff;
  --announcement-bar-font-size: 10px;
  --announcement-bar-font-weight: bold;
  --announcement-bar-other-bg: #000;
  --announcement-bar-other-text: #fff;

  /* ── Section — Header ─────────────────────────────────────────────────── */
  --default-header-height: 140px;
  --header-height: var(--default-header-height); /* overridden by JS */
  --header-top-position: 20px;
  --announcement-bar-top: 0px;
  --announcement-bar-height: 20px;
  --default-announcement-bar-top: 0px;
  --transparent-header-menu-text-color: 255, 255, 255;
  --header-inner-after-opacity: 0.2;
  --header-nav-group-link-size: 1.4rem;
  /* Landing page */
  --header-landing-bg: 17, 17, 17;
  --header-landing-text: 255, 255, 255;
  --header-landing-bg-opacity: 0; /* 0 = transparent, 1 = solid */
  --header-landing-font-size: 16px;
  --header-landing-font-family: "Jost", sans-serif;
  --header-landing-font-weight: 400;
  /* Other pages */
  --header-other-bg: 17, 17, 17;
  --header-other-text: 255, 255, 255;
  --header-other-font-size: 16px;
  --header-other-font-family: "Jost", sans-serif;
  --header-other-font-weight: 400;
  /* Mobile menu */
  --mobile-menu-bg: 17, 17, 17;
  --mobile-menu-text: 255, 255, 255;
  --mobile-menu-font-size: 16px;
  --mobile-menu-font-weight: 400;

  /* ── Section — Footer ─────────────────────────────────────────────────── */
  --footer-landing-bg: rgb(17, 17, 17);
  --footer-landing-text: rgb(255, 255, 255);
  --footer-landing-border: rgb(51, 51, 51);
  --footer-other-bg: rgb(17, 17, 17);
  --footer-other-text: rgb(255, 255, 255);
  --footer-other-border: rgb(51, 51, 51);

  /* ── Section — Headings (h1–h6) ───────────────────────────────────────── */
  --h1-font-size: 24px;
  --h1-font-weight: 600;
  --h2-font-size: 24px;
  --h2-font-weight: 600;
  --h3-font-size: 24px;
  --h3-font-weight: 600;
  --h4-font-size: 24px;
  --h4-font-weight: 600;
  --h5-font-size: 24px;
  --h5-font-weight: 600;
  --h6-font-size: 24px;
  --h6-font-weight: 600;

  /* ── Section — Logo Dimensions ────────────────────────────────────────── */
  --logo-desktop-landing-width: 160px;
  --logo-desktop-landing-height: 60px;
  --logo-desktop-other-width: 160px;
  --logo-desktop-other-height: 60px;
  --logo-mobile-width: 120px;
  --logo-mobile-height: 44px;
  --logo-menu-open-width: 120px;
  --logo-menu-open-height: 44px;
  --logo-footer-width: 150px;
  --logo-footer-height: 150px;
  --logo-footer-mobile-width: 150px;
  --logo-footer-mobile-height: 150px;

  /* ── Runtime / JS-set (defaults only — JS or PHP overrides at runtime) ── */
  --theme-js-animations-on-mobile: 0;
  --hero-banner-top: 0px;
  --full-width-banner-height: 70vh;
  --full-width-banner-mobile-height: 45vh;

  /* ── Primary Colors ──────────────────────────────────────────────────── */
  --primary-color: #b90205;
  --primary-color-hover: #ffffff;
  --primary-color-text: #ffffff;
  --primary-color-hover-text: #b90205;

  /*Section Walkin Banner*/
  --bg-walkin-banner: #ffffff;
  --color-walkin-heading: #ffffff;
  --color-walkin-subheading: #ffffff;
  /*Section Fullwidth Banner*/
  --bg-fullwidth-banner: #ffffff;
  --color-fullwidth-heading: #ffffff;
  --color-fullwidth-subheading: #ffffff;
  /*Section before and after*/
  --color-before-after: #000;
  /*Section Career Banner*/
  --bg-career-banner: #ffffff;
  --color-career-heading: #ffffff;
  --color-career-subheading: #ffffff;
}
@media screen and (min-width: 750px) {
  :root {
  }
}
/* Transparent header on mobile: force white text over dark hero */
@media screen and (max-width: 989px) {
  html.js .header.is-transparent:not(.menu-open):not(.is-scrolled) {
    color: rgb(255, 255, 255);
  }
  :root {
    --page-gutter: 1.5rem;
    --h3-multiplier: 2.7rem;
    --h2-multiplier: 3.6rem;
  }
}
