/* ============================================================
   PREMIUM ELEVATION LAYER — $100k UX
   Loads AFTER style.css to override and refine.
   Bias: subtraction, editorial discipline, motion restraint.
   ============================================================ */

/* === REFINED COLOR TOKENS === */
:root {
  /* Multi-tonal gold (was single gold) */
  --gold-50:  #FAF1D9;
  --gold-100: #EFE0AE;
  --gold-200: #E2CC83;
  --gold-300: #D4B96A;
  --gold-400: #C9A84C;  /* primary */
  --gold-500: #B89438;
  --gold-600: #9A7A2C;
  --gold-700: #7B6122;
  --gold-warm: #D9B968;  /* warmer accent */

  /* Warm black (subtle warmth, not pure neutral) */
  --black-warm-100: #1F1A14;
  --black-warm-200: #181410;
  --black-warm-300: #11100D;
  --black-warm-400: #0A0A0A;

  /* Editorial spacing rhythm (8pt base) */
  --space-2xs: 4px;
  --space-xs:  8px;
  --space-sm:  16px;
  --space-md:  24px;
  --space-lg:  40px;
  --space-xl:  64px;
  --space-2xl: 96px;
  --space-3xl: 128px;
  --space-4xl: 160px;
}

/* === MOTION DISCIPLINE — kill decorative noise === */
/* Reduce orbs from 3 to 1 ambient (subtle) */
.hero__bg .hero-orb--2,
.hero__bg .hero-orb--3 { display: none !important; }
.hero__bg .hero-orb--1 {
  opacity: 0.4 !important;
  filter: blur(120px);
  animation-duration: 12s !important;
}

/* Kill all sparkles — decorative-only animation = anti-pattern */
.hero__bg .sparkle,
.hero__bg .sparkle--1,
.hero__bg .sparkle--2,
.hero__bg .sparkle--3,
.hero__bg .sparkle--4 { display: none !important; }

/* Reduce gold-lines to 1 subtle accent */
.hero__bg .gold-line--2 { display: none !important; }
.hero__bg .gold-line--1 {
  opacity: 0.5 !important;
}

/* === SIGNATURE SHIMMER — refined gold sweep ===
   Premium uses ONE strong shimmer (hero brand moment), not many.
   Tame shimmer on trust badges; keep it ONLY on the hero highlight. */
.trust-badge .shimmer { animation: none !important; background-position: 0 0 !important; }

/* Hero highlight gets a refined slow shimmer — the brand signature */
.hero__title .highlight.shimmer,
.hero__title .highlight {
  background: linear-gradient(
    100deg,
    var(--gold-300) 0%,
    var(--gold-100) 30%,
    #FFF8DC 45%,
    var(--gold-100) 55%,
    var(--gold-400) 80%,
    var(--gold-600) 100%
  ) !important;
  background-size: 280% 100% !important;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: hero-shimmer 5.5s ease-in-out infinite !important;
  display: inline-block;
}
@keyframes hero-shimmer {
  0%, 100% { background-position: 0% 50%; }
  50%      { background-position: 100% 50%; }
}

/* Subtle gold edge glow on hero CTA — black-and-gold premium feel */
.hero__ctas .btn--primary,
.free-spotlight__cta {
  position: relative;
  isolation: isolate;
}
.hero__ctas .btn--primary::after,
.free-spotlight__cta::after {
  content: "";
  position: absolute;
  inset: -2px;
  background: linear-gradient(120deg, transparent 30%, rgba(255,235,180,0.4) 50%, transparent 70%);
  background-size: 250% 100%;
  animation: edge-shimmer 3.2s ease-in-out infinite;
  border-radius: inherit;
  z-index: -1;
  opacity: 0.6;
  pointer-events: none;
}
@keyframes edge-shimmer {
  0%, 100% { background-position: -150% 50%; }
  50%      { background-position: 250% 50%; }
}

