/* Vibewright Labs — site styles
   Component classes translated 1:1 from the design-system bundle,
   plus page layout for the marketing site. */

/* ════════════════ Base ════════════════ */
* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  background: var(--bg-app);
  color: var(--text-body);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-normal);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5 {
  font-family: var(--font-display);
  color: var(--text-strong);
  line-height: var(--lh-snug);
  letter-spacing: var(--ls-tight);
  font-weight: var(--fw-bold);
  margin: 0;
}
a { color: var(--text-brand); text-decoration: none; transition: color var(--dur-fast) var(--ease-out); }
a:hover { color: var(--accent-hover); }
::selection { background: var(--accent-soft); color: var(--text-strong); }
img { max-width: 100%; }
@keyframes vw-spin { to { transform: rotate(360deg); } }

.vw-eyebrow {
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: var(--ls-wider);
  font-size: var(--fs-micro);
  font-weight: var(--fw-semibold);
  color: var(--text-brand);
}

vw-icon { display: inline-flex; line-height: 0; flex: none; }

/* ════════════════ Button ════════════════ */
.vw-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  height: var(--control-h);
  padding: 0 var(--space-5);
  font-family: var(--font-display);
  font-size: var(--fs-body);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  border-radius: var(--radius-md);
  border: 1px solid transparent;
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--dur-fast) var(--ease-out), box-shadow var(--dur-base) var(--ease-out),
    transform var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.vw-btn[data-size="sm"] { height: var(--control-h-sm); padding: 0 var(--space-3); font-size: var(--fs-sm); }
.vw-btn[data-size="lg"] { height: var(--control-h-lg); padding: 0 var(--space-6); font-size: var(--fs-lg); }
.vw-btn[data-full-width] { width: 100%; }
.vw-btn[data-variant="primary"] { background: var(--grad-brand); color: var(--text-on-brand); box-shadow: var(--glow-sm); }
.vw-btn[data-variant="secondary"] { background: var(--surface-card); color: var(--text-strong); border: 1px solid var(--border-default); }
.vw-btn[data-variant="ghost"] { background: transparent; color: var(--text-body); }
.vw-btn[data-variant="primary"]:hover:not(:disabled) { box-shadow: var(--glow-md); transform: translateY(-1px); color: var(--text-on-brand); }
.vw-btn[data-variant="secondary"]:hover:not(:disabled) { border-color: var(--border-strong); background: var(--surface-hover); color: var(--text-strong); }
.vw-btn[data-variant="ghost"]:hover:not(:disabled) { background: var(--surface-hover); color: var(--text-body); }
.vw-btn:active:not(:disabled) { transform: translateY(0) scale(0.985); }
.vw-btn:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--ring); }

/* ════════════════ Card ════════════════ */
.vw-card {
  background: var(--surface-card);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-lg);
  padding: var(--space-5);
  box-shadow: var(--shadow-md);
  transition: border-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out),
    transform var(--dur-base) var(--ease-out);
}
.vw-card--glow { border-color: rgba(166,61,255,0.4); box-shadow: var(--glow-md); }
.vw-card--angled { clip-path: var(--clip-corner); }
.vw-card--interactive { cursor: pointer; }
.vw-card--interactive:hover { border-color: var(--border-strong); transform: translateY(-2px); }

/* ════════════════ Badge ════════════════ */
.vw-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  height: 22px;
  padding: 0 var(--space-2);
  border-radius: var(--radius-sm);
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  color: var(--text-muted);
  background: var(--ink-700);
  border: 1px solid var(--border-subtle);
}
.vw-badge[data-tone="brand"] { color: var(--purple-200); background: var(--accent-soft); border-color: rgba(166,61,255,0.4); }
.vw-badge[data-tone="green"] { color: var(--flag-green); background: rgba(47,227,106,0.14); border-color: rgba(47,227,106,0.4); }
.vw-badge[data-tone="yellow"] { color: var(--flag-yellow); background: rgba(255,206,31,0.14); border-color: rgba(255,206,31,0.4); }
.vw-badge[data-tone="red"] { color: var(--flag-red); background: rgba(255,45,85,0.14); border-color: rgba(255,45,85,0.4); }
.vw-badge[data-tone="blue"] { color: var(--flag-blue); background: rgba(47,128,255,0.14); border-color: rgba(47,128,255,0.4); }
.vw-badge[data-solid] { color: var(--black); border-color: transparent; }
.vw-badge[data-solid][data-tone="brand"] { background: var(--purple-200); }
.vw-badge[data-solid][data-tone="green"] { background: var(--flag-green); }

