/* Extracted from original theelderit.com pages to preserve the old visual design. */

/* index.html inline style */
/* ============================================
   THE ELDER IT — Main Stylesheet
   Colors: Navy #0D1F3C | Gold #C9973A | White
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;900&family=Inter:wght@300;400;500;600&display=swap');

:root {
  --navy: #0D1F3C;
  --navy-light: #152e58;
  --gold: #C9973A;
  --gold-light: #e0b05a;
  --white: #ffffff;
  --off-white: #F7F5F0;
  --text-dark: #1a1a2e;
  --text-mid: #4a4a6a;
  --text-light: #8888aa;
  --border: #e2ddd4;
  --shadow: rgba(13, 31, 60, 0.12);
  --radius: 8px;
  --radius-lg: 16px;
}

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

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  color: var(--text-dark);
  background: var(--white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* ── TYPOGRAPHY ── */
h1, h2, h3 {
  font-family: 'Playfair Display', serif;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

h1 { font-size: clamp(2.4rem, 5vw, 4rem); font-weight: 900; }
h2 { font-size: clamp(1.8rem, 3.5vw, 2.8rem); font-weight: 700; }
h3 { font-size: clamp(1.2rem, 2vw, 1.5rem); font-weight: 700; }

p { line-height: 1.75; color: var(--text-mid); }

a { color: inherit; text-decoration: none; }

/* ── LAYOUT ── */
.container {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
}

.section {
  padding: 96px 0;
}

.section--alt {
  background: var(--off-white);
}

.section--dark {
  background: var(--navy);
  color: var(--white);
}

.section__eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  display: block;
}

.section__heading {
  margin-bottom: 16px;
}

.section__subheading {
  font-size: 1.15rem;
  color: var(--text-mid);
  max-width: 600px;
  margin-bottom: 56px;
}

.section--dark .section__subheading {
  color: rgba(255,255,255,0.7);
}

.section--dark h2 {
  color: var(--white);
}

/* ── NAV ── */
.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: var(--navy);
  border-bottom: 1px solid rgba(201, 151, 58, 0.2);
  transition: box-shadow 0.3s;
}

.nav.scrolled {
  box-shadow: 0 4px 24px rgba(13,31,60,0.35);
}

.nav__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 68px;
  padding: 0 24px;
  max-width: 1140px;
  margin: 0 auto;
}

.nav__logo {
  display: flex;
  flex-direction: column;
  line-height: 1;
}

.nav__logo-name {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 900;
  color: var(--white);
  letter-spacing: -0.01em;
}

.nav__logo-name span {
  color: var(--gold);
}

.nav__logo-tagline {
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
  margin-top: 3px;
}

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

.nav__links a {
  font-size: 0.875rem;
  font-weight: 500;
  color: rgba(255,255,255,0.75);
  transition: color 0.2s;
}

.nav__links a:hover {
  color: var(--gold);
}

.nav__cta {
  background: var(--gold);
  color: var(--navy) !important;
  padding: 10px 20px;
  border-radius: var(--radius);
  font-weight: 600 !important;
  transition: background 0.2s !important;
}

.nav__cta:hover {
  background: var(--gold-light) !important;
  color: var(--navy) !important;
}

.nav__hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 4px;
}

.nav__hamburger span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--white);
  border-radius: 2px;
  transition: all 0.3s;
}

/* ── HERO ── */
.hero {
  background: var(--navy);
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding-top: 68px;
  position: relative;
  overflow: hidden;
}

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

.hero::after {
  content: '';
  position: absolute;
  bottom: -10%;
  left: -5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(201,151,58,0.05) 0%, transparent 70%);
  pointer-events: none;
}

.hero__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
  padding: 80px 24px;
  max-width: 1140px;
  margin: 0 auto;
  width: 100%;
}

.hero__scroll-line {
  display: block;
  width: 1px;
  height: 48px;
  background: linear-gradient(to bottom, var(--gold), transparent);
  margin-bottom: 24px;
}

.hero__eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
  display: block;
}

.hero__heading {
  color: var(--white);
  margin-bottom: 24px;
}

.hero__heading em {
  font-style: normal;
  color: var(--gold);
}

.hero__body {
  font-size: 1.1rem;
  color: rgba(255,255,255,0.65);
  margin-bottom: 40px;
  max-width: 480px;
}

.hero__actions {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.hero__stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.hero__stat {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(201,151,58,0.2);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  position: relative;
  overflow: hidden;
}

.hero__stat::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(to right, var(--gold), transparent);
}

.hero__stat-number {
  font-family: 'Playfair Display', serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 8px;
}

.hero__stat-label {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.4;
}

.hero__stat-source {
  font-size: 0.65rem;
  color: rgba(255,255,255,0.3);
  margin-top: 6px;
  font-style: italic;
}

/* ── BUTTONS ── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 28px;
  border-radius: var(--radius);
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  border: none;
  text-decoration: none;
}

.btn--primary {
  background: var(--gold);
  color: var(--navy);
}

.btn--primary:hover {
  background: var(--gold-light);
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(201,151,58,0.3);
}

.btn--outline {
  background: transparent;
  color: var(--white);
  border: 1px solid rgba(255,255,255,0.3);
}

.btn--outline:hover {
  border-color: var(--gold);
  color: var(--gold);
}

.btn--navy {
  background: var(--navy);
  color: var(--white);
}

.btn--navy:hover {
  background: var(--navy-light);
  transform: translateY(-1px);
}

/* ── AUDIENCE CARDS ── */
.audience-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.audience-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}

.audience-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform 0.25s;
  transform-origin: left;
}

.audience-card:hover {
  border-color: var(--gold);
  box-shadow: 0 12px 40px var(--shadow);
  transform: translateY(-4px);
}

.audience-card:hover::after {
  transform: scaleX(1);
}

.audience-card__icon {
  font-size: 2rem;
  margin-bottom: 16px;
  display: block;
}

.audience-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 12px;
}

.audience-card__body {
  font-size: 0.9rem;
  color: var(--text-mid);
  line-height: 1.65;
}

.audience-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 16px;
}

.tag {
  font-size: 0.7rem;
  font-weight: 500;
  padding: 4px 10px;
  background: var(--off-white);
  border-radius: 100px;
  color: var(--text-mid);
}

/* ── THREAT SECTION ── */
.threat-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.threat-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  transition: border-color 0.2s;
}

.threat-card:hover {
  border-color: rgba(201,151,58,0.4);
}

.threat-card__icon {
  font-size: 1.5rem;
  margin-bottom: 14px;
  display: block;
}

.threat-card__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--white);
  margin-bottom: 8px;
}

.threat-card__body {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.6;
}

.threat-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 40px;
}

.threat-tab {
  padding: 10px 24px;
  border-radius: 100px;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid rgba(255,255,255,0.2);
  background: transparent;
  color: rgba(255,255,255,0.6);
  transition: all 0.2s;
  font-family: 'Inter', sans-serif;
}

.threat-tab.active,
.threat-tab:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--navy);
}

.threat-panel { display: none; }
.threat-panel.active { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

/* ── WARNING SIGNS ── */
.warning-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--white);
}

.warning-item {
  display: grid;
  grid-template-columns: 60px 1fr;
  align-items: center;
  gap: 24px;
  padding: 24px 28px;
  border-bottom: 1px solid var(--border);
  transition: background 0.2s;
}

.warning-item:last-child { border-bottom: none; }

.warning-item:hover {
  background: rgba(201,151,58,0.06);
}

.warning-item__number {
  font-family: 'Playfair Display', serif;
  font-size: 2rem;
  font-weight: 900;
  color: var(--gold);
  opacity: 0.6;
  line-height: 1;
}

.warning-item__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
}

.warning-item__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.6;
}

/* ── SERVICES ── */
.services-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.service-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px 28px;
  transition: all 0.25s;
}

.service-card:hover {
  box-shadow: 0 12px 40px var(--shadow);
  border-color: rgba(201,151,58,0.4);
}

.service-card__icon {
  font-size: 1.75rem;
  margin-bottom: 16px;
  display: block;
}

.service-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 10px;
}

.service-card__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
}

/* ── PLANS ── */
.plans-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  align-items: start;
}

.plan-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px 24px;
  position: relative;
  transition: all 0.25s;
}

.plan-card:hover {
  box-shadow: 0 16px 48px var(--shadow);
  transform: translateY(-4px);
}

.plan-card--featured {
  border: 2px solid var(--gold);
  background: var(--navy);
  color: var(--white);
}

.plan-card--featured .plan-card__price,
.plan-card--featured .plan-card__name {
  color: var(--white);
}

.plan-card--featured .plan-card__feature {
  color: rgba(255,255,255,0.75);
  border-color: rgba(255,255,255,0.1);
}

.plan-card--featured .plan-card__feature::before {
  color: var(--gold);
}

.plan-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--gold);
  color: var(--navy);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 14px;
  border-radius: 100px;
  white-space: nowrap;
}

.plan-card__name {
  font-family: 'Playfair Display', serif;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 8px;
}

.plan-card__price {
  font-family: 'Playfair Display', serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--navy);
  line-height: 1;
  margin-bottom: 4px;
}

.plan-card__price span {
  font-size: 1rem;
  font-weight: 400;
  font-family: 'Inter', sans-serif;
  color: var(--text-light);
}

.plan-card__hst {
  font-size: 0.72rem;
  color: var(--text-light);
  margin-bottom: 20px;
}

.plan-card--featured .plan-card__hst {
  color: rgba(255,255,255,0.4);
}

.plan-card__divider {
  height: 1px;
  background: var(--border);
  margin: 16px 0;
}

.plan-card--featured .plan-card__divider {
  background: rgba(255,255,255,0.1);
}

.plan-card__features {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 24px;
}

.plan-card__feature {
  font-size: 0.82rem;
  color: var(--text-mid);
  padding-left: 20px;
  position: relative;
  border-bottom: 1px solid var(--border);
  padding-bottom: 10px;
  line-height: 1.4;
}

.plan-card__feature:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.plan-card__feature::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--gold);
  font-weight: 700;
  font-size: 0.75rem;
}

.plan-card .btn {
  width: 100%;
  justify-content: center;
}

/* ── FAQ ── */
.faq-list {
  max-width: 760px;
  margin: 0 auto;
}

.faq-item {
  border-bottom: 1px solid var(--border);
}

.faq-question {
  width: 100%;
  background: none;
  border: none;
  text-align: left;
  padding: 24px 0;
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  font-weight: 600;
  color: var(--navy);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  transition: color 0.2s;
}

.faq-question:hover {
  color: var(--gold);
}

.faq-question svg {
  flex-shrink: 0;
  transition: transform 0.25s;
  color: var(--gold);
}

.faq-item.open .faq-question svg {
  transform: rotate(45deg);
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease, padding 0.2s;
}

.faq-item.open .faq-answer {
  max-height: 400px;
  padding-bottom: 24px;
}

.faq-answer p {
  font-size: 0.95rem;
  color: var(--text-mid);
  line-height: 1.75;
}

/* ── CONTACT / BOOKING ── */
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 64px;
  align-items: start;
}

.contact-info__item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 28px;
}

.contact-info__icon {
  width: 44px;
  height: 44px;
  background: rgba(201,151,58,0.1);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
  color: var(--gold);
}

.contact-info__label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--gold);
  margin-bottom: 4px;
}

.contact-info__value {
  font-size: 0.95rem;
  color: var(--text-mid);
}

.contact-info__value a {
  color: var(--navy);
  font-weight: 500;
  transition: color 0.2s;
}

.contact-info__value a:hover {
  color: var(--gold);
}

.booking-form {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 40px;
}

.form-group {
  margin-bottom: 20px;
}

.form-label {
  display: block;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--navy);
  margin-bottom: 8px;
  letter-spacing: 0.02em;
}

.form-input,
.form-select,
.form-textarea {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  color: var(--text-dark);
  background: var(--white);
  transition: border-color 0.2s, box-shadow 0.2s;
  appearance: none;
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(201,151,58,0.12);
}

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

.form-textarea {
  resize: vertical;
  min-height: 100px;
}

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

.form-note {
  font-size: 0.78rem;
  color: var(--text-light);
  margin-top: 12px;
  text-align: center;
}

.form-success {
  display: none;
  text-align: center;
  padding: 32px;
}

.form-success__icon {
  font-size: 2.5rem;
  margin-bottom: 12px;
}

.form-success__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  color: var(--navy);
  margin-bottom: 8px;
}

.form-success__body {
  font-size: 0.9rem;
  color: var(--text-mid);
}

/* ── MISSION BANNER ── */
.mission-banner {
  background: var(--navy);
  padding: 80px 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.mission-banner::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 800px;
  height: 800px;
  background: radial-gradient(circle, rgba(201,151,58,0.06) 0%, transparent 65%);
  pointer-events: none;
}

.mission-banner__quote {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.6rem, 3.5vw, 2.8rem);
  font-weight: 700;
  font-style: italic;
  color: var(--white);
  max-width: 800px;
  margin: 0 auto 24px;
  line-height: 1.3;
}

.mission-banner__quote em {
  color: var(--gold);
  font-style: normal;
}

.mission-banner__attr {
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
}

/* ── FOOTER ── */
.footer {
  background: #080f1e;
  color: rgba(255,255,255,0.6);
  padding: 64px 0 32px;
}

.footer__grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 48px;
  margin-bottom: 48px;
}

.footer__logo-name {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-weight: 900;
  color: var(--white);
  margin-bottom: 8px;
}

.footer__logo-name span {
  color: var(--gold);
}

.footer__tagline {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.4);
  margin-bottom: 20px;
  line-height: 1.5;
}

.footer__differentiator {
  font-size: 0.82rem;
  font-style: italic;
  color: var(--gold);
  opacity: 0.8;
}

.footer__heading {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 16px;
}

.footer__links {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.footer__links a {
  font-size: 0.875rem;
  color: rgba(255,255,255,0.55);
  transition: color 0.2s;
}

.footer__links a:hover {
  color: var(--gold);
}

.footer__divider {
  height: 1px;
  background: rgba(255,255,255,0.07);
  margin-bottom: 28px;
}

.footer__bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.78rem;
  color: rgba(255,255,255,0.3);
}

/* ── PROTECTION PLAN ── */
.protection-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

.protection-step {
  text-align: center;
  padding: 40px 28px;
  background: var(--off-white);
  border-radius: var(--radius-lg);
  position: relative;
}

.protection-step__number {
  width: 52px;
  height: 52px;
  background: var(--navy);
  color: var(--gold);
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  font-weight: 900;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}

.protection-step__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 12px;
}

.protection-step__items {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-align: left;
}

.protection-step__item {
  font-size: 0.85rem;
  color: var(--text-mid);
  padding-left: 16px;
  position: relative;
  line-height: 1.5;
}

.protection-step__item::before {
  content: '→';
  position: absolute;
  left: 0;
  color: var(--gold);
  font-size: 0.75rem;
}

/* ── ABOUT SECTION ── */
.about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

.about-principle {
  background: var(--navy);
  border-radius: var(--radius-lg);
  padding: 40px;
  margin-top: 32px;
}

.about-principle__text {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-style: italic;
  color: var(--white);
  line-height: 1.5;
  margin-bottom: 12px;
}

.about-principle__attr {
  font-size: 0.75rem;
  color: var(--gold);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.about-values {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.about-value {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.about-value__icon {
  width: 48px;
  height: 48px;
  background: rgba(201,151,58,0.1);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}

.about-value__title {
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
  font-size: 1rem;
}

.about-value__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
}

/* ── REGION PILLS ── */
.region-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.region-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(201,151,58,0.1);
  border: 1px solid rgba(201,151,58,0.25);
  color: var(--navy);
  font-size: 0.82rem;
  font-weight: 500;
  padding: 8px 16px;
  border-radius: 100px;
}

.region-pill::before {
  content: '📍';
  font-size: 0.75rem;
}

/* ── SCROLL ANIMATIONS ── */
.fade-up {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-up.visible {
  opacity: 1;
  transform: translateY(0);
}

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

@media (max-width: 900px) {
  .hero__inner {
    grid-template-columns: 1fr;
    gap: 48px;
    padding: 60px 24px;
  }

  .hero__stats {
    grid-template-columns: repeat(2, 1fr);
  }

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

  .threat-grid,
  .threat-panel.active {
    grid-template-columns: 1fr 1fr;
  }

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

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

  .about-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .protection-steps {
    grid-template-columns: 1fr;
  }

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

@media (max-width: 640px) {
  .section { padding: 64px 0; }

  .nav__links { display: none; }
  .nav__hamburger { display: flex; }

  .nav__links.mobile-open {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 68px;
    left: 0;
    right: 0;
    background: var(--navy);
    padding: 24px;
    gap: 20px;
    border-top: 1px solid rgba(201,151,58,0.2);
    z-index: 99;
  }

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

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

  .threat-grid,
  .threat-panel.active {
    grid-template-columns: 1fr;
  }

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

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

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

  .footer__bottom {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }

  .booking-form {
    padding: 24px;
  }

  .warning-item {
    grid-template-columns: 40px 1fr;
    gap: 16px;
    padding: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fade-up { transition: none; opacity: 1; transform: none; }
  * { transition-duration: 0.01ms !important; }
}


/* ── HOMEPAGE SECTION CARDS ── */
.home-sections {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 56px;
}

.home-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  text-decoration: none;
  display: block;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}

.home-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform 0.25s;
  transform-origin: left;
}

.home-card:hover {
  border-color: var(--gold);
  box-shadow: 0 12px 40px var(--shadow);
  transform: translateY(-4px);
}

.home-card:hover::after {
  transform: scaleX(1);
}

.home-card__icon {
  font-size: 2rem;
  margin-bottom: 16px;
  display: block;
}

.home-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 10px;
}

.home-card__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
  margin-bottom: 20px;
}

.home-card__arrow {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--gold);
  letter-spacing: 0.05em;
}

/* ── PAGE HEADER ── */
.page-header {
  background: var(--navy);
  padding: 120px 0 64px;
  position: relative;
  overflow: hidden;
}

.page-header::before {
  content: '';
  position: absolute;
  top: -20%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(201,151,58,0.08) 0%, transparent 70%);
  pointer-events: none;
}

.page-header__eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  display: block;
}

.page-header__title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight: 900;
  color: var(--white);
  line-height: 1.15;
  margin-bottom: 16px;
}

.page-header__body {
  font-size: 1.05rem;
  color: rgba(255,255,255,0.65);
  max-width: 560px;
}

/* ── ACTIVE NAV ── */
.nav__links a.active {
  color: var(--gold);
}

@media (max-width: 900px) {
  .home-sections {
    grid-template-columns: repeat(2, 1fr);
  }
}

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

/* about.html inline style */
/* ============================================
   THE ELDER IT — Main Stylesheet
   Colors: Navy #0D1F3C | Gold #C9973A | White
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;900&family=Inter:wght@300;400;500;600&display=swap');

:root {
  --navy: #0D1F3C;
  --navy-light: #152e58;
  --gold: #C9973A;
  --gold-light: #e0b05a;
  --white: #ffffff;
  --off-white: #F7F5F0;
  --text-dark: #1a1a2e;
  --text-mid: #4a4a6a;
  --text-light: #8888aa;
  --border: #e2ddd4;
  --shadow: rgba(13, 31, 60, 0.12);
  --radius: 8px;
  --radius-lg: 16px;
}

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

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  color: var(--text-dark);
  background: var(--white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* ── TYPOGRAPHY ── */
h1, h2, h3 {
  font-family: 'Playfair Display', serif;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

h1 { font-size: clamp(2.4rem, 5vw, 4rem); font-weight: 900; }
h2 { font-size: clamp(1.8rem, 3.5vw, 2.8rem); font-weight: 700; }
h3 { font-size: clamp(1.2rem, 2vw, 1.5rem); font-weight: 700; }

p { line-height: 1.75; color: var(--text-mid); }

a { color: inherit; text-decoration: none; }

/* ── LAYOUT ── */
.container {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
}

.section {
  padding: 96px 0;
}

.section--alt {
  background: var(--off-white);
}

.section--dark {
  background: var(--navy);
  color: var(--white);
}

.section__eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  display: block;
}

.section__heading {
  margin-bottom: 16px;
}

.section__subheading {
  font-size: 1.15rem;
  color: var(--text-mid);
  max-width: 600px;
  margin-bottom: 56px;
}

.section--dark .section__subheading {
  color: rgba(255,255,255,0.7);
}

.section--dark h2 {
  color: var(--white);
}

/* ── NAV ── */
.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: var(--navy);
  border-bottom: 1px solid rgba(201, 151, 58, 0.2);
  transition: box-shadow 0.3s;
}

.nav.scrolled {
  box-shadow: 0 4px 24px rgba(13,31,60,0.35);
}

.nav__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 68px;
  padding: 0 24px;
  max-width: 1140px;
  margin: 0 auto;
}

.nav__logo {
  display: flex;
  flex-direction: column;
  line-height: 1;
}

.nav__logo-name {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 900;
  color: var(--white);
  letter-spacing: -0.01em;
}

.nav__logo-name span {
  color: var(--gold);
}

.nav__logo-tagline {
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
  margin-top: 3px;
}

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

.nav__links a {
  font-size: 0.875rem;
  font-weight: 500;
  color: rgba(255,255,255,0.75);
  transition: color 0.2s;
}

.nav__links a:hover {
  color: var(--gold);
}

.nav__cta {
  background: var(--gold);
  color: var(--navy) !important;
  padding: 10px 20px;
  border-radius: var(--radius);
  font-weight: 600 !important;
  transition: background 0.2s !important;
}

.nav__cta:hover {
  background: var(--gold-light) !important;
  color: var(--navy) !important;
}

.nav__hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 4px;
}

.nav__hamburger span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--white);
  border-radius: 2px;
  transition: all 0.3s;
}

/* ── HERO ── */
.hero {
  background: var(--navy);
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding-top: 68px;
  position: relative;
  overflow: hidden;
}

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

.hero::after {
  content: '';
  position: absolute;
  bottom: -10%;
  left: -5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(201,151,58,0.05) 0%, transparent 70%);
  pointer-events: none;
}

.hero__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
  padding: 80px 24px;
  max-width: 1140px;
  margin: 0 auto;
  width: 100%;
}

.hero__scroll-line {
  display: block;
  width: 1px;
  height: 48px;
  background: linear-gradient(to bottom, var(--gold), transparent);
  margin-bottom: 24px;
}

.hero__eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
  display: block;
}

.hero__heading {
  color: var(--white);
  margin-bottom: 24px;
}

.hero__heading em {
  font-style: normal;
  color: var(--gold);
}

.hero__body {
  font-size: 1.1rem;
  color: rgba(255,255,255,0.65);
  margin-bottom: 40px;
  max-width: 480px;
}

.hero__actions {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.hero__stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.hero__stat {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(201,151,58,0.2);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  position: relative;
  overflow: hidden;
}

.hero__stat::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(to right, var(--gold), transparent);
}

.hero__stat-number {
  font-family: 'Playfair Display', serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 8px;
}

.hero__stat-label {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.4;
}

.hero__stat-source {
  font-size: 0.65rem;
  color: rgba(255,255,255,0.3);
  margin-top: 6px;
  font-style: italic;
}

/* ── BUTTONS ── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 28px;
  border-radius: var(--radius);
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  border: none;
  text-decoration: none;
}

.btn--primary {
  background: var(--gold);
  color: var(--navy);
}

.btn--primary:hover {
  background: var(--gold-light);
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(201,151,58,0.3);
}

.btn--outline {
  background: transparent;
  color: var(--white);
  border: 1px solid rgba(255,255,255,0.3);
}

.btn--outline:hover {
  border-color: var(--gold);
  color: var(--gold);
}

.btn--navy {
  background: var(--navy);
  color: var(--white);
}

.btn--navy:hover {
  background: var(--navy-light);
  transform: translateY(-1px);
}

/* ── AUDIENCE CARDS ── */
.audience-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.audience-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}

.audience-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform 0.25s;
  transform-origin: left;
}

.audience-card:hover {
  border-color: var(--gold);
  box-shadow: 0 12px 40px var(--shadow);
  transform: translateY(-4px);
}

.audience-card:hover::after {
  transform: scaleX(1);
}

.audience-card__icon {
  font-size: 2rem;
  margin-bottom: 16px;
  display: block;
}

.audience-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 12px;
}

.audience-card__body {
  font-size: 0.9rem;
  color: var(--text-mid);
  line-height: 1.65;
}

.audience-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 16px;
}

.tag {
  font-size: 0.7rem;
  font-weight: 500;
  padding: 4px 10px;
  background: var(--off-white);
  border-radius: 100px;
  color: var(--text-mid);
}

/* ── THREAT SECTION ── */
.threat-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.threat-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  transition: border-color 0.2s;
}

.threat-card:hover {
  border-color: rgba(201,151,58,0.4);
}

.threat-card__icon {
  font-size: 1.5rem;
  margin-bottom: 14px;
  display: block;
}

.threat-card__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--white);
  margin-bottom: 8px;
}

.threat-card__body {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.6;
}

.threat-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 40px;
}

.threat-tab {
  padding: 10px 24px;
  border-radius: 100px;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid rgba(255,255,255,0.2);
  background: transparent;
  color: rgba(255,255,255,0.6);
  transition: all 0.2s;
  font-family: 'Inter', sans-serif;
}

.threat-tab.active,
.threat-tab:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--navy);
}

.threat-panel { display: none; }
.threat-panel.active { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

/* ── WARNING SIGNS ── */
.warning-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--white);
}

.warning-item {
  display: grid;
  grid-template-columns: 60px 1fr;
  align-items: center;
  gap: 24px;
  padding: 24px 28px;
  border-bottom: 1px solid var(--border);
  transition: background 0.2s;
}

.warning-item:last-child { border-bottom: none; }

.warning-item:hover {
  background: rgba(201,151,58,0.06);
}

.warning-item__number {
  font-family: 'Playfair Display', serif;
  font-size: 2rem;
  font-weight: 900;
  color: var(--gold);
  opacity: 0.6;
  line-height: 1;
}

.warning-item__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
}

.warning-item__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.6;
}

/* ── SERVICES ── */
.services-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.service-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px 28px;
  transition: all 0.25s;
}

.service-card:hover {
  box-shadow: 0 12px 40px var(--shadow);
  border-color: rgba(201,151,58,0.4);
}

.service-card__icon {
  font-size: 1.75rem;
  margin-bottom: 16px;
  display: block;
}

.service-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 10px;
}

.service-card__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
}

/* ── PLANS ── */
.plans-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  align-items: start;
}

.plan-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px 24px;
  position: relative;
  transition: all 0.25s;
}

.plan-card:hover {
  box-shadow: 0 16px 48px var(--shadow);
  transform: translateY(-4px);
}

.plan-card--featured {
  border: 2px solid var(--gold);
  background: var(--navy);
  color: var(--white);
}

.plan-card--featured .plan-card__price,
.plan-card--featured .plan-card__name {
  color: var(--white);
}

.plan-card--featured .plan-card__feature {
  color: rgba(255,255,255,0.75);
  border-color: rgba(255,255,255,0.1);
}

.plan-card--featured .plan-card__feature::before {
  color: var(--gold);
}

.plan-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--gold);
  color: var(--navy);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 14px;
  border-radius: 100px;
  white-space: nowrap;
}

.plan-card__name {
  font-family: 'Playfair Display', serif;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 8px;
}

.plan-card__price {
  font-family: 'Playfair Display', serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--navy);
  line-height: 1;
  margin-bottom: 4px;
}

