@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Exo+2:ital,wght@0,300;0,400;0,600;0,700;1,300&display=swap');

/* ── Reset ─────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --black:        #000000;
  --dark:         #0A0A0A;
  --card-bg:      #0F0F0F;
  --card-border:  #1E1E1E;
  --gold:         #F5C400;
  --gold-dim:     #B8960C;
  --red:          #CC0000;
  --silver:       #999999;
  --light:        #CCCCCC;
  --white:        #FFFFFF;
  --input-bg:     #181818;
  --input-border: #2A2A2A;

  --glow-gold: 0 0 20px rgba(245,196,0,0.45), 0 0 50px rgba(245,196,0,0.15);
  --glow-red:  0 0 20px rgba(204,0,0,0.45),   0 0 50px rgba(204,0,0,0.15);
  --glow-card: 0 0 0 1px rgba(245,196,0,0.2), 0 12px 40px rgba(0,0,0,0.9);

  --font-display: 'Bebas Neue', 'Impact', sans-serif;
  --font-body:    'Exo 2', 'Segoe UI', system-ui, sans-serif;
}

html  { font-size: 16px; scroll-behavior: smooth; }
body  {
  background: var(--black);
  color: var(--light);
  font-family: var(--font-body);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }

/* ── Nav / Back ─────────────────────────────────────────────────────── */
.nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  padding: 1.25rem 2rem;
  display: flex;
  align-items: center;
  z-index: 100;
  background: linear-gradient(to bottom, rgba(0,0,0,0.95) 0%, transparent 100%);
}
.nav-back {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--silver);
  font-size: 0.72rem;
  font-family: var(--font-body);
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  transition: color 0.2s;
}
.nav-back:hover { color: var(--gold); }
.nav-back svg { width: 14px; height: 14px; flex-shrink: 0; }

/* ── Cosmic fire galaxy background ──────────────────────────────────── */
.hero-cosmic-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  pointer-events: none;
  z-index: 0;
  opacity: 0.55;
  mask-image: radial-gradient(ellipse 90% 85% at 50% 45%,
    white 0%,
    white 40%,
    rgba(255,255,255,0.5) 65%,
    transparent 90%
  );
  -webkit-mask-image: radial-gradient(ellipse 90% 85% at 50% 45%,
    white 0%,
    white 40%,
    rgba(255,255,255,0.5) 65%,
    transparent 90%
  );
}

/* ── Hero background video (scrollable, not fixed) ─────────────────── */
.hero-bg-video {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 35%;
  mix-blend-mode: screen;
  pointer-events: none;
  z-index: 0;
}

@keyframes name-glow {
  0%   { filter: drop-shadow(0 0 12px rgba(245,196,0,0.2)) drop-shadow(0 0 4px rgba(204,0,0,0.1)); }
  50%  { filter: drop-shadow(0 0 25px rgba(245,196,0,0.5)) drop-shadow(0 0 50px rgba(204,0,0,0.25)) drop-shadow(0 0 8px rgba(245,130,0,0.3)); }
  100% { filter: drop-shadow(0 0 12px rgba(245,196,0,0.2)) drop-shadow(0 0 4px rgba(204,0,0,0.1)); }
}

/* ── Scroll Hint ────────────────────────────────────────────────── */
.hero-scroll-hint {
  position: absolute;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  animation: scroll-bounce 2s ease-in-out infinite;
  opacity: 0.5;
}
.hero-scroll-hint svg {
  width: 28px;
  height: 28px;
  color: var(--gold);
}
@keyframes scroll-bounce {
  0%, 100% { transform: translateX(-50%) translateY(0); opacity: 0.5; }
  50%      { transform: translateX(-50%) translateY(8px); opacity: 0.9; }
}

/* ── Cosmic Fire Border ────────────────────────────────────────────── */
.hero-fire-border {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  opacity: 0.6;
}

