@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,700;1,9..40,300&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --font-display: 'Bebas Neue', cursive;
  --font-body: 'DM Sans', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;

  --bg:       #fafaf8;
  --bg-2:     #f2ede6;
  --bg-3:     #e8e2d8;
  --bg-4:     #dcd4c8;

  --amber:    #d97706;
  --amber-2:  #b45309;
  --orange:   #ea580c;
  --red-dim:  #fef3c7;

  --text:     #1c1917;
  --text-2:   #44403c;
  --text-3:   #78716c;
  --text-4:   #a8a29e;

  --border:   #e4ddd3;
  --border-2: rgba(217,119,6,0.35);

  --ease:     cubic-bezier(0.16, 1, 0.3, 1);
  --fast:     0.2s;
  --base:     0.45s;
  --slow:     0.9s;

  --max:      1160px;
  --pad:      1.5rem;
}

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

html { scroll-behavior:smooth; -webkit-font-smoothing:antialiased; }

body {
  font-family: var(--font-body);
  font-weight: 300;
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
  overflow-x: hidden;
}

a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
button { cursor:pointer; border:none; background:none; }
input, textarea, select { font-family:var(--font-body); }

.wrap { max-width:var(--max); margin:0 auto; padding:0 var(--pad); }
.section { padding:6rem 0; }
.section-sm { padding:4rem 0; }

.tag {
  display:inline-flex;
  align-items:center;
  gap:0.5rem;
  font-family:var(--font-mono);
  font-size:0.7rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--amber);
  border:1px solid var(--border-2);
  padding:0.35rem 0.85rem;
  border-radius:2px;
}

.tag::before {
  content:'';
  width:5px; height:5px;
  background:var(--amber);
  border-radius:50%;
  box-shadow:0 0 5px var(--amber);
}

h1,h2,h3 { font-family:var(--font-display); font-weight:400; line-height:1; letter-spacing:0.02em; }

.amber { color:var(--amber); }
.grad {
  background: linear-gradient(90deg, var(--amber) 0%, var(--orange) 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

.btn {
  display:inline-flex;
  align-items:center;
  gap:0.5rem;
  padding:0.8rem 2rem;
  font-family:var(--font-display);
  font-size:1rem;
  letter-spacing:0.06em;
  border-radius:3px;
  transition:all var(--base) var(--ease);
  white-space:nowrap;
}

.btn-amber {
  background:var(--amber);
  color:var(--bg);
}
.btn-amber:hover { background:var(--amber-2); transform:translateY(-2px); }

.btn-ghost {
  background:transparent;
  color:var(--text-2);
  border:1px solid var(--border);
}
.btn-ghost:hover { border-color:var(--border-2); color:var(--text); }

.btn-lg { padding:1rem 2.5rem; font-size:1.15rem; }

/* ============================================================
   NAVIGATION
   ============================================================ */

.nav {
  position:fixed;
  top:0; left:0; right:0;
  z-index:100;
  border-bottom:1px solid transparent;
  transition:all var(--base) var(--ease);
}

.nav.scrolled {
  background:rgba(250,250,248,0.92);
  backdrop-filter:blur(16px);
  border-bottom-color:var(--border);
  box-shadow:0 1px 16px rgba(0,0,0,0.06);
}

.nav-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:64px;
  gap:2rem;
}

.nav-logo {
  display:flex;
  align-items:center;
  gap:0.75rem;
  font-family:var(--font-display);
  font-size:1.6rem;
  letter-spacing:0.06em;
  color:var(--text);
}

.nav-logo-mark {
  width:34px; height:34px;
  background:var(--amber);
  border-radius:4px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  color:#fff;
  font-size:0;
}

.nav-logo-mark svg {
  width:20px; height:20px;
  display:block;
}

.logo-text-mynext { color:var(--text); }
.logo-text-docs   { color:var(--amber); }

.nav-links {
  display:flex;
  align-items:center;
  gap:0.15rem;
  list-style:none;
}

.nav-links a {
  padding:0.45rem 0.85rem;
  font-size:0.875rem;
  font-weight:400;
  color:var(--text-3);
  border-radius:2px;
  transition:color var(--fast);
}

.nav-links a:hover, .nav-links a.active { color:var(--text); }

.nav-actions { display:flex; align-items:center; gap:0.75rem; }

.nav-login {
  font-size:0.875rem;
  color:var(--text-3);
  padding:0.45rem 0.85rem;
  transition:color var(--fast);
}
.nav-login:hover { color:var(--text); }

.nav-cta { padding:0.55rem 1.25rem; font-size:0.85rem; }

.hamburger {
  display:none;
  flex-direction:column;
  gap:5px;
  padding:0.4rem;
}
.hamburger span {
  display:block;
  width:22px; height:2px;
  background:var(--text);
  border-radius:2px;
  transition:all var(--base) var(--ease);
}
.hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity:0; }
.hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