.plan-card__price span {
  font-size: 1rem;
  font-weight: 400;
  font-family: 'Inter', sans-serif;
  color: var(--text-light);
}

.plan-card__hst {
  font-size: 0.72rem;
  color: var(--text-light);
  margin-bottom: 20px;
}

.plan-card--featured .plan-card__hst {
  color: rgba(255,255,255,0.4);
}

.plan-card__divider {
  height: 1px;
  background: var(--border);
  margin: 16px 0;
}

.plan-card--featured .plan-card__divider {
  background: rgba(255,255,255,0.1);
}

.plan-card__features {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 24px;
}

.plan-card__feature {
  font-size: 0.82rem;
  color: var(--text-mid);
  padding-left: 20px;
  position: relative;
  border-bottom: 1px solid var(--border);
  padding-bottom: 10px;
  line-height: 1.4;
}

.plan-card__feature:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.plan-card__feature::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--gold);
  font-weight: 700;
  font-size: 0.75rem;
}

.plan-card .btn {
  width: 100%;
  justify-content: center;
}

/* ── FAQ ── */
.faq-list {
  max-width: 760px;
  margin: 0 auto;
}

.faq-item {
  border-bottom: 1px solid var(--border);
}

.faq-question {
  width: 100%;
  background: none;
  border: none;
  text-align: left;
  padding: 24px 0;
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  font-weight: 600;
  color: var(--navy);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  transition: color 0.2s;
}

.faq-question:hover {
  color: var(--gold);
}

.faq-question svg {
  flex-shrink: 0;
  transition: transform 0.25s;
  color: var(--gold);
}

.faq-item.open .faq-question svg {
  transform: rotate(45deg);
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease, padding 0.2s;
}

.faq-item.open .faq-answer {
  max-height: 400px;
  padding-bottom: 24px;
}

.faq-answer p {
  font-size: 0.95rem;
  color: var(--text-mid);
  line-height: 1.75;
}

/* ── CONTACT / BOOKING ── */
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 64px;
  align-items: start;
}

.contact-info__item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 28px;
}

.contact-info__icon {
  width: 44px;
  height: 44px;
  background: rgba(201,151,58,0.1);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
  color: var(--gold);
}

.contact-info__label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--gold);
  margin-bottom: 4px;
}

.contact-info__value {
  font-size: 0.95rem;
  color: var(--text-mid);
}

.contact-info__value a {
  color: var(--navy);
  font-weight: 500;
  transition: color 0.2s;
}

.contact-info__value a:hover {
  color: var(--gold);
}

.booking-form {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 40px;
}

.form-group {
  margin-bottom: 20px;
}

.form-label {
  display: block;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--navy);
  margin-bottom: 8px;
  letter-spacing: 0.02em;
}

.form-input,
.form-select,
.form-textarea {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  color: var(--text-dark);
  background: var(--white);
  transition: border-color 0.2s, box-shadow 0.2s;
  appearance: none;
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(201,151,58,0.12);
}

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

.form-textarea {
  resize: vertical;
  min-height: 100px;
}

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

.form-note {
  font-size: 0.78rem;
  color: var(--text-light);
  margin-top: 12px;
  text-align: center;
}

.form-success {
  display: none;
  text-align: center;
  padding: 32px;
}

.form-success__icon {
  font-size: 2.5rem;
  margin-bottom: 12px;
}

.form-success__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  color: var(--navy);
  margin-bottom: 8px;
}

.form-success__body {
  font-size: 0.9rem;
  color: var(--text-mid);
}

/* ── MISSION BANNER ── */
.mission-banner {
  background: var(--navy);
  padding: 80px 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.mission-banner::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 800px;
  height: 800px;
  background: radial-gradient(circle, rgba(201,151,58,0.06) 0%, transparent 65%);
  pointer-events: none;
}

.mission-banner__quote {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.6rem, 3.5vw, 2.8rem);
  font-weight: 700;
  font-style: italic;
  color: var(--white);
  max-width: 800px;
  margin: 0 auto 24px;
  line-height: 1.3;
}

.mission-banner__quote em {
  color: var(--gold);
  font-style: normal;
}

.mission-banner__attr {
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
}

/* ── FOOTER ── */
.footer {
  background: #080f1e;
  color: rgba(255,255,255,0.6);
  padding: 64px 0 32px;
}

.footer__grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 48px;
  margin-bottom: 48px;
}

.footer__logo-name {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-weight: 900;
  color: var(--white);
  margin-bottom: 8px;
}

.footer__logo-name span {
  color: var(--gold);
}

.footer__tagline {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.4);
  margin-bottom: 20px;
  line-height: 1.5;
}

.footer__differentiator {
  font-size: 0.82rem;
  font-style: italic;
  color: var(--gold);
  opacity: 0.8;
}

.footer__heading {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 16px;
}

.footer__links {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.footer__links a {
  font-size: 0.875rem;
  color: rgba(255,255,255,0.55);
  transition: color 0.2s;
}

.footer__links a:hover {
  color: var(--gold);
}

.footer__divider {
  height: 1px;
  background: rgba(255,255,255,0.07);
  margin-bottom: 28px;
}

.footer__bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.78rem;
  color: rgba(255,255,255,0.3);
}

/* ── PROTECTION PLAN ── */
.protection-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

.protection-step {
  text-align: center;
  padding: 40px 28px;
  background: var(--off-white);
  border-radius: var(--radius-lg);
  position: relative;
}

.protection-step__number {
  width: 52px;
  height: 52px;
  background: var(--navy);
  color: var(--gold);
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  font-weight: 900;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}

.protection-step__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 12px;
}

.protection-step__items {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-align: left;
}

.protection-step__item {
  font-size: 0.85rem;
  color: var(--text-mid);
  padding-left: 16px;
  position: relative;
  line-height: 1.5;
}

.protection-step__item::before {
  content: '→';
  position: absolute;
  left: 0;
  color: var(--gold);
  font-size: 0.75rem;
}

/* ── ABOUT SECTION ── */
.about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

.about-principle {
  background: var(--navy);
  border-radius: var(--radius-lg);
  padding: 40px;
  margin-top: 32px;
}

.about-principle__text {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-style: italic;
  color: var(--white);
  line-height: 1.5;
  margin-bottom: 12px;
}

.about-principle__attr {
  font-size: 0.75rem;
  color: var(--gold);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.about-values {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.about-value {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.about-value__icon {
  width: 48px;
  height: 48px;
  background: rgba(201,151,58,0.1);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}

.about-value__title {
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
  font-size: 1rem;
}

.about-value__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
}

/* ── REGION PILLS ── */
.region-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.region-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(201,151,58,0.1);
  border: 1px solid rgba(201,151,58,0.25);
  color: var(--navy);
  font-size: 0.82rem;
  font-weight: 500;
  padding: 8px 16px;
  border-radius: 100px;
}

.region-pill::before {
  content: '📍';
  font-size: 0.75rem;
}

/* ── SCROLL ANIMATIONS ── */
.fade-up {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-up.visible {
  opacity: 1;
  transform: translateY(0);
}

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

@media (max-width: 900px) {
  .hero__inner {
    grid-template-columns: 1fr;
    gap: 48px;
    padding: 60px 24px;
  }

  .hero__stats {
    grid-template-columns: repeat(2, 1fr);
  }

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

  .threat-grid,
  .threat-panel.active {
    grid-template-columns: 1fr 1fr;
  }

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

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

  .about-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .protection-steps {
    grid-template-columns: 1fr;
  }

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

@media (max-width: 640px) {
  .section { padding: 64px 0; }

  .nav__links { display: none; }
  .nav__hamburger { display: flex; }

  .nav__links.mobile-open {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 68px;
    left: 0;
    right: 0;
    background: var(--navy);
    padding: 24px;
    gap: 20px;
    border-top: 1px solid rgba(201,151,58,0.2);
    z-index: 99;
  }

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

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

  .threat-grid,
  .threat-panel.active {
    grid-template-columns: 1fr;
  }

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

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

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

  .footer__bottom {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }

  .booking-form {
    padding: 24px;
  }

  .warning-item {
    grid-template-columns: 40px 1fr;
    gap: 16px;
    padding: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fade-up { transition: none; opacity: 1; transform: none; }
  * { transition-duration: 0.01ms !important; }
}


/* ── HOMEPAGE SECTION CARDS ── */
.home-sections {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 56px;
}

.home-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  text-decoration: none;
  display: block;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}

.home-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform 0.25s;
  transform-origin: left;
}

.home-card:hover {
  border-color: var(--gold);
  box-shadow: 0 12px 40px var(--shadow);
  transform: translateY(-4px);
}

.home-card:hover::after {
  transform: scaleX(1);
}

.home-card__icon {
  font-size: 2rem;
  margin-bottom: 16px;
  display: block;
}

.home-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 10px;
}

.home-card__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
  margin-bottom: 20px;
}

.home-card__arrow {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--gold);
  letter-spacing: 0.05em;
}

/* ── PAGE HEADER ── */
.page-header {
  background: var(--navy);
  padding: 120px 0 64px;
  position: relative;
  overflow: hidden;
}

.page-header::before {
  content: '';
  position: absolute;
  top: -20%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(201,151,58,0.08) 0%, transparent 70%);
  pointer-events: none;
}

.page-header__eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  display: block;
}

.page-header__title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight: 900;
  color: var(--white);
  line-height: 1.15;
  margin-bottom: 16px;
}

.page-header__body {
  font-size: 1.05rem;
  color: rgba(255,255,255,0.65);
  max-width: 560px;
}

/* ── ACTIVE NAV ── */
.nav__links a.active {
  color: var(--gold);
}

@media (max-width: 900px) {
  .home-sections {
    grid-template-columns: repeat(2, 1fr);
  }
}

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

/* awareness.html inline style */
/* ============================================
   THE ELDER IT — Main Stylesheet
   Colors: Navy #0D1F3C | Gold #C9973A | White
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;900&family=Inter:wght@300;400;500;600&display=swap');

:root {
  --navy: #0D1F3C;
  --navy-light: #152e58;
  --gold: #C9973A;
  --gold-light: #e0b05a;
  --white: #ffffff;
  --off-white: #F7F5F0;
  --text-dark: #1a1a2e;
  --text-mid: #4a4a6a;
  --text-light: #8888aa;
  --border: #e2ddd4;
  --shadow: rgba(13, 31, 60, 0.12);
  --radius: 8px;
  --radius-lg: 16px;
}

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

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  color: var(--text-dark);
  background: var(--white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* ── TYPOGRAPHY ── */
h1, h2, h3 {
  font-family: 'Playfair Display', serif;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

h1 { font-size: clamp(2.4rem, 5vw, 4rem); font-weight: 900; }
h2 { font-size: clamp(1.8rem, 3.5vw, 2.8rem); font-weight: 700; }
h3 { font-size: clamp(1.2rem, 2vw, 1.5rem); font-weight: 700; }

p { line-height: 1.75; color: var(--text-mid); }

a { color: inherit; text-decoration: none; }

/* ── LAYOUT ── */
.container {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
}

.section {
  padding: 96px 0;
}

.section--alt {
  background: var(--off-white);
}

.section--dark {
  background: var(--navy);
  color: var(--white);
}

.section__eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  display: block;
}

.section__heading {
  margin-bottom: 16px;
}

.section__subheading {
  font-size: 1.15rem;
  color: var(--text-mid);
  max-width: 600px;
  margin-bottom: 56px;
}

.section--dark .section__subheading {
  color: rgba(255,255,255,0.7);
}

.section--dark h2 {
  color: var(--white);
}

/* ── NAV ── */
.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: var(--navy);
  border-bottom: 1px solid rgba(201, 151, 58, 0.2);
  transition: box-shadow 0.3s;
}

.nav.scrolled {
  box-shadow: 0 4px 24px rgba(13,31,60,0.35);
}

.nav__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 68px;
  padding: 0 24px;
  max-width: 1140px;
  margin: 0 auto;
}

.nav__logo {
  display: flex;
  flex-direction: column;
  line-height: 1;
}

.nav__logo-name {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 900;
  color: var(--white);
  letter-spacing: -0.01em;
}

.nav__logo-name span {
  color: var(--gold);
}

.nav__logo-tagline {
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
  margin-top: 3px;
}

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

.nav__links a {
  font-size: 0.875rem;
  font-weight: 500;
  color: rgba(255,255,255,0.75);
  transition: color 0.2s;
}

.nav__links a:hover {
  color: var(--gold);
}

.nav__cta {
  background: var(--gold);
  color: var(--navy) !important;
  padding: 10px 20px;
  border-radius: var(--radius);
  font-weight: 600 !important;
  transition: background 0.2s !important;
}

.nav__cta:hover {
  background: var(--gold-light) !important;
  color: var(--navy) !important;
}

.nav__hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 4px;
}

.nav__hamburger span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--white);
  border-radius: 2px;
  transition: all 0.3s;
}

/* ── HERO ── */
.hero {
  background: var(--navy);
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding-top: 68px;
  position: relative;
  overflow: hidden;
}

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

.hero::after {
  content: '';
  position: absolute;
  bottom: -10%;
  left: -5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(201,151,58,0.05) 0%, transparent 70%);
  pointer-events: none;
}

.hero__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
  padding: 80px 24px;
  max-width: 1140px;
  margin: 0 auto;
  width: 100%;
}

.hero__scroll-line {
  display: block;
  width: 1px;
  height: 48px;
  background: linear-gradient(to bottom, var(--gold), transparent);
  margin-bottom: 24px;
}

.hero__eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
  display: block;
}

.hero__heading {
  color: var(--white);
  margin-bottom: 24px;
}

.hero__heading em {
  font-style: normal;
  color: var(--gold);
}

.hero__body {
  font-size: 1.1rem;
  color: rgba(255,255,255,0.65);
  margin-bottom: 40px;
  max-width: 480px;
}

.hero__actions {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.hero__stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.hero__stat {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(201,151,58,0.2);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  position: relative;
  overflow: hidden;
}

.hero__stat::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(to right, var(--gold), transparent);
}

.hero__stat-number {
  font-family: 'Playfair Display', serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 8px;
}

.hero__stat-label {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.4;
}

.hero__stat-source {
  font-size: 0.65rem;
  color: rgba(255,255,255,0.3);
  margin-top: 6px;
  font-style: italic;
}

/* ── BUTTONS ── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 28px;
  border-radius: var(--radius);
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  border: none;
  text-decoration: none;
}

.btn--primary {
  background: var(--gold);
  color: var(--navy);
}

.btn--primary:hover {
  background: var(--gold-light);
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(201,151,58,0.3);
}

.btn--outline {
  background: transparent;
  color: var(--white);
  border: 1px solid rgba(255,255,255,0.3);
}

.btn--outline:hover {
  border-color: var(--gold);
  color: var(--gold);
}

.btn--navy {
  background: var(--navy);
  color: var(--white);
}

.btn--navy:hover {
  background: var(--navy-light);
  transform: translateY(-1px);
}

/* ── AUDIENCE CARDS ── */
.audience-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.audience-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}

.audience-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform 0.25s;
  transform-origin: left;
}

.audience-card:hover {
  border-color: var(--gold);
  box-shadow: 0 12px 40px var(--shadow);
  transform: translateY(-4px);
}

.audience-card:hover::after {
  transform: scaleX(1);
}

.audience-card__icon {
  font-size: 2rem;
  margin-bottom: 16px;
  display: block;
}

.audience-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 12px;
}

.audience-card__body {
  font-size: 0.9rem;
  color: var(--text-mid);
  line-height: 1.65;
}

.audience-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 16px;
}

.tag {
  font-size: 0.7rem;
  font-weight: 500;
  padding: 4px 10px;
  background: var(--off-white);
  border-radius: 100px;
  color: var(--text-mid);
}

/* ── THREAT SECTION ── */
.threat-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.threat-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  transition: border-color 0.2s;
}

.threat-card:hover {
  border-color: rgba(201,151,58,0.4);
}

.threat-card__icon {
  font-size: 1.5rem;
  margin-bottom: 14px;
  display: block;
}

.threat-card__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--white);
  margin-bottom: 8px;
}

.threat-card__body {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.6;
}

.threat-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 40px;
}

.threat-tab {
  padding: 10px 24px;
  border-radius: 100px;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid rgba(255,255,255,0.2);
  background: transparent;
  color: rgba(255,255,255,0.6);
  transition: all 0.2s;
  font-family: 'Inter', sans-serif;
}

.threat-tab.active,
.threat-tab:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--navy);
}

.threat-panel { display: none; }
.threat-panel.active { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

/* ── WARNING SIGNS ── */
.warning-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--white);
}

.warning-item {
  display: grid;
  grid-template-columns: 60px 1fr;
  align-items: center;
  gap: 24px;
  padding: 24px 28px;
  border-bottom: 1px solid var(--border);
  transition: background 0.2s;
}

.warning-item:last-child { border-bottom: none; }

.warning-item:hover {
  background: rgba(201,151,58,0.06);
}

.warning-item__number {
  font-family: 'Playfair Display', serif;
  font-size: 2rem;
  font-weight: 900;
  color: var(--gold);
  opacity: 0.6;
  line-height: 1;
}

.warning-item__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
}

.warning-item__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.6;
}

/* ── SERVICES ── */
.services-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.service-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px 28px;
  transition: all 0.25s;
}

.service-card:hover {
  box-shadow: 0 12px 40px var(--shadow);
  border-color: rgba(201,151,58,0.4);
}

.service-card__icon {
  font-size: 1.75rem;
  margin-bottom: 16px;
  display: block;
}

.service-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 10px;
}

.service-card__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
}

/* ── PLANS ── */
.plans-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  align-items: start;
}

.plan-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px 24px;
  position: relative;
  transition: all 0.25s;
}

.plan-card:hover {
  box-shadow: 0 16px 48px var(--shadow);
  transform: translateY(-4px);
}

.plan-card--featured {
  border: 2px solid var(--gold);
  background: var(--navy);
  color: var(--white);
}

.plan-card--featured .plan-card__price,
.plan-card--featured .plan-card__name {
  color: var(--white);
}

.plan-card--featured .plan-card__feature {
  color: rgba(255,255,255,0.75);
  border-color: rgba(255,255,255,0.1);
}

.plan-card--featured .plan-card__feature::before {
  color: var(--gold);
}

.plan-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--gold);
  color: var(--navy);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 14px;
  border-radius: 100px;
  white-space: nowrap;
}

.plan-card__name {
  font-family: 'Playfair Display', serif;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 8px;
}

.plan-card__price {
  font-family: 'Playfair Display', serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--navy);
  line-height: 1;
  margin-bottom: 4px;
}

.plan-card__price span {
  font-size: 1rem;
  font-weight: 400;
  font-family: 'Inter', sans-serif;
  color: var(--text-light);
}

.plan-card__hst {
  font-size: 0.72rem;
  color: var(--text-light);
  margin-bottom: 20px;
}

.plan-card--featured .plan-card__hst {
  color: rgba(255,255,255,0.4);
}

.plan-card__divider {
  height: 1px;
  background: var(--border);
  margin: 16px 0;
}

.plan-card--featured .plan-card__divider {
  background: rgba(255,255,255,0.1);
}

.plan-card__features {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 24px;
}

.plan-card__feature {
  font-size: 0.82rem;
  color: var(--text-mid);
  padding-left: 20px;
  position: relative;
  border-bottom: 1px solid var(--border);
  padding-bottom: 10px;
  line-height: 1.4;
}

.plan-card__feature:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.plan-card__feature::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--gold);
  font-weight: 700;
  font-size: 0.75rem;
}

.plan-card .btn {
  width: 100%;
  justify-content: center;
}

/* ── FAQ ── */
.faq-list {
  max-width: 760px;
  margin: 0 auto;
}

.faq-item {
  border-bottom: 1px solid var(--border);
}

.faq-question {
  width: 100%;
  background: none;
  border: none;
  text-align: left;
  padding: 24px 0;
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  font-weight: 600;
  color: var(--navy);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  transition: color 0.2s;
}

.faq-question:hover {
  color: var(--gold);
}

.faq-question svg {
  flex-shrink: 0;
  transition: transform 0.25s;
  color: var(--gold);
}

.faq-item.open .faq-question svg {
  transform: rotate(45deg);
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease, padding 0.2s;
}

.faq-item.open .faq-answer {
  max-height: 400px;
  padding-bottom: 24px;
}

.faq-answer p {
  font-size: 0.95rem;
  color: var(--text-mid);
  line-height: 1.75;
}

/* ── CONTACT / BOOKING ── */
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 64px;
  align-items: start;
}

.contact-info__item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 28px;
}

.contact-info__icon {
  width: 44px;
  height: 44px;
  background: rgba(201,151,58,0.1);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
  color: var(--gold);
}

.contact-info__label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--gold);
  margin-bottom: 4px;
}

.contact-info__value {
  font-size: 0.95rem;
  color: var(--text-mid);
}

.contact-info__value a {
  color: var(--navy);
  font-weight: 500;
  transition: color 0.2s;
}

.contact-info__value a:hover {
  color: var(--gold);
}

.booking-form {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 40px;
}

.form-group {
  margin-bottom: 20px;
}

.form-label {
  display: block;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--navy);
  margin-bottom: 8px;
  letter-spacing: 0.02em;
}

.form-input,
.form-select,
.form-textarea {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  color: var(--text-dark);
  background: var(--white);
  transition: border-color 0.2s, box-shadow 0.2s;
  appearance: none;
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(201,151,58,0.12);
}

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

.form-textarea {
  resize: vertical;
  min-height: 100px;
}

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

.form-note {
  font-size: 0.78rem;
  color: var(--text-light);
  margin-top: 12px;
  text-align: center;
}

.form-success {
  display: none;
  text-align: center;
  padding: 32px;
}

.form-success__icon {
  font-size: 2.5rem;
  margin-bottom: 12px;
}

.form-success__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  color: var(--navy);
  margin-bottom: 8px;
}

.form-success__body {
  font-size: 0.9rem;
  color: var(--text-mid);
}

/* ── MISSION BANNER ── */
.mission-banner {
  background: var(--navy);
  padding: 80px 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.mission-banner::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 800px;
  height: 800px;
  background: radial-gradient(circle, rgba(201,151,58,0.06) 0%, transparent 65%);
  pointer-events: none;
}

.mission-banner__quote {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.6rem, 3.5vw, 2.8rem);
  font-weight: 700;
  font-style: italic;
  color: var(--white);
  max-width: 800px;
  margin: 0 auto 24px;
  line-height: 1.3;
}

.mission-banner__quote em {
  color: var(--gold);
  font-style: normal;
}

.mission-banner__attr {
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
}

/* ── FOOTER ── */
.footer {
  background: #080f1e;
  color: rgba(255,255,255,0.6);
  padding: 64px 0 32px;
}

.footer__grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 48px;
  margin-bottom: 48px;
}

.footer__logo-name {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-weight: 900;
  color: var(--white);
  margin-bottom: 8px;
}

.footer__logo-name span {
  color: var(--gold);
}

.footer__tagline {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.4);
  margin-bottom: 20px;
  line-height: 1.5;
}

.footer__differentiator {
  font-size: 0.82rem;
  font-style: italic;
  color: var(--gold);
  opacity: 0.8;
}

.footer__heading {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 16px;
}

.footer__links {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.footer__links a {
  font-size: 0.875rem;
  color: rgba(255,255,255,0.55);
  transition: color 0.2s;
}

.footer__links a:hover {
  color: var(--gold);
}

.footer__divider {
  height: 1px;
  background: rgba(255,255,255,0.07);
  margin-bottom: 28px;
}

.footer__bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.78rem;
  color: rgba(255,255,255,0.3);
}

/* ── PROTECTION PLAN ── */
.protection-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

.protection-step {
  text-align: center;
  padding: 40px 28px;
  background: var(--off-white);
  border-radius: var(--radius-lg);
  position: relative;
}

.protection-step__number {
  width: 52px;
  height: 52px;
  background: var(--navy);
  color: var(--gold);
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  font-weight: 900;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}

.protection-step__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 12px;
}

.protection-step__items {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-align: left;
}

.protection-step__item {
  font-size: 0.85rem;
  color: var(--text-mid);
  padding-left: 16px;
  position: relative;
  line-height: 1.5;
}

.protection-step__item::before {
  content: '→';
  position: absolute;
  left: 0;
  color: var(--gold);
  font-size: 0.75rem;
}

/* ── ABOUT SECTION ── */
.about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

.about-principle {
  background: var(--navy);
  border-radius: var(--radius-lg);
  padding: 40px;
  margin-top: 32px;
}

.about-principle__text {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-style: italic;
  color: var(--white);
  line-height: 1.5;
  margin-bottom: 12px;
}

.about-principle__attr {
  font-size: 0.75rem;
  color: var(--gold);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.about-values {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.about-value {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.about-value__icon {
  width: 48px;
  height: 48px;
  background: rgba(201,151,58,0.1);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}

.about-value__title {
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
  font-size: 1rem;
}

.about-value__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
}

/* ── REGION PILLS ── */
.region-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.region-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(201,151,58,0.1);
  border: 1px solid rgba(201,151,58,0.25);
  color: var(--navy);
  font-size: 0.82rem;
  font-weight: 500;
  padding: 8px 16px;
  border-radius: 100px;
}

.region-pill::before {
  content: '📍';
  font-size: 0.75rem;
}

/* ── SCROLL ANIMATIONS ── */
.fade-up {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-up.visible {
  opacity: 1;
  transform: translateY(0);
}

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

@media (max-width: 900px) {
  .hero__inner {
    grid-template-columns: 1fr;
    gap: 48px;
    padding: 60px 24px;
  }

  .hero__stats {
    grid-template-columns: repeat(2, 1fr);
  }

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

  .threat-grid,
  .threat-panel.active {
    grid-template-columns: 1fr 1fr;
  }

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

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

  .about-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .protection-steps {
    grid-template-columns: 1fr;
  }

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

@media (max-width: 640px) {
  .section { padding: 64px 0; }

  .nav__links { display: none; }
  .nav__hamburger { display: flex; }

  .nav__links.mobile-open {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 68px;
    left: 0;
    right: 0;
    background: var(--navy);
    padding: 24px;
    gap: 20px;
    border-top: 1px solid rgba(201,151,58,0.2);
    z-index: 99;
  }

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

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

  .threat-grid,
  .threat-panel.active {
    grid-template-columns: 1fr;
  }

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

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

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

  .footer__bottom {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }

  .booking-form {
    padding: 24px;
  }

  .warning-item {
    grid-template-columns: 40px 1fr;
    gap: 16px;
    padding: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fade-up { transition: none; opacity: 1; transform: none; }
  * { transition-duration: 0.01ms !important; }
}


/* ── HOMEPAGE SECTION CARDS ── */
.home-sections {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 56px;
}

.home-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  text-decoration: none;
  display: block;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}

.home-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform 0.25s;
  transform-origin: left;
}

.home-card:hover {
  border-color: var(--gold);
  box-shadow: 0 12px 40px var(--shadow);
  transform: translateY(-4px);
}

.home-card:hover::after {
  transform: scaleX(1);
}

.home-card__icon {
  font-size: 2rem;
  margin-bottom: 16px;
  display: block;
}

.home-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 10px;
}

.home-card__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
  margin-bottom: 20px;
}

.home-card__arrow {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--gold);
  letter-spacing: 0.05em;
}

/* ── PAGE HEADER ── */
.page-header {
  background: var(--navy);
  padding: 120px 0 64px;
  position: relative;
  overflow: hidden;
}

.page-header::before {
  content: '';
  position: absolute;
  top: -20%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(201,151,58,0.08) 0%, transparent 70%);
  pointer-events: none;
}