/* Rotating conic gradient — the liquid fire ring */
.hero-fire-border::before {
  content: '';
  position: absolute;
  top: -20%;
  left: -20%;
  width: 140%;
  height: 140%;
  background: conic-gradient(
    from 0deg at 50% 50%,
    transparent 0deg,
    rgba(204, 0, 0, 0.20) 30deg,
    rgba(245, 196, 0, 0.28) 60deg,
    rgba(204, 0, 0, 0.10) 90deg,
    transparent 120deg,
    rgba(245, 130, 0, 0.22) 150deg,
    rgba(204, 0, 0, 0.16) 180deg,
    transparent 210deg,
    rgba(245, 196, 0, 0.20) 240deg,
    rgba(204, 0, 0, 0.12) 270deg,
    transparent 300deg,
    rgba(245, 130, 0, 0.16) 330deg,
    transparent 360deg
  );
  animation: fire-rotate 20s linear infinite;
  mask-image: radial-gradient(ellipse 55% 50% at 50% 45%,
    transparent 40%,
    black 55%,
    black 65%,
    transparent 80%
  );
  -webkit-mask-image: radial-gradient(ellipse 55% 50% at 50% 45%,
    transparent 40%,
    black 55%,
    black 65%,
    transparent 80%
  );
}

/* Secondary counter-rotating layer for liquid feel */
.hero-fire-border::after {
  content: '';
  position: absolute;
  top: -15%;
  left: -15%;
  width: 130%;
  height: 130%;
  background: conic-gradient(
    from 180deg at 50% 50%,
    transparent 0deg,
    rgba(245, 196, 0, 0.08) 45deg,
    transparent 90deg,
    rgba(204, 0, 0, 0.10) 135deg,
    transparent 180deg,
    rgba(245, 130, 0, 0.08) 225deg,
    transparent 270deg,
    rgba(204, 0, 0, 0.06) 315deg,
    transparent 360deg
  );
  animation: fire-rotate-reverse 15s linear infinite;
  mask-image: radial-gradient(ellipse 52% 48% at 50% 45%,
    transparent 42%,
    black 52%,
    black 62%,
    transparent 75%
  );
  -webkit-mask-image: radial-gradient(ellipse 52% 48% at 50% 45%,
    transparent 42%,
    black 52%,
    black 62%,
    transparent 75%
  );
}

/* Geometric fractal rays extending outward */
.hero-fractal {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  opacity: 0.6;
}
.hero-fractal::before {
  content: '';
  position: absolute;
  top: -30%;
  left: -30%;
  width: 160%;
  height: 160%;
  background:
    repeating-conic-gradient(
      from 0deg at 50% 45%,
      transparent 0deg,
      rgba(245, 196, 0, 0.03) 2.5deg,
      transparent 5deg,
      transparent 10deg,
      rgba(204, 0, 0, 0.02) 12.5deg,
      transparent 15deg
    );
  animation: fractal-pulse 8s ease-in-out infinite alternate;
  mask-image: radial-gradient(ellipse 70% 65% at 50% 45%,
    transparent 30%,
    rgba(0,0,0,0.4) 45%,
    rgba(0,0,0,0.6) 55%,
    transparent 75%
  );
  -webkit-mask-image: radial-gradient(ellipse 70% 65% at 50% 45%,
    transparent 30%,
    rgba(0,0,0,0.4) 45%,
    rgba(0,0,0,0.6) 55%,
    transparent 75%
  );
}
/* Outer geometric haze — fades into black */
.hero-fractal::after {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background:
    repeating-conic-gradient(
      from 7.5deg at 50% 42%,
      transparent 0deg,
      rgba(245, 130, 0, 0.015) 3deg,
      transparent 6deg,
      transparent 12deg,
      rgba(204, 0, 0, 0.01) 15deg,
      transparent 18deg
    );
  animation: fractal-drift 25s linear infinite;
  mask-image: radial-gradient(ellipse 60% 55% at 50% 42%,
    transparent 35%,
    rgba(0,0,0,0.3) 50%,
    transparent 70%
  );
  -webkit-mask-image: radial-gradient(ellipse 60% 55% at 50% 42%,
    transparent 35%,
    rgba(0,0,0,0.3) 50%,
    transparent 70%
  );
}

/* ── Geometric Cosmic Fractals from Borders ──────────────────────── */
.hero-geo-fractal {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  opacity: 0.5;
}