/* ════════════════ Tag ════════════════ */
.vw-tag {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  height: 28px;
  padding: 0 var(--space-3);
  border-radius: var(--radius-pill);
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  color: var(--text-body);
  background: var(--ink-700);
  border: 1px solid var(--border-subtle);
}

/* ════════════════ FlagSignal ════════════════ */
.vw-flag {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-1) var(--space-3) var(--space-1) var(--space-1);
  border-radius: var(--radius-sm);
  background: var(--ink-800);
  border: 1px solid var(--border-default);
  transition: opacity var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out);
}
.vw-flag .vw-flag__swatch {
  width: 20px; height: 20px;
  border-radius: var(--radius-xs);
  flex-shrink: 0;
  transition: box-shadow var(--dur-base) var(--ease-out);
}
.vw-flag .vw-flag__label {
  font-family: var(--font-display);
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  color: var(--text-strong);
}
.vw-flag[data-size="sm"] .vw-flag__swatch { width: 14px; height: 14px; }
.vw-flag[data-size="sm"] .vw-flag__label { font-size: var(--fs-xs); }
.vw-flag[data-size="lg"] .vw-flag__swatch { width: 28px; height: 28px; }
.vw-flag[data-inactive] { opacity: 0.5; border-color: var(--border-subtle); }
.vw-flag[data-inactive] .vw-flag__swatch { box-shadow: none !important; }
.vw-flag[data-flag="green"] .vw-flag__swatch { background: var(--flag-green); box-shadow: var(--glow-green); }
.vw-flag[data-flag="yellow"] .vw-flag__swatch { background: var(--flag-yellow); box-shadow: var(--glow-yellow); }
.vw-flag[data-flag="red"] .vw-flag__swatch { background: var(--flag-red); box-shadow: var(--glow-red); }
.vw-flag[data-flag="blue"] .vw-flag__swatch { background: var(--flag-blue); box-shadow: 0 0 16px rgba(47,128,255,0.45); }
.vw-flag[data-flag="white"] .vw-flag__swatch { background: var(--flag-white); box-shadow: 0 0 16px rgba(242,242,245,0.35); }
.vw-flag[data-flag="checkered"] .vw-flag__swatch {
  background: conic-gradient(#f2f2f5 90deg, #14141a 90deg 180deg, #f2f2f5 180deg 270deg, #14141a 270deg) 0 0 / 50% 50%;
  box-shadow: 0 0 16px rgba(255,255,255,0.3);
}

/* ════════════════ StatReadout ════════════════ */
.vw-stat { display: flex; flex-direction: column; gap: var(--space-1); }
.vw-stat__label {
  font-family: var(--font-display);
  font-size: var(--fs-micro);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  color: var(--text-muted);
}
.vw-stat__row { display: flex; align-items: baseline; gap: var(--space-2); }
.vw-stat__value {
  font-family: var(--font-mono);
  font-size: 2.25rem;
  font-weight: var(--fw-bold);
  line-height: 1;
  color: var(--text-strong);
  font-variant-numeric: tabular-nums;
}
.vw-stat[data-size="lg"] .vw-stat__value { font-size: 3rem; }
.vw-stat[data-tone="brand"] .vw-stat__value { color: var(--purple-300); }
.vw-stat[data-tone="green"] .vw-stat__value { color: var(--flag-green); }
.vw-stat__unit { font-family: var(--font-mono); font-size: var(--fs-sm); color: var(--text-muted); }

/* ════════════════ Forms ════════════════ */
.vw-field { display: flex; flex-direction: column; gap: var(--space-2); width: 100%; }
.vw-field > label {
  font-family: var(--font-display);
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  color: var(--text-muted);
}
.vw-input, .vw-select {
  width: 100%;
  height: var(--control-h);
  padding: 0 var(--space-3);
  background: var(--surface-input);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  color: var(--text-strong);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  outline: none;
  transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
.vw-input::placeholder, textarea.vw-input::placeholder { color: var(--text-muted); }
textarea.vw-input { height: auto; min-height: 130px; resize: vertical; padding: 12px 14px; color: var(--text-body); font-size: 14.5px; line-height: 1.5; }
.vw-input:focus, .vw-select:focus { border-color: var(--purple-400) !important; box-shadow: 0 0 0 3px var(--ring); }
.vw-select-wrap { position: relative; }
.vw-select { appearance: none; cursor: pointer; padding-right: 2.2rem; }
.vw-select-wrap::after {
  content: "▾";
  position: absolute; right: var(--space-3); top: 50%;
  transform: translateY(-50%);
  color: var(--text-muted); pointer-events: none; font-size: 12px;
}

/* Switch */
.vw-switch {
  width: 44px; height: 24px;
  border-radius: var(--radius-pill);
  border: none;
  position: relative;
  cursor: pointer;
  flex-shrink: 0;
  background: var(--ink-600);
  padding: 0;
  transition: background var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}
.vw-switch::after {
  content: "";
  position: absolute; top: 3px; left: 3px;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: #fff;
  transition: left var(--dur-base) var(--ease-out);
}
.vw-switch[aria-checked="true"] { background: var(--purple-500); box-shadow: var(--glow-sm); }
.vw-switch[aria-checked="true"]::after { left: 23px; }
.vw-switch:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--ring); }

