/* LIK DME visual refresh — loaded after the compiled Tailwind build.
   Tailwind v4 wraps its own rules in cascade layers, so plain (unlayered)
   rules here win automatically without needing !important or selector games.
   Nothing here touches layout, markup, or JS — visual polish only. */

/* @import must be the first rule in the stylesheet or the browser drops it */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300..900;1,9..144,300..900&display=swap');

/* ---- Corners: soften the site-wide sharp-edge look ---- */
:root {
  --radius-xs: 0.375rem;
  --radius-sm: 0.5rem;
}
.rounded-none { border-radius: 0.875rem; }
.rounded { border-radius: 0.625rem; }

/* ---- Shadows: richer, softer elevation on elements that already use these utilities ---- */
.shadow-xs {
  --tw-shadow: 0 1px 2px 0 rgba(15, 41, 74, .06), 0 1px 1px -1px rgba(15, 41, 74, .04);
}
.shadow-sm {
  --tw-shadow: 0 2px 8px 0 rgba(15, 41, 74, .08), 0 1px 3px -1px rgba(15, 41, 74, .06);
}
.shadow-md {
  --tw-shadow: 0 10px 24px -4px rgba(15, 41, 74, .12), 0 3px 8px -2px rgba(15, 41, 74, .07);
}
.shadow-2xl {
  --tw-shadow: 0 28px 64px -16px rgba(15, 41, 74, .22), 0 10px 24px -6px rgba(15, 41, 74, .10);
}

/* ---- Add depth to card/frame surfaces that currently have none ---- */
[class~="border-[#0f294a]/15"],
[class~="border-[#0f294a]/10"] {
  box-shadow: 0 4px 16px -6px rgba(15, 41, 74, .12);
  transition: box-shadow .2s ease;
}
[class~="border-[#0f294a]/15"]:hover,
[class~="border-[#0f294a]/10"]:hover {
  box-shadow: 0 10px 28px -8px rgba(15, 41, 74, .18);
}

/* Sticky header: give it a hairline of depth against page content */
header.sticky {
  box-shadow: 0 1px 0 rgba(15, 41, 74, .06), 0 6px 16px -12px rgba(15, 41, 74, .15);
}

/* ---- Typography: small legibility + refinement pass ---- */
.text-\[10px\] { font-size: 11px; }
.text-\[9px\] { font-size: 10px; }
.tracking-tighter { letter-spacing: -0.02em; }

/* ---- Accessibility: visible keyboard focus ring (WCAG-friendly, on-brand) ---- */
:focus-visible {
  outline: 3px solid #b5884c;
  outline-offset: 2px;
  border-radius: 4px;
}