/* Top + bottom edge fractals — crystalline geometry pushing inward */
.hero-geo-fractal::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    /* Top border — geometric rays downward */
    conic-gradient(
      from 180deg at 50% 0%,
      transparent 150deg,
      rgba(204, 0, 0, 0.45) 165deg,
      rgba(245, 196, 0, 0.30) 170deg,
      transparent 175deg,
      rgba(245, 130, 0, 0.35) 178deg,
      rgba(204, 0, 0, 0.50) 180deg,
      rgba(245, 130, 0, 0.35) 182deg,
      transparent 185deg,
      rgba(245, 196, 0, 0.30) 190deg,
      rgba(204, 0, 0, 0.45) 195deg,
      transparent 210deg
    ),
    /* Bottom border — geometric rays upward */
    conic-gradient(
      from 0deg at 50% 100%,
      transparent 150deg,
      rgba(204, 0, 0, 0.35) 165deg,
      rgba(245, 196, 0, 0.25) 170deg,
      transparent 175deg,
      rgba(245, 130, 0, 0.30) 178deg,
      rgba(204, 0, 0, 0.40) 180deg,
      rgba(245, 130, 0, 0.30) 182deg,
      transparent 185deg,
      rgba(245, 196, 0, 0.25) 190deg,
      rgba(204, 0, 0, 0.35) 195deg,
      transparent 210deg
    );
  mask-image:
    linear-gradient(to bottom,
      rgba(0,0,0,0.8) 0%,
      rgba(0,0,0,0.3) 15%,
      transparent 35%,
      transparent 65%,
      rgba(0,0,0,0.3) 85%,
      rgba(0,0,0,0.8) 100%
    );
  -webkit-mask-image:
    linear-gradient(to bottom,
      rgba(0,0,0,0.8) 0%,
      rgba(0,0,0,0.3) 15%,
      transparent 35%,
      transparent 65%,
      rgba(0,0,0,0.3) 85%,
      rgba(0,0,0,0.8) 100%
    );
  animation: geo-pulse 6s ease-in-out infinite alternate;
}

/* Left + right edge fractals — crystalline geometry pushing inward */
.hero-geo-fractal::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    /* Left border — geometric rays rightward */
    conic-gradient(
      from 90deg at 0% 50%,
      transparent 150deg,
      rgba(204, 0, 0, 0.40) 165deg,
      rgba(245, 196, 0, 0.28) 172deg,
      transparent 176deg,
      rgba(245, 130, 0, 0.32) 179deg,
      rgba(204, 0, 0, 0.45) 180deg,
      rgba(245, 130, 0, 0.32) 181deg,
      transparent 184deg,
      rgba(245, 196, 0, 0.28) 188deg,
      rgba(204, 0, 0, 0.40) 195deg,
      transparent 210deg
    ),
    /* Right border — geometric rays leftward */
    conic-gradient(
      from 270deg at 100% 50%,
      transparent 150deg,
      rgba(204, 0, 0, 0.40) 165deg,
      rgba(245, 196, 0, 0.28) 172deg,
      transparent 176deg,
      rgba(245, 130, 0, 0.32) 179deg,
      rgba(204, 0, 0, 0.45) 180deg,
      rgba(245, 130, 0, 0.32) 181deg,
      transparent 184deg,
      rgba(245, 196, 0, 0.28) 188deg,
      rgba(204, 0, 0, 0.40) 195deg,
      transparent 210deg
    );
  mask-image:
    linear-gradient(to right,
      rgba(0,0,0,0.8) 0%,
      rgba(0,0,0,0.3) 15%,
      transparent 35%,
      transparent 65%,
      rgba(0,0,0,0.3) 85%,
      rgba(0,0,0,0.8) 100%
    );
  -webkit-mask-image:
    linear-gradient(to right,
      rgba(0,0,0,0.8) 0%,
      rgba(0,0,0,0.3) 15%,
      transparent 35%,
      transparent 65%,
      rgba(0,0,0,0.3) 85%,
      rgba(0,0,0,0.8) 100%
    );
  animation: geo-drift 10s ease-in-out infinite alternate;
}

/* ── Corner sacred geometry — diagonal fractal lines from corners ── */
.hero-geo-corners {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  opacity: 0.5;
}

