/* ============================================================
   SIGNAL — Option A · "MONO"
   Pure keynote black. White light, silver grain, a single
   iridescent azure→violet signal used sparingly.
   Cinematic, maximum negative space.
   ============================================================ */

:root {
  /* Core */
  --bg:        #050506;
  --bg-2:      #0A0A0C;
  --hero-bg:   #050506;
  --surface:   #101014;
  --text:      #F5F5F7;
  --text-2:    #9E9EA6;
  --text-3:    #55555E;
  --accent:    #7FAFFF;
  --accent-2:  #C77DFF;
  --accent-contrast: #050506;

  /* Lines & chrome */
  --line:        rgba(245, 245, 247, .08);
  --line-strong: rgba(245, 245, 247, .17);
  --nav-bg:      rgba(5, 5, 6, .72);
  --footer-bg:   #020203;

  /* Dots (canvas) — silver grain, cold-white signal */
  --dot-rgb:        140 140 150;
  --dot-active-rgb: 214 228 255;
  --dot-alpha:      .5;
  --mark-dot:       #8A8A93;

  /* Type — Space Grotesk display everywhere */
  --font-display: "Space Grotesk", "Inter", sans-serif;
  --font-body:    "Inter", "Helvetica Neue", sans-serif;
  --display-weight:   600;
  --display-tracking: -.03em;

  /* Shape & depth */
  --radius:     14px;
  --radius-lg:  18px;
  --btn-radius: 999px;
  --btn-bg:     #F5F5F7;
  --btn-shadow: 0 14px 44px -12px rgba(255, 255, 255, .28);
  --card-shadow:   0 30px 70px -30px rgba(0, 0, 0, .9);
  --screen-shadow: 0 36px 80px -28px rgba(0, 0, 0, .9);
  --tile-bg:    #F5F5F7;
  --tile-line:  transparent;

  /* Imagery — silver monochrome until hover */
  --img-filter: grayscale(1) contrast(1.08) brightness(.94);
  --img-wash:   linear-gradient(150deg, rgba(127, 175, 255, .16), rgba(199, 125, 255, .12));
  --img-blend:  screen;
}

/* Treatment word / stat number: iridescent, slowly drifting */
.tw {
  background: linear-gradient(100deg, #7FAFFF, #A07BFF 45%, #E27DD6 90%);
  background-size: 200% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: irid 9s ease-in-out infinite alternate;
}
@keyframes irid {
  from { background-position: 0% 0; }
  to   { background-position: 100% 0; }
}
.statement-line .w-accent.lit {
  background: linear-gradient(100deg, #7FAFFF, #A07BFF 55%, #E27DD6);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* A breath of light behind the lockup — nothing more */
.hero::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 90vmin;
  height: 90vmin;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(245, 245, 247, .05), transparent 62%);
  pointer-events: none;
}

/* White pill button, black text — hover lifts with cold glow */
.btn--primary:hover { box-shadow: 0 16px 50px -12px rgba(160, 190, 255, .45); }

/* Mono chrome details */
.section-label { color: var(--text-2); }
.section-label::before, .contact-section .section-label::after { background: var(--accent); }