/* ===== HOMEPAGE ===== */

/* homepage styles here */

body {
  font-family: "Plus Jakarta Sans", sans-serif;
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

:root {
  --green: #078037;
  --green-bright: #09a866;
  --green-pale: #edfaf3;
  --green-mid: #b8ddc8;
  --green-dark: #056840;
  --ink: #0a1a10;
  --ink-mid: #3d5c47;
  --ink-light: #7e9e89;
  --ink-xlight: #b8cec0;
  --surface: #ffffff;
  --surface-2: #f7faf8;
  --surface-3: #f0f5f2;
  --border: #e2ede7;
  --border-strong: #c8ddd1;
  --shadow-sm: 0 1px 3px #f1f5f3, 0 1px 2px #f5f8f6;
  --shadow-md: 0 4px 16px #edf2ef, 0 2px 4px #f5f8f6;
  --shadow-lg: 0 20px 60px #e5ecе8, 0 8px 16px #f1f5f3;
  --shadow-xl: 0 40px 100px rgba(10,26,16,0.15), 0 16px 32px #edf2ef;
}

.no-vc-spacing{
 margin:0 !important;
 padding:0 !important;
}

.vc_row{
 margin:0 !important;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

body {
  font-family: 'Plus Jakarta Sans', sans-serif;
  background: var(--surface);
  color: var(--ink);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

/* ── NAV ── */
nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  height: 64px;
  display: flex;
  align-items: center;
  padding: 0 48px;
  justify-content: space-between;
  transition: box-shadow 0.3s;
}

.nav-logo img { height: 30px; width: auto; display: block; }

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

.nav-links a {
  font-size: 0.938rem;
  font-weight: 500;
  color: var(--ink-mid);
  text-decoration: none;
  letter-spacing: -0.01em;
  transition: color 0.15s;
}

.nav-links a:hover { color: var(--ink); }

.nav-actions { display: flex; align-items: center; gap: 10px; }

.btn-nav-ghost {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 0.938rem;
  font-weight: 500;
  color: var(--ink-mid);
  background: none;
  border: none;
  padding: 8px 16px;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  transition: color 0.15s, background 0.15s;
}

.btn-nav-ghost:hover { color: var(--ink); background: var(--surface-3); }

.btn-nav-primary {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 0.938rem;
  font-weight: 600;
  background: var(--green);
  color: white;
  border: none;
  padding: 9px 20px;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  transition: background 0.15s, transform 0.15s, box-shadow 0.15s;
  letter-spacing: -0.01em;
}

.btn-nav-primary:hover {
  background: var(--green-bright);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px #bedfca;
}

/* ── HERO ── */
.hero {
  padding: 140px 80px 100px;
  background: var(--surface);
  position: relative;
  overflow: hidden;
}

/* Subtle grid pattern */
.hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: 
    linear-gradient(var(--border) 1px, transparent 1px),
    linear-gradient(90deg, var(--border) 1px, transparent 1px);
  background-size: 60px 60px;
  opacity: 0.35;
  pointer-events: none;
}

/* Green glow top right */
.hero::after {
  content: '';
  position: absolute;
  top: -120px; right: -80px;
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(9,168,102,0.08) 0%, transparent 65%);
  pointer-events: none;
}

.hero-inner {
  position: relative;
  z-index: 2;
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

.hero-content { animation: fadeUp 0.7s ease both; }

.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--green);
  background: var(--green-pale);
  border: 1px solid var(--green-mid);
  padding: 5px 12px 5px 8px;
  border-radius: 100px;
  margin-bottom: 28px;
}

.badge-dot {
  width: 6px; height: 6px;
  background: var(--green-bright);
  border-radius: 50%;
  animation: pulse 2s infinite;
}

h1 {
  font-size: clamp(2.8rem, 4.5vw, 4.2rem);
  font-weight: 800;
  line-height: 1.06;
  letter-spacing: -0.03em;
  color: var(--ink);
  margin-bottom: 20px;
}

h1 .accent {
  font-family: 'Fraunces', serif;
  font-style: italic;
  font-weight: 600;
  color: var(--green);
  letter-spacing: -0.02em;
}

.hero-sub {
  font-size: 1.05rem;
  color: var(--ink-mid);
  line-height: 1.7;
  margin-bottom: 36px;
  max-width: 460px;
  font-weight: 400;
  letter-spacing: -0.01em;
}

.hero-ctas {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 52px;
  flex-wrap: wrap;
}

.btn-cta-primary {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.0rem;
  font-weight: 700;
  background: #078037;
  color: white;
  border: none;
  padding: 14px 28px;
  border-radius: 10px;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all 0.2s;
  letter-spacing: -0.01em;
  box-shadow: 0 1px 2px #d3ebdc, inset 0 1px 0 #36394a;
}

.btn-cta-primary:hover {
  background: #078037;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(7,137,85,0.35);
}

.btn-cta-ghost {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.0rem;
  font-weight: 500;
  color: var(--ink-mid);
  background: none;
  border: 1.5px solid var(--border-strong);
  padding: 13px 24px;
  border-radius: 10px;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.2s;
  letter-spacing: -0.01em;
}

.btn-cta-ghost:hover { border-color: var(--ink-xlight); color: var(--ink); background: var(--surface-3); }

.cta-note {
  font-size: 0.98rem;
  color: var(--ink-light);
  align-self: center;
}

.hero-stats {
  display: flex;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  background: var(--surface-2);
  width: fit-content;
}

.hero-stat {
  padding: 14px 24px;
  border-right: 1px solid var(--border);
  text-align: center;
}

.hero-stat:last-child { border-right: none; }

.stat-val {
  font-size: 1.3rem;
  font-weight: 800;
  color: var(--ink);
  letter-spacing: -0.02em;
  line-height: 1;
  margin-bottom: 3px;
}

.stat-lbl {
  font-size: 0.85rem;
  color: var(--ink-light);
  white-space: nowrap;
  font-weight: 500;
}

/* Hero visual */
.hero-visual {
  position: relative;
  animation: fadeUp 0.7s 0.15s ease both;
  display: flex;
  justify-content: center;
}

.hero-phone-primary {
  width: 260px;
  border-radius: 40px;
  box-shadow: var(--shadow-xl);
  border: 8px solid #1a1a1a;
  position: relative;
  z-index: 2;
  display: block;
}

.hero-phone-secondary {
  width: 220px;
  border-radius: 36px;
  box-shadow: var(--shadow-lg);
  border: 7px solid #f0f0f0;
  position: absolute;
  right: -20px;
  bottom: -40px;
  z-index: 1;
  display: block;
}

.hero-floating-badge {
  position: absolute;
  top: 40px;
  left: -10px;
  background: white;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 5px 16px;
  box-shadow: var(--shadow-sm);
  display: flex;
  align-items: center;
  gap: 10px;
  z-index: 3;
  animation: float 4s ease-in-out infinite;
}

.floating-icon {
  width: 34px; height: 34px;
  border-radius: 8px;
  background: var(--green-pale);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
}

.floating-text strong {
  display: block;
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--ink);
  letter-spacing: -0.01em;
}

.floating-text span {
  font-size: 0.7rem;
  color: var(--green);
  font-weight: 600;
}

.hero-floating-badge-2 {
  position: absolute;
  bottom: 20px;
  left: -30px;
  background: white;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px 14px;
  box-shadow: var(--shadow-sm);
  display: flex;
  align-items: center;
  gap: 8px;
  z-index: 3;
  animation: float 4s 1.5s ease-in-out infinite;
}

/* ── LOGO BAR ── */
.logo-bar {
  background: var(--surface-2);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 24px 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

.logo-bar-label {
  font-size: 0.95rem;
  font-weight: 600;
  color: #638e73;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
  margin-right: 12px;
}

.logo-bar-stats {
  display: flex;
  gap: 32px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
}

.lbs-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.98rem;
  color: var(--ink-mid);
  font-weight: 500;
}

.lbs-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--green-bright);
  flex-shrink: 0;
}

/* ── SECTION SHARED ── */
.section-wrap {
  max-width: 1200px;
  margin: 0 auto;
}

.eyebrow {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--green);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.eyebrow::before {
  content: '';
  width: 16px; height: 2px;
  background: var(--green-bright);
  border-radius: 1px;
}

h2.section-h {
  font-size: clamp(1.9rem, 3vw, 2.8rem);
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1.1;
  color: var(--ink);
  margin-bottom: 16px;
}

h2.section-h .serif {
  font-family: 'Fraunces', serif;
  font-weight: 600;
  font-style: italic;
  letter-spacing: -0.02em;
  color: var(--green);
}

.section-p {
  font-size: 1rem;
  color: var(--ink-mid);
  line-height: 1.7;
  max-width: 520px;
  font-weight: 400;
  letter-spacing: -0.01em;
}

/* ── PROBLEM SECTION ── */
.problem-section {
  padding: 120px 80px;
  background: var(--surface);
}

.problem-header {
  margin-bottom: 64px;
}

.problem-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.pcard {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 32px 28px;
  transition: all 0.2s;
  position: relative;
  overflow: hidden;
}

.pcard::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: var(--border);
  transition: background 0.2s;
}

.pcard:hover { 
  border-color: var(--green-mid); 
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

.pcard:hover::after { background: var(--green-bright); }

.pcard-icon {
  font-size: 1.8rem;
  margin-bottom: 18px;
  display: block;
}

.pcard-title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 10px;
  letter-spacing: -0.02em;
}

.pcard-desc {
  font-size: 1.0rem;
  color: var(--ink-mid);
  line-height: 1.70;
  font-weight: 400;
}

/* ── FEATURES ── */
.features-section {
  padding: 0 80px 120px;
  background: var(--surface-2);
}

.features-header {
  text-align: center;
  max-width: 640px;
  margin: 0 auto 80px;
}

.features-header .section-p { max-width: 100%; text-align: center; }

.feature-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 100px;
  align-items: center;
  padding: 80px 0;
  border-top: 1px solid var(--border);
}

.feature-row.flip { direction: rtl; }
.feature-row.flip > * { direction: ltr; }

.feature-tag {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--green);
  background: var(--green-pale);
  border: 1px solid var(--green-mid);
  padding: 4px 10px;
  border-radius: 6px;
  margin-bottom: 18px;
}

.feature-h {
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 800;
  letter-spacing: -0.025em;
  color: var(--ink);
  line-height: 1.15;
  margin-bottom: 14px;
}

.feature-p {
  font-size: 1.0rem;
  color: var(--ink-mid);
  line-height: 1.7;
  margin-bottom: 28px;
  font-weight: 400;
  letter-spacing: -0.01em;
}

.feature-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 32px;
}

.feature-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.938rem;
  color: var(--ink-mid);
  font-weight: 500;
  letter-spacing: -0.01em;
}

.check-icon {
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--green-pale);
  border: 1.5px solid var(--green-mid);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.check-icon svg { width: 8px; height: 8px; }

.feature-visual-wrap {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px;
}

.feature-phone {
  width: 260px;
  border-radius: 38px;
  display: block;
  position: relative;
  z-index: 2;
}

.feature-phone.light-frame {
  border: 7px solid #e8e8e8;
  box-shadow: var(--shadow-xl);
}

.feature-phone.dark-frame {
  border: 7px solid #1a1a1a;
  box-shadow: var(--shadow-xl);
}

.feature-bg-blob {
  position: absolute;
  width: 320px; height: 320px;
  border-radius: 50%;
  background: radial-gradient(circle, var(--green-pale) 0%, transparent 70%);
  z-index: 1;
}

.feature-chip {
  position: absolute;
  background: white;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px 14px;
  box-shadow: var(--shadow-md);
  z-index: 4;
  display: flex;
  align-items: center;
  gap: 8px;
}

.chip-tr { top: 0; right: 0; }
.chip-bl { bottom: 10px; left: 0; }

.chip-emoji { font-size: 1.1rem; }
.chip-label { font-size: 0.75rem; font-weight: 700; color: var(--ink); letter-spacing: -0.01em; }
.chip-sub { font-size: 0.68rem; color: var(--green); font-weight: 600; }

/* ── DASHBOARD SECTION ── */
.dashboard-section {
  padding: 120px 80px;
  background: var(--surface);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.dashboard-inner {
  max-width: 1200px;
  margin: 0 auto;
}

.dashboard-header {
  text-align: center;
  max-width: 600px;
  margin: 0 auto 56px;
}

.dashboard-header .section-p { max-width: 100%; text-align: center; }

.dashboard-img-wrap {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--shadow-xl);
  border: 1px solid var(--border);
}

.dashboard-img-wrap img {
  width: 100%;
  display: block;
}

/* ── FOUNDER ── */
.founder-section {
  padding: 120px 80px;
  background: #078037;
  border-top: none;
  border-bottom: none;
  position: relative;
  overflow: hidden;
}

.founder-section::before {
  content: none;
}

.founder-glow {
  position: absolute;
  top: -200px; right: -200px;
  width: 700px; height: 700px;
  background: radial-gradient(circle, #eef8f2 0%, transparent 65%);
  pointer-events: none;
}

.founder-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: start;
  position: relative;
  z-index: 2;
}

.founder-eyebrow {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.founder-eyebrow::before {
  content: '';
  width: 16px; height: 2px;
  background: rgba(255,255,255,0.5);
  border-radius: 1px;
}

.founder-quote {
  font-family: 'Fraunces', serif;
  font-size: clamp(1.3rem, 2.2vw, 1.8rem);
  font-style: italic;
  color: rgba(255,255,255,0.95);
  line-height: 1.5;
  margin-bottom: 40px;
  font-weight: 400;
  letter-spacing: -0.01em;
}

.founder-quote em {
  color: white;
  font-style: normal;
  font-weight: 700;
}

.founder-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 40px;
}

.founder-stat {
  background: #272c35;
  border: 1px solid #272c35;
  border-radius: 12px;
  padding: 20px;
  transition: all 0.2s;
}

.founder-stat:hover {
  background: #444a60;
  border-color: #585e7b;
}

.fs-num {
  font-size: 1.6rem;
  font-weight: 800;
  color: white;
  letter-spacing: -0.03em;
  line-height: 1;
  margin-bottom: 4px;
}

.fs-lbl {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.55);
  font-weight: 500;
  line-height: 1.4;
}

.btn-founder {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.0rem;
  font-weight: 700;
  background: white;
  color: var(--green);
  border: none;
  padding: 14px 28px;
  border-radius: 10px;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  transition: all 0.2s;
  letter-spacing: -0.01em;
  box-shadow: 0 1px 2px #bedfca;
}

.btn-founder:hover {
  background: rgba(255,255,255,0.9);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.2);
}

.testimonial-stack {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.tcard {
  background: #3a3f50;
  border: 1px solid #42475c;
  border-radius: 14px;
  padding: 24px;
  transition: all 0.2s;
}

.tcard:hover {
  background: #42475c;
  border-color: #515672;
}

.tcard.highlight {
  background: #474d64;
  border-color: #585e7b;
}

.tcard-quote {
  font-size: 1.0rem;
  color: rgba(255,255,255,0.75);
  line-height: 1.65;
  margin-bottom: 14px;
  font-style: italic;
  font-weight: 400;
  letter-spacing: -0.01em;
}

.tcard.highlight .tcard-quote { color: rgba(255,255,255,0.95); }

.tcard-author {
  font-size: 0.75rem;
  font-weight: 700;
  color: rgba(255,255,255,0.6);
  letter-spacing: -0.01em;
}

/* ── PARTNER ── */
.partner-section {
  padding: 120px 80px;
  background: var(--surface-2);
  border-bottom: 1px solid var(--border);
}

.partner-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

.partner-terms {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin: 32px 0;
}

.pterm {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 20px;
  transition: all 0.2s;
}

.pterm:hover { border-color: var(--green-mid); background: var(--green-pale); }

.pterm-num {
  font-size: 1.8rem;
  font-weight: 800;
  color: var(--green);
  letter-spacing: -0.03em;
  line-height: 1;
  margin-bottom: 4px;
}

.pterm-lbl {
  font-size: 0.75rem;
  color: var(--ink-light);
  font-weight: 500;
  line-height: 1.4;
}

.partner-visual {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 36px;
}

.partner-visual h3 {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--ink);
  letter-spacing: -0.02em;
  margin-bottom: 6px;
}

.partner-visual p {
  font-size: 0.85rem;
  color: var(--ink-mid);
  line-height: 1.6;
  margin-bottom: 28px;
}

.timeline {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.tl-item {
  display: flex;
  gap: 16px;
  position: relative;
}

.tl-item:not(:last-child) .tl-line {
  position: absolute;
  left: 16px;
  top: 32px;
  bottom: -8px;
  width: 1px;
  background: var(--border);
}

.tl-dot {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--green-pale);
  border: 2px solid var(--green-mid);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 0.75rem;
  font-weight: 800;
  color: var(--green);
  position: relative;
  z-index: 2;
}

.tl-content {
  padding-bottom: 24px;
}

.tl-week {
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--ink-light);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 3px;
}

.tl-action {
  font-size: 0.938rem;
  font-weight: 600;
  color: var(--ink);
  letter-spacing: -0.01em;
}




/* ── VIDEO SECTION ── */
.video-section {
  background: #282c34;
  padding: 120px 80px;
  border-top: none;
}

.video-inner {
  max-width: 1100px;
  margin: 0 auto;
}

.video-header {
  margin-bottom: 56px;
}

/* Tab nav */
.vtabs {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 36px;
  background: #303440;
  border: 1px solid #343848;
  border-radius: 14px;
  padding: 6px;
}

.vtab {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 0.82rem;
  font-weight: 600;
  color: rgba(255,255,255,0.5);
  background: transparent;
  border: none;
  padding: 10px 18px;
  border-radius: 10px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 7px;
  transition: all 0.2s;
  letter-spacing: -0.01em;
  white-space: nowrap;
}

.vtab:hover {
  color: rgba(255,255,255,0.85);
  background: #323643;
}

.vtab.active {
  background: #272c35;
  color: white;
 /* box-shadow: 0 2px 8px #a3d0b6;*/
}



/* Player area */
.vplayer-wrap {
  position: relative;
}

.vpanel {
  display: none;
  flex-direction: column;
  gap: 0;
  animation: fadeUp 0.35s ease both;
}

.vpanel.active {
  display: flex;
}

.vplayer {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 */
  border-radius: 16px 16px 0 0;
  overflow: hidden;
  background: #1a1d24;
  border: 1px solid #343848;
  border-bottom: none;
}

.vplayer iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: none;
}

.vpanel-meta {
  background: #2f3340;
  border: 1px solid #343848;
  border-radius: 0 0 16px 16px;
  padding: 24px 32px;
  display: flex;
  align-items: center;
  gap: 32px;
}

.vpanel-title {
  font-size: 1rem;
  font-weight: 700;
  color: white;
  white-space: nowrap;
  letter-spacing: -0.02em;
  min-width: 180px;
}

.vpanel-desc {
  font-size: 0.938rem;
  color: #fff;
  line-height: 1.65;
  letter-spacing: -0.01em;
  font-weight: 400;
  border-left: 1px solid #36394a;
  padding-left: 32px;
}

@media (max-width: 768px) {
  .video-section { padding: 80px 24px; }
  .vtabs { gap: 4px; padding: 4px; }
  .vtab { font-size: 0.75rem; padding: 8px 12px; }
  .vtab-icon { display: none; }
  .vpanel-meta { flex-direction: column; gap: 10px; align-items: flex-start; }
  .vpanel-title { min-width: auto; }
  .vpanel-desc { border-left: none; padding-left: 0; border-top: 1px solid #36394a; padding-top: 12px; }
}


/* ── CROSS-BROWSER ── */
html, body { max-width: 100%; overflow-x: hidden; }
button, a { -webkit-tap-highlight-color: transparent; cursor: pointer; }
img { max-width: 100%; height: auto; }
iframe { border: 0; }

@supports not (backdrop-filter: blur(16px)) {
  nav { background: #ffffff; }
}

/* ── TABLET ── */
@media (max-width: 1024px) {
  .hero-inner { grid-template-columns: 1fr; gap: 48px; }
  .hero-visual { order: 0; justify-content: center; }
  .hero-phone-secondary { display: none; }
  .hero-floating-badge { top: 10px; left: 0; }
  .hero-floating-badge-2 { bottom: 10px; left: 0; }
  .feature-row, .feature-row.flip { grid-template-columns: 1fr; direction: ltr; gap: 40px; }
  .founder-inner { grid-template-columns: 1fr; }
  .partner-inner { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 32px; }
  .problem-cards { grid-template-columns: 1fr; }
}

/* ── MOBILE ── */
@media (max-width: 768px) {
  nav { padding: 0 20px; height: 56px; }
  .nav-links { display: none; }
  .nav-actions .btn-nav-ghost, .nav-actions .btn-nav-primary { display: none; }
  .hamburger { display: flex; }

  .hero { padding: 88px 20px 60px; }
  h1 { font-size: 2.2rem; }
  .hero-ctas { flex-direction: column; align-items: flex-start; }
  .cta-note { align-self: auto; }
  .hero-stats { width: 100%; border-radius: 10px; }
  .hero-stat { flex: 1; min-width: 100px; padding: 12px 16px; }
  .hero-floating-badge, .hero-floating-badge-2 { /*display: none;*/ }

  .logo-bar { padding: 20px; flex-direction: column; gap: 12px; text-align: center; }
  .logo-bar-stats { flex-direction: column; gap: 8px; align-items: center; }

  .problem-section { padding: 80px 20px; }
  .features-section { padding: 0 20px 80px; }
  .feature-row { padding: 60px 0; }
  .feature-phone { width: 200px; }
  .feature-bg-blob { width: 240px; height: 240px; }

  .video-section { padding: 80px 20px; }
  .vtabs { padding: 4px; gap: 3px; border-radius: 10px; }
  .vtab { padding: 8px 10px; font-size: 0.72rem; gap: 4px; border-radius: 8px; }
  .vtab .material-symbols-outlined { font-size: 16px; }
  .vpanel-meta { flex-direction: column; gap: 10px; padding: 18px 20px; }
  .vpanel-title { min-width: auto; }
  .vpanel-desc { border-left: none; padding-left: 0; border-top: 1px solid rgba(255,255,255,0.12); padding-top: 10px; }

  .dashboard-section { padding: 80px 20px; }

  .founder-section { padding: 80px 20px; }
  .founder-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .testimonial-stack { gap: 12px; }

  .partner-section { padding: 80px 20px; }
  .partner-terms { grid-template-columns: 1fr 1fr; }
  .partner-visual { padding: 24px 20px; }

  footer { padding: 48px 20px 32px; }
  .footer-grid { grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }

  h2.section-h { font-size: 1.7rem; }
  .section-p { font-size: 1.0rem; }
}

/* ── SMALL MOBILE ── */
@media (max-width: 420px) {
  h1 { font-size: 1.9rem; }
  h2.section-h { font-size: 1.5rem; }
  .hero-stat .stat-val { font-size: 1.1rem; }
  .hero-stat .stat-lbl { font-size: 0.92rem; }
  .vtab-label { display: none; }
  .vtab { padding: 10px; }
  .vtab .material-symbols-outlined { font-size: 20px; }
  .founder-grid { grid-template-columns: 1fr; }
  .partner-terms { grid-template-columns: 1fr; }
}


.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
  font-size: 18px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  user-select: none;
}

/* ── ANIMATIONS ── */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(0.85); }
}

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

.aos {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.aos.visible { opacity: 1; transform: none; }
.aos-delay-1 { transition-delay: 0.1s; }
.aos-delay-2 { transition-delay: 0.2s; }

/* ── RESPONSIVE ── */
/* Responsive handled above */

/* NAV DROPDOWN */
.nav-dropdown { position:relative; }
.nav-dropdown-trigger { display:flex; align-items:center; }
.nav-dropdown-menu {
  display:none; position:absolute; top:calc(100% + 12px); left:50%;
  transform:translateX(-50%); background:white;
  border:1.5px solid var(--border); border-radius:14px;
  padding:8px; min-width:200px; z-index:200;
  box-shadow:0 8px 32px rgba(0,0,0,0.08);
}
.nav-dropdown:hover .nav-dropdown-menu { display:block; }
.dropdown-item {
  display:block; padding:9px 14px; font-size:0.85rem; font-weight:500;
  color:var(--ink-mid); text-decoration:none; border-radius:8px;
  transition:background 0.12s, color 0.12s; white-space:nowrap;
}
.dropdown-item:hover { background:var(--surface-2); color:var(--green); }
.dropdown-parent { font-weight:700; color:var(--ink); }
.dropdown-divider { height:1px; background:var(--border); margin:4px 0; }


/* ── INDUSTRIES DROPDOWN ─────────────────────────── */
.nav-dropdown { position: relative; }
.nav-dropdown-trigger { display: flex; align-items: center; gap: 4px; cursor: pointer; }
.nav-dropdown-trigger svg { transition: transform 0.2s ease; flex-shrink: 0; }
.nav-dropdown:hover .nav-dropdown-trigger svg,
.nav-dropdown.open .nav-dropdown-trigger svg { transform: rotate(180deg); }
.nav-dropdown-menu {
  position: absolute; top: calc(100% + 12px); left: 50%;
  transform: translateX(-50%); min-width: 210px;
  background: #fff; border: 1px solid var(--border);
  border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,0.10);
  padding: 6px; opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease;
  transform: translateX(-50%) translateY(-4px); z-index: 200;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown.open .nav-dropdown-menu {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown-menu::before {
  content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 14px;
}
.dropdown-item {
  display: block; padding: 9px 14px; font-size: 0.85rem; font-weight: 500;
  color: var(--ink-mid); text-decoration: none; border-radius: 7px;
  border-left: 3px solid transparent;
  transition: background 0.14s, border-color 0.14s, color 0.14s;
  letter-spacing: -0.01em;
}
.dropdown-item:hover { background: var(--green-pale); border-left-color: var(--green); color: var(--ink); }
.dropdown-divider { height: 1px; background: var(--border); margin: 5px 6px; }
.dropdown-parent { font-weight: 600; color: var(--ink); font-size: 0.8rem; letter-spacing: 0.03em; text-transform: uppercase; }



/* ===== About PAGE ===== */

/* about styles here */
/* Team Section */
.team-avatar {
  width: 84px;
  height: 84px;
  border-radius: 50%;
  overflow: hidden;
  /* Assuming display: flex; was already set or is desired for centering */
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: none; /* Clear any previous background image */
}

.team-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0; /* Ensure the image itself is not rounded */
}


:root {
  --green: #078037;
  --green-bright: #09a866;
  --green-pale: #edfaf3;
  --green-mid: #b8ddc8;
  --ink: #0a1a10;
  --ink-mid: #3d5c47;
  --ink-light: #7e9e89;
  --ink-xlight: #b8cec0;
  --surface: #ffffff;
  --surface-2: #f7faf8;
  --surface-3: #f0f5f2;
  --border: #e2ede7;
  --border-strong: #c8ddd1;
  --shadow-sm: 0 1px 3px #f1f5f3, 0 1px 2px #f1f5f3;
  --shadow-md: 0 4px 16px #edf2ef, 0 2px 4px #f1f5f3;
  --shadow-lg: 0 20px 60px #e5ecе8, 0 8px 16px #edf2ef;
  --shadow-xl: 0 40px 100px #e0eae6, 0 16px 32px #edf2ef;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; max-width: 100%; overflow-x: hidden; }
body {
  font-family: "Plus Jakarta Sans", sans-serif;
  background: var(--surface);
  color: var(--ink);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }

/* NAV */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  height: 64px; display: flex; align-items: center;
  padding: 0 48px; justify-content: space-between;
  transition: box-shadow 0.3s;
}
.nav-logo img { height: 30px; width: auto; }
.nav-links { display: flex; align-items: center; gap: 32px; list-style: none; }
.nav-links a { font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; letter-spacing: -0.01em; transition: color 0.15s; }
.nav-links a:hover { color: var(--ink); }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.btn-nav-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); background: none; border: none; padding: 8px 16px; border-radius: 8px; cursor: pointer; text-decoration: none; transition: all 0.15s; }
.btn-nav-ghost:hover { color: var(--ink); background: var(--surface-3); }
.btn-nav-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 600; background: var(--green); color: white; border: none; padding: 9px 20px; border-radius: 8px; cursor: pointer; text-decoration: none; display: inline-block; transition: all 0.15s; letter-spacing: -0.01em; }
.btn-nav-primary:hover { background: var(--green-bright); transform: translateY(-1px); box-shadow: 0 4px 12px #a3d0b6; }

/* HAMBURGER */
.hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; padding: 8px; }
.hamburger span { display: block; width: 22px; height: 2px; background: var(--ink); border-radius: 2px; transition: all 0.3s; transform-origin: center; }
.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; top: 64px; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--border); padding: 20px 24px 28px; z-index: 99; box-shadow: 0 8px 24px #e5ecе8; flex-direction: column; gap: 4px; }
.mobile-menu.open { display: flex; }
.mobile-menu a { font-size: 1rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; padding: 12px 0; border-bottom: 1px solid var(--border); transition: color 0.15s; }
.mobile-menu a:hover { color: var(--green); }
.mobile-menu-actions { display: flex; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--border); }
.mobile-menu-actions a { border-bottom: none; padding: 0; flex: 1; text-align: center; }

/* SHARED ELEMENTS */
.eyebrow { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.eyebrow::before { content: ""; width: 16px; height: 2px; background: var(--green-bright); border-radius: 1px; }
h2.section-h { font-size: clamp(1.9rem, 3vw, 2.8rem); font-weight: 800; letter-spacing: -0.025em; line-height: 1.1; color: var(--ink); margin-bottom: 16px; }
h2.section-h .serif { font-family: "Fraunces", serif; font-weight: 600; font-style: italic; letter-spacing: -0.02em; color: var(--green); }
.section-p { font-size: 1rem; color: var(--ink-mid); line-height: 1.7; max-width: 520px; font-weight: 400; letter-spacing: -0.01em; }
.section-wrap { max-width: 1200px; margin: 0 auto; }
.check-icon { width: 18px; height: 18px; border-radius: 50%; background: var(--green-pale); border: 1.5px solid var(--green-mid); flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.check-icon svg { width: 8px; height: 8px; }

/* BTN */
.btn-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 700; background: var(--green); color: white; border: none; padding: 14px 28px; border-radius: 10px; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-primary:hover { background: var(--green-bright); transform: translateY(-2px); box-shadow: 0 8px 20px #a3d0b6; }
.btn-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 500; color: var(--ink-mid); background: none; border: 1.5px solid var(--border-strong); padding: 13px 24px; border-radius: 10px; cursor: pointer; text-decoration: none; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-ghost:hover { border-color: var(--ink-xlight); color: var(--ink); background: var(--surface-3); }

/* PAGE HERO */
.page-hero { padding: 120px 80px 80px; background: var(--surface); position: relative; overflow: hidden; border-bottom: 1px solid var(--border); }
.page-hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px); background-size: 60px 60px; opacity: 0.3; pointer-events: none; }
.page-hero-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; }
.page-hero h1 { font-size: clamp(2.4rem, 4vw, 3.6rem); font-weight: 800; line-height: 1.07; letter-spacing: -0.03em; color: var(--ink); margin-bottom: 20px; }
.page-hero h1 .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: var(--green); }
.page-hero-sub { font-size: 1.1rem; color: var(--ink-mid); line-height: 1.7; max-width: 560px; margin-bottom: 36px; }