.mobile-menu {
  display:none;
  position:fixed;
  inset:0;
  background:rgba(250,250,248,0.98);
  z-index:99;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2rem;
}
.mobile-menu.open { display:flex; }
.mobile-menu a {
  font-family:var(--font-display);
  font-size:2rem;
  letter-spacing:0.06em;
  color:var(--text-3);
  transition:color var(--fast);
}
.mobile-menu a:hover { color:var(--amber); }

/* ============================================================
   HERO
   ============================================================ */

.hero {
  min-height:100vh;
  display:flex;
  align-items:center;
  padding-top:5rem;
  padding-bottom:5rem;
  position:relative;
  overflow:hidden;
}

.hero::before {
  content:'';
  position:absolute;
  top:-20%;
  right:-10%;
  width:600px; height:600px;
  background:radial-gradient(circle, rgba(217,119,6,0.08) 0%, transparent 70%);
  pointer-events:none;
}

.hero-layout {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:4rem;
  align-items:center;
}

.hero-eyebrow {
  display:flex;
  align-items:center;
  gap:1rem;
  margin-bottom:2rem;
}

.hero-line {
  width:48px; height:1px;
  background:var(--amber);
}

.hero-eyebrow-text {
  font-family:var(--font-mono);
  font-size:0.72rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--amber);
}

.hero-title {
  font-size:clamp(3.5rem,7vw,6rem);
  line-height:0.95;
  letter-spacing:0.02em;
  margin-bottom:1.75rem;
  color:var(--text);
}

.hero-title em {
  font-style:normal;
  color:var(--amber);
}

.hero-desc {
  font-size:1rem;
  color:var(--text-3);
  line-height:1.75;
  max-width:420px;
  margin-bottom:2.5rem;
  font-weight:300;
}

.hero-actions {
  display:flex;
  align-items:center;
  gap:1rem;
  flex-wrap:wrap;
}

.hero-note {
  margin-top:1.25rem;
  font-size:0.8rem;
  color:var(--text-4);
  font-family:var(--font-mono);
}

.hero-right {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
}

.hero-card {
  padding:1.75rem 1.5rem;
  background:var(--bg-2);
  border:1px solid var(--border);
  border-radius:4px;
  transition:border-color var(--fast);
}

.hero-card:hover { border-color:var(--border-2); }

.hero-card.big {
  grid-column:1 / -1;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:1rem;
  min-height:120px;
}

.hero-card-num {
  font-family:var(--font-display);
  font-size:3rem;
  letter-spacing:0.02em;
  color:var(--amber);
  line-height:1;
  display:block;
}

.hero-card.big .hero-card-num { font-size:4.5rem; }

.hero-card-label {
  font-size:0.78rem;
  color:var(--text-3);
  font-weight:400;
  margin-top:0.4rem;
  letter-spacing:0.04em;
}

.hero-card.big .hero-card-label {
  font-size:0.85rem;
  max-width:180px;
  line-height:1.5;
}

.hero-card-icon {
  font-size:2rem;
  margin-bottom:0.75rem;
}

/* ============================================================
   DIVIDER
   ============================================================ */

.divider {
  border:none;
  border-top:1px solid var(--border);
  margin:0;
}