/* ════════════════ Header ════════════════ */
.site-header {
  position: sticky; top: 0; z-index: 20;
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 10px 16px;
  padding: 14px 40px;
  background: rgba(12,12,15,0.72);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--border-subtle);
}
.logo-lockup { display: inline-flex; align-items: center; gap: var(--space-3); cursor: pointer; }
.logo-lockup img { height: 34px; width: 34px; object-fit: contain; filter: drop-shadow(0 0 10px rgba(166,61,255,0.5)); }
.logo-words { display: flex; flex-direction: column; line-height: 1; }
.logo-name { font-family: var(--font-display); font-weight: var(--fw-bold); font-size: 17px; letter-spacing: var(--ls-tight); color: var(--text-strong); text-transform: uppercase; }
.logo-sub { font-family: var(--font-display); font-weight: var(--fw-medium); font-size: 9.5px; letter-spacing: var(--ls-wider); color: var(--text-brand); text-transform: uppercase; }
.site-footer .logo-lockup img { height: 30px; width: 30px; }
.site-footer .logo-name { font-size: 15px; }
.site-footer .logo-sub { font-size: 8.4px; }

.site-nav { display: flex; gap: 4px; flex-wrap: wrap; }
.nav-link {
  padding: 8px 15px;
  border-radius: var(--radius-md);
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: var(--fw-semibold);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-muted);
  transition: color var(--dur-fast) ease;
}
.nav-link:hover { color: var(--text-strong); }
.nav-link.is-active { color: var(--text-strong); background: var(--surface-hover); }

/* ════════════════ Shared layout ════════════════ */
.container { max-width: 1180px; margin: 0 auto; }
.section-head { text-align: center; margin-bottom: 44px; }
.section-head h2 { font-size: 40px; margin-top: 10px; }
.uplink {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: var(--fw-semibold);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}
.icon-tile {
  width: 46px; height: 46px;
  border-radius: var(--radius-md);
  background: var(--accent-soft);
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--purple-300);
}
.card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.check-row { display: flex; gap: 10px; align-items: center; font-size: 15px; color: var(--text-body); }
.check-row vw-icon, .check-row .check-ic { color: var(--purple-300); display: inline-flex; }