/* FOOTER */
footer { background: #282c34; padding: 64px 80px 40px; }
.footer-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }
.footer-brand-desc { font-size: 0.85rem; color: rgba(255,255,255,0.5); line-height: 1.7; margin-top: 14px; }
.footer-col h4 { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(255,255,255,0.35); margin-bottom: 16px; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-col a { font-size: 0.938rem; color: rgba(255,255,255,0.55); text-decoration: none; font-weight: 400; transition: color 0.15s; }
.footer-col a:hover { color: #09a866; }
.footer-bottom { max-width: 1200px; margin: 0 auto; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 24px; display: flex; justify-content: space-between; align-items: center; }
.footer-bottom p { font-size: 0.78rem; color: rgba(255,255,255,0.3); }

/* MATERIAL ICONS */
.material-symbols-outlined { font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24; font-size: 18px; line-height: 1; display: inline-flex; align-items: center; vertical-align: middle; user-select: none; }

/* AOS */
.aos { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s ease; }
.aos.visible { opacity: 1; transform: none; }
.aos-delay-1 { transition-delay: 0.1s; }
.aos-delay-2 { transition-delay: 0.2s; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 768px) {
  nav { padding: 0 20px; height: 56px; }
  .nav-links { display: none; }
  .nav-actions .btn-nav-ghost, .nav-actions .btn-nav-primary { display: none; }
  .hamburger { display: flex; }
  .page-hero { padding: 90px 20px 60px; }
  footer { padding: 48px 20px 32px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
}
@media (max-width: 480px) {
  h2.section-h { font-size: 1.6rem; }
}


.why-hero { max-width: 640px; }
.before-after { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 1200px; margin: 64px auto; }
.ba-card { border-radius: 16px; padding: 36px; }
.ba-card.before { background: var(--surface-2); border: 1px solid var(--border); }
.ba-card.after { background: #078037; }
.ba-label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 20px; }
.ba-card.before .ba-label { color: #ef4444; }
.ba-card.after .ba-label { color: rgba(255,255,255,0.6); }
.ba-list { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.ba-list li { display: flex; align-items: flex-start; gap: 10px; font-size: 1.0rem; line-height: 1.55; }
.ba-card.before .ba-list li { color: var(--ink-mid); }
.ba-card.after .ba-list li { color: rgba(255,255,255,0.85); }
.ba-dot-red { width: 8px; height: 8px; border-radius: 50%; background: #ef4444; flex-shrink: 0; margin-top: 5px; }
.ba-dot-green { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.6); flex-shrink: 0; margin-top: 5px; }

.story-section { padding: 80px; background: var(--surface); }
.story-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.story-quote { font-family: "Fraunces", serif; font-size: clamp(1.2rem, 2vw, 1.6rem); font-style: italic; color: var(--ink); line-height: 1.55; margin-bottom: 28px; font-weight: 400; letter-spacing: -0.01em; }
.story-quote em { color: var(--green); font-style: normal; font-weight: 600; }
.story-stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.story-stat { background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 18px; }
.story-stat-num { font-size: 1.5rem; font-weight: 800; color: var(--green); letter-spacing: -0.03em; line-height: 1; margin-bottom: 4px; }
.story-stat-lbl { font-size: 0.72rem; color: var(--ink-light); font-weight: 500; line-height: 1.4; }
.story-cards { display: flex; flex-direction: column; gap: 16px; }
.story-card { background: var(--surface-2); border: 1px solid var(--border); border-radius: 14px; padding: 24px; transition: all 0.2s; }
.story-card:hover { border-color: var(--green-mid); box-shadow: var(--shadow-sm); }
.story-card-title { font-size: 1.0rem; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 6px; }
.story-card-desc { font-size: 0.85rem; color: var(--ink-mid); line-height: 1.6; }

.results-section { padding: 80px; background: var(--surface-2); border-top: 1px solid var(--border); }
.results-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.result-card { background: white; border: 1px solid var(--border); border-radius: 16px; padding: 32px; text-align: center; }
.result-num { font-size: 2.8rem; font-weight: 800; color: var(--green); letter-spacing: -0.04em; line-height: 1; margin-bottom: 6px; }
.result-label { font-size: 0.938rem; font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.result-desc { font-size: 0.8rem; color: var(--ink-light); line-height: 1.55; }

.testimonials-section { padding: 80px; background: #282c34; }
.testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.tcard { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 14px; padding: 28px; }
.tcard-quote { font-size: 1.0rem; color: rgba(255,255,255,0.7); line-height: 1.65; margin-bottom: 16px; font-style: italic; }
.tcard-name { font-size: 0.8rem; font-weight: 700; color: var(--green-bright); }
.tcard-role { font-size: 0.72rem; color: rgba(255,255,255,0.35); margin-top: 2px; }

.why-cta { padding: 80px; background: #078037; text-align: center; }
.why-cta h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 800; color: white; letter-spacing: -0.025em; margin-bottom: 16px; }
.why-cta p { color: rgba(255,255,255,0.75); font-size: 1rem; margin-bottom: 36px; max-width: 480px; margin-left: auto; margin-right: auto; }

@media (max-width: 1024px) { .story-inner { grid-template-columns: 1fr; gap: 48px; } .testimonials-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) {
  .before-after { grid-template-columns: 1fr; margin: 40px 20px; }
  .story-section, .results-section, .testimonials-section, .why-cta { padding: 60px 20px; }
  .results-grid { grid-template-columns: 1fr; }
  .story-stat-grid { grid-template-columns: 1fr 1fr; }
}


/* NAV DROPDOWN */
.nav-dropdown { position:relative; }
.nav-dropdown-trigger { display:flex; align-items:center; }
.nav-dropdown-menu {
  display:none; position:absolute; top:calc(100% + 12px); left:50%;
  transform:translateX(-50%); background:white;
  border:1.5px solid var(--border); border-radius:14px;
  padding:8px; min-width:200px; z-index:200;
  box-shadow:0 8px 32px rgba(0,0,0,0.08);
}
.nav-dropdown:hover .nav-dropdown-menu { display:block; }
.dropdown-item {
  display:block; padding:9px 14px; font-size:0.85rem; font-weight:500;
  color:var(--ink-mid); text-decoration:none; border-radius:8px;
  transition:background 0.12s, color 0.12s; white-space:nowrap;
}
.dropdown-item:hover { background:var(--surface-2); color:var(--green); }
.dropdown-parent { font-weight:700; color:var(--ink); }
.dropdown-divider { height:1px; background:var(--border); margin:4px 0; }

page-hero { padding:120px 80px 80px; background:var(--surface-2); position:relative; overflow:hidden; border-bottom:1px solid var(--border); }
.page-hero::before { content:""; position:absolute; inset:0; background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px); background-size:60px 60px; opacity:0.35; pointer-events:none; }
.page-hero-inner { position:relative; z-index:2; max-width:1200px; margin:0 auto; }
.page-hero h1 { font-size:clamp(2.2rem,4vw,3.4rem); font-weight:800; line-height:1.08; letter-spacing:-0.03em; color:var(--ink); margin-bottom:20px; }
.page-hero h1 .serif { font-family:"Fraunces",serif; font-style:italic; font-weight:600; color:var(--green); }
.about-split { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.about-mission-stats { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.mission-stat { background:var(--surface-2); border:1.5px solid var(--border); border-radius:16px; padding:24px 20px; }
.mission-num { display:block; font-size:2rem; font-weight:800; color:var(--green); letter-spacing:-0.04em; line-height:1; }
.mission-lbl { display:block; font-size:0.78rem; color:var(--ink-mid); margin-top:6px; line-height:1.4; }
.values-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.value-card { background:var(--surface-2); border:1.5px solid var(--border); border-radius:16px; padding:32px 24px; }
.value-icon { width:44px; height:44px; background:var(--green-pale); border:1.5px solid var(--green-mid); border-radius:12px; display:flex; align-items:center; justify-content:center; color:var(--green); margin-bottom:16px; }
.value-card h3 { font-size:1rem; font-weight:800; color:var(--ink); margin-bottom:10px; }
.value-card p { font-size:0.85rem; color:var(--ink-mid); line-height:1.6; }
.team-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.team-card { background:var(--surface); border:1.5px solid var(--border); border-radius:16px; padding:28px 20px; text-align:center; }
.team-avatar { width:85px; height:85px; background:var(--green); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.1rem; font-weight:800; color:white; margin:0 auto 14px; letter-spacing:0.02em; }
.team-name { font-size:1.0rem; font-weight:700; color:var(--ink); margin-bottom:4px; }
.team-role { font-size:0.78rem; color:var(--ink-light); }
@media(max-width:1024px) { .values-grid { grid-template-columns:repeat(2,1fr); } .team-grid { grid-template-columns:repeat(3,1fr); } }
@media(max-width:900px) {
  .about-split { grid-template-columns:1fr; gap:48px; }
  section[style*="padding:80px 80px"] { padding:60px 24px !important; }
  section[style*="padding:80px 80px 100px"] { padding:60px 24px 80px !important; }
}
@media(max-width:600px) {
  .page-hero { padding:90px 20px 60px; }
  .values-grid { grid-template-columns:1fr; }
  .team-grid { grid-template-columns:repeat(2,1fr); }
  .about-mission-stats { grid-template-columns:1fr 1fr; }
}

/* ── INDUSTRIES DROPDOWN ─────────────────────────── */
.nav-dropdown { position: relative; }
.nav-dropdown-trigger { display: flex; align-items: center; gap: 4px; cursor: pointer; }
.nav-dropdown-trigger svg { transition: transform 0.2s ease; flex-shrink: 0; }
.nav-dropdown:hover .nav-dropdown-trigger svg,
.nav-dropdown.open .nav-dropdown-trigger svg { transform: rotate(180deg); }
.nav-dropdown-menu {
  position: absolute; top: calc(100% + 12px); left: 50%;
  transform: translateX(-50%); min-width: 210px;
  background: #fff; border: 1px solid var(--border);
  border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,0.10);
  padding: 6px; opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease;
  transform: translateX(-50%) translateY(-4px); z-index: 200;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown.open .nav-dropdown-menu {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown-menu::before {
  content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 14px;
}
.dropdown-item {
  display: block; padding: 9px 14px; font-size: 0.85rem; font-weight: 500;
  color: var(--ink-mid); text-decoration: none; border-radius: 7px;
  border-left: 3px solid transparent;
  transition: background 0.14s, border-color 0.14s, color 0.14s;
  letter-spacing: -0.01em;
}
.dropdown-item:hover { background: var(--green-pale); border-left-color: var(--green); color: var(--ink); }
.dropdown-divider { height: 1px; background: var(--border); margin: 5px 6px; }
.dropdown-parent { font-weight: 600; color: var(--ink); font-size: 0.8rem; letter-spacing: 0.03em; text-transform: uppercase; }

/* ===== Careers PAGE ===== */

/* Careers styles here */
:root {
  --green: #078037;
  --green-bright: #09a866;
  --green-pale: #edfaf3;
  --green-mid: #b8ddc8;
  --ink: #0a1a10;
  --ink-mid: #3d5c47;
  --ink-light: #7e9e89;
  --ink-xlight: #b8cec0;
  --surface: #ffffff;
  --surface-2: #f7faf8;
  --surface-3: #f0f5f2;
  --border: #e2ede7;
  --border-strong: #c8ddd1;
  --shadow-sm: 0 1px 3px #f1f5f3, 0 1px 2px #f1f5f3;
  --shadow-md: 0 4px 16px #edf2ef, 0 2px 4px #f1f5f3;
  --shadow-lg: 0 20px 60px #e5ecе8, 0 8px 16px #edf2ef;
  --shadow-xl: 0 40px 100px #e0eae6, 0 16px 32px #edf2ef;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; max-width: 100%; overflow-x: hidden; }
body {
  font-family: "Plus Jakarta Sans", sans-serif;
  background: var(--surface);
  color: var(--ink);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }

/* NAV */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  height: 64px; display: flex; align-items: center;
  padding: 0 48px; justify-content: space-between;
  transition: box-shadow 0.3s;
}
.nav-logo img { height: 30px; width: auto; }
.nav-links { display: flex; align-items: center; gap: 32px; list-style: none; }
.nav-links a { font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; letter-spacing: -0.01em; transition: color 0.15s; }
.nav-links a:hover { color: var(--ink); }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.btn-nav-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); background: none; border: none; padding: 8px 16px; border-radius: 8px; cursor: pointer; text-decoration: none; transition: all 0.15s; }
.btn-nav-ghost:hover { color: var(--ink); background: var(--surface-3); }
.btn-nav-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 600; background: var(--green); color: white; border: none; padding: 9px 20px; border-radius: 8px; cursor: pointer; text-decoration: none; display: inline-block; transition: all 0.15s; letter-spacing: -0.01em; }
.btn-nav-primary:hover { background: var(--green-bright); transform: translateY(-1px); box-shadow: 0 4px 12px #a3d0b6; }

/* HAMBURGER */
.hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; padding: 8px; }
.hamburger span { display: block; width: 22px; height: 2px; background: var(--ink); border-radius: 2px; transition: all 0.3s; transform-origin: center; }
.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; top: 64px; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--border); padding: 20px 24px 28px; z-index: 99; box-shadow: 0 8px 24px #e5ecе8; flex-direction: column; gap: 4px; }
.mobile-menu.open { display: flex; }
.mobile-menu a { font-size: 1rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; padding: 12px 0; border-bottom: 1px solid var(--border); transition: color 0.15s; }
.mobile-menu a:hover { color: var(--green); }
.mobile-menu-actions { display: flex; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--border); }
.mobile-menu-actions a { border-bottom: none; padding: 0; flex: 1; text-align: center; }

/* SHARED ELEMENTS */
.eyebrow { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.eyebrow::before { content: ""; width: 16px; height: 2px; background: var(--green-bright); border-radius: 1px; }
h2.section-h { font-size: clamp(1.9rem, 3vw, 2.8rem); font-weight: 800; letter-spacing: -0.025em; line-height: 1.1; color: var(--ink); margin-bottom: 16px; }
h2.section-h .serif { font-family: "Fraunces", serif; font-weight: 600; font-style: italic; letter-spacing: -0.02em; color: var(--green); }
.section-p { font-size: 1rem; color: var(--ink-mid); line-height: 1.7; max-width: 520px; font-weight: 400; letter-spacing: -0.01em; }
.section-wrap { max-width: 1200px; margin: 0 auto; }
.check-icon { width: 18px; height: 18px; border-radius: 50%; background: var(--green-pale); border: 1.5px solid var(--green-mid); flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.check-icon svg { width: 8px; height: 8px; }

/* BTN */
.btn-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 700; background: var(--green); color: white; border: none; padding: 14px 28px; border-radius: 10px; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-primary:hover { background: var(--green-bright); transform: translateY(-2px); box-shadow: 0 8px 20px #a3d0b6; }
.btn-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 500; color: var(--ink-mid); background: none; border: 1.5px solid var(--border-strong); padding: 13px 24px; border-radius: 10px; cursor: pointer; text-decoration: none; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-ghost:hover { border-color: var(--ink-xlight); color: var(--ink); background: var(--surface-3); }

/* PAGE HERO */
.page-hero { padding: 120px 80px 80px; background: var(--surface); position: relative; overflow: hidden; border-bottom: 1px solid var(--border); }
.page-hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px); background-size: 60px 60px; opacity: 0.3; pointer-events: none; }
.page-hero-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; }
.page-hero h1 { font-size: clamp(2.4rem, 4vw, 3.6rem); font-weight: 800; line-height: 1.07; letter-spacing: -0.03em; color: var(--ink); margin-bottom: 20px; }
.page-hero h1 .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: var(--green); }
.page-hero-sub { font-size: 1.1rem; color: var(--ink-mid); line-height: 1.7; max-width: 560px; margin-bottom: 36px; }

/* FOOTER */
footer { background: #282c34; padding: 64px 80px 40px; }
.footer-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }
.footer-brand-desc { font-size: 0.85rem; color: rgba(255,255,255,0.5); line-height: 1.7; margin-top: 14px; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-col a { font-size: 0.938rem; color: rgba(255,255,255,0.55); text-decoration: none; font-weight: 400; transition: color 0.15s; }
.footer-col a:hover { color: #09a866; }
.footer-bottom { max-width: 1200px; margin: 0 auto; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 24px; display: flex; justify-content: space-between; align-items: center; }
.footer-bottom p { font-size: 0.78rem; color: rgba(255,255,255,0.3); }

/* MATERIAL ICONS */
.material-symbols-outlined { font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24; font-size: 18px; line-height: 1; display: inline-flex; align-items: center; vertical-align: middle; user-select: none; }

/* AOS */
.aos { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s ease; }
.aos.visible { opacity: 1; transform: none; }
.aos-delay-1 { transition-delay: 0.1s; }
.aos-delay-2 { transition-delay: 0.2s; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 768px) {
  nav { padding: 0 20px; height: 56px; }
  .nav-links { display: none; }
  .nav-actions .btn-nav-ghost, .nav-actions .btn-nav-primary { display: none; }
  .hamburger { display: flex; }
  .page-hero { padding: 90px 20px 60px; }
  footer { padding: 48px 20px 32px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
}
@media (max-width: 480px) {
  h2.section-h { font-size: 1.6rem; }
}


.why-hero { max-width: 640px; }
.before-after { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 1200px; margin: 64px auto; }
.ba-card { border-radius: 16px; padding: 36px; }
.ba-card.before { background: var(--surface-2); border: 1px solid var(--border); }
.ba-card.after { background: #078037; }
.ba-label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 20px; }
.ba-card.before .ba-label { color: #ef4444; }
.ba-card.after .ba-label { color: rgba(255,255,255,0.6); }
.ba-list { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.ba-list li { display: flex; align-items: flex-start; gap: 10px; font-size: 1.0rem; line-height: 1.55; }
.ba-card.before .ba-list li { color: var(--ink-mid); }
.ba-card.after .ba-list li { color: rgba(255,255,255,0.85); }
.ba-dot-red { width: 8px; height: 8px; border-radius: 50%; background: #ef4444; flex-shrink: 0; margin-top: 5px; }
.ba-dot-green { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.6); flex-shrink: 0; margin-top: 5px; }

.story-section { padding: 80px; background: var(--surface); }
.story-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.story-quote { font-family: "Fraunces", serif; font-size: clamp(1.2rem, 2vw, 1.6rem); font-style: italic; color: var(--ink); line-height: 1.55; margin-bottom: 28px; font-weight: 400; letter-spacing: -0.01em; }
.story-quote em { color: var(--green); font-style: normal; font-weight: 600; }
.story-stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.story-stat { background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 18px; }
.story-stat-num { font-size: 1.5rem; font-weight: 800; color: var(--green); letter-spacing: -0.03em; line-height: 1; margin-bottom: 4px; }
.story-stat-lbl { font-size: 0.72rem; color: var(--ink-light); font-weight: 500; line-height: 1.4; }
.story-cards { display: flex; flex-direction: column; gap: 16px; }
.story-card { background: var(--surface-2); border: 1px solid var(--border); border-radius: 14px; padding: 24px; transition: all 0.2s; }
.story-card:hover { border-color: var(--green-mid); box-shadow: var(--shadow-sm); }
.story-card-title { font-size: 1.0rem; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 6px; }
.story-card-desc { font-size: 0.85rem; color: var(--ink-mid); line-height: 1.6; }

.results-section { padding: 80px; background: var(--surface-2); border-top: 1px solid var(--border); }
.results-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.result-card { background: white; border: 1px solid var(--border); border-radius: 16px; padding: 32px; text-align: center; }
.result-num { font-size: 2.8rem; font-weight: 800; color: var(--green); letter-spacing: -0.04em; line-height: 1; margin-bottom: 6px; }
.result-label { font-size: 0.938rem; font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.result-desc { font-size: 0.8rem; color: var(--ink-light); line-height: 1.55; }

.testimonials-section { padding: 80px; background: #282c34; }
.testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.tcard { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 14px; padding: 28px; }
.tcard-quote { font-size: 1.0rem; color: rgba(255,255,255,0.7); line-height: 1.65; margin-bottom: 16px; font-style: italic; }
.tcard-name { font-size: 0.8rem; font-weight: 700; color: var(--green-bright); }
.tcard-role { font-size: 0.72rem; color: rgba(255,255,255,0.35); margin-top: 2px; }

.why-cta { padding: 80px; background: #5c9e50; text-align: center; }
.why-cta h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 800; color: white; letter-spacing: -0.025em; margin-bottom: 16px; }
.why-cta p { color: rgba(255,255,255,0.75); font-size: 1rem; margin-bottom: 36px; max-width: 480px; margin-left: auto; margin-right: auto; }

@media (max-width: 1024px) { .story-inner { grid-template-columns: 1fr; gap: 48px; } .testimonials-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) {
  .before-after { grid-template-columns: 1fr; margin: 40px 20px; }
  .story-section, .results-section, .testimonials-section, .why-cta { padding: 60px 20px; }
  .results-grid { grid-template-columns: 1fr; }
  .story-stat-grid { grid-template-columns: 1fr 1fr; }
}


/* NAV DROPDOWN */
.nav-dropdown { position:relative; }
.nav-dropdown-trigger { display:flex; align-items:center; }
.nav-dropdown-menu {
  display:none; position:absolute; top:calc(100% + 12px); left:50%;
  transform:translateX(-50%); background:white;
  border:1.5px solid var(--border); border-radius:14px;
  padding:8px; min-width:200px; z-index:200;
  box-shadow:0 8px 32px rgba(0,0,0,0.08);
}
.nav-dropdown:hover .nav-dropdown-menu { display:block; }
.dropdown-item {
  display:block; padding:9px 14px; font-size:0.85rem; font-weight:500;
  color:var(--ink-mid); text-decoration:none; border-radius:8px;
  transition:background 0.12s, color 0.12s; white-space:nowrap;
}
.dropdown-item:hover { background:var(--surface-2); color:var(--green); }
.dropdown-parent { font-weight:700; color:var(--ink); }
.dropdown-divider { height:1px; background:var(--border); margin:4px 0; }

.page-hero { padding:120px 80px 80px; background:var(--surface-2); position:relative; overflow:hidden; border-bottom:1px solid var(--border); }
.page-hero::before { content:""; position:absolute; inset:0; background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px); background-size:60px 60px; opacity:0.35; pointer-events:none; }
.page-hero-inner { position:relative; z-index:2; max-width:1200px; margin:0 auto; }
.page-hero h1 { font-size:clamp(2.2rem,4vw,3.4rem); font-weight:800; line-height:1.08; letter-spacing:-0.03em; color:var(--ink); margin-bottom:20px; }
.page-hero h1 .serif { font-family:"Fraunces",serif; font-style:italic; font-weight:600; color:var(--green); }
.careers-why { display:grid; grid-template-columns:1fr 1.6fr; gap:80px; align-items:start; }
.why-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.why-item { display:flex; gap:14px; align-items:flex-start; }
.why-icon { width:40px; height:40px; background:var(--green-pale); border:1.5px solid var(--green-mid); border-radius:10px; display:flex; align-items:center; justify-content:center; color:var(--green); flex-shrink:0; }
.why-item strong { display:block; font-size:1.0rem; font-weight:700; color:var(--ink); margin-bottom:4px; }
.why-item p { font-size:0.82rem; color:var(--ink-mid); line-height:1.5; margin:0; }
.job-card { background:var(--surface); border:1.5px solid var(--border); border-radius:20px; padding:32px; margin-bottom:24px; }
.job-header { display:flex; justify-content:space-between; align-items:flex-start; gap:24px; margin-bottom:16px; }
.job-title { font-size:1.1rem; font-weight:800; color:var(--ink); margin-bottom:8px; }
.job-meta { display:flex; gap:12px; align-items:center; font-size:0.8rem; color:var(--ink-mid); }
.job-tag { background:var(--green-pale); color:var(--green); font-size:0.7rem; font-weight:700; padding:3px 10px; border-radius:20px; border:1px solid var(--green-mid); }
.job-desc { font-size:1.0rem; color:var(--ink-mid); line-height:1.6; margin-bottom:24px; }
.job-details { display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.job-section-label { font-size:0.72rem; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; color:var(--ink-light); margin-bottom:10px; }
.job-list { list-style:none; display:flex; flex-direction:column; gap:8px; }
.job-list li { font-size:0.85rem; color:var(--ink); padding-left:18px; position:relative; line-height:1.5; }
.job-list li::before { content:"→"; position:absolute; left:0; color:var(--green); font-size:0.75rem; }
.contact-form-wrap { background:var(--surface); border:1.5px solid var(--border); border-radius:20px; padding:40px; }
.contact-form { display:flex; flex-direction:column; gap:20px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-group { display:flex; flex-direction:column; gap:6px; }
.form-group label { font-size:0.8rem; font-weight:700; color:var(--ink-mid); }
.req { color:var(--green); }
.form-group input,.form-group select,.form-group textarea { font-family:"Plus Jakarta Sans",sans-serif; font-size:1.0rem; color:var(--ink); background:var(--surface-2); border:1.5px solid var(--border); border-radius:10px; padding:12px 14px; outline:none; width:100%; transition:border-color 0.15s, box-shadow 0.15s; }
.form-group input:focus,.form-group select:focus,.form-group textarea:focus { border-color:var(--green); box-shadow:0 0 0 3px rgba(7,137,85,0.1); }
.form-group textarea { resize:vertical; min-height:120px; }
@media(max-width:900px) {
  .careers-why { grid-template-columns:1fr; gap:48px; }
  section[style*="padding:80px 80px"] { padding:60px 24px !important; }
  section[style*="padding:0 80px"] { padding:0 24px 80px !important; }
  section[style*="padding:80px 80px 100px"] { padding:60px 24px 80px !important; }
  .job-header { flex-direction:column; }
  .job-header .btn-primary { align-self:flex-start; }
}
@media(max-width:600px) {
  .page-hero { padding:90px 20px 60px; }
  .why-grid { grid-template-columns:1fr; }
  .form-row { grid-template-columns:1fr; }
  .job-details { grid-template-columns:1fr; gap:20px; }
  .contact-form-wrap { padding:24px 20px; }
}

/* ── INDUSTRIES DROPDOWN ─────────────────────────── */
.nav-dropdown { position: relative; }
.nav-dropdown-trigger { display: flex; align-items: center; gap: 4px; cursor: pointer; }
.nav-dropdown-trigger svg { transition: transform 0.2s ease; flex-shrink: 0; }
.nav-dropdown:hover .nav-dropdown-trigger svg,
.nav-dropdown.open .nav-dropdown-trigger svg { transform: rotate(180deg); }
.nav-dropdown-menu {
  position: absolute; top: calc(100% + 12px); left: 50%;
  transform: translateX(-50%); min-width: 210px;
  background: #fff; border: 1px solid var(--border);
  border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,0.10);
  padding: 6px; opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease;
  transform: translateX(-50%) translateY(-4px); z-index: 200;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown.open .nav-dropdown-menu {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown-menu::before {
  content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 14px;
}
.dropdown-item {
  display: block; padding: 9px 14px; font-size: 0.85rem; font-weight: 500;
  color: var(--ink-mid); text-decoration: none; border-radius: 7px;
  border-left: 3px solid transparent;
  transition: background 0.14s, border-color 0.14s, color 0.14s;
  letter-spacing: -0.01em;
}
.dropdown-item:hover { background: var(--green-pale); border-left-color: var(--green); color: var(--ink); }
.dropdown-divider { height: 1px; background: var(--border); margin: 5px 6px; }
.dropdown-parent { font-weight: 600; color: var(--ink); font-size: 0.8rem; letter-spacing: 0.03em; text-transform: uppercase; }

/* ===== features PAGE ===== */

:root {
  --green: #078037;
  --green-bright: #09a866;
  --green-pale: #edfaf3;
  --green-mid: #b8ddc8;
  --ink: #0a1a10;
  --ink-mid: #3d5c47;
  --ink-light: #7e9e89;
  --ink-xlight: #b8cec0;
  --surface: #ffffff;
  --surface-2: #f7faf8;
  --surface-3: #f0f5f2;
  --border: #e2ede7;
  --border-strong: #c8ddd1;
  --shadow-sm: 0 1px 3px #f1f5f3, 0 1px 2px #f1f5f3;
  --shadow-md: 0 4px 16px #edf2ef, 0 2px 4px #f1f5f3;
  --shadow-lg: 0 20px 60px #e5ecе8, 0 8px 16px #edf2ef;
  --shadow-xl: 0 40px 100px #e0eae6, 0 16px 32px #edf2ef;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; max-width: 100%; overflow-x: hidden; }
body {
  font-family: "Plus Jakarta Sans", sans-serif;
  background: var(--surface);
  color: var(--ink);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }

/* NAV */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  height: 64px; display: flex; align-items: center;
  padding: 0 48px; justify-content: space-between;
  transition: box-shadow 0.3s;
}
.nav-logo img { height: 30px; width: auto; }
.nav-links { display: flex; align-items: center; gap: 32px; list-style: none; }
.nav-links a { font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; letter-spacing: -0.01em; transition: color 0.15s; }
.nav-links a:hover { color: var(--ink); }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.btn-nav-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); background: none; border: none; padding: 8px 16px; border-radius: 8px; cursor: pointer; text-decoration: none; transition: all 0.15s; }
.btn-nav-ghost:hover { color: var(--ink); background: var(--surface-3); }
.btn-nav-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 600; background: var(--green); color: white; border: none; padding: 9px 20px; border-radius: 8px; cursor: pointer; text-decoration: none; display: inline-block; transition: all 0.15s; letter-spacing: -0.01em; }
.btn-nav-primary:hover { background: var(--green-bright); transform: translateY(-1px); box-shadow: 0 4px 12px #a3d0b6; }

/* HAMBURGER */
.hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; padding: 8px; }
.hamburger span { display: block; width: 22px; height: 2px; background: var(--ink); border-radius: 2px; transition: all 0.3s; transform-origin: center; }
.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; top: 64px; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--border); padding: 20px 24px 28px; z-index: 99; box-shadow: 0 8px 24px #e5ecе8; flex-direction: column; gap: 4px; }
.mobile-menu.open { display: flex; }
.mobile-menu a { font-size: 1rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; padding: 12px 0; border-bottom: 1px solid var(--border); transition: color 0.15s; }
.mobile-menu a:hover { color: var(--green); }
.mobile-menu-actions { display: flex; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--border); }
.mobile-menu-actions a { border-bottom: none; padding: 0; flex: 1; text-align: center; }

/* SHARED ELEMENTS */
.eyebrow { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.eyebrow::before { content: ""; width: 16px; height: 2px; background: var(--green-bright); border-radius: 1px; }
h2.section-h { font-size: clamp(1.9rem, 3vw, 2.8rem); font-weight: 800; letter-spacing: -0.025em; line-height: 1.1; color: var(--ink); margin-bottom: 16px; }
h2.section-h .serif { font-family: "Fraunces", serif; font-weight: 600; font-style: italic; letter-spacing: -0.02em; color: var(--green); }
.section-p { font-size: 1rem; color: var(--ink-mid); line-height: 1.7; max-width: 520px; font-weight: 400; letter-spacing: -0.01em; }
.section-wrap { max-width: 1200px; margin: 0 auto; }
.check-icon { width: 18px; height: 18px; border-radius: 50%; background: var(--green-pale); border: 1.5px solid var(--green-mid); flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.check-icon svg { width: 8px; height: 8px; }

/* BTN */
.btn-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 700; background: var(--green); color: white; border: none; padding: 14px 28px; border-radius: 10px; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-primary:hover { background: var(--green-bright); transform: translateY(-2px); box-shadow: 0 8px 20px #a3d0b6; }
.btn-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 500; color: var(--ink-mid); background: none; border: 1.5px solid var(--border-strong); padding: 13px 24px; border-radius: 10px; cursor: pointer; text-decoration: none; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-ghost:hover { border-color: var(--ink-xlight); color: var(--ink); background: var(--surface-3); }

/* PAGE HERO */
.page-hero { padding: 120px 80px 80px; background: var(--surface); position: relative; overflow: hidden; border-bottom: 1px solid var(--border); }
.page-hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px); background-size: 60px 60px; opacity: 0.3; pointer-events: none; }
.page-hero-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; }
.page-hero h1 { font-size: clamp(2.4rem, 4vw, 3.6rem); font-weight: 800; line-height: 1.07; letter-spacing: -0.03em; color: var(--ink); margin-bottom: 20px; }
.page-hero h1 .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: var(--green); }
.page-hero-sub { font-size: 1.1rem; color: var(--ink-mid); line-height: 1.7; max-width: 560px; margin-bottom: 36px; }

/* FOOTER */
footer { background: #282c34; padding: 64px 80px 40px; }
.footer-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }
.footer-brand-desc { font-size: 0.85rem; color: rgba(255,255,255,0.5); line-height: 1.7; margin-top: 14px; }
.footer-col h4 { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(255,255,255,0.35); margin-bottom: 16px; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-col a { font-size: 0.938rem; color: rgba(255,255,255,0.55); text-decoration: none; font-weight: 400; transition: color 0.15s; }
.footer-col a:hover { color: #09a866; }
.footer-bottom { max-width: 1200px; margin: 0 auto; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 24px; display: flex; justify-content: space-between; align-items: center; }
.footer-bottom p { font-size: 0.78rem; color: rgba(255,255,255,0.3); }

/* MATERIAL ICONS */
.material-symbols-outlined { font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24; font-size: 18px; line-height: 1; display: inline-flex; align-items: center; vertical-align: middle; user-select: none; }

/* AOS */
.aos { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s ease; }
.aos.visible { opacity: 1; transform: none; }
.aos-delay-1 { transition-delay: 0.1s; }
.aos-delay-2 { transition-delay: 0.2s; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 768px) {
  nav { padding: 0 20px; height: 56px; }
  .nav-links { display: none; }
  .nav-actions .btn-nav-ghost, .nav-actions .btn-nav-primary { display: none; }
  .hamburger { display: flex; }
  .page-hero { padding: 90px 20px 60px; }
  footer { padding: 48px 20px 32px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
}
@media (max-width: 480px) {
  h2.section-h { font-size: 1.6rem; }
}


.features-hero { max-width: 680px; }

/* Platform tabs */
.platform-tabs {
  display: flex;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  width: fit-content;
  margin: 0 auto 80px;
}
.ptab {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 1.0rem; font-weight: 600;
  padding: 12px 28px; border: none; background: var(--surface-2);
  color: var(--ink-mid); cursor: pointer; transition: all 0.2s;
  letter-spacing: -0.01em;
}
.ptab:first-child { border-right: 1px solid var(--border); }
.ptab.active { background: var(--green); color: white; }

/* Feature block */
.feature-block {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 80px; align-items: center;
  padding: 80px 0; border-top: 1px solid var(--border);
  max-width: 1200px; margin: 0 auto;
}
.feature-block.flip { direction: rtl; }
.feature-block.flip > * { direction: ltr; }
.feature-tag { display: inline-block; font-size: 0.68rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--green); background: var(--green-pale); border: 1px solid var(--green-mid); padding: 4px 10px; border-radius: 6px; margin-bottom: 16px; }
.feature-h { font-size: clamp(1.4rem, 2.2vw, 1.9rem); font-weight: 800; letter-spacing: -0.025em; color: var(--ink); line-height: 1.15; margin-bottom: 14px; }
.feature-p { font-size: 1.0rem; color: var(--ink-mid); line-height: 1.7; margin-bottom: 24px; }
.feature-list { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.feature-list li { display: flex; align-items: center; gap: 10px; font-size: 0.938rem; color: var(--ink-mid); font-weight: 500; }

.feature-visual { background: var(--surface-2); border: 1px solid var(--border); border-radius: 16px; padding: 32px; display: flex; align-items: center; justify-content: center; min-height: 320px; position: relative; overflow: hidden; }
.feature-visual::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 60% 40%, #edfaf3 0%, transparent 65%); }
.feature-visual .icon-large { font-size: 4rem; position: relative; z-index: 2; }

/* Feature grid (for small features) */
.feature-grid-section { padding: 80px; background: var(--surface-2); border-top: 1px solid var(--border); }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.fgrid-card { background: white; border: 1px solid var(--border); border-radius: 14px; padding: 28px; transition: all 0.2s; position: relative; overflow: hidden; }
.fgrid-card::after { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--border); transition: background 0.2s; }
.fgrid-card:hover { border-color: var(--green-mid); box-shadow: var(--shadow-md); transform: translateY(-2px); }
.fgrid-card:hover::after { background: var(--green); }
.fgrid-icon { width: 40px; height: 40px; border-radius: 10px; background: var(--green-pale); display: flex; align-items: center; justify-content: center; margin-bottom: 14px; color: var(--green); }
.fgrid-title { font-size: 1.0rem; font-weight: 700; color: var(--ink); margin-bottom: 8px; letter-spacing: -0.02em; }
.fgrid-desc { font-size: 1.0rem; color: var(--ink-mid); line-height: 1.7; font-weight: 400;}

/* Comparison table */
.feat-table-section { padding: 80px; background: var(--surface); border-top: 1px solid var(--border); }
.feat-table { max-width: 1100px; margin: 48px auto 0; border: 1px solid var(--border); border-radius: 16px; overflow: hidden; }
.feat-table table { width: 100%; border-collapse: collapse; background: white; }
.feat-table th { padding: 18px 24px; text-align: left; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-light); background: var(--surface-2); border-bottom: 1px solid var(--border); }
.feat-table th:not(:first-child) { text-align: center; }
.feat-table td { padding: 14px 24px; font-size: 0.938rem; color: var(--ink-mid); border-bottom: 1px solid var(--border); font-weight: 400;}
.feat-table td:not(:first-child) { text-align: center; }
.feat-table tr:last-child td { border-bottom: none; }
.feat-table tr:hover td { background: var(--surface-2); }
.tick { color: var(--green); }
.dash { color: var(--ink-xlight); }

/* CTA band */
.feat-cta-band { background: #078037; padding: 80px; text-align: center; }
.feat-cta-band h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 800; color: white; letter-spacing: -0.025em; margin-bottom: 16px; }
.feat-cta-band p { color: rgba(255,255,255,0.75); font-size: 1rem; margin-bottom: 36px; }
.feat-cta-band .btn-white { background: white; color: var(--green); font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 700; padding: 14px 28px; border-radius: 10px; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: all 0.2s; }
.feat-cta-band .btn-white:hover { background: rgba(255,255,255,0.9); transform: translateY(-2px); }

@media (max-width: 1024px) { .feature-block, .feature-block.flip { grid-template-columns: 1fr; direction: ltr; gap: 40px; } }
@media (max-width: 900px) { .feature-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 768px) {
  .feature-grid-section, .feat-table-section, .feat-cta-band { padding: 60px 20px; }
  .feature-grid { grid-template-columns: 1fr; }
  .feature-block { padding: 60px 20px; }
  .platform-tabs { width: 100%; }
  .ptab { flex: 1; }
}


/* NAV DROPDOWN */
.nav-dropdown { position:relative; }
.nav-dropdown-trigger { display:flex; align-items:center; }
.nav-dropdown-menu {
  display:none; position:absolute; top:calc(100% + 12px); left:50%;
  transform:translateX(-50%); background:white;
  border:1.5px solid var(--border); border-radius:14px;
  padding:8px; min-width:200px; z-index:200;
  box-shadow:0 8px 32px rgba(0,0,0,0.08);
}
.nav-dropdown:hover .nav-dropdown-menu { display:block; }
.dropdown-item {
  display:block; padding:9px 14px; font-size:0.85rem; font-weight:500;
  color:var(--ink-mid); text-decoration:none; border-radius:8px;
  transition:background 0.12s, color 0.12s; white-space:nowrap;
}
.dropdown-item:hover { background:var(--surface-2); color:var(--green); }
.dropdown-parent { font-weight:700; color:var(--ink); }
.dropdown-divider { height:1px; background:var(--border); margin:4px 0; }


/* ── INDUSTRIES DROPDOWN ─────────────────────────── */
.nav-dropdown { position: relative; }
.nav-dropdown-trigger { display: flex; align-items: center; gap: 4px; cursor: pointer; }
.nav-dropdown-trigger svg { transition: transform 0.2s ease; flex-shrink: 0; }
.nav-dropdown:hover .nav-dropdown-trigger svg,
.nav-dropdown.open .nav-dropdown-trigger svg { transform: rotate(180deg); }
.nav-dropdown-menu {
  position: absolute; top: calc(100% + 12px); left: 50%;
  transform: translateX(-50%); min-width: 210px;
  background: #fff; border: 1px solid var(--border);
  border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,0.10);
  padding: 6px; opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease;
  transform: translateX(-50%) translateY(-4px); z-index: 200;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown.open .nav-dropdown-menu {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown-menu::before {
  content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 14px;
}
.dropdown-item {
  display: block; padding: 9px 14px; font-size: 0.85rem; font-weight: 500;
  color: var(--ink-mid); text-decoration: none; border-radius: 7px;
  border-left: 3px solid transparent;
  transition: background 0.14s, border-color 0.14s, color 0.14s;
  letter-spacing: -0.01em;
}
.dropdown-item:hover { background: var(--green-pale); border-left-color: var(--green); color: var(--ink); }
.dropdown-divider { height: 1px; background: var(--border); margin: 5px 6px; }
.dropdown-parent { font-weight: 600; color: var(--ink); font-size: 0.8rem; letter-spacing: 0.03em; text-transform: uppercase; }

.feature-grid{
  display:grid;
  grid-template-columns: 1.1fr 1fr;
  gap:60px;
  align-items:center;
}

.feature-media{
  width:100%;
}

.feature-media img,
.feature-media div{
  width:100%;
}

/* Mobile fix */
@media (max-width: 900px){
  .feature-grid{
    grid-template-columns:1fr;
    gap:40px;
  }
}

/* Filed Team Mobil */
:root {
  --green: #078037;
  --green-bright: #09a866;
  --green-pale: #edfaf3;
  --green-mid: #b8ddc8;
  --ink: #0a1a10;
  --ink-mid: #3d5c47;
  --ink-light: #7e9e89;
  --ink-xlight: #b8cec0;
  --surface: #ffffff;
  --surface-2: #f7faf8;
  --surface-3: #f0f5f2;
  --border: #e2ede7;
  --border-strong: #c8ddd1;
  --shadow-sm: 0 1px 3px #f1f5f3, 0 1px 2px #f1f5f3;
  --shadow-md: 0 4px 16px #edf2ef, 0 2px 4px #f1f5f3;
  --shadow-lg: 0 20px 60px #e5ecе8, 0 8px 16px #edf2ef;
  --shadow-xl: 0 40px 100px #e0eae6, 0 16px 32px #edf2ef;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; max-width: 100%; overflow-x: hidden; }
body {
  font-family: "Plus Jakarta Sans", sans-serif;
  background: var(--surface);
  color: var(--ink);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }

/* NAV */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  height: 64px; display: flex; align-items: center;
  padding: 0 48px; justify-content: space-between;
  transition: box-shadow 0.3s;
}
.nav-logo img { height: 30px; width: auto; }
.nav-links { display: flex; align-items: center; gap: 32px; list-style: none; }
.nav-links a { font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; letter-spacing: -0.01em; transition: color 0.15s; }
.nav-links a:hover { color: var(--ink); }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.btn-nav-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); background: none; border: none; padding: 8px 16px; border-radius: 8px; cursor: pointer; text-decoration: none; transition: all 0.15s; }
.btn-nav-ghost:hover { color: var(--ink); background: var(--surface-3); }
.btn-nav-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 600; background: var(--green); color: white; border: none; padding: 9px 20px; border-radius: 8px; cursor: pointer; text-decoration: none; display: inline-block; transition: all 0.15s; letter-spacing: -0.01em; }
.btn-nav-primary:hover { background: var(--green-bright); transform: translateY(-1px); box-shadow: 0 4px 12px #a3d0b6; }

/* HAMBURGER */
.hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; padding: 8px; }
.hamburger span { display: block; width: 22px; height: 2px; background: var(--ink); border-radius: 2px; transition: all 0.3s; transform-origin: center; }
.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; top: 64px; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--border); padding: 20px 24px 28px; z-index: 99; box-shadow: 0 8px 24px #e5ecе8; flex-direction: column; gap: 4px; }
.mobile-menu.open { display: flex; }
.mobile-menu a { font-size: 1rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; padding: 12px 0; border-bottom: 1px solid var(--border); transition: color 0.15s; }
.mobile-menu a:hover { color: var(--green); }
.mobile-menu-actions { display: flex; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--border); }
.mobile-menu-actions a { border-bottom: none; padding: 0; flex: 1; text-align: center; }

/* SHARED ELEMENTS */
.eyebrow { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.eyebrow::before { content: ""; width: 16px; height: 2px; background: var(--green-bright); border-radius: 1px; }
h2.section-h { font-size: clamp(1.9rem, 3vw, 2.8rem); font-weight: 800; letter-spacing: -0.025em; line-height: 1.1; color: var(--ink); margin-bottom: 16px; }
h2.section-h .serif { font-family: "Fraunces", serif; font-weight: 600; font-style: italic; letter-spacing: -0.02em; color: var(--green); }
.section-p { font-size: 1rem; color: var(--ink-mid); line-height: 1.7; max-width: 520px; font-weight: 400; letter-spacing: -0.01em; }
.section-wrap { max-width: 1200px; margin: 0 auto; }
.check-icon { width: 18px; height: 18px; border-radius: 50%; background: var(--green-pale); border: 1.5px solid var(--green-mid); flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.check-icon svg { width: 8px; height: 8px; }

/* BTN */
.btn-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 700; background: var(--green); color: white; border: none; padding: 14px 28px; border-radius: 10px; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-primary:hover { background: var(--green-bright); transform: translateY(-2px); box-shadow: 0 8px 20px #a3d0b6; }
.btn-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 500; color: var(--ink-mid); background: none; border: 1.5px solid var(--border-strong); padding: 13px 24px; border-radius: 10px; cursor: pointer; text-decoration: none; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-ghost:hover { border-color: var(--ink-xlight); color: var(--ink); background: var(--surface-3); }

/* PAGE HERO */
.page-hero { padding: 120px 80px 80px; background: var(--surface); position: relative; overflow: hidden; border-bottom: 1px solid var(--border); }
.page-hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px); background-size: 60px 60px; opacity: 0.3; pointer-events: none; }
.page-hero-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; }
.page-hero h1 { font-size: clamp(2.4rem, 4vw, 3.6rem); font-weight: 800; line-height: 1.07; letter-spacing: -0.03em; color: var(--ink); margin-bottom: 20px; }
.page-hero h1 .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: var(--green); }
.page-hero-sub { font-size: 1.1rem; color: var(--ink-mid); line-height: 1.7; max-width: 560px; margin-bottom: 36px; }

/* FOOTER */
footer { background: #282c34; padding: 64px 80px 40px; }
.footer-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }
.footer-brand-desc { font-size: 0.85rem; color: rgba(255,255,255,0.5); line-height: 1.7; margin-top: 14px; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-col a { font-size: 0.938rem; color: rgba(255,255,255,0.55); text-decoration: none; font-weight: 400; transition: color 0.15s; }
.footer-col a:hover { color: #09a866; }
.footer-bottom { max-width: 1200px; margin: 0 auto; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 24px; display: flex; justify-content: space-between; align-items: center; }
.footer-bottom p { font-size: 0.78rem; color: rgba(255,255,255,0.3); }

/* MATERIAL ICONS */
.material-symbols-outlined { font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24; font-size: 18px; line-height: 1; display: inline-flex; align-items: center; vertical-align: middle; user-select: none; }

/* AOS */
.aos { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s ease; }
.aos.visible { opacity: 1; transform: none; }
.aos-delay-1 { transition-delay: 0.1s; }
.aos-delay-2 { transition-delay: 0.2s; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 768px) {
  nav { padding: 0 20px; height: 56px; }
  .nav-links { display: none; }
  .nav-actions .btn-nav-ghost, .nav-actions .btn-nav-primary { display: none; }
  .hamburger { display: flex; }
  .page-hero { padding: 90px 20px 60px; }
  footer { padding: 48px 20px 32px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
}
@media (max-width: 480px) {
  h2.section-h { font-size: 1.6rem; }
}


.why-hero { max-width: 640px; }
.before-after { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 1200px; margin: 64px auto; }
.ba-card { border-radius: 16px; padding: 36px; }
.ba-card.before { background: var(--surface-2); border: 1px solid var(--border); }
.ba-card.after { background: #078037; }
.ba-label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 20px; }
.ba-card.before .ba-label { color: #ef4444; }
.ba-card.after .ba-label { color: rgba(255,255,255,0.6); }
.ba-list { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.ba-list li { display: flex; align-items: flex-start; gap: 10px; font-size: 1.0rem; line-height: 1.55; }
.ba-card.before .ba-list li { color: var(--ink-mid); }
.ba-card.after .ba-list li { color: rgba(255,255,255,0.85); }
.ba-dot-red { width: 8px; height: 8px; border-radius: 50%; background: #ef4444; flex-shrink: 0; margin-top: 5px; }
.ba-dot-green { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.6); flex-shrink: 0; margin-top: 5px; }

.story-section { padding: 80px; background: var(--surface); }
.story-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.story-quote { font-family: "Fraunces", serif; font-size: clamp(1.2rem, 2vw, 1.6rem); font-style: italic; color: var(--ink); line-height: 1.55; margin-bottom: 28px; font-weight: 400; letter-spacing: -0.01em; }
.story-quote em { color: var(--green); font-style: normal; font-weight: 600; }
.story-stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.story-stat { background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 18px; }
.story-stat-num { font-size: 1.5rem; font-weight: 800; color: var(--green); letter-spacing: -0.03em; line-height: 1; margin-bottom: 4px; }
.story-stat-lbl { font-size: 0.72rem; color: var(--ink-light); font-weight: 500; line-height: 1.4; }
.story-cards { display: flex; flex-direction: column; gap: 16px; }
.story-card { background: var(--surface-2); border: 1px solid var(--border); border-radius: 14px; padding: 24px; transition: all 0.2s; }
.story-card:hover { border-color: var(--green-mid); box-shadow: var(--shadow-sm); }
.story-card-title { font-size: 1.0rem; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 6px; }
.story-card-desc { font-size: 0.85rem; color: var(--ink-mid); line-height: 1.6; }

.results-section { padding: 80px; background: var(--surface-2); border-top: 1px solid var(--border); }
.results-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.result-card { background: white; border: 1px solid var(--border); border-radius: 16px; padding: 32px; text-align: center; }
.result-num { font-size: 2.8rem; font-weight: 800; color: var(--green); letter-spacing: -0.04em; line-height: 1; margin-bottom: 6px; }
.result-label { font-size: 0.938rem; font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.result-desc { font-size: 0.8rem; color: var(--ink-light); line-height: 1.55; }

.testimonials-section { padding: 80px; background: #282c34; }
.testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.tcard { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 14px; padding: 28px; }
.tcard-quote { font-size: 1.0rem; color: rgba(255,255,255,0.7); line-height: 1.65; margin-bottom: 16px; font-style: italic; }
.tcard-name { font-size: 0.8rem; font-weight: 700; color: var(--green-bright); }
.tcard-role { font-size: 0.72rem; color: rgba(255,255,255,0.35); margin-top: 2px; }

.why-cta { padding: 80px; background: #5c9e50; text-align: center; }
.why-cta h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 800; color: white; letter-spacing: -0.025em; margin-bottom: 16px; }
.why-cta p { color: rgba(255,255,255,0.75); font-size: 1rem; margin-bottom: 36px; max-width: 480px; margin-left: auto; margin-right: auto; }

@media (max-width: 1024px) { .story-inner { grid-template-columns: 1fr; gap: 48px; } .testimonials-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) {
  .before-after { grid-template-columns: 1fr; margin: 40px 20px; }
  .story-section, .results-section, .testimonials-section, .why-cta { padding: 60px 20px; }
  .results-grid { grid-template-columns: 1fr; }
  .story-stat-grid { grid-template-columns: 1fr 1fr; }
}


/* NAV DROPDOWN */
.nav-dropdown { position:relative; }
.nav-dropdown-trigger { display:flex; align-items:center; }
.nav-dropdown-menu {
  display:none; position:absolute; top:calc(100% + 12px); left:50%;
  transform:translateX(-50%); background:white;
  border:1.5px solid var(--border); border-radius:14px;
  padding:8px; min-width:200px; z-index:200;
  box-shadow:0 8px 32px rgba(0,0,0,0.08);
}
.nav-dropdown:hover .nav-dropdown-menu { display:block; }
.dropdown-item {
  display:block; padding:9px 14px; font-size:0.85rem; font-weight:500;
  color:var(--ink-mid); text-decoration:none; border-radius:8px;
  transition:background 0.12s, color 0.12s; white-space:nowrap;
}
.dropdown-item:hover { background:var(--surface-2); color:var(--green); }
.dropdown-parent { font-weight:700; color:var(--ink); }
.dropdown-divider { height:1px; background:var(--border); margin:4px 0; }

.page-hero { padding:120px 80px 80px; background:var(--surface-2); position:relative; overflow:hidden; border-bottom:1px solid var(--border); }
.page-hero::before { content:""; position:absolute; inset:0; background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px); background-size:60px 60px; opacity:0.35; pointer-events:none; }
.page-hero-inner { position:relative; z-index:2; max-width:1200px; margin:0 auto; }
.page-hero h1 { font-size:clamp(2.2rem,4vw,3.4rem); font-weight:800; line-height:1.08; letter-spacing:-0.03em; color:var(--ink); margin-bottom:20px; }
.page-hero h1 .serif { font-family:"Fraunces",serif; font-style:italic; font-weight:600; color:var(--green); }
.feat-section { padding:80px 80px; }
.feat-section.alt { background:var(--surface-2); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.feat-split { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.feat-split.reverse { direction:rtl; }
.feat-split.reverse > * { direction:ltr; }
.feat-split-text h3 { font-size:clamp(1.4rem,2.5vw,2rem); font-weight:800; letter-spacing:-0.025em; color:var(--ink); margin-bottom:16px; line-height:1.2; }
.feat-split-text h3 .serif { font-family:"Fraunces",serif; font-style:italic; font-weight:600; color:var(--green); }
.feat-split-text p { font-size:1.0rem; color:var(--ink-mid); line-height:1.7; margin-bottom:20px; }
.feat-list { list-style:none; display:flex; flex-direction:column; gap:10px; }
.feat-list li { display:flex; gap:10px; align-items:flex-start; font-size:0.88rem; color:var(--ink); line-height:1.5; }
.feat-mock { background:var(--surface-3); border:1.5px solid var(--border); border-radius:20px; padding:32px 24px; min-height:280px; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
.feat-mock::before { content:""; position:absolute; inset:0; /*background:linear-gradient(135deg, var(--green-pale) 0%, transparent 60%);*/ }
.feat-mock-inner { position:relative; z-index:2; text-align:center; }
.feat-mock-icon { width:64px; height:64px; background:var(--green); border-radius:16px; display:flex; align-items:center; justify-content:center; margin:0 auto 16px; color:white; }
.feat-mock-label { font-size:0.85rem; font-weight:600; color:var(--ink-mid); }
.cta-band { background:var(--green); padding:80px; text-align:center; }
.cta-band h2 { font-size:clamp(1.8rem,3vw,2.4rem); font-weight:800; color:white; letter-spacing:-0.025em; margin-bottom:12px; }
.cta-band h2 .serif { font-family:"Fraunces",serif; font-style:italic; font-weight:600; }
.cta-band p { color:rgba(255,255,255,0.8); font-size:1rem; margin-bottom:32px; }
.btn-white { font-family:"Plus Jakarta Sans",sans-serif; font-size:1.0rem; font-weight:700; background:white; color:var(--green); border:none; padding:14px 28px; border-radius:10px; cursor:pointer; text-decoration:none; display:inline-block; transition:all 0.15s; letter-spacing:-0.01em; }
.btn-white:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,0.15); }
@media(max-width:900px) {
  .feat-section { padding:60px 24px !important; }
  .feat-split { grid-template-columns:1fr; gap:40px; }
  .feat-split.reverse { direction:ltr; }
  .cta-band { padding:60px 24px !important; }
}
@media(max-width:600px) {
  .page-hero { padding:90px 20px 60px; }
}

.btn-ghost { font-family:"Plus Jakarta Sans",sans-serif; font-size:1.0rem; font-weight:600; background:transparent; color:var(--ink); border:1.5px solid var(--border-strong); padding:13px 24px; border-radius:10px; cursor:pointer; text-decoration:none; display:inline-block; transition:all 0.15s; }
.btn-ghost:hover { border-color:var(--green); color:var(--green); }

/* ── INDUSTRIES DROPDOWN ─────────────────────────── */
.nav-dropdown { position: relative; }
.nav-dropdown-trigger { display: flex; align-items: center; gap: 4px; cursor: pointer; }
.nav-dropdown-trigger svg { transition: transform 0.2s ease; flex-shrink: 0; }
.nav-dropdown:hover .nav-dropdown-trigger svg,
.nav-dropdown.open .nav-dropdown-trigger svg { transform: rotate(180deg); }
.nav-dropdown-menu {
  position: absolute; top: calc(100% + 12px); left: 50%;
  transform: translateX(-50%); min-width: 210px;
  background: #fff; border: 1px solid var(--border);
  border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,0.10);
  padding: 6px; opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease;
  transform: translateX(-50%) translateY(-4px); z-index: 200;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown.open .nav-dropdown-menu {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown-menu::before {
  content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 14px;
}
.dropdown-item {
  display: block; padding: 9px 14px; font-size: 0.85rem; font-weight: 500;
  color: var(--ink-mid); text-decoration: none; border-radius: 7px;
  border-left: 3px solid transparent;
  transition: background 0.14s, border-color 0.14s, color 0.14s;
  letter-spacing: -0.01em;
}
.dropdown-item:hover { background: var(--green-pale); border-left-color: var(--green); color: var(--ink); }
.dropdown-divider { height: 1px; background: var(--border); margin: 5px 6px; }
.dropdown-parent { font-weight: 600; color: var(--ink); font-size: 0.8rem; letter-spacing: 0.03em; text-transform: uppercase; }

/*crm-portal page*/

:root {
  --green: #078037;
  --green-bright: #09a866;
  --green-pale: #edfaf3;
  --green-mid: #b8ddc8;
  --ink: #0a1a10;
  --ink-mid: #3d5c47;
  --ink-light: #7e9e89;
  --ink-xlight: #b8cec0;
  --surface: #ffffff;
  --surface-2: #f7faf8;
  --surface-3: #f0f5f2;
  --border: #e2ede7;
  --border-strong: #c8ddd1;
  --shadow-sm: 0 1px 3px #f1f5f3, 0 1px 2px #f1f5f3;
  --shadow-md: 0 4px 16px #edf2ef, 0 2px 4px #f1f5f3;
  --shadow-lg: 0 20px 60px #e5ecе8, 0 8px 16px #edf2ef;
  --shadow-xl: 0 40px 100px #e0eae6, 0 16px 32px #edf2ef;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; max-width: 100%; overflow-x: hidden; }
body {
  font-family: "Plus Jakarta Sans", sans-serif;
  background: var(--surface);
  color: var(--ink);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }

/* NAV */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  height: 64px; display: flex; align-items: center;
  padding: 0 48px; justify-content: space-between;
  transition: box-shadow 0.3s;
}
.nav-logo img { height: 30px; width: auto; }
.nav-links { display: flex; align-items: center; gap: 32px; list-style: none; }
.nav-links a { font-size: 0.938; font-weight: 500; color: var(--ink-mid); text-decoration: none; letter-spacing: -0.01em; transition: color 0.15s; }
.nav-links a:hover { color: var(--ink); }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.btn-nav-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); background: none; border: none; padding: 8px 16px; border-radius: 8px; cursor: pointer; text-decoration: none; transition: all 0.15s; }
.btn-nav-ghost:hover { color: var(--ink); background: var(--surface-3); }
.btn-nav-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 600; background: var(--green); color: white; border: none; padding: 9px 20px; border-radius: 8px; cursor: pointer; text-decoration: none; display: inline-block; transition: all 0.15s; letter-spacing: -0.01em; }
.btn-nav-primary:hover { background: var(--green-bright); transform: translateY(-1px); box-shadow: 0 4px 12px #a3d0b6; }

/* HAMBURGER */
.hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; padding: 8px; }
.hamburger span { display: block; width: 22px; height: 2px; background: var(--ink); border-radius: 2px; transition: all 0.3s; transform-origin: center; }
.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; top: 64px; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--border); padding: 20px 24px 28px; z-index: 99; box-shadow: 0 8px 24px #e5ecе8; flex-direction: column; gap: 4px; }
.mobile-menu.open { display: flex; }
.mobile-menu a { font-size: 1rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; padding: 12px 0; border-bottom: 1px solid var(--border); transition: color 0.15s; }
.mobile-menu a:hover { color: var(--green); }
.mobile-menu-actions { display: flex; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--border); }
.mobile-menu-actions a { border-bottom: none; padding: 0; flex: 1; text-align: center; }

/* SHARED ELEMENTS */
.eyebrow { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.eyebrow::before { content: ""; width: 16px; height: 2px; background: var(--green-bright); border-radius: 1px; }
h2.section-h { font-size: clamp(1.9rem, 3vw, 2.8rem); font-weight: 800; letter-spacing: -0.025em; line-height: 1.1; color: var(--ink); margin-bottom: 16px; }
h2.section-h .serif { font-family: "Fraunces", serif; font-weight: 600; font-style: italic; letter-spacing: -0.02em; color: var(--green); }
.section-p { font-size: 1rem; color: var(--ink-mid); line-height: 1.7; max-width: 520px; font-weight: 400; letter-spacing: -0.01em; }
.section-wrap { max-width: 1200px; margin: 0 auto; }
.check-icon { width: 18px; height: 18px; border-radius: 50%; background: var(--green-pale); border: 1.5px solid var(--green-mid); flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.check-icon svg { width: 8px; height: 8px; }

/* BTN */
.btn-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 700; background: var(--green); color: white; border: none; padding: 14px 28px; border-radius: 10px; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-primary:hover { background: var(--green-bright); transform: translateY(-2px); box-shadow: 0 8px 20px #a3d0b6; }
.btn-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 500; color: var(--ink-mid); background: none; border: 1.5px solid var(--border-strong); padding: 13px 24px; border-radius: 10px; cursor: pointer; text-decoration: none; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-ghost:hover { border-color: var(--ink-xlight); color: var(--ink); background: var(--surface-3); }

/* PAGE HERO */
.page-hero { padding: 120px 80px 80px; background: var(--surface); position: relative; overflow: hidden; border-bottom: 1px solid var(--border); }
.page-hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px); background-size: 60px 60px; opacity: 0.3; pointer-events: none; }
.page-hero-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; }
.page-hero h1 { font-size: clamp(2.4rem, 4vw, 3.6rem); font-weight: 800; line-height: 1.07; letter-spacing: -0.03em; color: var(--ink); margin-bottom: 20px; }
.page-hero h1 .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: var(--green); }
.page-hero-sub { font-size: 1.1rem; color: var(--ink-mid); line-height: 1.7; max-width: 560px; margin-bottom: 36px; }

/* FOOTER */
footer { background: #282c34; padding: 64px 80px 40px; }
.footer-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }
.footer-brand-desc { font-size: 0.85rem; color: rgba(255,255,255,0.5); line-height: 1.7; margin-top: 14px; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-col a { font-size: 0.938rem; color: rgba(255,255,255,0.55); text-decoration: none; font-weight: 400; transition: color 0.15s; }
.footer-col a:hover { color: #09a866; }
.footer-bottom { max-width: 1200px; margin: 0 auto; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 24px; display: flex; justify-content: space-between; align-items: center; }
.footer-bottom p { font-size: 0.78rem; color: rgba(255,255,255,0.3); }

/* MATERIAL ICONS */
.material-symbols-outlined { font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24; font-size: 18px; line-height: 1; display: inline-flex; align-items: center; vertical-align: middle; user-select: none; }

/* AOS */
.aos { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s ease; }
.aos.visible { opacity: 1; transform: none; }
.aos-delay-1 { transition-delay: 0.1s; }
.aos-delay-2 { transition-delay: 0.2s; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 768px) {
  nav { padding: 0 20px; height: 56px; }
  .nav-links { display: none; }
  .nav-actions .btn-nav-ghost, .nav-actions .btn-nav-primary { display: none; }
  .hamburger { display: flex; }
  .page-hero { padding: 90px 20px 60px; }
  footer { padding: 48px 20px 32px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
}
@media (max-width: 480px) {
  h2.section-h { font-size: 1.6rem; }
}


.why-hero { max-width: 640px; }
.before-after { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 1200px; margin: 64px auto; }
.ba-card { border-radius: 16px; padding: 36px; }
.ba-card.before { background: var(--surface-2); border: 1px solid var(--border); }
.ba-card.after { background: #078037; }
.ba-label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 20px; }
.ba-card.before .ba-label { color: #ef4444; }
.ba-card.after .ba-label { color: rgba(255,255,255,0.6); }
.ba-list { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.ba-list li { display: flex; align-items: flex-start; gap: 10px; font-size: 1.0rem; line-height: 1.55; }
.ba-card.before .ba-list li { color: var(--ink-mid); }
.ba-card.after .ba-list li { color: rgba(255,255,255,0.85); }
.ba-dot-red { width: 8px; height: 8px; border-radius: 50%; background: #ef4444; flex-shrink: 0; margin-top: 5px; }
.ba-dot-green { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.6); flex-shrink: 0; margin-top: 5px; }

.story-section { padding: 80px; background: var(--surface); }
.story-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.story-quote { font-family: "Fraunces", serif; font-size: clamp(1.2rem, 2vw, 1.6rem); font-style: italic; color: var(--ink); line-height: 1.55; margin-bottom: 28px; font-weight: 400; letter-spacing: -0.01em; }
.story-quote em { color: var(--green); font-style: normal; font-weight: 600; }
.story-stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.story-stat { background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 18px; }
.story-stat-num { font-size: 1.5rem; font-weight: 800; color: var(--green); letter-spacing: -0.03em; line-height: 1; margin-bottom: 4px; }
.story-stat-lbl { font-size: 0.72rem; color: var(--ink-light); font-weight: 500; line-height: 1.4; }
.story-cards { display: flex; flex-direction: column; gap: 16px; }
.story-card { background: var(--surface-2); border: 1px solid var(--border); border-radius: 14px; padding: 24px; transition: all 0.2s; }
.story-card:hover { border-color: var(--green-mid); box-shadow: var(--shadow-sm); }
.story-card-title { font-size: 1.0rem; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 6px; }
.story-card-desc { font-size: 0.85rem; color: var(--ink-mid); line-height: 1.6; }

.results-section { padding: 80px; background: var(--surface-2); border-top: 1px solid var(--border); }
.results-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.result-card { background: white; border: 1px solid var(--border); border-radius: 16px; padding: 32px; text-align: center; }
.result-num { font-size: 2.8rem; font-weight: 800; color: var(--green); letter-spacing: -0.04em; line-height: 1; margin-bottom: 6px; }
.result-label { font-size: 0.938rem; font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.result-desc { font-size: 0.8rem; color: var(--ink-light); line-height: 1.55; }

.testimonials-section { padding: 80px; background: #282c34; }
.testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.tcard { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 14px; padding: 28px; }
.tcard-quote { font-size: 1.0rem; color: rgba(255,255,255,0.7); line-height: 1.65; margin-bottom: 16px; font-style: italic; }
.tcard-name { font-size: 0.8rem; font-weight: 700; color: var(--green-bright); }
.tcard-role { font-size: 0.72rem; color: rgba(255,255,255,0.35); margin-top: 2px; }

.why-cta { padding: 80px; background: #5c9e50; text-align: center; }
.why-cta h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 800; color: white; letter-spacing: -0.025em; margin-bottom: 16px; }
.why-cta p { color: rgba(255,255,255,0.75); font-size: 1rem; margin-bottom: 36px; max-width: 480px; margin-left: auto; margin-right: auto; }

@media (max-width: 1024px) { .story-inner { grid-template-columns: 1fr; gap: 48px; } .testimonials-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) {
  .before-after { grid-template-columns: 1fr; margin: 40px 20px; }
  .story-section, .results-section, .testimonials-section, .why-cta { padding: 60px 20px; }
  .results-grid { grid-template-columns: 1fr; }
  .story-stat-grid { grid-template-columns: 1fr 1fr; }
}


/* NAV DROPDOWN */
.nav-dropdown { position:relative; }
.nav-dropdown-trigger { display:flex; align-items:center; }
.nav-dropdown-menu {
  display:none; position:absolute; top:calc(100% + 12px); left:50%;
  transform:translateX(-50%); background:white;
  border:1.5px solid var(--border); border-radius:14px;
  padding:8px; min-width:200px; z-index:200;
  box-shadow:0 8px 32px rgba(0,0,0,0.08);
}
.nav-dropdown:hover .nav-dropdown-menu { display:block; }
.dropdown-item {
  display:block; padding:9px 14px; font-size:0.85rem; font-weight:500;
  color:var(--ink-mid); text-decoration:none; border-radius:8px;
  transition:background 0.12s, color 0.12s; white-space:nowrap;
}
.dropdown-item:hover { background:var(--surface-2); color:var(--green); }
.dropdown-parent { font-weight:700; color:var(--ink); }
.dropdown-divider { height:1px; background:var(--border); margin:4px 0; }


/* ======================================
   FEATURE GRID WIDTH FIX (WPBAKERY)
====================================== */

/* allow custom layout containers full width */
.vc_row .section-wrap{
    max-width: 1200px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

/* prevent WPBakery from shrinking grid layouts */
.feature-grid{
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 32px;
    width: 100%;
}

/* responsive behavior (restore original) */
@media (max-width: 1024px){
    .feature-grid{
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 640px){
    .feature-grid{
        grid-template-columns: 1fr !important;
    }
}

/*Pricing Page*/

:root {
  --green:#078037; --green-bright:#09a866; --green-pale:#edfaf3;
  --green-mid:#b8ddc8; --ink:#0a1a10; --ink-mid:#3d5c47;
  --ink-light:#7e9e89; --ink-xlight:#b8cec0; --surface:#ffffff;
  --surface-2:#f7faf8; --surface-3:#f0f5f2; --border:#e2ede7;
  --border-strong:#c8ddd1;
  --shadow-sm:0 1px 3px #f1f5f3,0 1px 2px #f1f5f3;
  --shadow-md:0 4px 16px #edf2ef,0 2px 4px #f1f5f3;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;max-width:100%;overflow-x:hidden}
body{font-family:"Plus Jakarta Sans",sans-serif;background:var(--surface);color:var(--ink);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{-webkit-tap-highlight-color:transparent}
button{cursor:pointer;-webkit-tap-highlight-color:transparent}
/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(255,255,255,0.95);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border);height:64px;display:flex;align-items:center;padding:0 48px;justify-content:space-between;transition:box-shadow 0.3s}
.nav-logo img{height:30px;width:auto}
.nav-links{display:flex;align-items:center;gap:32px;list-style:none}
.nav-links a{font-size:0.938rem;font-weight:500;color:var(--ink-mid);text-decoration:none;letter-spacing:-0.01em;transition:color 0.15s}
.nav-links a:hover{color:var(--ink)}
.nav-actions{display:flex;align-items:center;gap:10px}
.btn-nav-ghost{font-family:"Plus Jakarta Sans",sans-serif;font-size:0.938rem;font-weight:500;color:var(--ink-mid);background:none;border:none;padding:8px 16px;border-radius:8px;cursor:pointer;text-decoration:none;transition:all 0.15s}
.btn-nav-ghost:hover{color:var(--ink);background:var(--surface-3)}
.btn-nav-primary{font-family:"Plus Jakarta Sans",sans-serif;font-size:0.938rem;font-weight:600;background:var(--green);color:white;border:none;padding:9px 20px;border-radius:8px;cursor:pointer;text-decoration:none;display:inline-block;transition:all 0.15s;letter-spacing:-0.01em}
.btn-nav-primary:hover{background:var(--green-bright);transform:translateY(-1px);box-shadow:0 4px 12px #a3d0b6}
.hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;padding:8px}
.hamburger span{display:block;width:22px;height:2px;background:var(--ink);border-radius:2px;transition:all 0.3s;transform-origin:center}
.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;top:64px;left:0;right:0;background:#fff;border-bottom:1px solid var(--border);padding:20px 24px 28px;z-index:99;box-shadow:0 8px 24px rgba(0,0,0,0.06);flex-direction:column;gap:4px}
.mobile-menu.open{display:flex}
.mobile-menu a{font-size:1rem;font-weight:500;color:var(--ink-mid);text-decoration:none;padding:12px 0;border-bottom:1px solid var(--border);transition:color 0.15s}
.mobile-menu a:hover{color:var(--green)}
.mobile-menu-actions{display:flex;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border)}
.mobile-menu-actions a{border-bottom:none;padding:0;flex:1;text-align:center}
/* SHARED */
.eyebrow{font-size:0.72rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--green);margin-bottom:14px;display:flex;align-items:center;gap:8px}
.eyebrow::before{content:"";width:16px;height:2px;background:var(--green-bright);border-radius:1px}
h2.section-h{font-size:clamp(1.9rem,3vw,2.8rem);font-weight:800;letter-spacing:-0.025em;line-height:1.1;color:var(--ink);margin-bottom:16px}
h2.section-h .serif{font-family:"Fraunces",serif;font-weight:600;font-style:italic;letter-spacing:-0.02em;color:var(--green)}
.section-p{font-size:1rem;color:var(--ink-mid);line-height:1.7;max-width:520px;font-weight:400}
.btn-primary{font-family:"Plus Jakarta Sans",sans-serif;font-size:1.0rem;font-weight:700;background:var(--green);color:white;border:none;padding:14px 28px;border-radius:10px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:8px;transition:all 0.2s;letter-spacing:-0.01em}
.btn-primary:hover{background:var(--green-bright);transform:translateY(-2px);box-shadow:0 8px 20px #a3d0b6}
.btn-ghost{font-family:"Plus Jakarta Sans",sans-serif;font-size:1.0rem;font-weight:500;color:var(--ink-mid);background:none;border:1.5px solid var(--border-strong);padding:13px 24px;border-radius:10px;cursor:pointer;text-decoration:none;transition:all 0.2s}
.btn-ghost:hover{border-color:var(--ink-xlight);color:var(--ink);background:var(--surface-3)}
/* AOS */
.aos{opacity:1;transform:none;transition:opacity 0.6s ease,transform 0.6s ease}
/* FOOTER */
footer{background:#282c34;padding:64px 80px 40px}
.footer-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:48px;margin-bottom:48px}
.footer-brand-desc{font-size:0.85rem;color:rgba(255,255,255,0.5);line-height:1.7;margin-top:14px}
.footer-col h4{font-size:0.72rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:rgba(255,255,255,0.35);margin-bottom:16px}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.footer-col a{font-size:0.938rem;color:rgba(255,255,255,0.55);text-decoration:none;font-weight:400;transition:color 0.15s}
.footer-col a:hover{color:#09a866}
.footer-bottom{max-width:1200px;margin:0 auto;border-top:1px solid rgba(255,255,255,0.1);padding-top:24px;display:flex;justify-content:space-between;align-items:center}
.footer-bottom p{font-size:0.78rem;color:rgba(255,255,255,0.3)}
/* MATERIAL SYMBOLS */
.material-symbols-outlined{font-variation-settings:"FILL" 0,"wght" 300,"GRAD" 0,"opsz" 24;font-size:18px;line-height:1;display:inline-flex;align-items:center;vertical-align:middle;user-select:none}
/* NAV DROPDOWN */
.nav-dropdown{position:relative}
.nav-dropdown-trigger{display:flex;align-items:center;gap:4px;cursor:pointer}
.nav-dropdown-trigger svg{transition:transform 0.2s ease;flex-shrink:0}
.nav-dropdown:hover .nav-dropdown-trigger svg,.nav-dropdown.open .nav-dropdown-trigger svg{transform:rotate(180deg)}
.nav-dropdown-menu{position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%) translateY(-4px);min-width:210px;background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,0.10);padding:6px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity 0.18s ease,transform 0.18s ease;z-index:200}
.nav-dropdown:hover .nav-dropdown-menu,.nav-dropdown.open .nav-dropdown-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.nav-dropdown-menu::before{content:"";position:absolute;top:-14px;left:0;right:0;height:14px}
.dropdown-item{display:block;padding:9px 14px;font-size:0.85rem;font-weight:500;color:var(--ink-mid);text-decoration:none;border-radius:7px;border-left:3px solid transparent;transition:background 0.14s,border-color 0.14s,color 0.14s;letter-spacing:-0.01em}
.dropdown-item:hover{background:var(--green-pale);border-left-color:var(--green);color:var(--ink)}
.dropdown-divider{height:1px;background:var(--border);margin:5px 6px}
.dropdown-parent{font-weight:600;color:var(--ink);font-size:0.8rem;letter-spacing:0.03em;text-transform:uppercase}
/* PLAN CARDS */
.plans-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1100px;margin:0 auto 24px}
.plan-card{background:var(--surface);border:1.5px solid var(--border);border-radius:20px;padding:32px 28px;position:relative;transition:all 0.2s}
.plan-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}
.plan-card.featured{border-color:var(--green);box-shadow:0 8px 32px #bedfca}
.featured-badge{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:var(--green);color:white;font-size:0.7rem;font-weight:700;padding:4px 16px;border-radius:100px;white-space:nowrap}
.plan-name{font-family:"Fraunces",serif;font-size:1.6rem;font-weight:600;color:var(--ink);margin-bottom:4px}
.plan-price{margin-bottom:4px}
.price-amount{font-size:2.6rem;font-weight:800;color:var(--ink);letter-spacing:-0.04em;line-height:1}
.price-amount sup{font-size:1rem;font-weight:600;color:var(--ink-mid);vertical-align:top;margin-top:8px;display:inline-block}
.price-period{font-size:0.78rem;color:var(--ink-light);margin-bottom:2px}
.plan-specs{background:var(--surface-2);border-radius:10px;padding:12px 16px;margin-bottom:20px}
.plan-spec-row{display:flex;justify-content:space-between;align-items:center;font-size:0.82rem;padding:3px 0}
.plan-spec-label{color:var(--ink-mid)}
.plan-spec-value{font-weight:700;color:var(--ink)}
.plan-cta-primary{width:100%;font-family:"Plus Jakarta Sans",sans-serif;font-size:0.938rem;font-weight:700;background:var(--green);color:white;border:2px solid var(--green);padding:12px;border-radius:10px;cursor:pointer;text-decoration:none;text-align:center;display:block;transition:all 0.2s;margin-bottom:8px}
.plan-cta-primary:hover{background:var(--green-bright);border-color:var(--green-bright)}
.plan-cta-outline{width:100%;font-family:"Plus Jakarta Sans",sans-serif;font-size:0.938rem;font-weight:600;background:none;color:var(--green);border:2px solid var(--green);padding:12px;border-radius:10px;cursor:pointer;text-decoration:none;text-align:center;display:block;transition:all 0.2s;margin-bottom:24px}
.plan-cta-outline:hover{background:var(--green-pale)}
.features-list{list-style:none;display:flex;flex-direction:column;gap:8px}
.features-list li{display:flex;align-items:flex-start;gap:10px;font-size:0.82rem;color:var(--ink-mid);line-height:1.45}
.check{width:16px;height:16px;border-radius:50%;background:var(--green-pale);border:1.5px solid var(--green-mid);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.check svg{width:8px;height:8px}
.check-gold{background:#fef6e4;border-color:#f0d89a}
.feature-section-label{font-size:0.68rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--ink-light);border-top:1px solid var(--border);padding-top:12px;margin-top:4px;display:block;width:100%}
.feature-label-new{font-size:0.6rem;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:#c8932a;background:#fef6e4;border:1px solid #f0d89a;padding:1px 5px;border-radius:4px;margin-left:4px;vertical-align:middle;white-space:nowrap}
/* FEATURE TABLE */
.feat-table-section{padding:80px 80px 60px;background:var(--surface-2)}
.feat-table-wrap{max-width:1100px;margin:0 auto;border:1px solid var(--border);border-radius:16px;overflow:hidden}
.feat-table-wrap table{width:100%;border-collapse:collapse;background:white}
.feat-table-wrap th{padding:16px 20px;text-align:center;font-size:0.75rem;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;color:var(--ink-light);background:var(--surface-2);border-bottom:2px solid var(--border)}
.feat-table-wrap th:first-child{text-align:left;width:44%}
.feat-table-wrap td{padding:12px 20px;font-size:0.82rem;color:var(--ink-mid);border-bottom:1px solid var(--border);text-align:center}
.feat-table-wrap td:first-child{text-align:left;font-weight:500;color:var(--ink)}
.feat-table-wrap tr:last-child td{border-bottom:none}
.feat-table-wrap tr:hover td{background:#fafcfb}
.feat-table-wrap .tsection td{font-size:0.68rem;font-weight:800;text-transform:uppercase;letter-spacing:0.1em;color:white;background:var(--ink);padding:8px 20px}
.feat-tick{color:var(--green);font-size:1.1rem;font-weight:700}
.feat-dash{color:var(--border);font-size:1.1rem}
.feat-soon{font-size:0.68rem;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:#c8932a;background:#fef6e4;border:1px solid #f0d89a;padding:2px 7px;border-radius:4px}
/* FAQ */
.faq-section{padding:80px}
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:1100px;margin:40px auto 0}
.faq-item{border:1.5px solid var(--border);border-radius:14px;overflow:hidden}
.faq-q{width:100%;background:none;border:none;padding:18px 20px;text-align:left;font-family:"Plus Jakarta Sans",sans-serif;font-size:0.88rem;font-weight:600;color:var(--ink);cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq-icon{font-size:1.2rem;color:var(--green);flex-shrink:0;transition:transform 0.2s}
.faq-item.open .faq-icon{transform:rotate(45deg)}
.faq-a{display:none;padding:0 20px 18px;font-size:0.85rem;color:var(--ink-mid);line-height:1.65}
.faq-item.open .faq-a{display:block}
/* PAGE-SPECIFIC */
.pricing-hero{padding:120px 80px 0;background:var(--surface);position:relative;overflow:hidden;text-align:center}
.pricing-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,#edfaf3 0%,transparent 65%);pointer-events:none}
.pricing-hero-inner{position:relative;z-index:2;max-width:760px;margin:0 auto}
.pricing-hero h1{font-size:clamp(2.2rem,4.5vw,3.4rem);font-weight:800;color:var(--ink);letter-spacing:-.03em;line-height:1.1;margin-bottom:20px}
.pricing-hero h1 .serif{font-family:"Fraunces",serif;font-weight:600;font-style:italic;color:var(--green)}
.pricing-hero-sub{font-size:1.05rem;color:var(--ink-mid);line-height:1.7;max-width:580px;margin:0 auto 60px}
.pain-band{background:#282c34;padding:56px 80px;position:relative;overflow:hidden}
.pain-band-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1fr 1px 1fr 1px 1fr;align-items:center}
.pain-divider{background:rgba(255,255,255,.12);height:60px;align-self:center}
.pain-stat{padding:0 48px;text-align:center}
.pain-stat-number{font-family:"Fraunces",serif;font-size:2.8rem;font-weight:700;color:#09a866;line-height:1;margin-bottom:8px}
.pain-stat-label{font-size:.82rem;color:rgba(255,255,255,.55);line-height:1.5}
.calc-section{padding:56px 80px 48px;background:var(--surface-2);border-bottom:1px solid var(--border)}
.calc-inner{max-width:900px;margin:0 auto}
.calc-header{text-align:center;margin-bottom:28px}
.calc-card{background:var(--surface);border:1.5px solid var(--border);border-radius:20px;padding:32px;box-shadow:var(--shadow-md)}
.calc-vdivider{display:none}
.calc-label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-light);margin-bottom:7px;display:block}
.calc-inputs-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}
.calc-input-row{margin-bottom:0}
.calc-input-row.full{grid-column:1/-1}
.calc-slider-wrap{display:flex;align-items:center;gap:16px}
.calc-slider{-webkit-appearance:none;width:100%;height:4px;border-radius:2px;background:var(--border);outline:none}
.calc-slider::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--green);cursor:pointer;box-shadow:0 2px 8px rgba(7,137,85,.3)}
.calc-val{font-size:1.1rem;font-weight:800;color:var(--ink);min-width:80px;text-align:right;white-space:nowrap}
.calc-results{margin-top:20px;padding-top:20px;border-top:1.5px solid var(--border)}
.calc-results-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:0}
.calc-result-row{background:var(--surface-2);border:1.5px solid var(--border);border-radius:10px;padding:12px 16px;display:flex;flex-direction:column;gap:4px}

.calc-result-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-light)}
.calc-result-value{font-size:1.25rem;font-weight:800;color:var(--ink);letter-spacing:-.02em;line-height:1}
.calc-result-value.hi{color:var(--green);font-size:1.4rem}
.calc-result-value.risk{color:#c0392b;font-size:1.4rem}
.calc-roi-bar{margin-top:14px;background:var(--green-pale);border:1.5px solid var(--green-mid);border-radius:14px;padding:20px 28px;display:flex;align-items:center;gap:24px}
.calc-roi-punchline{font-family:"Fraunces",serif;font-size:2.4rem;font-weight:700;color:var(--green);line-height:1;flex-shrink:0;min-width:100px}
.calc-roi-divider{width:1px;background:var(--green-mid);height:48px;flex-shrink:0}
.calc-roi-label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--green);margin-bottom:6px}
.calc-roi-text{font-size:.9rem;color:var(--ink-mid);line-height:1.6;flex:1}
.calc-roi-text strong{color:var(--ink)}
.calc-plan-select{font-family:"Plus Jakarta Sans",sans-serif;font-size:.875rem;color:var(--ink);background:var(--surface);border:1.5px solid var(--border);border-radius:10px;padding:10px 14px;width:100%;outline:none}
.billing-toggle-wrap{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:40px}
.billing-label{font-size:.85rem;font-weight:600;color:var(--ink-mid)}
.billing-label.active{color:var(--ink)}
.toggle-switch{position:relative;width:48px;height:26px}
.toggle-switch input{opacity:0;width:0;height:0}
.toggle-slider{position:absolute;cursor:pointer;inset:0;background:var(--border-strong);border-radius:26px;transition:background .2s}
.toggle-slider::before{content:"";position:absolute;height:20px;width:20px;left:3px;bottom:3px;background:white;border-radius:50%;transition:transform .2s}
.toggle-switch input:checked + .toggle-slider{background:var(--green)}
.toggle-switch input:checked + .toggle-slider::before{transform:translateX(22px)}
.annual-badge{background:var(--green-pale);border:1px solid var(--green-mid);color:var(--green);font-size:.72rem;font-weight:700;padding:3px 8px;border-radius:20px}
.plans-section{padding:0 80px 60px;background:var(--surface)}
.plans-intro{text-align:center;padding:64px 0 48px;max-width:600px;margin:0 auto}
.plan-situation{font-family:"Fraunces",serif;font-size:.95rem;font-style:italic;font-weight:400;color:var(--ink-mid);margin-bottom:10px;display:flex;align-items:center;gap:8px}
.plan-for{display:none}

.plan-annual-note{display:none;font-size:.78rem;color:var(--green);margin-bottom:4px}
.only-proteams{background:#282c34;border-radius:16px;padding:24px 32px;margin:0 auto 32px;display:flex;align-items:center;gap:20px;max-width:1100px}
.only-proteams-label{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;background:transparent;color:rgba(255,255,255,.9);border:1.5px solid #078037;padding:4px 10px;border-radius:6px;white-space:nowrap}
.only-proteams-items{display:flex;flex-wrap:wrap;gap:8px}
.only-chip{background:white;border:1.5px solid #078037;color:#282c34;font-size:.8rem;font-weight:700;padding:6px 14px;border-radius:20px;display:inline-flex;align-items:center;gap:6px}
.proof-strip{padding:60px 80px;background:var(--surface-2);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.proof-strip-inner{max-width:1100px;margin:0 auto}
.proof-quote-card{background:var(--surface);border:1.5px solid var(--border);border-radius:20px;padding:36px 40px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px}
.pq-item{position:relative;padding-left:20px}
.pq-item::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:3px;background:var(--green-mid);border-radius:3px}
.pq-item.featured-quote::before{background:var(--green)}
.pq-text{font-size:.88rem;color:var(--ink-mid);line-height:1.65;font-style:italic;margin-bottom:12px}
.pq-metric{font-size:1.5rem;font-weight:800;font-family:"Fraunces",serif;color:var(--green);line-height:1;margin-bottom:4px}
.pq-name{font-size:.78rem;font-weight:700;color:var(--ink)}
.pq-role{font-size:.75rem;color:var(--ink-light)}
.enterprise-band-light{background:var(--surface-3);border:1.5px solid var(--border);border-radius:20px;padding:32px 40px;display:flex;align-items:center;justify-content:space-between;gap:32px;max-width:1100px;margin:0 auto 32px}
.enterprise-band-light h3{font-size:1.1rem;font-weight:800;color:var(--ink);margin-bottom:8px}
.enterprise-band-light p{font-size:.875rem;color:var(--ink-mid);line-height:1.6}
.enterprise-cta-light{background:var(--ink);color:white;font-family:"Plus Jakarta Sans",sans-serif;font-size:.875rem;font-weight:700;padding:12px 24px;border-radius:10px;text-decoration:none;white-space:nowrap}
.enterprise-cta-light:hover{background:#1a2e1f}
.guarantee-band{background:var(--surface);border:1.5px solid var(--border);border-radius:20px;padding:32px 40px;display:flex;align-items:center;gap:24px;max-width:1100px;margin:0 auto 40px}
.g-icon{font-size:2rem;flex-shrink:0}
.closing-cta{background:var(--green);padding:100px 80px;text-align:center}
.closing-cta h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;color:white;letter-spacing:-.03em;margin-bottom:16px}
.closing-cta p{color:rgba(255,255,255,.8);font-size:1rem;max-width:480px;margin:0 auto 36px;line-height:1.65}
@media(max-width:1024px){
  .pain-band-inner{grid-template-columns:1fr;gap:32px}
  .pain-divider{display:none}
  .calc-results-grid{grid-template-columns:1fr 1fr}
  .calc-roi-bar{flex-direction:column;gap:16px;text-align:center}
  .proof-quote-card{grid-template-columns:1fr}
  .enterprise-band-light{flex-direction:column;align-items:flex-start}
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px}
}
@media(max-width:768px){
  nav{padding:0 20px;height:56px}
  .nav-links{display:none}
  .nav-actions .btn-nav-ghost,.nav-actions .btn-nav-primary{display:none}
  .hamburger{display:flex}
  .pricing-hero,.pain-band,.calc-section,.plans-section,.proof-strip,.feat-table-section,.faq-section,.closing-cta{padding-left:20px;padding-right:20px}
  .faq-grid{grid-template-columns:1fr}
  .calc-results-grid{grid-template-columns:1fr}
  .calc-roi-bar{flex-direction:column;gap:16px}
  .plans-grid{grid-template-columns:1fr;max-width:480px;margin-left:auto;margin-right:auto}
  .only-proteams,.guarantee-band{flex-direction:column;align-items:flex-start}
  .enterprise-band-light{margin-left:20px;margin-right:20px}
  footer{padding:48px 20px 32px}
  .footer-grid{grid-template-columns:1fr;gap:28px}
  .footer-bottom{flex-direction:column;gap:8px;text-align:center}
  .feat-table-wrap{overflow-x:auto}
  .feat-table-wrap table{min-width:480px}
  .only-proteams-items { justify-content: center;
    /* You might also want to add flex-wrap if the items overflow */
    /* flex-wrap: wrap; */
  }
}


/* PLAN INFO MODAL */
.plan-info-btn{width:18px;height:18px;border-radius:50%;background:var(--green-pale);border:1.5px solid var(--green-mid);color:var(--green);font-size:.7rem;font-weight:800;font-style:normal;font-family:"Plus Jakarta Sans",sans-serif;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s;line-height:1}
.plan-info-btn:hover{background:var(--green);border-color:var(--green);color:white}
.plan-modal-overlay{display:none;position:fixed;inset:0;background:rgba(10,26,16,.5);z-index:500;backdrop-filter:blur(4px);align-items:center;justify-content:center}
.plan-modal-overlay.open{display:flex}
.plan-modal{background:white;border-radius:20px;padding:36px 40px;max-width:480px;width:90%;position:relative;box-shadow:0 24px 80px rgba(10,26,16,.2)}
.plan-modal-close{position:absolute;top:16px;right:16px;width:32px;height:32px;border-radius:50%;background:var(--surface-2);border:none;font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--ink-mid);transition:all .15s}
.plan-modal-close:hover{background:var(--border);color:var(--ink)}
.plan-modal-eyebrow{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--green);margin-bottom:8px}
.plan-modal-title{font-family:"Fraunces",serif;font-size:1.6rem;font-weight:600;color:var(--ink);margin-bottom:6px}
.plan-modal-tagline{font-family:"Fraunces",serif;font-size:1rem;font-style:italic;color:var(--ink-mid);margin-bottom:20px}
.plan-modal-body{font-size:.9rem;color:var(--ink-mid);line-height:1.7}
.plan-modal-body p{margin-bottom:12px}
.plan-modal-body p:last-child{margin-bottom:0}
.plan-modal-cta{margin-top:24px;width:100%;font-family:"Plus Jakarta Sans",sans-serif;font-size:.875rem;font-weight:700;background:var(--green);color:white;border:none;padding:13px;border-radius:10px;cursor:pointer;transition:background .2s}
.plan-modal-cta:hover{background:var(--green-bright)}

/* PREFERRED PARTNER PRICING */
.partner-badge{display:block;text-align:center;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;background:linear-gradient(135deg,#078037,#09a866);color:white;padding:6px 0;border-radius:18px 18px 0 0;margin:-32px -32px 20px -32px;letter-spacing:.12em}
.plan-card.featured .partner-badge{background:linear-gradient(135deg,#056b43,#078037)}
.price-full{display:flex;align-items:baseline;gap:6px;margin-bottom:2px}
.price-full-amount{font-size:1rem;font-weight:600;color:var(--ink-light);text-decoration:line-through;text-decoration-color:var(--ink-light)}
.price-savings-pill{font-size:.68rem;font-weight:800;background:#fff3cd;border:1px solid #f0c040;color:#8a6000;padding:2px 8px;border-radius:20px;white-space:nowrap}
.plan-card.featured .price-savings-pill{background:#e8f8ef;border-color:var(--green-mid);color:#056b43}

/* ADD-ONS BAND */
.addons-band{background:var(--surface-2);border-top:1.5px solid var(--border);border-bottom:1.5px solid var(--border);padding:56px 80px}
.addons-inner{max-width:1100px;margin:0 auto}
.addons-label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-light);margin-bottom:8px;display:block}
.addons-items{display:flex;flex-wrap:wrap;gap:12px;flex:1}
.addons-header{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:28px;flex-wrap:wrap;gap:12px}
.addons-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.addon-item{background:var(--surface);border:1.5px solid var(--border);border-radius:14px;padding:20px 22px;transition:border-color .2s,box-shadow .2s}
.addon-item:hover{border-color:var(--green-mid);box-shadow:0 4px 16px rgba(7,137,85,.08)}
.addon-item-icon{width:40px;height:40px;border-radius:10px;background:var(--green-pale);border:1px solid var(--green-mid);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:1.2rem;margin-bottom:14px}
.addon-item-name{font-size:.95rem;font-weight:700;color:var(--ink);line-height:1.2;margin-bottom:4px}
.addon-item-price{font-size:.82rem;color:var(--ink-mid)}
.addons-note{font-size:.875rem;color:var(--ink-mid)}
.addons-note a{color:var(--green);text-decoration:none;font-weight:600}
.addons-note a:hover{text-decoration:underline}
@media(max-width:768px){.addons-band{padding:36px 20px}.addons-grid{grid-template-columns:1fr 1fr}}



/* INDUSTRIES */

:root {
  --green: #078037;
  --green-bright: #09a866;
  --green-pale: #edfaf3;
  --green-mid: #b8ddc8;
  --ink: #0a1a10;
  --ink-mid: #3d5c47;
  --ink-light: #7e9e89;
  --ink-xlight: #b8cec0;
  --surface: #ffffff;
  --surface-2: #f7faf8;
  --surface-3: #f0f5f2;
  --border: #e2ede7;
  --border-strong: #c8ddd1;
  --shadow-sm: 0 1px 3px #f1f5f3, 0 1px 2px #f1f5f3;
  --shadow-md: 0 4px 16px #edf2ef, 0 2px 4px #f1f5f3;
  --shadow-lg: 0 20px 60px #e5ecе8, 0 8px 16px #edf2ef;
  --shadow-xl: 0 40px 100px #e0eae6, 0 16px 32px #edf2ef;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; max-width: 100%; overflow-x: hidden; }
body {
  font-family: "Plus Jakarta Sans", sans-serif;
  background: var(--surface);
  color: var(--ink);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }

/* NAV */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  height: 64px; display: flex; align-items: center;
  padding: 0 48px; justify-content: space-between;
  transition: box-shadow 0.3s;
}
.nav-logo img { height: 30px; width: auto; }
.nav-links { display: flex; align-items: center; gap: 32px; list-style: none; }
.nav-links a { font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; letter-spacing: -0.01em; transition: color 0.15s; }
.nav-links a:hover { color: var(--ink); }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.btn-nav-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); background: none; border: none; padding: 8px 16px; border-radius: 8px; cursor: pointer; text-decoration: none; transition: all 0.15s; }
.btn-nav-ghost:hover { color: var(--ink); background: var(--surface-3); }
.btn-nav-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 600; background: var(--green); color: white; border: none; padding: 9px 20px; border-radius: 8px; cursor: pointer; text-decoration: none; display: inline-block; transition: all 0.15s; letter-spacing: -0.01em; }
.btn-nav-primary:hover { background: var(--green-bright); transform: translateY(-1px); box-shadow: 0 4px 12px #a3d0b6; }

/* HAMBURGER */
.hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; padding: 8px; }
.hamburger span { display: block; width: 22px; height: 2px; background: var(--ink); border-radius: 2px; transition: all 0.3s; transform-origin: center; }
.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; top: 64px; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--border); padding: 20px 24px 28px; z-index: 99; box-shadow: 0 8px 24px #e5ecе8; flex-direction: column; gap: 4px; }
.mobile-menu.open { display: flex; }
.mobile-menu a { font-size: 1rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; padding: 12px 0; border-bottom: 1px solid var(--border); transition: color 0.15s; }
.mobile-menu a:hover { color: var(--green); }
.mobile-menu-actions { display: flex; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--border); }
.mobile-menu-actions a { border-bottom: none; padding: 0; flex: 1; text-align: center; }

/* SHARED ELEMENTS */
.eyebrow { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.eyebrow::before { content: ""; width: 16px; height: 2px; background: var(--green-bright); border-radius: 1px; }
h2.section-h { font-size: clamp(1.9rem, 3vw, 2.8rem); font-weight: 800; letter-spacing: -0.025em; line-height: 1.1; color: var(--ink); margin-bottom: 16px; }
h2.section-h .serif { font-family: "Fraunces", serif; font-weight: 600; font-style: italic; letter-spacing: -0.02em; color: var(--green); }
.section-p { font-size: 1rem; color: var(--ink-mid); line-height: 1.7; max-width: 520px; font-weight: 400; letter-spacing: -0.01em; }
.section-wrap { max-width: 1200px; margin: 0 auto; }
.check-icon { width: 18px; height: 18px; border-radius: 50%; background: var(--green-pale); border: 1.5px solid var(--green-mid); flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.check-icon svg { width: 8px; height: 8px; }

/* BTN */
.btn-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 700; background: var(--green); color: white; border: none; padding: 14px 28px; border-radius: 10px; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-primary:hover { background: var(--green-bright); transform: translateY(-2px); box-shadow: 0 8px 20px #a3d0b6; }
.btn-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 500; color: var(--ink-mid); background: none; border: 1.5px solid var(--border-strong); padding: 13px 24px; border-radius: 10px; cursor: pointer; text-decoration: none; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-ghost:hover { border-color: var(--ink-xlight); color: var(--ink); background: var(--surface-3); }

/* PAGE HERO */
.page-hero { padding: 120px 80px 80px; background: var(--surface); position: relative; overflow: hidden; border-bottom: 1px solid var(--border); }
.page-hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px); background-size: 60px 60px; opacity: 0.3; pointer-events: none; }
.page-hero-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; }
.page-hero h1 { font-size: clamp(2.4rem, 4vw, 3.6rem); font-weight: 800; line-height: 1.07; letter-spacing: -0.03em; color: var(--ink); margin-bottom: 20px; }
.page-hero h1 .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: var(--green); }
.page-hero-sub { font-size: 1.1rem; color: var(--ink-mid); line-height: 1.7; max-width: 560px; margin-bottom: 36px; }

/* FOOTER */
footer { background: #282c34; padding: 64px 80px 40px; }
.footer-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }
.footer-brand-desc { font-size: 0.85rem; color: rgba(255,255,255,0.5); line-height: 1.7; margin-top: 14px; }
.footer-col h4 { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(255,255,255,0.35); margin-bottom: 16px; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-col a { font-size: 0.938rem; color: rgba(255,255,255,0.55); text-decoration: none; font-weight: 400; transition: color 0.15s; }
.footer-col a:hover { color: #09a866; }
.footer-bottom { max-width: 1200px; margin: 0 auto; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 24px; display: flex; justify-content: space-between; align-items: center; }
.footer-bottom p { font-size: 0.78rem; color: rgba(255,255,255,0.3); }

/* MATERIAL ICONS */
.material-symbols-outlined { font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24; font-size: 18px; line-height: 1; display: inline-flex; align-items: center; vertical-align: middle; user-select: none; }

/* AOS */
.aos { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s ease; }
.aos.visible { opacity: 1; transform: none; }
.aos-delay-1 { transition-delay: 0.1s; }
.aos-delay-2 { transition-delay: 0.2s; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 768px) {
  nav { padding: 0 20px; height: 56px; }
  .nav-links { display: none; }
  .nav-actions .btn-nav-ghost, .nav-actions .btn-nav-primary { display: none; }
  .hamburger { display: flex; }
  .page-hero { padding: 90px 20px 60px; }
  footer { padding: 48px 20px 32px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
}
@media (max-width: 480px) {
  h2.section-h { font-size: 1.6rem; }
}


.why-hero { max-width: 640px; }
.before-after { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 1200px; margin: 64px auto; }
.ba-card { border-radius: 16px; padding: 36px; }
.ba-card.before { background: var(--surface-2); border: 1px solid var(--border); }
.ba-card.after { background: #078037; }
.ba-label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 20px; }
.ba-card.before .ba-label { color: #ef4444; }
.ba-card.after .ba-label { color: rgba(255,255,255,0.6); }
.ba-list { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.ba-list li { display: flex; align-items: flex-start; gap: 10px; font-size: 1.0rem; line-height: 1.55; }
.ba-card.before .ba-list li { color: var(--ink-mid); }
.ba-card.after .ba-list li { color: rgba(255,255,255,0.85); }
.ba-dot-red { width: 8px; height: 8px; border-radius: 50%; background: #ef4444; flex-shrink: 0; margin-top: 5px; }
.ba-dot-green { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.6); flex-shrink: 0; margin-top: 5px; }

.story-section { padding: 80px; background: var(--surface); }
.story-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.story-quote { font-family: "Fraunces", serif; font-size: clamp(1.2rem, 2vw, 1.6rem); font-style: italic; color: var(--ink); line-height: 1.55; margin-bottom: 28px; font-weight: 400; letter-spacing: -0.01em; }
.story-quote em { color: var(--green); font-style: normal; font-weight: 600; }
.story-stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.story-stat { background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 18px; }
.story-stat-num { font-size: 1.5rem; font-weight: 800; color: var(--green); letter-spacing: -0.03em; line-height: 1; margin-bottom: 4px; }
.story-stat-lbl { font-size: 0.72rem; color: var(--ink-light); font-weight: 500; line-height: 1.4; }
.story-cards { display: flex; flex-direction: column; gap: 16px; }
.story-card { background: var(--surface-2); border: 1px solid var(--border); border-radius: 14px; padding: 24px; transition: all 0.2s; }
.story-card:hover { border-color: var(--green-mid); box-shadow: var(--shadow-sm); }
.story-card-title { font-size: 1.0rem; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 6px; }
.story-card-desc { font-size: 0.85rem; color: var(--ink-mid); line-height: 1.6; }

.results-section { padding: 80px; background: var(--surface-2); border-top: 1px solid var(--border); }
.results-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.result-card { background: white; border: 1px solid var(--border); border-radius: 16px; padding: 32px; text-align: center; }
.result-num { font-size: 2.8rem; font-weight: 800; color: var(--green); letter-spacing: -0.04em; line-height: 1; margin-bottom: 6px; }
.result-label { font-size: 0.938rem; font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.result-desc { font-size: 0.8rem; color: var(--ink-light); line-height: 1.55; }

.testimonials-section { padding: 80px; background: #282c34; }
.testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.tcard { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 14px; padding: 28px; }
.tcard-quote { font-size: 1.0rem; color: rgba(255,255,255,0.7); line-height: 1.65; margin-bottom: 16px; font-style: italic; }
.tcard-name { font-size: 0.8rem; font-weight: 700; color: var(--green-bright); }
.tcard-role { font-size: 0.72rem; color: rgba(255,255,255,0.35); margin-top: 2px; }

.why-cta { padding: 80px; background: #5c9e50; text-align: center; }
.why-cta h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 800; color: white; letter-spacing: -0.025em; margin-bottom: 16px; }
.why-cta p { color: rgba(255,255,255,0.75); font-size: 1rem; margin-bottom: 36px; max-width: 480px; margin-left: auto; margin-right: auto; }

@media (max-width: 1024px) { .story-inner { grid-template-columns: 1fr; gap: 48px; } .testimonials-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) {
  .before-after { grid-template-columns: 1fr; margin: 40px 20px; }
  .story-section, .results-section, .testimonials-section, .why-cta { padding: 60px 20px; }
  .results-grid { grid-template-columns: 1fr; }
  .story-stat-grid { grid-template-columns: 1fr 1fr; }
}

.page-hero { padding:120px 80px 80px; background:var(--surface-2); position:relative; overflow:hidden; border-bottom:1px solid var(--border); }
.page-hero::before { content:""; position:absolute; inset:0; background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px); background-size:60px 60px; opacity:0.35; pointer-events:none; }
.page-hero-inner { position:relative; z-index:2; max-width:1200px; margin:0 auto; }
.page-hero h1 { font-size:clamp(2.2rem,4vw,3.4rem); font-weight:800; line-height:1.08; letter-spacing:-0.03em; color:var(--ink); margin-bottom:20px; }
.page-hero h1 .serif { font-family:"Fraunces",serif; font-style:italic; font-weight:600; color:var(--green); }
.industries-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-bottom:24px; }
.industry-card { background:var(--surface-2); border:1.5px solid var(--border); border-radius:20px; padding:32px 28px; text-decoration:none; transition:all 0.2s; display:block; }
.industry-card:hover { border-color:var(--green-mid); box-shadow:0 8px 32px rgba(7,137,85,0.08); transform:translateY(-2px); }
.industry-card-icon { width:48px; height:48px; background:var(--green-pale); border:1.5px solid var(--green-mid); border-radius:12px; display:flex; align-items:center; justify-content:center; color:var(--green); margin-bottom:16px; }
.industry-card h3 { font-size:1rem; font-weight:800; color:var(--ink); margin-bottom:10px; letter-spacing:-0.02em; }
.industry-card p { font-size:0.83rem; color:var(--ink-mid); line-height:1.6; margin-bottom:16px; }
.industry-card-link { font-size:0.82rem; font-weight:700; color:var(--green); }
.cta-band { background:var(--green); padding:80px; text-align:center; }
.cta-band h2 { font-size:clamp(1.8rem,3vw,2.4rem); font-weight:800; color:white; letter-spacing:-0.025em; margin-bottom:12px; }
.cta-band h2 .serif { font-family:"Fraunces",serif; font-style:italic; font-weight:600; }
.cta-band p { color:rgba(255,255,255,0.8); font-size:1rem; margin-bottom:32px; }
.btn-white { font-family:"Plus Jakarta Sans",sans-serif; font-size:1.0rem; font-weight:700; background:white; color:var(--green); border:none; padding:14px 28px; border-radius:10px; cursor:pointer; text-decoration:none; display:inline-block; transition:all 0.15s; }
.btn-white:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,0.15); }
@media(max-width:900px) {
  .page-hero { padding:90px 20px 60px; }
  .industries-grid { grid-template-columns:repeat(2,1fr); }
  section[style*="padding:80px 80px"] { padding:60px 24px !important; }
  section[style*="padding:0 80px"] { padding:0 24px 60px !important; }
  .cta-band { padding:60px 24px !important; }
  div[style*="grid-template-columns:1fr 1fr 1fr 1fr"] { grid-template-columns:1fr 1fr !important; }
}
@media(max-width:480px) {
  .industries-grid { grid-template-columns:1fr; }
}

/* ── INDUSTRIES DROPDOWN ─────────────────────────── */
.nav-dropdown { position: relative; }
.nav-dropdown-trigger { display: flex; align-items: center; gap: 4px; cursor: pointer; }
.nav-dropdown-trigger svg { transition: transform 0.2s ease; flex-shrink: 0; }
.nav-dropdown:hover .nav-dropdown-trigger svg,
.nav-dropdown.open .nav-dropdown-trigger svg { transform: rotate(180deg); }
.nav-dropdown-menu {
  position: absolute; top: calc(100% + 12px); left: 50%;
  transform: translateX(-50%); min-width: 210px;
  background: #fff; border: 1px solid var(--border);
  border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,0.10);
  padding: 6px; opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease;
  transform: translateX(-50%) translateY(-4px); z-index: 200;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown.open .nav-dropdown-menu {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown-menu::before {
  content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 14px;
}
.dropdown-item {
  display: block; padding: 9px 14px; font-size: 0.85rem; font-weight: 500;
  color: var(--ink-mid); text-decoration: none; border-radius: 7px;
  border-left: 3px solid transparent;
  transition: background 0.14s, border-color 0.14s, color 0.14s;
  letter-spacing: -0.01em;
}
.dropdown-item:hover { background: var(--green-pale); border-left-color: var(--green); color: var(--ink); }
.dropdown-divider { height: 1px; background: var(--border); margin: 5px 6px; }
.dropdown-parent { font-weight: 600; color: var(--ink); font-size: 0.8rem; letter-spacing: 0.03em; text-transform: uppercase; }

/* Janetroial*/

:root {
  --green: #078037;
  --green-bright: #09a866;
  --green-pale: #edfaf3;
  --green-mid: #b8ddc8;
  --ink: #0a1a10;
  --ink-mid: #3d5c47;
  --ink-light: #7e9e89;
  --ink-xlight: #b8cec0;
  --surface: #ffffff;
  --surface-2: #f7faf8;
  --surface-3: #f0f5f2;
  --border: #e2ede7;
  --border-strong: #c8ddd1;
  --shadow-sm: 0 1px 3px #f1f5f3, 0 1px 2px #f1f5f3;
  --shadow-md: 0 4px 16px #edf2ef, 0 2px 4px #f1f5f3;
  --shadow-lg: 0 20px 60px #e5ecе8, 0 8px 16px #edf2ef;
  --shadow-xl: 0 40px 100px #e0eae6, 0 16px 32px #edf2ef;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; max-width: 100%; overflow-x: hidden; }
body {
  font-family: "Plus Jakarta Sans", sans-serif;
  background: var(--surface);
  color: var(--ink);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }

/* NAV */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  height: 64px; display: flex; align-items: center;
  padding: 0 48px; justify-content: space-between;
  transition: box-shadow 0.3s;
}
.nav-logo img { height: 30px; width: auto; }
.nav-links { display: flex; align-items: center; gap: 32px; list-style: none; }
.nav-links a { font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; letter-spacing: -0.01em; transition: color 0.15s; }
.nav-links a:hover { color: var(--ink); }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.btn-nav-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); background: none; border: none; padding: 8px 16px; border-radius: 8px; cursor: pointer; text-decoration: none; transition: all 0.15s; }
.btn-nav-ghost:hover { color: var(--ink); background: var(--surface-3); }
.btn-nav-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 600; background: var(--green); color: white; border: none; padding: 9px 20px; border-radius: 8px; cursor: pointer; text-decoration: none; display: inline-block; transition: all 0.15s; letter-spacing: -0.01em; }
.btn-nav-primary:hover { background: var(--green-bright); transform: translateY(-1px); box-shadow: 0 4px 12px #a3d0b6; }

/* HAMBURGER */
.hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; padding: 8px; }
.hamburger span { display: block; width: 22px; height: 2px; background: var(--ink); border-radius: 2px; transition: all 0.3s; transform-origin: center; }
.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; top: 64px; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--border); padding: 20px 24px 28px; z-index: 99; box-shadow: 0 8px 24px #e5ecе8; flex-direction: column; gap: 4px; }
.mobile-menu.open { display: flex; }
.mobile-menu a { font-size: 1rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; padding: 12px 0; border-bottom: 1px solid var(--border); transition: color 0.15s; }
.mobile-menu a:hover { color: var(--green); }
.mobile-menu-actions { display: flex; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--border); }
.mobile-menu-actions a { border-bottom: none; padding: 0; flex: 1; text-align: center; }

/* SHARED ELEMENTS */
.eyebrow { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.eyebrow::before { content: ""; width: 16px; height: 2px; background: var(--green-bright); border-radius: 1px; }
h2.section-h { font-size: clamp(1.9rem, 3vw, 2.8rem); font-weight: 800; letter-spacing: -0.025em; line-height: 1.1; color: var(--ink); margin-bottom: 16px; }
h2.section-h .serif { font-family: "Fraunces", serif; font-weight: 600; font-style: italic; letter-spacing: -0.02em; color: var(--green); }
.section-p { font-size: 1rem; color: var(--ink-mid); line-height: 1.7; max-width: 520px; font-weight: 400; letter-spacing: -0.01em; }
.section-wrap { max-width: 1200px; margin: 0 auto; }
.check-icon { width: 18px; height: 18px; border-radius: 50%; background: var(--green-pale); border: 1.5px solid var(--green-mid); flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.check-icon svg { width: 8px; height: 8px; }

/* BTN */
.btn-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 700; background: var(--green); color: white; border: none; padding: 14px 28px; border-radius: 10px; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-primary:hover { background: var(--green-bright); transform: translateY(-2px); box-shadow: 0 8px 20px #a3d0b6; }
.btn-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 500; color: var(--ink-mid); background: none; border: 1.5px solid var(--border-strong); padding: 13px 24px; border-radius: 10px; cursor: pointer; text-decoration: none; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-ghost:hover { border-color: var(--ink-xlight); color: var(--ink); background: var(--surface-3); }

/* PAGE HERO */
.page-hero { padding: 120px 80px 80px; background: var(--surface); position: relative; overflow: hidden; border-bottom: 1px solid var(--border); }
.page-hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px); background-size: 60px 60px; opacity: 0.3; pointer-events: none; }
.page-hero-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; }
.page-hero h1 { font-size: clamp(2.4rem, 4vw, 3.6rem); font-weight: 800; line-height: 1.07; letter-spacing: -0.03em; color: var(--ink); margin-bottom: 20px; }
.page-hero h1 .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: var(--green); }
.page-hero-sub { font-size: 1.1rem; color: var(--ink-mid); line-height: 1.7; max-width: 560px; margin-bottom: 36px; }

/* FOOTER */
footer { background: #282c34; padding: 64px 80px 40px; }
.footer-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }
.footer-brand-desc { font-size: 0.85rem; color: rgba(255,255,255,0.5); line-height: 1.7; margin-top: 14px; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-col a { font-size: 0.938rem; color: rgba(255,255,255,0.55); text-decoration: none; font-weight: 400; transition: color 0.15s; }
.footer-col a:hover { color: #09a866; }
.footer-bottom { max-width: 1200px; margin: 0 auto; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 24px; display: flex; justify-content: space-between; align-items: center; }
.footer-bottom p { font-size: 0.78rem; color: rgba(255,255,255,0.3); }

/* MATERIAL ICONS */
.material-symbols-outlined { font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24; font-size: 18px; line-height: 1; display: inline-flex; align-items: center; vertical-align: middle; user-select: none; }

/* AOS */
.aos { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s ease; }
.aos.visible { opacity: 1; transform: none; }
.aos-delay-1 { transition-delay: 0.1s; }
.aos-delay-2 { transition-delay: 0.2s; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 768px) {
  nav { padding: 0 20px; height: 56px; }
  .nav-links { display: none; }
  .nav-actions .btn-nav-ghost, .nav-actions .btn-nav-primary { display: none; }
  .hamburger { display: flex; }
  .page-hero { padding: 90px 20px 60px; }
  footer { padding: 48px 20px 32px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
}
@media (max-width: 480px) {
  h2.section-h { font-size: 1.6rem; }
}


.why-hero { max-width: 640px; }
.before-after { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 1200px; margin: 64px auto; }
.ba-card { border-radius: 16px; padding: 36px; }
.ba-card.before { background: var(--surface-2); border: 1px solid var(--border); }
.ba-card.after { background: #078037; }
.ba-label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 20px; }
.ba-card.before .ba-label { color: #ef4444; }
.ba-card.after .ba-label { color: rgba(255,255,255,0.6); }
.ba-list { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.ba-list li { display: flex; align-items: flex-start; gap: 10px; font-size: 1.0rem; line-height: 1.55; }
.ba-card.before .ba-list li { color: var(--ink-mid); }
.ba-card.after .ba-list li { color: rgba(255,255,255,0.85); }
.ba-dot-red { width: 8px; height: 8px; border-radius: 50%; background: #ef4444; flex-shrink: 0; margin-top: 5px; }
.ba-dot-green { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.6); flex-shrink: 0; margin-top: 5px; }

.story-section { padding: 80px; background: var(--surface); }
.story-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.story-quote { font-family: "Fraunces", serif; font-size: clamp(1.2rem, 2vw, 1.6rem); font-style: italic; color: var(--ink); line-height: 1.55; margin-bottom: 28px; font-weight: 400; letter-spacing: -0.01em; }
.story-quote em { color: var(--green); font-style: normal; font-weight: 600; }
.story-stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.story-stat { background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 18px; }
.story-stat-num { font-size: 1.5rem; font-weight: 800; color: var(--green); letter-spacing: -0.03em; line-height: 1; margin-bottom: 4px; }
.story-stat-lbl { font-size: 0.72rem; color: var(--ink-light); font-weight: 500; line-height: 1.4; }
.story-cards { display: flex; flex-direction: column; gap: 16px; }
.story-card { background: var(--surface-2); border: 1px solid var(--border); border-radius: 14px; padding: 24px; transition: all 0.2s; }
.story-card:hover { border-color: var(--green-mid); box-shadow: var(--shadow-sm); }
.story-card-title { font-size: 1.0rem; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 6px; }
.story-card-desc { font-size: 0.85rem; color: var(--ink-mid); line-height: 1.6; }

.results-section { padding: 80px; background: var(--surface-2); border-top: 1px solid var(--border); }
.results-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.result-card { background: white; border: 1px solid var(--border); border-radius: 16px; padding: 32px; text-align: center; }
.result-num { font-size: 2.8rem; font-weight: 800; color: var(--green); letter-spacing: -0.04em; line-height: 1; margin-bottom: 6px; }
.result-label { font-size: 0.938rem; font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.result-desc { font-size: 0.8rem; color: var(--ink-light); line-height: 1.55; }

.testimonials-section { padding: 80px; background: #282c34; }
.testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.tcard { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 14px; padding: 28px; }
.tcard-quote { font-size: 1.0rem; color: rgba(255,255,255,0.7); line-height: 1.65; margin-bottom: 16px; font-style: italic; }
.tcard-name { font-size: 0.8rem; font-weight: 700; color: var(--green-bright); }
.tcard-role { font-size: 0.72rem; color: rgba(255,255,255,0.35); margin-top: 2px; }

.why-cta { padding: 80px; background: #5c9e50; text-align: center; }
.why-cta h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 800; color: white; letter-spacing: -0.025em; margin-bottom: 16px; }
.why-cta p { color: rgba(255,255,255,0.75); font-size: 1rem; margin-bottom: 36px; max-width: 480px; margin-left: auto; margin-right: auto; }

@media (max-width: 1024px) { .story-inner { grid-template-columns: 1fr; gap: 48px; } .testimonials-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) {
  .before-after { grid-template-columns: 1fr; margin: 40px 20px; }
  .story-section, .results-section, .testimonials-section, .why-cta { padding: 60px 20px; }
  .results-grid { grid-template-columns: 1fr; }
  .story-stat-grid { grid-template-columns: 1fr 1fr; }
}

.page-hero { padding:120px 80px 80px; background:var(--surface-2); position:relative; overflow:hidden; border-bottom:1px solid var(--border); }
.page-hero::before { content:""; position:absolute; inset:0; background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px); background-size:60px 60px; opacity:0.35; pointer-events:none; }
.page-hero-inner { position:relative; z-index:2; max-width:1200px; margin:0 auto; }
.page-hero h1 { font-size:clamp(2.2rem,4vw,3.4rem); font-weight:800; line-height:1.08; letter-spacing:-0.03em; color:var(--ink); margin-bottom:20px; }
.page-hero h1 .serif { font-family:"Fraunces",serif; font-style:italic; font-weight:600; color:var(--green); }
.page-hero-badge { background:var(--green-pale); border:1px solid var(--green-mid); color:var(--green); font-size:0.75rem; font-weight:700; padding:4px 12px; border-radius:20px; }

/* CHALLENGES */
.challenges-section { padding:80px 80px; background:var(--surface); }
.challenges-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-top:48px; }
.challenge-card { background:var(--surface-2); border:1.5px solid var(--border); border-radius:16px; padding:28px 24px; }
.challenge-num { font-size:0.7rem; font-weight:800; text-transform:uppercase; letter-spacing:0.1em; color:var(--ink-xlight); margin-bottom:10px; }
.challenge-card h4 { font-size:1.0rem; font-weight:800; color:var(--ink); margin-bottom:10px; letter-spacing:-0.01em; }
.challenge-card p { font-size:0.85rem; color:var(--ink-mid); line-height:1.6; }

/* SOLUTIONS */
.solutions-section { padding:80px 80px; background:var(--surface-2); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.solution-row { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; margin-bottom:80px; }
.solution-row:last-child { margin-bottom:0; }
.solution-row.reverse { direction:rtl; }
.solution-row.reverse > * { direction:ltr; }
.solution-text h3 { font-size:1.3rem; font-weight:800; color:var(--ink); letter-spacing:-0.02em; margin-bottom:12px; line-height:1.2; }
.solution-text h3 .serif { font-family:"Fraunces",serif; font-style:italic; font-weight:600; color:var(--green); }
.solution-text p { font-size:1.0rem; color:var(--ink-mid); line-height:1.7; margin-bottom:16px; }
.solution-list { list-style:none; display:flex; flex-direction:column; gap:8px; }
.solution-list li { display:flex; gap:10px; align-items:flex-start; font-size:0.85rem; color:var(--ink); line-height:1.5; }
.solution-mock { background:var(--surface); border:1.5px solid var(--border); border-radius:20px; padding:32px 24px; min-height:260px; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
.solution-mock::before { content:""; position:absolute; inset:0; background:linear-gradient(135deg,var(--green-pale) 0%,transparent 60%); }
.solution-mock-inner { position:relative; z-index:2; text-align:center; }
.solution-mock-icon { width:56px; height:56px; background:var(--green); border-radius:14px; display:flex; align-items:center; justify-content:center; margin:0 auto 12px; color:white; }
.solution-mock-label { font-size:0.82rem; font-weight:600; color:var(--ink-mid); }

/* KEY FEATURES */
.features-section { padding:80px 80px; background:var(--surface); }
.features-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:48px; }
.feature-card { background:var(--surface-2); border:1.5px solid var(--border); border-radius:16px; padding:28px 24px; }
.feature-card-icon { width:44px; height:44px; background:var(--green-pale); border:1.5px solid var(--green-mid); border-radius:12px; display:flex; align-items:center; justify-content:center; color:var(--green); margin-bottom:16px; }
.feature-card h4 { font-size:1.0rem; font-weight:800; color:var(--ink); margin-bottom:10px; letter-spacing:-0.01em; }
.feature-card p { font-size:0.83rem; color:var(--ink-mid); line-height:1.6; }

/* FAQ */
.faq-section { padding:80px 80px; background:var(--surface-2); border-top:1px solid var(--border); }
.faq-list { max-width:800px; margin:40px auto 0; display:flex; flex-direction:column; gap:0; }
.faq-item { border-bottom:1px solid var(--border); }
.faq-q { width:100%; background:none; border:none; text-align:left; padding:20px 0; font-family:"Plus Jakarta Sans",sans-serif; font-size:1.0rem; font-weight:700; color:var(--ink); cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.faq-q svg { flex-shrink:0; transition:transform 0.2s; color:var(--green); }
.faq-item.open .faq-q svg { transform:rotate(180deg); }
.faq-a { display:none; padding:0 0 20px; font-size:0.88rem; color:var(--ink-mid); line-height:1.7; }
.faq-item.open .faq-a { display:block; }

/* CTA BAND */
.cta-band { background:var(--green); padding:80px; text-align:center; }
.cta-band h2 { font-size:clamp(1.8rem,3vw,2.4rem); font-weight:800; color:white; letter-spacing:-0.025em; margin-bottom:12px; }
.cta-band h2 .serif { font-family:"Fraunces",serif; font-style:italic; font-weight:600; }
.cta-band p { color:rgba(255,255,255,0.8); font-size:1rem; margin-bottom:32px; }
.btn-white { font-family:"Plus Jakarta Sans",sans-serif; font-size:1.0rem; font-weight:700; background:white; color:var(--green); border:none; padding:14px 28px; border-radius:10px; cursor:pointer; text-decoration:none; display:inline-block; transition:all 0.15s; }
.btn-white:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,0.15); }

/* INDUSTRY NAV STRIP */
.industry-nav { background:var(--surface); border-bottom:1px solid var(--border); padding:0 80px; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.industry-nav-inner { display:flex; gap:0; min-width:max-content; }
.industry-nav-link { display:inline-block; padding:16px 20px; font-size:0.82rem; font-weight:600; color:var(--ink-mid); text-decoration:none; border-bottom:2px solid transparent; white-space:nowrap; transition:all 0.15s; }
.industry-nav-link:hover { color:var(--green); }
.industry-nav-link.active { color:var(--green); border-bottom-color:var(--green); }

@media(max-width:1024px) { .features-grid { grid-template-columns:repeat(2,1fr); } }
@media(max-width:900px) {
  .challenges-section,.solutions-section,.features-section,.faq-section { padding:60px 24px !important; }
  .cta-band { padding:60px 24px !important; }
  .industry-nav { padding:0 20px; }
  .challenges-grid { grid-template-columns:1fr; }
  .solution-row { grid-template-columns:1fr; gap:32px; direction:ltr !important; }
  .solution-row.reverse > * { direction:ltr; }
}
@media(max-width:600px) {
  .page-hero { padding:90px 20px 60px; }
  .features-grid { grid-template-columns:1fr; }
  .challenges-grid { grid-template-columns:1fr; }
}

/* ── INDUSTRIES DROPDOWN ─────────────────────────── */
.nav-dropdown { position: relative; }
.nav-dropdown-trigger { display: flex; align-items: center; gap: 4px; cursor: pointer; }
.nav-dropdown-trigger svg { transition: transform 0.2s ease; flex-shrink: 0; }
.nav-dropdown:hover .nav-dropdown-trigger svg,
.nav-dropdown.open .nav-dropdown-trigger svg { transform: rotate(180deg); }
.nav-dropdown-menu {
  position: absolute; top: calc(100% + 12px); left: 50%;
  transform: translateX(-50%); min-width: 210px;
  background: #fff; border: 1px solid var(--border);
  border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,0.10);
  padding: 6px; opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease;
  transform: translateX(-50%) translateY(-4px); z-index: 200;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown.open .nav-dropdown-menu {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown-menu::before {
  content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 14px;
}
.dropdown-item {
  display: block; padding: 9px 14px; font-size: 0.85rem; font-weight: 500;
  color: var(--ink-mid); text-decoration: none; border-radius: 7px;
  border-left: 3px solid transparent;
  transition: background 0.14s, border-color 0.14s, color 0.14s;
  letter-spacing: -0.01em;
}
.dropdown-item:hover { background: var(--green-pale); border-left-color: var(--green); color: var(--ink); }
.dropdown-divider { height: 1px; background: var(--border); margin: 5px 6px; }
.dropdown-parent { font-weight: 600; color: var(--ink); font-size: 0.8rem; letter-spacing: 0.03em; text-transform: uppercase; }


/* ── INDUSTRY TAB NAV ─────────────────────────────── */
.industry-nav { background:#fff; border-bottom:1px solid var(--border); position:sticky; top:64px; z-index:90; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.industry-nav-inner { display:flex; align-items:center; max-width:1200px; margin:0 auto; padding:0 48px; }
.industry-nav-link { display:inline-block; padding:14px 18px; font-size:0.82rem; font-weight:500; color:var(--ink-light); text-decoration:none; white-space:nowrap; border-bottom:2px solid transparent; transition:color 0.15s, border-color 0.15s; letter-spacing:-0.01em; }
.industry-nav-link:hover { color:var(--ink); border-bottom-color:var(--green-mid); }
.industry-nav-link.active { color:var(--green); border-bottom-color:var(--green); font-weight:600; }
@media (max-width:768px) { .industry-nav-inner { padding:0 16px; } .industry-nav-link { padding:12px 10px; font-size:0.78rem; } }

/* Office */

:root {
  --green: #078037;
  --green-bright: #09a866;
  --green-pale: #edfaf3;
  --green-mid: #b8ddc8;
  --ink: #0a1a10;
  --ink-mid: #3d5c47;
  --ink-light: #7e9e89;
  --ink-xlight: #b8cec0;
  --surface: #ffffff;
  --surface-2: #f7faf8;
  --surface-3: #f0f5f2;
  --border: #e2ede7;
  --border-strong: #c8ddd1;
  --shadow-sm: 0 1px 3px #f1f5f3, 0 1px 2px #f1f5f3;
  --shadow-md: 0 4px 16px #edf2ef, 0 2px 4px #f1f5f3;
  --shadow-lg: 0 20px 60px #e5ecе8, 0 8px 16px #edf2ef;
  --shadow-xl: 0 40px 100px #e0eae6, 0 16px 32px #edf2ef;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; max-width: 100%; overflow-x: hidden; }
body {
  font-family: "Plus Jakarta Sans", sans-serif;
  background: var(--surface);
  color: var(--ink);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }

/* NAV */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  height: 64px; display: flex; align-items: center;
  padding: 0 48px; justify-content: space-between;
  transition: box-shadow 0.3s;
}
.nav-logo img { height: 30px; width: auto; }
.nav-links { display: flex; align-items: center; gap: 32px; list-style: none; }
.nav-links a { font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; letter-spacing: -0.01em; transition: color 0.15s; }
.nav-links a:hover { color: var(--ink); }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.btn-nav-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); background: none; border: none; padding: 8px 16px; border-radius: 8px; cursor: pointer; text-decoration: none; transition: all 0.15s; }
.btn-nav-ghost:hover { color: var(--ink); background: var(--surface-3); }
.btn-nav-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 600; background: var(--green); color: white; border: none; padding: 9px 20px; border-radius: 8px; cursor: pointer; text-decoration: none; display: inline-block; transition: all 0.15s; letter-spacing: -0.01em; }
.btn-nav-primary:hover { background: var(--green-bright); transform: translateY(-1px); box-shadow: 0 4px 12px #a3d0b6; }

/* HAMBURGER */
.hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; padding: 8px; }
.hamburger span { display: block; width: 22px; height: 2px; background: var(--ink); border-radius: 2px; transition: all 0.3s; transform-origin: center; }
.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; top: 64px; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--border); padding: 20px 24px 28px; z-index: 99; box-shadow: 0 8px 24px #e5ecе8; flex-direction: column; gap: 4px; }
.mobile-menu.open { display: flex; }
.mobile-menu a { font-size: 1rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; padding: 12px 0; border-bottom: 1px solid var(--border); transition: color 0.15s; }
.mobile-menu a:hover { color: var(--green); }
.mobile-menu-actions { display: flex; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--border); }
.mobile-menu-actions a { border-bottom: none; padding: 0; flex: 1; text-align: center; }

/* SHARED ELEMENTS */
.eyebrow { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.eyebrow::before { content: ""; width: 16px; height: 2px; background: var(--green-bright); border-radius: 1px; }
h2.section-h { font-size: clamp(1.9rem, 3vw, 2.8rem); font-weight: 800; letter-spacing: -0.025em; line-height: 1.1; color: var(--ink); margin-bottom: 16px; }
h2.section-h .serif { font-family: "Fraunces", serif; font-weight: 600; font-style: italic; letter-spacing: -0.02em; color: var(--green); }
.section-p { font-size: 1rem; color: var(--ink-mid); line-height: 1.7; max-width: 520px; font-weight: 400; letter-spacing: -0.01em; }
.section-wrap { max-width: 1200px; margin: 0 auto; }
.check-icon { width: 18px; height: 18px; border-radius: 50%; background: var(--green-pale); border: 1.5px solid var(--green-mid); flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.check-icon svg { width: 8px; height: 8px; }

/* BTN */
.btn-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 700; background: var(--green); color: white; border: none; padding: 14px 28px; border-radius: 10px; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-primary:hover { background: var(--green-bright); transform: translateY(-2px); box-shadow: 0 8px 20px #a3d0b6; }
.btn-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 500; color: var(--ink-mid); background: none; border: 1.5px solid var(--border-strong); padding: 13px 24px; border-radius: 10px; cursor: pointer; text-decoration: none; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-ghost:hover { border-color: var(--ink-xlight); color: var(--ink); background: var(--surface-3); }

/* PAGE HERO */
.page-hero { padding: 120px 80px 80px; background: var(--surface); position: relative; overflow: hidden; border-bottom: 1px solid var(--border); }
.page-hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px); background-size: 60px 60px; opacity: 0.3; pointer-events: none; }
.page-hero-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; }
.page-hero h1 { font-size: clamp(2.4rem, 4vw, 3.6rem); font-weight: 800; line-height: 1.07; letter-spacing: -0.03em; color: var(--ink); margin-bottom: 20px; }
.page-hero h1 .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: var(--green); }
.page-hero-sub { font-size: 1.1rem; color: var(--ink-mid); line-height: 1.7; max-width: 560px; margin-bottom: 36px; }

/* FOOTER */
footer { background: #282c34; padding: 64px 80px 40px; }
.footer-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }
.footer-brand-desc { font-size: 0.85rem; color: rgba(255,255,255,0.5); line-height: 1.7; margin-top: 14px; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-col a { font-size: 0.938rem; color: rgba(255,255,255,0.55); text-decoration: none; font-weight: 400; transition: color 0.15s; }
.footer-col a:hover { color: #09a866; }
.footer-bottom { max-width: 1200px; margin: 0 auto; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 24px; display: flex; justify-content: space-between; align-items: center; }
.footer-bottom p { font-size: 0.78rem; color: rgba(255,255,255,0.3); }

/* MATERIAL ICONS */
.material-symbols-outlined { font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24; font-size: 18px; line-height: 1; display: inline-flex; align-items: center; vertical-align: middle; user-select: none; }

/* AOS */
.aos { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s ease; }
.aos.visible { opacity: 1; transform: none; }
.aos-delay-1 { transition-delay: 0.1s; }
.aos-delay-2 { transition-delay: 0.2s; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 768px) {
  nav { padding: 0 20px; height: 56px; }
  .nav-links { display: none; }
  .nav-actions .btn-nav-ghost, .nav-actions .btn-nav-primary { display: none; }
  .hamburger { display: flex; }
  .page-hero { padding: 90px 20px 60px; }
  footer { padding: 48px 20px 32px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
}
@media (max-width: 480px) {
  h2.section-h { font-size: 1.6rem; }
}


.why-hero { max-width: 640px; }
.before-after { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 1200px; margin: 64px auto; }
.ba-card { border-radius: 16px; padding: 36px; }
.ba-card.before { background: var(--surface-2); border: 1px solid var(--border); }
.ba-card.after { background: #078037; }
.ba-label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 20px; }
.ba-card.before .ba-label { color: #ef4444; }
.ba-card.after .ba-label { color: rgba(255,255,255,0.6); }
.ba-list { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.ba-list li { display: flex; align-items: flex-start; gap: 10px; font-size: 1.0rem; line-height: 1.55; }
.ba-card.before .ba-list li { color: var(--ink-mid); }
.ba-card.after .ba-list li { color: rgba(255,255,255,0.85); }
.ba-dot-red { width: 8px; height: 8px; border-radius: 50%; background: #ef4444; flex-shrink: 0; margin-top: 5px; }
.ba-dot-green { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.6); flex-shrink: 0; margin-top: 5px; }

.story-section { padding: 80px; background: var(--surface); }
.story-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.story-quote { font-family: "Fraunces", serif; font-size: clamp(1.2rem, 2vw, 1.6rem); font-style: italic; color: var(--ink); line-height: 1.55; margin-bottom: 28px; font-weight: 400; letter-spacing: -0.01em; }
.story-quote em { color: var(--green); font-style: normal; font-weight: 600; }
.story-stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.story-stat { background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 18px; }
.story-stat-num { font-size: 1.5rem; font-weight: 800; color: var(--green); letter-spacing: -0.03em; line-height: 1; margin-bottom: 4px; }
.story-stat-lbl { font-size: 0.72rem; color: var(--ink-light); font-weight: 500; line-height: 1.4; }
.story-cards { display: flex; flex-direction: column; gap: 16px; }
.story-card { background: var(--surface-2); border: 1px solid var(--border); border-radius: 14px; padding: 24px; transition: all 0.2s; }
.story-card:hover { border-color: var(--green-mid); box-shadow: var(--shadow-sm); }
.story-card-title { font-size: 1.0rem; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 6px; }
.story-card-desc { font-size: 0.85rem; color: var(--ink-mid); line-height: 1.6; }

.results-section { padding: 80px; background: var(--surface-2); border-top: 1px solid var(--border); }
.results-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.result-card { background: white; border: 1px solid var(--border); border-radius: 16px; padding: 32px; text-align: center; }
.result-num { font-size: 2.8rem; font-weight: 800; color: var(--green); letter-spacing: -0.04em; line-height: 1; margin-bottom: 6px; }
.result-label { font-size: 0.938rem; font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.result-desc { font-size: 0.8rem; color: var(--ink-light); line-height: 1.55; }

.testimonials-section { padding: 80px; background: #282c34; }
.testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.tcard { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 14px; padding: 28px; }
.tcard-quote { font-size: 1.0rem; color: rgba(255,255,255,0.7); line-height: 1.65; margin-bottom: 16px; font-style: italic; }
.tcard-name { font-size: 0.8rem; font-weight: 700; color: var(--green-bright); }
.tcard-role { font-size: 0.72rem; color: rgba(255,255,255,0.35); margin-top: 2px; }

.why-cta { padding: 80px; background: #5c9e50; text-align: center; }
.why-cta h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 800; color: white; letter-spacing: -0.025em; margin-bottom: 16px; }
.why-cta p { color: rgba(255,255,255,0.75); font-size: 1rem; margin-bottom: 36px; max-width: 480px; margin-left: auto; margin-right: auto; }

@media (max-width: 1024px) { .story-inner { grid-template-columns: 1fr; gap: 48px; } .testimonials-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) {
  .before-after { grid-template-columns: 1fr; margin: 40px 20px; }
  .story-section, .results-section, .testimonials-section, .why-cta { padding: 60px 20px; }
  .results-grid { grid-template-columns: 1fr; }
  .story-stat-grid { grid-template-columns: 1fr 1fr; }
}

.page-hero { padding:120px 80px 80px; background:var(--surface-2); position:relative; overflow:hidden; border-bottom:1px solid var(--border); }
.page-hero::before { content:""; position:absolute; inset:0; background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px); background-size:60px 60px; opacity:0.35; pointer-events:none; }
.page-hero-inner { position:relative; z-index:2; max-width:1200px; margin:0 auto; }
.page-hero h1 { font-size:clamp(2.2rem,4vw,3.4rem); font-weight:800; line-height:1.08; letter-spacing:-0.03em; color:var(--ink); margin-bottom:20px; }
.page-hero h1 .serif { font-family:"Fraunces",serif; font-style:italic; font-weight:600; color:var(--green); }
.page-hero-badge { background:var(--green-pale); border:1px solid var(--green-mid); color:var(--green); font-size:0.75rem; font-weight:700; padding:4px 12px; border-radius:20px; }

/* CHALLENGES */
.challenges-section { padding:80px 80px; background:var(--surface); }
.challenges-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-top:48px; }
.challenge-card { background:var(--surface-2); border:1.5px solid var(--border); border-radius:16px; padding:28px 24px; }
.challenge-num { font-size:0.7rem; font-weight:800; text-transform:uppercase; letter-spacing:0.1em; color:var(--ink-xlight); margin-bottom:10px; }
.challenge-card h4 { font-size:1.0rem; font-weight:800; color:var(--ink); margin-bottom:10px; letter-spacing:-0.01em; }
.challenge-card p { font-size:0.85rem; color:var(--ink-mid); line-height:1.6; }

/* SOLUTIONS */
.solutions-section { padding:80px 80px; background:var(--surface-2); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.solution-row { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; margin-bottom:80px; }
.solution-row:last-child { margin-bottom:0; }
.solution-row.reverse { direction:rtl; }
.solution-row.reverse > * { direction:ltr; }
.solution-text h3 { font-size:1.3rem; font-weight:800; color:var(--ink); letter-spacing:-0.02em; margin-bottom:12px; line-height:1.2; }
.solution-text h3 .serif { font-family:"Fraunces",serif; font-style:italic; font-weight:600; color:var(--green); }
.solution-text p { font-size:1.0rem; color:var(--ink-mid); line-height:1.7; margin-bottom:16px; }
.solution-list { list-style:none; display:flex; flex-direction:column; gap:8px; }
.solution-list li { display:flex; gap:10px; align-items:flex-start; font-size:0.85rem; color:var(--ink); line-height:1.5; }
.solution-mock { background:var(--surface); border:1.5px solid var(--border); border-radius:20px; padding:32px 24px; min-height:260px; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
.solution-mock::before { content:""; position:absolute; inset:0; background:linear-gradient(135deg,var(--green-pale) 0%,transparent 60%); }
.solution-mock-inner { position:relative; z-index:2; text-align:center; }
.solution-mock-icon { width:56px; height:56px; background:var(--green); border-radius:14px; display:flex; align-items:center; justify-content:center; margin:0 auto 12px; color:white; }
.solution-mock-label { font-size:0.82rem; font-weight:600; color:var(--ink-mid); }

/* KEY FEATURES */
.features-section { padding:80px 80px; background:var(--surface); }
.features-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:48px; }
.feature-card { background:var(--surface-2); border:1.5px solid var(--border); border-radius:16px; padding:28px 24px; }
.feature-card-icon { width:44px; height:44px; background:var(--green-pale); border:1.5px solid var(--green-mid); border-radius:12px; display:flex; align-items:center; justify-content:center; color:var(--green); margin-bottom:16px; }
.feature-card h4 { font-size:1.0rem; font-weight:800; color:var(--ink); margin-bottom:10px; letter-spacing:-0.01em; }
.feature-card p { font-size:0.83rem; color:var(--ink-mid); line-height:1.6; }

/* FAQ */
.faq-section { padding:80px 80px; background:var(--surface-2); border-top:1px solid var(--border); }
.faq-list { max-width:800px; margin:40px auto 0; display:flex; flex-direction:column; gap:0; }
.faq-item { border-bottom:1px solid var(--border); }
.faq-q { width:100%; background:none; border:none; text-align:left; padding:20px 0; font-family:"Plus Jakarta Sans",sans-serif; font-size:1.0rem; font-weight:700; color:var(--ink); cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.faq-q svg { flex-shrink:0; transition:transform 0.2s; color:var(--green); }
.faq-item.open .faq-q svg { transform:rotate(180deg); }
.faq-a { display:none; padding:0 0 20px; font-size:0.88rem; color:var(--ink-mid); line-height:1.7; }
.faq-item.open .faq-a { display:block; }

/* CTA BAND */
.cta-band { background:var(--green); padding:80px; text-align:center; }
.cta-band h2 { font-size:clamp(1.8rem,3vw,2.4rem); font-weight:800; color:white; letter-spacing:-0.025em; margin-bottom:12px; }
.cta-band h2 .serif { font-family:"Fraunces",serif; font-style:italic; font-weight:600; }
.cta-band p { color:rgba(255,255,255,0.8); font-size:1rem; margin-bottom:32px; }
.btn-white { font-family:"Plus Jakarta Sans",sans-serif; font-size:1.0rem; font-weight:700; background:white; color:var(--green); border:none; padding:14px 28px; border-radius:10px; cursor:pointer; text-decoration:none; display:inline-block; transition:all 0.15s; }
.btn-white:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,0.15); }

/* INDUSTRY NAV STRIP */
.industry-nav { background:var(--surface); border-bottom:1px solid var(--border); padding:0 80px; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.industry-nav-inner { display:flex; gap:0; min-width:max-content; }
.industry-nav-link { display:inline-block; padding:16px 20px; font-size:0.82rem; font-weight:600; color:var(--ink-mid); text-decoration:none; border-bottom:2px solid transparent; white-space:nowrap; transition:all 0.15s; }
.industry-nav-link:hover { color:var(--green); }
.industry-nav-link.active { color:var(--green); border-bottom-color:var(--green); }

@media(max-width:1024px) { .features-grid { grid-template-columns:repeat(2,1fr); } }
@media(max-width:900px) {
  .challenges-section,.solutions-section,.features-section,.faq-section { padding:60px 24px !important; }
  .cta-band { padding:60px 24px !important; }
  .industry-nav { padding:0 20px; }
  .challenges-grid { grid-template-columns:1fr; }
  .solution-row { grid-template-columns:1fr; gap:32px; direction:ltr !important; }
  .solution-row.reverse > * { direction:ltr; }
}
@media(max-width:600px) {
  .page-hero { padding:90px 20px 60px; }
  .features-grid { grid-template-columns:1fr; }
  .challenges-grid { grid-template-columns:1fr; }
}

/* ── INDUSTRIES DROPDOWN ─────────────────────────── */
.nav-dropdown { position: relative; }
.nav-dropdown-trigger { display: flex; align-items: center; gap: 4px; cursor: pointer; }
.nav-dropdown-trigger svg { transition: transform 0.2s ease; flex-shrink: 0; }
.nav-dropdown:hover .nav-dropdown-trigger svg,
.nav-dropdown.open .nav-dropdown-trigger svg { transform: rotate(180deg); }
.nav-dropdown-menu {
  position: absolute; top: calc(100% + 12px); left: 50%;
  transform: translateX(-50%); min-width: 210px;
  background: #fff; border: 1px solid var(--border);
  border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,0.10);
  padding: 6px; opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease;
  transform: translateX(-50%) translateY(-4px); z-index: 200;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown.open .nav-dropdown-menu {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown-menu::before {
  content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 14px;
}
.dropdown-item {
  display: block; padding: 9px 14px; font-size: 0.85rem; font-weight: 500;
  color: var(--ink-mid); text-decoration: none; border-radius: 7px;
  border-left: 3px solid transparent;
  transition: background 0.14s, border-color 0.14s, color 0.14s;
  letter-spacing: -0.01em;
}
.dropdown-item:hover { background: var(--green-pale); border-left-color: var(--green); color: var(--ink); }
.dropdown-divider { height: 1px; background: var(--border); margin: 5px 6px; }
.dropdown-parent { font-weight: 600; color: var(--ink); font-size: 0.8rem; letter-spacing: 0.03em; text-transform: uppercase; }


/* ── INDUSTRY TAB NAV ─────────────────────────────── */
.industry-nav { background:#fff; border-bottom:1px solid var(--border); position:sticky; top:64px; z-index:90; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.industry-nav-inner { display:flex; align-items:center; max-width:1200px; margin:0 auto; padding:0 48px; }
.industry-nav-link { display:inline-block; padding:14px 18px; font-size:0.82rem; font-weight:500; color:var(--ink-light); text-decoration:none; white-space:nowrap; border-bottom:2px solid transparent; transition:color 0.15s, border-color 0.15s; letter-spacing:-0.01em; }
.industry-nav-link:hover { color:var(--ink); border-bottom-color:var(--green-mid); }
.industry-nav-link.active { color:var(--green); border-bottom-color:var(--green); font-weight:600; }
@media (max-width:768px) { .industry-nav-inner { padding:0 16px; } .industry-nav-link { padding:12px 10px; font-size:0.78rem; } }


/* team-carpet */
:root {
  --green: #078037;
  --green-bright: #09a866;
  --green-pale: #edfaf3;
  --green-mid: #b8ddc8;
  --ink: #0a1a10;
  --ink-mid: #3d5c47;
  --ink-light: #7e9e89;
  --ink-xlight: #b8cec0;
  --surface: #ffffff;
  --surface-2: #f7faf8;
  --surface-3: #f0f5f2;
  --border: #e2ede7;
  --border-strong: #c8ddd1;
  --shadow-sm: 0 1px 3px #f1f5f3, 0 1px 2px #f1f5f3;
  --shadow-md: 0 4px 16px #edf2ef, 0 2px 4px #f1f5f3;
  --shadow-lg: 0 20px 60px #e5ecе8, 0 8px 16px #edf2ef;
  --shadow-xl: 0 40px 100px #e0eae6, 0 16px 32px #edf2ef;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; max-width: 100%; overflow-x: hidden; }
body {
  font-family: "Plus Jakarta Sans", sans-serif;
  background: var(--surface);
  color: var(--ink);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }

/* NAV */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  height: 64px; display: flex; align-items: center;
  padding: 0 48px; justify-content: space-between;
  transition: box-shadow 0.3s;
}
.nav-logo img { height: 30px; width: auto; }
.nav-links { display: flex; align-items: center; gap: 32px; list-style: none; }
.nav-links a { font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; letter-spacing: -0.01em; transition: color 0.15s; }
.nav-links a:hover { color: var(--ink); }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.btn-nav-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); background: none; border: none; padding: 8px 16px; border-radius: 8px; cursor: pointer; text-decoration: none; transition: all 0.15s; }
.btn-nav-ghost:hover { color: var(--ink); background: var(--surface-3); }
.btn-nav-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 600; background: var(--green); color: white; border: none; padding: 9px 20px; border-radius: 8px; cursor: pointer; text-decoration: none; display: inline-block; transition: all 0.15s; letter-spacing: -0.01em; }
.btn-nav-primary:hover { background: var(--green-bright); transform: translateY(-1px); box-shadow: 0 4px 12px #a3d0b6; }

/* HAMBURGER */
.hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; padding: 8px; }
.hamburger span { display: block; width: 22px; height: 2px; background: var(--ink); border-radius: 2px; transition: all 0.3s; transform-origin: center; }
.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; top: 64px; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--border); padding: 20px 24px 28px; z-index: 99; box-shadow: 0 8px 24px #e5ecе8; flex-direction: column; gap: 4px; }
.mobile-menu.open { display: flex; }
.mobile-menu a { font-size: 1rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; padding: 12px 0; border-bottom: 1px solid var(--border); transition: color 0.15s; }
.mobile-menu a:hover { color: var(--green); }
.mobile-menu-actions { display: flex; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--border); }
.mobile-menu-actions a { border-bottom: none; padding: 0; flex: 1; text-align: center; }

/* SHARED ELEMENTS */
.eyebrow { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.eyebrow::before { content: ""; width: 16px; height: 2px; background: var(--green-bright); border-radius: 1px; }
h2.section-h { font-size: clamp(1.9rem, 3vw, 2.8rem); font-weight: 800; letter-spacing: -0.025em; line-height: 1.1; color: var(--ink); margin-bottom: 16px; }
h2.section-h .serif { font-family: "Fraunces", serif; font-weight: 600; font-style: italic; letter-spacing: -0.02em; color: var(--green); }
.section-p { font-size: 1rem; color: var(--ink-mid); line-height: 1.7; max-width: 520px; font-weight: 400; letter-spacing: -0.01em; }
.section-wrap { max-width: 1200px; margin: 0 auto; }
.check-icon { width: 18px; height: 18px; border-radius: 50%; background: var(--green-pale); border: 1.5px solid var(--green-mid); flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.check-icon svg { width: 8px; height: 8px; }

/* BTN */
.btn-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 700; background: var(--green); color: white; border: none; padding: 14px 28px; border-radius: 10px; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-primary:hover { background: var(--green-bright); transform: translateY(-2px); box-shadow: 0 8px 20px #a3d0b6; }
.btn-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 500; color: var(--ink-mid); background: none; border: 1.5px solid var(--border-strong); padding: 13px 24px; border-radius: 10px; cursor: pointer; text-decoration: none; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-ghost:hover { border-color: var(--ink-xlight); color: var(--ink); background: var(--surface-3); }

/* PAGE HERO */
.page-hero { padding: 120px 80px 80px; background: var(--surface); position: relative; overflow: hidden; border-bottom: 1px solid var(--border); }
.page-hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px); background-size: 60px 60px; opacity: 0.3; pointer-events: none; }
.page-hero-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; }
.page-hero h1 { font-size: clamp(2.4rem, 4vw, 3.6rem); font-weight: 800; line-height: 1.07; letter-spacing: -0.03em; color: var(--ink); margin-bottom: 20px; }
.page-hero h1 .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: var(--green); }
.page-hero-sub { font-size: 1.1rem; color: var(--ink-mid); line-height: 1.7; max-width: 560px; margin-bottom: 36px; }

/* FOOTER */
footer { background: #282c34; padding: 64px 80px 40px; }
.footer-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }
.footer-brand-desc { font-size: 0.85rem; color: rgba(255,255,255,0.5); line-height: 1.7; margin-top: 14px; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-col a { font-size: 0.938rem; color: rgba(255,255,255,0.55); text-decoration: none; font-weight: 400; transition: color 0.15s; }
.footer-col a:hover { color: #09a866; }
.footer-bottom { max-width: 1200px; margin: 0 auto; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 24px; display: flex; justify-content: space-between; align-items: center; }
.footer-bottom p { font-size: 0.78rem; color: rgba(255,255,255,0.3); }

/* MATERIAL ICONS */
.material-symbols-outlined { font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24; font-size: 18px; line-height: 1; display: inline-flex; align-items: center; vertical-align: middle; user-select: none; }

/* AOS */
.aos { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s ease; }
.aos.visible { opacity: 1; transform: none; }
.aos-delay-1 { transition-delay: 0.1s; }
.aos-delay-2 { transition-delay: 0.2s; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 768px) {
  nav { padding: 0 20px; height: 56px; }
  .nav-links { display: none; }
  .nav-actions .btn-nav-ghost, .nav-actions .btn-nav-primary { display: none; }
  .hamburger { display: flex; }
  .page-hero { padding: 90px 20px 60px; }
  footer { padding: 48px 20px 32px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
}
@media (max-width: 480px) {
  h2.section-h { font-size: 1.6rem; }
}


.why-hero { max-width: 640px; }
.before-after { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 1200px; margin: 64px auto; }
.ba-card { border-radius: 16px; padding: 36px; }
.ba-card.before { background: var(--surface-2); border: 1px solid var(--border); }
.ba-card.after { background: #078037; }
.ba-label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 20px; }
.ba-card.before .ba-label { color: #ef4444; }
.ba-card.after .ba-label { color: rgba(255,255,255,0.6); }
.ba-list { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.ba-list li { display: flex; align-items: flex-start; gap: 10px; font-size: 1.0rem; line-height: 1.55; }
.ba-card.before .ba-list li { color: var(--ink-mid); }
.ba-card.after .ba-list li { color: rgba(255,255,255,0.85); }
.ba-dot-red { width: 8px; height: 8px; border-radius: 50%; background: #ef4444; flex-shrink: 0; margin-top: 5px; }
.ba-dot-green { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.6); flex-shrink: 0; margin-top: 5px; }

.story-section { padding: 80px; background: var(--surface); }
.story-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.story-quote { font-family: "Fraunces", serif; font-size: clamp(1.2rem, 2vw, 1.6rem); font-style: italic; color: var(--ink); line-height: 1.55; margin-bottom: 28px; font-weight: 400; letter-spacing: -0.01em; }
.story-quote em { color: var(--green); font-style: normal; font-weight: 600; }
.story-stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.story-stat { background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 18px; }
.story-stat-num { font-size: 1.5rem; font-weight: 800; color: var(--green); letter-spacing: -0.03em; line-height: 1; margin-bottom: 4px; }
.story-stat-lbl { font-size: 0.72rem; color: var(--ink-light); font-weight: 500; line-height: 1.4; }
.story-cards { display: flex; flex-direction: column; gap: 16px; }
.story-card { background: var(--surface-2); border: 1px solid var(--border); border-radius: 14px; padding: 24px; transition: all 0.2s; }
.story-card:hover { border-color: var(--green-mid); box-shadow: var(--shadow-sm); }
.story-card-title { font-size: 1.0rem; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 6px; }
.story-card-desc { font-size: 0.85rem; color: var(--ink-mid); line-height: 1.6; }

.results-section { padding: 80px; background: var(--surface-2); border-top: 1px solid var(--border); }
.results-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.result-card { background: white; border: 1px solid var(--border); border-radius: 16px; padding: 32px; text-align: center; }
.result-num { font-size: 2.8rem; font-weight: 800; color: var(--green); letter-spacing: -0.04em; line-height: 1; margin-bottom: 6px; }
.result-label { font-size: 0.938rem; font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.result-desc { font-size: 0.8rem; color: var(--ink-light); line-height: 1.55; }

.testimonials-section { padding: 80px; background: #282c34; }
.testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.tcard { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 14px; padding: 28px; }
.tcard-quote { font-size: 1.0rem; color: rgba(255,255,255,0.7); line-height: 1.65; margin-bottom: 16px; font-style: italic; }
.tcard-name { font-size: 0.8rem; font-weight: 700; color: var(--green-bright); }
.tcard-role { font-size: 0.72rem; color: rgba(255,255,255,0.35); margin-top: 2px; }

.why-cta { padding: 80px; background: #5c9e50; text-align: center; }
.why-cta h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 800; color: white; letter-spacing: -0.025em; margin-bottom: 16px; }
.why-cta p { color: rgba(255,255,255,0.75); font-size: 1rem; margin-bottom: 36px; max-width: 480px; margin-left: auto; margin-right: auto; }

@media (max-width: 1024px) { .story-inner { grid-template-columns: 1fr; gap: 48px; } .testimonials-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) {
  .before-after { grid-template-columns: 1fr; margin: 40px 20px; }
  .story-section, .results-section, .testimonials-section, .why-cta { padding: 60px 20px; }
  .results-grid { grid-template-columns: 1fr; }
  .story-stat-grid { grid-template-columns: 1fr 1fr; }
}
.page-hero { padding:120px 80px 80px; background:var(--surface-2); position:relative; overflow:hidden; border-bottom:1px solid var(--border); }
.page-hero::before { content:""; position:absolute; inset:0; background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px); background-size:60px 60px; opacity:0.35; pointer-events:none; }
.page-hero-inner { position:relative; z-index:2; max-width:1200px; margin:0 auto; }
.page-hero h1 { font-size:clamp(2.2rem,4vw,3.4rem); font-weight:800; line-height:1.08; letter-spacing:-0.03em; color:var(--ink); margin-bottom:20px; }
.page-hero h1 .serif { font-family:"Fraunces",serif; font-style:italic; font-weight:600; color:var(--green); }
.page-hero-badges { /*display:flex;*/ display:none; gap:10px; flex-wrap:wrap; margin-bottom:24px; }
.page-hero-badge { background:var(--green-pale); border:1px solid var(--green-mid); color:var(--green); font-size:0.75rem; font-weight:700; padding:4px 12px; border-radius:20px; }

/* CHALLENGES */
.challenges-section { padding:80px 80px; background:var(--surface); }
.challenges-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-top:48px; }
.challenge-card { background:var(--surface-2); border:1.5px solid var(--border); border-radius:16px; padding:28px 24px; }
.challenge-num { font-size:0.7rem; font-weight:800; text-transform:uppercase; letter-spacing:0.1em; color:var(--ink-xlight); margin-bottom:10px; }
.challenge-card h4 { font-size:1.0rem; font-weight:800; color:var(--ink); margin-bottom:10px; letter-spacing:-0.01em; }
.challenge-card p { font-size:0.85rem; color:var(--ink-mid); line-height:1.6; }

/* SOLUTIONS */
.solutions-section { padding:80px 80px; background:var(--surface-2); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.solution-row { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; margin-bottom:80px; }
.solution-row:last-child { margin-bottom:0; }
.solution-row.reverse { direction:rtl; }
.solution-row.reverse > * { direction:ltr; }
.solution-text h3 { font-size:1.3rem; font-weight:800; color:var(--ink); letter-spacing:-0.02em; margin-bottom:12px; line-height:1.2; }
.solution-text h3 .serif { font-family:"Fraunces",serif; font-style:italic; font-weight:600; color:var(--green); }
.solution-text p { font-size:1.0rem; color:var(--ink-mid); line-height:1.7; margin-bottom:16px; }
.solution-list { list-style:none; display:flex; flex-direction:column; gap:8px; }
.solution-list li { display:flex; gap:10px; align-items:flex-start; font-size:0.85rem; color:var(--ink); line-height:1.5; }
.solution-mock { background:var(--surface); border:1.5px solid var(--border); border-radius:20px; padding:5px 5px; min-height:260px; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
.solution-mock::before { content:""; position:absolute; inset:0; background:linear-gradient(135deg,var(--green-pale) 0%,transparent 60%); }
.solution-mock-inner { position:relative; z-index:2; text-align:center; }
.solution-mock-icon { width:56px; height:56px; background:var(--green); border-radius:14px; display:flex; align-items:center; justify-content:center; margin:0 auto 12px; color:white; }
.solution-mock-label { font-size:0.82rem; font-weight:600; color:var(--ink-mid); }

/* KEY FEATURES */
.features-section { padding:80px 80px; background:var(--surface); }
.features-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:48px; }
.feature-card { background:var(--surface-2); border:1.5px solid var(--border); border-radius:16px; padding:28px 24px; }
.feature-card-icon { width:44px; height:44px; background:var(--green-pale); border:1.5px solid var(--green-mid); border-radius:12px; display:flex; align-items:center; justify-content:center; color:var(--green); margin-bottom:16px; }
.feature-card h4 { font-size:1.0rem; font-weight:800; color:var(--ink); margin-bottom:10px; letter-spacing:-0.01em; }
.feature-card p { font-size:0.83rem; color:var(--ink-mid); line-height:1.6; }

/* FAQ */
.faq-section { padding:80px 80px; background:var(--surface-2); border-top:1px solid var(--border); }
.faq-list { max-width:800px; margin:40px auto 0; display:flex; flex-direction:column; gap:0; }
.faq-item { border-bottom:1px solid var(--border); }
.faq-q { width:100%; background:none; border:none; text-align:left; padding:20px 0; font-family:"Plus Jakarta Sans",sans-serif; font-size:1.0rem; font-weight:700; color:var(--ink); cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.faq-q svg { flex-shrink:0; transition:transform 0.2s; color:var(--green); }
.faq-item.open .faq-q svg { transform:rotate(180deg); }
.faq-a { display:none; padding:0 0 20px; font-size:0.88rem; color:var(--ink-mid); line-height:1.7; }
.faq-item.open .faq-a { display:block; }

/* CTA BAND */
.cta-band { background:var(--green); padding:80px; text-align:center; }
.cta-band h2 { font-size:clamp(1.8rem,3vw,2.4rem); font-weight:800; color:white; letter-spacing:-0.025em; margin-bottom:12px; }
.cta-band h2 .serif { font-family:"Fraunces",serif; font-style:italic; font-weight:600; }
.cta-band p { color:rgba(255,255,255,0.8); font-size:1rem; margin-bottom:32px; }
.btn-white { font-family:"Plus Jakarta Sans",sans-serif; font-size:1.0rem; font-weight:700; background:white; color:var(--green); border:none; padding:14px 28px; border-radius:10px; cursor:pointer; text-decoration:none; display:inline-block; transition:all 0.15s; }
.btn-white:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,0.15); }

/* INDUSTRY NAV STRIP */
.industry-nav { background:var(--surface); border-bottom:1px solid var(--border); padding:0 80px; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.industry-nav-inner { display:flex; gap:0; min-width:max-content; }
.industry-nav-link { display:inline-block; padding:16px 20px; font-size:0.82rem; font-weight:600; color:var(--ink-mid); text-decoration:none; border-bottom:2px solid transparent; white-space:nowrap; transition:all 0.15s; }
.industry-nav-link:hover { color:var(--green); }
.industry-nav-link.active { color:var(--green); border-bottom-color:var(--green); }

@media(max-width:1024px) { .features-grid { grid-template-columns:repeat(2,1fr); } }
@media(max-width:900px) {
  .challenges-section,.solutions-section,.features-section,.faq-section { padding:60px 24px !important; }
  .cta-band { padding:60px 24px !important; }
  .industry-nav { padding:0 20px; }
  .challenges-grid { grid-template-columns:1fr; }
  .solution-row { grid-template-columns:1fr; gap:32px; direction:ltr !important; }
  .solution-row.reverse > * { direction:ltr; }
}
@media(max-width:600px) {
  .page-hero { padding:90px 20px 60px; }
  .features-grid { grid-template-columns:1fr; }
  .challenges-grid { grid-template-columns:1fr; }
}

/* ── INDUSTRIES DROPDOWN ─────────────────────────── */
.nav-dropdown { position: relative; }
.nav-dropdown-trigger { display: flex; align-items: center; gap: 4px; cursor: pointer; }
.nav-dropdown-trigger svg { transition: transform 0.2s ease; flex-shrink: 0; }
.nav-dropdown:hover .nav-dropdown-trigger svg,
.nav-dropdown.open .nav-dropdown-trigger svg { transform: rotate(180deg); }
.nav-dropdown-menu {
  position: absolute; top: calc(100% + 12px); left: 50%;
  transform: translateX(-50%); min-width: 210px;
  background: #fff; border: 1px solid var(--border);
  border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,0.10);
  padding: 6px; opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease;
  transform: translateX(-50%) translateY(-4px); z-index: 200;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown.open .nav-dropdown-menu {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown-menu::before {
  content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 14px;
}
.dropdown-item {
  display: block; padding: 9px 14px; font-size: 0.85rem; font-weight: 500;
  color: var(--ink-mid); text-decoration: none; border-radius: 7px;
  border-left: 3px solid transparent;
  transition: background 0.14s, border-color 0.14s, color 0.14s;
  letter-spacing: -0.01em;
}
.dropdown-item:hover { background: var(--green-pale); border-left-color: var(--green); color: var(--ink); }
.dropdown-divider { height: 1px; background: var(--border); margin: 5px 6px; }
.dropdown-parent { font-weight: 600; color: var(--ink); font-size: 0.8rem; letter-spacing: 0.03em; text-transform: uppercase; }


/* ── INDUSTRY TAB NAV ─────────────────────────────── */
.industry-nav { background:#fff; border-bottom:1px solid var(--border); position:sticky; top:64px; z-index:90; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.industry-nav-inner { display:flex; align-items:center; max-width:1200px; margin:0 auto; padding:0 48px; }
.industry-nav-link { display:inline-block; padding:14px 18px; font-size:0.82rem; font-weight:500; color:var(--ink-light); text-decoration:none; white-space:nowrap; border-bottom:2px solid transparent; transition:color 0.15s, border-color 0.15s; letter-spacing:-0.01em; }
.industry-nav-link:hover { color:var(--ink); border-bottom-color:var(--green-mid); }
.industry-nav-link.active { color:var(--green); border-bottom-color:var(--green); font-weight:600; }
@media (max-width:768px) { .industry-nav-inner { padding:0 16px; } .industry-nav-link { padding:12px 10px; font-size:0.78rem; } }

/*partner-program*/
:root {
  --green: #078037;
  --green-bright: #09a866;
  --green-pale: #edfaf3;
  --green-mid: #b8ddc8;
  --ink: #0a1a10;
  --ink-mid: #3d5c47;
  --ink-light: #7e9e89;
  --ink-xlight: #b8cec0;
  --surface: #ffffff;
  --surface-2: #f7faf8;
  --surface-3: #f0f5f2;
  --border: #e2ede7;
  --border-strong: #c8ddd1;
  --shadow-sm: 0 1px 3px #f1f5f3, 0 1px 2px #f1f5f3;
  --shadow-md: 0 4px 16px #edf2ef, 0 2px 4px #f1f5f3;
  --shadow-lg: 0 20px 60px #e5ecе8, 0 8px 16px #edf2ef;
  --shadow-xl: 0 40px 100px #e0eae6, 0 16px 32px #edf2ef;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; max-width: 100%; overflow-x: hidden; }
body {
  font-family: "Plus Jakarta Sans", sans-serif;
  background: var(--surface);
  color: var(--ink);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }

/* NAV */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  height: 64px; display: flex; align-items: center;
  padding: 0 48px; justify-content: space-between;
  transition: box-shadow 0.3s;
}
.nav-logo img { height: 30px; width: auto; }
.nav-links { display: flex; align-items: center; gap: 32px; list-style: none; }
.nav-links a { font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; letter-spacing: -0.01em; transition: color 0.15s; }
.nav-links a:hover { color: var(--ink); }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.btn-nav-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); background: none; border: none; padding: 8px 16px; border-radius: 8px; cursor: pointer; text-decoration: none; transition: all 0.15s; }
.btn-nav-ghost:hover { color: var(--ink); background: var(--surface-3); }
.btn-nav-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 600; background: var(--green); color: white; border: none; padding: 9px 20px; border-radius: 8px; cursor: pointer; text-decoration: none; display: inline-block; transition: all 0.15s; letter-spacing: -0.01em; }
.btn-nav-primary:hover { background: var(--green-bright); transform: translateY(-1px); box-shadow: 0 4px 12px #a3d0b6; }

/* HAMBURGER */
.hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; padding: 8px; }
.hamburger span { display: block; width: 22px; height: 2px; background: var(--ink); border-radius: 2px; transition: all 0.3s; transform-origin: center; }
.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; top: 64px; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--border); padding: 20px 24px 28px; z-index: 99; box-shadow: 0 8px 24px #e5ecе8; flex-direction: column; gap: 4px; }
.mobile-menu.open { display: flex; }
.mobile-menu a { font-size: 1rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; padding: 12px 0; border-bottom: 1px solid var(--border); transition: color 0.15s; }
.mobile-menu a:hover { color: var(--green); }
.mobile-menu-actions { display: flex; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--border); }
.mobile-menu-actions a { border-bottom: none; padding: 0; flex: 1; text-align: center; }

/* SHARED ELEMENTS */
.eyebrow { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.eyebrow::before { content: ""; width: 16px; height: 2px; background: var(--green-bright); border-radius: 1px; }
h2.section-h { font-size: clamp(1.9rem, 3vw, 2.8rem); font-weight: 800; letter-spacing: -0.025em; line-height: 1.1; color: var(--ink); margin-bottom: 16px; }
h2.section-h .serif { font-family: "Fraunces", serif; font-weight: 600; font-style: italic; letter-spacing: -0.02em; color: var(--green); }
.section-p { font-size: 1rem; color: var(--ink-mid); line-height: 1.7; max-width: 520px; font-weight: 400; letter-spacing: -0.01em; }
.section-wrap { max-width: 1200px; margin: 0 auto; }
.check-icon { width: 18px; height: 18px; border-radius: 50%; background: var(--green-pale); border: 1.5px solid var(--green-mid); flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.check-icon svg { width: 8px; height: 8px; }

/* BTN */
.btn-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 700; background: var(--green); color: white; border: none; padding: 14px 28px; border-radius: 10px; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-primary:hover { background: var(--green-bright); transform: translateY(-2px); box-shadow: 0 8px 20px #a3d0b6; }
.btn-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 500; color: var(--ink-mid); background: none; border: 1.5px solid var(--border-strong); padding: 13px 24px; border-radius: 10px; cursor: pointer; text-decoration: none; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-ghost:hover { border-color: var(--ink-xlight); color: var(--ink); background: var(--surface-3); }

/* PAGE HERO */
.page-hero { padding: 120px 80px 80px; background: var(--surface); position: relative; overflow: hidden; border-bottom: 1px solid var(--border); }
.page-hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px); background-size: 60px 60px; opacity: 0.3; pointer-events: none; }
.page-hero-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; }
.page-hero h1 { font-size: clamp(2.4rem, 4vw, 3.6rem); font-weight: 800; line-height: 1.07; letter-spacing: -0.03em; color: var(--ink); margin-bottom: 20px; }
.page-hero h1 .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: var(--green); }
.page-hero-sub { font-size: 1.1rem; color: var(--ink-mid); line-height: 1.7; max-width: 560px; margin-bottom: 36px; }

/* FOOTER */
footer { background: #282c34; padding: 64px 80px 40px; }
.footer-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }
.footer-brand-desc { font-size: 0.85rem; color: rgba(255,255,255,0.5); line-height: 1.7; margin-top: 14px; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-col a { font-size: 0.938rem; color: rgba(255,255,255,0.55); text-decoration: none; font-weight: 400; transition: color 0.15s; }
.footer-col a:hover { color: #09a866; }
.footer-bottom { max-width: 1200px; margin: 0 auto; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 24px; display: flex; justify-content: space-between; align-items: center; }
.footer-bottom p { font-size: 0.78rem; color: rgba(255,255,255,0.3); }

/* MATERIAL ICONS */
.material-symbols-outlined { font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24; font-size: 18px; line-height: 1; display: inline-flex; align-items: center; vertical-align: middle; user-select: none; }

/* AOS */
.aos { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s ease; }
.aos.visible { opacity: 1; transform: none; }
.aos-delay-1 { transition-delay: 0.1s; }
.aos-delay-2 { transition-delay: 0.2s; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 768px) {
  nav { padding: 0 20px; height: 56px; }
  .nav-links { display: none; }
  .nav-actions .btn-nav-ghost, .nav-actions .btn-nav-primary { display: none; }
  .hamburger { display: flex; }
  .page-hero { padding: 90px 20px 60px; }
  footer { padding: 48px 20px 32px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
}
@media (max-width: 480px) {
  h2.section-h { font-size: 1.6rem; }
}


.partner-hero { max-width: 680px; }
.partner-hero-badge { display:inline-flex; align-items:center; gap:8px; font-size:0.72rem; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--green); background:var(--green-pale); border:1px solid var(--green-mid); padding:5px 12px 5px 8px; border-radius:100px; margin-bottom:24px; }
.badge-dot { width:6px; height:6px; background:var(--green-bright); border-radius:50%; animation:pulse 2s infinite; }

.partner-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:start; max-width:1200px; margin:0 auto; padding:80px; }
.benefit-list { display:flex; flex-direction:column; gap:20px; margin-bottom:40px; }
.benefit-item { display:flex; gap:16px; align-items:flex-start; }
.benefit-num { width:36px; height:36px; border-radius:50%; background:var(--green); color:white; font-size:0.85rem; font-weight:800; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.benefit-text strong { display:block; font-size:1.0rem; font-weight:700; color:var(--ink); letter-spacing:-0.02em; margin-bottom:3px; }
.benefit-text span { font-size:1.0rem; color:var(--ink-mid); line-height:1.7; font-weight: 400; }

.partner-card { background:var(--surface-2); border:1px solid var(--border); border-radius:20px; padding:36px; }
.partner-terms { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:32px; }
.pterm { background:white; border:1px solid var(--border); border-radius:12px; padding:18px; }
.pterm-num { font-size:1.8rem; font-weight:800; color:var(--green); letter-spacing:-0.03em; line-height:1; margin-bottom:4px; }
.pterm-lbl { font-size:0.72rem; color:var(--ink-light); font-weight:500; }
.availability-bar { background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:16px 20px; margin-bottom:24px; }
.avail-label { font-size:0.72rem; font-weight:700; color:var(--ink-light); letter-spacing:0.06em; text-transform:uppercase; margin-bottom:8px; }
.avail-track { height:8px; background:var(--border); border-radius:4px; overflow:hidden; margin-bottom:6px; }
.avail-fill { height:100%; width:30%; background:var(--green); border-radius:4px; }
.avail-note { font-size:0.72rem; color:var(--ink-light); }

.timeline-section { padding:80px; background:var(--surface-2); border-top:1px solid var(--border); }
.timeline { max-width:700px; margin:48px auto 0; display:flex; flex-direction:column; gap:0; }
.tl-item { display:flex; gap:20px; position:relative; }
.tl-item:not(:last-child) .tl-connector { position:absolute; left:17px; top:36px; bottom:-4px; width:2px; background:var(--border); z-index:0; }
.tl-dot { width:36px; height:36px; border-radius:50%; background:var(--green-pale); border:2px solid var(--green-mid); display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:0.8rem; font-weight:800; color:var(--green); position:relative; z-index:1; }
.tl-dot.done { background:var(--green); border-color:var(--green); color:white; }
.tl-body { padding-bottom:32px; }
.tl-week { font-size:0.89rem; font-weight:700; color:var(--ink-light); letter-spacing:0.08em; text-transform:uppercase; margin-bottom:4px; }
.tl-action { font-size:1.0rem; font-weight:700; color:var(--ink); letter-spacing:-0.02em; margin-bottom:4px; }
.tl-desc { font-size:1.0 rem; color:var(--ink-mid); line-height:1.7; font-weight: 400;}

.apply-section { padding:80px; /*background:#282c34;*/ background:#1f2933; }
.apply-inner { max-width:700px; margin:0 auto; text-align:center; }
.apply-form { background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1); border-radius:20px; padding:40px; margin-top:40px; text-align:left; }
.form-group { margin-bottom:20px; }
.form-label { display:block; font-size:0.8rem; font-weight:600; color:rgba(255,255,255,0.6); margin-bottom:6px; letter-spacing:-0.01em; }
.form-input { width:100%; background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.15); border-radius:8px; padding:12px 16px; font-family:"Plus Jakarta Sans",sans-serif; font-size:1.0rem; color:white; outline:none; transition:border-color 0.2s; }
.form-input:focus { border-color:rgba(255,255,255,0.4); }
.form-input::placeholder { color:rgba(255,255,255,0.25); }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-submit { width:100%; font-family:"Plus Jakarta Sans",sans-serif; font-size:1rem; font-weight:700; background:var(--green); color:white; border:none; padding:15px; border-radius:10px; cursor:pointer; transition:all 0.2s; margin-top:8px; letter-spacing:-0.01em; }
.form-submit:hover { background:var(--green-bright); transform:translateY(-1px); }

@media (max-width:1024px) { .partner-grid { grid-template-columns:1fr; gap:48px; padding:60px 40px; } }
@media (max-width:768px) {
  .partner-grid { padding:60px 20px; }
  .timeline-section, .apply-section { padding:60px 20px; }
  .form-grid { grid-template-columns:1fr; }
  .partner-terms { grid-template-columns:1fr 1fr; }
}


/* NAV DROPDOWN */
.nav-dropdown { position:relative; }
.nav-dropdown-trigger { display:flex; align-items:center; }
.nav-dropdown-menu {
  display:none; position:absolute; top:calc(100% + 12px); left:50%;
  transform:translateX(-50%); background:white;
  border:1.5px solid var(--border); border-radius:14px;
  padding:8px; min-width:200px; z-index:200;
  box-shadow:0 8px 32px rgba(0,0,0,0.08);
}
.nav-dropdown:hover .nav-dropdown-menu { display:block; }
.dropdown-item {
  display:block; padding:9px 14px; font-size:0.85rem; font-weight:500;
  color:var(--ink-mid); text-decoration:none; border-radius:8px;
  transition:background 0.12s, color 0.12s; white-space:nowrap;
}
.dropdown-item:hover { background:var(--surface-2); color:var(--green); }
.dropdown-parent { font-weight:700; color:var(--ink); }
.dropdown-divider { height:1px; background:var(--border); margin:4px 0; }


/* ── INDUSTRIES DROPDOWN ─────────────────────────── */
.nav-dropdown { position: relative; }
.nav-dropdown-trigger { display: flex; align-items: center; gap: 4px; cursor: pointer; }
.nav-dropdown-trigger svg { transition: transform 0.2s ease; flex-shrink: 0; }
.nav-dropdown:hover .nav-dropdown-trigger svg,
.nav-dropdown.open .nav-dropdown-trigger svg { transform: rotate(180deg); }
.nav-dropdown-menu {
  position: absolute; top: calc(100% + 12px); left: 50%;
  transform: translateX(-50%); min-width: 210px;
  background: #fff; border: 1px solid var(--border);
  border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,0.10);
  padding: 6px; opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease;
  transform: translateX(-50%) translateY(-4px); z-index: 200;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown.open .nav-dropdown-menu {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown-menu::before {
  content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 14px;
}
.dropdown-item {
  display: block; padding: 9px 14px; font-size: 0.85rem; font-weight: 500;
  color: var(--ink-mid); text-decoration: none; border-radius: 7px;
  border-left: 3px solid transparent;
  transition: background 0.14s, border-color 0.14s, color 0.14s;
  letter-spacing: -0.01em;
}
.dropdown-item:hover { background: var(--green-pale); border-left-color: var(--green); color: var(--ink); }
.dropdown-divider { height: 1px; background: var(--border); margin: 5px 6px; }
.dropdown-parent { font-weight: 600; color: var(--ink); font-size: 0.8rem; letter-spacing: 0.03em; text-transform: uppercase; }

/*contact*/
:root {
  --green: #078037;
  --green-bright: #09a866;
  --green-pale: #edfaf3;
  --green-mid: #b8ddc8;
  --ink: #0a1a10;
  --ink-mid: #3d5c47;
  --ink-light: #7e9e89;
  --ink-xlight: #b8cec0;
  --surface: #ffffff;
  --surface-2: #f7faf8;
  --surface-3: #f0f5f2;
  --border: #e2ede7;
  --border-strong: #c8ddd1;
  --shadow-sm: 0 1px 3px #f1f5f3, 0 1px 2px #f1f5f3;
  --shadow-md: 0 4px 16px #edf2ef, 0 2px 4px #f1f5f3;
  --shadow-lg: 0 20px 60px #e5ecе8, 0 8px 16px #edf2ef;
  --shadow-xl: 0 40px 100px #e0eae6, 0 16px 32px #edf2ef;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; max-width: 100%; overflow-x: hidden; }
body {
  font-family: "Plus Jakarta Sans", sans-serif;
  background: var(--surface);
  color: var(--ink);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }

/* NAV */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  height: 64px; display: flex; align-items: center;
  padding: 0 48px; justify-content: space-between;
  transition: box-shadow 0.3s;
}
.nav-logo img { height: 30px; width: auto; }
.nav-links { display: flex; align-items: center; gap: 32px; list-style: none; }
.nav-links a { font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; letter-spacing: -0.01em; transition: color 0.15s; }
.nav-links a:hover { color: var(--ink); }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.btn-nav-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); background: none; border: none; padding: 8px 16px; border-radius: 8px; cursor: pointer; text-decoration: none; transition: all 0.15s; }
.btn-nav-ghost:hover { color: var(--ink); background: var(--surface-3); }
.btn-nav-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 600; background: var(--green); color: white; border: none; padding: 9px 20px; border-radius: 8px; cursor: pointer; text-decoration: none; display: inline-block; transition: all 0.15s; letter-spacing: -0.01em; }
.btn-nav-primary:hover { background: var(--green-bright); transform: translateY(-1px); box-shadow: 0 4px 12px #a3d0b6; }

/* HAMBURGER */
.hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; padding: 8px; }
.hamburger span { display: block; width: 22px; height: 2px; background: var(--ink); border-radius: 2px; transition: all 0.3s; transform-origin: center; }
.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; top: 64px; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--border); padding: 20px 24px 28px; z-index: 99; box-shadow: 0 8px 24px #e5ecе8; flex-direction: column; gap: 4px; }
.mobile-menu.open { display: flex; }
.mobile-menu a { font-size: 1rem; font-weight: 500; color: var(--ink-mid); text-decoration: none; padding: 12px 0; border-bottom: 1px solid var(--border); transition: color 0.15s; }
.mobile-menu a:hover { color: var(--green); }
.mobile-menu-actions { display: flex; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--border); }
.mobile-menu-actions a { border-bottom: none; padding: 0; flex: 1; text-align: center; }

/* SHARED ELEMENTS */
.eyebrow { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.eyebrow::before { content: ""; width: 16px; height: 2px; background: var(--green-bright); border-radius: 1px; }
h2.section-h { font-size: clamp(1.9rem, 3vw, 2.8rem); font-weight: 800; letter-spacing: -0.025em; line-height: 1.1; color: var(--ink); margin-bottom: 16px; }
h2.section-h .serif { font-family: "Fraunces", serif; font-weight: 600; font-style: italic; letter-spacing: -0.02em; color: var(--green); }
.section-p { font-size: 1rem; color: var(--ink-mid); line-height: 1.7; max-width: 520px; font-weight: 400; letter-spacing: -0.01em; }
.section-wrap { max-width: 1200px; margin: 0 auto; }
.check-icon { width: 18px; height: 18px; border-radius: 50%; background: var(--green-pale); border: 1.5px solid var(--green-mid); flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.check-icon svg { width: 8px; height: 8px; }

/* BTN */
.btn-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 700; background: var(--green); color: white; border: none; padding: 14px 28px; border-radius: 10px; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-primary:hover { background: var(--green-bright); transform: translateY(-2px); box-shadow: 0 8px 20px #a3d0b6; }
.btn-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 500; color: var(--ink-mid); background: none; border: 1.5px solid var(--border-strong); padding: 13px 24px; border-radius: 10px; cursor: pointer; text-decoration: none; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-ghost:hover { border-color: var(--ink-xlight); color: var(--ink); background: var(--surface-3); }

/* PAGE HERO */
.page-hero { padding: 120px 80px 80px; background: var(--surface); position: relative; overflow: hidden; border-bottom: 1px solid var(--border); }
.page-hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px); background-size: 60px 60px; opacity: 0.3; pointer-events: none; }
.page-hero-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; }
.page-hero h1 { font-size: clamp(2.4rem, 4vw, 3.6rem); font-weight: 800; line-height: 1.07; letter-spacing: -0.03em; color: var(--ink); margin-bottom: 20px; }
.page-hero h1 .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: var(--green); }
.page-hero-sub { font-size: 1.1rem; color: var(--ink-mid); line-height: 1.7; max-width: 560px; margin-bottom: 36px; }

/* FOOTER */
footer { background: #282c34; padding: 64px 80px 40px; }
.footer-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }
.footer-brand-desc { font-size: 0.85rem; color: rgba(255,255,255,0.5); line-height: 1.7; margin-top: 14px; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-col a { font-size: 0.938rem; color: rgba(255,255,255,0.55); text-decoration: none; font-weight: 400; transition: color 0.15s; }
.footer-col a:hover { color: #09a866; }
.footer-bottom { max-width: 1200px; margin: 0 auto; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 24px; display: flex; justify-content: space-between; align-items: center; }
.footer-bottom p { font-size: 0.78rem; color: rgba(255,255,255,0.3); }

/* MATERIAL ICONS */
.material-symbols-outlined { font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24; font-size: 18px; line-height: 1; display: inline-flex; align-items: center; vertical-align: middle; user-select: none; }

/* AOS */
.aos { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s ease; }
.aos.visible { opacity: 1; transform: none; }
.aos-delay-1 { transition-delay: 0.1s; }
.aos-delay-2 { transition-delay: 0.2s; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 768px) {
  nav { padding: 0 20px; height: 56px; }
  .nav-links { display: none; }
  .nav-actions .btn-nav-ghost, .nav-actions .btn-nav-primary { display: none; }
  .hamburger { display: flex; }
  .page-hero { padding: 90px 20px 60px; }
  footer { padding: 48px 20px 32px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
}
@media (max-width: 480px) {
  h2.section-h { font-size: 1.6rem; }
}


.why-hero { max-width: 640px; }
.before-after { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 1200px; margin: 64px auto; }
.ba-card { border-radius: 16px; padding: 36px; }
.ba-card.before { background: var(--surface-2); border: 1px solid var(--border); }
.ba-card.after { background: #078037; }
.ba-label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 20px; }
.ba-card.before .ba-label { color: #ef4444; }
.ba-card.after .ba-label { color: rgba(255,255,255,0.6); }
.ba-list { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.ba-list li { display: flex; align-items: flex-start; gap: 10px; font-size: 1.0rem; line-height: 1.55; }
.ba-card.before .ba-list li { color: var(--ink); }
.ba-card.after .ba-list li { color: rgba(255,255,255,0.85); }
.ba-dot-red { width: 8px; height: 8px; border-radius: 50%; background: #ef4444; flex-shrink: 0; margin-top: 5px; }
.ba-dot-green { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.6); flex-shrink: 0; margin-top: 5px; }

.story-section { padding: 80px; background: var(--surface); }
.story-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.story-quote { font-family: "Fraunces", serif; font-size: clamp(1.2rem, 2vw, 1.6rem); font-style: italic; color: var(--ink); line-height: 1.55; margin-bottom: 28px; font-weight: 400; letter-spacing: -0.01em; }
.story-quote em { color: var(--green); font-style: normal; font-weight: 600; }
.story-stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.story-stat { background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 18px; }
.story-stat-num { font-size: 1.5rem; font-weight: 800; color: var(--green); letter-spacing: -0.03em; line-height: 1; margin-bottom: 4px; }
.story-stat-lbl { font-size: 0.78rem; color: var(--ink-light); font-weight: 500; line-height: 1.4; }
.story-cards { display: flex; flex-direction: column; gap: 16px; }
.story-card { background: var(--surface-2); border: 1px solid var(--border); border-radius: 14px; padding: 24px; transition: all 0.2s; }
.story-card:hover { border-color: var(--green-mid); box-shadow: var(--shadow-sm); }
.story-card-title { font-size: 1.0rem; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 6px; }
.story-card-desc { font-size: 0.98rem; color: var(--ink-mid); line-height: 1.6; }

.results-section { padding: 80px; background: var(--surface-2); border-top: 1px solid var(--border); }
.results-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.result-card { background: white; border: 1px solid var(--border); border-radius: 16px; padding: 32px; text-align: center; }
.result-num { font-size: 2.8rem; font-weight: 800; color: var(--green); letter-spacing: -0.04em; line-height: 1; margin-bottom: 6px; }
.result-label { font-size: 0.938rem; font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.result-desc { font-size: 0.8rem; color: var(--ink-light); line-height: 1.55; }

.testimonials-section { padding: 80px; background: #282c34; }
.testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1200px; margin: 48px auto 0; }
.tcard { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 14px; padding: 28px; }
.tcard-quote { font-size: 1.0rem; color: rgba(255,255,255,0.95); line-height: 1.65; margin-bottom: 16px; font-style: italic; }
.tcard-name { font-size: 0.8rem; font-weight: 700; color: var(--green-bright); }
.tcard-role { font-size: 0.72rem; color: rgba(255,255,255,0.35); margin-top: 2px; }

.why-cta { padding: 80px; background: #078037; text-align: center; }
.why-cta h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 800; color: white; letter-spacing: -0.025em; margin-bottom: 16px; }
.why-cta p { color: rgba(255,255,255,0.75); font-size: 1rem; margin-bottom: 36px; max-width: 480px; margin-left: auto; margin-right: auto; }

@media (max-width: 1024px) { .story-inner { grid-template-columns: 1fr; gap: 48px; } .testimonials-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) {
  .before-after { grid-template-columns: 1fr; margin: 40px 20px; }
  .story-section, .results-section, .testimonials-section, .why-cta { padding: 60px 20px; }
  .results-grid { grid-template-columns: 1fr; }
  .story-stat-grid { grid-template-columns: 1fr 1fr; }
}


/* NAV DROPDOWN */
.nav-dropdown { position:relative; }
.nav-dropdown-trigger { display:flex; align-items:center; }
.nav-dropdown-menu {
  display:none; position:absolute; top:calc(100% + 12px); left:50%;
  transform:translateX(-50%); background:white;
  border:1.5px solid var(--border); border-radius:14px;
  padding:8px; min-width:200px; z-index:200;
  box-shadow:0 8px 32px rgba(0,0,0,0.08);
}
.nav-dropdown:hover .nav-dropdown-menu { display:block; }
.dropdown-item {
  display:block; padding:9px 14px; font-size:0.85rem; font-weight:500;
  color:var(--ink-mid); text-decoration:none; border-radius:8px;
  transition:background 0.12s, color 0.12s; white-space:nowrap;
}
.dropdown-item:hover { background:var(--surface-2); color:var(--green); }
.dropdown-parent { font-weight:700; color:var(--ink); }
.dropdown-divider { height:1px; background:var(--border); margin:4px 0; }

/* ── CONTACT PAGE ── */
.page-hero { padding: 120px 80px 80px; background: var(--surface-2); position: relative; overflow: hidden; border-bottom: 1px solid var(--border); }
.page-hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px); background-size: 60px 60px; opacity: 0.35; pointer-events: none; }
.page-hero-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; }
.page-hero h1 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; color: var(--ink); letter-spacing: -0.03em; line-height: 1.1; margin-bottom: 18px; }
.contact-section { padding: 80px 80px 100px; background: var(--surface); }
.contact-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1.4fr; gap: 80px; align-items: start; }
.contact-info { }
.ci-item { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 28px; }
.ci-icon { width: 40px; height: 40px; background: var(--green-pale); border: 1px solid var(--green-mid); border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--green); font-size: 1.1rem; }
.ci-label { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--ink-light); margin-bottom: 4px; }
.ci-value { font-size: 1.0rem; color: #000; line-height: 1.7; }
.contact-form-wrap { background: var(--surface-2); border: 1px solid var(--border); border-radius: 20px; padding: 40px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-group { display: flex; flex-direction: column; gap: 6px; margin-bottom: 18px; }
.form-group label { font-size: 0.82rem; font-weight: 600; color: var(--ink); letter-spacing: -0.01em; }
.form-group input, .form-group select, .form-group textarea { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; color: var(--ink); background: var(--surface); border: 1.5px solid var(--border); border-radius: 10px; padding: 11px 14px; outline: none; transition: border-color 0.15s; width: 100%; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color: var(--green); }
.form-group textarea { resize: vertical; }
.req { color: var(--green); }
.btn-submit { display: block; width: 100%; padding: 14px 20px; background: var(--green); color: white; font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 700; border: none; border-radius: 10px; cursor: pointer; letter-spacing: -0.01em; transition: background 0.15s, transform 0.15s; text-align: center; }
.btn-submit:hover { background: var(--green-bright); transform: translateY(-1px); }
.form-success { display: none; text-align: center; padding: 60px 24px; }
.form-success svg { margin: 0 auto 16px; }
@media (max-width: 1024px) { .contact-inner { grid-template-columns: 1fr; gap: 48px; } }
@media (max-width: 768px) { .page-hero { padding: 100px 20px 60px; } .contact-section { padding: 60px 20px 80px; } .form-row { grid-template-columns: 1fr; } .contact-form-wrap { padding: 24px; } }

/*compare-swept*/
:root {
  --green: #078037;
  --green-bright: #09a866;
  --green-pale: #edfaf3;
  --green-mid: #b8ddc8;
  --ink: #0a1a10;
  --ink-mid: #3d5c47;
  --ink-light: #7e9e89;
  --ink-xlight: #b8cec0;
  --surface: #ffffff;
  --surface-2: #f7faf8;
  --surface-3: #f0f5f2;
  --border: #e2ede7;
  --border-strong: #c8ddd1;
  --shadow-sm: 0 1px 3px #f1f5f3, 0 1px 2px #f1f5f3;
  --shadow-md: 0 4px 16px #edf2ef, 0 2px 4px #f1f5f3;
  --shadow-lg: 0 20px 60px #e5ecе8, 0 8px 16px #edf2ef;
  --shadow-xl: 0 40px 100px #e0eae6, 0 16px 32px #edf2ef;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; max-width: 100%; overflow-x: hidden; }
body {
  font-family: "Plus Jakarta Sans", sans-serif;
  background: var(--surface);
  color: var(--ink);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }

/* NAV */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  height: 64px; display: flex; align-items: center;
  /*padding: 0 48px;*/ padding: 0 250px; justify-content: space-between;
  transition: box-shadow 0.3s;
}
.nav-logo img { height: 45px; width: auto; }
.nav-links { display: flex; align-items: center; gap: 32px; list-style: none; }
.nav-links a { font-size: 1.0rem; font-weight: normal; color: var(--ink-mid); text-decoration: none; letter-spacing: -0.01em; transition: color 0.15s; }
.nav-links a:hover { color: var(--ink); }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.btn-nav-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 500; color: var(--ink-mid); background: none; border: none; padding: 8px 16px; border-radius: 8px; cursor: pointer; text-decoration: none; transition: all 0.15s; }
.btn-nav-ghost:hover { color: var(--ink); background: var(--surface-3); }
.btn-nav-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.938rem; font-weight: 600; background: var(--green); color: white; border: none; padding: 9px 20px; border-radius: 8px; cursor: pointer; text-decoration: none; display: inline-block; transition: all 0.15s; letter-spacing: -0.01em; }
.btn-nav-primary:hover { background: var(--green-bright); transform: translateY(-1px); box-shadow: 0 4px 12px #a3d0b6; }

/* HAMBURGER */
.hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; padding: 8px; }
.hamburger span { display: block; width: 22px; height: 2px; background: var(--ink); border-radius: 2px; transition: all 0.3s; transform-origin: center; }
.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; top: 64px; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--border); padding: 20px 24px 28px; z-index: 99; box-shadow: 0 8px 24px #e5ecе8; flex-direction: column; gap: 4px; }
.mobile-menu.open { display: flex; }
.mobile-menu a { font-size: 1.3rem; font-weight: 400; color: #000; text-decoration: none; padding: 12px 0; border-bottom: 1px solid var(--border); transition: color 0.15s; }
.mobile-menu a:hover { color: var(--green); }
.mobile-menu-actions { display: flex; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 0px solid var(--border); }
.mobile-menu-actions a { /*border-bottom: none;*/ border: 1px solid #48af4b; padding: 8px; flex: 1; text-align: center; }

/* SHARED ELEMENTS */
.eyebrow { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.eyebrow::before { content: ""; width: 16px; height: 2px; background: var(--green-bright); border-radius: 1px; }
h2.section-h { font-size: clamp(1.9rem, 3vw, 2.8rem); font-weight: 800; letter-spacing: -0.025em; line-height: 1.1; color: var(--ink); margin-bottom: 16px; }
h2.section-h .serif { font-family: "Fraunces", serif; font-weight: 600; font-style: italic; letter-spacing: -0.02em; color: var(--green); }
.section-p { font-size: 1rem; color: var(--ink-mid); line-height: 1.7; max-width: 520px; font-weight: 400; letter-spacing: -0.01em; }
.section-wrap { max-width: 1200px; margin: 0 auto; }
.check-icon { width: 18px; height: 18px; border-radius: 50%; background: var(--green-pale); border: 1.5px solid var(--green-mid); flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.check-icon svg { width: 8px; height: 8px; }

/* BTN */
.btn-primary { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 700; background: var(--green); color: white; border: none; padding: 14px 28px; border-radius: 10px; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-primary:hover { background: var(--green-bright); transform: translateY(-2px); box-shadow: 0 8px 20px #a3d0b6; }
.btn-ghost { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.0rem; font-weight: 500; color: var(--ink-mid); background: none; border: 1.5px solid var(--border-strong); padding: 13px 24px; border-radius: 10px; cursor: pointer; text-decoration: none; transition: all 0.2s; letter-spacing: -0.01em; }
.btn-ghost:hover { border-color: var(--ink-xlight); color: var(--ink); background: var(--surface-3); }

/* PAGE HERO */
.page-hero { padding: 120px 80px 80px; background: var(--surface); position: relative; overflow: hidden; border-bottom: 1px solid var(--border); }
.page-hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px); background-size: 60px 60px; opacity: 0.3; pointer-events: none; }
.page-hero-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; }
.page-hero h1 { font-size: clamp(2.4rem, 4vw, 3.6rem); font-weight: 800; line-height: 1.07; letter-spacing: -0.03em; color: var(--ink); margin-bottom: 20px; }
.page-hero h1 .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: var(--green); }
.page-hero-sub { font-size: 1.1rem; color: var(--ink-mid); line-height: 1.7; max-width: 560px; margin-bottom: 36px; }

/* FOOTER */
footer { background: #272c35; padding: 64px 80px 40px; }
.footer-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }
.footer-brand-desc { font-size: 1.0rem; color: #fff; line-height: 1.7; margin-top: 14px; }
.footer-col h4 { font-size: 1.2rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #fff; margin-bottom: 16px; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-col a { font-size: 1.0rem; color: #fff; text-decoration: none; font-weight: 400; transition: color 0.15s; }
.footer-col a:hover { color: #09a866; }
.footer-bottom { max-width: 1200px; margin: 0 auto; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 24px; display: flex; justify-content: space-between; align-items: center; }
.footer-bottom p { font-size: 0.95rem; color: #fff; }

/* MATERIAL ICONS */
.material-symbols-outlined { font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24; font-size: 18px; line-height: 1; display: inline-flex; align-items: center; vertical-align: middle; user-select: none; }

/* AOS */
.aos { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s ease; }
.aos.visible { opacity: 1; transform: none; }
.aos-delay-1 { transition-delay: 0.1s; }
.aos-delay-2 { transition-delay: 0.2s; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes slideDown { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 768px) {
  nav { padding: 0 20px; height: 56px; }
  .nav-links { display: none; }
  .nav-actions .btn-nav-ghost, .nav-actions .btn-nav-primary { display: none; }
  .hamburger { display: flex; }
  .page-hero { padding: 90px 20px 60px; }
  footer { padding: 48px 20px 32px; }
  .footer-grid { grid-template-columns: 1fr; gap: 40px; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
}
@media (max-width: 480px) {
  h2.section-h { font-size: 1.6rem; }
}


.compare-hero { max-width: 680px; }
.vs-badge { display:inline-flex; align-items:center; gap:10px; background:var(--surface-2); border:1px solid var(--border); border-radius:100px; padding:6px 16px 6px 6px; margin-bottom:28px; }
.vs-badge-logos { display:flex; align-items:center; gap:0; }
.logo-bubble { width:32px; height:32px; border-radius:50%; background:white; border:2px solid var(--border); display:flex; align-items:center; justify-content:center; font-size:0.7rem; font-weight:800; }
.logo-bubble.pt { background:var(--green); color:white; margin-right:-8px; z-index:1; }
.logo-bubble.ct { background:#1976d2; color:white; }
.vs-badge-label { font-size:0.78rem; font-weight:600; color:var(--ink-mid); }

.verdict-section { padding:80px; background:var(--surface-2); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.verdict-inner { max-width:1100px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.verdict-card { border-radius:16px; padding:36px; }
.verdict-card.winner { background:var(--green-pale); border:2px solid var(--green-mid); }
.verdict-card.loser { background:var(--surface); border:1px solid var(--border); }
.verdict-label { font-size:0.68rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; margin-bottom:12px; }
.verdict-card.winner .verdict-label { color:var(--green); }
.verdict-card.loser .verdict-label { color:var(--ink-light); }
.verdict-name { font-size:1.5rem; font-weight:800; color:var(--ink); letter-spacing:-0.02em; margin-bottom:16px; }
.verdict-desc { font-size:1.0rem; color:var(--ink-mid); line-height:1.65; margin-bottom:20px; }
.verdict-list { list-style:none; display:flex; flex-direction:column; gap:8px; }
.verdict-list li { font-size:0.85rem; display:flex; align-items:flex-start; gap:8px; }
.verdict-list.pros li { color:var(--ink-mid); }
.verdict-list.cons li { color:var(--ink-light); }
.verdict-list .vl-dot { width:6px; height:6px; border-radius:50%; flex-shrink:0; margin-top:5px; }
.verdict-list.pros .vl-dot { background:var(--green); }
.verdict-list.cons .vl-dot { background:#ef4444; }

.compare-table-section { padding:80px; background:var(--surface); }
.ctable { max-width:1100px; margin:48px auto 0; border:1px solid var(--border); border-radius:16px; overflow:hidden; }
.ctable table { width:100%; border-collapse:collapse; background:white; }
.ctable th { padding:20px 24px; text-align:left; font-size:0.8rem; font-weight:700; letter-spacing:0.04em; text-transform:uppercase; color:var(--ink-light); background:var(--surface-2); border-bottom:1px solid var(--border); }
.ctable th.highlight { background:var(--green-pale); color:var(--green); }
.ctable td { padding:16px 24px; font-size:0.938rem; color:var(--ink-mid); border-bottom:1px solid var(--border); vertical-align:top; line-height:1.5; }
.ctable td.highlight { background:#fafff8; }
.ctable tr:last-child td { border-bottom:none; }
.ctable tr:hover td { background:var(--surface-2); }
.ctable tr:hover td.highlight { background:#f3faf4; }
.ctable .section-row td { font-weight:700; font-size:0.78rem; text-transform:uppercase; letter-spacing:0.04em; color:var(--ink); background:var(--surface-2); padding:10px 24px; }
.ctable .section-row td.highlight { background:var(--green-pale); }
.win { color:var(--green); font-weight:600; }
.neutral { color:var(--ink-mid); }
.lose { color:#ef4444; font-weight:600; }

.switch-section { padding:80px; background:#078037; text-align:center; }
.switch-section h2 { font-size:clamp(1.8rem,3vw,2.6rem); font-weight:800; color:white; letter-spacing:-0.025em; margin-bottom:16px; }
.switch-section p { color:rgba(255,255,255,0.75); font-size:1rem; margin-bottom:36px; max-width:520px; margin-left:auto; margin-right:auto; }

@media (max-width:768px) {
  .verdict-inner { grid-template-columns:1fr; }
  .verdict-section, .compare-table-section, .switch-section { padding:60px 20px; }
  .ctable { overflow-x:auto; }
}

/* NEW PAGE Partner*/

/* Hero urgency card */
.hero-urgency-card {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 28px;
  min-width: 260px;
  flex-shrink: 0;
}

/* AOS */
.aos { opacity: 0; transform: translateY(18px); transition: opacity 0.6s ease, transform 0.6s ease; }
.aos.visible { opacity: 1; transform: none; }
.aos-delay-1 { transition-delay: 0.1s; }
.aos-delay-2 { transition-delay: 0.2s; }
.aos-delay-3 { transition-delay: 0.3s; }

/* ══════════════════════════════════════
   WHO THIS IS FOR (Qualifier strip)
══════════════════════════════════════ */
.qualifier-strip {
  background: #078037;/*#078037 #1f2933*/
  padding: 28px 80px;
}
.qualifier-inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: center; gap: 48px; flex-wrap: wrap;
}
.qualifier-label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: #fff; white-space: nowrap; }
.qualifier-items { display: flex; gap: 32px; flex-wrap: wrap; }
.qualifier-item { display: flex; align-items: center; gap: 10px; }
.qualifier-check { width: 20px; height: 20px; border-radius: 50%; background: #fff; border: 1.5px solid #078037; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.qualifier-check svg { width: 8px; height: 8px; }
.qualifier-text { font-size: 0.85rem; color: #fff; font-weight: 500; }

/* ══════════════════════════════════════
   PAIN SECTION
══════════════════════════════════════ */
.pain-section {
  padding: 80px;
  background: var(--surface-2);
  border-bottom: 1px solid var(--border);
}
.pain-grid {
  max-width: 1200px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 24px;
  margin-top: 48px;
}
.pain-card {
  background: white;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 28px;
  position: relative;
  overflow: hidden;
}
.pain-card::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, #e53e3e, #fc8181);
}
.pain-card.solved::before {
  background: linear-gradient(90deg, var(--green), var(--green-bright));
}
.pain-tag { font-size: 0.65rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #e53e3e; background: #fff5f5; border: 1px solid #fed7d7; border-radius: 100px; padding: 3px 10px; display: inline-block; margin-bottom: 16px; }
.pain-card.solved .pain-tag { color: var(--green); background: var(--green-pale); border-color: var(--green-mid); }
.pain-scenario { font-size: 0.95rem; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 8px; line-height: 1.3; }
.pain-detail { font-size: 15px; color: var(--ink-mid); line-height: 1.7; font-weight: 400;}
.pain-quote {
  font-size: 0.85rem; color: var(--ink-mid); font-style: italic;
  background: var(--surface-2); border-left: 3px solid var(--border-strong);
  border-radius: 0 8px 8px 0; padding: 12px 16px; margin-top: 16px;
  line-height: 1.6;
}

/* ══════════════════════════════════════
   FOUNDER STORY
══════════════════════════════════════ */
.Partner-founder-section {
  padding: 80px;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}
.founder-inner {
  max-width: 1200px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center;
}
.founder-visual {
  position: relative;
}
.founder-credential-card {
  background: white;
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 32px;
  box-shadow: var(--shadow-md);
}
.founder-avatar-row { display: flex; align-items: center; gap: 16px; margin-bottom: 24px; }
.founder-avatar { width: 56px; height: 56px; border-radius: 50%; background: var(--green); display: flex; align-items: center; justify-content: center; font-size: 1.4rem; font-weight: 800; color: white; letter-spacing: -0.02em; flex-shrink: 0; }
.founder-name { font-size: 1rem; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; }
.founder-title { font-size: 14px; color: var(--ink-mid); margin-top: 2px; font-weight: 400;}
.credential-list { display: flex; flex-direction: column; gap: 12px; }
.credential-item { display: flex; align-items: flex-start; gap: 12px; }
.cred-icon { width: 32px; height: 32px; border-radius: 8px; background: var(--green-pale); border: 1px solid var(--green-mid); display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 0.9rem; }
.cred-text strong { display: block; font-size: 0.85rem; font-weight: 700; color: var(--ink); letter-spacing: -0.01em; }
.cred-text span { font-size: 14px; color: var(--ink-light); font-weight: 400;}
.founder-ops-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 24px; }
.ops-stat { background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 16px; }
.ops-stat-num { font-size: 1.4rem; font-weight: 800; color: var(--green); letter-spacing: -0.03em; }
.ops-stat-lbl { font-size: 14px; color: var(--ink-mid); margin-top: 2px; font-weight: 400;}

.founder-copy h2 { font-size: clamp(1.8rem, 2.8vw, 2.4rem); font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; color: var(--ink); margin-bottom: 20px; }
.founder-copy h2 .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: var(--green); }
.founder-copy p { font-size: 0.95rem; color: var(--ink-mid); line-height: 1.75; margin-bottom: 16px; }
.founder-copy strong { color: var(--ink); font-weight: 700; }

/* ══════════════════════════════════════
   PARTNER FOUNDER (SCOPED FIX)
══════════════════════════════════════ */

.partner-founder-section {
  padding: 80px;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}

.partner-founder-section .founder-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

/* LEFT CARD */
.partner-founder-section .founder-credential-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 32px;
  box-shadow: var(--shadow-md);
}

/* FIX WORDPRESS IMAGE/EMOJI SHIFT */
.partner-founder-section .cred-icon img {
  width: 16px;
  height: 16px;
  display: block;
}

/* TYPOGRAPHY FIX (WP override issue) */
.partner-founder-section .founder-copy h2 {
  font-size: clamp(1.8rem, 2.8vw, 2.4rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.1;
  color: var(--ink);
  margin-bottom: 20px;
}

.partner-founder-section .founder-copy p {
  font-size: 0.95rem;
  color: var(--ink-mid);
  line-height: 1.75;
  margin-bottom: 16px;
}

/* FIX EXTRA WIDTH / ALIGN ISSUE */
.partner-founder-section .founder-copy {
  max-width: 520px;
}

/* MOBILE FIX */
@media (max-width: 768px) {
  .partner-founder-section {
    padding: 60px 20px;
  }

  .partner-founder-section .founder-inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .partner-founder-section .founder-copy {
    max-width: 100%;
  }
}

/* ══════════════════════════════════════
   BENEFITS
══════════════════════════════════════ */
.benefits-section {
  padding: 80px;
  background: var(--surface-2);
  border-bottom: 1px solid var(--border);
}
.benefits-grid {
  max-width: 1200px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start;
}
.benefit-list { display: flex; flex-direction: column; gap: 20px; margin-bottom: 40px; }
.benefit-item { display: flex; gap: 16px; align-items: flex-start; }
.benefit-num { width: 36px; height: 36px; border-radius: 50%; background: var(--green); color: white; font-size: 0.85rem; font-weight: 800; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.benefit-text strong { display: block; font-size: 0.95rem; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 3px; }
.benefit-text span { font-size: 0.85rem; color: var(--ink-mid); line-height: 1.55; }

/* Program card */
.partner-card { background: white; border: 1px solid var(--border); border-radius: 20px; padding: 36px; box-shadow: var(--shadow-md); }
.partner-terms { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 24px; }
.pterm { background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; padding: 18px; }
.pterm-num { font-size: 1.8rem; font-weight: 800; color: var(--green); letter-spacing: -0.03em; line-height: 1; margin-bottom: 4px; }
.pterm-lbl { font-size: 0.72rem; color: var(--ink-light); font-weight: 500; }

/* Pricing timeline */
.pricing-timeline { display: flex; flex-direction: column; gap: 0; margin-bottom: 24px; }
.pricing-phase { display: flex; gap: 16px; position: relative; }
.pricing-phase:not(:last-child)::after {
  content: ""; position: absolute; left: 15px; top: 32px; bottom: -4px;
  width: 2px; background: var(--border);
}
.pricing-dot { width: 32px; height: 32px; border-radius: 50%; background: var(--green-pale); border: 2px solid var(--green-mid); display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 0.72rem; font-weight: 800; color: var(--green); position: relative; z-index: 1; }
.pricing-dot.active { background: var(--green); border-color: var(--green); color: white; }
.pricing-body { padding-bottom: 20px; }
.pricing-period { font-size: 0.68rem; font-weight: 700; color: var(--ink-light); letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 2px; }
.pricing-amount { font-size: 0.9rem; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; }
.pricing-amount .highlight { color: var(--green); }

.availability-bar { background: var(--surface-2); border: 1px solid var(--border); border-radius: 10px; padding: 16px 20px; margin-bottom: 20px; }
.avail-label { font-size: 0.72rem; font-weight: 700; color: var(--ink-light); letter-spacing: 0.06em; text-transform: uppercase; margin-bottom: 8px; }
.avail-track { height: 8px; background: var(--border); border-radius: 4px; overflow: hidden; margin-bottom: 6px; }
.avail-fill { height: 100%; width: 20%; background: var(--green); border-radius: 4px; }
.avail-note { font-size: 0.72rem; color: var(--ink-light); }

/* ══════════════════════════════════════
   TRUST / LEGAL
══════════════════════════════════════ */
.trust-section {
  padding: 80px;
  background: #1f2933;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.trust-inner { max-width: 1200px; margin: 0 auto; }
.trust-eyebrow { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green-bright); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.trust-eyebrow::before { content: ""; width: 16px; height: 2px; background: var(--green-bright); border-radius: 1px; }
.trust-section h2 { font-size: clamp(1.8rem, 2.8vw, 2.4rem); font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; color: #ffffff; margin-bottom: 12px; }
.trust-section h2 .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: #9ecf95; }
.trust-subtitle { font-size: 0.95rem; color: rgba(255,255,255,0.5); max-width: 560px; line-height: 1.7; margin-bottom: 48px; }
.trust-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.trust-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 16px;
  padding: 28px;
  transition: background 0.2s;
}
.trust-card:hover { background: rgba(255,255,255,0.07); }
.trust-card-icon { font-size: 1.4rem; margin-bottom: 14px; }
.trust-card h3 { font-size: 0.95rem; font-weight: 700; color: white; letter-spacing: -0.02em; margin-bottom: 8px; }
.trust-card p { font-size: 0.82rem; color: rgba(255,255,255,0.5); line-height: 1.65; }

/* ══════════════════════════════════════
   FEATURE LIST
══════════════════════════════════════ */
.features-section {
  padding: 80px;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}
.features-inner { max-width: 1200px; margin: 0 auto; }
.feature-checklist {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 40px;
}
.feature-check-item {
  display: flex; align-items: center; gap: 12px;
  background: var(--surface-2); border: 1px solid var(--border);
  border-radius: 10px; padding: 14px 16px;
}
.feature-check-icon { width: 22px; height: 22px; border-radius: 50%; background: var(--green-pale); border: 1.5px solid var(--green-mid); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.feature-check-icon svg { width: 9px; height: 9px; }
.feature-check-text { font-size: 0.82rem; font-weight: 600; color: var(--ink); letter-spacing: -0.01em; }

/* ══════════════════════════════════════
   WHAT WE ASK (reframed as co-builder)
══════════════════════════════════════ */
.cobuilder-section {
  padding: 80px;
  background: var(--surface-2);
  border-bottom: 1px solid var(--border);
}
.cobuilder-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.cobuilder-items { display: flex; flex-direction: column; gap: 20px; margin-top: 32px; }
.cobuilder-item { display: flex; gap: 16px; align-items: flex-start; }
.cobuilder-item-icon { width: 40px; height: 40px; border-radius: 10px; background: var(--green-pale); border: 1px solid var(--green-mid); display: flex; align-items: center; justify-content: center; font-size: 1rem; flex-shrink: 0; }
.cobuilder-item-text strong { display: block; font-size: 0.95rem; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 3px; }
.cobuilder-item-text span { font-size: 0.82rem; color: var(--ink-mid); line-height: 1.6; }
.cobuilder-right { }
.cobuilder-quote-block {
  background: white;
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 36px;
  box-shadow: var(--shadow-md);
}
.cobuilder-quote-block p { font-size: 1rem; color: var(--ink-mid); line-height: 1.75; font-style: italic; margin-bottom: 20px; }
.cobuilder-sig { display: flex; align-items: center; gap: 12px; }
.cobuilder-sig-avatar { width: 40px; height: 40px; border-radius: 50%; background: var(--green); display: flex; align-items: center; justify-content: center; font-size: 0.9rem; font-weight: 800; color: white; flex-shrink: 0; }
.cobuilder-sig-name { font-size: 0.85rem; font-weight: 700; color: var(--ink); }
.cobuilder-sig-title { font-size: 0.75rem; color: var(--ink-light); }

/* ══════════════════════════════════════
   TIMELINE
══════════════════════════════════════ */
.timeline-section { padding: 80px; background: var(--surface); border-bottom: 1px solid var(--border); }
.timeline { max-width: 700px; margin: 48px auto 0; display: flex; flex-direction: column; gap: 0; }
.tl-item { display: flex; gap: 20px; position: relative; }
.tl-item:not(:last-child) .tl-connector { position: absolute; left: 17px; top: 36px; bottom: -4px; width: 2px; background: var(--border); z-index: 0; }
.tl-dot { width: 36px; height: 36px; border-radius: 50%; background: var(--green-pale); border: 2px solid var(--green-mid); display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 0.8rem; font-weight: 800; color: var(--green); position: relative; z-index: 1; }
.tl-dot.done { background: var(--green); border-color: var(--green); color: white; }
.tl-body { padding-bottom: 32px; }
.tl-week { font-size: 14px; font-weight: 700; color: var(--ink-mid); letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 4px; }
.tl-action { font-size: 0.95rem; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; margin-bottom: 4px; }
.tl-desc { font-size: 0.85rem; color: var(--ink-mid); line-height: 1.55; }

/* ══════════════════════════════════════
   RISK REVERSAL BAR
══════════════════════════════════════ */
.risk-bar {
  background: var(--green-pale);
  border-top: 1px solid var(--green-mid);
  border-bottom: 1px solid var(--green-mid);
  padding: 24px 80px;
}
.risk-bar-inner { max-width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: center; gap: 40px; flex-wrap: wrap; }
.risk-item { display: flex; align-items: center; gap: 10px; }
.risk-icon { font-size: 1rem; }
.risk-text { font-size: 0.85rem; font-weight: 600; color: var(--ink-mid); }
.risk-divider { width: 1px; height: 20px; background: var(--green-mid); }

/* ══════════════════════════════════════
   FAQ
══════════════════════════════════════ */
.faq-section { padding: 80px; background: var(--surface-2); border-bottom: 1px solid var(--border); }
.faq-inner { max-width: 800px; margin: 0 auto; }
.faq-list { margin-top: 40px; display: flex; flex-direction: column; gap: 0; }
.faq-item { border-bottom: 1px solid var(--border); }
.faq-q {
  width: 100%; background: none; border: none;
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 0; cursor: pointer; text-align: left;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 0.95rem; font-weight: 700; color: var(--ink);
  letter-spacing: -0.02em; gap: 16px;
  transition: color 0.15s;
}
.faq-q:hover { color: var(--green); }
.faq-q svg { flex-shrink: 0; transition: transform 0.25s; }
.faq-item.open .faq-q svg { transform: rotate(45deg); }
.faq-a { display: none; font-size: 0.875rem; color: var(--ink-mid); line-height: 1.7; padding-bottom: 20px; }
.faq-item.open .faq-a { display: block; }

/* ══════════════════════════════════════
   APPLY FORM
══════════════════════════════════════ */
/*.apply-section { padding: 80px; background: #2e3d37; }*/
.apply-inner { max-width: 700px; margin: 0 auto; text-align: center; }
.apply-form { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 20px; padding: 40px; margin-top: 40px; text-align: left; }
.form-step { display: none; }
.form-step.active { display: block; }
.form-step-header { margin-bottom: 24px; }
.form-step-label { font-size: 0.7rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(255,255,255,0.35); margin-bottom: 6px; }
.form-step-title { font-size: 1rem; font-weight: 700; color: white; letter-spacing: -0.02em; }
.form-progress { display: flex; gap: 6px; margin-bottom: 32px; }
.form-progress-dot { height: 3px; border-radius: 2px; flex: 1; background: rgba(255,255,255,0.15); transition: background 0.3s; }
.form-progress-dot.done { background: var(--green); }
.form-progress-dot.active { background: var(--green-bright); }
.form-group { margin-bottom: 18px; }
.form-label { display: block; font-size: 0.8rem; font-weight: 600; color: rgba(255,255,255,0.6); margin-bottom: 6px; letter-spacing: -0.01em; }
.form-label .req { color: rgba(255,100,100,0.8); margin-left: 2px; }
.form-input { width: 100%; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.15); border-radius: 8px; padding: 12px 16px; font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.9rem; color: white; outline: none; transition: border-color 0.2s; }
.form-input:focus { border-color: rgba(9,168,102,0.6); box-shadow: 0 0 0 3px rgba(9,168,102,0.1); }
.form-input::placeholder { color: rgba(255,255,255,0.25); }
.form-select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='rgba(255,255,255,0.4)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 36px; cursor: pointer; }
.form-select option { background: #2e3d37; color: white; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-nav { display: flex; gap: 12px; margin-top: 24px; }
.form-btn-back { flex: 0; font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.9rem; font-weight: 600; color: rgba(255,255,255,0.5); background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); padding: 13px 20px; border-radius: 8px; cursor: pointer; transition: all 0.2s; }
.form-btn-back:hover { color: white; background: rgba(255,255,255,0.1); }
.form-btn-next { flex: 1; font-family: "Plus Jakarta Sans", sans-serif; font-size: 0.95rem; font-weight: 700; background: var(--green); color: white; border: none; padding: 14px; border-radius: 10px; cursor: pointer; transition: all 0.2s; letter-spacing: -0.01em; }
.form-btn-next:hover { background: var(--green-bright); transform: translateY(-1px); }
.form-note { font-size: 0.72rem; color: rgba(255,255,255,0.25); text-align: center; margin-top: 12px; }

.checkbox-group { display: flex; flex-direction: column; gap: 10px; }
.checkbox-item { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.checkbox-item input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--green); cursor: pointer; flex-shrink: 0; }
.checkbox-item label { font-size: 0.85rem; color: rgba(255,255,255,0.65); cursor: pointer; }

/* ══════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════ */
@media (max-width: 1024px) {
  .page-hero-inner { grid-template-columns: 1fr; }
  .hero-urgency-card { display: none; }
  .founder-inner, .benefits-grid, .cobuilder-inner { grid-template-columns: 1fr; gap: 48px; }
  .trust-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .feature-checklist { grid-template-columns: 1fr 1fr; }
  .pain-grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  nav { padding: 0 20px; height: 56px; }
  .nav-links { display: none; }
  .nav-actions .btn-nav-ghost, .nav-actions .btn-nav-primary { display: none; }
  .hamburger { display: flex; }
  .page-hero { padding: 90px 20px 60px; }
  .qualifier-strip, .pain-section, .founder-section, .benefits-section, .trust-section, .features-section, .cobuilder-section, .timeline-section, .faq-section, .apply-section, .risk-bar { padding: 60px 20px; }
  .form-grid { grid-template-columns: 1fr; }
  .partner-terms { grid-template-columns: 1fr 1fr; }
  .feature-checklist { grid-template-columns: 1fr; }
  .qualifier-inner { flex-direction: column; gap: 20px; }
  .risk-bar-inner { flex-direction: column; gap: 16px; }
  .risk-divider { display: none; }
  footer { padding: 48px 20px 32px; }
  .footer-grid { grid-template-columns: 1fr; gap: 50px; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
}
@media (max-width: 480px) {
  h2.section-h { font-size: 1.6rem; }
  .trust-grid { grid-template-columns: 1fr; }
}


/* NAV DROPDOWN */
.nav-dropdown { position:relative; }
.nav-dropdown-trigger { display:flex; align-items:center; }
.nav-dropdown-menu {
  display:none; position:absolute; top:calc(100% + 12px); left:50%;
  transform:translateX(-50%); background:white;
  border:1.5px solid var(--border); border-radius:14px;
  padding:8px; min-width:200px; z-index:200;
  box-shadow:0 8px 32px rgba(0,0,0,0.08);
}
.nav-dropdown:hover .nav-dropdown-menu { display:block; }
.dropdown-item {
  display:block; padding:9px 14px; font-size:0.85rem; font-weight:500;
  color:var(--ink-mid); text-decoration:none; border-radius:8px;
  transition:background 0.12s, color 0.12s; white-space:nowrap;
}
.dropdown-item:hover { background:var(--surface-2); color:var(--green); }
.dropdown-parent { font-weight:700; color:var(--ink); }
.dropdown-divider { height:1px; background:var(--border); margin:4px 0; }


/* ── INDUSTRIES DROPDOWN ─────────────────────────── */
.nav-dropdown { position: relative; }
.nav-dropdown-trigger { display: flex; align-items: center; gap: 4px; cursor: pointer; }
.nav-dropdown-trigger svg { transition: transform 0.2s ease; flex-shrink: 0; }
.nav-dropdown:hover .nav-dropdown-trigger svg,
.nav-dropdown.open .nav-dropdown-trigger svg { transform: rotate(180deg); }
.nav-dropdown-menu {
  position: absolute; top: calc(100% + 12px); left: 50%;
  transform: translateX(-50%); min-width: 210px;
  background: #fff; border: 1px solid var(--border);
  border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,0.10);
  padding: 6px; opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease;
  transform: translateX(-50%) translateY(-4px); z-index: 200;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown.open .nav-dropdown-menu {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown-menu::before {
  content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 14px;
}
.dropdown-item {
  display: block; padding: 9px 14px; font-size: 0.85rem; font-weight: 500;
  color: var(--ink-mid); text-decoration: none; border-radius: 7px;
  border-left: 3px solid transparent;
  transition: background 0.14s, border-color 0.14s, color 0.14s;
  letter-spacing: -0.01em;
}
.dropdown-item:hover { background: var(--green-pale); border-left-color: var(--green); color: var(--ink); }
.dropdown-divider { height: 1px; background: var(--border); margin: 5px 6px; }
.dropdown-parent { font-weight: 600; color: var(--ink); font-size: 0.8rem; letter-spacing: 0.03em; text-transform: uppercase; }

/* COMPONENT — FAQ */
/* =====================================
   FAQ — INDUSTRY PAGE STYLE (LINE MODE)
===================================== */

.faq-section .faq-item{
    border:none !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    padding:22px 0;
    border-bottom:1px solid #e3ebe6 !important;
}

/* remove last divider line */
.faq-section .faq-item:last-child{
    border-bottom:none !important;
}

/* =====================================
   FAQ — INDUSTRY COMPACT SPACING
===================================== */

/* tighten row spacing */
.faq-section .faq-item{
    padding:14px 0 !important;
}

/* normalize question button height */
.faq-section .faq-q{
    padding:6px 0 !important;
    line-height:1.35 !important;
    min-height:auto !important;
}

/* remove theme button spacing */
.faq-section .faq-q{
    background:transparent !important;
    border:none !important;
}

/* answer spacing */
.faq-section .faq-a{
    padding-top:10px !important;
    padding-bottom:4px !important;
    line-height:1.6;
}

/* COMPONENT — CTA */

/* =====================================
   CTA BAND — BUTTON HOVER FIX
===================================== */

.cta-band .btn-white,
.cta-band .btn-white:visited{
    color:#158a55; /* your green */
}

.cta-band .btn-white:hover,
.cta-band .btn-white:focus,
.cta-band .btn-white:active{
    color:#158a55 !important;
}

/* COMPONENT — FORM */
/* =====================================
   PARTNER FORM — FULL COMPONENT RESET
===================================== */

/* container */
.partner-form{
    color:#c9ced6; /* base text color like HTML version */
}

/* labels */
.partner-form label{
    color:rgba(255,255,255,.65) !important;
    font-weight:500;
}

/* inputs + textarea */
.partner-form input,
.partner-form textarea{
    background:#3b3f46 !important;
    border:1px solid rgba(255,255,255,.12) !important;
    color:#ffffff !important;
    box-shadow:none !important;
}

/* placeholders */
.partner-form input::placeholder,
.partner-form textarea::placeholder{
    color:rgba(255,255,255,.45) !important;
}

/* focus state */
.partner-form input:focus,
.partner-form textarea:focus{
    border-color:#158a55 !important;
    outline:none;
}

/* remove WP default styling */
.partner-form input,
.partner-form textarea{
    appearance:none;
}

/* button fix */
.partner-form button,
.partner-form .btn,
.partner-form input[type="submit"]{
    background:#158a55;
    color:#fff !important;
    border:none;
}

/* =====================================
   FOUNDER TESTIMONIAL CARDS — FORCE DESIGN
===================================== */

.founder-section .tcard{
    background:#272c35;
    border:1px solid #272c35;
    border-radius:14px;
    padding:24px;
}

/* Remove founder glow effect */
.founder-glow {
  display: none !important;
}


/* ================================
   WPBAKERY SPACING FIX
================================ */

.wpb_button,
.wpb_content_element,
ul.wpb_thumbnails-fluid > li {
    margin-bottom: 0 !important;
}

/* Remove row spacing */
.vc_row {
    margin-bottom: 0 !important;
}

/* Remove column padding interference */
.vc_column_container > .vc_column-inner {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* ================================
   GLOBAL CONTENT CONTAINER
================================ */

.section-wrap{
    max-width:1100px;
    margin:0 auto;
    width:100%;
}

/* ================================
   PREVENT THEME STYLE CONFLICTS
================================ */

section *{
    box-sizing:border-box;
}

/* =====================================
   FEATURE MOCK — VIDEO VERSION
===================================== */

.video-mock{
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
}

/* make video behave like dashboard card */
.feat-video{
    width:100%;
    height:100%;
    object-fit:cover;   /* keeps same visual size */
    border-radius:inherit;
    display:block;
}

/* =====================================
   FEATURE VIDEO — FULL BLEED FIX
===================================== */

/* remove inner spacing used for icon mock */
.video-mock{
    padding:0 !important;
}

/* remove inner wrapper spacing if still present */
.video-mock .feat-mock-inner{
    padding:0 !important;
    background:none !important;
}

/* make video fill entire card */
.feat-video{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    border-radius:inherit;
}

/* =====================================
   PROTEAMS DARK FORM OVERRIDE (SAFE)
   Only visual styling — keeps Mautic logic
===================================== */

/* ---------- FORM CARD ---------- */
#mauticform_wrapper_questionnaire.mauticform_wrapper{
    max-width:900px !important;
    margin:0 auto !important;
    padding:48px !important;

    background:#3b3f46 !important;
    border:1px solid rgba(255,255,255,.12) !important;
    border-radius:22px !important;

    box-shadow:none !important;
    color:#fff !important;
}


/* ---------- LABELS ---------- */
#mauticform_wrapper_questionnaire .mauticform-label{
    color:rgba(255,255,255,.75) !important;
    font-weight:500 !important;
    margin-bottom:8px;
}


/* ---------- INPUTS ---------- */
#mauticform_wrapper_questionnaire .mauticform-input,
#mauticform_wrapper_questionnaire .mauticform-textarea,
#mauticform_wrapper_questionnaire .mauticform-selectbox{

    background:#3b3f46 !important;
    border:1px solid rgba(255,255,255,.18) !important;
    color:#fff !important;

    padding:16px 18px !important;
    border-radius:12px !important;
    font-size:15px !important;
}


/* placeholder */
#mauticform_wrapper_questionnaire input::placeholder,
#mauticform_wrapper_questionnaire textarea::placeholder{
    color:rgba(255,255,255,.45) !important;
}


/* focus glow */
#mauticform_wrapper_questionnaire input:focus,
#mauticform_wrapper_questionnaire textarea:focus,
#mauticform_wrapper_questionnaire select:focus{
    outline:none !important;
    border-color:#078037 !important;
    box-shadow:0 0 0 3px rgba(7,128,55,.18) !important;
}


/* ---------- ROW SPACING ---------- */
#mauticform_wrapper_questionnaire .mauticform-row{
    margin-bottom:22px !important;
}


/* ---------- BUTTON (MATCH SITE CTA) ---------- */

#mauticform_wrapper_questionnaire .mauticform-button{

    width:auto !important;
    text-align:center !important;

    background:#078037 !important;
    color:#fff !important;

    border-radius:14px !important;
    padding:14px 24px !important;
    font-size:15px !important;
    font-weight:600 !important;

    border:none !important;
}


/* hover */
#mauticform_wrapper_questionnaire .mauticform-button:hover{
    background:#066b2e !important;
}

#mauticform_input_requestademo_submit {
	width:auto !important;
	padding:14px 24px !important;    
	font-size:15px !important;
}

/* ---------- BUTTON ALIGNMENT FIX ---------- */
#mauticform_wrapper_questionnaire .mauticform-button-wrapper{
    display:block !important;
    text-align:unset !important;
}


/* ---------- ERROR TEXT ---------- */
#mauticform_wrapper_questionnaire .mauticform-errormsg{
    color:#ff4d4d !important;
    margin-top:6px;
}

/* =====================================
   FIX FORM ALIGNMENT (PROTEAMS STYLE)
===================================== */

/* make entire form content left aligned */
#mauticform_wrapper_questionnaire,
#mauticform_wrapper_questionnaire form,
#mauticform_wrapper_questionnaire .mauticform-innerform{
    text-align:left !important;
}


/* rows should not center content */
#mauticform_wrapper_questionnaire .mauticform-row{
    text-align:left !important;
    margin-left:0 !important;
    margin-right:0 !important;
}


/* labels align left */
#mauticform_wrapper_questionnaire .mauticform-label{
    text-align:left !important;
    display:block;
}


/* inputs full width like original design */
#mauticform_wrapper_questionnaire .mauticform-input,

/* Step 1 of 3 */
.mauticform-progress-text{font-size:.9rem;font-weight:600;color:#fff;text-align:right;min-height:20px}


/* =====================================
   PROTEAMS 2-COLUMN FORM LAYOUT
===================================== */

/* create 2-column row */
.form-row-2col{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
    width:100%;
}

/* remove default spacing conflicts */
.form-row-2col .mauticform-row{
    margin-bottom:0 !important;
}

/* mobile fallback */
@media (max-width:768px){
    .form-row-2col{
        grid-template-columns:1fr;
        gap:16px;
    }
}



/* Mobile menu base */
.mobile-menu {
  position: fixed;
  top: 55px;
  left: 0;
  width: 100%;
  height: calc(100vh - 50px);
  background: #fff;
  transform: translateX(100%);
  transition: transform .35s ease;
  overflow-y: auto;
  z-index: 9999;
}

/* OPEN STATE */
.mobile-menu.is-open {
  transform: translateX(0);
}

/* prevent background scroll */
body.menu-open {
  overflow: hidden;
}

/*Navigation Fix*/
.header.navbar-style2 {
    display: none !important;
}

/* ===============================
   PROTEAMS CLEAN INDUSTRIES DROPDOWN
   =============================== */

/* Hide mega layout behaviour */
#mega-menu-primary .mega-menu-row,
#mega-menu-primary .mega-menu-column {
    display: block !important;
    width: 100% !important;
}

/* Dropdown container */
#mega-menu-primary .mega-sub-menu {
    background: #ffffff !important;
    border-radius: 14px !important;
    padding: 20px 0 !important;
    width: 280px !important;
    box-shadow: 0 15px 40px rgba(0,0,0,.12) !important;
    border: 1px solid #e6ece8 !important;
}

/* Remove grid spacing */
#mega-menu-primary .mega-sub-menu ul {
    padding: 0 !important;
    margin: 0 !important;
}

/* Remove unwanted headings */
#mega-menu-primary .mega-menu-item-has-children > a[href="#"] {
    display: none !important;
}

/* Menu items */
#mega-menu-primary .mega-sub-menu a.mega-menu-link {
    padding: 10px 24px !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #3f5f4a !important;
    line-height: 1.5 !important;
}

/* Hover */
#mega-menu-primary .mega-sub-menu a.mega-menu-link:hover {
    background: #f4f7f5 !important;
    color: #1e6b46 !important;
}

/* Add top title */
#mega-menu-primary .mega-sub-menu::before {
    content: "ALL INDUSTRIES";
    display: block;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .08em;
    color: #6b7f73;
    padding: 0 24px 14px;
    border-bottom: 1px solid #e6ece8;
    margin-bottom: 10px;
}

#mega-menu-primary > li.mega-menu-item-has-children {
    position: relative;
}