/* ---- Nice-to-haves ---- */
::selection { background: #b5884c; color: #fff; }
html { scroll-behavior: smooth; }
header.sticky ~ * [id] { scroll-margin-top: 96px; }

/* Lightbox image viewer: match the softened corner language */
.lik-image-viewer img { border-radius: 12px; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  [class~="border-[#0f294a]/15"],
  [class~="border-[#0f294a]/10"] {
    transition: none;
  }
}

/* =========================================================================
   V2 — FULL VISUAL PASS
   Same navy/cream/gold brand, pushed much harder: new display typeface,
   layered gradient backgrounds, richer CTA buttons, decorative color washes.
   Selectors are matched against the live DOM (verified in-browser), so this
   only adds background-image/box-shadow/font layers — no property here
   fights an existing Tailwind declaration for the same element.
   ========================================================================= */

:root {
  --font-serif: "Fraunces", Georgia, serif;
}
.font-serif {
  font-optical-sizing: auto;
}

/* ---- Hero: layered gradient + fine dot texture, all on the existing navy ---- */
main > div > div > section:first-of-type {
  background-image:
    radial-gradient(circle at center, rgba(255, 255, 255, .07) 1px, transparent 1.2px),
    radial-gradient(ellipse 900px 520px at 12% -15%, rgba(181, 136, 76, .35), transparent 60%),
    radial-gradient(ellipse 750px 520px at 105% 115%, rgba(26, 92, 140, .40), transparent 60%);
  background-size: 26px 26px, auto, auto;
}
main > div > div > section:first-of-type [class~="tracking-[0.25em]"] {
  background: rgba(255, 255, 255, .07);
  backdrop-filter: blur(6px);
  border-radius: 999px;
}

/* ---- Flat cream sections: soft decorative color washes for rhythm ---- */
main > div > div > section:nth-of-type(2) {
  background-image: radial-gradient(620px 420px at 100% 0%, rgba(181, 136, 76, .14), transparent 70%);
}
main > div > div > section:nth-of-type(5) {
  background-image: radial-gradient(620px 420px at 0% 100%, rgba(26, 92, 140, .12), transparent 70%);
}
main > div > div > section:last-of-type > div:first-child {
  background-image:
    radial-gradient(ellipse 520px 320px at 15% -25%, rgba(181, 136, 76, .28), transparent 65%),
    radial-gradient(ellipse 520px 320px at 100% 125%, rgba(26, 92, 140, .28), transparent 65%);
}

/* ---- CTA buttons: bold gold fill (was cream) + deeper shadows ---- */
[class~="bg-[#faf8f4]"][class~="text-[#0f294a]"] {
  background-image: linear-gradient(135deg, #d9a75c 0%, #b5884c 55%, #96702e 100%);
  color: #14202f;
  box-shadow: 0 10px 30px -8px rgba(0, 0, 0, .4), 0 2px 8px rgba(0, 0, 0, .18);
  font-weight: 800;
  transition: box-shadow .2s ease, background-color .2s ease;
}
[class~="bg-[#faf8f4]"][class~="text-[#0f294a]"]:hover {
  box-shadow: 0 14px 36px -6px rgba(0, 0, 0, .45), 0 4px 10px rgba(0, 0, 0, .2);
}
button[class~="bg-[#0f294a]"] {
  background-image: linear-gradient(135deg, #14335c 0%, #0f294a 55%, #0a1c33 100%);
  box-shadow: 0 6px 20px -6px rgba(15, 41, 74, .5);
  transition: box-shadow .2s ease;
}
button[class~="bg-[#0f294a]"]:hover {
  box-shadow: 0 10px 26px -6px rgba(15, 41, 74, .6);
}
button[class~="bg-[#1a5c8c]"] {
  background-image: linear-gradient(135deg, #2570a8 0%, #1a5c8c 60%, #124469 100%);
}
[class~="border-[#faf8f4]/20"] {
  backdrop-filter: blur(4px);
  transition: border-color .2s ease;
}
[class~="border-[#faf8f4]/20"]:hover {
  border-color: rgba(250, 248, 244, .5);
}

/* =========================================================================
   V3 — STRUCTURAL PASS
   Bigger, unmistakable changes: sitewide type-scale jump, a fully restructured
   centered hero (was a left-aligned two-column split), a gold gradient on the
   headline accent word, and a bold header signature bar. Verified against the
   live DOM — every selector below is scoped so it can't leak onto unrelated
   elements elsewhere on the page.
   ========================================================================= */

/* ---- Sitewide type scale: every heading gets meaningfully bigger ---- */
.text-3xl { font-size: 2rem; line-height: 1.15; }
.text-4xl { font-size: 2.75rem; line-height: 1.1; }
.text-5xl { font-size: 3.5rem; line-height: 1.05; }
.text-7xl { font-size: 5.5rem; line-height: 1; }

/* ---- Header: bold gold signature line, unmistakable at the very top ---- */
header.sticky {
  border-bottom: 3px solid #b5884c;
}

/* ---- Hero: restructured from a left two-column split to a bold centered layout ---- */
main > div > div > section:first-of-type {
  min-height: 760px;
}
main > div > div > section:first-of-type > div {
  grid-template-columns: 1fr;
}
main > div > div > section:first-of-type [class~="lg:col-span-7"] {
  max-width: 880px;
  margin-inline: auto;
}
main > div > div > section:first-of-type [class~="text-left"] {
  text-align: center;
}
main > div > div > section:first-of-type [class~="justify-start"] {
  justify-content: center;
}
main > div > div > section:first-of-type [class~="inline-flex"][class~="border-[#faf8f4]/15"] {
  margin-inline: auto;
}
main > div > div > section:first-of-type p[class~="max-w-xl"] {
  max-width: 640px;
  margin-inline: auto;
}

/* Headline accent word: gold gradient fill instead of flat cream */
main > div > div > section:first-of-type h1 span[class~="text-[#faf8f4]"] {
  background: linear-gradient(100deg, #e8c179, #b5884c 60%, #8a6428);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}
main > div > div > section:first-of-type h1 span[class~="decoration-[#faf8f4]/30"] {
  text-decoration-color: rgba(181, 136, 76, .55);
}