/* ============================================================
   Landing one-pager — local styles
   ============================================================ */

/* Section frame */
section.land-section {
  position: relative;
  padding: 120px 0;
}
section.land-section.tight { padding: 80px 0; }
@media (max-width: 720px) {
  section.land-section { padding: 64px 0; }
}

.section-eyebrow-row {
  display: flex; align-items: center; gap: 14px;
  margin-bottom: 24px;
}
.section-eyebrow-row .dash {
  width: 48px; height: 2px; background: var(--orange-500);
}
.section-eyebrow-row .eb {
  font-family: var(--font-body); font-weight: 700; font-size: 13px;
  letter-spacing: 0.22em; text-transform: uppercase; color: var(--orange-500);
}

.section-title-big {
  font-family: var(--font-display); font-style: italic; font-weight: 900;
  text-transform: uppercase; letter-spacing: -0.01em; line-height: 1.02;
  font-size: clamp(48px, 7vw, 112px); margin: 0;
  text-wrap: balance;
}
.section-title-big .o { color: var(--orange-500); }

.section-sub {
  margin-top: 24px;
  font-size: 18px; line-height: 1.55; color: var(--ink-300);
  max-width: 640px;
}

/* ---------- Faux photo backgrounds (reusable) ---------- */
.faux-photo {
  width: 100%; height: 100%;
  position: relative; background-color: #0a0a0a;
}
.faux-photo::after {
  content: ""; position: absolute; inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.5 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  opacity: 0.16; mix-blend-mode: overlay;
}
.fp-crowd { background:
  radial-gradient(ellipse at 50% 25%, rgba(254,143,0,0.55) 0%, rgba(254,143,0,0) 35%),
  linear-gradient(180deg, rgba(255,200,58,0.15) 0%, transparent 35%),
  radial-gradient(ellipse at 50% 80%, #0a0a0a 0%, #1a0a06 40%, #0a0a0a 100%);
}
.fp-confetti { background:
  radial-gradient(circle at 30% 40%, rgba(255,77,141,0.6), transparent 30%),
  radial-gradient(circle at 70% 30%, rgba(44,240,255,0.55), transparent 30%),
  radial-gradient(circle at 50% 60%, rgba(255,225,74,0.55), transparent 35%),
  radial-gradient(circle at 20% 75%, rgba(254,143,0,0.6), transparent 30%),
  #0a0a0a;
}
.fp-cryo { background:
  radial-gradient(circle at 50% 80%, rgba(63,184,255,0.55) 0%, transparent 50%),
  linear-gradient(180deg, #0a0a0a 0%, #061a26 100%);
}
.fp-flame { background:
  radial-gradient(ellipse at 50% 90%, rgba(255,200,58,0.85) 0%, rgba(254,143,0,0.6) 25%, rgba(230,58,26,0.4) 45%, transparent 70%),
  linear-gradient(0deg, #1a0a00 0%, #0a0a0a 100%);
}
.fp-spark { background:
  radial-gradient(circle at 50% 65%, rgba(255,225,74,0.85) 0%, rgba(255,200,58,0.5) 15%, rgba(254,143,0,0.2) 30%, transparent 55%),
  linear-gradient(180deg, #0a0a0a, #1a0a06);
}
.fp-fog { background:
  radial-gradient(ellipse at 50% 100%, rgba(154,163,171,0.8) 0%, rgba(154,163,171,0.3) 40%, transparent 70%),
  linear-gradient(180deg, #0a0a0a, #1a1a1d);
}
.fp-foam { background:
  radial-gradient(ellipse at 50% 100%, rgba(214,233,245,0.9), rgba(214,233,245,0.3) 45%, transparent 70%),
  linear-gradient(180deg, #0a0a0a, #0a1a26);
}
.fp-bubble { background:
  radial-gradient(circle at 30% 70%, rgba(214,233,245,0.5), transparent 18%),
  radial-gradient(circle at 65% 40%, rgba(44,240,255,0.4), transparent 16%),
  radial-gradient(circle at 80% 70%, rgba(214,233,245,0.5), transparent 14%),
  radial-gradient(circle at 20% 30%, rgba(44,240,255,0.4), transparent 14%),
  linear-gradient(180deg, #061a26, #0a0a0a);
}
.fp-truss { background:
  linear-gradient(180deg, rgba(254,143,0,0.18) 0%, transparent 30%),
  repeating-linear-gradient(0deg, rgba(255,255,255,0.04) 0 1px, transparent 1px 24px),
  repeating-linear-gradient(90deg, rgba(255,255,255,0.04) 0 1px, transparent 1px 32px),
  #0a0a0a;
}
.fp-warehouse { background:
  linear-gradient(180deg, transparent 60%, rgba(0,0,0,0.6) 100%),
  repeating-linear-gradient(0deg, rgba(255,255,255,0.04) 0 1px, transparent 1px 60px),
  linear-gradient(135deg, #1a1a1d 0%, #0a0a0a 100%);
}
.faux-photo .silh {
  position: absolute; left: 0; right: 0; bottom: 0; height: 38%;
  background:
    linear-gradient(180deg, transparent 0%, rgba(0,0,0,0.92) 70%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 150' preserveAspectRatio='none'><path fill='%23000' d='M0,150 L0,90 L15,90 L20,82 L28,82 L33,75 L40,75 L46,82 L52,82 L60,75 L66,75 L75,68 L82,80 L92,80 L100,72 L108,80 L118,80 L128,72 L138,76 L148,70 L158,80 L168,80 L178,72 L188,80 L198,75 L210,82 L222,82 L232,76 L242,82 L252,82 L262,76 L272,80 L282,76 L292,82 L302,82 L312,76 L322,80 L332,76 L342,80 L352,80 L362,76 L372,82 L382,82 L390,80 L400,82 L400,150 Z'/></svg>") repeat-x bottom;
  background-size: auto, 800px 100%;
  z-index: 1;
}
.faux-photo .edge {
  position: absolute; right: 0; top: 0; bottom: 0; width: 2px;
  background: linear-gradient(180deg, transparent, var(--orange-500) 30%, var(--orange-500) 70%, transparent);
  opacity: 0.7; z-index: 2;
}

/* ---------- Responsive breakpoints ---------- */
@media (max-width: 1100px) {
  .hero-grid { grid-template-columns: 1fr !important; gap: 40px !important; }
  .feed-head { grid-template-columns: 1fr !important; }
  .feed-socials { justify-content: flex-start !important; }
  .ig-layout { grid-template-columns: 1fr !important; }
  .yt-layout { grid-template-columns: 1fr !important; }
  .quote-grid { grid-template-columns: 1fr !important; gap: 40px !important; }
  .testimonials-grid { grid-template-columns: 1fr !important; gap: 40px !important; }
  .testimonials-about { position: static !important; }
  .shows-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 720px) {
  .hero-headline { font-size: clamp(40px, 11vw, 80px) !important; }
  .shows-grid { grid-template-columns: 1fr 1fr !important; }
  .nav-links { display: none !important; }
  .nav-live { display: none !important; }
  .effects-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .quote-row-2col { grid-template-columns: 1fr !important; }
}

/* ---------- Image-slot tuning ---------- */
image-slot {
  --image-slot-bg: var(--ink-900);
  --image-slot-border: 1px solid var(--ink-800);
  --image-slot-border-radius: 4px;
  --image-slot-color: var(--ink-400);
  --image-slot-hover-border: 1px solid var(--orange-500);
  width: 100%; display: block;
}
