:root {
    --navy: #0a0f1e; --navy-mid: #111827; --navy-light: #1a2540;
    --amber: #f5a623; --amber-bright: #ffbe45;
    --white: #f0eeea; --white-dim: #9ca3af; --white-faint: #6b7280;
    --border: rgba(245,166,35,0.15); --teal: #00d4b4; --purple: #a78bfa;
  }
  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
  html { scroll-behavior: smooth; }
  body { background: var(--navy); color: var(--white); font-family: 'DM Sans', sans-serif; font-weight: 300; overflow-x: hidden; }
  body::before { content: ''; position: fixed; inset: 0; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E"); pointer-events: none; z-index: 1000; opacity: 0.4; }

  /* NAV */
  nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; display: flex; align-items: center; justify-content: space-between; padding: 1.25rem 4rem; background: rgba(10,15,30,0.92); backdrop-filter: blur(16px); border-bottom: 1px solid var(--border); }
  .nav-logo { display: flex; align-items: center; gap: 0.6rem; text-decoration: none; }
  .nav-logo-mark { width: 32px; height: 32px; background: var(--amber); clip-path: polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%); flex-shrink: 0; }
  .nav-logo-text { font-family: 'Bebas Neue', sans-serif; font-size: 1.25rem; letter-spacing: 0.08em; color: var(--white); line-height: 1; }
  .nav-logo-text span { color: var(--amber); }
  .nav-links { display: flex; align-items: center; gap: 2rem; list-style: none; }
  .nav-links > li > a { font-family: 'DM Mono', monospace; font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--white-dim); text-decoration: none; transition: color 0.2s; white-space: nowrap; }
  .nav-links > li > a:hover { color: var(--amber); }
  .nav-item { position: relative; }
  .nav-item > a { display: flex; align-items: center; gap: 0.3rem; cursor: pointer; }
  .nav-item > a::after { content: ''; display: inline-block; width: 5px; height: 5px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform 0.2s; }
  .nav-item.open > a::after { transform: rotate(-135deg) translateY(2px); }
  .nav-dropdown { position: absolute; top: calc(100% + 0.75rem); left: 50%; transform: translateX(-50%); background: var(--navy-mid); border: 1px solid var(--border); min-width: 190px; display: none; z-index: 200; }
  .nav-dropdown::before { content: ''; position: absolute; top: -5px; left: 50%; transform: translateX(-50%) rotate(45deg); width: 8px; height: 8px; background: var(--navy-mid); border-left: 1px solid var(--border); border-top: 1px solid var(--border); }
  .nav-item.open .nav-dropdown { display: block; }
  .nav-item.open .nav-dropdown--wide { display: flex; }
  .nav-dropdown--wide { left: auto; right: -8rem; transform: none; width: 780px; max-width: calc(100vw - 2rem); }
  .nav-dropdown--wide::before { left: auto; right: 9.5rem; transform: rotate(45deg); }
  .dropdown-col { flex: 1; border-right: 1px solid var(--border); }
  .dropdown-col:last-child { border-right: none; }
  .dropdown-label { font-family: 'DM Mono', monospace; font-size: 0.56rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--amber); padding: 0.7rem 1rem 0.4rem; border-bottom: 1px solid var(--border); display: block; }
  .nav-dropdown a { display: flex; align-items: center; gap: 0.6rem; padding: 0.65rem 1rem; font-family: 'DM Mono', monospace; font-size: 0.67rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--white-dim) !important; text-decoration: none; transition: background 0.15s, color 0.15s; white-space: nowrap; border-bottom: 1px solid rgba(255,255,255,0.03); }
  .nav-dropdown a:last-child { border-bottom: none; }
  .nav-dropdown a:hover { background: rgba(245,166,35,0.08); color: var(--amber) !important; }
  .nav-dropdown a .dd-icon { font-size: 0.85rem; width: 16px; text-align: center; flex-shrink: 0; }
  .nav-cta { background: var(--amber) !important; color: var(--navy) !important; padding: 0.5rem 1.1rem !important; font-weight: 600 !important; border-radius: 5px; }
  .nav-cta:hover { background: var(--amber-bright) !important; }

  /* PAGE HERO */
  .page-hero { padding: 9rem 4rem 5rem; position: relative; overflow: hidden; border-bottom: 1px solid var(--border); text-align: center; }
  .page-hero::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(245,166,35,0.03) 1px,transparent 1px),linear-gradient(90deg,rgba(245,166,35,0.03) 1px,transparent 1px); background-size: 60px 60px; }
  .page-hero::after { content: ''; position: absolute; top: -20%; left: 50%; transform: translateX(-50%); width: 700px; height: 700px; background: radial-gradient(circle,rgba(245,166,35,0.05) 0%,transparent 70%); pointer-events: none; }
  .eyebrow { font-family: 'DM Mono', monospace; font-size: 0.68rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--amber); margin-bottom: 1.25rem; display: flex; align-items: center; justify-content: center; gap: 0.75rem; position: relative; z-index: 1; opacity: 0; animation: fadeUp 0.7s ease forwards 0.1s; }
  .eyebrow::before, .eyebrow::after { content: ''; display: block; width: 24px; height: 1px; background: var(--amber); }
  .page-hero h1 { font-family: 'Bebas Neue', sans-serif; font-size: clamp(3rem,6vw,6.5rem); line-height: 0.92; letter-spacing: 0.01em; position: relative; z-index: 1; opacity: 0; animation: fadeUp 0.8s ease forwards 0.25s; }
  .page-hero h1 .accent { color: var(--amber); }
  .hero-desc { font-size: 1.05rem; color: var(--white-dim); max-width: 560px; line-height: 1.8; margin: 1.5rem auto 0; position: relative; z-index: 1; opacity: 0; animation: fadeUp 0.8s ease forwards 0.4s; }
  @keyframes fadeUp { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }

  /* PROGRAM TOGGLE */
  .program-toggle-wrap { padding: 3rem 4rem 0; display: flex; flex-direction: column; align-items: center; gap: 0; background: var(--navy); }
  .toggle-question { font-family: 'Bebas Neue', sans-serif; font-size: clamp(1.8rem,3vw,2.8rem); text-align: center; margin-bottom: 2rem; letter-spacing: 0.02em; }
  .toggle-question span { color: var(--amber); }
  .toggle-btns { display: flex; gap: 0; border: 1px solid var(--border); margin-bottom: 0; }
  .toggle-btn { font-family: 'DM Mono', monospace; font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; padding: 1rem 2.5rem; cursor: pointer; background: transparent; color: var(--white-dim); border: none; transition: all 0.25s; display: flex; align-items: center; gap: 0.6rem; white-space: nowrap; }
  .toggle-btn:first-child { border-right: 1px solid var(--border); }
  .toggle-btn.active { background: var(--amber); color: var(--navy); font-weight: 600; }
  .toggle-btn .t-icon { font-size: 1rem; }

  /* PATH DESCRIPTIONS */
  .path-desc-bar { background: var(--navy-mid); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 1.5rem 4rem; display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
  .path-desc { display: flex; gap: 1rem; align-items: flex-start; opacity: 0.35; transition: opacity 0.3s; }
  .path-desc.active { opacity: 1; }
  .path-icon { font-size: 1.5rem; flex-shrink: 0; margin-top: 2px; }
  .path-desc h3 { font-family: 'Bebas Neue', sans-serif; font-size: 1.3rem; color: var(--white); margin-bottom: 0.2rem; letter-spacing: 0.02em; }
  .path-desc p { font-size: 0.82rem; color: var(--white-dim); line-height: 1.55; }
  .path-divider { width: 1px; background: var(--border); align-self: stretch; }

  /* PROGRAMS */
  .program-section { padding: 4rem 4rem 5rem; display: none; }
  .program-section.active { display: block; }

  /* PACKAGES */
  .packages-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem; margin-top: 2.5rem; align-items: start; }
  .pkg { background: var(--navy-mid); border: 1px solid var(--border); display: flex; flex-direction: column; position: relative; transition: transform 0.3s, border-color 0.3s; }
  .pkg:hover { transform: translateY(-4px); border-color: rgba(245,166,35,0.35); }
  .pkg.featured { border-color: var(--amber); }
  .pkg.featured .pkg-header { background: var(--amber); }
  .pkg.featured .pkg-name { color: var(--navy); }
  .pkg.featured .pkg-tagline { color: rgba(10,15,30,0.65); }
  .pkg.featured .pkg-amount { color: var(--navy); }
  .pkg.featured .pkg-period { color: rgba(10,15,30,0.6); }
  .pkg.featured .pkg-header { border-bottom-color: rgba(10,15,30,0.15); }
  .pkg.hs-featured { border-color: var(--teal); }
  .pkg.hs-featured .pkg-header { background: var(--navy-light); border-bottom: 1px solid rgba(0,212,180,0.3); }
  .pkg.hs-featured .pkg-name { color: var(--teal); }
  .featured-badge { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: var(--amber); color: var(--navy); font-family: 'DM Mono', monospace; font-size: 0.6rem; letter-spacing: 0.15em; text-transform: uppercase; padding: 0.25rem 0.75rem; font-weight: 600; white-space: nowrap; }
  .featured-badge.teal { background: var(--teal); }
  .pkg-header { padding: 2rem 2rem 1.5rem; border-bottom: 1px solid var(--border); }
  .pkg-name { font-family: 'Bebas Neue', sans-serif; font-size: 2rem; letter-spacing: 0.03em; color: var(--white); line-height: 1; margin-bottom: 0.4rem; }
  .pkg-tagline { font-size: 0.78rem; color: var(--white-dim); font-style: italic; margin-bottom: 1.5rem; line-height: 1.5; }
  .pkg-price { display: flex; align-items: flex-end; gap: 0.25rem; }
  .pkg-setup { font-family: 'DM Mono', monospace; font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--white-dim); margin-top: 0.4rem; }
  .pkg-amount { font-family: 'Bebas Neue', sans-serif; font-size: 3.5rem; color: var(--white); line-height: 1; }
  .pkg-period { font-family: 'DM Mono', monospace; font-size: 0.68rem; color: var(--white-dim); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 0.4rem; }
  .pkg-features { padding: 1.75rem 2rem; flex: 1; }
  .pkg-features ul { list-style: none; display: flex; flex-direction: column; gap: 0.65rem; }
  .pkg-features li { display: flex; align-items: flex-start; gap: 0.65rem; font-size: 0.88rem; color: var(--white-dim); line-height: 1.4; }
  .pkg-features li .check { color: var(--amber); flex-shrink: 0; font-size: 0.75rem; margin-top: 2px; }
  .pkg-features li .check.teal { color: var(--teal); }
  .pkg-footer { padding: 1.5rem 2rem; border-top: 1px solid var(--border); }
  .pkg-btn { display: block; text-align: center; padding: 0.9rem; font-family: 'DM Mono', monospace; font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 500; text-decoration: none; border-radius: 4px; transition: all 0.2s; }
  .pkg-btn-primary { background: var(--amber); color: var(--navy); }
  .pkg-btn-primary:hover { background: var(--amber-bright); transform: translateY(-1px); }
  .pkg-btn-teal { background: var(--teal); color: var(--navy); }
  .pkg-btn-teal:hover { background: #00f5d0; transform: translateY(-1px); }
  .pkg-btn-outline { background: transparent; color: var(--white-dim); border: 1px solid var(--white-faint); }
  .pkg-btn-outline:hover { border-color: var(--amber); color: var(--amber); }
  .pkg-btn-outline-teal { background: transparent; color: var(--white-dim); border: 1px solid var(--white-faint); }
  .pkg-btn-outline-teal:hover { border-color: var(--teal); color: var(--teal); }

  /* HubSpot 4-col grid */
  .packages-grid-4 { display: grid; grid-template-columns: repeat(4,1fr); gap: 1.25rem; margin-top: 2.5rem; align-items: start; }

  /* SECTION LABEL */
  .section-label { font-family: 'DM Mono',monospace; font-size: 0.65rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--amber); margin-bottom: 1rem; display: flex; align-items: center; gap: 0.75rem; }
  .section-label::before { content: ''; display: block; width: 24px; height: 1px; background: var(--amber); }
  .section-label.teal-label { color: var(--teal); }
  .section-label.teal-label::before { background: var(--teal); }
  .section-title { font-family: 'Bebas Neue',sans-serif; font-size: clamp(2rem,3.5vw,3.2rem); line-height: 0.95; letter-spacing: 0.01em; margin-bottom: 0.75rem; }

  /* ADD-ONS */
  .addons-section { padding: 4rem 4rem 5rem; background: var(--navy-mid); border-top: 1px solid var(--border); }
  .addons-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.25rem; margin-top: 2.5rem; }
  .addon-card { background: var(--navy); border: 1px solid var(--border); padding: 1.75rem; transition: border-color 0.3s, transform 0.3s; display: flex; flex-direction: column; gap: 0.5rem; }
  .addon-card:hover { border-color: rgba(245,166,35,0.4); transform: translateY(-3px); }
  .addon-icon { font-size: 1.75rem; }
  .addon-name { font-family: 'Bebas Neue', sans-serif; font-size: 1.3rem; color: var(--white); letter-spacing: 0.02em; line-height: 1; }
  .addon-price { font-family: 'DM Mono', monospace; font-size: 0.72rem; letter-spacing: 0.1em; color: var(--amber); text-transform: uppercase; }
  .addon-desc { font-size: 0.82rem; color: var(--white-dim); line-height: 1.6; flex: 1; }
  .addon-tag { display: inline-block; font-family: 'DM Mono', monospace; font-size: 0.58rem; letter-spacing: 0.12em; text-transform: uppercase; padding: 0.2rem 0.6rem; border: 1px solid rgba(245,166,35,0.3); color: var(--amber); margin-top: 0.25rem; }
  .addon-tag.teal { border-color: rgba(0,212,180,0.3); color: var(--teal); }

  /* SERVICE DETAILS */
  .service-details { padding: 4rem 4rem 5rem; background: var(--navy); border-top: 1px solid var(--border); }
  .details-intro { font-size: 1rem; color: var(--white-dim); max-width: 600px; line-height: 1.75; margin-bottom: 3rem; }
  .details-group { margin-bottom: 3rem; }
  .details-group:last-child { margin-bottom: 0; }
  .group-label { font-family: 'Bebas Neue', sans-serif; font-size: 1.5rem; color: var(--white); letter-spacing: 0.02em; margin-bottom: 1.25rem; padding-bottom: 0.75rem; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 0.75rem; }
  .group-label span { font-size: 1.1rem; }
  .details-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; }
  .detail-item { background: var(--navy-mid); border: 1px solid var(--border); padding: 1.5rem; transition: border-color 0.3s; }
  .detail-item:hover { border-color: rgba(245,166,35,0.35); }
  .detail-item h4 { font-family: 'Bebas Neue', sans-serif; font-size: 1.1rem; color: var(--white); margin-bottom: 0.4rem; letter-spacing: 0.02em; }
  .detail-item p { font-size: 0.82rem; color: var(--white-dim); line-height: 1.65; }
  .detail-link { display: inline-block; margin-top: 0.6rem; font-family: 'DM Mono', monospace; font-size: 0.6rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--amber); text-decoration: none; }
  .detail-link:hover { text-decoration: underline; }

  /* ZOOMINFO CALLOUT */
  .zi-callout { background: rgba(0,212,180,0.06); border: 1px solid rgba(0,212,180,0.2); padding: 1.5rem 2rem; margin-top: 2.5rem; display: flex; gap: 1.25rem; align-items: flex-start; }
  .zi-icon { font-size: 1.75rem; flex-shrink: 0; }
  .zi-callout h4 { font-family: 'Bebas Neue', sans-serif; font-size: 1.2rem; color: var(--teal); margin-bottom: 0.35rem; letter-spacing: 0.02em; }
  .zi-callout p { font-size: 0.85rem; color: var(--white-dim); line-height: 1.65; }

  /* PRICING NOTE */
  .pricing-note { background: var(--navy-mid); padding: 3.5rem 4rem; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
  .pricing-note-inner { max-width: 800px; }
  .pricing-note h3 { font-family: 'Bebas Neue', sans-serif; font-size: 2rem; color: var(--white); margin-bottom: 1rem; letter-spacing: 0.02em; }
  .pricing-note p { font-size: 0.95rem; color: var(--white-dim); line-height: 1.8; }
  .pricing-note p + p { margin-top: 0.75rem; }

  /* CTA */
  .cta-band { background: var(--navy); text-align: center; padding: 6rem 4rem; border-top: 1px solid var(--border); }
  .cta-band h2 { font-family: 'Bebas Neue', sans-serif; font-size: clamp(2.2rem,3.5vw,3.5rem); line-height: 1.05; margin-bottom: 1rem; }
  .cta-band p { font-size: 1rem; color: var(--white-dim); max-width: 460px; margin: 0 auto 2.5rem; line-height: 1.7; }
  .cta-btns { display: flex; gap: 1.5rem; justify-content: center; flex-wrap: wrap; }
  .btn-primary { display: inline-flex; align-items: center; gap: 0.5rem; background: var(--amber); color: var(--navy); font-family: 'DM Sans',sans-serif; font-size: 1rem; font-weight: 600; padding: 0.9rem 1.9rem; border-radius: 6px; text-decoration: none; transition: background 0.2s,transform 0.2s; }
  .btn-primary:hover { background: var(--amber-bright); transform: translateY(-2px); }
  .btn-ghost { display: inline-flex; align-items: center; gap: 0.5rem; color: var(--white-dim); font-family: 'DM Sans',sans-serif; font-size: 0.95rem; text-decoration: none; border-bottom: 1px solid var(--white-faint); padding-bottom: 2px; transition: color 0.2s,border-color 0.2s; }
  .btn-ghost:hover { color: var(--amber); border-color: var(--amber); }
  .contact-note { margin-top: 2rem; font-family: 'DM Mono',monospace; font-size: 0.65rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--white-faint); }
  .contact-note a { color: var(--amber); text-decoration: none; }

  /* FOOTER */
  footer { background: #060a12; padding: 2.5rem 4rem; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid rgba(255,255,255,0.04); flex-wrap: wrap; gap: 1rem; }
  .footer-logo { font-family: 'Bebas Neue',sans-serif; font-size: 1rem; letter-spacing: 0.08em; color: var(--white-dim); }
  .footer-logo span { color: var(--amber); }
  .footer-links { display: flex; gap: 1.5rem; list-style: none; flex-wrap: wrap; }
  .footer-links a { font-family: 'DM Mono',monospace; font-size: 0.6rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--white-faint); text-decoration: none; transition: color 0.2s; }
  .footer-links a:hover { color: var(--amber); }
  .footer-copy { font-family: 'DM Mono',monospace; font-size: 0.6rem; color: var(--white-faint); letter-spacing: 0.1em; text-transform: uppercase; }

  /* REVEAL */
  .reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.7s ease,transform 0.7s ease; }
  .reveal.visible { opacity: 1; transform: translateY(0); }

  /* MOBILE */
  @media (max-width: 1100px) { .packages-grid-4 { grid-template-columns: repeat(2,1fr); } }
  @media (max-width: 900px) {
    nav { padding: 1rem 1.5rem; } .nav-links { display: none; }
    .page-hero { padding: 7rem 1.5rem 4rem; }
    .program-toggle-wrap { padding: 2.5rem 1.5rem 0; }
    .toggle-btn { padding: 0.85rem 1.25rem; font-size: 0.65rem; }
    .path-desc-bar { grid-template-columns: 1fr; padding: 1.25rem 1.5rem; gap: 1rem; }
    .program-section { padding: 3rem 1.5rem 4rem; }
    .packages-grid, .packages-grid-4 { grid-template-columns: 1fr; max-width: 480px; margin-left: auto; margin-right: auto; }
    .addons-section { padding: 3rem 1.5rem 4rem; }
    .addons-grid { grid-template-columns: 1fr; }
    .service-details { padding: 3rem 1.5rem 4rem; }
    .details-grid { grid-template-columns: 1fr; }
    .pricing-note { padding: 3rem 1.5rem; }
    .cta-band { padding: 4rem 1.5rem; }
    footer { flex-direction: column; text-align: center; padding: 2rem 1.5rem; }
  }
  @media (max-width: 600px) {
    .toggle-btns { flex-direction: column; width: 100%; }
    .toggle-btn:first-child { border-right: none; border-bottom: 1px solid var(--border); }
  }

  /* TOGGLE HINT */
  .toggle-hint { font-family: 'DM Mono', monospace; font-size: 0.62rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--white-faint); margin-top: 0.9rem; }
  .toggle-hint span { color: var(--amber); }

  /* B2B WHY-BOTH CALLOUT */
  .b2b-why { background: rgba(0,212,180,0.05); border: 1px solid rgba(0,212,180,0.25); padding: 2.5rem 3rem; margin-bottom: 3.5rem; display: grid; grid-template-columns: 1fr 1fr; gap: 2.5rem; align-items: start; }
  .b2b-why-text h2 { font-family: 'Bebas Neue', sans-serif; font-size: clamp(1.8rem,3vw,2.8rem); line-height: 0.95; margin-bottom: 1rem; }
  .b2b-why-text h2 span { color: var(--teal); }
  .b2b-why-text p { font-size: 0.9rem; color: var(--white-dim); line-height: 1.8; }
  .b2b-why-text p + p { margin-top: 0.65rem; }
  .b2b-flow { display: flex; flex-direction: column; gap: 0; }
  .b2b-flow-step { display: flex; gap: 1rem; align-items: flex-start; padding: 0.9rem 0; border-bottom: 1px solid var(--border); }
  .b2b-flow-step:last-child { border-bottom: none; }
  .b2b-flow-dot { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.65rem; flex-shrink: 0; font-weight: 600; font-family: 'DM Mono', monospace; margin-top: 2px; }
  .b2b-flow-dot.amber { background: rgba(245,166,35,0.12); border: 1px solid rgba(245,166,35,0.4); color: var(--amber); }
  .b2b-flow-dot.teal { background: rgba(0,212,180,0.1); border: 1px solid rgba(0,212,180,0.35); color: var(--teal); }
  .b2b-flow-dot.both { background: rgba(167,139,250,0.1); border: 1px solid rgba(167,139,250,0.35); color: var(--purple); }
  .b2b-flow-body h4 { font-family: 'Bebas Neue', sans-serif; font-size: 1rem; letter-spacing: 0.03em; color: var(--white); margin-bottom: 0.15rem; }
  .b2b-flow-body p { font-size: 0.78rem; color: var(--white-dim); line-height: 1.5; }

  /* BUNDLE CARDS */
  .bundles-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem; }
  .bundle-card { background: var(--navy-mid); border: 1px solid var(--border); display: flex; flex-direction: column; position: relative; transition: transform 0.3s, border-color 0.3s; }
  .bundle-card:hover { transform: translateY(-4px); }
  .bundle-card.bundle-featured { border-color: var(--amber); }
  .bundle-badge { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: var(--amber); color: var(--navy); font-family: 'DM Mono', monospace; font-size: 0.6rem; letter-spacing: 0.15em; text-transform: uppercase; padding: 0.25rem 0.75rem; font-weight: 600; white-space: nowrap; }
  .bundle-header { padding: 2rem 2rem 1.5rem; border-bottom: 1px solid var(--border); }
  .bundle-name { font-family: 'Bebas Neue', sans-serif; font-size: 1.75rem; letter-spacing: 0.03em; color: var(--white); line-height: 1; margin-bottom: 0.35rem; }
  .bundle-tagline { font-size: 0.78rem; color: var(--white-dim); font-style: italic; margin-bottom: 1.5rem; line-height: 1.5; }
  .bundle-price-row { display: flex; align-items: flex-end; gap: 0.25rem; }
  .bundle-amount { font-family: 'Bebas Neue', sans-serif; font-size: 3rem; color: var(--amber); line-height: 1; }
  .bundle-period { font-family: 'DM Mono', monospace; font-size: 0.65rem; color: var(--white-dim); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 0.35rem; }
  .bundle-setup-row { font-family: 'DM Mono', monospace; font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--white-faint); margin-top: 0.35rem; }
  .bundle-components { padding: 1.5rem 2rem; flex: 1; }
  .bundle-component { display: flex; gap: 0.75rem; align-items: flex-start; padding: 0.85rem 0; border-bottom: 1px solid rgba(255,255,255,0.04); }
  .bundle-component:last-child { border-bottom: none; }
  .bc-pill { font-family: 'DM Mono', monospace; font-size: 0.55rem; letter-spacing: 0.1em; text-transform: uppercase; padding: 0.2rem 0.55rem; white-space: nowrap; flex-shrink: 0; margin-top: 1px; }
  .bc-pill.mkt { background: rgba(245,166,35,0.1); border: 1px solid rgba(245,166,35,0.3); color: var(--amber); }
  .bc-pill.hs { background: rgba(0,212,180,0.08); border: 1px solid rgba(0,212,180,0.3); color: var(--teal); }
  .bc-body { flex: 1; }
  .bc-name { font-family: 'Bebas Neue', sans-serif; font-size: 0.95rem; color: var(--white); letter-spacing: 0.02em; line-height: 1; margin-bottom: 0.2rem; }
  .bc-price { font-family: 'DM Mono', monospace; font-size: 0.6rem; color: var(--white-faint); line-height: 1.5; }
  .bundle-footer { padding: 1.25rem 2rem; border-top: 1px solid var(--border); }
  .bundle-savings { font-family: 'DM Mono', monospace; font-size: 0.6rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--white-faint); margin-bottom: 0.75rem; }
  .bundle-savings span { color: var(--teal); }
  .section-divider { height: 1px; background: var(--border); margin: 3.5rem 0; }

  /* ADDON STEPS */
  .addon-steps { display: flex; flex-direction: column; gap: 0; margin-top: 2.5rem; }
  .addon-step { display: grid; grid-template-columns: 60px 1fr; gap: 1.5rem; align-items: start; border-bottom: 1px solid var(--border); padding-bottom: 2.5rem; margin-bottom: 2.5rem; }
  .addon-step:last-child { border-bottom: none; padding-bottom: 0; margin-bottom: 0; }
  .addon-step-num { font-family: 'Bebas Neue', sans-serif; font-size: 3.5rem; color: rgba(245,166,35,0.2); line-height: 1; transition: color 0.3s; padding-top: 0.2rem; }
  .addon-step:hover .addon-step-num { color: var(--amber); }
  .addon-step-inner { display: grid; grid-template-columns: 1fr 200px; gap: 2rem; align-items: start; }
  .addon-question { font-family: 'DM Mono', monospace; font-size: 0.62rem; letter-spacing: 0.15em; text-transform: uppercase; color: var(--amber); margin-bottom: 0.5rem; }
  .addon-step-title { font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem; color: var(--white); letter-spacing: 0.02em; line-height: 1; margin-bottom: 0.6rem; }
  .addon-step-desc { font-size: 0.88rem; color: var(--white-dim); line-height: 1.7; }
  .addon-includes { margin-top: 1rem; list-style: none; display: flex; flex-direction: column; gap: 0.3rem; }
  .addon-includes li { font-size: 0.82rem; color: var(--white-dim); display: flex; align-items: flex-start; gap: 0.5rem; line-height: 1.5; }
  .addon-includes li::before { content: "→"; color: var(--amber); flex-shrink: 0; font-size: 0.7rem; margin-top: 2px; }
  .addon-cta-box { background: var(--navy); border: 1px solid var(--border); padding: 1.5rem; display: flex; flex-direction: column; align-items: center; gap: 0.65rem; text-align: center; }
  .addon-cta-icon { font-size: 1.75rem; }
  .addon-cta-name { font-family: 'Bebas Neue', sans-serif; font-size: 1.05rem; color: var(--white); letter-spacing: 0.02em; line-height: 1.1; }
  .addon-cta-price { font-family: 'Bebas Neue', sans-serif; font-size: 2.2rem; color: var(--amber); line-height: 1; }
  .addon-cta-per { font-family: 'DM Mono', monospace; font-size: 0.58rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--white-dim); margin-top: -0.3rem; }
  .addon-cta-pill { font-family: 'DM Mono', monospace; font-size: 0.55rem; letter-spacing: 0.1em; text-transform: uppercase; padding: 0.18rem 0.55rem; border: 1px solid rgba(245,166,35,0.3); color: var(--amber); }
  .addon-cta-pill.teal { border-color: rgba(0,212,180,0.3); color: var(--teal); }
  .addon-cta-btn { display: block; width: 100%; text-align: center; padding: 0.65rem; font-family: 'DM Mono', monospace; font-size: 0.65rem; letter-spacing: 0.1em; text-transform: uppercase; background: transparent; color: var(--white-dim); border: 1px solid var(--white-faint); border-radius: 3px; text-decoration: none; transition: all 0.2s; }
  .addon-cta-btn:hover { border-color: var(--amber); color: var(--amber); }
  .addon-cta-link { font-family: 'DM Mono', monospace; font-size: 0.58rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--amber); text-decoration: none; }
  .addon-cta-link:hover { text-decoration: underline; }

  @media (max-width: 1100px) { .bundles-grid { grid-template-columns: 1fr; max-width: 500px; margin-left: auto; margin-right: auto; } }
  @media (max-width: 900px) {
    .b2b-why { grid-template-columns: 1fr; padding: 1.75rem; }
    .addon-step { grid-template-columns: 50px 1fr; gap: 1rem; }
    .addon-step-inner { grid-template-columns: 1fr; }
    .addon-cta-box { width: 100%; }
  }



