*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --ink: #0e0e0c;
  --ink2: #2e2e2a;
  --ink3: #5a5a54;
  --ink4: #9a9a90;
  --paper: #f5f3ee;
  --paper2: #edeae2;
  --paper3: #e3e0d8;
  --white: #ffffff;
  --green: #1a5c3a;
  --green2: #2d8a58;
  --green3: #e8f3ed;
  --amber: #b86b0a;
  --amber2: #fdf0e0;
  --rule: rgba(14,14,12,0.11);
  --serif: 'DM Serif Display', Georgia, serif;
  --sans: 'Instrument Sans', -apple-system, sans-serif;
  --mono: 'DM Mono', 'Courier New', monospace;
}
html { scroll-behavior: smooth; }
body { font-family: var(--sans); background: var(--paper); color: var(--ink); font-size: 16px; line-height: 1.65; -webkit-font-smoothing: antialiased; overflow-x: hidden; }

/* NAV */
nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; height: 60px; display: flex; align-items: center; justify-content: space-between; padding: 0 48px; background: rgba(245,243,238,0.94); backdrop-filter: blur(10px); border-bottom: 1px solid var(--rule); }
.logo { font-family: var(--serif); font-size: 21px; color: var(--ink); text-decoration: none; letter-spacing: -0.02em; }
.logo span { color: var(--green2); font-style: italic; }
.nav-links { display: flex; gap: 24px; align-items: center; }
.nav-link { font-size: 13px; font-weight: 500; color: var(--ink3); text-decoration: none; }
.nav-link:hover { color: var(--ink); }
.nav-dropdown { position: relative; }
.nav-dropdown-menu { display: none; position: absolute; top: 100%; left: 0; background: var(--white); border: 1px solid var(--rule); border-radius: 4px; padding: 8px 0; min-width: 200px; box-shadow: 0 8px 24px rgba(14,14,12,0.08); }
.nav-dropdown:hover .nav-dropdown-menu { display: block; }
.nav-dropdown-menu a { display: block; padding: 9px 16px; font-size: 13px; color: var(--ink3); text-decoration: none; }
.nav-dropdown-menu a:hover { background: var(--paper2); color: var(--ink); }
.nav-btn { background: var(--ink); color: var(--paper); padding: 8px 18px; border-radius: 3px; font-size: 13px; font-weight: 500; text-decoration: none; }
.nav-btn:hover { background: var(--green); color: var(--paper); }

/* HAMBURGER */
.nav-hamburger { display: none; flex-direction: column; justify-content: center; gap: 5px; width: 36px; height: 36px; background: none; border: none; cursor: pointer; padding: 4px; }
.nav-hamburger span { display: block; width: 22px; height: 1.5px; background: var(--ink); border-radius: 2px; transition: transform 0.2s, opacity 0.2s; }
.nav-hamburger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.nav-hamburger.open span:nth-child(2) { opacity: 0; }
.nav-hamburger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* MOBILE MENU OVERLAY */
.nav-mobile { display: none; position: fixed; top: 60px; left: 0; right: 0; bottom: 0; background: var(--paper); z-index: 99; overflow-y: auto; padding: 24px 32px 48px; }
.nav-mobile.open { display: block; }
.nav-mobile-section { margin-bottom: 32px; }
.nav-mobile-label { font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink4); margin-bottom: 12px; }
.nav-mobile a { display: block; font-size: 18px; font-weight: 500; color: var(--ink); text-decoration: none; padding: 10px 0; border-bottom: 1px solid var(--rule); }
.nav-mobile a:last-child { border-bottom: none; }
.nav-mobile a:hover { color: var(--green2); }
.nav-mobile-cta { margin-top: 32px; }
.nav-mobile-cta a { display: block; background: var(--ink); color: var(--paper); padding: 14px 24px; border-radius: 3px; font-size: 15px; font-weight: 500; text-align: center; text-decoration: none; }
.nav-mobile-cta a:hover { background: var(--green); color: var(--paper); }

/* BUTTONS */
.btn-dark { background: var(--ink); color: var(--paper); padding: 13px 26px; border-radius: 3px; font-size: 14px; font-weight: 500; text-decoration: none; display: inline-block; }
.btn-dark:hover { background: var(--green); }
.btn-outline { border: 1px solid var(--rule); color: var(--ink2); padding: 13px 26px; border-radius: 3px; font-size: 14px; font-weight: 500; text-decoration: none; display: inline-block; }
.btn-outline:hover { border-color: var(--ink3); }
.btn-green { background: var(--green); color: var(--paper); padding: 13px 26px; border-radius: 3px; font-size: 14px; font-weight: 500; text-decoration: none; display: inline-block; }
.btn-green:hover { background: var(--ink); }
.btn-ghost-green { border: 1px solid var(--green3); color: var(--green); padding: 13px 26px; border-radius: 3px; font-size: 14px; font-weight: 500; text-decoration: none; display: inline-block; }
.btn-ghost-green:hover { background: var(--green3); }
.btn-amber { background: var(--amber); color: var(--paper); padding: 13px 26px; border-radius: 3px; font-size: 14px; font-weight: 500; text-decoration: none; display: inline-block; }
.btn-amber:hover { background: var(--ink); }
.btn-ghost-amber { border: 1px solid var(--amber2); color: var(--amber); padding: 13px 26px; border-radius: 3px; font-size: 14px; font-weight: 500; text-decoration: none; display: inline-block; }
.btn-ghost-amber:hover { background: var(--amber2); }

