:root {
  /* Foundation Design Tokens - Ultra-luxe dark sunset glass & steel aesthetic */
  --deep-dark: #05080F;
  --dark-navy: #0A0F1A;
  --navy: #0B1629;
  --deep-navy: #06101F;
  --turquoise: #4ECDC4;
  --deep-turquoise: #2A9D8F;
  --gold: #D4AF37;
  --deep-gold: #A88A52;
  --metallic-gold: linear-gradient(145deg, #D4AF37 0%, #F5E8C7 25%, #D4AF37 50%, #B8860B 75%, #D4AF37 100%);
  --sand: #D2C4A0;
  --white: #FFFFFF;
  --black: #000000;
  --border: rgba(78, 205, 196, 0.2);
  --card-bg: #0D141F;

  /* Exact font stack from foundation */
  --font-display: "Playfair Display", Georgia, serif;
  --font-sans: "Space Grotesk", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", monospace;
  --font-script: "Pinyon Script", cursive;

  --font-body: var(--font-sans);
  --font-text: var(--font-sans); /* Legacy alias */

  /* ENTERPRISE REFACTOR from Master Prompt: Strict 8pt grid, 150ms transitions, high-trust no-grey system applied to ALL pages */
  --step-0: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --step-1: clamp(1.125rem, 1.05rem + 0.4vw, 1.375rem);
  --step-2: clamp(1.375rem, 1.2rem + 0.8vw, 1.875rem);
  --step-3: clamp(1.75rem, 1.4rem + 1.5vw, 2.625rem);
  --step-4: clamp(2.25rem, 1.7rem + 2.4vw, 3.75rem);
  --step-5: clamp(2.75rem, 2rem + 3.5vw, 5.5rem);

  /* Strict 8pt */
  --radius: 0.5rem; /* 8px */
  --radius-lg: 1rem;
  --shadow-lux: 0 25px 50px -12px rgb(0 0 0 / 0.4);
  --transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1); /* 150ms hardware for all pages */
  --transition-lux: all 150ms cubic-bezier(0.23, 1, 0.32, 1);

  --step-0: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --step-1: clamp(1.125rem, 1.05rem + 0.4vw, 1.375rem);
  --step-2: clamp(1.375rem, 1.2rem + 0.8vw, 1.875rem);
  --step-3: clamp(1.75rem, 1.4rem + 1.5vw, 2.625rem);
  --step-4: clamp(2.25rem, 1.7rem + 2.4vw, 3.75rem);
  --step-5: clamp(2.75rem, 2rem + 3.5vw, 5.5rem);

  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2.5rem;
  --space-5: 4rem;
  --space-6: 6rem;

  --radius: 4px;
  --shadow: 0 12px 40px rgba(11,22,41,0.08);

  --content: 72ch;
  --grid: minmax(0, 72rem);
}

*,*::before,*::after { box-sizing: border-box; }

html {
  scroll-padding-top: 5rem;
  text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: var(--font-text);
  font-size: var(--step-0);
  line-height: 1.55;
  color: #FFFFFF; /* clean, modern white sans-serif text for premium legibility */
  background: var(--deep-dark);
  -webkit-font-smoothing: antialiased;
  position: relative;
}

/* Thin pastel seafoam green side borders running down both sides of the page */
body::before, body::after {
  content: '';
  position: fixed;
  top: 0;
  bottom: 0;
  width: 3px;
  background: #A8D5BA; /* pastel seafoam green */
  z-index: 1000;
  pointer-events: none;
  opacity: 0.8;
}
body::before {
  left: 0;
}
body::after {
  right: 0;
}

/* Ample white space for airiness, refinement, and luxury minimalist layout */
.section, .page-content, .container, main > section, .hero, .lux-section {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.container, .content {
  max-width: 72rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 2.5rem;
  padding-right: 2.5rem;
}

/* Balanced symmetrical spacing between elements - cohesive, harmonious flow */
h1, h2, h3, .lede, p {
  margin-bottom: 1.5rem;
}

section + section {
  margin-top: 0;
}

/* Force dark neutral palette and white text on any remaining light inline styles for unified elegant design */
[style*="background:#fff"], [style*="background: #fff"], [style*="background:#F8F6F0"], [style*="background: #F8F6F0"], [style*="background:#ffffff"], [style*="background: #ffffff"], [style*="background:#f8f5f0"], [style*="background: #f8f5f0"] {
  background: #05080F !important;
  color: #FFFFFF !important;
}

[style*="color:#000"], [style*="color: #000"], [style*="color:#333"], [style*="color: #333"] {
  color: #FFFFFF !important;
}

/* Minimalist footer with clean lines, concise info, usability */
.site-footer, footer {
  padding: 3rem 0;
  background: #05080F;
  color: #E8E4D9;
  border-top: 1px solid rgba(78, 205, 196, 0.15);
}

.site-footer .cols, footer .cols {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 2.5rem;
  max-width: 72rem;
  margin: 0 auto;
  padding: 0 2.5rem;
}

.site-footer a, footer a {
  color: #D4AF37;
  transition: color 0.2s;
}

.site-footer a:hover, footer a:hover {
  color: #4ECDC4;
}

/* === ULTRA-LUX MAKEOVER — PRIVATE CLIENT SOVEREIGN FLEET THEME === */
/* Royal Navy #0A1428 fading to black #06101F / #000 + Gold #C9A227 (matched to Private Client Sovereign Fleet live build). All former white space converted. High contrast light text on dark. White logos only. */

.master-brief {
  font-family: var(--font-text);
  font-size: 0.7rem;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 1rem;
  font-weight: 600;
  opacity: 0.95;
}

.classified-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.65rem;
  letter-spacing: 3.5px;
  text-transform: uppercase;
  color: var(--gold);
  background: rgba(197,164,110,0.08);
  border: 1px solid rgba(197,164,110,0.3);
  padding: 0.35rem 0.9rem;
  border-radius: 999px;
  font-weight: 600;
}