#planner {
  --navy:#0D1220;        
  --charcoal:#11141F;    
  --orange:#F1A426;      
  --white:#EEECE8;       
  --slate:#51555D;       
  --soft:#9E9EA2;        
  --gold:#9C6E24;        
  --orange-soft:rgba(241,164,38,.12);
  --orange-glow:rgba(241,164,38,.28);
  --border:rgba(81,85,93,.45);
  --radius:12px;
}
#planner * {box-sizing:border-box}
#planner {
  margin:0;background:var(--navy);color:var(--white);
  font-family:'Inter',system-ui,sans-serif;font-size:16px;line-height:1.5;
  -webkit-font-smoothing:antialiased;position:relative;min-height:100vh;
}
#planner .wrap {max-width:1200px;margin:0 auto;padding:0 22px;position:relative;z-index:1}
#planner .masthead {padding:30px 0 6px}
#planner .logo {height:46px;width:auto;display:block}
@media(max-width:560px) {
#planner .logo {height:34px}
}
#planner .eyebrow {display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--orange);
  color:var(--orange);border-radius:999px;padding:6px 13px;font-size:11.5px;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;margin:30px 0 18px}
#planner .eyebrow .dot {width:6px;height:6px;border-radius:50%;background:var(--orange)}
#planner .h1 {font-family:'Anton',sans-serif;font-weight:400;text-transform:uppercase;
  font-size:clamp(38px,6.4vw,76px);line-height:.94;letter-spacing:.005em;margin:0 0 18px;max-width:16ch}