/* ============================================================
   BENTO FEATURES
   ============================================================ */

.bento {
  display:grid;
  grid-template-columns:repeat(12,1fr);
  grid-auto-rows:minmax(180px,auto);
  gap:1rem;
}

.bento-cell {
  background:var(--bg-2);
  border:1px solid var(--border);
  border-radius:4px;
  padding:2rem;
  transition:all var(--base) var(--ease);
  position:relative;
  overflow:hidden;
}

.bento-cell:hover {
  border-color:var(--border-2);
  background:var(--bg-3);
}

.bento-cell::after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(245,158,11,0.04) 0%, transparent 60%);
  opacity:0;
  transition:opacity var(--base);
}

.bento-cell:hover::after { opacity:1; }

.bc-1  { grid-column:span 5; }
.bc-2  { grid-column:span 7; }
.bc-3  { grid-column:span 4; }
.bc-4  { grid-column:span 4; }
.bc-5  { grid-column:span 4; }
.bc-6  { grid-column:span 8; }
.bc-7  { grid-column:span 4; }
.bc-8  { grid-column:span 6; }
.bc-9  { grid-column:span 6; }

.bento-icon {
  font-size:1.5rem;
  margin-bottom:1.25rem;
  display:block;
}

.bento-tag {
  font-family:var(--font-mono);
  font-size:0.65rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--amber);
  margin-bottom:0.5rem;
  display:block;
}

.bento-title {
  font-family:var(--font-display);
  font-size:1.6rem;
  letter-spacing:0.03em;
  margin-bottom:0.75rem;
  line-height:1.1;
}

.bento-desc {
  font-size:0.875rem;
  color:var(--text-3);
  line-height:1.65;
}

.bento-big-num {
  font-family:var(--font-display);
  font-size:5rem;
  letter-spacing:0.02em;
  line-height:1;
  color:var(--amber);
  display:block;
  margin-bottom:0.5rem;
}

.bento-metrics {
  display:flex;
  gap:2rem;
  margin-top:1.5rem;
}

.bento-metric strong {
  display:block;
  font-family:var(--font-display);
  font-size:1.75rem;
  color:var(--amber);
  letter-spacing:0.04em;
  line-height:1;
}

.bento-metric span {
  font-size:0.75rem;
  color:var(--text-3);
  letter-spacing:0.04em;
}

.bento-cell.highlight {
  background:var(--amber);
  border-color:var(--amber);
}

.bento-cell.highlight .bento-title,
.bento-cell.highlight .bento-desc,
.bento-cell.highlight .bento-tag {
  color: #1c1917;
}

.bento-cell.highlight .bento-tag { opacity:0.65; }

/* ============================================================
   STATS STRIP
   ============================================================ */

.stats-strip {
  background:var(--bg-2);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}

.stats-strip-inner {
  display:flex;
  align-items:stretch;
}

.stat-block {
  flex:1;
  padding:2.5rem 1.5rem;
  text-align:center;
  border-right:1px solid var(--border);
  transition:background var(--fast);
}

.stat-block:last-child { border-right:none; }
.stat-block:hover { background:var(--bg-3); }

.stat-block-num {
  font-family:var(--font-display);
  font-size:3rem;
  letter-spacing:0.04em;
  color:var(--amber);
  display:block;
  line-height:1;
  margin-bottom:0.5rem;
}

.stat-block-label {
  font-size:0.8rem;
  color:var(--text-3);
  letter-spacing:0.06em;
  text-transform:uppercase;
  font-family:var(--font-mono);
}

/* ============================================================
   SECTION HEADER
   ============================================================ */

.sh {
  margin-bottom:3rem;
}

.sh-top {
  display:flex;
  align-items:center;
  gap:1.5rem;
  margin-bottom:1.25rem;
}

.sh-line {
  flex:1;
  height:1px;
  background:var(--border);
}

.sh h2 {
  font-size:clamp(2.5rem,5vw,4rem);
  line-height:0.95;
  letter-spacing:0.02em;
}