/* BADGES */
.badge { font-family: var(--mono); font-size: 11px; padding: 5px 10px; border-radius: 2px; }
.badge-green { background: var(--green3); color: var(--green); }
.badge-amber { background: var(--amber2); color: var(--amber); }
.badge-gray { background: var(--paper3); color: var(--ink3); }
.tag-green { background: var(--green3); color: var(--green); font-family: var(--mono); font-size: 11px; padding: 5px 10px; border-radius: 2px; font-weight: 500; }
.tag-amber { background: var(--amber2); color: var(--amber); font-family: var(--mono); font-size: 11px; padding: 5px 10px; border-radius: 2px; font-weight: 500; }
.tag-link { font-size: 13px; color: var(--green2); text-decoration: none; font-weight: 500; }
.tag-link:hover { color: var(--ink); }

/* SECTION UTILITIES */
.section-tag { font-family: var(--mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 14px; }
.section-tag.light { color: #5ecb8a; }
.section-tag.dark { color: var(--green2); }
.section-tag.amber { color: var(--amber); }
.section-h2 { font-family: var(--serif); font-size: clamp(32px, 3.5vw, 46px); letter-spacing: -0.02em; line-height: 1.1; margin-bottom: 16px; }
.section-h2.on-dark { color: var(--paper); }
.section-h2.on-light { color: var(--ink); }
.section-lead { font-size: 17px; line-height: 1.7; max-width: 580px; margin-bottom: 48px; }
.section-lead.on-dark { color: rgba(245,243,238,0.6); }
.section-lead.on-light { color: var(--ink3); }

/* HERO */
.hero { padding: 110px 80px 80px; max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.hero-tag { font-family: var(--mono); font-size: 11px; color: var(--green2); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 20px; display: flex; align-items: center; gap: 10px; }
.hero-tag::before { content: ''; display: block; width: 20px; height: 1px; background: var(--green2); }
.hero h1 { font-family: var(--serif); font-size: clamp(40px, 4.5vw, 56px); line-height: 1.06; letter-spacing: -0.02em; color: var(--ink); margin-bottom: 20px; }
.hero h1 em { font-style: italic; color: var(--green2); }
.hero-sub { font-size: 17px; color: var(--ink3); line-height: 1.7; margin-bottom: 32px; max-width: 440px; }
.hero-btns { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 36px; }
.hero-badges { display: flex; gap: 8px; flex-wrap: wrap; }

/* HERO CARD */
.hero-card { background: var(--white); border: 1px solid var(--rule); border-radius: 8px; overflow: hidden; box-shadow: 0 4px 24px rgba(14,14,12,0.07); }
.hc-header { padding: 12px 18px; border-bottom: 1px solid var(--rule); display: flex; justify-content: space-between; align-items: center; background: var(--paper2); }
.hc-title { font-family: var(--mono); font-size: 11px; color: var(--ink4); letter-spacing: 0.06em; }
.hc-pill { font-family: var(--mono); font-size: 10px; background: var(--green3); color: var(--green); padding: 3px 8px; border-radius: 2px; }
.hc-body { padding: 12px 18px; }
.hc-row { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; align-items: center; padding: 7px 0; border-bottom: 1px solid var(--rule); }
.hc-row:last-of-type { border-bottom: none; }
.hc-row.faded { opacity: 0.4; }
.hc-name { font-size: 13px; font-weight: 500; color: var(--ink); }
.hc-type { font-family: var(--mono); font-size: 10px; color: var(--ink4); background: var(--paper2); padding: 2px 6px; border-radius: 2px; }
.hc-dot { width: 6px; height: 6px; border-radius: 50%; background: #4aab76; flex-shrink: 0; }
.hc-dot.csv { background: var(--amber); }
.hc-write-back { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--ink3); background: var(--paper2); border-top: 1px solid var(--rule); padding: 9px 18px; }
.hc-write-back::before { content: '↩'; color: var(--green2); font-size: 14px; }
.hc-footer { padding: 12px 18px; border-top: 1px solid var(--rule); display: flex; justify-content: space-between; align-items: baseline; }
.hc-foot-label { font-size: 12px; color: var(--ink4); }
.hc-foot-sub { font-family: var(--mono); font-size: 10px; color: var(--ink4); margin-top: 2px; }
.hc-foot-val { font-family: var(--serif); font-size: 26px; color: var(--green2); letter-spacing: -0.02em; }

/* LOGOS */
.logos { border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); background: var(--paper2); padding: 14px 80px; display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }
.logos-label { font-family: var(--mono); font-size: 10px; color: var(--ink4); letter-spacing: 0.1em; text-transform: uppercase; white-space: nowrap; flex-shrink: 0; }
.logos-list { display: flex; gap: 28px; flex-wrap: wrap; }
.logos-list span { font-size: 13px; font-weight: 600; color: var(--ink4); }

/* PROBLEM */
.problem { background: var(--ink); padding: 80px; }
.problem-inner { max-width: 1200px; margin: 0 auto; }
.problem-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: rgba(245,243,238,0.08); border: 1px solid rgba(245,243,238,0.08); border-radius: 6px; overflow: hidden; }
.problem-item { background: var(--ink); padding: 36px 32px; }
.problem-num { font-family: var(--serif); font-size: 52px; color: rgba(245,243,238,0.22); line-height: 1; margin-bottom: 16px; }
.problem-item h3 { font-size: 15px; font-weight: 600; color: var(--paper); margin-bottom: 10px; }
.problem-item p { font-size: 14px; color: rgba(245,243,238,0.5); line-height: 1.65; }

/* ICP */
.icp-section { padding: 80px; max-width: 1200px; margin: 0 auto; }
.icp-grid { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--rule); border-radius: 6px; overflow: hidden; }
.icp-card { background: var(--white); padding: 44px 40px; border-right: 1px solid var(--rule); }
.icp-card:last-child { border-right: none; }
.icp-eyebrow { font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 16px; padding: 4px 10px; border-radius: 2px; display: inline-block; }
.icp-eyebrow.green { background: var(--green3); color: var(--green); }
.icp-eyebrow.amber { background: var(--amber2); color: var(--amber); }
.icp-card h3 { font-family: var(--serif); font-size: 27px; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 12px; line-height: 1.15; }
.icp-card > p { font-size: 15px; color: var(--ink3); line-height: 1.7; margin-bottom: 20px; }
.icp-pains { list-style: none; margin-bottom: 24px; }
.icp-pains li { font-size: 14px; color: var(--ink3); padding: 8px 0; border-bottom: 1px solid var(--rule); display: flex; gap: 10px; line-height: 1.5; }
.icp-pains li:last-child { border-bottom: none; }
.icp-pains li::before { content: '→'; color: var(--ink4); flex-shrink: 0; font-size: 13px; margin-top: 1px; }
.icp-product { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

/* PRODUCTS */
.products-section { background: var(--paper2); padding: 80px; }
.products-inner { max-width: 1200px; margin: 0 auto; }
.products-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 48px; }
.product-card { background: var(--white); border: 1px solid var(--rule); border-radius: 6px; padding: 40px; position: relative; overflow: hidden; }
.product-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; }
.product-card.automate::before { background: var(--green2); }
.product-card.intelligence::before { background: var(--amber); }
.product-tier { font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 10px; }
.product-tier.green { color: var(--green2); }
.product-tier.amber { color: var(--amber); }
.product-card h3 { font-family: var(--serif); font-size: 28px; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 4px; }
.product-desc-label { font-family: var(--mono); font-size: 12px; color: var(--ink4); margin-bottom: 16px; }
.product-card > p { font-size: 15px; color: var(--ink3); line-height: 1.7; margin-bottom: 24px; }
.feature-list { list-style: none; margin-bottom: 28px; }
.feature-list li { font-size: 14px; color: var(--ink3); padding: 7px 0; border-bottom: 1px solid var(--rule); display: flex; gap: 10px; line-height: 1.5; }
.feature-list li:last-child { border-bottom: none; }
.feature-list li::before { content: '✓'; font-size: 12px; flex-shrink: 0; margin-top: 1px; }
.product-card.automate .feature-list li::before { color: var(--green2); }
.product-card.intelligence .feature-list li::before { color: var(--amber); }
.product-price { display: flex; align-items: baseline; gap: 4px; margin-bottom: 20px; }
.price-from { font-family: var(--mono); font-size: 11px; color: var(--ink4); }
.price-num { font-family: var(--serif); font-size: 36px; color: var(--ink); letter-spacing: -0.03em; }
.price-unit { font-size: 13px; color: var(--ink4); }