#planner .h1 .o {color:var(--orange)}
#planner .sub {color:var(--soft);font-size:clamp(15px,1.7vw,18.5px);max-width:60ch;margin:0;line-height:1.55}
#planner .sub b {color:var(--white);font-weight:600}
#planner .goals {margin:34px 0 6px}
#planner .lbl {font-size:11.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--soft);margin-bottom:14px;display:flex;align-items:center;gap:8px}
#planner .lbl .dot {width:6px;height:6px;border-radius:50%;background:var(--orange)}
#planner .goalrow {display:flex;flex-wrap:wrap;gap:10px}
#planner .goal {
  border:1.5px solid var(--border);background:var(--charcoal);border-radius:999px;
  padding:11px 17px;font-size:14.5px;font-weight:600;color:var(--white);cursor:pointer;
  display:inline-flex;align-items:center;gap:9px;transition:.16s ease;font-family:inherit
}
#planner .goal .ico {font-size:16px;line-height:1}
#planner .goal:hover {border-color:var(--orange);transform:translateY(-1px)}
#planner .goal.on {background:var(--orange);color:var(--navy);border-color:var(--orange)}
#planner .goal:focus-visible {outline:3px solid var(--orange-soft);outline-offset:2px}
#planner .grid {display:grid;grid-template-columns:1fr 372px;gap:32px;align-items:start;margin:32px 0 100px}
#planner .cat {margin-bottom:32px}
#planner .cat-head {display:flex;align-items:center;gap:13px;margin:0 2px 16px}
#planner .cat-pill {display:inline-flex;align-items:center;gap:8px;font-family:'Inter',sans-serif;
  font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--orange);white-space:nowrap}