#mega-menu-primary .mega-sub-menu {
    left: 50% !important;
    transform: translateX(-50%);
    top: 55px !important;
}

#mega-menu-primary .mega-sub-menu {
    opacity: 0;
    transform: translate(-50%,10px);
    transition: all .25s ease;
}

#mega-menu-primary li.mega-menu-item:hover > .mega-sub-menu {
    opacity: 1;
    transform: translate(-50%,0);
}

.nav-dropdown-menu {
    position: absolute;
    top: calc(100% + 12px);
    left: 50%;
    transform: translateX(-50%);
    min-width: 210px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.10);
    padding: 6px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.18s ease, transform 0.18s ease;
    transform: translateX(-50%) translateY(-4px);
    z-index: 200;
}

/* Blog Setup Start */
/* BLOG HERO */
.blog-hero {
  padding: 120px 0 60px;
  text-align: center;
}

.blog-hero h1 {
  font-size: 42px;
  margin-bottom: 10px;
}

.blog-hero p {
  color: var(--ink-light);
}

/* BLOG GRID */
.search-subtext {
    font-size: 1.25rem;   /* 🔥 bigger text */
    line-height: 1.8rem;
    color: #6b8f7a;       /* optional: softer SaaS style */
}

.blog-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 40px;
}

.blog-card {
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease;
}