/* HOW IT WORKS */
.how-section { padding: 80px; max-width: 1200px; margin: 0 auto; }
.how-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; margin-top: 48px; }
.step { display: grid; grid-template-columns: 36px 1fr; gap: 16px; padding: 22px 0; border-bottom: 1px solid var(--rule); }
.step:first-child { padding-top: 0; }
.step:last-child { border-bottom: none; }
.step-num { font-family: var(--mono); font-size: 11px; color: var(--ink4); padding-top: 2px; }
.step h4 { font-size: 15px; font-weight: 600; color: var(--ink); margin-bottom: 6px; }
.step p { font-size: 14px; color: var(--ink3); line-height: 1.6; }

/* TERMINAL */
.terminal { background: #17170f; border-radius: 8px; overflow: hidden; position: sticky; top: 80px; }
.term-bar { background: #222218; padding: 10px 16px; display: flex; align-items: center; gap: 7px; }
.td { width: 10px; height: 10px; border-radius: 50%; }
.td1 { background: #ff5f57; } .td2 { background: #febc2e; } .td3 { background: #28c840; }
.term-label { font-family: var(--mono); font-size: 11px; color: rgba(245,243,238,0.3); margin-left: auto; }
.term-body { padding: 20px 20px 24px; font-family: var(--mono); font-size: 12px; line-height: 1.9; }
.tc { color: rgba(245,243,238,0.28); }
.tk { color: #7dd3a8; }
.tv { color: rgba(245,243,238,0.85); }
.tg { color: #4aab76; }
.td-dim { color: rgba(245,243,238,0.42); }
.tb { height: 12px; }

/* PRICING */
.pricing-section { background: var(--ink); padding: 80px; }
.pricing-inner { max-width: 1200px; margin: 0 auto; }
.pricing-table { background: rgba(245,243,238,0.04); border: 1px solid rgba(245,243,238,0.1); border-radius: 6px; overflow: hidden; margin-top: 48px; margin-bottom: 28px; }
.pt-head { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; border-bottom: 1px solid rgba(245,243,238,0.1); }
.pt-head div { padding: 14px 20px; font-family: var(--mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(245,243,238,0.35); text-align: right; }
.pt-head div:first-child { text-align: left; }
.pt-row { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; border-bottom: 1px solid rgba(245,243,238,0.07); }
.pt-row:last-child { border-bottom: none; }
.pt-row div { padding: 16px 20px; font-size: 14px; text-align: right; }
.pt-row div:first-child { text-align: left; }
.pt-row-label { font-size: 14px; font-weight: 500; color: var(--paper); }
.pt-row-sub { font-family: var(--mono); font-size: 11px; color: rgba(245,243,238,0.35); margin-top: 3px; }
.pt-price { font-family: var(--serif); font-size: 22px; letter-spacing: -0.02em; }
.pt-price.green { color: #5ecb8a; }
.pt-price.amber { color: #f5b842; }
.pt-price.white { color: var(--paper); }
.pt-unit { font-family: var(--mono); font-size: 11px; color: rgba(245,243,238,0.35); }
.scenarios { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.sc { background: rgba(245,243,238,0.04); border: 1px solid rgba(245,243,238,0.1); border-radius: 6px; padding: 24px; }
.sc h4 { font-size: 14px; font-weight: 600; color: var(--paper); margin-bottom: 4px; }
.sc-desc { font-family: var(--mono); font-size: 11px; color: rgba(245,243,238,0.35); margin-bottom: 16px; }
.sc-line { display: flex; justify-content: space-between; font-size: 13px; color: rgba(245,243,238,0.5); padding: 5px 0; border-bottom: 1px solid rgba(245,243,238,0.07); }
.sc-line:last-of-type { border-bottom: none; }
.sc-total { display: flex; justify-content: space-between; align-items: baseline; padding-top: 14px; margin-top: 12px; border-top: 1px solid rgba(245,243,238,0.15); }
.sc-total-label { font-size: 12px; color: rgba(245,243,238,0.4); }
.sc-total-val { font-family: var(--serif); font-size: 26px; color: var(--paper); letter-spacing: -0.02em; }
.sc-roi { font-family: var(--mono); font-size: 11px; color: #5ecb8a; text-align: right; margin-top: 6px; }
.pricing-note { font-family: var(--mono); font-size: 11px; color: rgba(245,243,238,0.3); text-align: center; margin-top: 20px; line-height: 1.8; }

/* TESTIMONIALS */
.proof-section { background: var(--paper2); padding: 80px; }
.proof-inner { max-width: 1200px; margin: 0 auto; }
.proof-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--rule); border: 1px solid var(--rule); border-radius: 6px; overflow: hidden; margin-top: 48px; }
.proof-card { background: var(--paper2); padding: 36px 32px; }
.proof-card:hover { background: var(--paper); }
.proof-q { font-family: var(--serif); font-style: italic; font-size: 17px; color: var(--ink); line-height: 1.6; margin-bottom: 24px; }
.proof-name { font-size: 14px; font-weight: 600; color: var(--ink); }
.proof-role { font-family: var(--mono); font-size: 11px; color: var(--ink4); margin-top: 2px; }

/* FAQ */
.faq-section { background: var(--paper); padding: 80px; }
.faq-inner { max-width: 1200px; margin: 0 auto; }
.faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 80px; margin-top: 48px; }
.faq-item { padding: 22px 0; border-bottom: 1px solid var(--rule); }
.faq-q { font-family: var(--serif); font-size: 17px; color: var(--ink); margin-bottom: 10px; line-height: 1.3; }
.faq-a { font-size: 14px; color: var(--ink3); line-height: 1.65; }

/* CTA FINAL */
.cta-final { background: var(--green); padding: 80px; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.cta-final h2 { font-family: var(--serif); font-size: clamp(30px, 3.5vw, 44px); color: var(--paper); letter-spacing: -0.02em; line-height: 1.1; margin-bottom: 16px; }
.cta-final h2 em { color: rgba(245,243,238,0.55); font-style: italic; }
.cta-final p { font-size: 16px; color: rgba(245,243,238,0.65); line-height: 1.7; }
.cta-options { display: flex; flex-direction: column; gap: 12px; }
.cta-opt { background: rgba(245,243,238,0.1); border: 1px solid rgba(245,243,238,0.2); border-radius: 4px; padding: 18px 22px; text-decoration: none; color: var(--paper); display: flex; justify-content: space-between; align-items: center; }
.cta-opt:hover { background: rgba(245,243,238,0.18); }
.cta-opt-label { font-family: var(--mono); font-size: 10px; color: rgba(245,243,238,0.5); text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 4px; }
.cta-opt-text { font-family: var(--serif); font-size: 17px; }
.cta-arrow { font-size: 18px; opacity: 0.5; flex-shrink: 0; margin-left: 12px; }

/* INNER PAGE HERO */
.page-hero { padding: 110px 80px 60px; background: var(--ink); }
.page-hero-inner { max-width: 1200px; margin: 0 auto; }
.page-hero h1 { font-family: var(--serif); font-size: clamp(38px, 4vw, 54px); color: var(--paper); letter-spacing: -0.02em; line-height: 1.08; margin-bottom: 20px; }
.page-hero h1 em { font-style: italic; color: #5ecb8a; }
.page-hero h1 em.amber { color: #f5b842; }
.page-hero-sub { font-size: 18px; color: rgba(245,243,238,0.6); line-height: 1.7; max-width: 560px; margin-bottom: 36px; }
.page-hero-btns { display: flex; gap: 12px; flex-wrap: wrap; }
.btn-paper { background: var(--paper); color: var(--ink); padding: 13px 26px; border-radius: 3px; font-size: 14px; font-weight: 500; text-decoration: none; display: inline-block; }
.btn-paper:hover { background: var(--green3); }
.btn-ghost-paper { border: 1px solid rgba(245,243,238,0.25); color: rgba(245,243,238,0.8); padding: 13px 26px; border-radius: 3px; font-size: 14px; font-weight: 500; text-decoration: none; display: inline-block; }
.btn-ghost-paper:hover { border-color: rgba(245,243,238,0.5); color: var(--paper); }

/* CONTENT SECTION */
.content-section { padding: 80px; max-width: 1200px; margin: 0 auto; }
.content-section-dark { padding: 80px; background: var(--ink); }
.content-section-mid { padding: 80px; background: var(--paper2); }
.content-inner { max-width: 1200px; margin: 0 auto; }

/* FEATURE GRID */
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--rule); border: 1px solid var(--rule); border-radius: 6px; overflow: hidden; margin-top: 48px; }
.feature-block { background: var(--white); padding: 32px 28px; }
.feature-block-dark { background: var(--ink); padding: 32px 28px; }
.feature-icon { font-size: 24px; margin-bottom: 14px; }
.feature-block h4 { font-size: 15px; font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.feature-block-dark h4 { font-size: 15px; font-weight: 600; color: var(--paper); margin-bottom: 8px; }
.feature-block p { font-size: 14px; color: var(--ink3); line-height: 1.65; }
.feature-block-dark p { font-size: 14px; color: rgba(245,243,238,0.5); line-height: 1.65; }

/* TWO COL */
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; margin-top: 48px; }
.two-col-tight { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; }

/* STAT ROW */
.stat-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--rule); border: 1px solid var(--rule); border-radius: 6px; overflow: hidden; margin-top: 48px; }
.stat-block { background: var(--white); padding: 32px 28px; }
.stat-num { font-family: var(--serif); font-size: 44px; color: var(--green2); letter-spacing: -0.03em; line-height: 1; margin-bottom: 8px; }
.stat-num.amber { color: var(--amber); }
.stat-label { font-size: 14px; color: var(--ink3); line-height: 1.5; }
.stat-sub { font-family: var(--mono); font-size: 11px; color: var(--ink4); margin-top: 4px; }

/* PROSE */
.prose h3 { font-family: var(--serif); font-size: 22px; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 12px; margin-top: 36px; }
.prose h3:first-child { margin-top: 0; }
.prose p { font-size: 15px; color: var(--ink3); line-height: 1.75; margin-bottom: 16px; }
.prose ul { list-style: none; margin-bottom: 20px; }
.prose ul li { font-size: 15px; color: var(--ink3); line-height: 1.65; padding: 6px 0; border-bottom: 1px solid var(--rule); display: flex; gap: 10px; }
.prose ul li:last-child { border-bottom: none; }
.prose ul li::before { content: '→'; color: var(--ink4); flex-shrink: 0; }
.prose a { color: var(--green2); text-decoration: none; }
.prose a:hover { color: var(--ink); }

/* FOOTER */
footer { background: var(--ink); }
.foot-top { max-width: 1200px; margin: 0 auto; padding: 64px 80px; display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 48px; border-bottom: 1px solid rgba(245,243,238,0.08); }
.foot-brand { display: flex; flex-direction: column; gap: 16px; }
.foot-logo { display: flex; align-items: center; text-decoration: none; }
.foot-logo .logo-img { height: 24px; width: auto; filter: brightness(0) invert(1); }
.foot-tagline { font-size: 14px; color: rgba(245,243,238,0.45); line-height: 1.65; max-width: 300px; }
.foot-address { margin-top: 4px; }
.foot-address-city { font-family: var(--mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(245,243,238,0.3); margin-bottom: 4px; }
.foot-address-line { font-size: 13px; color: rgba(245,243,238,0.3); line-height: 1.6; }
.foot-cta { display: inline-block; background: var(--green); color: var(--paper); padding: 11px 20px; border-radius: 3px; font-size: 13px; font-weight: 500; text-decoration: none; margin-top: 8px; width: fit-content; }
.foot-cta:hover { background: var(--green2); color: var(--paper); }
.foot-col {}
.foot-col-label { font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(245,243,238,0.3); margin-bottom: 16px; }
.foot-col ul { list-style: none; display: flex; flex-direction: column; gap: 2px; }
.foot-col ul li a { font-size: 14px; color: rgba(245,243,238,0.55); text-decoration: none; padding: 5px 0; display: block; }
.foot-col ul li a:hover { color: rgba(245,243,238,0.9); }
.foot-col + .foot-col { margin-top: 32px; }
.foot-bottom { max-width: 1200px; margin: 0 auto; padding: 20px 80px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
.foot-note { font-family: var(--mono); font-size: 10px; color: rgba(245,243,238,0.2); line-height: 1.6; max-width: 560px; }
.foot-legal { display: flex; gap: 20px; }
.foot-legal a { font-family: var(--mono); font-size: 10px; color: rgba(245,243,238,0.3); text-decoration: none; }
.foot-legal a:hover { color: rgba(245,243,238,0.6); }

/* RESPONSIVE */
@media (max-width: 960px) {
  nav { padding: 0 24px; }
  .nav-links { display: none; }
  .nav-hamburger { display: flex; }
  .hero { padding: 90px 24px 60px; grid-template-columns: 1fr; }
  .hero-card { display: none; }
  .logos { padding: 14px 24px; }
  .problem { padding: 60px 24px; }
  .problem-grid { grid-template-columns: 1fr; }
  .icp-section { padding: 60px 24px; }
  .icp-grid { grid-template-columns: 1fr; }
  .icp-card { border-right: none; border-bottom: 1px solid var(--rule); }
  .products-section { padding: 60px 24px; }
  .products-grid { grid-template-columns: 1fr; }
  .how-section { padding: 60px 24px; }
  .how-section > div[style*="grid-template-columns: repeat(4"] { grid-template-columns: 1fr 1fr !important; }
  .how-grid { grid-template-columns: 1fr; }
  .terminal { display: none; }
  .pricing-section { padding: 60px 24px; }
  .pt-head { grid-template-columns: 1fr 1fr; }
  .pt-head div:nth-child(3), .pt-head div:nth-child(4) { display: none; }
  .pt-row { grid-template-columns: 1fr 1fr; }
  .pt-row div:nth-child(3), .pt-row div:nth-child(4) { display: none; }
  .scenarios { grid-template-columns: 1fr; }
  .proof-section { padding: 60px 24px; }
  .proof-grid { grid-template-columns: 1fr; }
  .faq-section { padding: 60px 24px; }
  .faq-grid { grid-template-columns: 1fr; }
  .cta-final { padding: 60px 24px; grid-template-columns: 1fr; gap: 40px; }
  .foot-top { padding: 48px 24px 40px; grid-template-columns: 1fr; gap: 40px; }
  .foot-bottom { padding: 20px 24px; flex-direction: column; align-items: flex-start; gap: 12px; }
  .foot-col + .foot-col { margin-top: 24px; }
  /* BLOG MOBILE */
  .blog-hero { padding: 90px 24px 32px !important; }
  .blog-filters { padding: 0 24px 24px !important; }
  .blog-grid { padding: 0 24px 60px !important; }
  .blog-cards-all { grid-template-columns: 1fr !important; }
  /* ARTICLE MOBILE */
  .article-wrap { padding: 90px 20px 60px !important; }
  .structured-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .article-cta { padding: 28px 24px !important; }
  /* AFFILIATES MOBILE */
  .aff-hero { padding: 90px 24px 48px !important; }
  .aff-stats { grid-template-columns: 1fr !important; }
  .aff-how { padding: 48px 24px !important; }
  .aff-steps { grid-template-columns: 1fr !important; gap: 32px !important; }
  .aff-who { padding: 48px 24px !important; }
  .aff-who-cards { grid-template-columns: 1fr !important; }
  .aff-terms { padding: 48px 24px !important; }
  .aff-terms-grid { grid-template-columns: 1fr !important; }
  .aff-form-section { padding: 48px 24px !important; }
  .aff-faq { padding: 48px 24px !important; }
  .aff-form-row { grid-template-columns: 1fr !important; }
  .page-hero { padding: 90px 24px 50px; }
  .content-section { padding: 60px 24px; }
  .content-section-dark { padding: 60px 24px; }
  .content-section-mid { padding: 60px 24px; }
  .feature-grid { grid-template-columns: 1fr; }
  .two-col { grid-template-columns: 1fr; gap: 40px; }
  .stat-row { grid-template-columns: 1fr; }
}

/* ── Logo (image-based) ── */
.logo { display: flex; align-items: center; text-decoration: none; }
.logo-img { height: 28px; width: auto; display: block; }
.foot-logo { display: flex; align-items: center; text-decoration: none; }
.foot-logo .logo-img { height: 24px; width: auto; display: block; filter: brightness(0) invert(1); }
nav .logo:hover .logo-img { opacity: 0.8; }
/* Keep logo-mark/wordmark for any inline uses that remain */
.logo-mark { height: 22px; width: 18px; color: var(--green2); flex-shrink: 0; }
.logo-wordmark { font-family: var(--sans); font-size: 18px; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; }

/* ── Waitlist modal (global) ── */
.wl-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.55); backdrop-filter: blur(3px); z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 20px; }
.wl-box { background: var(--paper); border-radius: 10px; padding: 48px; max-width: 480px; width: 100%; position: relative; box-shadow: 0 24px 64px rgba(0,0,0,0.18); }
.wl-close { position: absolute; top: 16px; right: 20px; background: none; border: none; font-size: 22px; color: var(--ink4); cursor: pointer; padding: 4px 8px; line-height: 1; }
.wl-close:hover { color: var(--ink); }
.wl-eyebrow { font-family: var(--mono); font-size: 11px; color: var(--green2); text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 12px; }
.wl-h2 { font-family: var(--serif); font-size: 28px; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 12px; line-height: 1.2; }
.wl-sub { font-size: 14px; color: var(--ink3); line-height: 1.7; margin-bottom: 24px; }
.wl-row { display: flex; gap: 8px; }
.wl-input { flex: 1; padding: 12px 14px; border: 1px solid var(--rule); border-radius: 5px; font-size: 14px; font-family: var(--sans); color: var(--ink); background: var(--paper); outline: none; }
.wl-input:focus { border-color: var(--green2); }
.wl-btn { padding: 12px 20px; background: var(--green2); color: var(--paper); border: none; border-radius: 5px; font-size: 14px; font-weight: 600; cursor: pointer; white-space: nowrap; transition: opacity .15s; }
.wl-btn:hover { opacity: .88; }
.wl-btn:disabled { opacity: .55; cursor: not-allowed; }
.wl-error { font-size: 13px; color: #c0392b; margin-top: 8px; }
.wl-check { font-size: 40px; color: var(--green2); margin-bottom: 12px; }
@media (max-width: 520px) { .wl-row { flex-direction: column; } .wl-box { padding: 32px 24px; } }

/* ═══════════════════════════════════════════════════════════════
   MOBILE — comprehensive additions (960px)
═══════════════════════════════════════════════════════════════ */
@media (max-width: 960px) {

  /* --- How-it-works strip --- */
  .how-strip { padding: 40px 24px; }
  .how-step-row { grid-template-columns: 1fr 1fr; }

  /* --- ICP route (class used in updated pages) --- */
  .icp-route { grid-template-columns: 1fr !important; }
  .icp-route-card { border-right: none !important; border-bottom: 1px solid var(--rule) !important; }
  .icp-route-card:last-child { border-bottom: none !important; }

  /* --- Two-col-tight --- */
  .two-col-tight { grid-template-columns: 1fr !important; gap: 32px !important; }

  /* --- Pricing plan cards (5 col → 2 col) --- */
  .pricing-plans { grid-template-columns: 1fr 1fr !important; }
  .pa-grid { grid-template-columns: 1fr !important; }
  .pi-items { gap: 6px; }
  .pi-label { font-size: 10px; }

  /* --- Scenario improvements --- */
  .sc-who { font-size: 9px; }

  /* --- vs-page sections with inline 80px padding --- */
  .vs-section { padding: 48px 24px !important; }

  /* --- vs-page when-to-use grid --- */
  .vs-when-grid { grid-template-columns: 1fr !important; gap: 20px !important; }

  /* --- comp-table: horizontal scroll on mobile --- */
  .comp-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; width: 100%; }
  .comp-table { min-width: 480px; }

  /* --- Competitive boundary inline grid --- */
  .comp-boundary-cols { grid-template-columns: 1fr !important; gap: 24px !important; }

  /* --- Inner page stat callout flex rows --- */
  .stat-callout-row { flex-direction: column !important; gap: 0 !important; }
  .stat-callout-row > div { border-right: none !important; border-bottom: 1px solid rgba(245,243,238,0.08); padding: 24px 20px !important; }
  .stat-callout-row > div:last-child { border-bottom: none; }

  /* --- Page-specific inline padding overrides --- */
  div.vs-padded { padding: 48px 24px !important; }

  /* --- Buttons: allow wrapping on mobile --- */
  .page-hero-btns { flex-wrap: wrap; }
  .hero-btns { flex-wrap: wrap; }
  .btn-dark, .btn-green, .btn-amber, .btn-paper,
  .btn-ghost-green, .btn-ghost-amber, .btn-ghost-paper { white-space: normal; }

  /* --- Section lead text --- */
  .section-lead { font-size: 15px; margin-bottom: 32px; }

  /* --- Prevent x-overflow from wide tables/grids --- */
  body { overflow-x: hidden; }
  .pricing-inner, .products-inner, .content-inner { overflow-x: hidden; }

  /* --- FAQ section on inner pages --- */
  .faq-grid { grid-template-columns: 1fr; gap: 0; }
}

/* ═══════════════════════════════════════════════════════════════
   MOBILE — small screens (600px)
═══════════════════════════════════════════════════════════════ */
@media (max-width: 600px) {

  /* Hero text */
  .hero h1 { font-size: 36px !important; }
  .page-hero h1 { font-size: 30px !important; line-height: 1.1; }
  .page-hero-sub { font-size: 15px !important; }
  .hero-sub { font-size: 15px; }

  /* Section headers */
  .section-h2 { font-size: 28px !important; }

  /* How-it-works: 1 column */
  .how-step-row { grid-template-columns: 1fr !important; }

  /* Pricing plans: 1 column */
  .pricing-plans { grid-template-columns: 1fr !important; }
  .plan-card { padding: 24px 20px; }
  .plan-price { font-size: 28px; }

  /* Stats: tighter */
  .stat-num { font-size: 36px !important; }

  /* Hero buttons: full width */
  .hero-btns { flex-direction: column; }
  .hero-btns a { width: 100%; text-align: center; }
  .page-hero-btns a { width: 100%; text-align: center; }

  /* CTA opts: full width */
  .cta-options { gap: 8px; }

  /* Scenario cards */
  .sc { padding: 20px 18px; }

  /* Footer */
  .foot-tagline { font-size: 13px; }
  .foot-bottom { flex-direction: column; gap: 8px; }

  /* Waitlist modal */
  .wl-box { padding: 28px 20px !important; margin: 0 4px; }
  .wl-h2 { font-size: 22px !important; }
  .wl-row { flex-direction: column !important; gap: 8px !important; }
  .wl-btn { padding: 12px 16px; width: 100%; }

  /* Feature blocks: tighter */
  .feature-block { padding: 24px 20px; }
  .feature-icon { font-size: 20px; margin-bottom: 10px; }

  /* Proof cards */
  .proof-q { font-size: 15px; }

  /* Product cards */
  .product-card { padding: 28px 24px; }
  .product-card h3 { font-size: 24px; }

  /* ICP cards */
  .icp-card { padding: 32px 24px; }
  .icp-card h3 { font-size: 22px; }

  /* Content sections */
  .content-section { padding: 48px 20px; }
  .content-section-dark { padding: 48px 20px; }
  .content-section-mid { padding: 48px 20px; }

  /* Pricing section */
  .pricing-section { padding: 48px 20px; }
  .sc-total-val { font-size: 22px; }

  /* Page hero */
  .page-hero { padding: 80px 20px 40px !important; }

  /* Problem grid */
  .problem { padding: 48px 20px; }
  .problem-item { padding: 28px 20px; }
  .problem-num { font-size: 40px; }

  /* vs-pages */
  .vs-verdict { padding: 48px 20px !important; }
  .vs-verdict h2 { font-size: 26px !important; }
  div.vs-padded { padding: 40px 20px !important; }

  /* Prose */
  .prose h3 { font-size: 20px; }

  /* Comparison table always scrollable */
  .comp-table-wrap { overflow-x: auto; }
  .comp-table { min-width: 480px; }
  .comp-table th, .comp-table td { padding: 10px 12px; font-size: 13px; }
}


/* ── HubSpot form overrides ── */
.hs-form-frame { width: 100%; }
.hs-form-frame form,
.hbspt-form form { width: 100% !important; }
/* Field rows */
.hs-form .hs-form-field { margin-bottom: 12px !important; }
.hs-form .hs-form-field label { font-family: var(--sans); font-size: 12px; font-weight: 600; color: var(--ink3); margin-bottom: 4px; display: block; }
/* Inputs */
.hs-form input[type="text"],
.hs-form input[type="email"] {
  width: 100% !important;
  padding: 11px 14px !important;
  border: 1px solid var(--rule) !important;
  border-radius: 5px !important;
  font-family: var(--sans) !important;
  font-size: 14px !important;
  color: var(--ink) !important;
  background: var(--paper) !important;
  outline: none !important;
  box-sizing: border-box !important;
  transition: border-color 0.15s !important;
}
.hs-form input[type="text"]:focus,
.hs-form input[type="email"]:focus { border-color: var(--green2) !important; }
/* Two-col first/last name */
.hs-form .hs-fieldtype-text.hs-firstname,
.hs-form .hs-fieldtype-text.hs-lastname { display: inline-block !important; width: 48% !important; }
.hs-form .hs-firstname { margin-right: 4% !important; }
/* Error messages */
.hs-form .hs-error-msgs { list-style: none !important; }
.hs-form .hs-error-msgs li label { font-size: 12px !important; color: #c0392b !important; margin-top: 3px !important; }
/* Submit button */
.hs-form input[type="submit"],
.hs-form .hs-button {
  background: var(--green2) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 5px !important;
  padding: 12px 24px !important;
  font-family: var(--sans) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  width: 100% !important;
  margin-top: 8px !important;
  transition: opacity 0.15s !important;
}
.hs-form input[type="submit"]:hover,
.hs-form .hs-button:hover { opacity: 0.88 !important; }
/* Privacy note */
.hs-form .hs-richtext p,
.hs-form .legal-consent-container { font-size: 11px !important; color: var(--ink4) !important; margin-top: 10px !important; }
/* Thank you message */
.hbspt-form .submitted-message { font-family: var(--sans); font-size: 15px; color: var(--green2); text-align: center; padding: 20px 0; font-weight: 600; }
@media (max-width: 520px) {
  .hs-form .hs-fieldtype-text.hs-firstname,
  .hs-form .hs-fieldtype-text.hs-lastname { width: 100% !important; display: block !important; margin-right: 0 !important; }
}
/* ── Footer columns grid ── */
.foot-cols { display: grid; grid-template-columns: repeat(5, 1fr); gap: 32px; }
@media (max-width: 960px) { .foot-cols { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) { .foot-cols { grid-template-columns: 1fr 1fr; } }
