/* =========================================================
   LANDFORCE — GLASS EFFECT LAYER
   Load after the existing stylesheet.
   ========================================================= */

:root {
  --lf-glass-blur: 20px;
  --lf-glass-light-opacity: .58;
}

/* ---------- SHARED GLASS MATERIAL ---------- */
:root .lf-glass {
  --lf-tint: 246 248 235;
  --lf-alpha: var(--lf-glass-light-opacity);
  --lf-solid: #eff1e5;
  --lf-edge: .72;
  --lf-shine: .52;
  --lf-cast: 0 16px 36px -20px rgb(17 54 38 / .36);
  background-color: var(--lf-solid);
  background-image:
    radial-gradient(ellipse at 5% 0%, rgb(255 255 255 / var(--lf-shine)), transparent 52%),
    linear-gradient(135deg, rgb(255 255 255 / .14), transparent 44%, rgb(171 202 137 / .12));
  box-shadow:
    inset 0 0 0 1px rgb(255 255 255 / var(--lf-edge)),
    inset 0 2px 1px -1px rgb(255 255 255 / .72),
    inset 0 -12px 22px -20px rgb(255 255 255 / .8),
    var(--lf-cast);
}

@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  :root .lf-glass {
    background-color: rgb(var(--lf-tint) / var(--lf-alpha));
    -webkit-backdrop-filter: blur(var(--lf-glass-blur)) saturate(135%);
    backdrop-filter: blur(var(--lf-glass-blur)) saturate(135%);
  }
}