/* Top-left + bottom-right corner fractals */
.hero-geo-corners::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    /* Top-left corner */
    conic-gradient(
      from 135deg at 0% 0%,
      rgba(204, 0, 0, 0.55) 0deg,
      rgba(245, 196, 0, 0.35) 5deg,
      transparent 10deg,
      rgba(245, 130, 0, 0.25) 15deg,
      transparent 20deg,
      rgba(204, 0, 0, 0.40) 25deg,
      transparent 30deg,
      rgba(245, 196, 0, 0.20) 35deg,
      transparent 45deg,
      transparent 315deg,
      rgba(245, 196, 0, 0.20) 325deg,
      transparent 330deg,
      rgba(204, 0, 0, 0.40) 335deg,
      transparent 340deg,
      rgba(245, 130, 0, 0.25) 345deg,
      transparent 350deg,
      rgba(245, 196, 0, 0.35) 355deg,
      rgba(204, 0, 0, 0.55) 360deg
    ),
    /* Bottom-right corner */
    conic-gradient(
      from 315deg at 100% 100%,
      rgba(204, 0, 0, 0.45) 0deg,
      rgba(245, 196, 0, 0.28) 5deg,
      transparent 10deg,
      rgba(245, 130, 0, 0.20) 15deg,
      transparent 20deg,
      rgba(204, 0, 0, 0.35) 25deg,
      transparent 35deg,
      transparent 325deg,
      rgba(204, 0, 0, 0.35) 335deg,
      transparent 340deg,
      rgba(245, 130, 0, 0.20) 345deg,
      transparent 350deg,
      rgba(245, 196, 0, 0.28) 355deg,
      rgba(204, 0, 0, 0.45) 360deg
    );
  mask-image: radial-gradient(circle at center, transparent 25%, rgba(0,0,0,0.6) 60%, black 100%);
  -webkit-mask-image: radial-gradient(circle at center, transparent 25%, rgba(0,0,0,0.6) 60%, black 100%);
  animation: geo-corner-pulse 7s ease-in-out infinite alternate;
}

/* Top-right + bottom-left corner fractals */
.hero-geo-corners::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    /* Top-right corner */
    conic-gradient(
      from 225deg at 100% 0%,
      rgba(204, 0, 0, 0.45) 0deg,
      rgba(245, 130, 0, 0.30) 5deg,
      transparent 10deg,
      rgba(245, 196, 0, 0.22) 18deg,
      transparent 25deg,
      rgba(204, 0, 0, 0.35) 30deg,
      transparent 40deg,
      transparent 320deg,
      rgba(204, 0, 0, 0.35) 330deg,
      transparent 335deg,
      rgba(245, 196, 0, 0.22) 342deg,
      transparent 350deg,
      rgba(245, 130, 0, 0.30) 355deg,
      rgba(204, 0, 0, 0.45) 360deg
    ),
    /* Bottom-left corner */
    conic-gradient(
      from 45deg at 0% 100%,
      rgba(204, 0, 0, 0.40) 0deg,
      rgba(245, 130, 0, 0.25) 5deg,
      transparent 10deg,
      rgba(245, 196, 0, 0.18) 18deg,
      transparent 25deg,
      rgba(204, 0, 0, 0.30) 30deg,
      transparent 40deg,
      transparent 320deg,
      rgba(204, 0, 0, 0.30) 330deg,
      transparent 335deg,
      rgba(245, 196, 0, 0.18) 342deg,
      transparent 350deg,
      rgba(245, 130, 0, 0.25) 355deg,
      rgba(204, 0, 0, 0.40) 360deg
    );
  mask-image: radial-gradient(circle at center, transparent 25%, rgba(0,0,0,0.6) 60%, black 100%);
  -webkit-mask-image: radial-gradient(circle at center, transparent 25%, rgba(0,0,0,0.6) 60%, black 100%);
  animation: geo-corner-drift 9s ease-in-out infinite alternate-reverse;
}

@keyframes geo-corner-pulse {
  0%   { opacity: 0.4; }
  50%  { opacity: 0.9; }
  100% { opacity: 0.6; }
}
@keyframes geo-corner-drift {
  0%   { opacity: 0.5; }
  50%  { opacity: 1; }
  100% { opacity: 0.4; }
}

@keyframes geo-pulse {
  0%   { opacity: 0.5; }
  50%  { opacity: 1; }
  100% { opacity: 0.7; }
}
@keyframes geo-drift {
  0%   { opacity: 0.6; }
  50%  { opacity: 1; }
  100% { opacity: 0.5; }
}