.hero {
  position: relative;
  min-height: 92vh;
  display: flex;
  align-items: center;
  color: white;
  padding: 6rem 0;
  overflow: hidden;
}

.hero-copy {
  max-width: 720px;
  padding: 0 2rem;
  position: relative;
  z-index: 2;
}

.hero h1 {
  font-size: clamp(2.75rem, 5.5vw, 4.5rem);
  line-height: 1.05;
  font-weight: 600;
  margin: 0.5rem 0 1.25rem;
  color: white;
}

.lede.serif {
  font-family: var(--font-display);
  font-size: 1.15rem;
  line-height: 1.45;
  color: rgba(255,255,255,0.88);
  max-width: 560px;
}

/* === COASTAL KEY v2.0 — TRUE 3D EMBOSSED METALLIC GOLD BUTTONS (Ferrari / David Yurman fidelity) ===
   Super-realistic bullion gold: micro-bevels, edge highlights, layered depth, specular response, micro-stitch simulation.
   All gold CTAs, primary actions, and accents use this treatment. No flat 2D anywhere. */
.btn-luxury, .cta, .btn-3d, 
a[style*="background:#C9A227"], a[style*="background: #C9A227"], 
button[style*="background:#C9A227"], button[style*="background: #C9A227"],
.site-header .cta,
a[style*="background:#0B1629"][style*="#C9A227"],
button[style*="background:#0B1629"][style*="#C9A227"] {
  --specular-x: 50%;
  --specular-y: 28%;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background: linear-gradient(152deg, 
    #F5E8C7 0%, 
    #E8D5A3 9%, 
    #D4AF37 18%, 
    #C9A227 29%, 
    #B38B3E 41%, 
    #A88A52 53%, 
    #8C6F3A 64%, 
    #6B5530 76%, 
    #C9A227 87%, 
    #E8D5A3 96%, 
    #F5E8C7 100%);
  color: #0B1629; /* blue text for luxury contrast with metallic gold bg */
  border: 1.5px solid #F5E8C7;
  padding: 14px 30px;
  font-size: 0.9rem;
  font-weight: 800;
  letter-spacing: 1.85px;
  text-transform: uppercase;
  border-radius: 7px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  transition: transform 0.18s cubic-bezier(0.23,1,0.32,1), box-shadow 0.18s cubic-bezier(0.23,1,0.32,1), filter 0.2s;
  cursor: pointer;
  /* Deep 3D emboss + automotive/jewelry bevels + edge definition */
  box-shadow: 
    0 10px 26px rgba(0, 0, 0, 0.55),
    0 3px 7px rgba(0, 0, 0, 0.38),
    0 -1px 0 rgba(255,255,255,0.55),
    inset 0 2.5px 3.5px rgba(255, 255, 255, 0.92),   /* top left highlight bevel */
    inset 0 -3.5px 5px rgba(70, 52, 30, 0.78),      /* bottom right emboss crease */
    inset 2.5px 1px 3px rgba(255,255,255,0.55),     /* left side rim light */
    inset -2px -1px 3px rgba(0,0,0,0.25);           /* right lower soft */
  text-shadow: 
    0 -1.2px 0.5px rgba(65,48,26,0.75), 
    0 1.2px 1px rgba(255,255,255,0.38);
  /* Micro-stitch / fine edge detail simulation */
  border-image: linear-gradient(to bottom, rgba(255,255,255,0.6), rgba(245,232,199,0.3), rgba(255,255,255,0.45)) 1;
}

.btn-luxury::before, .cta::before, .btn-3d::before {
  content: '';
  position: absolute;
  inset: 1px;
  border-radius: 5px;
  pointer-events: none;
  z-index: 1;
  background: radial-gradient(
    circle at var(--specular-x) var(--specular-y),
    rgba(255,255,255,0.65) 0%,
    rgba(255,245,205,0.32) 14%,
    rgba(255,255,255,0.12) 28%,
    transparent 58%
  );
  mix-blend-mode: screen;
  opacity: 0.85;
  transition: opacity 0.2s ease;
  animation: gold-shimmer 3s infinite linear;
}

@keyframes gold-shimmer {
  0% { --specular-x: 20%; --specular-y: 25%; }
  50% { --specular-x: 80%; --specular-y: 35%; }
  100% { --specular-x: 20%; --specular-y: 25%; }
}

/* Subtle fine horizontal micro-detail lines for jewelry-like finish (stitching/brush) */
.btn-luxury::after, .cta::after, .btn-3d::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: repeating-linear-gradient(
    90deg,
    transparent 0px,
    transparent 3px,
    rgba(255,255,255,0.08) 3.5px,
    rgba(255,255,255,0.08) 4px
  );
  mix-blend-mode: overlay;
  opacity: 0.6;
}

.btn-luxury:hover, .cta:hover, .btn-3d:hover {
  transform: translateY(-2.5px) scale(1.012);
  box-shadow: 
    0 16px 38px rgba(0, 0, 0, 0.62),
    0 5px 12px rgba(0, 0, 0, 0.42),
    0 -1px 0 rgba(255,255,255,0.6),
    inset 0 3px 4.5px rgba(255, 255, 255, 0.98),
    inset 0 -4.5px 6px rgba(70, 52, 30, 0.82),
    inset 3px 1.5px 3.5px rgba(255,255,255,0.6),
    inset -2.5px -1.5px 4px rgba(0,0,0,0.28);
  filter: brightness(1.03) saturate(1.08);
}

.btn-luxury:active, .cta:active, .btn-3d:active {
  transform: translateY(1px) scale(0.985);
  box-shadow: 
    0 4px 12px rgba(0, 0, 0, 0.48),
    inset 0 1.5px 2.5px rgba(0,0,0,0.18),
    inset 0 -2.5px 3.5px rgba(255,255,255,0.45);
  filter: brightness(0.97);
}