/* ---------- CREAM ---------- */
:root .lf-glass--cream { color: #123b2f; }

/* ---------- EMERALD ---------- */
:root .lf-glass--green {
  --lf-tint: 0 99 60;
  --lf-alpha: .94;
  --lf-solid: #00633c;
  --lf-edge: .56;
  --lf-shine: .20;
  --lf-cast: 0 0 0 4px rgb(255 255 255 / .16), 0 10px 24px -12px rgb(0 58 33 / .48);
  color: #fffef4;
}

/* ---------- DARK FOREST ---------- */
:root .lf-glass--dark {
  --lf-tint: 18 58 41;
  --lf-alpha: .72;
  --lf-solid: #173f2f;
  --lf-edge: .24;
  --lf-shine: .12;
  --lf-cast: 0 14px 32px -20px rgb(0 22 13 / .46);
  color: #fffef4;
}

/* ---------- SHAPES ---------- */
:root .lf-glass--rounded { border-radius: 28px; }
:root .lf-glass--pill { border-radius: 999px; }
:root .lf-glass--circle { border-radius: 50%; }

/* ---------- PHOTO GLASS RIMS ---------- */
:root .lf-glass-photo {
  box-shadow:
    0 0 0 1px rgb(255 255 255 / .88),
    0 0 0 8px rgb(255 255 255 / .30),
    0 0 0 9px rgb(255 255 255 / .46),
    0 15px 30px -18px rgb(24 64 40 / .38);
}

/* ---------- GLASS BEHIND EXISTING CONTENT ---------- */
:root .lf-glass-host { isolation: isolate; }
:root .lf-glass-static { position: relative; }
:root .lf-glass-surface {
  position: absolute;
  inset: var(--lf-glass-inset, -16px);
  z-index: -1;
  pointer-events: none;
  border-radius: var(--lf-glass-radius, 28px);
}

/* ---------- FOOTER BACKGROUND ---------- */
:root .lf-glass-footer {
  background-color: #153f2e;
  background-image:
    radial-gradient(ellipse at 7% 16%, rgb(167 197 109 / .22), transparent 30%),
    radial-gradient(ellipse at 92% 35%, rgb(142 188 120 / .18), transparent 32%),
    radial-gradient(ellipse at 54% 100%, rgb(65 126 78 / .20), transparent 40%),
    linear-gradient(160deg, rgb(15 57 39 / .76), rgb(12 45 32 / .91)),
    var(--lf-footer-image, none);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* ---------- NEWSLETTER INPUT ---------- */
:root .lf-glass-input {
  background: transparent;
  border-color: transparent;
  color: inherit;
  box-shadow: none;
}
:root .lf-glass-input::placeholder { color: inherit; opacity: .82; }

/* ---------- INTERACTION ---------- */
:root .lf-glass-control { transition: box-shadow 180ms ease; }
@media (hover: hover) {
  :root .lf-glass-control:hover { --lf-edge: .94; }
}
:root .lf-glass-control:focus-visible,
:root .lf-glass-input:focus-visible {
  outline: 3px solid #e97535;
  outline-offset: 4px;
}
:root .lf-glass-footer :is(a, button, input):focus-visible {
  outline: 3px solid #fffbdc;
  outline-offset: 4px;
}

/* ---------- SMALL SCREENS ---------- */
@media (max-width: 700px) { :root { --lf-glass-blur: 12px; } }

/* ---------- REDUCED TRANSPARENCY ---------- */
@media (prefers-reduced-transparency: reduce) {
  :root .lf-glass {
    background-color: var(--lf-solid);
    background-image: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}
[data-lf-reduce-transparency="true"] .lf-glass {
  background-color: var(--lf-solid);
  background-image: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

/* ---------- REDUCED MOTION ---------- */
@media (prefers-reduced-motion: reduce) {
  :root .lf-glass-control { transition: none; }
}

/* ---------- FORCED COLORS ---------- */
@media (forced-colors: active) {
  :root .lf-glass {
    background: Canvas;
    color: CanvasText;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    box-shadow: none;
    outline: 1px solid CanvasText;
  }
  :root .lf-glass-footer { background: Canvas; }
  :root .lf-glass-control:focus-visible,
  :root .lf-glass-input:focus-visible,
  :root .lf-glass-footer :is(a, button, input):focus-visible {
    outline: 3px solid Highlight;
    outline-offset: 4px;
  }
}

/* =========================================================
   BRIDGE — enrich the inner pages' existing `.glass` cards
   with the same material, without editing 27 files.
   Applies only where the page already used .glass.
   ========================================================= */
:root .glass {
  background-image:
    radial-gradient(ellipse at 5% 0%, rgb(255 255 255 / .5), transparent 52%),
    linear-gradient(135deg, rgb(255 255 255 / .14), transparent 44%, rgb(171 202 137 / .12));
  box-shadow:
    inset 0 0 0 1px rgb(255 255 255 / .7),
    inset 0 2px 1px -1px rgb(255 255 255 / .72),
    inset 0 -12px 22px -20px rgb(255 255 255 / .8),
    0 16px 36px -20px rgb(17 54 38 / .34);
}

/* Inner pages: give the flat card/panel elements the same glass material.
   These classes carry padding/layout already; we only add the surface. */
:root .card,
:root .page-hero-card,
:root .cta-panel,
:root .contact-block,
:root .summary-box {
  background-color: #eff1e5;
  background-image:
    radial-gradient(ellipse at 5% 0%, rgb(255 255 255 / .5), transparent 52%),
    linear-gradient(135deg, rgb(255 255 255 / .14), transparent 44%, rgb(171 202 137 / .12));
  border: 0;
  border-radius: 22px;
  box-shadow:
    inset 0 0 0 1px rgb(255 255 255 / .7),
    inset 0 2px 1px -1px rgb(255 255 255 / .72),
    inset 0 -12px 22px -20px rgb(255 255 255 / .8),
    0 16px 36px -20px rgb(17 54 38 / .34);
}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  :root .card,
  :root .page-hero-card,
  :root .cta-panel,
  :root .contact-block,
  :root .summary-box {
    background-color: rgb(246 248 235 / .58);
    -webkit-backdrop-filter: blur(var(--lf-glass-blur)) saturate(135%);
    backdrop-filter: blur(var(--lf-glass-blur)) saturate(135%);
  }
}
/* the base `.card{margin-top}` still needs its padding — restore it here since we zeroed nothing structural */
:root .card { padding: var(--pad, 26px); }