@keyframes fire-rotate {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
@keyframes fire-rotate-reverse {
  from { transform: rotate(360deg); }
  to   { transform: rotate(0deg); }
}
@keyframes fractal-pulse {
  from { opacity: 0.6; transform: scale(1); }
  to   { opacity: 1;   transform: scale(1.04); }
}
@keyframes fractal-drift {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* ── Landing Hero ───────────────────────────────────────────────────── */
.hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 2rem 0 3rem;
  position: relative;
  text-align: center;
  overflow: hidden;
}
.hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 60% at 50% 42%,
      rgba(204,0,0,0.08) 0%,
      rgba(245,196,0,0.05) 40%,
      transparent 70%),
    linear-gradient(to bottom, transparent 60%, rgba(0,0,0,0.8) 85%, black 100%);
  pointer-events: none;
  z-index: 1;
}
@keyframes fire-text {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
@keyframes fade-up {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Brand Reveal Section (scroll-triggered) ──────────────────────── */
.brand-reveal {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 5rem 2rem 4rem;
  position: relative;
  z-index: 1;
  background: linear-gradient(to bottom, black 0%, var(--dark) 30%, var(--black) 100%);
}
.reveal-name {
  width: min(320px, 60vw);
  height: auto;
  animation: name-glow 3s ease-in-out infinite;
}
.reveal-tagline {
  font-family: var(--font-body);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  margin-top: 2rem;
  background: linear-gradient(
    90deg,
    #CC5500,
    #F5C400,
    #CC0000,
    #F5C400,
    #CC5500
  );
  background-size: 200% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: fire-text 4s ease-in-out infinite;
}
.reveal-location {
  font-size: 0.68rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  margin-top: 0.5rem;
  background: linear-gradient(
    90deg,
    #8B4500,
    #B8960C,
    #8B0000,
    #B8960C,
    #8B4500
  );
  background-size: 200% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: fire-text 5s ease-in-out infinite;
}

/* ── Scroll Reveal System ──────────────────────────────────────────── */
.scroll-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),
              transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}
.scroll-reveal.revealed {
  opacity: 1;
  transform: translateY(0);
}

/* ── Mobile adjustments ───────────────────────────────────────────── */
@media (max-width: 768px) {
  .hero {
    min-height: 100vh;
  }
  .hero-bg-video {
    object-position: center 35%;
    width: 100%;
    height: 100%;
    top: 0;
  }
  .brand-reveal {
    padding: 3rem 1.5rem 3rem;
  }
  .reveal-name {
    width: min(220px, 50vw);
  }
}

/* ── Service Cards ──────────────────────────────────────────────────── */
.services {
  max-width: 1080px;
  margin: 0 auto;
  padding: 1.5rem 1.5rem 6rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1.25rem;
  position: relative;
  z-index: 1;
}
.service-card {
  background: rgba(10, 10, 10, 0.82);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid var(--card-border);
  border-radius: 3px;
  padding: 2.5rem 2rem 2rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  text-decoration: none;
  color: inherit;
  position: relative;
  overflow: hidden;
  transition: border-color 0.3s ease, transform 0.25s ease, box-shadow 0.3s ease;
}
.service-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--red), var(--gold));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.35s ease;
}
.service-card:hover {
  border-color: rgba(245,196,0,0.3);
  transform: translateY(-4px);
  box-shadow: var(--glow-card);
}
.service-card:hover::after { transform: scaleX(1); }

.card-num {
  font-family: var(--font-display);
  font-size: 0.85rem;
  letter-spacing: 0.15em;
  color: var(--red);
  opacity: 0.7;
}
.card-tag {
  font-size: 0.62rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 700;
  margin-top: 0.25rem;
}
.card-title {
  font-family: var(--font-display);
  font-size: 2.1rem;
  letter-spacing: 0.05em;
  color: var(--white);
  line-height: 1;
  margin-top: 0.1rem;
}
.card-desc {
  font-size: 0.88rem;
  color: var(--silver);
  line-height: 1.65;
  flex: 1;
}
.card-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 0.75rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--card-border);
}
.card-cta-label {
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--gold);
}
.card-cta-arrow {
  width: 18px;
  height: 18px;
  color: var(--gold);
  transition: transform 0.2s ease;
}
.service-card:hover .card-cta-arrow { transform: translateX(5px); }

/* ── Form Page Hero ─────────────────────────────────────────────────── */
.form-hero {
  padding: 4.5rem 2rem 1.5rem;
  text-align: center;
  position: relative;
}
.form-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 60% 80% at 50% 0%,
    rgba(204,0,0,0.06) 0%, transparent 65%);
  pointer-events: none;
}
.form-logo {
  width: min(130px, 35vw);
  height: auto;
  margin: 0 auto;
  mix-blend-mode: screen;
  filter: drop-shadow(0 0 16px rgba(245,196,0,0.18));
  animation: fade-up 1s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  opacity: 0;
}
.form-title {
  font-family: var(--font-display);
  font-size: clamp(2.4rem, 7vw, 4.2rem);
  letter-spacing: 0.06em;
  color: var(--white);
  margin-top: 1.25rem;
  line-height: 1;
}
.form-title span { color: var(--gold); }
.form-subtitle {
  font-size: 0.75rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--silver);
  margin-top: 0.5rem;
  font-weight: 300;
}