/* Secondary / outline metallic variants (still 3D, lower key) */
.btn-secondary-3d, a[style*="border:1px solid #C9A227"], a[style*="border: 1px solid #C9A227"] {
  background: rgba(5,8,15,0.65);
  color: #E8D5A3;
  border: 1.5px solid #C9A227;
  box-shadow: 
    0 6px 16px rgba(0,0,0,0.4),
    inset 0 1px 2px rgba(255,255,255,0.15),
    inset 0 -2px 3px rgba(0,0,0,0.35);
}
.btn-secondary-3d:hover {
  background: rgba(10,20,40,0.75);
  color: #F5E8C7;
  box-shadow: 0 10px 22px rgba(0,0,0,0.5), inset 0 2px 3px rgba(255,255,255,0.25);
}

/* Turquoise accent variants for secondary actions */
.btn-turquoise, a[style*="background:#4ECDC4"], a[style*="background: #4ECDC4"] {
  background: linear-gradient(145deg, var(--turquoise), var(--deep-turquoise));
  color: #0B1629; /* blue text for luxury contrast with metallic gold bg */
  border: 1px solid rgba(255,255,255,0.6);
  box-shadow: 
    0 8px 20px rgba(0, 0, 0, 0.45),
    0 2px 4px rgba(0, 0, 0, 0.3),
    inset 0 2px 3px rgba(255, 255, 255, 0.7),
    inset 0 -3px 4px rgba(0, 80, 80, 0.4);
}

.btn-turquoise:hover {
  transform: translateY(-3px) scale(1.01);
  box-shadow: 
    0 14px 32px rgba(0, 0, 0, 0.55),
    inset 0 3px 4px rgba(255, 255, 255, 0.8),
    inset 0 -4px 5px rgba(0, 80, 80, 0.5);
  background: linear-gradient(145deg, #7FDBDA, var(--turquoise), var(--deep-turquoise));
}

/* Ensure no flat buttons anywhere - force 3D on common patterns */
button, .btn, [class*="btn"], [class*="cta"] {
  position: relative;
}

/* Deep dimension for cards and sections */
.premium-card, .product-card, .foundation-card, .card, section > div[style*="background"], .lux-section {
  box-shadow: 0 12px 40px -8px rgba(0,0,0,0.6), 0 4px 12px -2px rgba(0,0,0,0.4);
  border: 1px solid rgba(78, 205, 196, 0.15);
  position: relative;
}

.premium-card::before, .product-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(to right, transparent, rgba(212, 175, 55, 0.3), transparent);
}

.metallic-gold {
  background: linear-gradient(90deg, #C9A227, #E8D5A3, #C9A227);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-size: 200% 100%;
  animation: gold-shimmer 3.5s linear infinite;
}

@keyframes gold-shimmer {
  0% { background-position: 0% 50%; }
  100% { background-position: 200% 50%; }
}

.store-link {
  color: #C9A227 !important;
  font-weight: 600;
  letter-spacing: 0.8px;
  position: relative;
  transition: color 0.2s ease;
}

.store-link:hover {
  color: #E8D5A3 !important;
}

.store-link:after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 1px;
  background: linear-gradient(to right, #C9A227, #E8D5A3);
  transition: width 0.3s ease;
}

.store-link:hover:after {
  width: 100%;
}

.trust-line {
  margin-top: 2.5rem;
  font-size: 0.72rem;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  border-top: 1px solid rgba(197,164,110,0.18);
  padding-top: 1rem;
  max-width: 420px;
}

/* Cinematic Sovereign Sections — Gold Bullion Presentation Standard */
.sovereign-section {
  background: #0B1629;
  color: #EDE7D9;
  padding: 5.5rem 0;
  border-top: 1px solid rgba(197,164,110,0.12);
  position: relative;
}

.sovereign-section .container {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 2rem;
}

.sovereign-section h2 {
  font-family: var(--font-display);
  font-size: clamp(2.1rem, 4.2vw, 2.9rem);
  line-height: 1.05;
  color: #fff;
  margin-bottom: 1rem;
  letter-spacing: -0.02em;
}

.sovereign-section .discreet {
  font-size: 0.68rem;
  letter-spacing: 3.5px;
  text-transform: uppercase;
  color: #C9A227;
  margin-bottom: 0.85rem;
  font-weight: 600;
}

.sovereign-card {
  background: #132238;
  border: 1px solid #2A3F5F;
  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}

.sovereign-card:hover {
  border-color: #C9A227;
  transform: translateY(-4px);
  box-shadow: 0 28px 55px -14px rgb(0 0 0 / 0.35);
}

.avatar-highlight {
  border: 2px solid #C9A227;
  position: relative;
}

.avatar-highlight::before {
  content: "FLAGSHIP";
  position: absolute;
  top: -10px;
  right: 1.25rem;
  background: #C9A227;
  color: #0B1629;
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 2px;
  padding: 2px 11px;
  border-radius: 999px;
}
  padding-top: 1rem;
  max-width: 420px;
}

/* End luxury additions */

h1,h2,h3,h4 {
  font-family: var(--font-display);
  letter-spacing: -0.01em;
  line-height: 1.1;
  margin: 0 0 var(--space-3);
}

h1 { font-size: var(--step-5); }
h2 { font-size: var(--step-4); }
h3 { font-size: var(--step-2); }
h4 { font-size: var(--step-1); }

p { margin: 0 0 var(--space-3); max-width: var(--content); }
a { color: var(--navy); text-decoration: underline; text-underline-offset: 0.18em; }
a:hover { color: var(--teal); }

img { max-width: 100%; height: auto; }

:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 3px;
  border-radius: var(--radius);
}

