.ldgr-hero {
      --ldgr-navy-deep: #101a2b;
      --ldgr-navy: #16233a;
      --ldgr-navy-soft: #223252;
      --ldgr-paper: #ece2c8;
      --ldgr-paper-dim: #c9bd9e;
      --ldgr-brass: #c1943f;
      --ldgr-brass-bright: #e0b563;
      --ldgr-rust: #a8452c;
      --ldgr-line: rgba(236, 226, 200, 0.18);

      --ldgr-font-display: "Fraunces", Georgia, serif;
      --ldgr-font-body: "IBM Plex Sans", -apple-system, sans-serif;
      --ldgr-font-mono: "IBM Plex Mono", ui-monospace, monospace;

      position: relative;
      width: 100%;
      min-height: 5 0vh;
      overflow: hidden;
      background: var(--ldgr-navy-deep);
      color: var(--ldgr-paper);
      font-family: var(--ldgr-font-body);
      box-sizing: border-box;
      isolation: isolate;
    }

    .ldgr-hero *,
    .ldgr-hero *::before,
    .ldgr-hero *::after {
      box-sizing: inherit;
    }

    /* ---------- Slides ---------- */
    .ldgr-hero__slides {
      position: absolute;
      inset: 0;
    }

    .ldgr-slide {
      position: absolute;
      inset: 0;
      opacity: 0;
      visibility: hidden;
      transform: scale(1.04);
      transition: opacity 1.1s ease, transform 6.5s ease, visibility 0s linear 1.1s;

      /* Responsive image configurations */
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
    }

    /* Layering an elegant ambient mask over your custom images to keep text perfectly legible */
    .ldgr-slide::before {
      content: "";
      position: absolute;
      inset: 0;
      /* background:
    radial-gradient(ellipse 60% 50% at 78% 22%, var(--slide-glow-a) 0%, transparent 60%),
    radial-gradient(ellipse 55% 45% at 12% 85%, var(--slide-glow-b) 0%, transparent 65%),
    linear-gradient(160deg, rgba(22, 35, 58, 0.85) 0%, rgba(16, 26, 43, 0.95) 78%); */
      z-index: 1;
    }

    .ldgr-slide.is-active {
      opacity: 1;
      visibility: visible;
      transform: scale(1);
      transition: opacity 1.1s ease, transform 7s ease, visibility 0s linear 0s;
      z-index: 2;
    }

    /* Replace the background-image URLs with your own assets */
    .ldgr-slide[data-index="0"] {
      --slide-glow-a: rgba(168, 69, 44, 0.45);
      --slide-glow-b: rgba(193, 148, 63, 0.25);
      background-image: url('../images/slider/bnr1.jpg');
    }

    .ldgr-slide[data-index="1"] {
      --slide-glow-a: rgba(193, 148, 63, 0.4);
      --slide-glow-b: rgba(90, 110, 80, 0.25);
      background-image: url('../images/slider/bnr2.jpg');
    }

    .ldgr-slide[data-index="2"] {
      --slide-glow-a: rgba(122, 74, 32, 0.5);
      --slide-glow-b: rgba(168, 69, 44, 0.2);
      background-image: url('../images/slider/bnr3.jpg');
    }
    
    /* subtle paper-grain texture on every slide */
    .ldgr-slide__texture {
      position: absolute;
      inset: 0;
      opacity: 0.35;
      mix-blend-mode: overlay;
      background-image:
        repeating-linear-gradient(115deg, rgba(255, 255, 255, 0.03) 0px, rgba(255, 255, 255, 0.03) 1px, transparent 1px, transparent 3px);
      z-index: 2;
    }

    /* line-art motif per slide, faint & oversized, bottom-right */
    .ldgr-slide__mark {
      position: absolute;
      right: -4%;
      bottom: -8%;
      width: min(46vw, 620px);
      height: auto;
      opacity: 0.16;
      stroke: var(--ldgr-paper);
      fill: none;
      stroke-width: 1.1;
      z-index: 2;
    }

    /* ---------- Scrim for legibility ---------- */
    .ldgr-hero__scrim {
      position: absolute;
      inset: 0;
      z-index: 3;
      /* background: linear-gradient(180deg, rgba(16,26,43,0.4) 0%, rgba(16,26,43,0.15) 38%, rgba(16,26,43,0.75) 100%);
  pointer-events: none; */
      background: linear-gradient(180deg, rgba(16, 26, 43, 0.65) 0%, rgba(16, 26, 43, 0.4) 40%, rgba(16, 26, 43, 0.85) 100%);
      pointer-events: none;
    }

    /* ---------- Content ---------- */
    .ldgr-hero__content {
      position: relative;
      z-index: 4;
      max-width: 920px;
      margin: 0 auto;
      padding: clamp(6rem, 16vh, 10rem) 1.75rem 10rem;
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      text-align: center;

    }

    /* .ldgr-eyebrow {
  font-family: var(--ldgr-font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ldgr-brass-bright);
  margin: 0 0 1.4rem;
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.7s ease 0.25s, transform 0.7s ease 0.25s;
}
.ldgr-eyebrow::before {
  content: "";
  width: 26px;
  height: 1px;
  background: var(--ldgr-brass-bright);
  display: inline-block;
}
.ldgr-hero__content.is-ready .ldgr-eyebrow { opacity: 1; transform: translateY(0); } */

    .ldgr-headline {
      font-family: var(--ldgr-font-display);
      font-weight: 500;
      font-size: clamp(2.3rem, 5.4vw, 4.6rem);
      line-height: 1.06;
      letter-spacing: -0.01em;
      margin: 0 0 1.1rem;
      color: #fff;
      opacity: 0;
      transform: translateY(16px);
      transition: opacity 0.8s ease 0.4s, transform 0.8s ease 0.4s;
      text-shadow: 0 2px 14px rgba(16, 26, 43, 0.4);
    }

    .ldgr-hero__content.is-ready .ldgr-headline {
      opacity: 1;
      transform: translateY(0);
    }

    .ldgr-subhead {
      font-weight: 300;
      font-size: clamp(1rem, 1.6vw, 2.25rem);
      line-height: 1.55;
      max-width: 560px;
      color: #fff;
      margin: 0 0 2.4rem;
      opacity: 0;
      transform: translateY(14px);
      transition: opacity 0.8s ease 0.55s, transform 0.8s ease 0.55s;
      text-shadow: 0 2px 10px rgba(16, 26, 43, 0.4);
    }

    .ldgr-hero__content.is-ready .ldgr-subhead {
      opacity: 1;
      transform: translateY(0);
    }

    .ldgr-cta {
      font-family: var(--ldgr-font-body);
      font-weight: 500;
      font-size: 1.5rem;
      padding: 1.2rem 2.5rem;
      letter-spacing: 0.03em;
      color: #fff;
      /* background: var(--ldgr-brass-bright); */
      background: #E8A465;
      padding: 0.95rem 1.9rem;
      border-radius: 2px;
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      gap: 1rem;
      border: 1px solid var(--ldgr-brass-bright);
      transition: background 0.25s ease, color 0.25s ease, gap 0.25s ease, transform 0.25s ease;
      opacity: 0;
      transform: translateY(12px);
    }

    .ldgr-hero__content.is-ready .ldgr-cta {
      opacity: 1;
      transform: translateY(0);
      transition: opacity 0.8s ease 0.7s, transform 0.8s ease 0.7s, background 0.25s ease, color 0.25s ease, gap 0.25s ease;
    }

    .ldgr-cta:hover {
      background: transparent;
      color: var(--ldgr-brass-bright);
      gap: 0.9rem;
    }

    .ldgr-cta__arrow {
      transition: transform 0.25s ease;
    }

    .ldgr-cta:hover .ldgr-cta__arrow {
      transform: translateX(2px);
    }

    /* ---------- Seal navigation (Now Centered) ---------- */
    .ldgr-seals {
      position: absolute;
      z-index: 5;
      bottom: clamp(1.5rem, 5vh, 3.5rem);
      left: 50%;
      transform: translateX(-50%);
      display: flex;
      gap: 0.8rem;
    }

    .ldgr-seal {
      width: 34px;
      height: 34px;
      border-radius: 50%;
      border: 1px solid var(--ldgr-line);
      background: rgba(16, 26, 43, 0.6);
      cursor: pointer;
      display: grid;
      place-items: center;
      padding: 0;
      transition: border-color 0.25s ease, background 0.25s ease, transform 0.25s ease;
    }

    .ldgr-seal svg {
      width: 12px;
      height: 12px;
      stroke: var(--ldgr-paper-dim);
      fill: none;
      stroke-width: 1.4;
      transition: stroke 0.25s ease;
    }

    .ldgr-seal:hover {
      transform: translateY(-2px);
      border-color: var(--ldgr-brass);
    }

    .ldgr-seal.is-active {
      background: var(--ldgr-brass-bright);
      border-color: var(--ldgr-brass-bright);
    }

    .ldgr-seal.is-active svg {
      stroke: var(--ldgr-navy-deep);
    }

    /* ---------- Autoplay progress ---------- */
    .ldgr-progress {
      position: absolute;
      z-index: 5;
      top: 0;
      left: 0;
      right: 0;
      height: 2px;
      background: rgba(236, 226, 200, 0.1);
    }

    .ldgr-progress__bar {
      height: 100%;
      width: 0%;
      background: var(--ldgr-brass-bright);
    }

    .ldgr-progress__bar.is-animating {
      animation: ldgr-progress-fill 6s linear forwards;
    }

    @keyframes ldgr-progress-fill {
      from {
        width: 0%;
      }

      to {
        width: 100%;
      }
    }

    /* ---------- Responsive ---------- */
    @media (max-width: 860px) {
      .ldgr-hero__content {
        padding: 6rem 1.4rem 12rem;
      }
    }

    @media (max-width: 640px) {
      .ldgr-hero {
        min-height: 70svh;
      }

      .ldgr-hero__content {
        padding: 5.5rem 1.25rem 10rem;
        min-height: 70svh;
      }

      .ldgr-seals {
        bottom: 2rem;
      }

      .ldgr-slide__mark {
        width: 70vw;
        opacity: 0.1;
      }

      .ldgr-headline {
        font-size: 3rem;
        /* 👈 CHANGE THIS to make the main title bigger */
        color: #fff;
        /* 👈 Forces the main title text color to pure white */
      }

      .ldgr-subhead {
        font-size: 1.5rem;
        /* 👈 CHANGE THIS to make the paragraph (p tag) text bigger */
        color: #fff;
        /* 👈 Forces the paragraph text color to pure white */
      }

      .ldgr-cta {
        font-size: 1.1rem;
        /* 👈 CHANGE THIS to make the button text bigger */
        color: #fff;
        /* 👈 Forces the button text color to pure white */
        /* padding: 1.1rem 2.2rem; 👈 OPTIONAL: Increases the button size so the larger text fits perfectly */
        padding: 1.2rem 2.4rem;
        /* 👈 First number is top/bottom height, second number is left/right width */
        width: auto;
      }
    }

    @media (max-width: 400px) {
      .ldgr-cta {
        padding: 0.85rem 1.5rem;
        font-size: 1.5rem;
      }
    }

    @media (prefers-reduced-motion: reduce) {

      .ldgr-slide,
      .ldgr-headline,
      .ldgr-subhead,
      .ldgr-eyebrow,
      .ldgr-cta {
        transition: none !important;
        animation: none !important;
      }

      .ldgr-slide.is-active {
        transform: none;
      }
    }