.sh p {
  font-size:1rem;
  color:var(--text-3);
  max-width:560px;
  line-height:1.7;
  margin-top:1rem;
}

/* ============================================================
   USE CASES PANEL GRID
   ============================================================ */

.panels {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--border);
  border:1px solid var(--border);
  border-radius:4px;
  overflow:hidden;
}

.panel {
  background:var(--bg);
  padding:2.5rem 2rem;
  transition:background var(--fast);
}

.panel:hover { background:var(--bg-2); }

.panel-num {
  font-family:var(--font-display);
  font-size:3.5rem;
  color:var(--bg-3);
  letter-spacing:0.04em;
  line-height:1;
  margin-bottom:1.25rem;
  display:block;
  transition:color var(--fast);
}

.panel:hover .panel-num { color:var(--amber); }

.panel-title {
  font-family:var(--font-display);
  font-size:1.4rem;
  letter-spacing:0.03em;
  margin-bottom:0.75rem;
  line-height:1.1;
}

.panel-desc {
  font-size:0.875rem;
  color:var(--text-3);
  line-height:1.65;
  margin-bottom:1.25rem;
}

.panel-stat {
  font-family:var(--font-mono);
  font-size:0.72rem;
  color:var(--amber);
  letter-spacing:0.08em;
}

/* ============================================================
   TESTIMONIALS — HORIZONTAL SCROLL
   ============================================================ */

.testimonials-scroll {
  display:flex;
  gap:1rem;
  overflow-x:auto;
  padding-bottom:1rem;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
}

.testimonials-scroll::-webkit-scrollbar { height:2px; }
.testimonials-scroll::-webkit-scrollbar-track { background:var(--bg-2); }
.testimonials-scroll::-webkit-scrollbar-thumb { background:var(--border-2); }

.tcard {
  flex:0 0 340px;
  scroll-snap-align:start;
  background:var(--bg-2);
  border:1px solid var(--border);
  border-radius:4px;
  padding:2rem;
  transition:border-color var(--fast);
}

.tcard:hover { border-color:var(--border-2); }

.tcard-quote {
  font-size:2rem;
  color:var(--amber);
  line-height:1;
  margin-bottom:1rem;
  font-family:var(--font-display);
}

.tcard-text {
  font-size:0.9rem;
  color:var(--text-2);
  line-height:1.7;
  margin-bottom:1.5rem;
  font-style:italic;
}

.tcard-author {
  display:flex;
  align-items:center;
  gap:0.875rem;
}

.tcard-avatar {
  width:38px; height:38px;
  border-radius:50%;
  background:var(--bg-4);
  border:1px solid var(--border-2);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--font-display);
  font-size:0.875rem;
  color:var(--amber);
  flex-shrink:0;
}

.tcard-name {
  font-weight:500;
  font-size:0.875rem;
}

.tcard-role {
  font-size:0.775rem;
  color:var(--text-3);
  margin-top:0.1rem;
}

/* ============================================================
   INTEGRATIONS
   ============================================================ */

.integrations-row {
  display:flex;
  flex-wrap:wrap;
  gap:0.75rem;
}

.integration-pill {
  display:flex;
  align-items:center;
  gap:0.5rem;
  padding:0.6rem 1.1rem;
  background:var(--bg-2);
  border:1px solid var(--border);
  border-radius:3px;
  font-size:0.85rem;
  color:var(--text-2);
  font-weight:400;
  transition:all var(--fast);
}

.integration-pill:hover {
  border-color:var(--border-2);
  color:var(--text);
}

.integration-pill span { font-size:1rem; }

.integrations-cat {
  margin-bottom:2rem;
}

.integrations-cat-label {
  font-family:var(--font-mono);
  font-size:0.65rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--text-4);
  margin-bottom:0.75rem;
}

/* ============================================================
   CTA BAND
   ============================================================ */

.cta-band {
  background:var(--amber);
  padding:5rem 0;
}

.cta-band-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:3rem;
}

.cta-band h2 {
  font-size:clamp(2.5rem,5vw,4rem);
  color:var(--bg);
  line-height:1;
  letter-spacing:0.02em;
}