#planner .cat-pill .dot {width:6px;height:6px;border-radius:50%;background:var(--orange)}
#planner .cat-head .blurb {color:var(--soft);font-size:13px;border-top:1px solid var(--border);flex:1;padding-top:0;position:relative;top:1px}
#planner .cat-head .blurb span {background:var(--navy);padding-right:10px;position:relative;top:-9px}
#planner .cards {display:grid;grid-template-columns:1fr 1fr;gap:13px}
#planner .card {
  position:relative;border:1.5px solid var(--border);background:var(--charcoal);border-radius:var(--radius);
  padding:16px;cursor:pointer;transition:.15s ease;display:flex;flex-direction:column;gap:9px
}
#planner .card:hover {border-color:rgba(241,164,38,.5);transform:translateY(-1px)}
#planner .card.on {border-color:var(--orange);box-shadow:0 0 0 1px var(--orange),0 12px 30px var(--orange-glow)}
#planner .card:focus-visible {outline:3px solid var(--orange-soft);outline-offset:2px}
#planner .card-top {display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
#planner .card .nm {font-weight:600;font-size:15.5px;letter-spacing:-.005em;line-height:1.25;color:var(--white)}
#planner .card .desc {color:var(--soft);font-size:12.5px;line-height:1.45;margin:0}
#planner .card .desc .note {font-style:italic;color:var(--slate)}
#planner .tick {flex:0 0 auto;width:23px;height:23px;border-radius:50%;border:1.7px solid var(--slate);
  display:grid;place-items:center;transition:.15s ease;margin-top:1px;background:transparent}