.blog-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 40px rgba(0,0,0,.08);
}

.blog-thumb img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    padding: 10px;
    border-radius: 18px;
}

.blog-content {
  padding: 24px;
}

.blog-content h3 {
  font-size: 20px;
  margin-bottom: 10px;
}

.blog-excerpt {
  color: var(--ink-light);
  margin-bottom: 16px;
}

.blog-readmore {
  color: var(--brand-green);
  font-weight: 600;
}

/* PAGINATION */
.blog-pagination {
  margin-top: 60px;
  text-align: center;
} 

/* MOBILE */
@media (max-width: 1024px) {
  .blog-grid {
    grid-template-columns: repeat(2,1fr);
  }
}

@media (max-width: 640px) {
  .blog-grid {
    grid-template-columns: 1fr;
  }
}

.blog-pagination nav {
  margin-top: 60px;
}

/* Blog Search - Improved Layout */

.blog-search-wrap{
  width:100%;
  margin-bottom:40px;
}

.blog-search-form{
  display:flex;
  width:100%;
  max-width:900px;   /* control how wide it gets */
  margin:0 auto;     /* center it */
  gap:12px;
}

.blog-search-input{
  flex:1;            /* makes input grow */
  height:48px;
  border-radius:40px;
  border:1px solid #ddd;
  padding:0 20px;
  font-size:16px;
  min-width:0;       /* important for mobile */
}