.cta-band p {
  font-size:0.975rem;
  color:rgba(12,10,8,0.65);
  margin-top:0.75rem;
  max-width:460px;
  line-height:1.7;
}

.cta-band-actions {
  display:flex;
  gap:1rem;
  flex-shrink:0;
  flex-wrap:wrap;
}

.btn-dark {
  background: #1c1917;
  color:var(--amber);
  padding:0.9rem 2.25rem;
  font-family:var(--font-display);
  font-size:1rem;
  letter-spacing:0.06em;
  border-radius:3px;
  transition:all var(--base) var(--ease);
}

.btn-dark:hover { transform:translateY(-2px); background:#2c2420; }

.btn-amber-outline {
  background:transparent;
  color: #1c1917;
  border:2px solid #1c1917;
  padding:0.85rem 2rem;
  font-family:var(--font-display);
  font-size:1rem;
  letter-spacing:0.06em;
  border-radius:3px;
  display:inline-flex;
  align-items:center;
  transition:all var(--base) var(--ease);
}

.btn-amber-outline:hover {
  background:#1c1917;
  color:var(--amber);
}

/* ============================================================
   FORMS
   ============================================================ */

.form-page {
  padding-top:7rem;
  padding-bottom:6rem;
}

.form-layout {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:5rem;
  align-items:start;
}

.form-info h1 {
  font-size:clamp(2.5rem,5vw,4rem);
  letter-spacing:0.02em;
  line-height:1;
  margin-bottom:1.5rem;
}

.form-info p {
  font-size:0.975rem;
  color:var(--text-3);
  line-height:1.75;
  margin-bottom:2rem;
}

.form-info-list {
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:0.75rem;
}

.form-info-list li {
  display:flex;
  align-items:center;
  gap:0.75rem;
  font-size:0.875rem;
  color:var(--text-2);
}

.form-info-list li::before {
  content:'→';
  color:var(--amber);
  font-family:var(--font-mono);
}

.form-box {
  background:var(--bg-2);
  border:1px solid var(--border);
  border-radius:4px;
  padding:2.5rem;
}

.form-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
}

.form-group { margin-bottom:1.25rem; }

.form-label {
  display:block;
  font-family:var(--font-mono);
  font-size:0.7rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--text-3);
  margin-bottom:0.5rem;
}

.form-label span { color:var(--amber); }

.form-input, .form-select, .form-textarea {
  width:100%;
  padding:0.7rem 0.9rem;
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:3px;
  color:var(--text);
  font-size:0.9rem;
  font-family:var(--font-body);
  transition:border-color var(--fast);
}

.form-input::placeholder, .form-textarea::placeholder { color:var(--text-4); }

.form-input:focus, .form-select:focus, .form-textarea:focus {
  border-color:var(--amber);
  outline:none;
}

.form-select option { background:var(--bg-2); color:var(--text); }

.form-textarea {
  resize:vertical;
  min-height:130px;
  line-height:1.6;
}

.phone-row { display:grid; grid-template-columns:75px 1fr; gap:0.75rem; }

.form-check {
  display:flex;
  align-items:flex-start;
  gap:0.75rem;
  margin-bottom:0.9rem;
}

.form-check input[type="checkbox"] {
  width:16px; height:16px;
  min-width:16px;
  margin-top:3px;
  accent-color:var(--amber);
  cursor:pointer;
}

.form-check-label {
  font-size:0.8rem;
  color:var(--text-3);
  line-height:1.55;
}

.form-check-label a { color:var(--amber); text-decoration:underline; }

.form-submit {
  width:100%;
  padding:0.9rem;
  background:var(--amber);
  color:var(--bg);
  font-family:var(--font-display);
  font-size:1.1rem;
  letter-spacing:0.06em;
  border-radius:3px;
  border:none;
  cursor:pointer;
  transition:all var(--base) var(--ease);
  margin-top:0.5rem;
}

.form-submit:hover { background:var(--amber-2); transform:translateY(-1px); }
.form-submit:disabled { opacity:0.6; cursor:not-allowed; transform:none; }