/* Gold accent shimmer on editorial section headers */
.editorial-eyebrow {
  background: linear-gradient(90deg, var(--gold-400) 0%, var(--gold-200) 50%, var(--gold-400) 100%);
  background-size: 200% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: eyebrow-shimmer 4s ease-in-out infinite;
}
@keyframes eyebrow-shimmer {
  0%, 100% { background-position: 0% 50%; }
  50%      { background-position: 100% 50%; }
}

/* Metric values get a slow tonal shimmer */
.metric-value {
  background: linear-gradient(135deg, var(--gold-100) 0%, #FFF8DC 30%, var(--gold-400) 60%, var(--gold-600) 100%) !important;
  background-size: 200% 200% !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  animation: metric-shimmer 6s ease-in-out infinite;
}
@keyframes metric-shimmer {
  0%, 100% { background-position: 0% 0%; }
  50%      { background-position: 100% 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .hero__title .highlight.shimmer,
  .editorial-eyebrow,
  .metric-value,
  .hero__ctas .btn--primary::after,
  .free-spotlight__cta::after { animation: none !important; }
}

/* Respect reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .hero__bg > * { animation: none !important; }
  .shimmer { animation: none !important; }
  * { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

/* === EDITORIAL TYPOGRAPHY HIERARCHY === */
.hero__title {
  letter-spacing: -0.02em !important;
  line-height: 1.05 !important;
}

/* Eyebrow refinement */
.hero__eyebrow {
  display: inline-block !important;
  position: relative !important;
  padding-left: 32px !important;
}
.hero__eyebrow::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 24px;
  height: 1px;
  background: var(--gold-400);
  transform: translateY(-50%);
}

/* Body text breathing room */
.hero__subtitle {
  max-width: 58ch !important;
  line-height: 1.7 !important;
  font-size: 17px !important;
}

/* Tabular figures for stats (no width-jump) */
.trust-badge__number,
.stat-number,
.metric-value {
  font-variant-numeric: tabular-nums;
}

/* === PREMIUM ATTORNEY CARDS === */
.attorney-card {
  transition: transform 280ms cubic-bezier(0.2, 0.8, 0.2, 1),
              box-shadow 280ms cubic-bezier(0.2, 0.8, 0.2, 1),
              border-color 280ms ease-out !important;
  position: relative;
  overflow: hidden;
  will-change: transform;
}

.attorney-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, transparent 60%, rgba(201,168,76,0.08) 100%);
  opacity: 0;
  transition: opacity 320ms ease-out;
  pointer-events: none;
}

@media (hover: hover) and (pointer: fine) {
  .attorney-card:hover {
    transform: translateY(-6px);
    box-shadow:
      0 20px 50px -12px rgba(0,0,0,0.6),
      0 0 0 1px rgba(201,168,76,0.4),
      0 0 32px -8px rgba(201,168,76,0.18) !important;
    border-color: rgba(201,168,76,0.5) !important;
  }
  .attorney-card:hover::after { opacity: 1; }
  .attorney-card:hover .attorney-card__photo {
    transform: scale(1.04);
    transition: transform 600ms cubic-bezier(0.2, 0.8, 0.2, 1);
  }
  .attorney-card:hover .attorney-card__name {
    color: var(--gold-warm) !important;
    transition: color 280ms ease-out;
  }
}

.attorney-card__photo {
  transition: transform 600ms cubic-bezier(0.2, 0.8, 0.2, 1);
  will-change: transform;
}

/* === PREMIUM BUTTON MICRO-INTERACTIONS === */
.btn {
  transition: transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1),
              box-shadow 280ms ease-out,
              background-color 220ms ease-out,
              border-color 220ms ease-out !important;
  will-change: transform;
}

.btn:active { transform: scale(0.98) !important; }

.btn--primary {
  position: relative;
  overflow: hidden;
}
.btn--primary::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,0.25) 50%, transparent 70%);
  transform: translateX(-100%);
  transition: transform 800ms ease-out;
  pointer-events: none;
}
.btn--primary:hover::before { transform: translateX(100%); }