.page-header__eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  display: block;
}

.page-header__title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight: 900;
  color: var(--white);
  line-height: 1.15;
  margin-bottom: 16px;
}

.page-header__body {
  font-size: 1.05rem;
  color: rgba(255,255,255,0.65);
  max-width: 560px;
}

/* ── ACTIVE NAV ── */
.nav__links a.active {
  color: var(--gold);
}

@media (max-width: 900px) {
  .home-sections {
    grid-template-columns: repeat(2, 1fr);
  }
}

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

/* services.html inline style */
/* ============================================
   THE ELDER IT — Main Stylesheet
   Colors: Navy #0D1F3C | Gold #C9973A | White
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;900&family=Inter:wght@300;400;500;600&display=swap');

:root {
  --navy: #0D1F3C;
  --navy-light: #152e58;
  --gold: #C9973A;
  --gold-light: #e0b05a;
  --white: #ffffff;
  --off-white: #F7F5F0;
  --text-dark: #1a1a2e;
  --text-mid: #4a4a6a;
  --text-light: #8888aa;
  --border: #e2ddd4;
  --shadow: rgba(13, 31, 60, 0.12);
  --radius: 8px;
  --radius-lg: 16px;
}

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

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  color: var(--text-dark);
  background: var(--white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* ── TYPOGRAPHY ── */
h1, h2, h3 {
  font-family: 'Playfair Display', serif;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

h1 { font-size: clamp(2.4rem, 5vw, 4rem); font-weight: 900; }
h2 { font-size: clamp(1.8rem, 3.5vw, 2.8rem); font-weight: 700; }
h3 { font-size: clamp(1.2rem, 2vw, 1.5rem); font-weight: 700; }

p { line-height: 1.75; color: var(--text-mid); }

a { color: inherit; text-decoration: none; }

/* ── LAYOUT ── */
.container {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
}

.section {
  padding: 96px 0;
}

.section--alt {
  background: var(--off-white);
}

.section--dark {
  background: var(--navy);
  color: var(--white);
}

.section__eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  display: block;
}

.section__heading {
  margin-bottom: 16px;
}

.section__subheading {
  font-size: 1.15rem;
  color: var(--text-mid);
  max-width: 600px;
  margin-bottom: 56px;
}

.section--dark .section__subheading {
  color: rgba(255,255,255,0.7);
}

.section--dark h2 {
  color: var(--white);
}

/* ── NAV ── */
.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: var(--navy);
  border-bottom: 1px solid rgba(201, 151, 58, 0.2);
  transition: box-shadow 0.3s;
}

.nav.scrolled {
  box-shadow: 0 4px 24px rgba(13,31,60,0.35);
}

.nav__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 68px;
  padding: 0 24px;
  max-width: 1140px;
  margin: 0 auto;
}

.nav__logo {
  display: flex;
  flex-direction: column;
  line-height: 1;
}

.nav__logo-name {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 900;
  color: var(--white);
  letter-spacing: -0.01em;
}

.nav__logo-name span {
  color: var(--gold);
}

.nav__logo-tagline {
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
  margin-top: 3px;
}

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

.nav__links a {
  font-size: 0.875rem;
  font-weight: 500;
  color: rgba(255,255,255,0.75);
  transition: color 0.2s;
}

.nav__links a:hover {
  color: var(--gold);
}

.nav__cta {
  background: var(--gold);
  color: var(--navy) !important;
  padding: 10px 20px;
  border-radius: var(--radius);
  font-weight: 600 !important;
  transition: background 0.2s !important;
}

.nav__cta:hover {
  background: var(--gold-light) !important;
  color: var(--navy) !important;
}

.nav__hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 4px;
}

.nav__hamburger span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--white);
  border-radius: 2px;
  transition: all 0.3s;
}

/* ── HERO ── */
.hero {
  background: var(--navy);
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding-top: 68px;
  position: relative;
  overflow: hidden;
}

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

.hero::after {
  content: '';
  position: absolute;
  bottom: -10%;
  left: -5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(201,151,58,0.05) 0%, transparent 70%);
  pointer-events: none;
}

.hero__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
  padding: 80px 24px;
  max-width: 1140px;
  margin: 0 auto;
  width: 100%;
}

.hero__scroll-line {
  display: block;
  width: 1px;
  height: 48px;
  background: linear-gradient(to bottom, var(--gold), transparent);
  margin-bottom: 24px;
}

.hero__eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
  display: block;
}

.hero__heading {
  color: var(--white);
  margin-bottom: 24px;
}

.hero__heading em {
  font-style: normal;
  color: var(--gold);
}

.hero__body {
  font-size: 1.1rem;
  color: rgba(255,255,255,0.65);
  margin-bottom: 40px;
  max-width: 480px;
}

.hero__actions {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.hero__stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.hero__stat {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(201,151,58,0.2);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  position: relative;
  overflow: hidden;
}

.hero__stat::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(to right, var(--gold), transparent);
}

.hero__stat-number {
  font-family: 'Playfair Display', serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 8px;
}

.hero__stat-label {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.4;
}

.hero__stat-source {
  font-size: 0.65rem;
  color: rgba(255,255,255,0.3);
  margin-top: 6px;
  font-style: italic;
}

/* ── BUTTONS ── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 28px;
  border-radius: var(--radius);
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  border: none;
  text-decoration: none;
}

.btn--primary {
  background: var(--gold);
  color: var(--navy);
}

.btn--primary:hover {
  background: var(--gold-light);
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(201,151,58,0.3);
}

.btn--outline {
  background: transparent;
  color: var(--white);
  border: 1px solid rgba(255,255,255,0.3);
}

.btn--outline:hover {
  border-color: var(--gold);
  color: var(--gold);
}

.btn--navy {
  background: var(--navy);
  color: var(--white);
}

.btn--navy:hover {
  background: var(--navy-light);
  transform: translateY(-1px);
}

/* ── AUDIENCE CARDS ── */
.audience-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.audience-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}

.audience-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform 0.25s;
  transform-origin: left;
}

.audience-card:hover {
  border-color: var(--gold);
  box-shadow: 0 12px 40px var(--shadow);
  transform: translateY(-4px);
}

.audience-card:hover::after {
  transform: scaleX(1);
}

.audience-card__icon {
  font-size: 2rem;
  margin-bottom: 16px;
  display: block;
}

.audience-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 12px;
}

.audience-card__body {
  font-size: 0.9rem;
  color: var(--text-mid);
  line-height: 1.65;
}

.audience-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 16px;
}

.tag {
  font-size: 0.7rem;
  font-weight: 500;
  padding: 4px 10px;
  background: var(--off-white);
  border-radius: 100px;
  color: var(--text-mid);
}

/* ── THREAT SECTION ── */
.threat-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.threat-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  transition: border-color 0.2s;
}

.threat-card:hover {
  border-color: rgba(201,151,58,0.4);
}

.threat-card__icon {
  font-size: 1.5rem;
  margin-bottom: 14px;
  display: block;
}

.threat-card__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--white);
  margin-bottom: 8px;
}

.threat-card__body {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.6;
}

.threat-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 40px;
}

.threat-tab {
  padding: 10px 24px;
  border-radius: 100px;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid rgba(255,255,255,0.2);
  background: transparent;
  color: rgba(255,255,255,0.6);
  transition: all 0.2s;
  font-family: 'Inter', sans-serif;
}

.threat-tab.active,
.threat-tab:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--navy);
}

.threat-panel { display: none; }
.threat-panel.active { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

/* ── WARNING SIGNS ── */
.warning-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--white);
}

.warning-item {
  display: grid;
  grid-template-columns: 60px 1fr;
  align-items: center;
  gap: 24px;
  padding: 24px 28px;
  border-bottom: 1px solid var(--border);
  transition: background 0.2s;
}

.warning-item:last-child { border-bottom: none; }

.warning-item:hover {
  background: rgba(201,151,58,0.06);
}

.warning-item__number {
  font-family: 'Playfair Display', serif;
  font-size: 2rem;
  font-weight: 900;
  color: var(--gold);
  opacity: 0.6;
  line-height: 1;
}

.warning-item__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
}

.warning-item__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.6;
}

/* ── SERVICES ── */
.services-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.service-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px 28px;
  transition: all 0.25s;
}

.service-card:hover {
  box-shadow: 0 12px 40px var(--shadow);
  border-color: rgba(201,151,58,0.4);
}

.service-card__icon {
  font-size: 1.75rem;
  margin-bottom: 16px;
  display: block;
}

.service-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 10px;
}

.service-card__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
}

/* ── PLANS ── */
.plans-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  align-items: start;
}

.plan-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px 24px;
  position: relative;
  transition: all 0.25s;
}

.plan-card:hover {
  box-shadow: 0 16px 48px var(--shadow);
  transform: translateY(-4px);
}

.plan-card--featured {
  border: 2px solid var(--gold);
  background: var(--navy);
  color: var(--white);
}

.plan-card--featured .plan-card__price,
.plan-card--featured .plan-card__name {
  color: var(--white);
}

.plan-card--featured .plan-card__feature {
  color: rgba(255,255,255,0.75);
  border-color: rgba(255,255,255,0.1);
}

.plan-card--featured .plan-card__feature::before {
  color: var(--gold);
}

.plan-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--gold);
  color: var(--navy);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 14px;
  border-radius: 100px;
  white-space: nowrap;
}

.plan-card__name {
  font-family: 'Playfair Display', serif;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 8px;
}

.plan-card__price {
  font-family: 'Playfair Display', serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--navy);
  line-height: 1;
  margin-bottom: 4px;
}

.plan-card__price span {
  font-size: 1rem;
  font-weight: 400;
  font-family: 'Inter', sans-serif;
  color: var(--text-light);
}

.plan-card__hst {
  font-size: 0.72rem;
  color: var(--text-light);
  margin-bottom: 20px;
}

.plan-card--featured .plan-card__hst {
  color: rgba(255,255,255,0.4);
}

.plan-card__divider {
  height: 1px;
  background: var(--border);
  margin: 16px 0;
}

.plan-card--featured .plan-card__divider {
  background: rgba(255,255,255,0.1);
}

.plan-card__features {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 24px;
}

.plan-card__feature {
  font-size: 0.82rem;
  color: var(--text-mid);
  padding-left: 20px;
  position: relative;
  border-bottom: 1px solid var(--border);
  padding-bottom: 10px;
  line-height: 1.4;
}

.plan-card__feature:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.plan-card__feature::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--gold);
  font-weight: 700;
  font-size: 0.75rem;
}

.plan-card .btn {
  width: 100%;
  justify-content: center;
}

/* ── FAQ ── */
.faq-list {
  max-width: 760px;
  margin: 0 auto;
}

.faq-item {
  border-bottom: 1px solid var(--border);
}

.faq-question {
  width: 100%;
  background: none;
  border: none;
  text-align: left;
  padding: 24px 0;
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  font-weight: 600;
  color: var(--navy);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  transition: color 0.2s;
}

.faq-question:hover {
  color: var(--gold);
}

.faq-question svg {
  flex-shrink: 0;
  transition: transform 0.25s;
  color: var(--gold);
}

.faq-item.open .faq-question svg {
  transform: rotate(45deg);
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease, padding 0.2s;
}

.faq-item.open .faq-answer {
  max-height: 400px;
  padding-bottom: 24px;
}

.faq-answer p {
  font-size: 0.95rem;
  color: var(--text-mid);
  line-height: 1.75;
}

/* ── CONTACT / BOOKING ── */
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 64px;
  align-items: start;
}

.contact-info__item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 28px;
}

.contact-info__icon {
  width: 44px;
  height: 44px;
  background: rgba(201,151,58,0.1);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
  color: var(--gold);
}

.contact-info__label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--gold);
  margin-bottom: 4px;
}

.contact-info__value {
  font-size: 0.95rem;
  color: var(--text-mid);
}

.contact-info__value a {
  color: var(--navy);
  font-weight: 500;
  transition: color 0.2s;
}

.contact-info__value a:hover {
  color: var(--gold);
}

.booking-form {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 40px;
}

.form-group {
  margin-bottom: 20px;
}

.form-label {
  display: block;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--navy);
  margin-bottom: 8px;
  letter-spacing: 0.02em;
}

.form-input,
.form-select,
.form-textarea {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  color: var(--text-dark);
  background: var(--white);
  transition: border-color 0.2s, box-shadow 0.2s;
  appearance: none;
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(201,151,58,0.12);
}

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

.form-textarea {
  resize: vertical;
  min-height: 100px;
}

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

.form-note {
  font-size: 0.78rem;
  color: var(--text-light);
  margin-top: 12px;
  text-align: center;
}

.form-success {
  display: none;
  text-align: center;
  padding: 32px;
}

.form-success__icon {
  font-size: 2.5rem;
  margin-bottom: 12px;
}

.form-success__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  color: var(--navy);
  margin-bottom: 8px;
}

.form-success__body {
  font-size: 0.9rem;
  color: var(--text-mid);
}

/* ── MISSION BANNER ── */
.mission-banner {
  background: var(--navy);
  padding: 80px 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.mission-banner::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 800px;
  height: 800px;
  background: radial-gradient(circle, rgba(201,151,58,0.06) 0%, transparent 65%);
  pointer-events: none;
}

.mission-banner__quote {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.6rem, 3.5vw, 2.8rem);
  font-weight: 700;
  font-style: italic;
  color: var(--white);
  max-width: 800px;
  margin: 0 auto 24px;
  line-height: 1.3;
}

.mission-banner__quote em {
  color: var(--gold);
  font-style: normal;
}

.mission-banner__attr {
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
}

/* ── FOOTER ── */
.footer {
  background: #080f1e;
  color: rgba(255,255,255,0.6);
  padding: 64px 0 32px;
}

.footer__grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 48px;
  margin-bottom: 48px;
}

.footer__logo-name {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-weight: 900;
  color: var(--white);
  margin-bottom: 8px;
}

.footer__logo-name span {
  color: var(--gold);
}

.footer__tagline {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.4);
  margin-bottom: 20px;
  line-height: 1.5;
}

.footer__differentiator {
  font-size: 0.82rem;
  font-style: italic;
  color: var(--gold);
  opacity: 0.8;
}

.footer__heading {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 16px;
}

.footer__links {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.footer__links a {
  font-size: 0.875rem;
  color: rgba(255,255,255,0.55);
  transition: color 0.2s;
}

.footer__links a:hover {
  color: var(--gold);
}

.footer__divider {
  height: 1px;
  background: rgba(255,255,255,0.07);
  margin-bottom: 28px;
}

.footer__bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.78rem;
  color: rgba(255,255,255,0.3);
}

/* ── PROTECTION PLAN ── */
.protection-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

.protection-step {
  text-align: center;
  padding: 40px 28px;
  background: var(--off-white);
  border-radius: var(--radius-lg);
  position: relative;
}

.protection-step__number {
  width: 52px;
  height: 52px;
  background: var(--navy);
  color: var(--gold);
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  font-weight: 900;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}

.protection-step__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 12px;
}

.protection-step__items {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-align: left;
}

.protection-step__item {
  font-size: 0.85rem;
  color: var(--text-mid);
  padding-left: 16px;
  position: relative;
  line-height: 1.5;
}

.protection-step__item::before {
  content: '→';
  position: absolute;
  left: 0;
  color: var(--gold);
  font-size: 0.75rem;
}

/* ── ABOUT SECTION ── */
.about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

.about-principle {
  background: var(--navy);
  border-radius: var(--radius-lg);
  padding: 40px;
  margin-top: 32px;
}

.about-principle__text {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-style: italic;
  color: var(--white);
  line-height: 1.5;
  margin-bottom: 12px;
}

.about-principle__attr {
  font-size: 0.75rem;
  color: var(--gold);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.about-values {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.about-value {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.about-value__icon {
  width: 48px;
  height: 48px;
  background: rgba(201,151,58,0.1);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}

.about-value__title {
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
  font-size: 1rem;
}

.about-value__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
}

/* ── REGION PILLS ── */
.region-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.region-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(201,151,58,0.1);
  border: 1px solid rgba(201,151,58,0.25);
  color: var(--navy);
  font-size: 0.82rem;
  font-weight: 500;
  padding: 8px 16px;
  border-radius: 100px;
}

.region-pill::before {
  content: '📍';
  font-size: 0.75rem;
}

/* ── SCROLL ANIMATIONS ── */
.fade-up {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-up.visible {
  opacity: 1;
  transform: translateY(0);
}

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

@media (max-width: 900px) {
  .hero__inner {
    grid-template-columns: 1fr;
    gap: 48px;
    padding: 60px 24px;
  }

  .hero__stats {
    grid-template-columns: repeat(2, 1fr);
  }

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

  .threat-grid,
  .threat-panel.active {
    grid-template-columns: 1fr 1fr;
  }

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

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

  .about-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .protection-steps {
    grid-template-columns: 1fr;
  }

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

@media (max-width: 640px) {
  .section { padding: 64px 0; }

  .nav__links { display: none; }
  .nav__hamburger { display: flex; }

  .nav__links.mobile-open {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 68px;
    left: 0;
    right: 0;
    background: var(--navy);
    padding: 24px;
    gap: 20px;
    border-top: 1px solid rgba(201,151,58,0.2);
    z-index: 99;
  }

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

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

  .threat-grid,
  .threat-panel.active {
    grid-template-columns: 1fr;
  }

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

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

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

  .footer__bottom {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }

  .booking-form {
    padding: 24px;
  }

  .warning-item {
    grid-template-columns: 40px 1fr;
    gap: 16px;
    padding: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fade-up { transition: none; opacity: 1; transform: none; }
  * { transition-duration: 0.01ms !important; }
}


/* ── HOMEPAGE SECTION CARDS ── */
.home-sections {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 56px;
}

.home-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  text-decoration: none;
  display: block;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}

.home-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform 0.25s;
  transform-origin: left;
}

.home-card:hover {
  border-color: var(--gold);
  box-shadow: 0 12px 40px var(--shadow);
  transform: translateY(-4px);
}

.home-card:hover::after {
  transform: scaleX(1);
}

.home-card__icon {
  font-size: 2rem;
  margin-bottom: 16px;
  display: block;
}

.home-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 10px;
}

.home-card__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
  margin-bottom: 20px;
}

.home-card__arrow {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--gold);
  letter-spacing: 0.05em;
}

/* ── PAGE HEADER ── */
.page-header {
  background: var(--navy);
  padding: 120px 0 64px;
  position: relative;
  overflow: hidden;
}

.page-header::before {
  content: '';
  position: absolute;
  top: -20%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(201,151,58,0.08) 0%, transparent 70%);
  pointer-events: none;
}

.page-header__eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  display: block;
}

.page-header__title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight: 900;
  color: var(--white);
  line-height: 1.15;
  margin-bottom: 16px;
}

.page-header__body {
  font-size: 1.05rem;
  color: rgba(255,255,255,0.65);
  max-width: 560px;
}

/* ── ACTIVE NAV ── */
.nav__links a.active {
  color: var(--gold);
}

@media (max-width: 900px) {
  .home-sections {
    grid-template-columns: repeat(2, 1fr);
  }
}

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

/* plans.html inline style */
/* ============================================
   THE ELDER IT — Main Stylesheet
   Colors: Navy #0D1F3C | Gold #C9973A | White
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;900&family=Inter:wght@300;400;500;600&display=swap');

:root {
  --navy: #0D1F3C;
  --navy-light: #152e58;
  --gold: #C9973A;
  --gold-light: #e0b05a;
  --white: #ffffff;
  --off-white: #F7F5F0;
  --text-dark: #1a1a2e;
  --text-mid: #4a4a6a;
  --text-light: #8888aa;
  --border: #e2ddd4;
  --shadow: rgba(13, 31, 60, 0.12);
  --radius: 8px;
  --radius-lg: 16px;
}

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

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  color: var(--text-dark);
  background: var(--white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* ── TYPOGRAPHY ── */
h1, h2, h3 {
  font-family: 'Playfair Display', serif;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

h1 { font-size: clamp(2.4rem, 5vw, 4rem); font-weight: 900; }
h2 { font-size: clamp(1.8rem, 3.5vw, 2.8rem); font-weight: 700; }
h3 { font-size: clamp(1.2rem, 2vw, 1.5rem); font-weight: 700; }

p { line-height: 1.75; color: var(--text-mid); }

a { color: inherit; text-decoration: none; }

/* ── LAYOUT ── */
.container {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
}

.section {
  padding: 96px 0;
}

.section--alt {
  background: var(--off-white);
}

.section--dark {
  background: var(--navy);
  color: var(--white);
}

.section__eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  display: block;
}

.section__heading {
  margin-bottom: 16px;
}

.section__subheading {
  font-size: 1.15rem;
  color: var(--text-mid);
  max-width: 600px;
  margin-bottom: 56px;
}

.section--dark .section__subheading {
  color: rgba(255,255,255,0.7);
}

.section--dark h2 {
  color: var(--white);
}

/* ── NAV ── */
.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: var(--navy);
  border-bottom: 1px solid rgba(201, 151, 58, 0.2);
  transition: box-shadow 0.3s;
}

.nav.scrolled {
  box-shadow: 0 4px 24px rgba(13,31,60,0.35);
}

.nav__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 68px;
  padding: 0 24px;
  max-width: 1140px;
  margin: 0 auto;
}

.nav__logo {
  display: flex;
  flex-direction: column;
  line-height: 1;
}

.nav__logo-name {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 900;
  color: var(--white);
  letter-spacing: -0.01em;
}

.nav__logo-name span {
  color: var(--gold);
}

.nav__logo-tagline {
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
  margin-top: 3px;
}

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

.nav__links a {
  font-size: 0.875rem;
  font-weight: 500;
  color: rgba(255,255,255,0.75);
  transition: color 0.2s;
}

.nav__links a:hover {
  color: var(--gold);
}

.nav__cta {
  background: var(--gold);
  color: var(--navy) !important;
  padding: 10px 20px;
  border-radius: var(--radius);
  font-weight: 600 !important;
  transition: background 0.2s !important;
}

.nav__cta:hover {
  background: var(--gold-light) !important;
  color: var(--navy) !important;
}

.nav__hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 4px;
}

.nav__hamburger span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--white);
  border-radius: 2px;
  transition: all 0.3s;
}

/* ── HERO ── */
.hero {
  background: var(--navy);
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding-top: 68px;
  position: relative;
  overflow: hidden;
}

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

.hero::after {
  content: '';
  position: absolute;
  bottom: -10%;
  left: -5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(201,151,58,0.05) 0%, transparent 70%);
  pointer-events: none;
}

.hero__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
  padding: 80px 24px;
  max-width: 1140px;
  margin: 0 auto;
  width: 100%;
}

.hero__scroll-line {
  display: block;
  width: 1px;
  height: 48px;
  background: linear-gradient(to bottom, var(--gold), transparent);
  margin-bottom: 24px;
}

.hero__eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
  display: block;
}

.hero__heading {
  color: var(--white);
  margin-bottom: 24px;
}

.hero__heading em {
  font-style: normal;
  color: var(--gold);
}

.hero__body {
  font-size: 1.1rem;
  color: rgba(255,255,255,0.65);
  margin-bottom: 40px;
  max-width: 480px;
}

.hero__actions {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.hero__stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.hero__stat {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(201,151,58,0.2);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  position: relative;
  overflow: hidden;
}

.hero__stat::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(to right, var(--gold), transparent);
}

.hero__stat-number {
  font-family: 'Playfair Display', serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 8px;
}

.hero__stat-label {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.4;
}

.hero__stat-source {
  font-size: 0.65rem;
  color: rgba(255,255,255,0.3);
  margin-top: 6px;
  font-style: italic;
}

/* ── BUTTONS ── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 28px;
  border-radius: var(--radius);
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  border: none;
  text-decoration: none;
}

.btn--primary {
  background: var(--gold);
  color: var(--navy);
}

.btn--primary:hover {
  background: var(--gold-light);
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(201,151,58,0.3);
}

.btn--outline {
  background: transparent;
  color: var(--white);
  border: 1px solid rgba(255,255,255,0.3);
}

.btn--outline:hover {
  border-color: var(--gold);
  color: var(--gold);
}

.btn--navy {
  background: var(--navy);
  color: var(--white);
}

.btn--navy:hover {
  background: var(--navy-light);
  transform: translateY(-1px);
}

/* ── AUDIENCE CARDS ── */
.audience-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.audience-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}

.audience-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform 0.25s;
  transform-origin: left;
}

.audience-card:hover {
  border-color: var(--gold);
  box-shadow: 0 12px 40px var(--shadow);
  transform: translateY(-4px);
}

.audience-card:hover::after {
  transform: scaleX(1);
}

.audience-card__icon {
  font-size: 2rem;
  margin-bottom: 16px;
  display: block;
}

.audience-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 12px;
}

.audience-card__body {
  font-size: 0.9rem;
  color: var(--text-mid);
  line-height: 1.65;
}

.audience-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 16px;
}

.tag {
  font-size: 0.7rem;
  font-weight: 500;
  padding: 4px 10px;
  background: var(--off-white);
  border-radius: 100px;
  color: var(--text-mid);
}

/* ── THREAT SECTION ── */
.threat-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.threat-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  transition: border-color 0.2s;
}

.threat-card:hover {
  border-color: rgba(201,151,58,0.4);
}

.threat-card__icon {
  font-size: 1.5rem;
  margin-bottom: 14px;
  display: block;
}

.threat-card__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--white);
  margin-bottom: 8px;
}

.threat-card__body {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.6;
}

.threat-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 40px;
}

.threat-tab {
  padding: 10px 24px;
  border-radius: 100px;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid rgba(255,255,255,0.2);
  background: transparent;
  color: rgba(255,255,255,0.6);
  transition: all 0.2s;
  font-family: 'Inter', sans-serif;
}

.threat-tab.active,
.threat-tab:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--navy);
}

.threat-panel { display: none; }
.threat-panel.active { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

/* ── WARNING SIGNS ── */
.warning-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--white);
}

.warning-item {
  display: grid;
  grid-template-columns: 60px 1fr;
  align-items: center;
  gap: 24px;
  padding: 24px 28px;
  border-bottom: 1px solid var(--border);
  transition: background 0.2s;
}

.warning-item:last-child { border-bottom: none; }

.warning-item:hover {
  background: rgba(201,151,58,0.06);
}

.warning-item__number {
  font-family: 'Playfair Display', serif;
  font-size: 2rem;
  font-weight: 900;
  color: var(--gold);
  opacity: 0.6;
  line-height: 1;
}

.warning-item__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
}

.warning-item__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.6;
}

/* ── SERVICES ── */
.services-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.service-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px 28px;
  transition: all 0.25s;
}

.service-card:hover {
  box-shadow: 0 12px 40px var(--shadow);
  border-color: rgba(201,151,58,0.4);
}

.service-card__icon {
  font-size: 1.75rem;
  margin-bottom: 16px;
  display: block;
}

.service-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 10px;
}

.service-card__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
}

/* ── PLANS ── */
.plans-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  align-items: start;
}

.plan-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px 24px;
  position: relative;
  transition: all 0.25s;
}

.plan-card:hover {
  box-shadow: 0 16px 48px var(--shadow);
  transform: translateY(-4px);
}

.plan-card--featured {
  border: 2px solid var(--gold);
  background: var(--navy);
  color: var(--white);
}

.plan-card--featured .plan-card__price,
.plan-card--featured .plan-card__name {
  color: var(--white);
}

.plan-card--featured .plan-card__feature {
  color: rgba(255,255,255,0.75);
  border-color: rgba(255,255,255,0.1);
}