.form-notice {
  margin-top:1.5rem;
  padding:1rem;
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:3px;
  font-size:0.76rem;
  color:var(--text-4);
  line-height:1.6;
}

.form-notice a { color:var(--amber); }

.alert {
  padding:0.875rem 1rem;
  border-radius:3px;
  font-size:0.875rem;
  margin-bottom:1.25rem;
  display:none;
}

.alert.show { display:block; }

.alert-success {
  background:rgba(34,197,94,0.08);
  border:1px solid rgba(34,197,94,0.3);
  color:#86efac;
}

.alert-error {
  background:rgba(239,68,68,0.08);
  border:1px solid rgba(239,68,68,0.3);
  color:#fca5a5;
}

/* ============================================================
   PAGE HERO
   ============================================================ */

.page-hero {
  padding-top:9rem;
  padding-bottom:4rem;
  border-bottom:1px solid var(--border);
}

.page-hero-eyebrow {
  display:flex;
  align-items:center;
  gap:1rem;
  margin-bottom:1.75rem;
}

.page-title {
  font-size:clamp(3rem,6vw,5.5rem);
  letter-spacing:0.02em;
  line-height:0.95;
  margin-bottom:1.25rem;
}

.page-subtitle {
  font-size:1.05rem;
  color:var(--text-3);
  max-width:560px;
  line-height:1.7;
}

/* ============================================================
   LEGAL
   ============================================================ */

.legal-page {
  padding-top:7rem;
  padding-bottom:6rem;
}

.legal-header {
  max-width:820px;
  margin:0 auto 3rem;
  border-bottom:1px solid var(--border);
  padding-bottom:2rem;
}

.legal-header h1 {
  font-size:clamp(2.5rem,5vw,4rem);
  letter-spacing:0.02em;
  margin-bottom:0.5rem;
}

.legal-header p { font-size:0.875rem; color:var(--text-4); }

.legal-content {
  max-width:820px;
  margin:0 auto;
  font-size:0.94rem;
  line-height:1.8;
  color:var(--text-3);
}

.legal-content h2 {
  font-size:1.75rem;
  color:var(--text);
  letter-spacing:0.04em;
  margin-top:3rem;
  margin-bottom:1rem;
}

.legal-content h3 {
  font-size:1.25rem;
  color:var(--text);
  letter-spacing:0.04em;
  margin-top:2rem;
  margin-bottom:0.75rem;
}

.legal-content p { margin-bottom:1rem; }

.legal-content ul, .legal-content ol {
  margin:0.75rem 0 1rem 1.5rem;
}

.legal-content li { margin-bottom:0.4rem; }
.legal-content a { color:var(--amber); text-decoration:underline; }
.legal-content strong { color:var(--text); font-weight:500; }

.legal-content .highlight-box {
  background:var(--bg-2);
  border:1px solid var(--border-2);
  border-left:3px solid var(--amber);
  border-radius:3px;
  padding:1.25rem 1.5rem;
  margin:1.75rem 0;
  color:var(--text-2);
}

/* ============================================================
   FOOTER
   ============================================================ */

.footer {
  border-top:1px solid var(--border);
  padding:5rem 0 2.5rem;
}

.footer-grid {
  display:grid;
  grid-template-columns:1.75fr 1fr 1fr 1fr;
  gap:3rem;
  margin-bottom:4rem;
}

.footer-brand-logo {
  display:flex;
  align-items:center;
  gap:0.75rem;
  font-family:var(--font-display);
  font-size:1.5rem;
  letter-spacing:0.06em;
  color:var(--text);
  margin-bottom:1.25rem;
}

.footer-desc {
  font-size:0.875rem;
  color:var(--text-4);
  line-height:1.65;
  max-width:260px;
  margin-bottom:1.5rem;
}

.footer-social {
  display:flex;
  gap:0.6rem;
}

.footer-social a {
  width:34px; height:34px;
  background:var(--bg-2);
  border:1px solid var(--border);
  border-radius:3px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:0.85rem;
  color:var(--text-4);
  transition:all var(--fast);
}