.skip-link {
  position: absolute; left: -10000px; top: auto;
  background: var(--navy); color: var(--white); padding: 0.5rem 1rem;
}
.skip-link:focus { left: 1rem; top: 1rem; z-index: 100; }

/* ── Header ── */
.site-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: var(--space-2) var(--space-4);
  position: sticky; top: 0; z-index: 50;
  background: rgba(255,255,255,0.92);
  backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid #E8E4D9;
}
.site-header.scrolled { background: rgba(255,255,255,0.97); }
.site-header .brand { display: flex; align-items: center; gap: 0.5rem; text-decoration: none; }
.site-header .brand-text { font-family: var(--font-display); font-size: var(--step-1); color: var(--navy); font-weight: 600; }
.site-header .primary { display: flex; gap: var(--space-3); align-items: center; }
.site-header .primary a { text-decoration: none; font-size: 0.95rem; color: var(--navy); }
.site-header .primary a:hover { color: var(--teal); }
.site-header .cta {
  background: var(--navy); color: var(--white) !important;
  padding: 0.6rem 1.1rem; border-radius: var(--radius);
  text-decoration: none;
}
.site-header .cta:hover { background: var(--teal); }
.menu-toggle { display: none; background: none; border: none; cursor: pointer; padding: 0.5rem; min-height: 44px; min-width: 44px; }
.menu-toggle svg { display: block; }