.plan-card--featured .plan-card__feature::before {
  color: var(--gold);
}

.plan-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--gold);
  color: var(--navy);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 14px;
  border-radius: 100px;
  white-space: nowrap;
}

.plan-card__name {
  font-family: 'Playfair Display', serif;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 8px;
}

.plan-card__price {
  font-family: 'Playfair Display', serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--navy);
  line-height: 1;
  margin-bottom: 4px;
}

.plan-card__price span {
  font-size: 1rem;
  font-weight: 400;
  font-family: 'Inter', sans-serif;
  color: var(--text-light);
}

.plan-card__hst {
  font-size: 0.72rem;
  color: var(--text-light);
  margin-bottom: 20px;
}

.plan-card--featured .plan-card__hst {
  color: rgba(255,255,255,0.4);
}

.plan-card__divider {
  height: 1px;
  background: var(--border);
  margin: 16px 0;
}

.plan-card--featured .plan-card__divider {
  background: rgba(255,255,255,0.1);
}

.plan-card__features {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 24px;
}

.plan-card__feature {
  font-size: 0.82rem;
  color: var(--text-mid);
  padding-left: 20px;
  position: relative;
  border-bottom: 1px solid var(--border);
  padding-bottom: 10px;
  line-height: 1.4;
}

.plan-card__feature:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.plan-card__feature::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--gold);
  font-weight: 700;
  font-size: 0.75rem;
}

.plan-card .btn {
  width: 100%;
  justify-content: center;
}

/* ── BUSINESS DIVIDER ── */
.biz-divider {
  background: var(--navy);
  position: relative;
  overflow: hidden;
  padding: 80px 0;
  margin-top: 24px;
}

.biz-divider::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -5%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(201,151,58,0.10) 0%, transparent 65%);
  pointer-events: none;
}

.biz-divider__inner {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 56px;
  align-items: center;
  position: relative;
  z-index: 1;
}

.biz-divider__eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  display: block;
}

.biz-divider__title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.8rem, 3.5vw, 2.6rem);
  font-weight: 900;
  color: var(--white);
  line-height: 1.2;
  margin-bottom: 20px;
}

.biz-divider__title em {
  color: var(--gold);
  font-style: italic;
}

.biz-divider__body {
  font-size: 1rem;
  color: rgba(255,255,255,0.7);
  line-height: 1.8;
  margin-bottom: 16px;
}

.biz-divider__art {
  width: 100%;
  height: auto;
  display: block;
}

/* ── VALUE ANCHOR STRIP ── */
.value-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 40px;
}

.value-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  text-align: center;
}

.value-card__icon {
  font-size: 1.8rem;
  margin-bottom: 12px;
  display: block;
}

.value-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 8px;
}

.value-card__body {
  font-size: 0.84rem;
  color: var(--text-mid);
  line-height: 1.6;
}

.value-card__body strong {
  color: var(--navy);
}

/* ── BUSINESS TRACK NOTICE ── */
.biz-notice {
  background: rgba(201,151,58,0.08);
  border: 1px solid rgba(201,151,58,0.3);
  border-radius: var(--radius-lg);
  padding: 20px 28px;
  margin-bottom: 40px;
  display: flex;
  align-items: center;
  gap: 16px;
}

.biz-notice__icon {
  font-size: 1.4rem;
  flex-shrink: 0;
}

.biz-notice__text {
  font-size: 0.9rem;
  color: var(--text-mid);
  line-height: 1.6;
}

.biz-notice__text strong {
  color: var(--navy);
}

/* ── BUSINESS PLAN CARDS ── */
.biz-plans-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  align-items: start;
}

.biz-plan-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px 24px;
  position: relative;
  transition: all 0.25s;
}

.biz-plan-card:hover {
  box-shadow: 0 16px 48px var(--shadow);
  transform: translateY(-4px);
}

.biz-plan-card--featured {
  border: 2px solid var(--gold);
  background: var(--navy);
  color: var(--white);
}

.biz-plan-card__tier {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 6px;
  display: block;
}

.biz-plan-card__name {
  font-family: 'Playfair Display', serif;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 16px;
}

.biz-plan-card--featured .biz-plan-card__name {
  color: var(--white);
}

.biz-plan-card__pricing {
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--border);
}

.biz-plan-card--featured .biz-plan-card__pricing {
  border-color: rgba(255,255,255,0.1);
}

.biz-plan-card__setup {
  font-size: 0.78rem;
  color: var(--text-light);
  margin-bottom: 6px;
}

.biz-plan-card--featured .biz-plan-card__setup {
  color: rgba(255,255,255,0.45);
}

.biz-plan-card__setup strong {
  font-size: 0.95rem;
  color: var(--text-mid);
  font-weight: 600;
}

.biz-plan-card--featured .biz-plan-card__setup strong {
  color: rgba(255,255,255,0.75);
}

.biz-plan-card__monthly {
  font-family: 'Playfair Display', serif;
  font-size: 2rem;
  font-weight: 900;
  color: var(--navy);
  line-height: 1;
  margin-bottom: 4px;
}

.biz-plan-card--featured .biz-plan-card__monthly {
  color: var(--white);
}

.biz-plan-card__monthly span {
  font-size: 0.9rem;
  font-weight: 400;
  font-family: 'Inter', sans-serif;
  color: var(--text-light);
}

.biz-plan-card--featured .biz-plan-card__monthly span {
  color: rgba(255,255,255,0.45);
}

.biz-plan-card__minimum {
  font-size: 0.72rem;
  color: var(--text-light);
  margin-top: 4px;
}

.biz-plan-card--featured .biz-plan-card__minimum {
  color: rgba(255,255,255,0.35);
}

.biz-plan-card__quote {
  font-family: 'Playfair Display', serif;
  font-size: 1.6rem;
  font-weight: 900;
  color: var(--navy);
  line-height: 1;
  margin-bottom: 4px;
}

.biz-plan-card__features {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 24px;
}

.biz-plan-card__feature {
  font-size: 0.82rem;
  color: var(--text-mid);
  padding-left: 20px;
  position: relative;
  border-bottom: 1px solid var(--border);
  padding-bottom: 10px;
  line-height: 1.4;
}

.biz-plan-card--featured .biz-plan-card__feature {
  color: rgba(255,255,255,0.75);
  border-color: rgba(255,255,255,0.1);
}

.biz-plan-card__feature:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.biz-plan-card__feature::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--gold);
  font-weight: 700;
  font-size: 0.75rem;
}

.biz-plan-card .btn {
  width: 100%;
  justify-content: center;
}

/* ── USAGE / TOKEN NOTE ── */
.usage-note {
  background: var(--navy);
  border-radius: var(--radius-lg);
  padding: 28px 32px;
  margin-top: 32px;
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.usage-note__icon {
  font-size: 1.5rem;
  flex-shrink: 0;
  margin-top: 2px;
}

.usage-note__title {
  font-weight: 700;
  color: var(--white);
  font-size: 0.95rem;
  margin-bottom: 8px;
}

.usage-note__body {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.65);
  line-height: 1.7;
}

/* ── AGENT ADD-ONS ACCORDION ── */
.addons-toggle {
  width: 100%;
  background: none;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 20px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--navy);
  margin-top: 32px;
  transition: all 0.2s;
}

.addons-toggle:hover {
  border-color: var(--gold);
  background: rgba(201,151,58,0.04);
}

.addons-toggle__icon {
  width: 28px;
  height: 28px;
  background: rgba(201,151,58,0.1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gold);
  font-size: 1.1rem;
  transition: transform 0.25s;
  flex-shrink: 0;
}

.addons-toggle.open .addons-toggle__icon {
  transform: rotate(45deg);
}

.addons-panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease;
}

.addons-panel.open {
  max-height: 900px;
}

.addons-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  padding: 24px 0 8px;
}

.addon-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 20px;
  background: var(--off-white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.addon-item__icon {
  font-size: 1.1rem;
  flex-shrink: 0;
  margin-top: 1px;
}

.addon-item__title {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--navy);
  margin-bottom: 3px;
}

.addon-item__body {
  font-size: 0.78rem;
  color: var(--text-mid);
  line-height: 1.5;
}

.addons-note {
  font-size: 0.8rem;
  color: var(--text-light);
  text-align: center;
  padding: 16px 0 4px;
  font-style: italic;
}

@media (max-width: 1024px) {
  .biz-plans-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .biz-divider__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .biz-divider__art {
    max-width: 420px;
    margin: 0 auto;
  }
  .value-strip {
    grid-template-columns: 1fr;
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 40px;
  }
}

@media (max-width: 640px) {
  .biz-plans-grid {
    grid-template-columns: 1fr;
  }
  .addons-grid {
    grid-template-columns: 1fr;
  }
  .usage-note {
    flex-direction: column;
    gap: 12px;
  }
}

/* ── FAQ ── */
.faq-list {
  max-width: 760px;
  margin: 0 auto;
}

.faq-item {
  border-bottom: 1px solid var(--border);
}

.faq-question {
  width: 100%;
  background: none;
  border: none;
  text-align: left;
  padding: 24px 0;
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  font-weight: 600;
  color: var(--navy);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  transition: color 0.2s;
}

.faq-question:hover {
  color: var(--gold);
}

.faq-question svg {
  flex-shrink: 0;
  transition: transform 0.25s;
  color: var(--gold);
}

.faq-item.open .faq-question svg {
  transform: rotate(45deg);
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease, padding 0.2s;
}

.faq-item.open .faq-answer {
  max-height: 400px;
  padding-bottom: 24px;
}

.faq-answer p {
  font-size: 0.95rem;
  color: var(--text-mid);
  line-height: 1.75;
}

/* ── CONTACT / BOOKING ── */
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 64px;
  align-items: start;
}

.contact-info__item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 28px;
}

.contact-info__icon {
  width: 44px;
  height: 44px;
  background: rgba(201,151,58,0.1);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
  color: var(--gold);
}

.contact-info__label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--gold);
  margin-bottom: 4px;
}

.contact-info__value {
  font-size: 0.95rem;
  color: var(--text-mid);
}

.contact-info__value a {
  color: var(--navy);
  font-weight: 500;
  transition: color 0.2s;
}

.contact-info__value a:hover {
  color: var(--gold);
}

.booking-form {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 40px;
}

.form-group {
  margin-bottom: 20px;
}

.form-label {
  display: block;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--navy);
  margin-bottom: 8px;
  letter-spacing: 0.02em;
}

.form-input,
.form-select,
.form-textarea {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  color: var(--text-dark);
  background: var(--white);
  transition: border-color 0.2s, box-shadow 0.2s;
  appearance: none;
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(201,151,58,0.12);
}

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

.form-textarea {
  resize: vertical;
  min-height: 100px;
}

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

.form-note {
  font-size: 0.78rem;
  color: var(--text-light);
  margin-top: 12px;
  text-align: center;
}

.form-success {
  display: none;
  text-align: center;
  padding: 32px;
}

.form-success__icon {
  font-size: 2.5rem;
  margin-bottom: 12px;
}

.form-success__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  color: var(--navy);
  margin-bottom: 8px;
}

.form-success__body {
  font-size: 0.9rem;
  color: var(--text-mid);
}

/* ── MISSION BANNER ── */
.mission-banner {
  background: var(--navy);
  padding: 80px 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.mission-banner::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 800px;
  height: 800px;
  background: radial-gradient(circle, rgba(201,151,58,0.06) 0%, transparent 65%);
  pointer-events: none;
}

.mission-banner__quote {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.6rem, 3.5vw, 2.8rem);
  font-weight: 700;
  font-style: italic;
  color: var(--white);
  max-width: 800px;
  margin: 0 auto 24px;
  line-height: 1.3;
}

.mission-banner__quote em {
  color: var(--gold);
  font-style: normal;
}

.mission-banner__attr {
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
}

/* ── FOOTER ── */
.footer {
  background: #080f1e;
  color: rgba(255,255,255,0.6);
  padding: 64px 0 32px;
}

.footer__grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 48px;
  margin-bottom: 48px;
}

.footer__logo-name {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-weight: 900;
  color: var(--white);
  margin-bottom: 8px;
}

.footer__logo-name span {
  color: var(--gold);
}

.footer__tagline {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.4);
  margin-bottom: 20px;
  line-height: 1.5;
}

.footer__differentiator {
  font-size: 0.82rem;
  font-style: italic;
  color: var(--gold);
  opacity: 0.8;
}

.footer__heading {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 16px;
}

.footer__links {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.footer__links a {
  font-size: 0.875rem;
  color: rgba(255,255,255,0.55);
  transition: color 0.2s;
}

.footer__links a:hover {
  color: var(--gold);
}

.footer__divider {
  height: 1px;
  background: rgba(255,255,255,0.07);
  margin-bottom: 28px;
}

.footer__bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.78rem;
  color: rgba(255,255,255,0.3);
}

/* ── PROTECTION PLAN ── */
.protection-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

.protection-step {
  text-align: center;
  padding: 40px 28px;
  background: var(--off-white);
  border-radius: var(--radius-lg);
  position: relative;
}

.protection-step__number {
  width: 52px;
  height: 52px;
  background: var(--navy);
  color: var(--gold);
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  font-weight: 900;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}

.protection-step__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 12px;
}

.protection-step__items {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-align: left;
}

.protection-step__item {
  font-size: 0.85rem;
  color: var(--text-mid);
  padding-left: 16px;
  position: relative;
  line-height: 1.5;
}

.protection-step__item::before {
  content: '→';
  position: absolute;
  left: 0;
  color: var(--gold);
  font-size: 0.75rem;
}

/* ── ABOUT SECTION ── */
.about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

.about-principle {
  background: var(--navy);
  border-radius: var(--radius-lg);
  padding: 40px;
  margin-top: 32px;
}

.about-principle__text {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-style: italic;
  color: var(--white);
  line-height: 1.5;
  margin-bottom: 12px;
}

.about-principle__attr {
  font-size: 0.75rem;
  color: var(--gold);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.about-values {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.about-value {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.about-value__icon {
  width: 48px;
  height: 48px;
  background: rgba(201,151,58,0.1);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}

.about-value__title {
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
  font-size: 1rem;
}

.about-value__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
}

/* ── REGION PILLS ── */
.region-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.region-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(201,151,58,0.1);
  border: 1px solid rgba(201,151,58,0.25);
  color: var(--navy);
  font-size: 0.82rem;
  font-weight: 500;
  padding: 8px 16px;
  border-radius: 100px;
}

.region-pill::before {
  content: '📍';
  font-size: 0.75rem;
}

/* ── SCROLL ANIMATIONS ── */
.fade-up {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-up.visible {
  opacity: 1;
  transform: translateY(0);
}

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

@media (max-width: 900px) {
  .hero__inner {
    grid-template-columns: 1fr;
    gap: 48px;
    padding: 60px 24px;
  }

  .hero__stats {
    grid-template-columns: repeat(2, 1fr);
  }

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

  .threat-grid,
  .threat-panel.active {
    grid-template-columns: 1fr 1fr;
  }

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

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

  .about-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .protection-steps {
    grid-template-columns: 1fr;
  }

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

@media (max-width: 640px) {
  .section { padding: 64px 0; }

  .nav__links { display: none; }
  .nav__hamburger { display: flex; }

  .nav__links.mobile-open {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 68px;
    left: 0;
    right: 0;
    background: var(--navy);
    padding: 24px;
    gap: 20px;
    border-top: 1px solid rgba(201,151,58,0.2);
    z-index: 99;
  }

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

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

  .threat-grid,
  .threat-panel.active {
    grid-template-columns: 1fr;
  }

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

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

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

  .footer__bottom {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }

  .booking-form {
    padding: 24px;
  }

  .warning-item {
    grid-template-columns: 40px 1fr;
    gap: 16px;
    padding: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fade-up { transition: none; opacity: 1; transform: none; }
  * { transition-duration: 0.01ms !important; }
}


/* ── HOMEPAGE SECTION CARDS ── */
.home-sections {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 56px;
}

.home-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  text-decoration: none;
  display: block;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}

.home-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform 0.25s;
  transform-origin: left;
}

.home-card:hover {
  border-color: var(--gold);
  box-shadow: 0 12px 40px var(--shadow);
  transform: translateY(-4px);
}

.home-card:hover::after {
  transform: scaleX(1);
}

.home-card__icon {
  font-size: 2rem;
  margin-bottom: 16px;
  display: block;
}

.home-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 10px;
}

.home-card__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
  margin-bottom: 20px;
}

.home-card__arrow {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--gold);
  letter-spacing: 0.05em;
}

/* ── PAGE HEADER ── */
.page-header {
  background: var(--navy);
  padding: 120px 0 64px;
  position: relative;
  overflow: hidden;
}

.page-header::before {
  content: '';
  position: absolute;
  top: -20%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(201,151,58,0.08) 0%, transparent 70%);
  pointer-events: none;
}

.page-header__eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  display: block;
}

.page-header__title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight: 900;
  color: var(--white);
  line-height: 1.15;
  margin-bottom: 16px;
}

.page-header__body {
  font-size: 1.05rem;
  color: rgba(255,255,255,0.65);
  max-width: 560px;
}

/* ── ACTIVE NAV ── */
.nav__links a.active {
  color: var(--gold);
}

@media (max-width: 900px) {
  .home-sections {
    grid-template-columns: repeat(2, 1fr);
  }
}

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

/* faq.html inline style */
/* ============================================
   THE ELDER IT — Main Stylesheet
   Colors: Navy #0D1F3C | Gold #C9973A | White
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;900&family=Inter:wght@300;400;500;600&display=swap');

:root {
  --navy: #0D1F3C;
  --navy-light: #152e58;
  --gold: #C9973A;
  --gold-light: #e0b05a;
  --white: #ffffff;
  --off-white: #F7F5F0;
  --text-dark: #1a1a2e;
  --text-mid: #4a4a6a;
  --text-light: #8888aa;
  --border: #e2ddd4;
  --shadow: rgba(13, 31, 60, 0.12);
  --radius: 8px;
  --radius-lg: 16px;
}

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

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  color: var(--text-dark);
  background: var(--white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* ── TYPOGRAPHY ── */
h1, h2, h3 {
  font-family: 'Playfair Display', serif;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

h1 { font-size: clamp(2.4rem, 5vw, 4rem); font-weight: 900; }
h2 { font-size: clamp(1.8rem, 3.5vw, 2.8rem); font-weight: 700; }
h3 { font-size: clamp(1.2rem, 2vw, 1.5rem); font-weight: 700; }

p { line-height: 1.75; color: var(--text-mid); }

a { color: inherit; text-decoration: none; }

/* ── LAYOUT ── */
.container {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
}

.section {
  padding: 96px 0;
}

.section--alt {
  background: var(--off-white);
}

.section--dark {
  background: var(--navy);
  color: var(--white);
}

.section__eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  display: block;
}

.section__heading {
  margin-bottom: 16px;
}

.section__subheading {
  font-size: 1.15rem;
  color: var(--text-mid);
  max-width: 600px;
  margin-bottom: 56px;
}

.section--dark .section__subheading {
  color: rgba(255,255,255,0.7);
}

.section--dark h2 {
  color: var(--white);
}

/* ── NAV ── */
.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: var(--navy);
  border-bottom: 1px solid rgba(201, 151, 58, 0.2);
  transition: box-shadow 0.3s;
}

.nav.scrolled {
  box-shadow: 0 4px 24px rgba(13,31,60,0.35);
}

.nav__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 68px;
  padding: 0 24px;
  max-width: 1140px;
  margin: 0 auto;
}

.nav__logo {
  display: flex;
  flex-direction: column;
  line-height: 1;
}

.nav__logo-name {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 900;
  color: var(--white);
  letter-spacing: -0.01em;
}

.nav__logo-name span {
  color: var(--gold);
}

.nav__logo-tagline {
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
  margin-top: 3px;
}

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

.nav__links a {
  font-size: 0.875rem;
  font-weight: 500;
  color: rgba(255,255,255,0.75);
  transition: color 0.2s;
}

.nav__links a:hover {
  color: var(--gold);
}

.nav__cta {
  background: var(--gold);
  color: var(--navy) !important;
  padding: 10px 20px;
  border-radius: var(--radius);
  font-weight: 600 !important;
  transition: background 0.2s !important;
}

.nav__cta:hover {
  background: var(--gold-light) !important;
  color: var(--navy) !important;
}

.nav__hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 4px;
}

.nav__hamburger span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--white);
  border-radius: 2px;
  transition: all 0.3s;
}

/* ── HERO ── */
.hero {
  background: var(--navy);
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding-top: 68px;
  position: relative;
  overflow: hidden;
}

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

.hero::after {
  content: '';
  position: absolute;
  bottom: -10%;
  left: -5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(201,151,58,0.05) 0%, transparent 70%);
  pointer-events: none;
}

.hero__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
  padding: 80px 24px;
  max-width: 1140px;
  margin: 0 auto;
  width: 100%;
}

.hero__scroll-line {
  display: block;
  width: 1px;
  height: 48px;
  background: linear-gradient(to bottom, var(--gold), transparent);
  margin-bottom: 24px;
}

.hero__eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
  display: block;
}

.hero__heading {
  color: var(--white);
  margin-bottom: 24px;
}

.hero__heading em {
  font-style: normal;
  color: var(--gold);
}

.hero__body {
  font-size: 1.1rem;
  color: rgba(255,255,255,0.65);
  margin-bottom: 40px;
  max-width: 480px;
}

.hero__actions {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.hero__stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.hero__stat {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(201,151,58,0.2);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  position: relative;
  overflow: hidden;
}

.hero__stat::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(to right, var(--gold), transparent);
}

.hero__stat-number {
  font-family: 'Playfair Display', serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 8px;
}

.hero__stat-label {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.4;
}

.hero__stat-source {
  font-size: 0.65rem;
  color: rgba(255,255,255,0.3);
  margin-top: 6px;
  font-style: italic;
}

/* ── BUTTONS ── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 28px;
  border-radius: var(--radius);
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  border: none;
  text-decoration: none;
}

.btn--primary {
  background: var(--gold);
  color: var(--navy);
}

.btn--primary:hover {
  background: var(--gold-light);
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(201,151,58,0.3);
}

.btn--outline {
  background: transparent;
  color: var(--white);
  border: 1px solid rgba(255,255,255,0.3);
}

.btn--outline:hover {
  border-color: var(--gold);
  color: var(--gold);
}

.btn--navy {
  background: var(--navy);
  color: var(--white);
}

.btn--navy:hover {
  background: var(--navy-light);
  transform: translateY(-1px);
}

/* ── AUDIENCE CARDS ── */
.audience-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.audience-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}

.audience-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform 0.25s;
  transform-origin: left;
}

.audience-card:hover {
  border-color: var(--gold);
  box-shadow: 0 12px 40px var(--shadow);
  transform: translateY(-4px);
}

.audience-card:hover::after {
  transform: scaleX(1);
}

.audience-card__icon {
  font-size: 2rem;
  margin-bottom: 16px;
  display: block;
}

.audience-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 12px;
}

.audience-card__body {
  font-size: 0.9rem;
  color: var(--text-mid);
  line-height: 1.65;
}

.audience-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 16px;
}

.tag {
  font-size: 0.7rem;
  font-weight: 500;
  padding: 4px 10px;
  background: var(--off-white);
  border-radius: 100px;
  color: var(--text-mid);
}

/* ── THREAT SECTION ── */
.threat-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.threat-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  transition: border-color 0.2s;
}

.threat-card:hover {
  border-color: rgba(201,151,58,0.4);
}

.threat-card__icon {
  font-size: 1.5rem;
  margin-bottom: 14px;
  display: block;
}

.threat-card__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--white);
  margin-bottom: 8px;
}

.threat-card__body {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.6;
}

.threat-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 40px;
}

.threat-tab {
  padding: 10px 24px;
  border-radius: 100px;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid rgba(255,255,255,0.2);
  background: transparent;
  color: rgba(255,255,255,0.6);
  transition: all 0.2s;
  font-family: 'Inter', sans-serif;
}

.threat-tab.active,
.threat-tab:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--navy);
}

.threat-panel { display: none; }
.threat-panel.active { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

/* ── WARNING SIGNS ── */
.warning-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--white);
}

.warning-item {
  display: grid;
  grid-template-columns: 60px 1fr;
  align-items: center;
  gap: 24px;
  padding: 24px 28px;
  border-bottom: 1px solid var(--border);
  transition: background 0.2s;
}

.warning-item:last-child { border-bottom: none; }

.warning-item:hover {
  background: rgba(201,151,58,0.06);
}

.warning-item__number {
  font-family: 'Playfair Display', serif;
  font-size: 2rem;
  font-weight: 900;
  color: var(--gold);
  opacity: 0.6;
  line-height: 1;
}

.warning-item__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
}

.warning-item__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.6;
}

/* ── SERVICES ── */
.services-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.service-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px 28px;
  transition: all 0.25s;
}

.service-card:hover {
  box-shadow: 0 12px 40px var(--shadow);
  border-color: rgba(201,151,58,0.4);
}

.service-card__icon {
  font-size: 1.75rem;
  margin-bottom: 16px;
  display: block;
}

.service-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 10px;
}

.service-card__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
}

/* ── PLANS ── */
.plans-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  align-items: start;
}

.plan-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px 24px;
  position: relative;
  transition: all 0.25s;
}

.plan-card:hover {
  box-shadow: 0 16px 48px var(--shadow);
  transform: translateY(-4px);
}

.plan-card--featured {
  border: 2px solid var(--gold);
  background: var(--navy);
  color: var(--white);
}

.plan-card--featured .plan-card__price,
.plan-card--featured .plan-card__name {
  color: var(--white);
}

.plan-card--featured .plan-card__feature {
  color: rgba(255,255,255,0.75);
  border-color: rgba(255,255,255,0.1);
}

.plan-card--featured .plan-card__feature::before {
  color: var(--gold);
}

.plan-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--gold);
  color: var(--navy);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 14px;
  border-radius: 100px;
  white-space: nowrap;
}

.plan-card__name {
  font-family: 'Playfair Display', serif;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 8px;
}

.plan-card__price {
  font-family: 'Playfair Display', serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--navy);
  line-height: 1;
  margin-bottom: 4px;
}

.plan-card__price span {
  font-size: 1rem;
  font-weight: 400;
  font-family: 'Inter', sans-serif;
  color: var(--text-light);
}

.plan-card__hst {
  font-size: 0.72rem;
  color: var(--text-light);
  margin-bottom: 20px;
}

.plan-card--featured .plan-card__hst {
  color: rgba(255,255,255,0.4);
}

.plan-card__divider {
  height: 1px;
  background: var(--border);
  margin: 16px 0;
}

.plan-card--featured .plan-card__divider {
  background: rgba(255,255,255,0.1);
}

.plan-card__features {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 24px;
}

.plan-card__feature {
  font-size: 0.82rem;
  color: var(--text-mid);
  padding-left: 20px;
  position: relative;
  border-bottom: 1px solid var(--border);
  padding-bottom: 10px;
  line-height: 1.4;
}

.plan-card__feature:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.plan-card__feature::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--gold);
  font-weight: 700;
  font-size: 0.75rem;
}

.plan-card .btn {
  width: 100%;
  justify-content: center;
}

/* ── FAQ ── */
.faq-list {
  max-width: 760px;
  margin: 0 auto;
}

.faq-item {
  border-bottom: 1px solid var(--border);
}

.faq-question {
  width: 100%;
  background: none;
  border: none;
  text-align: left;
  padding: 24px 0;
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  font-weight: 600;
  color: var(--navy);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  transition: color 0.2s;
}

.faq-question:hover {
  color: var(--gold);
}