/* === FOCUS STATES — A11y === */
.btn:focus-visible,
.attorney-card:focus-visible,
a:focus-visible {
  outline: 2px solid var(--gold-warm) !important;
  outline-offset: 3px !important;
  border-radius: 8px;
}

/* === PREMIUM CARDS — Service / generic === */
.service-card,
.case-card,
.review-card {
  transition: transform 280ms cubic-bezier(0.2, 0.8, 0.2, 1),
              box-shadow 280ms ease-out,
              border-color 220ms ease-out;
}

@media (hover: hover) and (pointer: fine) {
  .service-card:hover,
  .case-card:hover,
  .review-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px -12px rgba(0,0,0,0.55),
                0 0 0 1px rgba(201,168,76,0.3) !important;
  }
}

/* === EDITORIAL DIVIDERS === */
.divider-gold {
  width: 64px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold-400), transparent);
  margin: var(--space-md) 0;
}

/* === QUANTIFIED RESULTS METRICS === */
.metrics-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--space-md);
  padding: var(--space-2xl) 0;
}
.metric {
  text-align: center;
  padding: var(--space-md) var(--space-sm);
}
.metric-value {
  font-family: 'Playfair Display', serif;
  font-size: clamp(40px, 6vw, 64px);
  font-weight: 800;
  line-height: 1;
  background: linear-gradient(135deg, var(--gold-100), var(--gold-400));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -0.03em;
  margin-bottom: 8px;
}
.metric-label {
  color: rgba(255,255,255,0.7);
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* === EDITORIAL SECTION HEADER === */
.editorial-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: 'DM Sans', sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold-400);
  margin-bottom: 16px;
}
.editorial-eyebrow::before {
  content: "";
  width: 32px;
  height: 1px;
  background: var(--gold-400);
}

/* === PREMIUM EMERGENCY BAR — refined === */
.emergency-bar {
  background: linear-gradient(180deg, var(--black-warm-200), var(--black-warm-400)) !important;
  border-bottom: 1px solid rgba(201,168,76,0.18) !important;
}
.emergency-bar a {
  font-feature-settings: "tnum";
  letter-spacing: 0.02em;
}

/* === HERO ATTRIBUTION STRIP — premium polish === */
.hero__attorney-strip {
  backdrop-filter: blur(20px) saturate(1.4);
  -webkit-backdrop-filter: blur(20px) saturate(1.4);
  transition: border-color 280ms ease-out, transform 320ms cubic-bezier(0.2, 0.8, 0.2, 1);
}
.hero__attorney-strip:hover {
  border-color: rgba(201,168,76,0.5) !important;
  transform: translateY(-2px);
}

/* === SCROLL-REVEAL POLISH === */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 700ms ease-out, transform 700ms cubic-bezier(0.2, 0.8, 0.2, 1);
}
.reveal.is-visible,
.reveal.in-view {
  opacity: 1;
  transform: translateY(0);
}

/* === IMAGE QUALITY === */
img {
  image-rendering: -webkit-optimize-contrast;
}

/* === NAVBAR REFINEMENT === */
.navbar {
  backdrop-filter: blur(20px) saturate(1.6);
  -webkit-backdrop-filter: blur(20px) saturate(1.6);
}

.navbar__link {
  position: relative;
  transition: color 220ms ease-out;
}
.navbar__link::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 50%;
  width: 0;
  height: 1.5px;
  background: var(--gold-400);
  transition: all 280ms cubic-bezier(0.2, 0.8, 0.2, 1);
  transform: translateX(-50%);
}
.navbar__link:hover::after,
.navbar__link.active::after {
  width: 24px;
}

/* === MOBILE POLISH === */
@media (max-width: 768px) {
  .hero__title { font-size: clamp(36px, 9vw, 56px) !important; line-height: 1.05 !important; }
  .hero__subtitle { font-size: 16px !important; }
  .hero__eyebrow { font-size: 11px !important; padding-left: 24px !important; }
  .hero__eyebrow::before { width: 16px; }
  .metric-value { font-size: clamp(36px, 11vw, 52px); }
}