#planner .tick svg {width:13px;height:13px;opacity:0;transform:scale(.5);transition:.15s ease;stroke:var(--navy)}
#planner .card.on .tick {background:var(--orange);border-color:var(--orange)}
#planner .card.on .tick svg {opacity:1;transform:scale(1)}
#planner .card-bottom {display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto}
#planner .price {font-weight:700;font-size:17px;letter-spacing:-.01em;color:var(--white);font-variant-numeric:tabular-nums}
#planner .price .per {font-weight:500;font-size:12px;color:var(--soft)}
#planner .pill {font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  padding:3px 8px;border-radius:999px;white-space:nowrap;display:inline-flex;align-items:center;gap:4px}
#planner .pill.ai {border:1.3px solid var(--orange);color:var(--orange);background:var(--orange-soft)}
#planner .pill.once {border:1.3px solid var(--slate);color:var(--soft)}
#planner .pill .tri {width:0;height:0;border-left:6px solid var(--orange);border-top:3.5px solid transparent;border-bottom:3.5px solid transparent}
#planner .seg {display:inline-flex;border:1.5px solid var(--border);border-radius:9px;padding:2px;background:rgba(0,0,0,.25);gap:2px}
#planner .seg button {font-family:inherit;font-size:11.5px;font-weight:600;border:0;background:transparent;color:var(--soft);
  padding:5px 11px;border-radius:7px;cursor:pointer;transition:.14s ease;display:inline-flex;align-items:center;gap:5px}