.faq-question svg {
  flex-shrink: 0;
  transition: transform 0.25s;
  color: var(--gold);
}

.faq-item.open .faq-question svg {
  transform: rotate(45deg);
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease, padding 0.2s;
}

.faq-item.open .faq-answer {
  max-height: 400px;
  padding-bottom: 24px;
}

.faq-answer p {
  font-size: 0.95rem;
  color: var(--text-mid);
  line-height: 1.75;
}

/* ── CONTACT / BOOKING ── */
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 64px;
  align-items: start;
}

.contact-info__item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 28px;
}

.contact-info__icon {
  width: 44px;
  height: 44px;
  background: rgba(201,151,58,0.1);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
  color: var(--gold);
}

.contact-info__label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--gold);
  margin-bottom: 4px;
}

.contact-info__value {
  font-size: 0.95rem;
  color: var(--text-mid);
}

.contact-info__value a {
  color: var(--navy);
  font-weight: 500;
  transition: color 0.2s;
}

.contact-info__value a:hover {
  color: var(--gold);
}

.booking-form {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 40px;
}

.form-group {
  margin-bottom: 20px;
}

.form-label {
  display: block;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--navy);
  margin-bottom: 8px;
  letter-spacing: 0.02em;
}

.form-input,
.form-select,
.form-textarea {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  color: var(--text-dark);
  background: var(--white);
  transition: border-color 0.2s, box-shadow 0.2s;
  appearance: none;
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(201,151,58,0.12);
}

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

.form-textarea {
  resize: vertical;
  min-height: 100px;
}

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

.form-note {
  font-size: 0.78rem;
  color: var(--text-light);
  margin-top: 12px;
  text-align: center;
}

.form-success {
  display: none;
  text-align: center;
  padding: 32px;
}

.form-success__icon {
  font-size: 2.5rem;
  margin-bottom: 12px;
}

.form-success__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  color: var(--navy);
  margin-bottom: 8px;
}

.form-success__body {
  font-size: 0.9rem;
  color: var(--text-mid);
}

/* ── MISSION BANNER ── */
.mission-banner {
  background: var(--navy);
  padding: 80px 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.mission-banner::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 800px;
  height: 800px;
  background: radial-gradient(circle, rgba(201,151,58,0.06) 0%, transparent 65%);
  pointer-events: none;
}

.mission-banner__quote {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.6rem, 3.5vw, 2.8rem);
  font-weight: 700;
  font-style: italic;
  color: var(--white);
  max-width: 800px;
  margin: 0 auto 24px;
  line-height: 1.3;
}

.mission-banner__quote em {
  color: var(--gold);
  font-style: normal;
}

.mission-banner__attr {
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
}

/* ── FOOTER ── */
.footer {
  background: #080f1e;
  color: rgba(255,255,255,0.6);
  padding: 64px 0 32px;
}

.footer__grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 48px;
  margin-bottom: 48px;
}

.footer__logo-name {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-weight: 900;
  color: var(--white);
  margin-bottom: 8px;
}

.footer__logo-name span {
  color: var(--gold);
}

.footer__tagline {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.4);
  margin-bottom: 20px;
  line-height: 1.5;
}

.footer__differentiator {
  font-size: 0.82rem;
  font-style: italic;
  color: var(--gold);
  opacity: 0.8;
}

.footer__heading {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 16px;
}

.footer__links {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.footer__links a {
  font-size: 0.875rem;
  color: rgba(255,255,255,0.55);
  transition: color 0.2s;
}

.footer__links a:hover {
  color: var(--gold);
}

.footer__divider {
  height: 1px;
  background: rgba(255,255,255,0.07);
  margin-bottom: 28px;
}

.footer__bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.78rem;
  color: rgba(255,255,255,0.3);
}

/* ── PROTECTION PLAN ── */
.protection-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

.protection-step {
  text-align: center;
  padding: 40px 28px;
  background: var(--off-white);
  border-radius: var(--radius-lg);
  position: relative;
}

.protection-step__number {
  width: 52px;
  height: 52px;
  background: var(--navy);
  color: var(--gold);
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  font-weight: 900;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}

.protection-step__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 12px;
}

.protection-step__items {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-align: left;
}

.protection-step__item {
  font-size: 0.85rem;
  color: var(--text-mid);
  padding-left: 16px;
  position: relative;
  line-height: 1.5;
}

.protection-step__item::before {
  content: '→';
  position: absolute;
  left: 0;
  color: var(--gold);
  font-size: 0.75rem;
}

/* ── ABOUT SECTION ── */
.about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

.about-principle {
  background: var(--navy);
  border-radius: var(--radius-lg);
  padding: 40px;
  margin-top: 32px;
}

.about-principle__text {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-style: italic;
  color: var(--white);
  line-height: 1.5;
  margin-bottom: 12px;
}

.about-principle__attr {
  font-size: 0.75rem;
  color: var(--gold);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.about-values {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.about-value {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.about-value__icon {
  width: 48px;
  height: 48px;
  background: rgba(201,151,58,0.1);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}

.about-value__title {
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
  font-size: 1rem;
}

.about-value__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
}

/* ── REGION PILLS ── */
.region-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.region-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(201,151,58,0.1);
  border: 1px solid rgba(201,151,58,0.25);
  color: var(--navy);
  font-size: 0.82rem;
  font-weight: 500;
  padding: 8px 16px;
  border-radius: 100px;
}

.region-pill::before {
  content: '📍';
  font-size: 0.75rem;
}

/* ── SCROLL ANIMATIONS ── */
.fade-up {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-up.visible {
  opacity: 1;
  transform: translateY(0);
}

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

@media (max-width: 900px) {
  .hero__inner {
    grid-template-columns: 1fr;
    gap: 48px;
    padding: 60px 24px;
  }

  .hero__stats {
    grid-template-columns: repeat(2, 1fr);
  }

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

  .threat-grid,
  .threat-panel.active {
    grid-template-columns: 1fr 1fr;
  }

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

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

  .about-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .protection-steps {
    grid-template-columns: 1fr;
  }

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

@media (max-width: 640px) {
  .section { padding: 64px 0; }

  .nav__links { display: none; }
  .nav__hamburger { display: flex; }

  .nav__links.mobile-open {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 68px;
    left: 0;
    right: 0;
    background: var(--navy);
    padding: 24px;
    gap: 20px;
    border-top: 1px solid rgba(201,151,58,0.2);
    z-index: 99;
  }

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

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

  .threat-grid,
  .threat-panel.active {
    grid-template-columns: 1fr;
  }

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

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

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

  .footer__bottom {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }

  .booking-form {
    padding: 24px;
  }

  .warning-item {
    grid-template-columns: 40px 1fr;
    gap: 16px;
    padding: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fade-up { transition: none; opacity: 1; transform: none; }
  * { transition-duration: 0.01ms !important; }
}


/* ── HOMEPAGE SECTION CARDS ── */
.home-sections {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 56px;
}

.home-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  text-decoration: none;
  display: block;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}

.home-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform 0.25s;
  transform-origin: left;
}

.home-card:hover {
  border-color: var(--gold);
  box-shadow: 0 12px 40px var(--shadow);
  transform: translateY(-4px);
}

.home-card:hover::after {
  transform: scaleX(1);
}

.home-card__icon {
  font-size: 2rem;
  margin-bottom: 16px;
  display: block;
}

.home-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 10px;
}

.home-card__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
  margin-bottom: 20px;
}

.home-card__arrow {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--gold);
  letter-spacing: 0.05em;
}

/* ── PAGE HEADER ── */
.page-header {
  background: var(--navy);
  padding: 120px 0 64px;
  position: relative;
  overflow: hidden;
}

.page-header::before {
  content: '';
  position: absolute;
  top: -20%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(201,151,58,0.08) 0%, transparent 70%);
  pointer-events: none;
}

.page-header__eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  display: block;
}

.page-header__title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight: 900;
  color: var(--white);
  line-height: 1.15;
  margin-bottom: 16px;
}

.page-header__body {
  font-size: 1.05rem;
  color: rgba(255,255,255,0.65);
  max-width: 560px;
}

/* ── ACTIVE NAV ── */
.nav__links a.active {
  color: var(--gold);
}

@media (max-width: 900px) {
  .home-sections {
    grid-template-columns: repeat(2, 1fr);
  }
}

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

/* contact.html inline style */
/* ============================================
   THE ELDER IT — Main Stylesheet
   Colors: Navy #0D1F3C | Gold #C9973A | White
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;900&family=Inter:wght@300;400;500;600&display=swap');

:root {
  --navy: #0D1F3C;
  --navy-light: #152e58;
  --gold: #C9973A;
  --gold-light: #e0b05a;
  --white: #ffffff;
  --off-white: #F7F5F0;
  --text-dark: #1a1a2e;
  --text-mid: #4a4a6a;
  --text-light: #8888aa;
  --border: #e2ddd4;
  --shadow: rgba(13, 31, 60, 0.12);
  --radius: 8px;
  --radius-lg: 16px;
}

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

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  color: var(--text-dark);
  background: var(--white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* ── TYPOGRAPHY ── */
h1, h2, h3 {
  font-family: 'Playfair Display', serif;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

h1 { font-size: clamp(2.4rem, 5vw, 4rem); font-weight: 900; }
h2 { font-size: clamp(1.8rem, 3.5vw, 2.8rem); font-weight: 700; }
h3 { font-size: clamp(1.2rem, 2vw, 1.5rem); font-weight: 700; }

p { line-height: 1.75; color: var(--text-mid); }

a { color: inherit; text-decoration: none; }

/* ── LAYOUT ── */
.container {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
}

.section {
  padding: 96px 0;
}

.section--alt {
  background: var(--off-white);
}

.section--dark {
  background: var(--navy);
  color: var(--white);
}

.section__eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  display: block;
}

.section__heading {
  margin-bottom: 16px;
}

.section__subheading {
  font-size: 1.15rem;
  color: var(--text-mid);
  max-width: 600px;
  margin-bottom: 56px;
}

.section--dark .section__subheading {
  color: rgba(255,255,255,0.7);
}

.section--dark h2 {
  color: var(--white);
}

/* ── NAV ── */
.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: var(--navy);
  border-bottom: 1px solid rgba(201, 151, 58, 0.2);
  transition: box-shadow 0.3s;
}

.nav.scrolled {
  box-shadow: 0 4px 24px rgba(13,31,60,0.35);
}

.nav__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 68px;
  padding: 0 24px;
  max-width: 1140px;
  margin: 0 auto;
}

.nav__logo {
  display: flex;
  flex-direction: column;
  line-height: 1;
}

.nav__logo-name {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 900;
  color: var(--white);
  letter-spacing: -0.01em;
}

.nav__logo-name span {
  color: var(--gold);
}

.nav__logo-tagline {
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
  margin-top: 3px;
}

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

.nav__links a {
  font-size: 0.875rem;
  font-weight: 500;
  color: rgba(255,255,255,0.75);
  transition: color 0.2s;
}

.nav__links a:hover {
  color: var(--gold);
}

.nav__cta {
  background: var(--gold);
  color: var(--navy) !important;
  padding: 10px 20px;
  border-radius: var(--radius);
  font-weight: 600 !important;
  transition: background 0.2s !important;
}

.nav__cta:hover {
  background: var(--gold-light) !important;
  color: var(--navy) !important;
}

.nav__hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 4px;
}

.nav__hamburger span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--white);
  border-radius: 2px;
  transition: all 0.3s;
}

/* ── HERO ── */
.hero {
  background: var(--navy);
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding-top: 68px;
  position: relative;
  overflow: hidden;
}

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

.hero::after {
  content: '';
  position: absolute;
  bottom: -10%;
  left: -5%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(201,151,58,0.05) 0%, transparent 70%);
  pointer-events: none;
}

.hero__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
  padding: 80px 24px;
  max-width: 1140px;
  margin: 0 auto;
  width: 100%;
}

.hero__scroll-line {
  display: block;
  width: 1px;
  height: 48px;
  background: linear-gradient(to bottom, var(--gold), transparent);
  margin-bottom: 24px;
}

.hero__eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 20px;
  display: block;
}

.hero__heading {
  color: var(--white);
  margin-bottom: 24px;
}

.hero__heading em {
  font-style: normal;
  color: var(--gold);
}

.hero__body {
  font-size: 1.1rem;
  color: rgba(255,255,255,0.65);
  margin-bottom: 40px;
  max-width: 480px;
}

.hero__actions {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.hero__stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.hero__stat {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(201,151,58,0.2);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  position: relative;
  overflow: hidden;
}

.hero__stat::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(to right, var(--gold), transparent);
}

.hero__stat-number {
  font-family: 'Playfair Display', serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 8px;
}

.hero__stat-label {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.4;
}

.hero__stat-source {
  font-size: 0.65rem;
  color: rgba(255,255,255,0.3);
  margin-top: 6px;
  font-style: italic;
}

/* ── BUTTONS ── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 28px;
  border-radius: var(--radius);
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  border: none;
  text-decoration: none;
}

.btn--primary {
  background: var(--gold);
  color: var(--navy);
}

.btn--primary:hover {
  background: var(--gold-light);
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(201,151,58,0.3);
}

.btn--outline {
  background: transparent;
  color: var(--white);
  border: 1px solid rgba(255,255,255,0.3);
}

.btn--outline:hover {
  border-color: var(--gold);
  color: var(--gold);
}

.btn--navy {
  background: var(--navy);
  color: var(--white);
}

.btn--navy:hover {
  background: var(--navy-light);
  transform: translateY(-1px);
}

/* ── AUDIENCE CARDS ── */
.audience-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.audience-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}

.audience-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform 0.25s;
  transform-origin: left;
}

.audience-card:hover {
  border-color: var(--gold);
  box-shadow: 0 12px 40px var(--shadow);
  transform: translateY(-4px);
}

.audience-card:hover::after {
  transform: scaleX(1);
}

.audience-card__icon {
  font-size: 2rem;
  margin-bottom: 16px;
  display: block;
}

.audience-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 12px;
}

.audience-card__body {
  font-size: 0.9rem;
  color: var(--text-mid);
  line-height: 1.65;
}

.audience-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 16px;
}

.tag {
  font-size: 0.7rem;
  font-weight: 500;
  padding: 4px 10px;
  background: var(--off-white);
  border-radius: 100px;
  color: var(--text-mid);
}

/* ── THREAT SECTION ── */
.threat-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.threat-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  transition: border-color 0.2s;
}

.threat-card:hover {
  border-color: rgba(201,151,58,0.4);
}

.threat-card__icon {
  font-size: 1.5rem;
  margin-bottom: 14px;
  display: block;
}

.threat-card__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--white);
  margin-bottom: 8px;
}

.threat-card__body {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.6;
}

.threat-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 40px;
}

.threat-tab {
  padding: 10px 24px;
  border-radius: 100px;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid rgba(255,255,255,0.2);
  background: transparent;
  color: rgba(255,255,255,0.6);
  transition: all 0.2s;
  font-family: 'Inter', sans-serif;
}

.threat-tab.active,
.threat-tab:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--navy);
}

.threat-panel { display: none; }
.threat-panel.active { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

/* ── WARNING SIGNS ── */
.warning-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--white);
}

.warning-item {
  display: grid;
  grid-template-columns: 60px 1fr;
  align-items: center;
  gap: 24px;
  padding: 24px 28px;
  border-bottom: 1px solid var(--border);
  transition: background 0.2s;
}

.warning-item:last-child { border-bottom: none; }

.warning-item:hover {
  background: rgba(201,151,58,0.06);
}

.warning-item__number {
  font-family: 'Playfair Display', serif;
  font-size: 2rem;
  font-weight: 900;
  color: var(--gold);
  opacity: 0.6;
  line-height: 1;
}

.warning-item__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
}

.warning-item__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.6;
}

/* ── SERVICES ── */
.services-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.service-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px 28px;
  transition: all 0.25s;
}

.service-card:hover {
  box-shadow: 0 12px 40px var(--shadow);
  border-color: rgba(201,151,58,0.4);
}

.service-card__icon {
  font-size: 1.75rem;
  margin-bottom: 16px;
  display: block;
}

.service-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 10px;
}

.service-card__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
}

/* ── PLANS ── */
.plans-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  align-items: start;
}

.plan-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px 24px;
  position: relative;
  transition: all 0.25s;
}

.plan-card:hover {
  box-shadow: 0 16px 48px var(--shadow);
  transform: translateY(-4px);
}

.plan-card--featured {
  border: 2px solid var(--gold);
  background: var(--navy);
  color: var(--white);
}

.plan-card--featured .plan-card__price,
.plan-card--featured .plan-card__name {
  color: var(--white);
}

.plan-card--featured .plan-card__feature {
  color: rgba(255,255,255,0.75);
  border-color: rgba(255,255,255,0.1);
}

.plan-card--featured .plan-card__feature::before {
  color: var(--gold);
}

.plan-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--gold);
  color: var(--navy);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 14px;
  border-radius: 100px;
  white-space: nowrap;
}

.plan-card__name {
  font-family: 'Playfair Display', serif;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 8px;
}

.plan-card__price {
  font-family: 'Playfair Display', serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--navy);
  line-height: 1;
  margin-bottom: 4px;
}

.plan-card__price span {
  font-size: 1rem;
  font-weight: 400;
  font-family: 'Inter', sans-serif;
  color: var(--text-light);
}

.plan-card__hst {
  font-size: 0.72rem;
  color: var(--text-light);
  margin-bottom: 20px;
}

.plan-card--featured .plan-card__hst {
  color: rgba(255,255,255,0.4);
}

.plan-card__divider {
  height: 1px;
  background: var(--border);
  margin: 16px 0;
}

.plan-card--featured .plan-card__divider {
  background: rgba(255,255,255,0.1);
}

.plan-card__features {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 24px;
}

.plan-card__feature {
  font-size: 0.82rem;
  color: var(--text-mid);
  padding-left: 20px;
  position: relative;
  border-bottom: 1px solid var(--border);
  padding-bottom: 10px;
  line-height: 1.4;
}

.plan-card__feature:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.plan-card__feature::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--gold);
  font-weight: 700;
  font-size: 0.75rem;
}

.plan-card .btn {
  width: 100%;
  justify-content: center;
}

/* ── FAQ ── */
.faq-list {
  max-width: 760px;
  margin: 0 auto;
}

.faq-item {
  border-bottom: 1px solid var(--border);
}

.faq-question {
  width: 100%;
  background: none;
  border: none;
  text-align: left;
  padding: 24px 0;
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  font-weight: 600;
  color: var(--navy);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  transition: color 0.2s;
}

.faq-question:hover {
  color: var(--gold);
}

.faq-question svg {
  flex-shrink: 0;
  transition: transform 0.25s;
  color: var(--gold);
}

.faq-item.open .faq-question svg {
  transform: rotate(45deg);
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease, padding 0.2s;
}

.faq-item.open .faq-answer {
  max-height: 400px;
  padding-bottom: 24px;
}

.faq-answer p {
  font-size: 0.95rem;
  color: var(--text-mid);
  line-height: 1.75;
}

/* ── CONTACT / BOOKING ── */
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 64px;
  align-items: start;
}

.contact-info__item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 28px;
}

.contact-info__icon {
  width: 44px;
  height: 44px;
  background: rgba(201,151,58,0.1);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
  color: var(--gold);
}

.contact-info__label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--gold);
  margin-bottom: 4px;
}

.contact-info__value {
  font-size: 0.95rem;
  color: var(--text-mid);
}

.contact-info__value a {
  color: var(--navy);
  font-weight: 500;
  transition: color 0.2s;
}

.contact-info__value a:hover {
  color: var(--gold);
}

.booking-form {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 40px;
}

.form-group {
  margin-bottom: 20px;
}

.form-label {
  display: block;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--navy);
  margin-bottom: 8px;
  letter-spacing: 0.02em;
}

.form-input,
.form-select,
.form-textarea {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  color: var(--text-dark);
  background: var(--white);
  transition: border-color 0.2s, box-shadow 0.2s;
  appearance: none;
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(201,151,58,0.12);
}

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

.form-textarea {
  resize: vertical;
  min-height: 100px;
}

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

.form-note {
  font-size: 0.78rem;
  color: var(--text-light);
  margin-top: 12px;
  text-align: center;
}

.form-success {
  display: none;
  text-align: center;
  padding: 32px;
}

.form-success__icon {
  font-size: 2.5rem;
  margin-bottom: 12px;
}

.form-success__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  color: var(--navy);
  margin-bottom: 8px;
}

.form-success__body {
  font-size: 0.9rem;
  color: var(--text-mid);
}

/* ── MISSION BANNER ── */
.mission-banner {
  background: var(--navy);
  padding: 80px 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.mission-banner::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 800px;
  height: 800px;
  background: radial-gradient(circle, rgba(201,151,58,0.06) 0%, transparent 65%);
  pointer-events: none;
}

.mission-banner__quote {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.6rem, 3.5vw, 2.8rem);
  font-weight: 700;
  font-style: italic;
  color: var(--white);
  max-width: 800px;
  margin: 0 auto 24px;
  line-height: 1.3;
}

.mission-banner__quote em {
  color: var(--gold);
  font-style: normal;
}

.mission-banner__attr {
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
}

/* ── FOOTER ── */
.footer {
  background: #080f1e;
  color: rgba(255,255,255,0.6);
  padding: 64px 0 32px;
}

.footer__grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 48px;
  margin-bottom: 48px;
}

.footer__logo-name {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-weight: 900;
  color: var(--white);
  margin-bottom: 8px;
}

.footer__logo-name span {
  color: var(--gold);
}

.footer__tagline {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.4);
  margin-bottom: 20px;
  line-height: 1.5;
}

.footer__differentiator {
  font-size: 0.82rem;
  font-style: italic;
  color: var(--gold);
  opacity: 0.8;
}

.footer__heading {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 16px;
}

.footer__links {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.footer__links a {
  font-size: 0.875rem;
  color: rgba(255,255,255,0.55);
  transition: color 0.2s;
}

.footer__links a:hover {
  color: var(--gold);
}

.footer__divider {
  height: 1px;
  background: rgba(255,255,255,0.07);
  margin-bottom: 28px;
}

.footer__bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.78rem;
  color: rgba(255,255,255,0.3);
}

/* ── PROTECTION PLAN ── */
.protection-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

.protection-step {
  text-align: center;
  padding: 40px 28px;
  background: var(--off-white);
  border-radius: var(--radius-lg);
  position: relative;
}

.protection-step__number {
  width: 52px;
  height: 52px;
  background: var(--navy);
  color: var(--gold);
  font-family: 'Playfair Display', serif;
  font-size: 1.4rem;
  font-weight: 900;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}

.protection-step__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 12px;
}

.protection-step__items {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-align: left;
}

.protection-step__item {
  font-size: 0.85rem;
  color: var(--text-mid);
  padding-left: 16px;
  position: relative;
  line-height: 1.5;
}

.protection-step__item::before {
  content: '→';
  position: absolute;
  left: 0;
  color: var(--gold);
  font-size: 0.75rem;
}

/* ── ABOUT SECTION ── */
.about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

.about-principle {
  background: var(--navy);
  border-radius: var(--radius-lg);
  padding: 40px;
  margin-top: 32px;
}

.about-principle__text {
  font-family: 'Playfair Display', serif;
  font-size: 1.3rem;
  font-style: italic;
  color: var(--white);
  line-height: 1.5;
  margin-bottom: 12px;
}

.about-principle__attr {
  font-size: 0.75rem;
  color: var(--gold);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.about-values {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.about-value {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.about-value__icon {
  width: 48px;
  height: 48px;
  background: rgba(201,151,58,0.1);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}

.about-value__title {
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
  font-size: 1rem;
}

.about-value__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
}

/* ── REGION PILLS ── */
.region-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.region-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(201,151,58,0.1);
  border: 1px solid rgba(201,151,58,0.25);
  color: var(--navy);
  font-size: 0.82rem;
  font-weight: 500;
  padding: 8px 16px;
  border-radius: 100px;
}

.region-pill::before {
  content: '📍';
  font-size: 0.75rem;
}

/* ── SCROLL ANIMATIONS ── */
.fade-up {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-up.visible {
  opacity: 1;
  transform: translateY(0);
}

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

@media (max-width: 900px) {
  .hero__inner {
    grid-template-columns: 1fr;
    gap: 48px;
    padding: 60px 24px;
  }

  .hero__stats {
    grid-template-columns: repeat(2, 1fr);
  }

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

  .threat-grid,
  .threat-panel.active {
    grid-template-columns: 1fr 1fr;
  }

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

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

  .about-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .protection-steps {
    grid-template-columns: 1fr;
  }

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

@media (max-width: 640px) {
  .section { padding: 64px 0; }

  .nav__links { display: none; }
  .nav__hamburger { display: flex; }

  .nav__links.mobile-open {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 68px;
    left: 0;
    right: 0;
    background: var(--navy);
    padding: 24px;
    gap: 20px;
    border-top: 1px solid rgba(201,151,58,0.2);
    z-index: 99;
  }

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

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

  .threat-grid,
  .threat-panel.active {
    grid-template-columns: 1fr;
  }

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

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

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

  .footer__bottom {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }

  .booking-form {
    padding: 24px;
  }

  .warning-item {
    grid-template-columns: 40px 1fr;
    gap: 16px;
    padding: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fade-up { transition: none; opacity: 1; transform: none; }
  * { transition-duration: 0.01ms !important; }
}


/* ── HOMEPAGE SECTION CARDS ── */
.home-sections {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 56px;
}

.home-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  text-decoration: none;
  display: block;
  transition: all 0.25s;
  position: relative;
  overflow: hidden;
}

.home-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform 0.25s;
  transform-origin: left;
}

.home-card:hover {
  border-color: var(--gold);
  box-shadow: 0 12px 40px var(--shadow);
  transform: translateY(-4px);
}

.home-card:hover::after {
  transform: scaleX(1);
}

.home-card__icon {
  font-size: 2rem;
  margin-bottom: 16px;
  display: block;
}

.home-card__title {
  font-family: 'Playfair Display', serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 10px;
}

.home-card__body {
  font-size: 0.875rem;
  color: var(--text-mid);
  line-height: 1.65;
  margin-bottom: 20px;
}

.home-card__arrow {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--gold);
  letter-spacing: 0.05em;
}

/* ── PAGE HEADER ── */
.page-header {
  background: var(--navy);
  padding: 120px 0 64px;
  position: relative;
  overflow: hidden;
}

.page-header::before {
  content: '';
  position: absolute;
  top: -20%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(201,151,58,0.08) 0%, transparent 70%);
  pointer-events: none;
}

.page-header__eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  display: block;
}

.page-header__title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight: 900;
  color: var(--white);
  line-height: 1.15;
  margin-bottom: 16px;
}

.page-header__body {
  font-size: 1.05rem;
  color: rgba(255,255,255,0.65);
  max-width: 560px;
}

/* ── ACTIVE NAV ── */
.nav__links a.active {
  color: var(--gold);
}

@media (max-width: 900px) {
  .home-sections {
    grid-template-columns: repeat(2, 1fr);
  }
}

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

/* Original shared enhancement stylesheet */
/* ============================================================
   THE ELDER IT — Enhancement Layer
   Shared across all pages. Loads after the base inline styles.
   Concept: "The Lantern" — gold light guiding through the dark.
   ============================================================ */

/* ── ACCESSIBILITY FOUNDATIONS ── */
.skip-link {
  position: fixed;
  top: -60px;
  left: 16px;
  z-index: 3000;
  background: var(--navy);
  color: var(--white);
  padding: 12px 20px;
  border-radius: 0 0 8px 8px;
  font-weight: 600;
  font-size: 0.9rem;
  transition: top 0.2s ease;
}
.skip-link:focus { top: 0; }