/* ════════════════ Home ════════════════ */
.hero { position: relative; overflow: hidden; padding: 104px 40px 84px; text-align: center; }
.hero__glow { position: absolute; inset: 0; background: radial-gradient(60% 70% at 50% 0%, rgba(148,18,240,0.22), transparent 70%); pointer-events: none; }
.hero__inner { position: relative; max-width: 880px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 22px; }
.hero h1 { font-size: 72px; line-height: 0.98; letter-spacing: -0.03em; margin: 0; }
.hero .grad-text {
  background: var(--grad-brand);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-shadow: var(--glow-text);
}
.hero p { font-size: 20px; color: var(--text-body); max-width: 620px; line-height: 1.55; margin: 0; }
.hero__ctas { display: flex; gap: 14px; margin-top: 6px; flex-wrap: wrap; justify-content: center; }

.ticker {
  border-top: 1px solid var(--border-subtle);
  border-bottom: 1px solid var(--border-subtle);
  background: var(--ink-900);
  padding: 16px 40px;
}
.ticker__inner {
  max-width: 1180px; margin: 0 auto;
  display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr);
  align-items: center; gap: 24px;
}
.ticker__title {
  justify-self: start; max-width: 100%; min-width: 0;
  overflow: hidden; text-overflow: ellipsis;
  display: flex; align-items: center; gap: 10px;
  font-family: var(--font-mono); font-size: 12px;
  letter-spacing: 0.08em; color: var(--text-muted); white-space: nowrap;
}
.ticker__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--flag-green); box-shadow: var(--glow-green); flex: none; }
.ticker__flags { display: flex; gap: 10px; align-items: center; }
.ticker__readout {
  justify-self: end; max-width: 100%; min-width: 0;
  overflow: hidden; text-overflow: ellipsis;
  font-family: var(--font-mono); font-size: 12px;
  color: var(--text-body); letter-spacing: 0.04em; white-space: nowrap;
}

.products-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.stats-band {
  padding: 56px 40px;
  background: var(--ink-950);
  border-top: 1px solid var(--border-subtle);
  border-bottom: 1px solid var(--border-subtle);
}
.stats-band__inner { max-width: 1000px; margin: 0 auto; display: grid; grid-template-columns: repeat(4,1fr); gap: 30px; justify-items: center; }
.quotes-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.quote-attr { display: flex; align-items: center; gap: 10px; font-family: var(--font-mono); font-size: 12px; color: var(--text-muted); }
.cta-panel { max-width: 900px; margin: 0 auto; text-align: center; background: linear-gradient(135deg, var(--ink-800), var(--ink-900)); }
.cta-panel h2 { font-size: 44px; margin: 0 0 14px; }
.cta-panel p { color: var(--text-body); font-size: 18px; max-width: 520px; margin: 0 auto 28px; }
.cta-panel__btns { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

/* ════════════════ Products ════════════════ */
.page-main { max-width: 1180px; margin: 0 auto; padding: 72px 40px 90px; }
.page-intro h1 { font-size: 52px; margin: 12px 0 16px; line-height: 1.02; }
.page-intro p { font-size: 19px; color: var(--text-body); line-height: 1.6; margin: 0; }
.ibar-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 48px; align-items: center; }
.ibar-grid h2 { font-size: 46px; margin: 0 0 14px; }
.ibar-visual {
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  padding: 34px 24px;
  background: var(--ink-950);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-lg);
}
.ibar-device {
  display: flex; gap: 8px; padding: 12px;
  background: var(--ink-900);
  border: 1px solid var(--ink-600);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg), 0 14px 40px rgba(148,18,240,0.18);
}
.ibar-cell { width: 44px; height: 26px; border-radius: 5px; opacity: 0.22; }
.ibar-cell[data-on] { opacity: 1; }
.ibar-caption { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; color: var(--text-muted); }
.spec-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 24px; font-family: var(--font-mono); font-size: 12.5px; }
.spec-row { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--border-subtle); padding-bottom: 10px; }
.spec-row span:first-child { color: var(--text-muted); }
.spec-row span:last-child { color: var(--text-strong); }
.price-row { display: flex; align-items: baseline; gap: 10px; margin-bottom: 20px; }
.price-big { font-family: var(--font-mono); font-size: 34px; font-weight: var(--fw-bold); color: var(--text-strong); }
.price-note { font-family: var(--font-mono); font-size: 12px; color: var(--text-muted); letter-spacing: 0.06em; }
.mono-list { display: flex; flex-direction: column; gap: 9px; font-family: var(--font-mono); font-size: 12.5px; color: var(--text-body); }
.products-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 22px; }