.blog-search-btn{
  height:48px;
  padding:0 28px;
  border-radius:40px;
  background:#0f7c3a;
  color:#fff;
  border:none;
  cursor:pointer;
  white-space:nowrap;
}

/* Mobile Search Style */
@media (max-width: 768px){

  .blog-search-form{
    flex-direction: row;      /* keep in one line */
    width: 90%;
    gap: 10px;
  }

  .blog-search-input{
    flex: 1;
    width: auto;
    min-width: 0;
    height: 46px;
  }

  .blog-search-btn{
    height: 46px;
    padding: 0 20px;
    white-space: nowrap;
  }

}
/* Blog Search End */
/* Blog Setup End */

/* Home Page Mobile Images */
@media (max-width: 768px) { /* Adjust breakpoint as needed for your mobile definition */
  .feature-row.aos.visible {
    flex-direction: column-reverse;
  }
}

/* Home Page Mobile Images End */


/* CookieYes floating button background */
.cky-btn-revisit-wrapper {
    background-color: #078037 !important;
    border-radius: 50% !important;
}

/* CookieYes Default state – half opacity */
.cky-btn-revisit-wrapper {
    opacity: 0.0;
    transition: opacity 0.3s ease;
}

/* CookieYes Hidden state */
.cky-btn-revisit-wrapper.cky-hidden {
    display: none !important;
}