a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 3px;
  border-radius: 4px;
}

::selection { background: var(--gold); color: var(--navy); }

/* Custom scrollbar (WebKit + Firefox) */
html { scrollbar-color: var(--gold) var(--navy); scrollbar-width: thin; }
::-webkit-scrollbar { width: 11px; }
::-webkit-scrollbar-track { background: var(--navy); }
::-webkit-scrollbar-thumb { background: var(--gold); border-radius: 100px; border: 2px solid var(--navy); }

/* Larger-text mode — toggled from the nav "Aa" control */
html.text-lg { font-size: 118%; }
html.text-lg .nav__logo-tagline { display: none; }

/* ── READING PROGRESS BAR ── */
.progress-bar {
  position: fixed;
  top: 0; left: 0;
  height: 3px;
  width: 100%;
  transform: scaleX(0);
  transform-origin: left;
  background: linear-gradient(90deg, var(--gold), var(--gold-light));
  z-index: 2500;
  pointer-events: none;
}

/* ── TEXT SIZE TOGGLE (injected into nav) ── */
.nav__textsize {
  border: 1px solid rgba(201,151,58,0.5);
  background: transparent;
  color: var(--gold);
  border-radius: 100px;
  padding: 6px 14px;
  font-family: 'Inter', sans-serif;
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
  letter-spacing: 0.02em;
  transition: background 0.2s, color 0.2s;
  margin-left: 12px;
  white-space: nowrap;
}
.nav__textsize:hover { background: var(--gold); color: var(--navy); }
.nav__textsize .big { font-size: 1rem; }
@media (max-width: 900px) { .nav__textsize { margin-left: auto; margin-right: 12px; } }

/* ── BACK TO TOP — the lantern ── */
.to-top {
  position: fixed;
  right: 22px;
  bottom: 22px;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 1px solid rgba(201,151,58,0.55);
  background: var(--navy);
  color: var(--gold);
  font-size: 1.25rem;
  display: grid;
  place-items: center;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: opacity 0.3s, transform 0.3s, visibility 0.3s, box-shadow 0.3s;
  z-index: 2000;
  box-shadow: 0 6px 20px rgba(13,31,60,0.35);
}
.to-top.visible { opacity: 1; visibility: visible; transform: translateY(0); }
.to-top:hover { box-shadow: 0 0 0 6px rgba(201,151,58,0.18), 0 6px 24px rgba(13,31,60,0.4); }

/* ── LANTERN GLOW — pointer-tracked card illumination ── */
.lantern {
  position: relative;
  overflow: hidden;
}
.lantern::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.35s ease;
  background: radial-gradient(220px circle at var(--lx, 50%) var(--ly, 50%),
              rgba(201,151,58,0.16), transparent 65%);
}
.lantern:hover::after { opacity: 1; }

/* ── STAGGERED REVEALS ── */
.fade-up { transition-delay: var(--stagger, 0ms); }

/* ── ROTATING SAFETY TIP STRIP (home) ── */
.tip-strip {
  background: var(--navy);
  border-top: 1px solid rgba(201,151,58,0.25);
  border-bottom: 1px solid rgba(201,151,58,0.25);
  padding: 18px 0;
}
.tip-strip__inner {
  display: flex;
  align-items: center;
  gap: 18px;
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
}
.tip-strip__label {
  flex-shrink: 0;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gold);
  border: 1px solid rgba(201,151,58,0.45);
  border-radius: 100px;
  padding: 5px 12px;
}
.tip-strip__text {
  color: rgba(255,255,255,0.88);
  font-size: 0.95rem;
  line-height: 1.5;
  min-height: 1.5em;
  flex: 1;
}
.tip-strip__text strong { color: var(--gold-light); font-weight: 600; }
.tip-strip__btn {
  flex-shrink: 0;
  width: 34px; height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.25);
  background: transparent;
  color: rgba(255,255,255,0.8);
  cursor: pointer;
  font-size: 0.9rem;
  transition: border-color 0.2s, color 0.2s;
}
.tip-strip__btn:hover { border-color: var(--gold); color: var(--gold); }
@media (max-width: 640px) { .tip-strip__label { display: none; } }

/* ── HOW MEMBERSHIP WORKS (home) ── */
.how-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}
.how-step {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 34px 30px;
}
.how-step__num {
  font-family: 'Playfair Display', serif;
  font-size: 2.4rem;
  font-weight: 900;
  color: var(--gold);
  line-height: 1;
  margin-bottom: 14px;
}
.how-step__title { font-weight: 600; color: var(--navy); font-size: 1.08rem; margin-bottom: 8px; }
.how-step__body { font-size: 0.92rem; line-height: 1.7; }
@media (max-width: 860px) { .how-grid { grid-template-columns: 1fr; } }

/* Pricing teaser chips (home) */
.teaser-chips { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.teaser-chip {
  display: inline-flex; align-items: center; gap: 8px;
  border: 1px solid rgba(201,151,58,0.45);
  border-radius: 100px;
  padding: 9px 18px;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--navy);
  background: rgba(201,151,58,0.06);
  transition: background 0.2s, transform 0.2s;
}
.teaser-chip:hover { background: rgba(201,151,58,0.16); transform: translateY(-2px); }
.teaser-chip span { color: var(--gold); }

/* ── AUDIENCE SWITCHER (plans) ── */
.audience-switch {
  display: inline-flex;
  border: 1px solid var(--border);
  border-radius: 100px;
  padding: 5px;
  background: var(--white);
  gap: 4px;
  margin-bottom: 42px;
  box-shadow: 0 2px 12px var(--shadow);
}
.audience-switch__btn {
  border: none;
  background: transparent;
  border-radius: 100px;
  padding: 11px 26px;
  font-family: 'Inter', sans-serif;
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--text-mid);
  cursor: pointer;
  transition: background 0.25s, color 0.25s;
}
.audience-switch__btn.active { background: var(--navy); color: var(--gold-light); }

/* Value-metric explainer */
.value-metric {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin: 0 0 48px;
}
.value-metric__item {
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: var(--radius);
  background: var(--white);
  padding: 22px 24px;
}
.value-metric__label {
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--gold); margin-bottom: 8px;
}
.value-metric__text { font-size: 0.92rem; color: var(--text-mid); line-height: 1.65; }
.value-metric__text strong { color: var(--navy); }
@media (max-width: 720px) { .value-metric { grid-template-columns: 1fr; } }

/* Onboarding-fee expander inside plan cards */
.fee-details { margin: 14px 0 4px; }
.fee-details summary {
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--gold);
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.fee-details summary::-webkit-details-marker { display: none; }
.fee-details summary::after { content: "+"; font-weight: 700; }
.fee-details[open] summary::after { content: "–"; }
.fee-details p {
  margin-top: 10px;
  font-size: 0.82rem;
  line-height: 1.6;
  color: var(--text-mid);
  background: rgba(201,151,58,0.07);
  border-radius: var(--radius);
  padding: 12px 14px;
}
.plan-card--featured .fee-details p { background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.85); }
.plan-card--pro .fee-details p { background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.85); }

/* Professional card — color-differentiated business tier in the main layout */
.plan-card--pro {
  background: linear-gradient(155deg, var(--navy) 0%, var(--navy-light) 100%);
  border: 1px solid rgba(201,151,58,0.55);
}
.plan-card--pro .plan-card__name,
.plan-card--pro .plan-card__price { color: var(--gold-light); }
.plan-card--pro .plan-card__hst { color: rgba(255,255,255,0.65); }
.plan-card--pro .plan-card__feature { color: rgba(255,255,255,0.85); }
.plan-card--pro .plan-card__divider { background: rgba(201,151,58,0.35); }
.plan-card__badge {
  display: inline-block;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--navy);
  background: var(--gold);
  border-radius: 100px;
  padding: 5px 12px;
  margin-bottom: 14px;
}
.pro-bridge {
  margin-top: 14px;
  font-size: 0.8rem;
  line-height: 1.55;
  color: rgba(255,255,255,0.75);
  border-top: 1px dashed rgba(201,151,58,0.4);
  padding-top: 12px;
}
.pro-bridge a { color: var(--gold-light); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* Residential guardrail note */
.guardrail-note {
  margin-top: 26px;
  font-size: 0.85rem;
  color: var(--text-mid);
}
.guardrail-note a { color: var(--gold); font-weight: 600; }

/* ── TIER FINDER QUIZ (plans) ── */
.tier-quiz {
  background: var(--navy);
  border-radius: var(--radius-lg);
  padding: 44px 40px;
  margin: 56px 0 8px;
  color: var(--white);
  position: relative;
  overflow: hidden;
}
.tier-quiz::before {
  content: "";
  position: absolute;
  top: -80px; right: -80px;
  width: 260px; height: 260px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(201,151,58,0.22), transparent 70%);
  pointer-events: none;
}
.tier-quiz__eyebrow {
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.15em;
  text-transform: uppercase; color: var(--gold); display: block; margin-bottom: 10px;
}
.tier-quiz__title { font-family: 'Playfair Display', serif; font-size: 1.6rem; font-weight: 700; margin-bottom: 6px; color: var(--white); }
.tier-quiz__sub { color: rgba(255,255,255,0.65); font-size: 0.92rem; margin-bottom: 26px; }
.tier-quiz__question { font-weight: 600; font-size: 1.05rem; margin-bottom: 16px; color: var(--gold-light); min-height: 1.4em; }
.tier-quiz__options { display: flex; flex-wrap: wrap; gap: 12px; }
.tier-quiz__opt {
  border: 1px solid rgba(255,255,255,0.3);
  background: rgba(255,255,255,0.05);
  color: var(--white);
  border-radius: 100px;
  padding: 12px 22px;
  font-family: 'Inter', sans-serif;
  font-size: 0.92rem;
  cursor: pointer;
  transition: border-color 0.2s, background 0.2s, transform 0.2s;
}
.tier-quiz__opt:hover { border-color: var(--gold); background: rgba(201,151,58,0.14); transform: translateY(-2px); }
.tier-quiz__progress { margin-top: 22px; font-size: 0.78rem; color: rgba(255,255,255,0.45); }
.tier-quiz__result { display: none; }
.tier-quiz.done .tier-quiz__live { display: none; }
.tier-quiz.done .tier-quiz__result { display: block; }
.tier-quiz__result-name {
  font-family: 'Playfair Display', serif;
  font-size: 2rem; font-weight: 900; color: var(--gold-light); margin: 4px 0 10px;
}
.tier-quiz__result-body { color: rgba(255,255,255,0.8); font-size: 0.95rem; line-height: 1.7; max-width: 560px; margin-bottom: 22px; }
.tier-quiz__actions { display: flex; gap: 14px; flex-wrap: wrap; }
.tier-quiz__restart {
  background: transparent; border: 1px solid rgba(255,255,255,0.3);
  color: rgba(255,255,255,0.8); border-radius: 100px; padding: 12px 24px;
  font-family: 'Inter', sans-serif; font-size: 0.9rem; cursor: pointer;
}
.tier-quiz__restart:hover { border-color: var(--gold); color: var(--gold); }

/* ── AUTOMATION CALCULATOR (AI cards) ── */
.auto-calc {
  margin: 16px 0 6px;
  background: rgba(201,151,58,0.07);
  border: 1px solid rgba(201,151,58,0.25);
  border-radius: var(--radius);
  padding: 14px 16px;
}
.biz-plan-card--featured .auto-calc { background: rgba(255,255,255,0.07); border-color: rgba(255,255,255,0.2); }
.auto-calc__label { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gold); margin-bottom: 10px; }
.auto-calc__row { display: flex; align-items: center; gap: 14px; }
.auto-calc__btn {
  width: 34px; height: 34px; border-radius: 50%;
  border: 1px solid var(--gold);
  background: transparent; color: var(--gold);
  font-size: 1.1rem; font-weight: 700; cursor: pointer; line-height: 1;
  transition: background 0.2s, color 0.2s;
}
.auto-calc__btn:hover:not(:disabled) { background: var(--gold); color: var(--navy); }
.auto-calc__btn:disabled { opacity: 0.3; cursor: not-allowed; }
.auto-calc__count { font-family: 'Playfair Display', serif; font-size: 1.5rem; font-weight: 700; min-width: 2ch; text-align: center; }
.auto-calc__out { margin-top: 10px; font-size: 0.83rem; line-height: 1.55; }
.auto-calc__out strong { font-weight: 700; }

/* ── SCAM SIMULATION SCROLLY (awareness) ── */
.scam-sim {
  background: linear-gradient(180deg, var(--navy) 0%, #0a1830 100%);
  padding: 96px 0;
  color: var(--white);
}
.scam-sim__grid {
  display: grid;
  grid-template-columns: 380px 1fr;
  gap: 64px;
  align-items: start;
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
}
.scam-sim__sticky { position: sticky; top: 110px; }
.phone {
  width: 100%;
  max-width: 340px;
  margin: 0 auto;
  background: #10192b;
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 34px;
  padding: 18px 16px 26px;
  box-shadow: 0 30px 60px rgba(0,0,0,0.5), 0 0 0 6px rgba(255,255,255,0.03);
}
.phone__notch { width: 90px; height: 5px; border-radius: 100px; background: rgba(255,255,255,0.2); margin: 0 auto 14px; }
.phone__header {
  text-align: center;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  padding-bottom: 12px;
  margin-bottom: 14px;
}
.phone__sender { font-weight: 600; font-size: 0.95rem; }
.phone__number { font-size: 0.72rem; color: rgba(255,255,255,0.45); margin-top: 2px; }
.phone__thread { display: flex; flex-direction: column; gap: 10px; min-height: 330px; }
.msg {
  max-width: 88%;
  border-radius: 16px;
  padding: 11px 14px;
  font-size: 0.84rem;
  line-height: 1.5;
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.msg.show { opacity: 1; transform: translateY(0); }
.msg--in { background: #1e2c46; border-bottom-left-radius: 4px; align-self: flex-start; }
.msg--out { background: var(--gold); color: var(--navy); font-weight: 500; border-bottom-right-radius: 4px; align-self: flex-end; }
.msg--in .fake-link { color: #6ea8ff; text-decoration: underline; word-break: break-all; }
.msg--alert {
  align-self: center;
  background: rgba(201,151,58,0.14);
  border: 1px solid rgba(201,151,58,0.5);
  color: var(--gold-light);
  font-weight: 600;
  text-align: center;
  max-width: 100%;
}
.scam-sim__steps { display: flex; flex-direction: column; gap: 42vh; padding: 12vh 0 20vh; }
.scam-step {
  border-left: 2px solid rgba(201,151,58,0.35);
  padding-left: 26px;
  opacity: 0.32;
  transition: opacity 0.4s ease;
  max-width: 520px;
}
.scam-step.active { opacity: 1; }
.scam-step__flag {
  display: inline-block;
  font-size: 0.68rem; font-weight: 700; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--navy);
  background: var(--gold); border-radius: 100px;
  padding: 4px 12px; margin-bottom: 12px;
}
.scam-step__title { font-family: 'Playfair Display', serif; font-size: 1.35rem; font-weight: 700; margin-bottom: 10px; color: var(--white); }
.scam-step__body { color: rgba(255,255,255,0.72); font-size: 0.95rem; line-height: 1.75; }
.scam-sim__intro { text-align: center; max-width: 680px; margin: 0 auto 10px; padding: 0 24px; }
.scam-sim__intro .section__eyebrow { margin-bottom: 14px; }
.scam-sim__intro h2 { color: var(--white); margin-bottom: 14px; }
.scam-sim__intro p { color: rgba(255,255,255,0.68); }
@media (max-width: 900px) {
  /* SAFE FALLBACK, not a hide rule. Previously this unconditionally set
     .scam-sim__grid to display:none at mobile widths, trusting the JS to
     always successfully build a replacement. If that JS ever didn't run —
     wrong file version live, script error, anything — the CSS still hid
     the grid, leaving a blank hole with nothing to fall back to. Now the
     grid stays visible and simply stacks/un-stickies at this width by
     default; JS hides it directly (inline style) ONLY after it has
     confirmed the replacement story is fully built and in the DOM. Worst
     case if JS fails: everything-visible-at-once (not ideal, previously
     reported), never invisible.                                           */
  .scam-sim__grid { grid-template-columns: 1fr; gap: 36px; }
  .scam-sim__sticky { position: static; }
  .phone { max-width: 300px; margin: 0 auto; }
  .phone__thread { min-height: auto; }
  .scam-sim__steps { gap: 26px; padding: 8px 0 0; }
  .scam-step { opacity: 1; }
  .msg { opacity: 1; transform: none; }
}

/* ── MOBILE SCAM STORY: interleaved, scroll-revealed ──
   Message bubble reveals as you scroll to it, then its explanation reveals
   right after, then the next bubble — same "watch it happen" idea as the
   desktop sticky version, rebuilt as a simple linear story for narrow
   screens where a sticky side-by-side column doesn't work. Hidden entirely
   on desktop; only rendered/shown when the JS decides the viewport is
   narrow enough to need it.                                                */
.scam-mobile-story { display: none; }
.scam-mobile-story.active { display: flex; flex-direction: column; max-width: 460px; margin: 0 auto; }
.scam-mobile-story__header {
  display: flex; align-items: center; justify-content: space-between;
  border-bottom: 1px solid rgba(255,255,255,0.14);
  padding-bottom: 12px; margin-bottom: 22px;
}
.scam-mobile-story__sender { font-weight: 600; font-size: 0.95rem; color: var(--white); }
.scam-mobile-story__number { font-size: 0.72rem; color: rgba(255,255,255,0.45); margin-top: 2px; }
.scam-mobile-story__item {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.55s ease, transform 0.55s ease;
}
.scam-mobile-story__item.show { opacity: 1; transform: none; }
.scam-mobile-story__item.msg {
  max-width: 82%;
  margin-bottom: 22px;
  /* .msg already carries bubble background/color per in/out/alert variant —
     only widen the bottom margin here since it's no longer inside a tight
     phone__thread flex column.                                            */
}
.scam-mobile-story__item.scam-step { margin-bottom: 34px; padding-left: 2px; }
@media (prefers-reduced-motion: reduce) {
  .scam-mobile-story__item { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* ── SPOT THE RED FLAGS GAME (awareness) ── */
.flag-game { max-width: 900px; margin: 0 auto; }
.fake-email {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 14px 40px var(--shadow);
}
.fake-email__bar {
  background: var(--off-white);
  border-bottom: 1px solid var(--border);
  padding: 12px 20px;
  display: flex; gap: 8px;
}
.fake-email__dot { width: 11px; height: 11px; border-radius: 50%; background: var(--border); }
.fake-email__head { padding: 20px 26px 14px; border-bottom: 1px solid var(--border); }
.fake-email__row { font-size: 0.88rem; margin-bottom: 6px; color: var(--text-mid); }
.fake-email__row strong { color: var(--text-dark); font-weight: 600; }
.fake-email__body { padding: 24px 26px 30px; font-size: 0.94rem; line-height: 1.8; color: var(--text-dark); }
.fake-email__body p { margin-bottom: 14px; color: var(--text-dark); }
.flag-spot {
  background: none; border: none; padding: 0 2px;
  font: inherit; color: inherit; cursor: pointer;
  border-bottom: 2px dotted transparent;
  border-radius: 3px;
  transition: background 0.2s;
}
.flag-spot:hover { background: rgba(201,151,58,0.14); border-bottom-color: var(--gold); }
.flag-spot.found {
  background: rgba(201,151,58,0.22);
  border-bottom: 2px solid var(--gold);
  font-weight: 600;
  cursor: default;
}
.flag-game__hud {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; margin: 22px 0 14px; flex-wrap: wrap;
}
.flag-game__score { font-family: 'Playfair Display', serif; font-size: 1.25rem; font-weight: 700; color: var(--navy); }
.flag-game__score span { color: var(--gold); }
.flag-game__reset {
  border: 1px solid var(--border); background: var(--white);
  border-radius: 100px; padding: 10px 22px;
  font-family: 'Inter', sans-serif; font-size: 0.85rem; font-weight: 600;
  color: var(--text-mid); cursor: pointer; transition: border-color 0.2s, color 0.2s;
}
.flag-game__reset:hover { border-color: var(--gold); color: var(--gold); }
.flag-game__found { display: flex; flex-direction: column; gap: 10px; }
.flag-game__item {
  display: flex; gap: 12px; align-items: flex-start;
  background: var(--white); border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: var(--radius); padding: 14px 16px;
  font-size: 0.88rem; line-height: 1.6; color: var(--text-mid);
  animation: flagIn 0.4s ease;
}
.flag-game__item strong { color: var(--navy); }
@keyframes flagIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.flag-game__win {
  display: none;
  margin-top: 18px;
  background: var(--navy); color: var(--gold-light);
  border-radius: var(--radius-lg); padding: 22px 26px;
  font-weight: 600; text-align: center; line-height: 1.6;
}
.flag-game.complete .flag-game__win { display: block; animation: flagIn 0.5s ease; }

/* ── ONCE vs ONGOING STRIP (services) ── */
.once-vs {
  display: grid; grid-template-columns: 1fr 1fr; gap: 24px;
  max-width: 980px; margin: 0;
}
.once-vs__col {
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 32px 30px;
  background: var(--white);
}
.once-vs__col--member { background: var(--navy); border-color: rgba(201,151,58,0.45); }
.once-vs__tag {
  display: inline-block; font-size: 0.68rem; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--gold); border: 1px solid rgba(201,151,58,0.5);
  border-radius: 100px; padding: 4px 12px; margin-bottom: 14px;
}
.once-vs__title { font-family: 'Playfair Display', serif; font-size: 1.3rem; font-weight: 700; color: var(--navy); margin-bottom: 10px; }
.once-vs__col--member .once-vs__title { color: var(--white); }
.once-vs__body { font-size: 0.92rem; line-height: 1.75; }
.once-vs__col--member .once-vs__body { color: rgba(255,255,255,0.75); }
@media (max-width: 800px) { .once-vs { grid-template-columns: 1fr; } }

.service-card__book {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 14px; font-size: 0.82rem; font-weight: 600; color: var(--gold);
}
.service-card__book:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ── FAQ SEARCH ── */
.faq-search { position: relative; max-width: 560px; margin: 0 0 36px; }
.faq-search input {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 100px;
  padding: 15px 22px 15px 50px;
  font-family: 'Inter', sans-serif;
  font-size: 0.95rem;
  color: var(--text-dark);
  background: var(--white);
  transition: border-color 0.2s, box-shadow 0.2s;
}
.faq-search input:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 4px rgba(201,151,58,0.14); }
.faq-search svg { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); color: var(--text-light); }
.faq-noresults {
  display: none;
  border: 1px dashed var(--border);
  border-radius: var(--radius-lg);
  padding: 30px; text-align: center;
  color: var(--text-mid); font-size: 0.95rem;
}
.faq-noresults a { color: var(--gold); font-weight: 600; }

/* ── CONTACT TOPIC CHIPS ── */
.topic-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 28px; }
.topic-chip {
  border: 1px solid var(--border);
  background: var(--white);
  border-radius: 100px;
  padding: 10px 18px;
  font-family: 'Inter', sans-serif;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-mid);
  cursor: pointer;
  transition: border-color 0.2s, color 0.2s, background 0.2s;
}
.topic-chip:hover { border-color: var(--gold); color: var(--gold); }
.topic-chip.active { background: var(--navy); border-color: var(--navy); color: var(--gold-light); }

/* ── ENGAGEMENT TIMELINE (about) ── */
.journey { max-width: 760px; margin: 0; position: relative; }
.journey::before {
  content: "";
  position: absolute; left: 25px; top: 8px; bottom: 8px;
  width: 2px;
  background: linear-gradient(180deg, var(--gold), rgba(201,151,58,0.15));
}
.journey__step { display: flex; gap: 28px; padding: 22px 0; position: relative; }
.journey__dot {
  flex-shrink: 0;
  width: 52px; height: 52px; border-radius: 50%;
  background: var(--navy); color: var(--gold);
  display: grid; place-items: center;
  font-family: 'Playfair Display', serif; font-weight: 700; font-size: 1.1rem;
  border: 1px solid rgba(201,151,58,0.5);
  z-index: 1;
}
.journey__title { font-weight: 600; color: var(--navy); font-size: 1.05rem; margin-bottom: 6px; }
.journey__body { font-size: 0.92rem; line-height: 1.7; color: var(--text-mid); }

/* ── COMPARISON TABLE (plans, consumer) ── */
.compare-wrap { overflow-x: auto; margin-top: 52px; border: 1px solid var(--border); border-radius: var(--radius-lg); }
.compare { width: 100%; border-collapse: collapse; min-width: 660px; background: var(--white); }
.compare th, .compare td { padding: 15px 18px; text-align: left; font-size: 0.88rem; border-bottom: 1px solid var(--border); }
.compare thead th {
  background: var(--navy); color: var(--gold-light);
  font-family: 'Playfair Display', serif; font-size: 1rem;
  position: sticky; top: 0;
}
.compare thead th:first-child { color: rgba(255,255,255,0.6); font-family: 'Inter', sans-serif; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.1em; }
.compare tbody tr:last-child td { border-bottom: none; }
.compare tbody td:first-child { font-weight: 600; color: var(--navy); }
.compare .yes { color: var(--gold); font-weight: 700; }
.compare .no { color: var(--text-light); }

/* ── FOOTER POLISH ── */
.footer__social { display: flex; gap: 12px; margin-top: 18px; }
.footer__social a {
  width: 38px; height: 38px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.2);
  display: grid; place-items: center;
  color: rgba(255,255,255,0.7);
  transition: border-color 0.2s, color 0.2s;
}
.footer__social a:hover { border-color: var(--gold); color: var(--gold); }

/* ── REDUCED MOTION ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
  html { scroll-behavior: auto; }
  .msg { opacity: 1; transform: none; }
  .scam-step { opacity: 1; }
  .fade-up { opacity: 1 !important; transform: none !important; }
}

/* ── E10. JOURNEY GOLD FILL (about) ── */
.journey::before {
  background: linear-gradient(180deg,
    var(--gold) 0%,
    var(--gold) var(--journey-fill, 0%),
    rgba(201,151,58,0.15) var(--journey-fill, 0%),
    rgba(201,151,58,0.15) 100%);
  transition: none;
}

/* ============================================================
   ROUND 2 — Fixes & visual enhancements
   ============================================================ */