/* ── Hero ── */
.hero {
  position: relative;
  display: grid;
  align-items: end;
  min-height: 92vh;
  isolation: isolate;
  color: var(--white);
}
.hero picture, .hero > img {
  position: absolute; inset: 0; z-index: -1;
  width: 100%; height: 100%; object-fit: cover;
}
.hero::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(10,22,40,0.0) 0%, rgba(10,22,40,0.65) 100%);
}
.hero-copy { padding: var(--space-6) var(--space-4); max-width: 60rem; }
.hero .eyebrow {
  text-transform: uppercase; letter-spacing: 0.12em;
  font-size: 0.85rem; color: var(--gold);
  margin-bottom: var(--space-2);
}
.hero h1 { color: var(--white); }
.hero .lede { font-size: var(--step-2); color: #E8E4D9; max-width: 48rem; }

/* ── Page Hero (subpages) ── */
.page-hero {
  background: var(--navy); color: var(--white);
  padding: var(--space-6) var(--space-4) var(--space-5);
}
.page-hero .container { max-width: 72rem; margin: 0 auto; }
.page-hero .eyebrow {
  text-transform: uppercase; letter-spacing: 0.12em;
  font-size: 0.85rem; color: var(--gold);
  margin-bottom: var(--space-2);
}
.page-hero h1 { color: var(--white); }
.page-hero .lede { font-size: var(--step-1); color: #E8E4D9; max-width: 52rem; }

/* ── Breadcrumb ── */
.breadcrumb {
  padding: var(--space-2) var(--space-4);
  font-size: 0.85rem; color: #E8E4D9;
  max-width: 80rem; margin: 0 auto;
}
.breadcrumb a { color: #E8E4D9; }
.breadcrumb span { color: var(--navy); }

/* ── Actions ── */
.actions { display: flex; gap: var(--space-2); flex-wrap: wrap; margin-top: var(--space-3); }
.btn {
  display: inline-block; padding: 0.95rem 1.6rem;
  border-radius: var(--radius);
  font-weight: 600; text-decoration: none;
  min-height: 44px;
  transition: transform 200ms ease-out, background 200ms ease-out;
}
.btn-primary { background: var(--gold); color: var(--navy); }
.btn-primary:hover { background: var(--white); color: var(--navy); }
.btn-secondary { background: transparent; color: var(--white); border: 1px solid #E8E4D9; }
.btn-secondary:hover { background: rgba(255,255,255,0.1); }
.btn-outline { background: transparent; color: var(--navy); border: 1px solid var(--navy); }
.btn-outline:hover { background: var(--navy); color: var(--white); }

/* ── Trust Strip ── */
.trust-strip {
  background: var(--navy); color: var(--white);
  padding: var(--space-3) var(--space-4);
}
.trust-strip ul {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--space-2);
  max-width: 80rem; margin: 0 auto;
}
.trust-strip li { text-align: center; font-size: 0.95rem; }

/* ── Content Sections ── */
.section { padding: var(--space-6) var(--space-4); }
.section .container { max-width: 72rem; margin: 0 auto; }

.services, .standard, .founder, .cta-final {
  padding: var(--space-6) var(--space-4);
  max-width: 80rem; margin: 0 auto;
}

/* ── Cards ── */
.cards {
  display: grid; gap: var(--space-3);
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  margin-top: var(--space-4);
}
.card {
  border: 1px solid #E8E4D9;
  padding: var(--space-3);
  border-radius: var(--radius);
  background: var(--white);
}
.card.highlight { border-color: var(--gold); box-shadow: var(--shadow); }
.card h3 { color: var(--navy); }
.card .price { font-family: var(--font-display); font-size: var(--step-1); color: var(--teal); }
.card a { display: inline-block; margin-top: var(--space-2); }

/* ── Standard / Sentinel Section ── */
.standard { background: #E8E4D9; margin: 0; max-width: none; padding: var(--space-6) var(--space-4); }
.standard .container { max-width: 72rem; margin: 0 auto; }
.standard h2 { color: var(--navy); }
.link-arrow { font-weight: 600; }

/* ── Founder ── */
.founder {
  display: grid; grid-template-columns: 1fr 2fr; gap: var(--space-4); align-items: center;
}
.founder img { width: 100%; height: auto; border-radius: var(--radius); aspect-ratio: 4/5; object-fit: cover; background: #E8E4D9; }

/* ── CTA Final ── */
.cta-final { text-align: center; }

/* ── Content Page ── */
.page-content {
  padding: var(--space-5) var(--space-4);
  max-width: 72rem; margin: 0 auto;
}
.page-content h2 { margin-top: var(--space-5); }
.page-content h3 { margin-top: var(--space-4); }
.page-content ul, .page-content ol { max-width: var(--content); padding-left: 1.5rem; margin: 0 0 var(--space-3); }
.page-content li { margin-bottom: var(--space-1); line-height: 1.6; }

/* ── Service Detail ── */
.service-detail { padding: var(--space-5) var(--space-4); max-width: 72rem; margin: 0 auto; }
.service-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--space-3); margin: var(--space-4) 0; }
.service-meta-item { padding: var(--space-2); border-left: 3px solid var(--gold); }
.service-meta-item dt { font-size: 0.85rem; color: #E8E4D9; text-transform: uppercase; letter-spacing: 0.06em; }
.service-meta-item dd { margin: 0; font-family: var(--font-display); font-size: var(--step-1); color: var(--navy); }

/* ── Comparison Table ── */
.compare-table { width: 100%; border-collapse: collapse; margin: var(--space-4) 0; }
.compare-table th, .compare-table td { padding: var(--space-2); text-align: left; border-bottom: 1px solid #E8E4D9; }
.compare-table th { font-family: var(--font-display); font-size: var(--step-1); color: var(--navy); }
.compare-table thead th { background: var(--navy); color: var(--white); }
.compare-table .check { color: var(--teal); font-weight: 700; }
.compare-table .featured { background: rgba(184,145,42,0.06); }

/* ── Checklist ── */
.checklist { list-style: none; padding: 0; columns: 2; column-gap: var(--space-4); }
.checklist li { padding: 0.4rem 0 0.4rem 1.5rem; position: relative; break-inside: avoid; }
.checklist li::before { content: "\2713"; position: absolute; left: 0; color: var(--teal); font-weight: 700; }

/* ── FAQ ── */
.faq-item { border-bottom: 1px solid #E8E4D9; padding: var(--space-3) 0; }
.faq-item summary { cursor: pointer; font-family: var(--font-display); font-size: var(--step-1); color: var(--navy); list-style: none; min-height: 44px; display: flex; align-items: center; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; margin-left: auto; font-size: 1.5rem; color: var(--gold); }
.faq-item[open] summary::after { content: "\2212"; }
.faq-item .answer { padding-top: var(--space-2); }

/* ── Process Steps ── */
.process-steps { counter-reset: step; }
.process-step { display: grid; grid-template-columns: auto 1fr; gap: var(--space-3); padding: var(--space-3) 0; border-bottom: 1px solid #E8E4D9; }
.process-step::before { counter-increment: step; content: counter(step); font-family: var(--font-display); font-size: var(--step-3); color: var(--gold); font-weight: 700; min-width: 2.5rem; }

/* ── Map / Service Area ── */
.county-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--space-3); margin: var(--space-4) 0; }
.county-card { border: 1px solid #E8E4D9; border-radius: var(--radius); padding: var(--space-3); }
.county-card h3 { color: var(--navy); margin-bottom: var(--space-1); }
.county-card .cities { color: #E8E4D9; font-size: 0.95rem; }

/* ── Contact ── */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-5); }
.contact-info dt { font-size: 0.85rem; color: #E8E4D9; text-transform: uppercase; letter-spacing: 0.06em; margin-top: var(--space-2); }
.contact-info dd { margin: 0; font-size: var(--step-1); }
.contact-form label { display: block; font-size: 0.9rem; color: #E8E4D9; margin-bottom: 0.25rem; margin-top: var(--space-2); }
.contact-form input, .contact-form textarea, .contact-form select {
  width: 100%; padding: 0.75rem; border: 1px solid #E8E4D9;
  border-radius: var(--radius); font-family: var(--font-text); font-size: var(--step-0);
  min-height: 44px;
}
.contact-form textarea { min-height: 120px; resize: vertical; }
.contact-form button { margin-top: var(--space-3); }

/* ── Footer ── */
.site-footer {
  background: var(--navy); color: #E8E4D9;
  padding: var(--space-5) var(--space-4) var(--space-3);
}
.site-footer .cols {
  display: grid; gap: var(--space-3);
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  max-width: 80rem; margin: 0 auto;
}
.site-footer a { color: #E8E4D9; display: block; padding: 0.25rem 0; text-decoration: none; }
.site-footer a:hover { color: var(--white); }
.site-footer .brand-foot { color: var(--white); font-family: var(--font-display); font-size: var(--step-1); }
.site-footer .col-label { color: var(--white); font-weight: 600; margin-bottom: var(--space-1); }
.site-footer .fineprint { color: #E8E4D9; font-size: 0.85rem; max-width: 80rem; margin: var(--space-4) auto 0; }

/* ── Responsive ── */
@media (max-width: 720px) {
  .site-header .primary { display: none; }
  .site-header .primary.open { display: flex; flex-direction: column; position: absolute; top: 100%; left: 0; right: 0; background: var(--white); padding: var(--space-2) var(--space-4); border-bottom: 1px solid #E8E4D9; box-shadow: var(--shadow); }
  .menu-toggle { display: block; }
  .founder { grid-template-columns: 1fr; }
  .contact-grid { grid-template-columns: 1fr; }
  .checklist { columns: 1; }
  .hero-copy { padding: var(--space-4) var(--space-2); }
  .hero h1 { font-size: var(--step-4); }
  .page-hero { padding: var(--space-4) var(--space-2); }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
}

/* ============================================
   3D SPACE + EXECUTIVE LUXURY REDESIGN
   Sans-serif headings (Space Grotesk bold, +5pt vs body)
   Short concise sentences. High-end executive tone.
   Real photos only. Contrast-correct branding.
   ============================================ */

/* Typography: Headings Sans Serif, bold, +5pt */
h1, h2, h3, h4, h5, h6,
.hero h1, .page-hero h1, .lux-section h2 {
  font-family: var(--font-sans) !important;
  font-weight: 700;
  letter-spacing: -0.01em;
}

h1 { font-size: 2.25rem; } /* ~ +5-7pt over body */
h2 { font-size: 1.625rem; }
h3 { font-size: 1.375rem; }
p, .lede, body { font-size: 0.9375rem; line-height: 1.55; }

/* Concise executive tone support - tighter spacing */
.lede, p { max-width: 58ch; }
section p + p { margin-top: 0.6rem; }

/* Branding contrast: auto switch logo based on section */
.section-dark .brand img,
.dark-bg .brand img,
.hero .brand img { content: url('/assets/logos/coastal-key-logomark-white.png'); }
.section-light .brand img,
.light-bg .brand img { content: url('/assets/logos/coastal-key-logomark-navy.png'); }

/* 3D Space foundation */
.perspective-container {
  perspective: 1200px;
  perspective-origin: center;
}

.card-3d {
  transition: transform 0.45s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.45s;
  transform-style: preserve-3d;
  will-change: transform;
}

.card-3d:hover {
  transform: rotateY(6deg) rotateX(3deg) translateZ(12px);
  box-shadow: 0 30px 60px -15px rgba(0,0,0,0.45), 0 0 0 1px rgba(197,164,110,0.2);
}

.layered-depth {
  position: relative;
}

.layered-depth > * {
  transition: transform 0.6s ease;
}

.layered-depth .depth-back { transform: translateZ(-40px) scale(0.96); }
.layered-depth .depth-mid { transform: translateZ(0); }
.layered-depth .depth-front { transform: translateZ(30px); }

/* Real photo backgrounds with depth */
.real-photo-bg {
  background-size: cover;
  background-position: center;
  background-attachment: fixed; /* subtle parallax feel */
  position: relative;
}

.real-photo-bg::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(11,22,41,0.55) 0%, rgba(11,22,41,0.35) 50%, rgba(11,22,41,0.7) 100%);
  z-index: 1;
}

.real-photo-bg .content {
  position: relative;
  z-index: 2;
}

/* High end luxury executive polish */
.executive-tone {
  color: #E8E4D9;
}

.gold-contrast {
  color: #C9A227;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}

/* 3D Hero for depth */
.hero-3d {
  min-height: 100dvh;
  display: flex;
  align-items: center;
  overflow: hidden;
}

.hero-layers {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.hero-layers .layer {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform 1.2s cubic-bezier(0.23,1,0.32,1);
}

.hero-3d:hover .layer.back { transform: scale(1.04) translateZ(-20px); }
.hero-3d:hover .layer.mid { transform: scale(1.02) translateZ(0); }

/* Clean, organized layout */
.section {
  padding: 5rem 0;
}

.grid-3d {
  display: grid;
  gap: 2rem;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

/* Short content cards */
.concise-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(197,164,110,0.15);
  padding: 2rem;
  border-radius: 8px;
}

.concise-card h3 {
  margin-bottom: 0.6rem;
  font-size: 1.25rem;
}

.concise-card p {
  font-size: 0.9rem;
  opacity: 0.9;
}

/* Video / 3D media container */
.media-3d {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.4);
  transform: translateZ(0);
}

/* Remove wordiness - tighter */
h1 + p, h2 + p { margin-top: 0.4rem; }

/* === HERO AUDIT EXACT STYLES (propagated) === */
.hero {
  font-family: var(--font-sans);
}
.hero .brand-text {
  font-weight: 800;
  letter-spacing: -0.02em;
}

/* Metallic gold script treatment */
.hero [style*="Pinyon Script"] {
  background: linear-gradient(90deg, #C9A227, #D4AF37, #C9A227);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 1px 4px rgba(0,0,0,0.6);
}

/* Medallion 3D bevel + ornate rings */
.hero div[style*="68px; height: 68px"] {
  transition: transform 0.2s ease;
}
.hero div[style*="68px; height: 68px"]:hover {
  transform: scale(1.03);
}

/* Teal classification + scroll */
.hero div[style*="#4ECDC4"] {
  font-weight: 600;
}

/* Emerald system active glow */
.hero div[style*="#00ff9f"] {
  font-weight: 600;
}

/* Global propagation: consistent sans headings +5pt, executive concise, navy/gold/teal */
h1, h2, h3, h4 {
  font-family: var(--font-sans) !important;
  font-weight: 700;
}
h1 { font-size: 2.35rem; }
h2 { font-size: 1.65rem; }

.section-dark, .dark-bg {
  background: #0A1428;
  color: #E8E4D9;
}
.section-light, .light-bg, [style*="background:#fff"], [style*="background: #fff"], [style*="background:#F8F6F0"], [style*="background: #F8F6F0"], [style*="background:#ffffff"], [style*="background: #ffffff"] {
  background: #0A1428 !important;
  color: #E8E4D9 !important;
}

/* (Reverted) Removed ULTRA-LUXURY MASTERPIECE ADDITIONS and 3D silhouette button refinements from recent polish phase. Base button and card styles from core rebuild remain. */

/* (Reverted) Removed additional video modal, elite form, high-contrast polish, scroll-reveal, and responsive lux rules added in the final $1MM masterpiece phase. */

/* ========================================================
   COASTAL KEY MASTER PROMPT v2.0 IMPLEMENTATION
   Global Color & Lighting • Seamless Dark Field • Text Contrast
   Metallic Bullion Gold • Reduced Tints (max 15%) • Continuous Scroll
   Institutional-grade, no gaps, no flat elements.
   ======================================================== */

/* 1. Global Color & Lighting System — corner-originating gradients + directional inward flow
   Expands the sophisticated blue-black + gold lighting seen around primary CTAs site-wide.
   Subtle, controlled, radial from edges. */
body, html, main, .site-main, .foundation-body {
  background-color: #05080F !important;
  background-image:
    /* top-left gold warm */
    radial-gradient(circle at 4% 3%, rgba(212,175,55,0.042) 0%, transparent 46%),
    /* top-right cool turquoise micro */
    radial-gradient(circle at 96% 4%, rgba(78,205,196,0.028) 0%, transparent 50%),
    /* bottom-left */
    radial-gradient(circle at 5% 96%, rgba(201,162,39,0.032) 0%, transparent 44%),
    /* bottom-right */
    radial-gradient(circle at 95% 94%, rgba(212,175,55,0.036) 0%, transparent 48%),
    /* left edge directional */
    linear-gradient(90deg, rgba(10,18,35,0.035) 0%, transparent 18%),
    /* right edge */
    linear-gradient(270deg, rgba(10,18,35,0.028) 0%, transparent 17%),
    /* top edge soft */
    linear-gradient(180deg, rgba(5,8,15,0.025) 0%, transparent 22%);
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100%, 100% 100%, 100% 100%, 100% 100%;
}

/* Stronger localized lighting around high-value CTAs (replication package area etc) */
#shop, #shop + *, section[style*="#05080F"], .shop-section, .revenue-engine {
  background-image:
    radial-gradient(circle at 4% 3%, rgba(212,175,55,0.055) 0%, transparent 42%),
    radial-gradient(circle at 96% 5%, rgba(78,205,196,0.032) 0%, transparent 46%),
    radial-gradient(circle at 50% 98%, rgba(201,162,39,0.025) 0%, transparent 38%),
    linear-gradient(180deg, rgba(5,8,15,0.0) 0%, rgba(5,8,15,0.015) 100%) !important;
}

/* 2. Text Color & Contrast — white / warm off-white everywhere on dark. No dark text on dark. */
body, main, .section, section, .card, .premium-card, .product-card, .foundation-card, 
.sovereign-card, .concise-card, footer, .site-footer, p, span, li, h1, h2, h3, h4, h5, h6,
[style*="background:#0A1428"], [style*="background: #0A1428"],
[style*="background:#05080F"], [style*="background: #05080F"],
[style*="background:#0B1629"], [style*="background: #0B1629"],
[style*="background:#132238"], [style*="background: #132238"],
[style*="background:#06101F"], [style*="background: #06101F"] {
  color: #E8E4D9 !important;
}
h1, h2, h3, .display, .hero h1, .page-hero h1 {
  color: #FFFFFF !important;
}
.gold, [style*="color:#C9A227"], [style*="color: #C9A227"], [style*="color:#D4AF37"], [style*="color: #D4AF37"] {
  color: #E8D5A3 !important;
}

/* 3. Seamless continuous dark field — kill large whitespace, dividers, gaps */
.section, .section-dark, .dark-bg, main > section, .page-content, .foundation-section,
section[style*="padding:"], section[style*="background:#"] {
  padding-top: 2.1rem !important;
  padding-bottom: 2.1rem !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  border: none !important;
  border-bottom: none !important;
  border-top: none !important;
}
section + section, .section + .section {
  margin-top: 0 !important;
}

/* 4. Background photo / artwork tints reduced site-wide to <=15% max (master + user request for remove tinting) */
div[style*="background-image"][style*="inset: 0"],
div[style*="background-image"][style*="position: absolute; inset: 0"],
.real-photo-bg::before,
.hero > div[style*="background-image"],
section > div[style*="background-image"] {
  opacity: 0.12 !important;
}
div[style*="linear-gradient"][style*="rgba(5,8,15"],
div[style*="linear-gradient"][style*="rgba(10,20,40"],
div[style*="linear-gradient"][style*="rgba(11,22,41"] {
  /* lighten heavy tint gradients to minimal lighting only */
  background: linear-gradient(180deg, rgba(5,8,15,0.06) 0%, rgba(5,8,15,0.03) 100%) !important;
}

/* 5. Super-realistic Metallic Bullion Gold for ALL gold text, logos, icons, accents (PBR simulation) */
.metallic-gold, .gold-bullion, 
[style*="color:#C9A227"], [style*="color: #C9A227"],
[style*="color:#D4AF37"], [style*="color: #D4AF37"],
.gold-contrast, .master-brief, .discreet {
  background: linear-gradient(145deg, #F5E8C7 6%, #E8D5A3 14%, #D4AF37 24%, #C9A227 36%, #B38B3E 49%, #A88A52 61%, #C9A227 74%, #E8D5A3 86%, #F5E8C7 96%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-size: 220% 100%;
  text-shadow: 
    0 0.6px 0.8px rgba(0,0,0,0.55),
    0 -0.8px 0.4px rgba(255,255,255,0.28),
    0 1.2px 1.8px rgba(70,52,30,0.35);
  animation: gold-bullion-shimmer 4.2s linear infinite;
  filter: saturate(1.1) contrast(1.05);
}
@keyframes gold-bullion-shimmer {
  0% { background-position: 0% 50%; }
  100% { background-position: 220% 50%; }
}

/* Gold icons / accents get specular depth too */
.gold-icon, svg[style*="C9A227"], svg[style*="D4AF37"] {
  filter: drop-shadow(0 1px 1px rgba(0,0,0,0.4)) drop-shadow(0 -0.5px 0.5px rgba(255,255,255,0.25));
}

/* 6. Low-tint backdrop photo sections for landing (used by inserted singular backdrops) */
.backdrop-photo {
  position: relative;
  min-height: 52vh;
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.backdrop-photo::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(5,8,15,0.11); /* 11% max for rich photo + readable text if overlaid */
  z-index: 1;
}
.backdrop-photo > * { position: relative; z-index: 2; }

/* Ensure nav and header stay crisp on top of new lighting */
.site-header {
  background: rgba(5,8,15,0.92) !important;
  border-bottom: 1px solid rgba(201,162,39,0.22) !important;
  backdrop-filter: blur(10px);
}

/* Footer seamless too */
footer, .site-footer {
  background: #05080F !important;
  border-top: 1px solid rgba(201,162,39,0.12) !important;
}

/* Final polish: remove visual noise, pixel discipline */
img { image-rendering: -webkit-optimize-contrast; }
* { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* =====================================================
   COASTAL KEY CHECKOUT MODAL — Embedded Legal + Stripe Gate
   Ultra-lux Navy/Gold, accessible, mobile-first, high conversion
===================================================== */
.ck-checkout-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.ck-checkout-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5,8,15,0.92);
  backdrop-filter: blur(12px);
}
.ck-checkout-panel {
  position: relative;
  background: #0A1428;
  color: #E8E4D9;
  border: 1px solid #C9A227;
  border-radius: 10px;
  max-width: 720px;
  width: 100%;
  max-height: 92vh;
  overflow: auto;
  padding: 1.75rem 1.5rem 1.25rem;
  box-shadow: 0 30px 80px -15px rgba(0,0,0,0.7), 0 0 0 1px rgba(201,162,39,0.2) inset;
}
.ck-close {
  position: absolute;
  top: 12px;
  right: 14px;
  background: transparent;
  border: 0;
  color: #C9A227;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  opacity: 0.8;
}
.ck-close:hover { opacity: 1; }
.ck-checkout-header { margin-bottom: 1rem; }
.ck-product-badge {
  display: inline-block;
  font-size: 0.65rem;
  letter-spacing: 2px;
  padding: 2px 9px;
  border-radius: 999px;
  margin-bottom: 8px;
}
.ck-checkout-header h2 {
  font-family: var(--font-display);
  font-size: 1.65rem;
  margin: 0 0 4px;
  color: #fff;
}
.ck-price {
  font-size: 1.85rem;
  font-weight: 700;
  color: #C9A227;
  margin-bottom: 6px;
}
.ck-desc { font-size: 0.92rem; line-height: 1.45; color: #D2C4A0; max-width: 58ch; }

.ck-deliverables {
  background: #0F1C2E;
  border: 1px solid rgba(201,162,39,0.15);
  border-radius: 7px;
  padding: 12px 14px;
  margin: 14px 0;
  font-size: 0.88rem;
}
.ck-deliverables ul { margin: 6px 0 0; padding-left: 1.1rem; }
.ck-deliverables li { margin-bottom: 3px; }

.ck-legal { margin: 12px 0 8px; }
.ck-legal-title {
  font-size: 0.72rem;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: #C9A227;
  margin-bottom: 6px;
  font-weight: 600;
}
.ck-doc {
  background: #0D141F;
  border: 1px solid rgba(201,162,39,0.12);
  border-radius: 6px;
  margin-bottom: 6px;
}
.ck-doc summary {
  cursor: pointer;
  padding: 8px 12px;
  font-weight: 600;
  color: #C9A227;
  list-style: none;
}
.ck-doc summary::-webkit-details-marker { display: none; }
.ck-doc-body {
  padding: 0 12px 12px;
  font-size: 0.82rem;
  line-height: 1.5;
  color: #D2C4A0;
  max-height: 160px;
  overflow: auto;
  border-top: 1px solid rgba(201,162,39,0.1);
}
.ck-doc-body p { margin: 6px 0; }
.ck-doc-body a { color: #C9A227; text-decoration: underline; }

.ck-accepts {
  margin-top: 10px;
  font-size: 0.85rem;
  display: grid;
  gap: 6px;
}
.ck-accepts label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  cursor: pointer;
}
.ck-accepts input { margin-top: 3px; accent-color: #C9A227; }

.ck-actions { margin-top: 16px; }
.ck-proceed {
  width: 100%;
  background: #132238;
  color: #8A95A8;
  border: 1px solid #C9A227;
  padding: 14px 18px;
  border-radius: 6px;
  font-weight: 700;
  font-size: 0.95rem;
  letter-spacing: 0.5px;
  cursor: not-allowed;
  transition: all .15s ease;
}
.ck-proceed:not(:disabled) {
  background: linear-gradient(145deg, #C9A227 0%, #A88A52 50%, #8A6F3A 100%);
  color: #E8E4D9;
  cursor: pointer;
}
.ck-proceed:not(:disabled):hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}
.ck-secure-note {
  text-align: center;
  margin-top: 8px;
  font-size: 0.7rem;
  color: #5A6B80;
  letter-spacing: 0.3px;
}


/* Classified audit styles for full propagation (store/cktcame/sentinel + rest) */
.classified-badge {
  display: inline-block;
  background: rgba(201,162,39,0.1);
  border: 1px solid rgba(201,162,39,0.35);
  color: #C9A227;
  font-size: 0.68rem;
  letter-spacing: 2.8px;
  padding: 4px 14px;
  border-radius: 999px;
  font-weight: 600;
}

.classified-hero {
  position: relative;
  min-height: 100vh;
  width: 100%;
  overflow: hidden;
  background: #0A1428;
  color: #fff;
  display: flex;
  flex-direction: column;
}

.classified-hero .real-photo-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  z-index: 0;
}

.classified-hero .cinematic-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(10,20,40,0.82) 0%, rgba(10,20,40,0.55) 45%, rgba(10,20,40,0.25) 70%);
  z-index: 1;
}

.classified-medallion {
  width: 68px;
  height: 68px;
  border-radius: 9999px;
  border: 2.5px solid #C9A227;
  background: linear-gradient(145deg, #1a253f, #0A1428);
  box-shadow: 0 4px 12px rgba(0,0,0,0.6), inset 0 2px 4px rgba(201,162,39,0.3), inset 0 -2px 4px rgba(0,0,0,0.5);
  display: flex;
  align-items: center;
  justify-content: center;
}