/* ================================
   HERO STYLES — Privacy Policy PAGE 13686 & 13993
================================ */

/* Hero Section */
.page-id-13686 .page-hero,
.page-id-13993 .page-hero {
    padding: 120px 80px 80px;
    background: #272c35;
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid var(--border);
}

/* Eyebrow text */
.page-id-13686 .eyebrow,
.page-id-13993 .eyebrow {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Main Heading */
.page-id-13686 .page-hero h1,
.page-id-13993 .page-hero h1 {
    font-size: clamp(2.4rem, 4vw, 3.6rem);
    font-weight: 800;
    line-height: 1.07;
    letter-spacing: -0.03em;
    color: #ffffff;
    margin-bottom: 20px;
}

/* Subtitle */
.page-id-13686 .page-hero-sub,
.page-id-13993 .page-hero-sub {
    font-size: 1.1rem;
    color: #fff;
    line-height: 1.7;
    max-width: 560px;
    margin-bottom: 36px;
}

/* Footer Social Media */

@media (max-width: 768px) {
  /* This targets the specific div (uid=2738) which is the first child of .footer-grid */
  .footer-grid > div:first-child {
    order: 999; /* A high value to ensure it appears last */
  }
}

.social-media-footer {
    display: flex;
    gap: 15px;
    align-items: center;
    padding: 20px 0;
    flex-wrap: wrap;
}

.social-media-footer a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #f0f0f0;
    color: #333;
    transition: transform 0.2s ease, background 0.2s ease;
    text-decoration: none;
}