/* ── PROFESSIONAL: gold showcase card (fix + wow) ── */
.plan-card--pro {
  background: linear-gradient(150deg, var(--gold-light) 0%, var(--gold) 58%, #b58328 100%);
  border: none;
  position: relative;
  z-index: 0;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.plan-card--pro::before {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  background: conic-gradient(from var(--spin, 0deg), var(--navy), var(--gold-light), var(--white), var(--gold-light), var(--navy));
  z-index: -1;
  animation: proSpin 6s linear infinite;
}
@property --spin { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
@keyframes proSpin { to { --spin: 360deg; } }
@supports not (background: conic-gradient(from var(--spin, 0deg), red, blue)) {
  .plan-card--pro::before { animation: none; background: var(--navy); }
}
.plan-card--pro:hover { transform: translateY(-8px) scale(1.02); box-shadow: 0 24px 60px rgba(201,151,58,0.45); }
.plan-card--pro .plan-card__badge { background: var(--navy); color: var(--gold-light); }
.plan-card--pro .plan-card__name  { color: var(--navy); }
.plan-card--pro .plan-card__price { color: var(--navy); }
.plan-card--pro .plan-card__price span { color: rgba(13,31,60,0.65); }
.plan-card--pro .plan-card__hst { color: rgba(13,31,60,0.75); }
.plan-card--pro .plan-card__divider { background: rgba(13,31,60,0.35); }
.plan-card--pro .plan-card__feature { color: var(--white); text-shadow: 0 1px 2px rgba(13,31,60,0.25); }
.plan-card--pro .plan-card__feature::before { color: var(--navy); }
.plan-card--pro .pro-bridge { color: var(--white); border-top-color: rgba(13,31,60,0.35); }
.plan-card--pro .pro-bridge a { color: var(--navy); }
.plan-card--pro .btn--primary { background: var(--navy); color: var(--gold-light); border-color: var(--navy); }
.plan-card--pro .btn--primary:hover { background: var(--navy-light); }

/* ── SHEEN SWEEP on pricing tiles ── */
.plan-card, .biz-plan-card { overflow: hidden; position: relative; }
.plan-card::after, .biz-plan-card::after {
  content: "";
  position: absolute;
  top: 0; left: -80%;
  width: 55%; height: 100%;
  background: linear-gradient(105deg, transparent, rgba(255,255,255,0.35), transparent);
  transform: skewX(-20deg);
  pointer-events: none;
  transition: none;
}
.plan-card:hover::after, .biz-plan-card:hover::after { animation: sheen 0.9s ease forwards; }
@keyframes sheen { to { left: 130%; } }

/* ── 3D TILT (site-wide tiles) ── */
.tilt { transform-style: preserve-3d; will-change: transform; }

/* ── THREAT FLIP CARDS ── */
.threat-card--flip {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  cursor: pointer;
  min-height: 230px;
}
.threat-card--flip .flip-inner {
  position: relative;
  width: 100%;
  min-height: 230px;
}
/* 2D reveal — opacity + small 2D transforms only; renders identically everywhere */
.flip-front, .flip-back {
  position: absolute;
  inset: 0;
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  transition: opacity 0.45s ease, transform 0.45s ease;
}
.flip-front { opacity: 1; transform: none; z-index: 2; }
.flip-back  { opacity: 0; transform: translateY(12px) scale(0.97); z-index: 1; pointer-events: none; }
.threat-card--flip.flipped .flip-front { opacity: 0; transform: translateY(-12px) scale(0.97); pointer-events: none; }
.threat-card--flip.flipped .flip-back  { opacity: 1; transform: none; z-index: 3; pointer-events: auto; }
.flip-front {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.12);
}
.flip-hint {
  display: inline-block;
  margin-top: 14px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold);
  opacity: 0.85;
}
.flip-back {
  transform: rotateY(180deg);
  background: linear-gradient(150deg, var(--gold-light), var(--gold));
  display: flex; flex-direction: column; justify-content: center; gap: 10px;
}
.flip-back__label {
  font-size: 0.7rem; font-weight: 700; letter-spacing: 0.15em;
  text-transform: uppercase; color: var(--navy);
}
.flip-back__body { color: var(--navy); font-size: 0.9rem; line-height: 1.65; font-weight: 500; }

/* ── REAL OR SCAM GAME ── */
.ros { max-width: 640px; margin: 0 auto; }
.ros__counter {
  font-size: 0.75rem; font-weight: 700; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--gold); margin-bottom: 14px; text-align: center;
}
.ros__card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 30px 28px;
  box-shadow: 0 12px 36px var(--shadow);
  min-height: 120px;
  display: grid; place-items: center;
}
.ros__msg { font-size: 1rem; line-height: 1.7; color: var(--text-dark); text-align: center; }
.ros__msg .mono { font-family: monospace; font-size: 0.9em; color: var(--navy); word-break: break-all; }
.ros__verdict {
  min-height: 64px;
  margin: 16px 0 6px;
  font-size: 0.92rem;
  line-height: 1.6;
  text-align: center;
  color: var(--text-mid);
}
.ros__verdict strong.hit { color: #1b7a3d; }
.ros__verdict strong.miss { color: #b03535; }
.ros__choices { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.ros__btn {
  border: 1px solid var(--border);
  background: var(--white);
  border-radius: 100px;
  padding: 14px 34px;
  font-family: 'Inter', sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition: transform 0.2s, border-color 0.2s, background 0.2s, color 0.2s;
}
.ros__btn:hover { transform: translateY(-2px); }
.ros__btn--real:hover { border-color: #1b7a3d; color: #1b7a3d; }
.ros__btn--scam:hover { border-color: #b03535; color: #b03535; }
.ros__btn--next, .ros__btn--restart { background: var(--navy); color: var(--gold-light); border-color: var(--navy); }
.ros__final { text-align: center; }
.ros__final-score { font-family: 'Playfair Display', serif; font-size: 2.6rem; font-weight: 900; color: var(--navy); margin-bottom: 8px; }
.ros__final-msg { color: var(--text-mid); max-width: 460px; margin: 0 auto 22px; line-height: 1.7; }

/* ── DATA RAIN (Managed AI divider) ── */
.biz-divider { position: relative; overflow: hidden; }
.data-rain {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  opacity: 0.16;
  pointer-events: none;
}
.biz-divider .container { position: relative; z-index: 1; }

/* ── DECODE HEADLINE ── */
.decode em, .decode { transition: none; }

/* ── JOURNEY SCROLL ACTIVATION (about) ── */
.journey__step { opacity: 0.45; transition: opacity 0.45s ease; }
.journey__step .journey__dot { transition: background 0.45s ease, color 0.45s ease, border-color 0.45s ease; }
.journey__step.active { opacity: 1; }
.journey__step.active .journey__dot { background: var(--gold); color: var(--navy); border-color: var(--gold); }

/* ── FLOATING LANTERN ORB (page headers) ──
   Uses ::after only — the base stylesheet owns ::before. */
.page-header::after {
  content: "";
  position: absolute;
  width: 150px; height: 150px;
  bottom: -40px; left: 10%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(201,151,58,0.3), transparent 70%);
  filter: blur(6px);
  pointer-events: none;
  animation: orbDrift 16s ease-in-out infinite alternate;
}
@keyframes orbDrift {
  from { transform: translate(0, 0) scale(1); }
  to   { transform: translate(-40px, 26px) scale(1.15); }
}
.page-header .container { position: relative; z-index: 1; }

@media (prefers-reduced-motion: reduce) {
  .plan-card--pro::before { animation: none; }
  .page-header::after { animation: none; }
  .plan-card:hover::after, .biz-plan-card:hover::after { animation: none; }
  .threat-card--flip .flip-inner { transition: none; }
}

/* ============================================================
   ROUND 3 — designer pass
   ============================================================ */

/* ── FILTER CHIPS (services + FAQ) ── */
.svc-filter { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 34px; }
.svc-chip {
  border: 1px solid var(--border);
  background: var(--white);
  border-radius: 100px;
  padding: 10px 22px;
  font-family: 'Inter', sans-serif;
  font-size: 0.86rem;
  font-weight: 600;
  color: var(--text-mid);
  cursor: pointer;
  transition: background 0.2s, color 0.2s, border-color 0.2s, transform 0.2s;
}
.svc-chip:hover { border-color: var(--gold); color: var(--gold); transform: translateY(-2px); }
.svc-chip.active { background: var(--navy); border-color: var(--navy); color: var(--gold-light); }
.service-card.svc-hide, .faq-item.svc-hide { display: none !important; }
.service-card { transition: opacity 0.3s ease, transform 0.3s ease; }
.service-card.svc-pop { animation: svcPop 0.35s ease; }
@keyframes svcPop { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* ── AI TERMINAL (services robot tile) ── */
.ai-terminal {
  margin-top: 14px;
  background: var(--navy);
  border-radius: var(--radius);
  padding: 12px 14px;
  font-family: monospace;
  font-size: 0.76rem;
  line-height: 1.7;
  color: var(--gold-light);
  min-height: 78px;
  overflow: hidden;
}
.ai-terminal .cursor { display: inline-block; width: 7px; height: 12px; background: var(--gold); animation: blink 0.9s steps(1) infinite; vertical-align: -1px; }
@keyframes blink { 50% { opacity: 0; } }

/* ── PILLARS ACCORDION (about) ── */
.pillar {
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--white);
  margin-bottom: 14px;
  overflow: hidden;
  transition: border-color 0.25s, box-shadow 0.25s;
}
.pillar.open { border-color: rgba(201,151,58,0.55); box-shadow: 0 10px 30px var(--shadow); }
.pillar__head {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  border: none;
  background: transparent;
  padding: 20px 22px;
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  text-align: left;
}
.pillar__icon {
  width: 44px; height: 44px;
  background: rgba(201,151,58,0.1);
  border-radius: var(--radius);
  display: grid; place-items: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}
.pillar__title { font-weight: 600; font-size: 1.05rem; color: var(--navy); flex: 1; }
.pillar__chev { color: var(--gold); transition: transform 0.3s ease; font-size: 0.9rem; }
.pillar.open .pillar__chev { transform: rotate(180deg); }
.pillar__panel {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.35s ease;
}
.pillar__wrap { overflow: hidden; min-height: 0; }
.pillar.open .pillar__panel { grid-template-rows: 1fr; }
.pillar__body { padding: 0 22px 6px; font-size: 0.94rem; line-height: 1.75; }
.pillar__practice {
  margin: 8px 22px 20px;
  padding: 12px 16px;
  background: rgba(201,151,58,0.07);
  border-left: 3px solid var(--gold);
  border-radius: 0 var(--radius) var(--radius) 0;
  font-size: 0.86rem;
  line-height: 1.65;
  color: var(--text-mid);
}

/* ── HERO CONSTELLATION (home) ── */
.hero { position: relative; }
.hero-net { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; opacity: 0.5; }
.hero__inner { position: relative; z-index: 1; }

/* ── HERO LOAD CHOREOGRAPHY (home) ── */
@keyframes heroIn { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
.hero__eyebrow, .hero__heading, .hero__body, .hero__actions { animation: heroIn 0.7s cubic-bezier(0.2,0.7,0.3,1) both; }
.hero__eyebrow { animation-delay: 0.05s; }
.hero__heading { animation-delay: 0.18s; }
.hero__body   { animation-delay: 0.34s; }
.hero__actions{ animation-delay: 0.5s; }

/* ── PLANS STICKY MINI-NAV ── */
.mini-nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  transform: translateY(-110%);
  background: rgba(13,31,60,0.96);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(201,151,58,0.35);
  z-index: 1500;
  transition: transform 0.35s ease;
}
.mini-nav.show { transform: translateY(72px); }
.mini-nav__inner {
  max-width: 1140px; margin: 0 auto; padding: 10px 24px;
  display: flex; gap: 8px; overflow-x: auto;
}
.mini-nav a {
  flex-shrink: 0;
  font-size: 0.82rem; font-weight: 600;
  color: rgba(255,255,255,0.65);
  padding: 8px 16px; border-radius: 100px;
  transition: color 0.2s, background 0.2s;
}
.mini-nav a:hover { color: var(--gold-light); }
.mini-nav a.active { background: rgba(201,151,58,0.18); color: var(--gold-light); }

/* ── LIVE FRAUD COUNTER (awareness header) ── */
.loss-counter {
  margin-top: 26px;
  display: inline-flex;
  flex-direction: column;
  gap: 4px;
  background: rgba(201,151,58,0.1);
  border: 1px solid rgba(201,151,58,0.4);
  border-radius: var(--radius-lg);
  padding: 16px 24px;
}
.loss-counter__num {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.5rem, 3.4vw, 2.2rem);
  font-weight: 900;
  color: var(--gold-light);
  font-variant-numeric: tabular-nums;
}
.loss-counter__label { font-size: 0.82rem; color: rgba(255,255,255,0.7); }
.loss-counter__src { font-size: 0.68rem; color: rgba(255,255,255,0.4); letter-spacing: 0.04em; }

/* ── CONTACT FORM PROGRESS ── */
.form-progress { margin-bottom: 20px; }
.form-progress__label { font-size: 0.78rem; font-weight: 600; color: var(--text-mid); margin-bottom: 8px; display: flex; justify-content: space-between; }
.form-progress__label strong { color: var(--gold); }
.form-progress__track { height: 6px; border-radius: 100px; background: var(--off-white); border: 1px solid var(--border); overflow: hidden; }
.form-progress__fill { height: 100%; width: 0%; border-radius: 100px; background: linear-gradient(90deg, var(--gold), var(--gold-light)); transition: width 0.4s ease; }

/* ── INBOX DEFENDER ARCADE ── */
.defender { max-width: 720px; margin: 0 auto; }
.defender__hud {
  display: flex; gap: 22px; justify-content: center; flex-wrap: wrap;
  margin-bottom: 14px;
  font-weight: 600; font-size: 0.95rem; color: rgba(255,255,255,0.85);
}
.defender__score, .defender__best-num { color: var(--gold-light); font-variant-numeric: tabular-nums; }
.defender__field {
  position: relative;
  height: 430px;
  border: 1px solid rgba(201,151,58,0.4);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 50% 120%, rgba(201,151,58,0.14), transparent 60%),
    linear-gradient(180deg, #0a1830 0%, var(--navy) 100%);
  overflow: hidden;
  touch-action: manipulation;
}
.defender__inbox {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  text-align: center;
  padding: 10px;
  font-size: 0.8rem; font-weight: 700; letter-spacing: 0.18em;
  color: var(--gold);
  border-top: 1px dashed rgba(201,151,58,0.5);
  background: rgba(201,151,58,0.07);
}
.defender__overlay {
  position: absolute; inset: 0; z-index: 5;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  background: rgba(13,31,60,0.82);
  backdrop-filter: blur(3px);
  text-align: center; padding: 24px;
}
.defender__overlay-title { font-family: 'Playfair Display', serif; font-size: 1.9rem; font-weight: 900; color: var(--gold-light); }
.defender__overlay-body { color: rgba(255,255,255,0.75); max-width: 380px; line-height: 1.6; margin-bottom: 8px; }
.defender.playing .defender__overlay { display: none; }
.fall-msg {
  position: absolute;
  top: -60px;
  max-width: 230px;
  padding: 10px 14px;
  border-radius: 14px;
  font-size: 0.78rem;
  line-height: 1.45;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  background: #1e2c46;
  color: #fff;
  border: 1px solid rgba(255,255,255,0.15);
  box-shadow: 0 8px 22px rgba(0,0,0,0.35);
  will-change: transform;
}
.fall-msg:hover { border-color: var(--gold); }
.fall-msg.zapped { animation: zap 0.3s ease forwards; pointer-events: none; }
@keyframes zap { to { transform: scale(0.2) rotate(14deg); opacity: 0; } }
.fall-msg.wrong { animation: wrongShake 0.35s ease forwards; pointer-events: none; }
@keyframes wrongShake { 30% { transform: translateX(-6px); } 60% { transform: translateX(6px); } 100% { opacity: 0; } }
.fall-msg .tag {
  display: block; margin-top: 5px;
  font-size: 0.62rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
}
.fall-msg .tag--hit { color: #7fe0a0; }
.fall-msg .tag--miss { color: #ff9a9a; }
.defender__note { text-align: center; font-size: 0.82rem; color: rgba(255,255,255,0.5); margin-top: 14px; }
.defender__flash { animation: fieldFlash 0.3s ease; }
@keyframes fieldFlash { 50% { box-shadow: inset 0 0 0 4px rgba(255,90,90,0.6); } }

@media (prefers-reduced-motion: reduce) {
  .hero__eyebrow, .hero__heading, .hero__body, .hero__actions { animation: none; }
  .mini-nav { transition: none; }
}

/* ============================================================
   AGENT SHOWCASE — "What AI can be added" panel, visual pass
   Dark navy tiles, gold circuitry, one signature motion per agent
   ============================================================ */
.addons-grid .addon-item {
  position: relative;
  background: linear-gradient(160deg, var(--navy) 0%, var(--navy-light) 100%) !important;
  border: 1px solid rgba(201,151,58,0.3) !important;
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}
.addons-grid .addon-item:hover {
  transform: translateY(-4px);
  border-color: var(--gold) !important;
  box-shadow: 0 14px 34px rgba(13,31,60,0.4);
}
/* scanning beam sweeps each tile on hover */
.addons-grid .addon-item::before {
  content: "";
  position: absolute;
  top: 0; bottom: 0; left: -30%;
  width: 18%;
  background: linear-gradient(105deg, transparent, rgba(201,151,58,0.22), transparent);
  transform: skewX(-18deg);
  pointer-events: none;
}
.addons-grid .addon-item:hover::before { animation: agentScan 0.8s ease forwards; }
@keyframes agentScan { to { left: 120%; } }

.addons-grid .addon-item__icon {
  display: grid;
  place-items: center;
  width: 46px; height: 46px;
  flex-shrink: 0;
  background: rgba(201,151,58,0.12);
  border: 1px solid rgba(201,151,58,0.4);
  border-radius: 12px;
  font-size: 1.25rem;
  position: relative;
}
.addons-grid .addon-item__title { color: var(--gold-light); }
.addons-grid .addon-item__body { color: rgba(255,255,255,0.72); }

/* status LED on every agent chip */
.addons-grid .addon-item__icon::after {
  content: "";
  position: absolute;
  top: -4px; right: -4px;
  width: 9px; height: 9px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 0 rgba(201,151,58,0.6);
  animation: agentLed 2.4s ease-out infinite;
}
@keyframes agentLed {
  0% { box-shadow: 0 0 0 0 rgba(201,151,58,0.6); }
  70% { box-shadow: 0 0 0 8px rgba(201,151,58,0); }
  100% { box-shadow: 0 0 0 0 rgba(201,151,58,0); }
}

/* one signature motion per agent, by position */
.addons-grid .addon-item:nth-child(1):hover .addon-item__icon { animation: agentPing 0.55s ease; }      /* Lead Response — inbox ping */
.addons-grid .addon-item:nth-child(2):hover .addon-item__icon { animation: agentSpin 0.7s ease; }       /* Nurture — cycle */
.addons-grid .addon-item:nth-child(3):hover .addon-item__icon { animation: agentPop 0.5s ease; }        /* Package — unbox */
.addons-grid .addon-item:nth-child(4):hover .addon-item__icon { animation: agentRing 0.6s ease; }       /* Post-call — ring */
.addons-grid .addon-item:nth-child(5):hover .addon-item__icon { animation: agentSend 0.55s ease; }      /* Market update — send */
.addons-grid .addon-item:nth-child(6):hover .addon-item__icon { animation: agentSparkle 0.7s ease; }    /* Review — shine */
.addons-grid .addon-item:nth-child(7):hover .addon-item__icon { animation: agentPing 0.55s ease; }      /* Event — ping */
.addons-grid .addon-item:nth-child(8):hover .addon-item__icon { animation: agentSparkle 0.9s ease; }    /* Many more — shimmer */

@keyframes agentPing { 30% { transform: translateY(-7px); } 55% { transform: translateY(2px); } 100% { transform: none; } }
@keyframes agentSpin { to { transform: rotate(360deg); } }
@keyframes agentPop { 40% { transform: scale(1.25); } 100% { transform: none; } }
@keyframes agentRing { 20% { transform: rotate(-14deg); } 40% { transform: rotate(12deg); } 60% { transform: rotate(-8deg); } 80% { transform: rotate(5deg); } 100% { transform: none; } }
@keyframes agentSend { 45% { transform: translate(6px, -8px); opacity: 0.4; } 55% { transform: translate(-4px, 4px); opacity: 0.4; } 100% { transform: none; opacity: 1; } }
@keyframes agentSparkle { 30% { transform: scale(1.2) rotate(8deg); filter: drop-shadow(0 0 8px rgba(224,176,90,0.9)); } 100% { transform: none; filter: none; } }

/* staggered entrance when the panel opens */
.addons-panel.open .addon-item { animation: agentIn 0.45s ease both; }
.addons-panel.open .addon-item:nth-child(2) { animation-delay: 0.05s; }
.addons-panel.open .addon-item:nth-child(3) { animation-delay: 0.1s; }
.addons-panel.open .addon-item:nth-child(4) { animation-delay: 0.15s; }
.addons-panel.open .addon-item:nth-child(5) { animation-delay: 0.2s; }
.addons-panel.open .addon-item:nth-child(6) { animation-delay: 0.25s; }
.addons-panel.open .addon-item:nth-child(7) { animation-delay: 0.3s; }
.addons-panel.open .addon-item:nth-child(8) { animation-delay: 0.35s; }
@keyframes agentIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

.addons-note { color: var(--text-mid); }

@media (prefers-reduced-motion: reduce) {
  .addons-grid .addon-item__icon::after { animation: none; }
  .addons-grid .addon-item:hover .addon-item__icon { animation: none !important; }
  .addons-panel.open .addon-item { animation: none; }
  .addons-grid .addon-item:hover::before { animation: none; }
}


/* ── MANIFESTO REVEAL (about — the founding principle) ── */
.about-principle { position: relative; overflow: hidden; }
.about-principle::before {
  content: "";
  position: absolute;
  top: -50%; left: -20%;
  width: 40%; height: 200%;
  background: linear-gradient(100deg, transparent, rgba(201,151,58,0.12), transparent);
  transform: skewX(-16deg) translateX(-120%);
  pointer-events: none;
}
.about-principle.lit::before { animation: manifestoSweep 1.6s ease 0.2s forwards; }
@keyframes manifestoSweep { to { transform: skewX(-16deg) translateX(420%); } }
.manifesto .word {
  display: inline-block;
  opacity: 0;
  transform: translateY(0.5em);
  filter: blur(3px);
  transition: opacity 0.5s ease, transform 0.5s ease, filter 0.5s ease;
  transition-delay: var(--wd, 0ms);
}
.about-principle.lit .manifesto .word { opacity: 1; transform: none; filter: none; }
.manifesto .word--key { color: var(--gold-light); }
.about-principle__attr { display: inline-block; opacity: 0; transition: opacity 0.6s ease 1.4s; }
.about-principle.lit .about-principle__attr { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .manifesto .word { opacity: 1; transform: none; filter: none; transition: none; }
  .about-principle__attr { opacity: 1; transition: none; }
  .about-principle.lit::before { animation: none; }
}

/* ============================================================
   ROUND 4 — flow, luxe tiers, and signature moments
   ============================================================ */

/* ── AWARENESS: everything down the middle ── */
/* Centering rebuilt on flex instead of margin:auto — a completely different
   mechanism from the previous attempt, so it can't be defeated by whatever
   was blocking the margin-auto approach (most likely a caching layer, but
   this removes the dependency either way). align-items:center centers every
   direct child as a block — h1, p, and the JS-injected loss-counter alike —
   regardless of each one's own width or margin. !important is deliberate
   here: this is the third pass at this exact bug and it should not lose to
   anything else touching this selector.                                    */
.page-awareness .page-header .container {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center;
}
.page-faq .page-header .container {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center;
}
/* Second, independent mechanism on the child itself — belt and suspenders.
   If for any reason the flex parent above doesn't take (cache, load order,
   anything), this centers the paragraph on its own via the standard
   max-width + margin:auto pattern, with !important so nothing here can
   silently lose the fight either.                                          */
.page-awareness .page-header__body,
.page-faq .page-header__body {
  margin-top: 15px !important;
  margin-bottom: 15px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
/* Third mechanism: a fixed, measured value instead of a computed one — belt,
   suspenders, AND a nail. Measured directly against the live page: the
   .container content area is 1092px wide (1140px max-width minus 24px
   padding each side), and .page-header__body's max-width is 560px, so
   (1092 - 560) / 2 = 266px is the exact number that centers it, not an
   estimate. Scoped to ≥901px so it never fights a narrower container on
   tablet/mobile, where margin:auto above still does the job correctly.      */
@media (min-width: 901px) {
  .page-awareness .page-header__body,
  .page-faq .page-header__body {
    margin-left: 266px !important;
    margin-right: 266px !important;
  }
}
.page-awareness .loss-counter { text-align: left; }
.page-awareness .section__eyebrow { display: block; text-align: center; }
.page-awareness .section__heading { text-align: center; }
.page-awareness .section__subheading { text-align: center; margin-left: auto; margin-right: auto; }
.page-awareness .threat-tabs { justify-content: center; }
.page-awareness .flag-game__hud { justify-content: center; gap: 28px; }
.page-awareness .section__heading::after { margin-left: auto; margin-right: auto; }

/* ── FAQ: centered spine ── */
.page-faq .section__eyebrow { display: block; text-align: center; }
.page-faq .section__heading { text-align: center; }
.page-faq .section__subheading { text-align: center; margin-left: auto; margin-right: auto; }
.page-faq .faq-search { margin: 0 auto 26px; }
.page-faq .svc-filter { justify-content: center; }
.page-faq .faq-list, .page-faq .faq-noresults { max-width: 780px; margin-left: auto; margin-right: auto; }
.page-faq .section__heading::after { margin-left: auto; margin-right: auto; }

/* ── ANATOMY OF A SCAM (interstitial) ── */
.anatomy { max-width: 1020px; margin: 0 auto; position: relative; }
.anatomy__track {
  position: absolute;
  top: 26px; left: 12%; right: 12%;
  height: 2px;
  background: rgba(201,151,58,0.18);
  border-radius: 100px;
}
.anatomy__fill {
  height: 100%; width: 0;
  background: linear-gradient(90deg, var(--gold), var(--gold-light));
  border-radius: 100px;
  transition: width 1.6s cubic-bezier(0.3, 0, 0.2, 1);
}
.anatomy.lit .anatomy__fill { width: 100%; }
.anatomy__steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; position: relative; }
.anatomy__step { text-align: center; opacity: 0; transform: translateY(16px); transition: opacity 0.5s ease, transform 0.5s ease; }
.anatomy.lit .anatomy__step { opacity: 1; transform: none; }
.anatomy.lit .anatomy__step:nth-child(1) { transition-delay: 0.1s; }
.anatomy.lit .anatomy__step:nth-child(2) { transition-delay: 0.45s; }
.anatomy.lit .anatomy__step:nth-child(3) { transition-delay: 0.8s; }
.anatomy.lit .anatomy__step:nth-child(4) { transition-delay: 1.15s; }
.anatomy__icon {
  display: inline-grid;
  place-items: center;
  width: 54px; height: 54px;
  background: var(--navy);
  border: 1px solid rgba(201,151,58,0.55);
  border-radius: 50%;
  font-size: 1.35rem;
  margin-bottom: 14px;
  position: relative;
  z-index: 1;
}
.anatomy__name { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 1.1rem; color: var(--navy); margin-bottom: 8px; }
.anatomy__body { font-size: 0.86rem; line-height: 1.65; color: var(--text-mid); }
@media (max-width: 820px) {
  .anatomy__steps { grid-template-columns: 1fr; gap: 30px; }
  .anatomy__track { display: none; }
}

/* ── CHECKPOINT (interstitial) ── */
.checkpoint { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
.checkpoint__item {
  display: inline-flex; align-items: center; gap: 10px;
  border: 1px solid rgba(201,151,58,0.45);
  border-radius: 100px;
  padding: 11px 22px;
  color: rgba(255,255,255,0.88);
  font-size: 0.92rem; font-weight: 600;
  opacity: 0; transform: translateY(10px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.checkpoint.lit .checkpoint__item { opacity: 1; transform: none; }
.checkpoint.lit .checkpoint__item:nth-child(2) { transition-delay: 0.15s; }
.checkpoint.lit .checkpoint__item:nth-child(3) { transition-delay: 0.3s; }
.checkpoint.lit .checkpoint__item:nth-child(4) { transition-delay: 0.45s; }
.checkpoint__mark {
  display: inline-grid; place-items: center;
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--gold); color: var(--navy);
  font-size: 0.8rem; font-weight: 800;
}

/* ── AWARENESS JOURNEY LINE (desktop) ── */
.journey-line {
  position: fixed;
  left: 26px; top: 50%;
  transform: translateY(-50%);
  display: none;
  flex-direction: column;
  align-items: center;
  gap: 0;
  z-index: 1200;
}
@media (min-width: 1180px) { .journey-line { display: flex; } }
.journey-line__seg { width: 2px; height: 34px; background: rgba(201,151,58,0.25); }
.journey-line__seg.done { background: var(--gold); }
.journey-line__node {
  width: 13px; height: 13px;
  border-radius: 50%;
  border: 2px solid rgba(201,151,58,0.5);
  background: var(--off-white);
  cursor: pointer;
  position: relative;
  transition: background 0.3s, border-color 0.3s, transform 0.2s;
  padding: 0;
}
.journey-line__node:hover { transform: scale(1.3); }
.journey-line__node.done { background: var(--gold); border-color: var(--gold); }
.journey-line__node::after {
  content: attr(data-label);
  position: absolute;
  left: 22px; top: 50%;
  transform: translateY(-50%);
  background: var(--navy);
  color: var(--gold-light);
  font-size: 0.7rem; font-weight: 700;
  letter-spacing: 0.08em;
  padding: 5px 12px;
  border-radius: 100px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s;
}
.journey-line__node:hover::after { opacity: 1; }

/* ── SERVICE DEMO STRIPS (each tile alive) ── */
.svc-demo {
  margin-top: 14px;
  background: var(--navy);
  border-radius: var(--radius);
  padding: 11px 14px;
  font-family: monospace;
  font-size: 0.76rem;
  line-height: 1.7;
  color: var(--gold-light);
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.svc-demo .seat {
  width: 10px; height: 10px; border-radius: 3px;
  background: rgba(255,255,255,0.15);
  transition: background 0.25s ease, transform 0.25s ease;
}
.svc-demo .seat.on { background: var(--gold); transform: scale(1.15); }
.svc-demo .chk { opacity: 0.35; transition: opacity 0.25s, color 0.25s; }
.svc-demo .chk.on { opacity: 1; color: #8fe3ac; }
.svc-demo .bar {
  flex: 1; height: 8px; min-width: 80px;
  background: rgba(255,255,255,0.12);
  border-radius: 100px; overflow: hidden;
}
.svc-demo .bar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--gold), var(--gold-light)); transition: width 1.1s ease; }
.svc-demo .pill {
  padding: 3px 12px; border-radius: 100px;
  font-weight: 700; letter-spacing: 0.08em;
  background: rgba(255,90,90,0.18); color: #ff9a9a;
  transition: background 0.4s, color 0.4s;
}
.svc-demo .pill.calm { background: rgba(201,151,58,0.2); color: var(--gold-light); }

/* ── "MANY MORE" ONE-TIME TILE ── */
.service-card--more {
  grid-column: 1 / -1;
  text-align: center;
  border: 1px dashed rgba(201,151,58,0.6) !important;
  background: linear-gradient(160deg, rgba(201,151,58,0.05), rgba(201,151,58,0.1)) !important;
  position: relative;
  overflow: hidden;
}
.service-card--more .service-card__body { max-width: 620px; margin-left: auto; margin-right: auto; }
.service-card--more::after {
  content: "";
  position: absolute;
  top: 0; left: -60%;
  width: 40%; height: 100%;
  background: linear-gradient(105deg, transparent, rgba(201,151,58,0.14), transparent);
  transform: skewX(-18deg);
  animation: sheenLoop 5s ease-in-out infinite;
  pointer-events: none;
}
@keyframes sheenLoop { 0%, 55% { left: -60%; } 90%, 100% { left: 130%; } }

/* ── MEMBERSHIP TILE: the beam ── */
.once-vs__col--member {
  position: relative;
  z-index: 0;
  overflow: hidden;
}
.once-vs__col--member::before {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  background: conic-gradient(from var(--spin2, 0deg), transparent 0 70%, var(--gold) 82%, var(--gold-light) 88%, transparent 96%);
  z-index: -1;
  animation: memberBeam 5s linear infinite;
}
@property --spin2 { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
@keyframes memberBeam { to { --spin2: 360deg; } }
.once-vs__col--member::after {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  background: var(--navy);
  z-index: -1;
}
.once-vs__col--member > * { position: relative; z-index: 1; }
.once-vs__col--member:hover { transform: translateY(-4px); transition: transform 0.3s ease; box-shadow: 0 18px 44px rgba(13,31,60,0.45); }

/* ── MAX: the flagship (aurora, not a Professional copy) ── */
.biz-plan-card--max {
  position: relative;
  background: linear-gradient(165deg, #0a1526 0%, #0D1F3C 55%, #12264a 100%);
  border: 1px solid rgba(201,151,58,0.65);
  box-shadow: inset 0 0 0 1px rgba(224,176,90,0.15), 0 18px 44px rgba(10,21,38,0.5);
  overflow: hidden;
  z-index: 0;
}
.biz-plan-card--max::before {
  content: "";
  position: absolute;
  inset: -40%;
  background: conic-gradient(from 0deg at 60% 40%, transparent 0 55%, rgba(201,151,58,0.16) 68%, rgba(224,176,90,0.24) 74%, transparent 86%);
  animation: maxAurora 9s linear infinite;
  pointer-events: none;
  z-index: -1;
}
@keyframes maxAurora { to { transform: rotate(360deg); } }
.biz-plan-card--max .biz-plan-card__name,
.biz-plan-card--max .biz-plan-card__monthly { color: var(--gold-light); }
.biz-plan-card--max .biz-plan-card__setup,
.biz-plan-card--max .biz-plan-card__minimum { color: rgba(255,255,255,0.65); }
.biz-plan-card--max .biz-plan-card__feature { color: rgba(255,255,255,0.85); }
.biz-plan-card--max .biz-plan-card__tier { color: var(--gold); }
.biz-plan-card__flag {
  position: absolute;
  top: 16px; right: 16px;
  font-size: 0.62rem; font-weight: 800;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--navy);
  background: linear-gradient(120deg, var(--gold-light), var(--gold));
  padding: 5px 12px;
  border-radius: 100px;
  box-shadow: 0 0 14px rgba(224,176,90,0.5);
  animation: flagGlow 2.6s ease-in-out infinite alternate;
}
@keyframes flagGlow { from { box-shadow: 0 0 8px rgba(224,176,90,0.35); } to { box-shadow: 0 0 18px rgba(224,176,90,0.7); } }
.biz-plan-card--max:hover { transform: translateY(-6px); transition: transform 0.3s ease; }

/* ── CUSTOM: blueprint invitation ── */
.biz-plan-card--custom {
  grid-column: 1 / -1;
  position: relative;
  background:
    repeating-linear-gradient(0deg, rgba(201,151,58,0.05) 0 1px, transparent 1px 44px),
    repeating-linear-gradient(90deg, rgba(201,151,58,0.05) 0 1px, transparent 1px 44px),
    linear-gradient(120deg, #0a1526 0%, var(--navy) 100%);
  border: none;
  border-radius: var(--radius-lg);
  padding: 54px 48px;
  text-align: center;
  overflow: visible;
}
.custom__corner {
  position: absolute;
  width: 26px; height: 26px;
  border: 2px solid var(--gold);
  transition: width 0.35s ease, height 0.35s ease;
}
.custom__corner--tl { top: -2px; left: -2px; border-right: none; border-bottom: none; }
.custom__corner--tr { top: -2px; right: -2px; border-left: none; border-bottom: none; }
.custom__corner--bl { bottom: -2px; left: -2px; border-right: none; border-top: none; }
.custom__corner--br { bottom: -2px; right: -2px; border-left: none; border-top: none; }
.biz-plan-card--custom:hover .custom__corner { width: 44px; height: 44px; }
.custom__inner { max-width: 720px; margin: 0 auto; }
.custom__eyebrow {
  display: inline-block;
  font-size: 0.7rem; font-weight: 700;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
}
.custom__title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.9rem, 3.6vw, 2.7rem);
  font-weight: 900;
  color: var(--white);
  margin-bottom: 16px;
}
.custom__line { color: rgba(255,255,255,0.75); line-height: 1.8; font-size: 0.98rem; margin-bottom: 22px; }
.custom__specs {
  font-size: 0.74rem; font-weight: 600;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: rgba(224,176,90,0.85);
  margin-bottom: 30px;
}
@media (max-width: 720px) { .biz-plan-card--custom { padding: 40px 24px; } }

/* ── WOW 1: PAGE TRANSITION VEIL ── */
.veil {
  position: fixed;
  inset: 0;
  z-index: 4000;
  background: linear-gradient(120deg, var(--navy) 0%, #0a1830 100%);
  transform: translateY(101%);
  pointer-events: none;
}
.veil::after {
  content: "";
  position: absolute;
  top: -3px; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
}
.veil--boot { transform: translateY(0); animation: veilLift 0.6s cubic-bezier(0.7, 0, 0.3, 1) 0.08s forwards; }
@keyframes veilLift { to { transform: translateY(-101%); } }
.veil--in { animation: veilDrop 0.32s cubic-bezier(0.7, 0, 0.3, 1) forwards; }
@keyframes veilDrop { from { transform: translateY(101%); } to { transform: translateY(0); } }

/* ── WOW 2: CURSOR LANTERN ── */
.lantern-cursor {
  position: fixed;
  top: 0; left: 0;
  width: 30px; height: 30px;
  margin: -15px 0 0 -15px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(224,176,90,0.5), rgba(201,151,58,0.14) 55%, transparent 72%);
  pointer-events: none;
  z-index: 3500;
  mix-blend-mode: screen;
  transition: opacity 0.3s;
}
@media (hover: none) { .lantern-cursor { display: none; } }

/* ── WOW 3: HEADING GOLD STROKE ── */
.section__heading { position: relative; }
.section__heading::after {
  content: "";
  display: block;
  width: 0;
  height: 3px;
  margin-top: 16px;
  border-radius: 100px;
  background: linear-gradient(90deg, var(--gold), var(--gold-light));
  transition: width 0.7s cubic-bezier(0.3, 0, 0.2, 1) 0.15s;
}
.section__heading.lit::after { width: 58px; }

/* ── WOW 5: LANTERN INTRO BLOOM (home, once per session) ── */
.lantern-intro {
  position: fixed;
  inset: 0;
  z-index: 4500;
  background: var(--navy);
  display: grid;
  place-items: center;
  animation: introFade 1.1s ease 0.45s forwards;
  pointer-events: none;
}
.lantern-intro::before {
  content: "";
  width: 40px; height: 40px;
  border-radius: 50%;
  background: radial-gradient(circle, var(--gold-light), rgba(201,151,58,0.4) 45%, transparent 70%);
  animation: introBloom 1.2s cubic-bezier(0.2, 0.6, 0.3, 1) forwards;
}
@keyframes introBloom { to { transform: scale(60); opacity: 0.35; } }
@keyframes introFade { to { opacity: 0; visibility: hidden; } }

/* ── WOW 6: HERO POINTER PARALLAX ── */
.hero__inner {
  transform: translate3d(calc(var(--px, 0) * 9px), calc(var(--py, 0) * 6px), 0);
  transition: transform 0.25s ease-out;
}

/* index banner constellation host */
.mission-banner.has-net::before { opacity: 0.45; }
.mission-banner .hero-net { opacity: 0.4; }

@media (prefers-reduced-motion: reduce) {
  .veil, .veil--boot, .lantern-intro { display: none !important; }
  .lantern-cursor { display: none !important; }
  .anatomy__step, .checkpoint__item { opacity: 1 !important; transform: none !important; }
  .anatomy.lit .anatomy__fill { transition: none; }
  .service-card--more::after { animation: none; }
  .once-vs__col--member::before { animation: none; }
  .biz-plan-card--max::before { animation: none; }
  .biz-plan-card__flag { animation: none; }
  .section__heading::after { transition: none; }
  .hero__inner { transform: none; }
}


/* ============================================================
   CONTRAST & VISIBILITY REPAIR PASS
   ============================================================ */

/* Auto-calc on dark cards: Growth (featured, navy) & Max (obsidian) */
.biz-plan-card--featured .auto-calc,
.biz-plan-card--max .auto-calc { color: rgba(255,255,255,0.88); }
.biz-plan-card--featured .auto-calc__count,
.biz-plan-card--max .auto-calc__count { color: var(--gold-light); }
.biz-plan-card--featured .auto-calc__out,
.biz-plan-card--max .auto-calc__out { color: rgba(255,255,255,0.82); }
.biz-plan-card--featured .auto-calc__out strong,
.biz-plan-card--max .auto-calc__out strong { color: var(--gold-light); }
.biz-plan-card--max .auto-calc { background: rgba(255,255,255,0.06); border-color: rgba(201,151,58,0.35); }

/* Max: every base text element explicitly light (base colors are for white cards) */
.biz-plan-card--max .biz-plan-card__setup strong { color: var(--gold-light); }
.biz-plan-card--max .biz-plan-card__monthly span { color: rgba(255,255,255,0.55); }
.biz-plan-card--max .biz-plan-card__pricing { border-color: rgba(255,255,255,0.15); }
.biz-plan-card--max .biz-plan-card__feature::before { color: var(--gold); }

/* Professional: white-on-gold features fail contrast — navy is the readable pair */
.plan-card--pro .plan-card__feature { color: var(--navy); text-shadow: none; font-weight: 500; }
.plan-card--pro .pro-bridge { color: rgba(13,31,60,0.85); }
.plan-card--pro .pro-bridge a { color: var(--navy); font-weight: 700; }

/* Professional: rotating ring was clipped invisible by the sheen's overflow:hidden */
.plan-card--pro { overflow: visible; }
.plan-card--pro::after { display: none; } /* no sheen on pro — the ring is its signature */

/* Membership beam: same clipping bug — beam ring lives outside the box */
.once-vs__col--member { overflow: visible; }

/* Dark-section insurance: base headings inherit dark body text and rely on
   inline styles page by page — this guarantees legibility on every dark section */
.section--dark .section__heading { color: var(--white); }
.section--dark .section__subheading { color: rgba(255,255,255,0.7); }
.section--dark .section__eyebrow { color: var(--gold); }

/* Banner constellation: keep quote text painted above the canvas */
.mission-banner .container { position: relative; z-index: 1; }

/* Comparison table: explicit colors, no inheritance gambles */
.compare tbody td { color: var(--text-mid); }
.compare tbody td:first-child { color: var(--navy); }

/* Custom blueprint: explicit display (old flex rules removed above) */
.biz-plan-card--custom { display: block; }

/* Decode headline: hold color through the scramble */
.biz-divider .decode { color: inherit; }

/* Journey-line nodes: visible on both light and dark page zones */
.journey-line__node { box-shadow: 0 0 0 3px rgba(247,245,240,0.85); }

/* Flip hint: guarantee visibility on the dark threat panels */
.flip-front .threat-card__title, .flip-front .threat-card__body { color: inherit; }

/* Text-size mode: keep the nav from wrapping into the hamburger on tablets */
html.text-lg .nav__links { gap: 14px; }

/* mini-nav offset for smaller nav heights on mobile */
@media (max-width: 640px) { .mini-nav.show { transform: translateY(60px); } }

/* ============================================================
   THE GUARDED HOUSE — homepage signature
   ============================================================ */
.house-section {
  background:
    radial-gradient(ellipse at 50% -20%, rgba(201,151,58,0.12), transparent 55%),
    linear-gradient(180deg, #0a1830 0%, var(--navy) 100%);
  padding: 96px 0;
}
.house-section .section__heading::after { margin-left: 0; }
.house {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 48px;
  align-items: center;
  margin-top: 26px;
}
.house__scene { position: relative; }
.house__svg { width: 100%; height: auto; display: block; }

/* stars twinkle */
.star { fill: rgba(224,176,90,0.8); animation: twinkle 3.2s ease-in-out infinite; }
.star.s2 { animation-delay: 0.8s; } .star.s3 { animation-delay: 1.6s; }
.star.s4 { animation-delay: 2.2s; } .star.s5 { animation-delay: 0.4s; }
@keyframes twinkle { 0%, 100% { opacity: 0.25; } 50% { opacity: 1; } }

/* chimney smoke drifts */
.smoke { fill: rgba(255,255,255,0.07); animation: smokeRise 5s ease-in infinite; }
.smoke.k2 { animation-delay: 1.6s; } .smoke.k3 { animation-delay: 3.2s; }
@keyframes smokeRise {
  0% { transform: translateY(0); opacity: 0; }
  30% { opacity: 0.7; }
  100% { transform: translateY(-46px); opacity: 0; }
}

/* the lantern by the door — always burning */
.lantern-glow {
  fill: var(--gold-light);
  animation: lanternBreathe 2.8s ease-in-out infinite;
  filter: drop-shadow(0 0 10px rgba(224,176,90,0.9));
}
@keyframes lanternBreathe { 0%, 100% { opacity: 0.75; } 50% { opacity: 1; } }

/* windows: dark until the section wakes, then light one by one */
.win {
  fill: rgba(201,151,58,0.06);
  stroke: #C9973A;
  stroke-width: 2;
  transition: fill 0.8s ease, filter 0.8s ease;
}
.win-bar { stroke: rgba(201,151,58,0.55); stroke-width: 1.5; }
.house-section.awake .win {
  fill: rgba(224,176,90,0.55);
  filter: drop-shadow(0 0 14px rgba(224,176,90,0.55));
}
.house-section.awake #win-art-1 { transition-delay: 0.2s; }
.house-section.awake #win-art-2 { transition-delay: 0.55s; }
.house-section.awake #win-art-3 { transition-delay: 0.9s; }
.house-section.awake #win-art-4 { transition-delay: 1.25s; }
.win.active { fill: var(--gold-light) !important; filter: drop-shadow(0 0 22px rgba(224,176,90,0.95)) !important; }

/* invisible tap targets over the windows */
.house__hotspot {
  position: absolute;
  width: 15%;
  aspect-ratio: 1.1;
  transform: translate(-50%, -50%);
  background: transparent;
  border: 2px solid transparent;
  border-radius: 10px;
  cursor: pointer;
  transition: border-color 0.25s ease;
}
.house__hotspot:hover, .house__hotspot:focus-visible { border-color: rgba(224,176,90,0.8); }
.house__hotspot.active { border-color: var(--gold-light); }

/* the story card */
.house__story-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(201,151,58,0.4);
  border-radius: var(--radius-lg);
  padding: 32px 30px;
  backdrop-filter: blur(4px);
  animation: storyIn 0.4s ease;
}
@keyframes storyIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.house__story-tag {
  display: inline-block;
  font-size: 0.66rem; font-weight: 800;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--navy);
  background: var(--gold);
  border-radius: 100px;
  padding: 5px 13px;
  margin-bottom: 14px;
}
.house__story-who {
  font-family: 'Playfair Display', serif;
  font-size: 1.6rem; font-weight: 800;
  color: var(--white);
  margin-bottom: 12px;
}
.house__story-threat { color: rgba(255,255,255,0.78); line-height: 1.75; font-size: 0.95rem; margin-bottom: 12px; }
.house__story-threat strong { color: #ff9a9a; font-weight: 600; }
.house__story-guard { color: rgba(255,255,255,0.78); line-height: 1.75; font-size: 0.95rem; margin-bottom: 20px; }
.house__story-guard strong { color: var(--gold-light); font-weight: 600; }
.house__hint { margin-top: 16px; font-size: 0.82rem; color: rgba(255,255,255,0.45); }

@media (max-width: 900px) {
  .house { grid-template-columns: 1fr; gap: 30px; }
  .house-section { padding: 72px 0; }
}
@media (prefers-reduced-motion: reduce) {
  .star, .smoke, .lantern-glow { animation: none; }
  .house-section .win { fill: rgba(224,176,90,0.55); transition: none; }
  .house__story-card { animation: none; }
}


/* ── ALIGNMENT REPAIR PASS: centered-page content columns ── */
.page-awareness .warning-list { max-width: 820px; margin-left: auto; margin-right: auto; }
.page-awareness .protection-steps { max-width: 1020px; margin-left: auto; margin-right: auto; }
.page-awareness .section__subheading { max-width: 640px; }
.page-faq .section__subheading { max-width: 640px; }
/* inline-styled subheadings keep auto side margins even with margin-bottom overrides */
.page-awareness .section__subheading[style] { margin-left: auto !important; margin-right: auto !important; }

/* ── QUIZ → RECOMMENDED CARD PULSE (kept: live feature, restored keyframes) ── */
@keyframes cardPulse {
  0%   { box-shadow: 0 0 0 0 rgba(201,151,58,0.55); }
  70%  { box-shadow: 0 0 0 22px rgba(201,151,58,0); }
  100% { box-shadow: 0 0 0 0 rgba(201,151,58,0); }
}
.card-pulse { animation: cardPulse 1.1s ease-out 2; }
@media (prefers-reduced-motion: reduce) { .card-pulse { animation: none; } }

/* ═══════════════════════════════════════════════════════
   FIXES — July 10, 2026 audit
   1. Hero-wrap seams (index) + dark-flow seams (awareness)
   2. Awareness sticky phone (bounded to demo, not viewport top)
   3. Interstitial breathing room
   4. Back-to-top ring visibility (SVG circle stroke config)
   5. Section transition smoothing
   ═══════════════════════════════════════════════════════ */

/* 1a. INDEX — merge hero + mission banner into a single seamless surface.
   Hero background becomes transparent so the wrapper carries the color,
   and the constellation canvas spans the whole wrap uninterrupted.        */
.hero-wrap {
  position: relative;
  background: var(--navy);
  overflow: hidden;
}
/* ROOT CAUSE of the "split banner" look: base .hero uses min-height:100vh
   with align-items:center, so on any viewport taller than the content,
   flex centering leaves equal empty space above AND below the content —
   the bottom half of that empty space is what sat between the CTA buttons
   and the mission-banner quote, reading as a dead gap. Cap the height so
   the excess shrinks to something reasonable instead of scaling with
   viewport height.                                                        */
.hero-wrap .hero { min-height: min(100vh, 720px); }
.hero-wrap .hero { background: transparent; }
.hero-wrap .mission-banner { background: transparent; }
.hero-wrap .mission-banner::before { display: none; } /* wrapper carries the glow now */
.hero-wrap .hero__inner,
.hero-wrap .mission-banner .container { position: relative; z-index: 2; }
/* wrapper-level constellation canvas sits at z-index 0, spans full height */
.hero-wrap > .hero-net { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
/* Kill the horizontal seam between hero and banner by removing the top padding
   the banner had while its background was still separate.                    */
.hero-wrap .mission-banner { padding-top: 8px; padding-bottom: 72px; }
/* Soft gold glow that spans the full wrap so the constellation reads as one field */
.hero-wrap::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(1000px 520px at 78% 20%, rgba(201,151,58,0.09) 0%, transparent 60%),
    radial-gradient(760px 520px at 30% 88%, rgba(201,151,58,0.07) 0%, transparent 62%);
  pointer-events: none;
  z-index: 0;
}

/* 1b. AWARENESS — dark-flow wrapper does the same for header + scam-sim */
.dark-flow {
  position: relative;
  background: var(--navy);
  /* overflow:hidden was here to keep the constellation canvas visually
     contained. It wasn't actually needed for that — the canvas is
     position:absolute; inset:0, so it's already bounded to this box
     regardless of overflow. What it DID do, silently, is break
     position:sticky on .scam-sim__sticky (the phone) — overflow set to
     anything other than visible on ANY ancestor of a sticky element
     disables its sticky behaviour. That's why the phone stopped pinning
     and just scrolled straight through. Removed.                         */
}
.dark-flow .page-header { background: transparent; padding-bottom: 16px; }
.dark-flow .scam-sim {
  background: transparent;
  padding-top: 8px;
}
.dark-flow > .hero-net { position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: 0.35; }
.dark-flow .page-header .container,
.dark-flow .scam-sim__intro,
.dark-flow .scam-sim__grid { position: relative; z-index: 2; }


/* 2. AWARENESS phone: bounded sticky so it releases at the end of the demo.
   Previously top: 110px let it "walk" past the demo into empty space.
   Also center it vertically in the visible sticky window.                 */
.scam-sim__sticky {
  position: sticky;
  top: 110px;
  align-self: start;
  /* stop scrolling with the section end — phone anchors within demo bounds */
  height: calc(100vh - 130px);
  display: flex;
  align-items: center;
  justify-content: center;
}
.scam-sim__sticky .phone { margin: 0 auto; }
@media (max-width: 900px) {
  .scam-sim__sticky {
    position: static;
    height: auto;
    display: block;
  }
}

/* 3. INTERSTITIAL BREATHING — anatomy and checkpoint sections had too much
   empty space above/below their content on desktop. Tighten while keeping
   the reveal animations intact.                                            */
/* This gap was two paddings stacking: flag-game-section's own bottom
   padding (96px, from the base .section rule) PLUS anatomy-section's top
   padding (96px). Cutting flag-game's bottom and anatomy's top both to
   40px brings the combined dead space from ~192px down to ~80px.          */
#flag-game-section { padding-bottom: 40px; }
#anatomy-section { padding-top: 40px; padding-bottom: 80px; }
#checkpoint-section { padding: 80px 0 88px; margin-top: 0; }
#checkpoint-section .container { padding-top: 0; padding-bottom: 0; }
#checkpoint-section .mission-banner__quote { margin-bottom: 32px; }
/* The stray "Now lock it in — the arcade below drills it at speed." line
   was floating alone at the bottom. Tighten it to the checkpoint items.    */
#checkpoint-section > .container > p:last-child { margin-top: 22px !important; }

/* 4. BACK-TO-TOP RING — the SVG circle now has its stroke set inline in JS
   as a defensive measure (the reported "black circle" was the circle
   defaulting to fill:black with no stroke). CSS locks the visual layer:
   arrow (span) sits above the ring (svg) via z-index.                       */
.to-top { position: fixed; overflow: visible; }
.to-top svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
  pointer-events: none;
  z-index: 1;
}
.to-top svg circle {
  fill: none;
  stroke: var(--gold);
  stroke-width: 2;
  transition: stroke-dashoffset 0.15s linear;
}
.to-top__arrow {
  position: relative;
  z-index: 2;
  font-size: 1.25rem;
  line-height: 1;
  color: var(--gold);
}

/* 5. SECTION TRANSITION SMOOTHING — the abrupt scrolljumps between tabs
   were caused by page-veil animating on top of an already-scrolled position.
   Reset scroll instantly on same-origin nav so veil rise reveals a clean top.
   Handled in JS. CSS side: make the veil quicker and less "curtainy" so it
   feels like a soft wipe, not a page slam.                                   */
.veil--in { animation-duration: 0.22s !important; }
.veil--boot { animation-duration: 0.45s !important; }
.veil--boot { animation-delay: 0s !important; }

/* 6. HERO-WRAP: neutralize the old hero::before radial that used to carry
   the atmosphere on its own — the wrapper does it now, uniformly.          */
.hero-wrap .hero::before { display: none; }
.hero-wrap .hero::after { display: none; }


/* Form privacy and spam-protection helpers */
.form-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.form-privacy { margin-top: 10px; font-size: 0.82rem; line-height: 1.65; color: var(--text-mid); }
.form-privacy a { color: var(--navy); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* Reliability override: the visual source used fade-up animations, but merged
   deployment must never hide real content if observers, cache, or viewport
   timing disagree. */
.fade-up {
  opacity: 1 !important;
  transform: none !important;
}