.footer-social a:hover {
  border-color:var(--border-2);
  color:var(--amber);
}

.footer-col-title {
  font-family:var(--font-mono);
  font-size:0.65rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--text-4);
  margin-bottom:1.25rem;
}

.footer-links {
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:0.65rem;
}

.footer-links a {
  font-size:0.875rem;
  color:var(--text-3);
  transition:color var(--fast);
}

.footer-links a:hover { color:var(--text); }

.footer-contact {
  font-size:0.875rem;
  color:var(--text-3);
  line-height:1.75;
}

.footer-contact a { color:var(--amber); }

.footer-bottom {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-top:2.5rem;
  border-top:1px solid var(--border);
  font-size:0.8rem;
  color:var(--text-4);
  gap:1rem;
}

.footer-bottom-links {
  display:flex;
  gap:1.5rem;
  flex-wrap:wrap;
}

.footer-bottom-links a {
  color:var(--text-4);
  transition:color var(--fast);
}

.footer-bottom-links a:hover { color:var(--amber); }

/* ============================================================
   ANIMATIONS
   ============================================================ */

.fade-in {
  opacity:0;
  animation:fadeUp var(--slow) var(--ease) forwards;
}

.s1 { animation-delay:0.08s; }
.s2 { animation-delay:0.16s; }
.s3 { animation-delay:0.24s; }
.s4 { animation-delay:0.32s; }
.s5 { animation-delay:0.4s; }

@keyframes fadeUp {
  from { opacity:0; transform:translateY(28px); }
  to   { opacity:1; transform:translateY(0); }
}

.reveal {
  opacity:0;
  transform:translateY(22px);
  transition:opacity 0.7s var(--ease), transform 0.7s var(--ease);
}

.reveal.visible { opacity:1; transform:translateY(0); }

/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width:1024px) {
  .bento { grid-template-columns:repeat(6,1fr); }
  .bc-1,.bc-2,.bc-6,.bc-8,.bc-9 { grid-column:span 6; }
  .bc-3,.bc-4,.bc-5 { grid-column:span 3; }
  .bc-7 { grid-column:span 6; }

  .hero-layout { grid-template-columns:1fr; gap:3rem; }
  .hero-right { grid-template-columns:repeat(4,1fr); }
  .hero-card.big { grid-column:span 2; }

  .footer-grid { grid-template-columns:1fr 1fr; gap:2.5rem; }

  .panels { grid-template-columns:1fr; }

  .stats-strip-inner { flex-wrap:wrap; }
  .stat-block { flex:0 0 50%; border-bottom:1px solid var(--border); }
  .stat-block:nth-child(odd) { border-right:1px solid var(--border); }
  .stat-block:nth-child(even) { border-right:none; }

  .cta-band-inner { flex-direction:column; text-align:center; align-items:center; }
  .cta-band p { margin:0.75rem auto; }
}

@media (max-width:768px) {
  :root { --pad:1.25rem; }

  .nav-links, .nav-actions { display:none; }
  .hamburger { display:flex; }

  .hero-right { grid-template-columns:1fr 1fr; }
  .hero-card.big { grid-column:1 / -1; }

  .bento { grid-template-columns:1fr; }
  .bc-1,.bc-2,.bc-3,.bc-4,.bc-5,.bc-6,.bc-7,.bc-8,.bc-9 { grid-column:span 1; }

  .footer-grid { grid-template-columns:1fr; }

  .form-layout { grid-template-columns:1fr; gap:3rem; }
  .form-row { grid-template-columns:1fr; }

  .stat-block { flex:0 0 100%; border-right:none; }
}

@media (max-width:480px) {
  .hero-actions { flex-direction:column; }
  .btn-lg { justify-content:center; text-align:center; }
  .hero-right { grid-template-columns:1fr; }
  .hero-card.big { min-height:auto; flex-direction:column; align-items:flex-start; }
}

@media (prefers-reduced-motion:reduce) {
  .fade-in { animation:none; opacity:1; }
  .reveal { transition:none; opacity:1; transform:none; }
}