#planner .seg button.sel {background:var(--white);color:var(--navy)}
#planner .seg button.sel.ai {background:var(--orange);color:var(--navy)}
#planner .seg button:focus-visible {outline:2px solid var(--orange);outline-offset:1px}
#planner .tiersel {font-family:inherit;font-size:12px;font-weight:600;color:var(--white);background:rgba(0,0,0,.35);
  border:1.5px solid var(--border);border-radius:8px;padding:5px 26px 5px 10px;cursor:pointer;max-width:100%;
  -webkit-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23F1A426' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 9px center}
#planner .tiersel:hover {border-color:var(--orange)}
#planner .tiersel:focus-visible {outline:2px solid var(--orange);outline-offset:1px}
#planner .tiersel option {background:var(--charcoal);color:var(--white)}
#planner .rail {position:sticky;top:18px}
#planner .panel {background:var(--charcoal);border:1px solid var(--border);border-radius:18px;padding:22px 20px;
  box-shadow:0 24px 60px rgba(0,0,0,.4);overflow:hidden;position:relative}
#planner .panel::before {content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--orange)}
#planner .panel h3 {font-family:'Inter',sans-serif;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);margin:4px 0 16px;font-weight:700}
#planner .found {display:flex;gap:12px;align-items:flex-start;padding:13px;border-radius:12px;background:rgba(0,0,0,.28);border:1px solid var(--border);margin-bottom:14px}
#planner .found .lock {flex:0 0 auto;width:30px;height:30px;border-radius:8px;background:var(--orange-soft);display:grid;place-items:center}
#planner .found .ft {font-weight:700;font-size:14px;color:var(--white)}
#planner .found .fd {color:var(--soft);font-size:11.5px;line-height:1.4;margin-top:3px}
#planner .found .fp {font-weight:700;margin-left:auto;white-space:nowrap;color:var(--orange);font-variant-numeric:tabular-nums}
#planner .lines {list-style:none;margin:0 0 6px;padding:0;max-height:240px;overflow:auto}
#planner .lines::-webkit-scrollbar {width:6px}
#planner .lines::-webkit-scrollbar-thumb {background:var(--slate);border-radius:3px}
#planner .line {display:flex;align-items:center;gap:9px;padding:8px 0;border-bottom:1px solid var(--border);font-size:13.5px}
#planner .line .lx {flex:0 0 auto;width:18px;height:18px;border-radius:5px;border:0;background:rgba(255,255,255,.07);color:var(--soft);cursor:pointer;font-size:14px;line-height:1;display:grid;place-items:center;transition:.14s}
#planner .line .lx:hover {background:var(--orange);color:var(--navy)}
#planner .line .lnm {flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--white)}
#planner .line .lnm .ai-dot {color:var(--orange);font-weight:700}
#planner .line .lp {font-weight:600;white-space:nowrap;color:var(--white);font-variant-numeric:tabular-nums}
#planner .empty {color:var(--soft);font-size:13.5px;padding:14px 2px;line-height:1.5}
#planner .meter {margin:15px 0 4px}
#planner .meter .mt {display:flex;justify-content:space-between;font-size:12px;color:var(--soft);margin-bottom:7px}
#planner .meter .mt b {color:var(--orange)}
#planner .bar {height:7px;border-radius:4px;background:rgba(255,255,255,.09);overflow:hidden}
#planner .bar i {display:block;height:100%;background:var(--orange);width:0;transition:width .35s ease}
#planner .totals {margin-top:16px;padding-top:14px;border-top:1px solid var(--border);font-size:13.5px}
#planner .trow {display:flex;justify-content:space-between;padding:4px 0;color:var(--soft)}
#planner .trow .v {color:var(--white);font-variant-numeric:tabular-nums}
#planner .trow.disc {color:var(--orange)}
#planner .trow.disc .v {color:var(--orange)}
#planner .grand {display:flex;justify-content:space-between;align-items:baseline;margin-top:14px}
#planner .grand .gl {font-size:13px;color:var(--white);font-weight:700;text-transform:uppercase;letter-spacing:.04em}
#planner .grand .gv {font-family:'Anton',sans-serif;font-weight:400;font-size:40px;letter-spacing:.01em;color:var(--white);line-height:1}
#planner .grand .gv small {font-family:'Inter',sans-serif;font-size:14px;font-weight:500;color:var(--soft)}
#planner .onetime {font-size:12px;color:var(--soft);margin-top:7px}
#planner .onetime b {color:var(--white);font-weight:600}
#planner .cta {display:flex;align-items:center;justify-content:center;gap:8px;width:100%;border:0;border-radius:8px;padding:14px;
  font-family:'Inter',sans-serif;font-weight:700;font-size:14.5px;cursor:pointer;margin-top:16px;transition:.15s ease;text-decoration:none}