/* === PRINT (legal pages, professional output) === */
@media print {
  .emergency-bar, .navbar, .footer, .breaking-news,
  .hero, .free-spotlight, .navbar__hamburger { display: none !important; }
  body { background: #fff !important; color: #000 !important; }
  .legal-page * { color: #000 !important; }
}

/* === SELECTION COLOR === */
::selection {
  background: var(--gold-400);
  color: var(--black-warm-400);
}

/* ============================================================
   8K ROYAL ELITE LAYER — Wachtell/Cartier polish
   Latino warmth (terracotta + ivory accents) + royal gold filigree
   ============================================================ */

:root {
  --ivory: #F5EFE0;
  --ivory-warm: #EFE6D2;
  --terracotta: #B86F3C;
  --terracotta-soft: #C8855A;
  --champagne: #E6D8A6;

  /* Royal multi-layer shadow system */
  --elev-1: 0 1px 2px rgba(0,0,0,0.4), 0 2px 6px rgba(0,0,0,0.2);
  --elev-2: 0 2px 4px rgba(0,0,0,0.4), 0 6px 16px rgba(0,0,0,0.3), 0 0 1px rgba(201,168,76,0.18);
  --elev-3: 0 4px 8px rgba(0,0,0,0.5), 0 16px 40px -8px rgba(0,0,0,0.5), 0 0 0 1px rgba(201,168,76,0.2), 0 0 32px -12px rgba(201,168,76,0.15);
  --elev-royal: 0 30px 80px -20px rgba(0,0,0,0.7), 0 0 0 1px rgba(201,168,76,0.35), 0 0 60px -10px rgba(201,168,76,0.18), inset 0 1px 0 rgba(255,235,180,0.08);
}

/* === PARCHMENT TEXTURE OVERLAY (subtle grain for depth) === */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  opacity: 0.025;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='0.5'/></svg>");
}

/* === GRADIENT MESH BACKGROUND on key sections === */
.hero,
.breaking-news,
section[id="stats"],
section.section--dark {
  position: relative;
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(900px circle at 20% 0%, rgba(201,168,76,0.08), transparent 55%),
    radial-gradient(700px circle at 90% 100%, rgba(184,111,60,0.05), transparent 55%);
  pointer-events: none;
  z-index: 0;
}

/* === ROYAL DIVIDER — gold filigree between sections === */
.royal-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 48px 0;
  max-width: 480px;
  margin: 0 auto;
}
.royal-divider__line {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold-400) 50%, transparent);
}
.royal-divider__crest {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.royal-divider__crest::before {
  content: "";
  position: absolute;
  inset: -4px;
  border: 1px solid rgba(201,168,76,0.4);
  border-radius: 50%;
  transform: rotate(45deg);
}
.royal-divider__crest::after {
  content: "";
  width: 8px;
  height: 8px;
  background: var(--gold-400);
  border-radius: 50%;
  box-shadow: 0 0 0 4px rgba(201,168,76,0.2);
}

/* === ELITE CARD ELEVATION (multi-layer royal shadows) === */
.attorney-card,
.review-card,
.case-card,
.service-card {
  background: linear-gradient(180deg, rgba(255,255,255,0.025), rgba(255,255,255,0.005)) !important;
  backdrop-filter: blur(8px) saturate(1.2);
  -webkit-backdrop-filter: blur(8px) saturate(1.2);
  border: 1px solid rgba(201,168,76,0.18) !important;
  box-shadow: var(--elev-2);
  position: relative;
}
.attorney-card::before,
.service-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(201,168,76,0.3), transparent 50%, rgba(201,168,76,0.15));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
  opacity: 0.7;
  transition: opacity 320ms ease-out;
}

@media (hover: hover) and (pointer: fine) {
  .attorney-card:hover {
    box-shadow: var(--elev-royal) !important;
  }
  .attorney-card:hover::before { opacity: 1; }
}