/* ── Form Wrapper ───────────────────────────────────────────────────── */
.form-wrap {
  max-width: 680px;
  margin: 2rem auto 5rem;
  padding: 0 1.5rem;
}
.form-card {
  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 3px;
  padding: 2.5rem 2.25rem;
}

/* ── Section Headers ─────────────────────────────────────────────────  */
.section-label {
  font-size: 0.62rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 700;
  padding-bottom: 0.6rem;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid var(--card-border);
}

/* ── Form Layout ────────────────────────────────────────────────────── */
.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
@media (max-width: 520px) {
  .form-row { grid-template-columns: 1fr; }
  .form-card { padding: 1.75rem 1.25rem; }
  .services { padding-bottom: 4rem; }
}
.form-group {
  display: flex;
  flex-direction: column;
  gap: 0.38rem;
  margin-bottom: 1.1rem;
}
.form-group label {
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--silver);
  font-weight: 600;
}
.form-group label .req { color: var(--gold); margin-left: 1px; }

.form-group input,
.form-group select,
.form-group textarea {
  background: var(--input-bg);
  border: 1px solid var(--input-border);
  border-radius: 2px;
  color: var(--white);
  font-family: var(--font-body);
  font-size: 0.92rem;
  padding: 0.72rem 1rem;
  outline: none;
  width: 100%;
  transition: border-color 0.2s, box-shadow 0.2s;
  -webkit-appearance: none;
  appearance: none;
}
.form-group select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath fill='%23888' d='M5 7L0.5 2h9z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.5rem;
  cursor: pointer;
}
.form-group select option { background: #111; }
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 2px rgba(245,196,0,0.1);
}
.form-group input::placeholder,
.form-group textarea::placeholder { color: #3A3A3A; }
.form-group textarea { resize: vertical; min-height: 110px; }

/* ── Checkboxes ─────────────────────────────────────────────────────── */
.check-group {
  margin-bottom: 1.1rem;
}
.check-group-label {
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--silver);
  font-weight: 600;
  display: block;
  margin-bottom: 0.65rem;
}
.check-item {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  cursor: pointer;
  font-size: 0.88rem;
  color: var(--light);
  margin-bottom: 0.5rem;
  line-height: 1.4;
  user-select: none;
}
.check-item input[type="checkbox"] {
  width: 15px;
  height: 15px;
  accent-color: var(--gold);
  cursor: pointer;
  flex-shrink: 0;
  margin-top: 2px;
}

/* ── Divider ────────────────────────────────────────────────────────── */
.form-divider {
  border: none;
  border-top: 1px solid var(--card-border);
  margin: 2rem 0;
}

/* ── Submit Button ──────────────────────────────────────────────────── */
.btn-submit {
  width: 100%;
  background: var(--gold);
  color: var(--black);
  border: none;
  border-radius: 2px;
  font-family: var(--font-display);
  font-size: 1.25rem;
  letter-spacing: 0.18em;
  padding: 1rem 2rem;
  cursor: pointer;
  transition: background 0.2s, box-shadow 0.2s, transform 0.1s;
  margin-top: 0.25rem;
}
.btn-submit:hover {
  background: #FFD700;
  box-shadow: var(--glow-gold);
}
.btn-submit:active { transform: scale(0.99); }
.btn-submit:disabled {
  background: var(--gold-dim);
  cursor: not-allowed;
  opacity: 0.65;
}

/* ── Form Status ────────────────────────────────────────────────────── */
.form-status {
  margin-top: 1rem;
  padding: 1rem 1.25rem;
  border-radius: 2px;
  font-size: 0.88rem;
  line-height: 1.5;
  display: none;
}
.form-status.success {
  display: block;
  background: rgba(245,196,0,0.08);
  border: 1px solid rgba(245,196,0,0.25);
  color: var(--gold);
}
.form-status.error {
  display: block;
  background: rgba(204,0,0,0.08);
  border: 1px solid rgba(204,0,0,0.3);
  color: #ff7070;
}

/* ── Footer ─────────────────────────────────────────────────────────── */
.footer {
  text-align: center;
  padding: 2rem 1rem;
  font-size: 0.68rem;
  color: #333;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  border-top: 1px solid #0E0E0E;
  position: relative;
  z-index: 1;
}
.footer a { color: #555; transition: color 0.2s; }
.footer a:hover { color: var(--gold); }
.footer-dot { margin: 0 0.5rem; color: #222; }