.social-media-footer a:hover {
    transform: translateY(-2px);
}

.social-media-footer a svg {
    width: 20px;
    height: 20px;
}

/* Platform colors */
.social-media-footer a:nth-child(1):hover {
    background: #1877f2; /* Facebook */
    color: #fff;
}

.social-media-footer a:nth-child(2):hover {
    background: #0077b5; /* LinkedIn */
    color: #fff;
}

.social-media-footer a:nth-child(3):hover {
    background: radial-gradient(circle at 30% 107%,
        #fdf497 0%, #fdf497 5%,
        #fd5949 45%, #d6249f 60%, #285AEB 90%);
    color: #fff;
}

.social-media-footer a:nth-child(4):hover {
    background: #ff0000; /* YouTube */
    color: #fff;
}

/* =====================================
   WPBAKERY WRAPPER COMPATIBILITY FIX
===================================== */

/* allow layout sections to behave normally */
.vc_row .feature-split,
.vc_row .feature-section,
.vc_row .app-feature,
.vc_row section {
    width: 100%;
}

/* remove WPBakery column restriction */
.vc_column_container {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* prevent column max-width breaking layouts */
.vc_column-inner {
    max-width: none !important;
}

/* allow flex layouts to expand again */
.feature-row1,
.feature-split,
.app-feature-grid {
    display: flex !important;
    width: 100%;
}

/* fix content alignment */
.feature-content {
    flex: 1;
}

.feature-media {
    flex: 1;
}

/* ======================================
   WPBAKERY FULL WIDTH FIX
   (removes hidden side gaps)
====================================== */

/* remove row side offsets */
.vc_row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* remove column padding */
.vc_column_container {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* remove inner wrapper padding */
.vc_column-inner {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ensure sections truly span full width */
.vc_row > .vc_column_container > .vc_column-inner > * {
    width: 100%;
}

a:hover {
  color: #fff;
  text-decoration: none;
}

.blog-content a:hover { color: #666; /* turns link text white on hover */ text-decoration: none; /* removes underline */ }

/* ======================================
   Cutom Pagination
   (Blog)
====================================== */
/* Cutom Pagination*/
.custom-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-top: 60px;
  margin-bottom: 100px; /* 👈 this fixes footer sticking */
  flex-wrap: wrap;
}

.custom-pagination a,
.custom-pagination span {
  padding: 8px 14px;
  border-radius: 6px;
  font-size: 14px;
  text-decoration: none;
  border: 1px solid #ddd;
  color: #333;
  transition: 0.2s ease;
}

.custom-pagination a:hover {
  background: #0f7c3a;
  color: #fff;
  border-color: #0f7c3a;
}

.custom-pagination .active {
  background: #0f7c3a;
  color: #fff;
  border-color: #0f7c3a;
}
.pl-60 {
	padding-left: 0px;
}

/* MOBILE DROPDOWN */

.mobile-dropdown-toggle{
width:100%;
text-align:left;
background:none;
border:none;
font-size:18px;
padding:16px 0;
display:flex;
justify-content:space-between;
align-items:center;
cursor:pointer;
}

.mobile-dropdown-menu{
display:none;
padding-left:20px;
}

.mobile-dropdown-menu a{
display:block;
padding:10px 0;
font-size:16px;
color:#000;
text-decoration:none;
}

.mobile-dropdown.active .mobile-dropdown-menu{
display:block;
}

.mobile-dropdown.active .arrow{
transform:rotate(180deg);
}

/* Careers and Contact Form TextArea*/
#mauticform_input_contactus_f_message:focus,
#mauticform_input_joinourteam_cover_letter__introductio:focus {
    outline: none;
    border-color: #078037;
    background: #FFFFFF;
    box-shadow: 0 8px 20px rgba(7, 128, 55, 0.08), 
            0 0 0 4px rgba(7, 128, 55, 0.1);
}

/* Industry Page */ 
/* Operators Section */

.operators-section{
  padding:70px 20px;
  background:linear-gradient(180deg,#0f2c35,#0c1f26);
  position:relative;
  overflow:visible;
}

/* content container */

.operators-inner{
  max-width:900px;
  margin:auto;
  text-align:center;
  position:relative;
  z-index:2;
}

/* title */

.operators-title{
  font-size:56px;
  line-height:1.2;
  color:#e7e2d7;
  font-weight:600;
}

.operators-title span{
  color:#9fb7a8;
}

/* subtitle */

.operators-sub{
  margin-top:20px;
  font-size:20px;
  color:#c6c6c6;
}

/* handshake background */

.operators-bg{
  position:absolute;
  left:50%;
  top:68%;
  transform:translate(-50%,-50%);
  z-index:1;
  pointer-events:none;
}

.operators-bg img{
  width:720px;
  max-width:none;
  opacity:0.16;
  filter:blur(0.6px);
}

/* Mobile */

@media (max-width:768px){

  .operators-title{
    font-size:36px;
  }

  .operators-sub{
    font-size:16px;
  }

  .operators-bg img{
    width:260px;
  }

}

.operators-section::before{
content:"";
position:absolute;
width:600px;
height:600px;
background:radial-gradient(circle,#1e4953 0%,transparent 70%);
left:50%;
top:50%;
transform:translate(-50%,-50%);
opacity:0.35;
}

/*home page hero sectoin Mobile */

.hero-floating-badge {
    position: absolute;
    top: 0px;
    left: -112px;
    background: white;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 5px 16px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    gap: 10px;
    z-index: 3;
    animation: float 4s ease-in-out infinite;
}

.hero-floating-badge-2 {
    position: absolute;
    bottom: 24px;
    left: 310;
    background: white;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 10px 14px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    gap: 8px;
    z-index: 3;
    animation: float 4s 1.5s ease-in-out infinite;
}



@media (max-width: 768px) { /* Adjust this breakpoint (e.g., 600px, 480px) to match your mobile definition */

  .hero-inner.section-wrap {
    /* Ensure the grid column containing .hero-visual is flexible and doesn't grow beyond available space */
    grid-template-columns: minmax(0, 1fr);
    /* Ensure the container itself takes full width of its parent/viewport */
    width: 100%;
  }

  .hero-visual {
    /* Ensure the flex container fills its grid cell and centers its children */
    width: 100%;
    max-width: 100%;
    min-width: 0; /* Prevents flex item (image) from forcing container to be wider */
    display: flex;
    justify-content: center;
    box-sizing: border-box; /* Standard practice */
  }

  img.hero-phone-primary {
    /* Make the image responsive and ensure it doesn't fill the entire width,
       allowing it to be visibly centered within its parent (.hero-visual) */
    width: auto;      /* Allows natural width or constrained by max-width */
    max-width: 80%;   /* Limit image size to 80% of its parent's width */
    height: auto;     /* Maintain aspect ratio */
    display: block;   /* Good practice for images, though flex parent handles flow */
  }
	.hero-floating-badge {
    top: 0px;
    left: 170px;
}
	.hero-floating-badge-2 {
    bottom: -18px;
    left: 0;
}

  /* Consider adding styles for the floating badges if they interfere with the mobile layout */
  /* For example, to reposition them or hide them on smaller screens: */
  /*
  .hero-floating-badge,
  .hero-floating-badge-2 {
    position: static; // Or adjust top/left/right/bottom values
    display: none;    // Or hide them completely
  }
  */
}

@media (max-width: 768px) { /* Adjust this breakpoint to match your mobile definition */

  .hero-stats {
    display: flex;         /* Ensure it's a flex container (it already was) */
    flex-wrap: wrap;       /* Allow items to wrap to the next line */
    justify-content: center; /* Center the flex items horizontally */
    align-items: center;   /* Center the flex items vertically (cross-axis) */
    width: 100%;           /* Ensure the container takes full available width */
    box-sizing: border-box; /* Good practice for consistent sizing */
  }

  .hero-stat {
    width: auto;           /* Allow width to be determined by content or flex properties */
    flex: 1 1 120px;       /* flex-grow:1, flex-shrink:1, flex-basis:120px
                              Items will try to be 120px wide, grow if space available, shrink if needed */
    min-width: 120px;      /* Ensure items don't get too small. Adjust as needed. */
    text-align: center;    /* Keep content centered within each stat item */
    padding: 12px 16px;    /* Maintain existing padding */
    box-sizing: border-box; /* Good practice for consistent sizing */
  }
}
/* Video Viemo */
iframe {
  border-radius: 20px;
}

.video-container{
position:relative;
padding-bottom:56.25%;
height:0;
cursor:pointer;
overflow:hidden;
}

.video-container iframe,
.video-thumb{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
object-fit:cover;
}

.video-play{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
width:90px;
height:90px;
background:#00000014;
color:#272c35;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
font-size:36px;
z-index:10;
}

.video-thumb{
width:100%;
height:100%;
object-fit:cover;
border-radius:20px;
}

/* related resource: *wp-emoji-styles-inline-css:3:2 Vimeo player */
img.wp-smiley, img.emoji {
display: inline !important;
border: none !important;
box-shadow: none !important;
height: 1.5em !important;
width: 1.5em !important;
margin: 0 0.07em !important;
vertical-align: -0.1em !important;
background: none !important;
padding: 0 !important;
}

/*Feaature Page Bullets */

.feature-list{
list-style:none;
display:flex;
flex-direction:column;
gap:10px;
padding:0;
margin:0;
}

.feature-list li{
display:flex;
align-items:flex-start; /* important */
gap:10px;
font-size:0.938rem;
color:var(--ink-mid);
font-weight:500;
line-height:1.5;
}

.check-icon{
flex-shrink:0;
margin-top:3px;
}

.feature-title{
font-weight:600;
margin-right:4px;
}

.feature-desc{
color:var(--ink-mid);
font-weight:400;	
}

.feature-cta{
margin-top:24px;
}

.feature-cta .btn-primary{
display:inline-block;
background:#0f7c3a;
color:#fff;
padding:12px 22px;
border-radius:8px;
font-weight:600;
text-decoration:none;
transition:all .25s ease;
}

.feature-cta .btn-primary:hover{
background:#0c6a32;
transform:translateY(-2px);
}

/* compare pages New */


/* AOS */
/*.aos { opacity: 0; transform: translateY(20px); transition: opacity 0.65s ease, transform 0.65s ease; }
.aos.visible { opacity: 1; transform: none; }
.aos-delay-1 { transition-delay: 0.1s; }
.aos-delay-2 { transition-delay: 0.2s; }
.aos-delay-3 { transition-delay: 0.3s; }*/

/* ── HERO ─────────────────────────── */
.hero {
  padding: 128px 80px 88px;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  position: relative; overflow: hidden;
}
.hero::before {
  content: ""; position: absolute; inset: 0;
  background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px);
  background-size: 60px 60px; opacity: 0.25; pointer-events: none;
}
.hero-inner { max-width: 1200px; margin: 0 auto; position: relative; z-index: 2; }
.vs-badge { display: inline-flex; align-items: center; gap: 10px; background: var(--surface-2); border: 1px solid var(--border); border-radius: 100px; padding: 6px 16px 6px 6px; margin-bottom: 28px; }
.vs-badge-logos { display: flex; align-items: center; }
.logo-bubble { width: 30px; height: 30px; border-radius: 50%; border: 2px solid var(--border); display: flex; align-items: center; justify-content: center; font-size: 0.65rem; font-weight: 800; background: white; }
.logo-bubble.pt { background: var(--green); color: white; margin-right: -8px; z-index: 1; }
.logo-bubble.ct { background: #1565c0; color: white; }
.vs-badge-label { font-size: 0.78rem; font-weight: 600; color: var(--ink-mid); }
.hero h1 { font-size: clamp(2.4rem, 4.5vw, 3.8rem); font-weight: 800; line-height: 1.06; letter-spacing: -0.03em; color: var(--ink); margin-bottom: 22px; max-width: 780px; }
.hero h1 .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: var(--green); }
.hero-sub { font-size: 1.1rem; color: var(--ink-mid); line-height: 1.75; max-width: 580px; margin-bottom: 40px; }
.hero-ctas { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 56px; }
.hero-proof { display: flex; align-items: center; gap: 32px; flex-wrap: wrap; }
.proof-stat { display: flex; flex-direction: column; }
.proof-stat strong { font-size: 1.5rem; font-weight: 800; color: var(--ink); letter-spacing: -0.02em; }
.proof-stat span { font-size: 0.78rem; color: var(--ink-light); font-weight: 500; }
.proof-divider { width: 1px; height: 36px; background: var(--border-strong); }" 

/* ── HONEST TAKE ─────────────────────────── */
.compare-page .honest-section { padding: 72px 80px; background: #000; }
.compare-page .honest-inner { max-width: 1100px; margin: 0 auto; }
.compare-page .honest-label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green-mid); margin-bottom: 16px; display: flex; align-items: center; gap: 8px; }
.compare-page .honest-label::before { content: ""; width: 16px; height: 2px; background: var(--green); border-radius: 1px; }
.compare-page .honest-heading { font-size: clamp(1.6rem, 2.5vw, 2.2rem); font-weight: 700; color: white; letter-spacing: -0.025em; line-height: 1.3; margin-bottom: 12px; max-width: 700px; }
.compare-page .compare-page .honest-sub { font-size: 0.95rem; color: rgba(255,255,255,0.45); line-height: 1.65; max-width: 600px; margin-bottom: 36px; }
.compare-page .honest-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.compare-page .honest-card { border-radius: 12px; padding: 28px; }
.compare-page .honest-card.stay { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); }
.compare-page .honest-card.leave { background: rgba(7,137,85,0.12); border: 1px solid rgba(7,137,85,0.3); }
.compare-page .honest-card-label { font-size: 0.7rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 12px; }
.compare-page .honest-card.stay .honest-card-label { color: rgba(255,255,255,0.4); }
.compare-page .honest-card.leave .honest-card-label { color: var(--green-mid); }
.compare-page .honest-card h3 { font-size: 1rem; font-weight: 700; margin-bottom: 16px; }
.compare-page .honest-card.stay h3 { color: rgba(255,255,255,0.7); }
.compare-page .honest-card.leave h3 { color: white; }
.compare-page .honest-list { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.compare-page .honest-list li { font-size: 0.875rem; line-height: 1.5; display: flex; align-items: flex-start; gap: 10px; }
.compare-page .honest-card.stay .honest-list li { color: rgba(255,255,255,0.55); }
.compare-page .honest-card.leave .honest-list li { color: rgba(255,255,255,0.8); }
.compare-page .hl-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; margin-top: 6px; }
.compare-page .honest-card.stay .hl-dot { background: rgba(255,255,255,0.25); }
.compare-page .honest-card.leave .hl-dot { background: var(--green); }

/* ── VERDICT CARDS ─────────────────────────── */
.verdict-section { padding: 80px; background: var(--surface-2); border-bottom: 1px solid var(--border); }
.verdict-inner { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.verdict-card { border-radius: 16px; padding: 36px; }
.verdict-card.winner { background: white; border: 2px solid var(--green-mid); box-shadow: 0 4px 24px rgba(7,137,85,0.08); }
.verdict-card.loser { background: white; border: 1px solid var(--border); }
.verdict-badge { display: inline-flex; align-items: center; gap: 6px; font-size: 0.68rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; padding: 5px 12px; border-radius: 100px; margin-bottom: 16px; }
.verdict-badge.win { background: var(--green-pale); color: var(--green); border: 1px solid var(--green-mid); }
.verdict-badge.neutral { background: var(--surface-2); color: var(--ink-light); border: 1px solid var(--border); }
.verdict-name { font-size: 1.6rem; font-weight: 800; color: var(--ink); letter-spacing: -0.025em; margin-bottom: 12px; }
.verdict-tagline { font-size: 0.875rem; font-weight: 600; color: var(--ink-mid); margin-bottom: 20px; line-height: 1.5; }
.verdict-card.winner .verdict-tagline { color: var(--green-dark); }
.verdict-list { list-style: none; display: flex; flex-direction: column; gap: 10px; margin-bottom: 28px; }
.verdict-list li { font-size: 0.875rem; display: flex; align-items: flex-start; gap: 10px; color: var(--ink-mid); line-height: 1.5; }
.vl-icon { width: 18px; height: 18px; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center; margin-top: 1px; }
.vl-icon.pro { background: var(--green-pale); border: 1.5px solid var(--green-mid); }
.vl-icon.con { background: var(--red-pale); border: 1.5px solid #fca5a5; }
.vl-icon svg { width: 8px; height: 8px; }


/* ── FOUNDER STRIP ─────────────────────────── */

.compare-page .founder-section { padding: 64px 80px; background: white; border-bottom: 1px solid var(--border); }
.compare-page .founder-inner { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: 1fr 2fr; gap: 64px; align-items: center; }
.compare-page .founder-left { display: flex; flex-direction: column; gap: 16px; }
.compare-page .founder-avatar { width: 72px; height: 72px; border-radius: 50%; background: var(--green); display: flex; align-items: center; justify-content: center; font-size: 1.4rem; font-weight: 800; color: white; font-family: "Fraunces", serif; }
.compare-page .founder-name { font-size: 1.1rem; font-weight: 700; color: var(--ink); }
.compare-page .founder-title { font-size: 0.82rem; color: var(--ink-light); line-height: 1.5; }

/* FIX: remove unwanted line (only addition) */
.compare-page .founder-right,
.compare-page .founder-right * {
  border-left: none !important;
}

/* FIX: remove theme pseudo elements */
.compare-page .founder-inner::before,
.compare-page .founder-inner::after,
.compare-page .founder-right::before,
.compare-page .founder-right::after {
  content: none !important;
  display: none !important;
}
.compare-page .founder-right blockquote { font-family: "Fraunces", serif; font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 600; font-style: italic; color: var(--ink); line-height: 1.5; letter-spacing: -0.01em; margin-bottom: 20px; }
.compare-page .founder-right blockquote::before { content: "\201C"; color: var(--green); font-size: 3rem; line-height: 0; vertical-align: -0.6em; margin-right: 4px; }
.compare-page .founder-context { font-size: 0.875rem; color: var(--ink-light); line-height: 1.65; }
.compare-page .founder-context strong { color: var(--ink-mid); font-weight: 600; }

/* ── DIFFERENTIATORS ─────────────────────────── */
.diff-section { padding: 88px 80px; background: var(--surface-2); border-bottom: 1px solid var(--border); }
.diff-inner { max-width: 1100px; margin: 0 auto; }
.diff-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 48px; }
.diff-card { background: white; border: 1px solid var(--border); border-radius: 14px; padding: 32px; transition: box-shadow 0.2s, transform 0.2s; }
.diff-card:hover { box-shadow: 0 8px 32px rgba(7,137,85,0.08); transform: translateY(-2px); }
.diff-icon { width: 44px; height: 44px; border-radius: 10px; background: var(--green-pale); border: 1px solid var(--green-mid); display: flex; align-items: center; justify-content: center; margin-bottom: 20px; }
.diff-icon svg { width: 20px; height: 20px; stroke: var(--green); fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.diff-card h3 { font-size: 1rem; font-weight: 700; color: var(--ink); margin-bottom: 10px; letter-spacing: -0.01em; }
.diff-card p { font-size: 0.875rem; color: var(--ink-mid); line-height: 1.65; }
.diff-card .diff-vs { font-size: 0.78rem; color: var(--ink-light); margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border); display: flex; align-items: flex-start; gap: 6px; }
.diff-card .diff-vs::before { content: "vs"; font-weight: 700; color: var(--ink-xlight); flex-shrink: 0; }

/* ── HUB PRICING CALLOUT ─────────────────────────── */
.hub-section { padding: 88px 80px; background: var(--ink); border-bottom: 1px solid rgba(255,255,255,0.08); }
.hub-inner { max-width: 1100px; margin: 0 auto; }
.hub-label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green-mid); margin-bottom: 16px; display: flex; align-items: center; gap: 8px; }
.hub-label::before { content: ""; width: 16px; height: 2px; background: var(--green); border-radius: 1px; }
.hub-heading { font-size: clamp(1.7rem, 2.8vw, 2.4rem); font-weight: 800; color: white; letter-spacing: -0.025em; line-height: 1.15; margin-bottom: 12px; }
.hub-heading .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: var(--green-mid); }
.hub-subhead { font-size: 1rem; color: rgba(255,255,255,0.5); line-height: 1.65; max-width: 580px; margin-bottom: 48px; }
.hub-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.hub-card { border-radius: 14px; padding: 32px; }
.hub-card.ct-card { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1); }
.hub-card.pt-card { background: rgba(7,137,85,0.12); border: 1px solid rgba(7,137,85,0.3); }
.hub-card-name { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 20px; }
.hub-card.ct-card .hub-card-name { color: rgba(255,255,255,0.35); }
.hub-card.pt-card .hub-card-name { color: var(--green-mid); }
.hub-card h3 { font-size: 1.15rem; font-weight: 700; margin-bottom: 20px; }
.hub-card.ct-card h3 { color: rgba(255,255,255,0.7); }
.hub-card.pt-card h3 { color: white; }
.hub-tiers { display: flex; flex-direction: column; gap: 10px; margin-bottom: 24px; }
.hub-tier { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-radius: 8px; }
.hub-card.ct-card .hub-tier { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08); }
.hub-card.pt-card .hub-tier { background: rgba(7,137,85,0.15); border: 1px solid rgba(7,137,85,0.2); }
.hub-tier-name { font-size: 0.875rem; font-weight: 600; }
.hub-card.ct-card .hub-tier-name { color: rgba(255,255,255,0.6); }
.hub-card.pt-card .hub-tier-name { color: rgba(255,255,255,0.9); }
.hub-tier-note { font-size: 0.78rem; }
.hub-card.ct-card .hub-tier-note { color: rgba(255,255,255,0.35); }
.hub-card.pt-card .hub-tier-note { color: rgba(255,255,255,0.55); }
.hub-total { display: flex; align-items: center; justify-content: space-between; padding: 16px; border-radius: 8px; margin-top: 4px; }
.hub-card.ct-card .hub-total { background: rgba(239,68,68,0.1); border: 1px solid rgba(239,68,68,0.2); }
.hub-card.pt-card .hub-total { background: rgba(7,137,85,0.25); border: 1px solid rgba(7,137,85,0.4); }
.hub-total-label { font-size: 0.82rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
.hub-card.ct-card .hub-total-label { color: #fca5a5; }
.hub-card.pt-card .hub-total-label { color: var(--green-mid); }
.hub-total-value { font-size: 1.1rem; font-weight: 800; }
.hub-card.ct-card .hub-total-value { color: #f87171; }
.hub-card.pt-card .hub-total-value { color: white; }
.hub-footnote { font-size: 0.8rem; color: rgba(255,255,255,0.3); margin-top: 16px; line-height: 1.6; }
@media (max-width: 768px) {
  .hub-section { padding: 60px 20px; }
  .hub-grid { grid-template-columns: 1fr; }
}

/* ── COMPARISON TABLE ─────────────────────────── */
.table-section { padding: 88px 80px; background: white; border-bottom: 1px solid var(--border); }
.table-inner { max-width: 1100px; margin: 0 auto; }
.ctable { margin-top: 48px; border: 1px solid var(--border); border-radius: 14px; overflow: hidden; }
.ctable table { width: 100%; border-collapse: collapse; }
.ctable thead th { padding: 18px 24px; text-align: left; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ink-light); background: var(--surface-2); border-bottom: 1px solid var(--border); }
.ctable thead th.col-pt { background: var(--green-pale); color: var(--green); }
.ctable td { padding: 15px 24px; font-size: 0.875rem; color: var(--ink-mid); border-bottom: 1px solid var(--border); vertical-align: top; line-height: 1.5; }
.ctable td.col-pt { background: #fafff8; }
.ctable tr:last-child td { border-bottom: none; }
.ctable tbody tr:hover td { background: var(--surface-2); }
.ctable tbody tr:hover td.col-pt { background: #f3faf4; }
.ctable .section-row td { font-weight: 700; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ink); background: var(--surface-3); padding: 9px 24px; }
.ctable .section-row td.col-pt { background: #eaf7f0; color: var(--green-dark); }
.t-win { color: var(--green); font-weight: 600; }
.t-lose { color: var(--red); font-weight: 500; }
.t-neutral { color: var(--ink-mid); }

/* ── TESTIMONIAL ─────────────────────────── */
.testimonial-section { padding: 80px; background: var(--surface-2); border-bottom: 1px solid var(--border); }
.testimonial-inner { max-width: 900px; margin: 0 auto; text-align: center; }
.testimonial-quote { font-family: "Fraunces", serif; font-size: clamp(1.3rem, 2.2vw, 1.75rem); font-style: italic; font-weight: 600; color: var(--ink); line-height: 1.5; letter-spacing: -0.01em; margin-bottom: 32px; }
.testimonial-quote::before { content: "\201C"; color: var(--green); }
.testimonial-quote::after { content: "\201D"; color: var(--green); }
.testimonial-author { display: flex; align-items: center; justify-content: center; gap: 16px; }
.testimonial-avatar { width: 48px; height: 48px; border-radius: 50%; background: var(--ink); display: flex; align-items: center; justify-content: center; font-size: 1rem; font-weight: 800; color: white; font-family: "Fraunces", serif; }
.testimonial-meta strong { display: block; font-size: 0.9rem; font-weight: 700; color: var(--ink); }
.testimonial-meta span { font-size: 0.8rem; color: var(--ink-light); }

/* PRICING SECTION */
.pricing-section { padding: 88px 80px; background: var(--ink); border-bottom: 1px solid rgba(255,255,255,0.08); }
.pricing-inner { max-width: 1100px; margin: 0 auto; }
.pricing-label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green-mid); margin-bottom: 16px; display: flex; align-items: center; gap: 8px; }
.pricing-label::before { content: ""; width: 16px; height: 2px; background: var(--green); border-radius: 1px; }
.pricing-heading { font-size: clamp(1.7rem, 2.8vw, 2.4rem); font-weight: 800; color: white; letter-spacing: -0.025em; line-height: 1.15; margin-bottom: 12px; }
.pricing-heading .serif { font-family: "Fraunces", serif; font-style: italic; font-weight: 600; color: var(--green-mid); }
.pricing-subhead { font-size: 1rem; color: rgba(255,255,255,0.5); line-height: 1.65; max-width: 620px; margin-bottom: 48px; }
.pricing-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.pricing-card { border-radius: 14px; padding: 32px; }
.pricing-card.sw-card { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1); }
.pricing-card.pt-card { background: rgba(7,137,85,0.12); border: 1px solid rgba(7,137,85,0.3); }
.pricing-card-name { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 16px; }
.pricing-card.sw-card .pricing-card-name { color: rgba(255,255,255,0.35); }
.pricing-card.pt-card .pricing-card-name { color: var(--green-mid); }
.pricing-card h3 { font-size: 1.05rem; font-weight: 700; margin-bottom: 20px; line-height: 1.4; }
.pricing-card.sw-card h3 { color: rgba(255,255,255,0.7); }
.pricing-card.pt-card h3 { color: white; }
.pricing-tiers { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.pricing-tier { padding: 12px 16px; border-radius: 8px; }
.pricing-card.sw-card .pricing-tier { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.08); }
.pricing-card.pt-card .pricing-tier { background: rgba(7,137,85,0.15); border: 1px solid rgba(7,137,85,0.2); }
.pricing-tier-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.pricing-tier-name { font-size: 0.875rem; font-weight: 600; }
.pricing-card.sw-card .pricing-tier-name { color: rgba(255,255,255,0.75); }
.pricing-card.pt-card .pricing-tier-name { color: rgba(255,255,255,0.9); }
.pricing-tier-price { font-size: 0.875rem; font-weight: 700; white-space: nowrap; }
.pricing-card.sw-card .pricing-tier-price { color: rgba(255,255,255,0.45); }
.pricing-card.pt-card .pricing-tier-price { color: var(--green-mid); }
.pricing-tier-note { font-size: 0.75rem; margin-top: 4px; line-height: 1.45; }
.pricing-card.sw-card .pricing-tier-note { color: rgba(255,255,255,0.3); }
.pricing-card.pt-card .pricing-tier-note { color: rgba(255,255,255,0.45); }
.pricing-alert { display: flex; align-items: flex-start; gap: 10px; border-radius: 8px; padding: 14px 16px; margin-top: 12px; }
.pricing-alert.warning { background: rgba(220,38,38,0.1); border: 1px solid rgba(220,38,38,0.2); }
.pricing-alert.positive { background: rgba(7,137,85,0.2); border: 1px solid rgba(7,137,85,0.35); }
.pricing-alert-text { font-size: 0.82rem; line-height: 1.55; }
.pricing-alert.warning .pricing-alert-text { color: #fca5a5; }
.pricing-alert.positive .pricing-alert-text { color: rgba(255,255,255,0.75); }
.pricing-footnote { font-size: 0.78rem; color: rgba(255,255,255,0.3); margin-top: 14px; line-height: 1.6; }
.pricing-link { color: var(--green-mid); text-decoration: underline; text-underline-offset: 3px; }
.pricing-link:hover { color: white; }

/* POSITIONING SECTION */
.position-section { padding: 72px 80px; background: var(--ink); }
.position-inner { max-width: 1100px; margin: 0 auto; }
.position-label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--green-mid); margin-bottom: 16px; display: flex; align-items: center; gap: 8px; }
.position-label::before { content: ""; width: 16px; height: 2px; background: var(--green); border-radius: 1px; }
.position-heading { font-size: clamp(1.6rem, 2.5vw, 2.2rem); font-weight: 700; color: white; letter-spacing: -0.025em; line-height: 1.3; margin-bottom: 12px; max-width: 700px; }
.position-sub { font-size: 0.95rem; color: rgba(255,255,255,0.45); line-height: 1.65; max-width: 620px; margin-bottom: 40px; }
.position-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.position-card { border-radius: 12px; padding: 28px; }
.position-card.jobber { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); }
.position-card.proteams { background: rgba(7,137,85,0.12); border: 1px solid rgba(7,137,85,0.3); }
.position-card-label { font-size: 0.7rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 12px; }
.position-card.jobber .position-card-label { color: rgba(255,255,255,0.4); }
.position-card.proteams .position-card-label { color: var(--green-mid); }
.position-card h3 { font-size: 1rem; font-weight: 700; margin-bottom: 16px; line-height: 1.4; }
.position-card.jobber h3 { color: rgba(255,255,255,0.75); }
.position-card.proteams h3 { color: white; }
.position-list { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.position-list li { font-size: 0.875rem; line-height: 1.5; display: flex; align-items: flex-start; gap: 10px; }
.position-card.jobber .position-list li { color: rgba(255,255,255,0.55); }
.position-card.proteams .position-list li { color: rgba(255,255,255,0.8); }
.pl-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; margin-top: 6px; }
.position-card.jobber .pl-dot { background: rgba(255,255,255,0.25); }
.position-card.proteams .pl-dot { background: var(--green); }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .diff-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 768px) {

  .hero { padding: 90px 20px 60px; }
  .hero-proof { gap: 20px; }

  .honest-section,
  .verdict-section,
  .compare-page .founder-section,
  .diff-section,
  .pricing-section,
  .table-section,
  .testimonial-section,
  .cta-section {
    padding: 60px 20px;
  }

  .honest-grid,
  .verdict-inner,
  .pricing-grid {
    grid-template-columns: 1fr;
  }

  .compare-page .founder-inner {
    grid-template-columns: 1fr;
    gap: 32px;
  }

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

  .ctable { overflow-x: auto; }
}