/* === ROYAL CORNERS — decorative gold accent on premium sections === */
.royal-frame {
  position: relative;
  padding: 64px 48px;
  border: 1px solid rgba(201,168,76,0.25);
  background: linear-gradient(180deg, rgba(201,168,76,0.04), transparent 50%);
}
.royal-frame::before,
.royal-frame::after {
  content: "";
  position: absolute;
  width: 32px;
  height: 32px;
  border: 1px solid var(--gold-400);
}
.royal-frame::before {
  top: -1px; left: -1px;
  border-right: none; border-bottom: none;
}
.royal-frame::after {
  bottom: -1px; right: -1px;
  border-left: none; border-top: none;
}

/* === IVORY/WARMTH TONAL ACCENTS (Latino richness) === */
.warmth-accent {
  background: linear-gradient(135deg, rgba(184,111,60,0.08), rgba(201,168,76,0.04));
  border-left: 3px solid var(--terracotta-soft);
}

/* === PREMIUM HEADLINE TREATMENT === */
.headline-elite {
  font-family: 'Playfair Display', serif;
  font-weight: 800;
  font-size: clamp(48px, 7vw, 96px);
  line-height: 1;
  letter-spacing: -0.04em;
  color: var(--ivory);
  text-shadow: 0 2px 40px rgba(201,168,76,0.15);
}
.headline-elite em {
  font-style: italic;
  background: linear-gradient(135deg, var(--gold-100), var(--gold-400) 40%, var(--gold-warm) 70%, #FFF8DC);
  background-size: 200% 200%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: metric-shimmer 6s ease-in-out infinite;
}

/* === ELEVATED METRIC VALUES === */
.metric-value {
  font-size: clamp(48px, 7vw, 80px) !important;
  letter-spacing: -0.04em !important;
  text-shadow: 0 2px 30px rgba(201,168,76,0.2);
  font-feature-settings: "tnum" 1, "lnum" 1;
}

/* === HERO ATTORNEY STRIP — royal upgrade === */
.hero__attorney-strip {
  background: linear-gradient(135deg, rgba(201,168,76,0.14), rgba(184,111,60,0.04)) !important;
  border: 1px solid rgba(201,168,76,0.35) !important;
  box-shadow: var(--elev-2);
  padding: 16px 22px !important;
}
.hero__attorney-strip img {
  border: 2px solid var(--gold-300) !important;
  box-shadow: 0 0 0 3px rgba(10,10,10,0.6), 0 0 20px rgba(201,168,76,0.25);
}

/* === FOOTER — royal seal feel === */
.footer {
  position: relative;
}
.footer::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 200px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold-400), transparent);
}

/* === LANG FLAG REFINEMENT === */
.navbar__lang-btn {
  border-radius: 4px !important;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0,0,0,0.3), 0 0 0 1px rgba(201,168,76,0.12);
  transition: transform 220ms cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 220ms ease-out;
}
.navbar__lang-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(0,0,0,0.4), 0 0 0 1px rgba(201,168,76,0.5);
}

/* === SCROLLBAR — premium dark gold === */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--black-warm-300); }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--gold-700), var(--gold-500));
  border-radius: 8px;
  border: 2px solid var(--black-warm-300);
}
::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, var(--gold-500), var(--gold-300));
}

/* === FOCUS RING — royal gold === */
.btn:focus-visible {
  box-shadow: 0 0 0 3px rgba(10,10,10,1), 0 0 0 5px var(--gold-warm) !important;
  outline: none !important;
}

/* === SMOOTH SCROLL ROYAL === */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* === MANIFESTO / TEAM PRIDE COMPONENT === */
.manifesto {
  text-align: center;
  padding: 96px 24px;
  max-width: 880px;
  margin: 0 auto;
  position: relative;
}
.manifesto__quote {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: clamp(28px, 4vw, 44px);
  line-height: 1.4;
  font-weight: 500;
  color: var(--ivory);
  letter-spacing: -0.01em;
  margin-bottom: 32px;
}
.manifesto__quote em {
  font-style: italic;
  color: var(--gold-warm);
}
.manifesto__signature {
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-400);
}