/* ════════════════ Pricing ════════════════ */
.billing-toggle { display: flex; align-items: center; justify-content: center; gap: 14px; margin-bottom: 44px; }
.billing-toggle .bt-label {
  font-family: var(--font-display); font-size: 13px; font-weight: var(--fw-semibold);
  letter-spacing: 0.04em; text-transform: uppercase; color: var(--text-muted);
  display: inline-flex; align-items: center; gap: 8px;
}
.billing-toggle .bt-label.is-active { color: var(--text-strong); }
.plans-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; align-items: stretch; }
.plan-card { display: flex; flex-direction: column; }
.plan-card__top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.plan-card__top h3 { font-size: 22px; margin: 0; }
.plan-card__blurb { color: var(--text-muted); font-size: 13.5px; line-height: 1.55; margin: 0 0 20px; min-height: 42px; }
.plan-card__price { display: flex; align-items: baseline; gap: 8px; margin-bottom: 22px; }
.plan-card__price .amount { font-family: var(--font-mono); font-size: 38px; font-weight: var(--fw-bold); color: var(--text-strong); }
.plan-card__price .per { font-family: var(--font-mono); font-size: 12px; color: var(--text-muted); }
.plan-card__features { display: flex; flex-direction: column; gap: 11px; margin-bottom: 26px; flex: 1; }
.plan-card__features .check-row { font-size: 14px; }
.pricing-hw-note {
  display: flex; align-items: center; justify-content: center; gap: 12px;
  margin: 36px 0 0;
  font-family: var(--font-mono); font-size: 12.5px; color: var(--text-muted); letter-spacing: 0.04em;
}
.faq-wrap { max-width: 760px; margin: 72px auto 0; }
.faq-list { display: flex; flex-direction: column; gap: 10px; }
.faq-item { background: var(--surface-card); border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); overflow: hidden; }
.faq-item__q {
  all: unset; box-sizing: border-box;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  width: 100%; cursor: pointer; padding: 18px 22px;
  font-family: var(--font-display); font-size: 15.5px; font-weight: var(--fw-semibold); color: var(--text-strong);
}
.faq-item__q:hover { background: var(--surface-hover); }
.faq-item__q:focus-visible { box-shadow: inset 0 0 0 3px var(--ring); }
.faq-item__chev { color: var(--text-muted); display: inline-flex; transition: transform 200ms ease; }
.faq-item[data-open] .faq-item__chev { transform: rotate(180deg); }
.faq-item__a { display: none; padding: 0 22px 18px; font-size: 14.5px; line-height: 1.65; color: var(--text-muted); }
.faq-item[data-open] .faq-item__a { display: block; }