/* ===============================
   compare CTA TEXT → WHITE
================================= */

.compare-page .feat-cta-band {
  color: white;
  text-align: center;
}

/* Heading */
.compare-page .feat-cta-band h2 {
  color: white;
}

/* Paragraph */
.compare-page .feat-cta-band p {
  color: rgba(255,255,255,0.75);
}

/* Top label (READY TO MAKE...) */
.compare-page .feat-cta-band div:first-child {
  color: rgba(255,255,255,0.6);
}

/* Bottom note */
.compare-page .feat-cta-band .cta-no-cc,
.compare-page .feat-cta-band div:last-child {
  color: rgba(255,255,255,0.6);
}

/* Serif highlight */
.compare-page .feat-cta-band .serif {
  color: rgba(255,255,255,0.85);
}

/*Home page Video Player Mobile Full Screen Button */
.custom-fs{
position:absolute;
bottom:12px;
right:12px;
z-index:10;
background:#000;
color:#fff;
border:none;
padding:8px 10px;
border-radius:6px;
font-size:14px;
cursor:pointer;
}

@media(min-width:768px){
.custom-fs{
display:none; /* only mobile */
}
}

/* ── HERO V2 FINAL (A/B SAFE + FIXED SCALE) ─────────────────────────── */

.hero-v2 .hero-inner {
  display: grid;
  grid-template-columns: 1.2fr 0.9fr;
  gap: 40px;
  align-items: center;
}

/* Allow image to break layout like old hero */
.hero-v2.hero {
  overflow: visible;
}

.hero-v2 .hero-visual {
  position: relative;
  display: flex;
  justify-content: flex-end; /* push right */
  align-items: center;
}

/* 🔥 IMAGE (MAIN FIX) */
.hero-v2 .hero-main-img {
  width: 100%;
  max-width: 950px; /* bigger than before */
  height: auto;
  display: block;

  /* key for "big hero feel" */
  transform: translateX(300px) scale(1.90);
  transform-origin: right center;
}

/* CTA */
.hero-v2 .hero-ctas {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

/* STATS */
.hero-v2 .hero-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

/* ── MOBILE ─────────────────────────── */
@media (max-width: 768px) {

  .hero-v2 .hero-inner {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .hero-v2 .hero-visual {
    justify-content: center;
  }

  .hero-v2 .hero-main-img {
    max-width: 100%;
    transform: none; /* prevent overflow issue */
    margin-top: 20px;
  }

  .hero-v2 .hero-ctas,
  .hero-v2 .hero-stats {
    justify-content: center;
  }
}

/*___Price Page Update */
.price-full {
    display: grid;
    align-items: baseline;
    gap: 6px;
    margin-bottom: 2px;
}
/*.price-savings-pill {
    font-size: .68rem;
    font-weight: 800;
    background: #fff3cd;
    border: 1px solid #f0c040;
    color: #8a6000;
    padding: 2px 40px;
    border-radius: 20px;
    white-space: nowrap;
    margin-left: 94px;
}*/

.price-full {
    display: flex;
    justify-content: flex-end; /* 🔥 move pill to right */
}

.price-savings-pill {
    display: inline-block;  /* keep natural width */
    width: auto;

    font-size: 12px;
    font-weight: 700;
    background: #fff3cd;
    border: 1px solid #f0c040;
    color: #8a6000;
    padding: 6px 18px;
    border-radius: 999px;
    line-height: 1;
    white-space: nowrap;
}


/* ── Full Website Mobile RESPONSIVE  ───────────────────────────  */
@media (max-width: 768px) {
  .ba-card.before .ba-list li {
    color: #000000;
    font-weight: 400;
	  font-size: 15px;
}
	.ba-card.after .ba-list li {
    color: #fff;
    font-weight: 400;
		font-size: 15px;
}
	.ba-card.after .ba-label {
    color: rgb(255 255 255);
}
	.story-card-desc {
    font-size: 16px;
    color: var(--ink);
		font-weight: 400;
}
	.story-card-title {
    font-size: 17px;

}
	.story-stat-lbl {
    font-size: 15px;
    color: var(--ink);
	font-weight: 400;
}
	.pq-text, .fgrid-desc {
    font-size: 16px;
    color: var(--ink-mid);
	font-weight: 400;
}
	.result-desc {
    font-size: 16px;
    color: var(--ink);
    font-weight: 400;
}
		.tcard-name {
    font-size: 15px;
    color: var(--green-bright);
}
	.tcard-role {
    font-size: 14px;
    color: rgba(255,255,255,0.85);
	font-weight: 400;
}
	.pain-stat-label {
    font-size: 16px;
    color: rgba(255,255,255,.85);
}
	.calc-result-label,.calc-label {
    font-size: 13.5px;
    color: var(--ink-mid);
}
	.calc-result-label {
    font-size: 13.5px;
    color: var(--ink-mid);
}
	.calc-val {
    min-width: 20px;
}
	.calc-slider-wrap {
    gap: 0px;
}
	.calc-roi-label {
    font-size: 14px;
}
	.calc-roi-text {
    font-size: 17px;
    color: var(--ink);
}
	.billing-label {
    font-size: 18px;
}
	.annual-badge {
    font-size: 14px;
}
	.only-proteams-label {
    font-size: 14.5px;
}
	.only-chip {
    font-size: 13.5;
}
	.plan-spec-row {
    font-size: 16px;
}
	.price-period {
    font-size: 16px;
    color: var(--ink-mid);
}
	.feature-section-label {
    font-size: 14px;
    color: var(--ink-mid);
}
	.features-list li {
    font-size: 15px;
    color: var(--ink);
}
	.plan-situation {
    font-size: 15px;
}
	.feat-table td,.feat-table-wrap td {
    font-size: 13.5px;
	font-weight: 400;
	color: var(--ink);
}
	.feat-table-wrap td:first-child {
    font-weight: 400;
}
	.feat-table-wrap th, .feat-table th, .feat-table-wrap .tsection td {
    font-size: 12px;
}
	.addon-item-price {
    font-size: 16px;
    color: var(--ink);
}
	.cobuilder-sig-name,.eyebrow {
    font-size: 15px;
	}
	.pq-name {
    font-size: 14px;
}
	.pq-role {
    font-size: 13px;
    color: var(--ink);
}
	.addons-note {
    font-size: 16px;
}
	.addons-label {
    font-size: 16px;
}
	.only-proteams-label {
    width: 100%; 
    text-align: center;
  }
	.feat-list li {
    font-size: 15px;
    font-weight: 300;
}
	.solution-list li {
    font-size: 15px;
	font-weight: 400;
	color: var(--ink-mid);
}   
	.challenge-num {
    font-size: 13px;
    color: var(--ink-light);
  }
	.solution-mock {
    min-height: 100%; /* Industry page image */
}
	.feature-tag {
    font-size: 12px;
}
	.feature-list li {
    font-size: 14px;
}
	.qualifier-label {
    font-size: 14px;
}
	.qualifier-text {
    font-size: 14px;
}
	.pain-detail {
    font-size: 15px;
    line-height: 1.7;
    font-weight: 400;
}
	.pain-scenario {
    font-size: 16px;
}
	.pain-tag {
    font-size: 11px;
}
	.faq-q, .faq-a, .founder-name {
    font-size: 15px;
}
	.founder-title {
    font-size: 14px;
    color: var(--ink-mid);
}
	.cred-text span {
    font-size: 14px;
    color: var(--ink-mid);
}
	.ops-stat-lbl {
    font-size: 14px;
    color: var(--ink-mid);
}
	.benefit-text strong {
    display: block;
    font-size: 16px;
}
	.benefit-text span {
    font-size: 15px;
    color: var(--ink-mid);
    line-height: 1.55;
}
	.trust-card h3 {
    font-size: 16px;
}
	.pterm-lbl {
    font-size: 14px;
    color: var(--ink-mid);
    font-weight: 500;
}
	.pricing-period {
    font-size: 13px;
}
	.cred-text strong, .pricing-amount {
    font-size: 14px;
}
	.avail-label {
    font-size: 14px;
}
	.avail-note {
    font-size: 13px;
    color: var(--ink-mid);
}
	.tl-desc, .feature-check-text {
    font-size: 16px;
}
	.cobuilder-item-text strong {
    font-size: 15px;
}
	.tl-week, .cobuilder-sig-title, .cobuilder-item-text span {
    font-size: 15px;
    color: var(--ink-mid);
    line-height: 1.7;
}
	.result-label {
    font-size: 16px;
}
	.tl-action {
    font-size: 15px;
}
	.cta-note {
    font-size: 13px
    color: var(--ink);
    align-self: center;
}
	
	 /*Blog*/
	/* Fix headings */
  .post-content h1 span,
  .post-content h2 span,
  .post-content h3 span,
  .entry-content h1 span,
  .entry-content h2 span,
  .entry-content h3 span {
    font-weight:700 !important;
  }

  /* Fix paragraph readability */
  .post-content p span,
  .entry-content p span {
    font-weight:400 !important;
    font-size:16px !important;
    line-height:1.7 !important;
  }
	.blog-excerpt {
    color: var(--ink-mid);
    margin-bottom: 18px;
    font-size: 16px;
}
    .post-content p,
  .entry-content p {
    font-size:16px !important;
    line-height:1.7 !important;
  }

  .post-content h1,
  .entry-content h1 {
    font-size:28px !important;
    line-height:1.2;
  }

  .post-content h2,
  .entry-content h2 {
    font-size:24px !important;
    line-height:1.25;
  }

  .post-content h3,
  .entry-content h3 {
    font-size:20px !important;
  }

  /* Improve readability */
  .post-content,
  .entry-content {
    padding-left:16px;
    padding-right:16px;
  }
	/* ONLY Start Free Trial button */
.mobile-menu .btn-nav-primary {
  color: #fff !important;
}
}