#planner .cta.primary {background:var(--orange);color:var(--navy)}
#planner .cta.primary:hover {filter:brightness(1.06);transform:translateY(-1px)}
#planner .cta.ghost {background:transparent;color:var(--white);border:1.5px solid var(--border);margin-top:9px;font-size:13.5px;padding:12px}
#planner .cta.ghost:hover {border-color:var(--orange);color:var(--orange)}
#planner .cta:focus-visible {outline:3px solid var(--orange-soft);outline-offset:2px}
#planner .reset {display:block;text-align:center;background:none;border:0;color:var(--soft);font-size:12.5px;cursor:pointer;margin:13px auto 0;font-family:inherit}
#planner .reset:hover {color:var(--orange);text-decoration:underline}
#planner .floor {font-size:11px;color:var(--slate);margin-top:13px;line-height:1.5}
@media (max-width:920px) {
#planner .grid {grid-template-columns:1fr;gap:0;margin-bottom:120px}
#planner .rail {position:static;margin-top:10px}
}
@media (max-width:560px) {
#planner .cards {grid-template-columns:1fr}
#planner .cat-head .blurb {display:none}
}
@media (prefers-reduced-motion:reduce) {
#planner * {transition:none!important}
}
#planner{padding-top:120px;padding-bottom:48px}