/* ════════════════ About ════════════════ */
.about-main { max-width: 920px; margin: 0 auto; padding: 76px 40px 96px; }
.about-main h1 { font-size: 56px; margin: 12px 0 20px; line-height: 1.02; }
.about-lede { font-size: 20px; color: var(--text-body); line-height: 1.6; max-width: 680px; margin: 0; }
.values-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px; margin: 48px 0; }
.values-3 h3 { font-size: 19px; margin: 14px 0 8px; }
.values-3 p { color: var(--text-muted); font-size: 14px; line-height: 1.6; margin: 0; }
.values-3 .v-icon { color: var(--purple-300); line-height: 0; display: inline-flex; }
.about-stats {
  display: flex; gap: 40px; flex-wrap: wrap;
  padding: 32px 0;
  border-top: 1px solid var(--border-subtle);
  border-bottom: 1px solid var(--border-subtle);
}
.hiring-row { margin-top: 48px; display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.hiring-row span.note { color: var(--text-muted); font-size: 14px; }

/* ════════════════ Contact ════════════════ */
.contact-main { max-width: 1080px; margin: 0 auto; padding: 72px 40px 96px; }
.contact-main .page-intro h1 { font-size: 52px; margin: 12px 0 14px; }
.contact-main .page-intro p { font-size: 18px; }
.contact-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 24px; align-items: start; }
.contact-form { display: flex; flex-direction: column; gap: 18px; }
.contact-form .row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.contact-success { display: none; flex-direction: column; align-items: flex-start; gap: 16px; padding: 12px 0; }
.contact-success h3 { font-size: 24px; margin: 0; }
.contact-success p { color: var(--text-muted); font-size: 15px; line-height: 1.6; margin: 0; max-width: 420px; }
.contact-card--sent .contact-form { display: none; }
.contact-card--sent .contact-success { display: flex; }
.contact-aside { display: flex; flex-direction: column; gap: 24px; }
.pitwall-list { display: flex; flex-direction: column; gap: 16px; font-size: 14px; }
.pitwall-item { display: flex; flex-direction: column; gap: 3px; }
.pitwall-item .k { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; color: var(--text-muted); }
.pitwall-item .v { color: var(--text-body); }
.pitwall-item a.v { font-family: var(--font-mono); font-size: 14px; color: var(--text-brand); }

/* ════════════════ Footer ════════════════ */
.site-footer { border-top: 1px solid var(--border-subtle); padding: 48px 40px 40px; background: var(--ink-950); }
.site-footer__cols { max-width: 1180px; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 32px; }
.site-footer__brand { max-width: 280px; }
.site-footer__brand p { color: var(--text-muted); font-size: 13px; margin: 14px 0 0; line-height: 1.6; }
.site-footer__col { display: flex; flex-direction: column; gap: 10px; }
.site-footer__col a { font-size: 13px; color: var(--text-muted); }
.site-footer__col a:hover { color: var(--text-strong); }
.site-footer__legal {
  max-width: 1180px; margin: 36px auto 0; padding-top: 20px;
  border-top: 1px solid var(--border-subtle);
  display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  color: var(--text-disabled); font-size: 12px; font-family: var(--font-mono);
}

/* ════════════════ Responsive ════════════════ */
@media (max-width: 960px) {
  .hero h1 { font-size: 52px; }
  .products-3, .plans-3 { grid-template-columns: 1fr; }
  .stats-band__inner { grid-template-columns: repeat(2,1fr); }
  .ibar-grid, .products-2, .quotes-2, .contact-grid { grid-template-columns: 1fr; }
  .values-3 { grid-template-columns: 1fr; }
  .ticker__inner { grid-template-columns: 1fr; justify-items: center; row-gap: 12px; }
  .ticker__title, .ticker__readout { justify-self: center; }
  .page-intro h1, .contact-main .page-intro h1 { font-size: 40px; }
  .about-main h1 { font-size: 42px; }
  .ibar-grid h2 { font-size: 38px; }
}
@media (max-width: 640px) {
  .site-header { padding: 12px 20px; }
  .hero { padding: 72px 20px 60px; }
  .hero h1 { font-size: 40px; }
  .page-main, .about-main, .contact-main { padding-left: 20px; padding-right: 20px; }
  .ticker, .stats-band, .site-footer { padding-left: 20px; padding-right: 20px; }
  .section-head h2 { font-size: 30px; }
  .cta-panel h2 { font-size: 32px; }
  .contact-form .row-2 { grid-template-columns: 1fr; }
  .spec-grid { grid-template-columns: 1fr; }
  .stats-band__inner { grid-template-columns: 1fr; justify-items: start; }
}