/* ===== RESET & BASE ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { font-family: 'Source Serif 4', Georgia, serif; line-height: 1.7; color: #D0D5DE; background-color: #0A1628; overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
strong { font-weight: 700; }
em { font-style: italic; }
table { border-collapse: collapse; width: 100%; }

/* ===== CSS VARIABLES ===== */
:root {
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body: 'Source Serif 4', Georgia, serif;
  --font-accent: 'Montserrat', system-ui, sans-serif;
  --navy: #0A1628;
  --navy-dark: #0F1D35;
  --navy-darkest: #0B1120;
  --footer-dark: #070D1A;
  --gold: #C5A55A;
  --cream: #FAF7F2;
  --warm-cream: #F5F0E8;
  --gold-cream: #F5EDDA;
  --text-dark: #2D3142;
  --text-dark-secondary: #4A5568;
  --text-light: #D0D5DE;
  --text-light-secondary: #B0B8C8;
  --text-muted: #7A8599;
  --red-accent: #B8432F;
}

/* ===== LAYOUT ===== */
.reading-column {
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
@media (min-width: 768px) {
  .reading-column { padding-left: 2rem; padding-right: 2rem; }
}
.max-w-5xl { max-width: 64rem; margin-left: auto; margin-right: auto; }

/* ===== GOLD RULE DIVIDER ===== */
.gold-rule {
  background: linear-gradient(90deg, transparent, #C5A55A, transparent);
  border: none;
  max-width: 200px;
  height: 1px;
  margin: 2rem auto;
}

/* ===== DROP CAP ===== */
.drop-cap::first-letter {
  font-family: var(--font-display);
  float: left;
  color: #C5A55A;
  padding-top: 0.25rem;
  padding-right: 0.75rem;
  font-size: 4.5rem;
  font-weight: 700;
  line-height: 0.8;
}

/* ===== TYPOGRAPHY ===== */
.font-display { font-family: var(--font-display); }
.font-body { font-family: var(--font-body); }
.font-accent { font-family: var(--font-accent); }

/* ===== CTA BUTTON ===== */
.cta-button {
  display: inline-block;
  padding: 1.25rem 3rem;
  font-family: var(--font-accent);
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  background: linear-gradient(135deg, #C5A55A 0%, #D4B76A 50%, #C5A55A 100%);
  color: #0A1628;
  box-shadow: 0 4px 20px rgba(197,165,90,0.3);
  transition: all 0.3s ease;
  cursor: pointer;
  border: none;
  text-align: center;
}
.cta-button:hover {
  box-shadow: 0 6px 30px rgba(197,165,90,0.5);
  transform: translateY(-1px);
}
@media (min-width: 768px) {
  .cta-button { padding: 1.5rem 4rem; font-size: 1.125rem; }
}

/* ===== COUPON TAG ===== */
.coupon-tag {
  background-color: #C5A55A;
  color: #0A1628;
  padding: 1px 6px;
  font-weight: 700;
  letter-spacing: 0.05em;
  font-size: 0.9em;
}

/* ===== SECTION PADDING ===== */
.section-padding { padding: 4rem 0; }
@media (min-width: 768px) { .section-padding { padding: 6rem 0; } }

/* ===== BODY TEXT ===== */
.body-text {
  font-size: 1.125rem;
  line-height: 2.0;
  margin-bottom: 1.5rem;
}
@media (min-width: 768px) { .body-text { font-size: 1.25rem; } }

/* ===== SECTION HEADING ===== */
.section-heading {
  font-family: var(--font-display);
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.35;
  margin-bottom: 2rem;
  text-align: center;
}
@media (min-width: 768px) { .section-heading { font-size: 1.875rem; } }
@media (min-width: 1024px) { .section-heading { font-size: 2.25rem; } }

/* ===== BLOCKQUOTE CALLOUT ===== */
.callout-box {
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.85;
  margin: 2.5rem 0;
  text-align: center;
  padding: 1.5rem 1rem;
  border-left: 3px solid #C5A55A;
  border-right: 3px solid #C5A55A;
}
@media (min-width: 768px) { .callout-box { font-size: 1.5rem; } }

/* ===== HERO ===== */
.hero {
  position: relative;
  padding: 3rem 0 2rem;
  overflow: hidden;
  background-size: cover;
  background-position: center;
}
@media (min-width: 768px) { .hero { padding: 5rem 0 3rem; } }
@media (min-width: 1024px) { .hero { padding: 9rem 0 5rem; } }
.hero-container {
  position: relative;
  z-index: 10;
  max-width: 64rem;
  margin: 0 auto;
  padding: 0 1.25rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
}
@media (min-width: 768px) { .hero-container { padding: 0 2rem; gap: 2.5rem; } }
@media (min-width: 1024px) { .hero-container { flex-direction: row; gap: 4rem; } }
.hero-text { flex: 1; text-align: center; }
@media (min-width: 1024px) { .hero-text { text-align: left; } }
.hero h1 {
  font-family: var(--font-display);
  font-size: 1.875rem;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 1.5rem;
  color: #FAF7F2;
}
@media (min-width: 768px) { .hero h1 { font-size: 2.25rem; } }
@media (min-width: 1024px) { .hero h1 { font-size: 2.75rem; } }
.hero h1 .gold { color: #C5A55A; }
.hero-sub {
  font-size: 1rem;
  line-height: 1.75;
  margin-bottom: 2rem;
  color: #B0B8C8;
  font-family: var(--font-body);
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
}
@media (min-width: 768px) { .hero-sub { font-size: 1.125rem; } }
@media (min-width: 1024px) { .hero-sub { margin-left: 0; } }
.hero-cta { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; }
@media (min-width: 1024px) { .hero-cta { align-items: flex-start; } }
.hero-price {
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  color: #C5A55A;
  font-family: var(--font-accent);
}
@media (min-width: 768px) { .hero-price { font-size: 1rem; } }
.hero-price .strike { color: #7A8599; text-decoration: line-through; }
.hero-price .normal { color: #7A8599; font-weight: 400; }
.hero-fine { font-size: 0.75rem; letter-spacing: 0.05em; color: #7A8599; font-family: var(--font-accent); }
.hero-urgency { font-size: 0.75rem; font-weight: 600; color: #B8432F; }
.hero-book { flex-shrink: 0; }
.hero-book img {
  width: 16rem;
  filter: drop-shadow(0 20px 40px rgba(0,0,0,0.4));
}
@media (min-width: 768px) { .hero-book img { width: 18rem; } }
@media (min-width: 1024px) { .hero-book img { width: 20rem; } }

/* ===== POLAROID PHOTO ===== */
.polaroid {
  position: relative;
  padding: 12px 12px 40px;
  background-color: #f5f2eb;
}
.polaroid-dark { box-shadow: 0 10px 40px rgba(0,0,0,0.5), 0 2px 8px rgba(0,0,0,0.3); }
.polaroid-light { box-shadow: 0 10px 40px rgba(0,0,0,0.15), 0 2px 8px rgba(0,0,0,0.1); }
.polaroid-pin {
  position: absolute;
  top: -8px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 20;
}
.polaroid-pin-head {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #e74c3c, #a9322a);
  box-shadow: 0 3px 6px rgba(0,0,0,0.4), inset 0 1px 2px rgba(255,255,255,0.3);
}
.polaroid-pin-stem {
  width: 3px;
  height: 8px;
  background-color: #777;
  margin: -2px auto 0;
  border-radius: 0 0 1px 1px;
}
.polaroid-caption {
  text-align: center;
  margin-top: 0.5rem;
  font-family: 'Caveat', cursive;
  font-size: 18px;
  color: #444;
  line-height: 1.2;
}
.polaroid-wrap {
  display: none;
  position: absolute;
  z-index: 10;
}
@media (min-width: 1280px) { .polaroid-wrap { display: block; } }

/* ===== STAR BULLET ===== */
.star-list { padding-left: 1.5rem; border-left: 2px solid rgba(197,165,90,0.2); }
.star-list .body-text { margin-bottom: 1.25rem; }
.star { color: #C5A55A; }

/* ===== HOLLYWOOD / CELEBRITY SECTIONS ===== */
.celeb-row {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 1.5rem;
}
@media (min-width: 768px) { .celeb-row { flex-direction: row; gap: 2.5rem; } }
.celeb-row.reverse { }
@media (min-width: 768px) { .celeb-row.reverse { flex-direction: row-reverse; } }
@media (min-width: 768px) { .celeb-row.reverse .celeb-text { text-align: right; } }
.celeb-photo {
  width: 8rem;
  height: 8rem;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid #C5A55A;
  box-shadow: 0 8px 30px rgba(0,0,0,0.4);
  flex-shrink: 0;
}
@media (min-width: 768px) { .celeb-photo { width: 10rem; height: 10rem; } }
.celeb-name {
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 0.5rem;
}
@media (min-width: 768px) { .celeb-name { font-size: 1.5rem; } }
.celeb-desc { font-size: 1.125rem; line-height: 1.95; color: #D0D5DE; }
.celeb-highlight { color: #C5A55A; font-weight: 700; }
.celeb-screenshot {
  border-radius: 0.5rem;
  overflow: hidden;
  box-shadow: 0 8px 30px rgba(0,0,0,0.3);
  border: 1px solid rgba(197,165,90,0.2);
}
.celeb-screenshot img { width: 100%; }

/* ===== PUBLICATION SECTION ===== */
.pub-block { margin: 2.5rem 0 3.5rem; }
.pub-title {
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 700;
  color: #1A2A44;
  margin-bottom: 0.75rem;
}
@media (min-width: 768px) { .pub-title { font-size: 1.5rem; } }
.pub-text { font-size: 1.125rem; line-height: 2.0; color: #3A4A5C; margin-bottom: 1.5rem; }
.pub-highlight { color: #8B6914; font-weight: 700; }
.pub-screenshot {
  border-radius: 0.5rem;
  overflow: hidden;
  box-shadow: 0 6px 24px rgba(0,0,0,0.12);
  border: 1px solid rgba(26,42,68,0.1);
}

/* ===== INCOME GROWTH CHART ===== */
.chart-container {
  position: relative;
  border-radius: 2px;
  overflow: hidden;
  background-color: rgba(15,29,53,0.6);
  border: 1px solid rgba(197,165,90,0.2);
  padding: 2rem 1.5rem 1.5rem;
  margin-top: 3rem;
}
.chart-title {
  text-align: center;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: rgba(197,165,90,0.7);
  font-family: var(--font-body);
  margin-bottom: 2rem;
}
.chart-bars {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 1rem;
  height: 340px;
}
@media (min-width: 768px) { .chart-bars { gap: 2rem; } }
@media (min-width: 1024px) { .chart-bars { gap: 3rem; } }
.chart-bar {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  width: clamp(60px, 15%, 100px);
}
.chart-bar-multiplier {
  font-family: var(--font-display);
  font-weight: 700;
  color: #C5A55A;
}
.chart-bar-fill { width: 100%; border-radius: 2px 2px 0 0; }
.chart-bar-label { text-align: center; }
.chart-bar-label-main { font-size: 0.75rem; font-weight: 600; color: #E8DCC8; }
@media (min-width: 768px) { .chart-bar-label-main { font-size: 0.875rem; } }
.chart-bar-label-sub { font-size: 0.75rem; margin-top: 2px; color: rgba(232,220,200,0.5); }
.chart-footnote {
  text-align: center;
  font-size: 0.75rem;
  margin-top: 2rem;
  color: rgba(232,220,200,0.4);
  font-family: var(--font-body);
}

/* ===== THREE PRINCIPLES BOX ===== */
.principles-box {
  margin: 1.5rem 0;
  padding: 1.5rem;
  background-color: rgba(197,165,90,0.06);
  border-left: 3px solid #C5A55A;
}
.principles-box > div { margin-bottom: 1.5rem; }
.principles-box > div:last-child { margin-bottom: 0; }
.principle-title {
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 2.0;
  color: #C5A55A;
  margin-bottom: 0.25rem;
}
@media (min-width: 768px) { .principle-title { font-size: 1.25rem; } }

/* ===== BOOK DISPLAY / MID-CTA ===== */
.book-display {
  width: 100%;
  position: relative;
  overflow: hidden;
  background-size: cover;
  background-position: center bottom;
  background-repeat: no-repeat;
}
.book-display-overlay {
  position: absolute;
  inset: 0;
  background: radial-gradient(transparent 40%, rgba(0,0,0,0.15) 100%);
  pointer-events: none;
}
.book-display-fade {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2rem;
  background: linear-gradient(transparent, #0A1628);
  pointer-events: none;
}
.book-display-content {
  position: relative;
  z-index: 10;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0.75rem 0;
}
@media (min-width: 768px) { .book-display-content { padding: 1rem 0; } }
@media (min-width: 1024px) { .book-display-content { padding: 1.25rem 0; } }
.book-display-content img {
  width: 200px;
  position: relative;
  z-index: 10;
  filter: drop-shadow(8px 6px 12px rgba(0,0,0,0.6)) drop-shadow(-6px 6px 10px rgba(0,0,0,0.4)) drop-shadow(0 10px 15px rgba(0,0,0,0.5)) drop-shadow(0 2px 3px rgba(0,0,0,0.3));
  margin-bottom: -2px;
}
@media (min-width: 768px) { .book-display-content img { width: 260px; } }
@media (min-width: 1024px) { .book-display-content img { width: 320px; } }

/* ===== MID-CTA PRICING ===== */
.mid-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0.75rem 0 1rem;
}
@media (min-width: 768px) { .mid-cta { padding: 1rem 0; } }
.mid-cta-price {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  color: #C5A55A;
  font-family: var(--font-accent);
  margin-bottom: 0.5rem;
}
@media (min-width: 768px) { .mid-cta-price { font-size: 0.875rem; } }
.mid-cta-price .strike { color: #8A93A6; text-decoration: line-through; }
.mid-cta-price .normal { color: #8A93A6; font-weight: 400; }
.mid-cta-fine { font-size: 0.75rem; color: #8A93A6; margin-top: 0.75rem; }
.mid-cta-urgency { font-size: 0.75rem; font-weight: 600; color: #B8432F; margin-top: 0.25rem; }

/* ===== DIAMOND DIVIDER ===== */
.diamond-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.25rem 0;
  background-color: #0A1628;
}
@media (min-width: 768px) { .diamond-divider { padding: 0.5rem 0; } }
.diamond-line { height: 1px; width: 4rem; background-color: rgba(197,165,90,0.2); }
.diamond-shape {
  width: 0.5rem;
  height: 0.5rem;
  background-color: #C5A55A;
  transform: rotate(45deg);
  margin: 0 1rem;
  opacity: 0.4;
}

/* ===== TESTIMONIALS ===== */
.testimonial {
  margin: 2.5rem 0;
  padding: 2rem 1.5rem;
  border-left: 3px solid #C5A55A;
  background-color: rgba(197,165,90,0.05);
  overflow: hidden;
}
@media (min-width: 768px) { .testimonial { padding: 2rem; } }
.testimonial-photo {
  float: right;
  margin-left: 1.5rem;
  margin-bottom: 1rem;
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #C5A55A;
}
@media (min-width: 768px) { .testimonial-photo { width: 6rem; height: 6rem; } }
.testimonial-quote {
  font-size: 1.125rem;
  line-height: 2.0;
  font-style: italic;
  color: #D0D5DE;
  font-family: var(--font-body);
  margin-bottom: 1rem;
}
@media (min-width: 768px) { .testimonial-quote { font-size: 1.25rem; } }
.testimonial-name {
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #C5A55A;
  font-family: var(--font-accent);
}
.testimonial-title {
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8A8F98;
  font-family: var(--font-accent);
  margin-top: 0.25rem;
}

/* ===== OFFER STACK ===== */
.offer-card {
  margin-bottom: 1.5rem;
  padding: 1.25rem 1.5rem;
  background-color: #fff;
  border: 1px solid rgba(197,165,90,0.133);
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.offer-card-inner {
  display: flex;
  align-items: flex-start;
  gap: 1.5rem;
}
.offer-card-text { flex: 1; }
.offer-card h3 {
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 700;
  color: #2D3142;
  margin-bottom: 0.5rem;
}
@media (min-width: 768px) { .offer-card h3 { font-size: 1.125rem; } }
.offer-card p { font-size: 1rem; line-height: 1.75; color: #4A5568; }
.offer-card-media {
  display: none;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
}
@media (min-width: 640px) { .offer-card-media { display: flex; } }
.offer-value {
  font-size: 0.875rem;
  font-weight: 600;
  color: #C5A55A;
  font-family: var(--font-accent);
  margin-bottom: 0.5rem;
  white-space: nowrap;
}
.offer-card-media img {
  width: 5rem;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,0.15));
}
@media (min-width: 768px) { .offer-card-media img { width: 6rem; } }
.format-icons { display: flex; align-items: center; gap: 0.75rem; }
.format-icons img { width: 2rem; height: 2rem; border-radius: 0.375rem; object-fit: contain; }

/* ===== OFFER TOTAL ===== */
.offer-total-strike {
  font-size: 1rem;
  text-decoration: line-through;
  color: #4A5568;
  font-family: var(--font-accent);
  margin-bottom: 0.25rem;
}
.offer-total-price {
  font-family: var(--font-display);
  font-size: 1.5rem;
  font-weight: 700;
  color: #2D3142;
  white-space: nowrap;
}
@media (min-width: 768px) { .offer-total-price { font-size: 2.25rem; } }
.offer-total-price .strike { font-size: 1.125rem; color: #999; text-decoration: line-through; text-decoration-color: #C5A55A; }
@media (min-width: 768px) { .offer-total-price .strike { font-size: 1.5rem; } }
.offer-total-price .gold { color: #C5A55A; }

/* ===== COMPARISON TABLE ===== */
.comparison-table { font-family: var(--font-body); }
.comparison-table thead tr { border-bottom: 2px solid #C5A55A; }
.comparison-table th {
  padding: 1rem 1rem 1rem 0;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-family: var(--font-accent);
  font-weight: 600;
}
.comparison-table th:first-child { color: #4A5568; padding-right: 1rem; }
.comparison-table th:last-child { color: #C5A55A; padding-left: 1rem; }
.comparison-table td {
  padding: 1rem 0;
  font-size: 1rem;
  line-height: 1.75;
  border-bottom: 1px solid rgba(197,165,90,0.133);
}
.comparison-table td:first-child { color: #4A5568; padding-right: 1rem; }
.comparison-table td:last-child { color: #2D3142; font-weight: 500; padding-left: 1rem; }

/* ===== GUARANTEE ===== */
.guarantee-section {
  padding: 3.5rem 0;
  background-color: #F5EDDA;
  border-top: 3px solid #C5A55A;
  border-bottom: 3px solid #C5A55A;
}
@media (min-width: 768px) { .guarantee-section { padding: 5rem 0; } }
.guarantee-section h2 {
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.35;
  color: #2D3142;
  margin-bottom: 1rem;
}
@media (min-width: 768px) { .guarantee-section h2 { font-size: 1.5rem; } }
@media (min-width: 1024px) { .guarantee-section h2 { font-size: 1.875rem; } }

/* ===== BOOK CHAPTERS ===== */
.chapter-item {
  margin-bottom: 2rem;
  padding-left: 1.5rem;
  border-left: 2px solid rgba(197,165,90,0.2);
}
.chapter-title { color: #C5A55A; font-weight: 700; }
.chapter-page {
  font-size: 0.875rem;
  font-style: italic;
  color: #7A8599;
  font-family: var(--font-accent);
}

/* ===== ABOUT SECTION ===== */
.about-section { background-color: #0B1120; }
.about-photo-grid {
  display: none;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.75rem;
  margin-bottom: 3rem;
}
@media (min-width: 768px) { .about-photo-grid { display: grid; } }
.about-photo-grid img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  border-radius: 0.5rem;
  border: 1px solid rgba(197,165,90,0.3);
}
.about-mobile-photo { display: block; margin-bottom: 2rem; }
@media (min-width: 768px) { .about-mobile-photo { display: none; } }
.about-mobile-photo img {
  width: 100%;
  border-radius: 0.25rem;
  object-fit: cover;
  max-height: 280px;
  border: 2px solid #C5A55A;
}
.about-bio { max-width: 48rem; margin: 0 auto; }
.about-bio p { font-size: 1.125rem; line-height: 2.0; color: #D1D5DB; margin-bottom: 1.25rem; }
.about-gold-line { width: 4rem; height: 2px; background-color: #C5A55A; margin: 0 auto 2rem; }

/* ===== FOOTER ===== */
.site-footer {
  padding: 2rem 0;
  background-color: #070D1A;
  text-align: center;
}
.footer-help {
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #4A5568;
  font-family: var(--font-accent);
  margin-bottom: 0.75rem;
}
.footer-help a { color: #C5A55A; }
.footer-copy {
  font-size: 0.75rem;
  color: #4A5568;
  font-family: var(--font-accent);
  margin-bottom: 1rem;
}
.footer-disclaimer {
  font-size: 10px;
  line-height: 1.75;
  color: #3A4050;
  max-width: 42rem;
  margin: 0 auto 1rem;
}

/* ===== PHOTO GRIDS ===== */
.photo-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
  max-width: 42rem;
  margin: 0 auto;
}
@media (min-width: 768px) { .photo-grid-3 { gap: 1rem; } }
.photo-grid-3 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 3/4;
  border-radius: 0.25rem;
  border: 2px solid #C5A55A;
}
.photo-caption {
  font-size: 0.875rem;
  text-align: center;
  margin-top: 0.75rem;
  font-style: italic;
  color: #6B7280;
}

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

/* ===== HIGHLIGHT ===== */
.highlight-green {
  background-color: #90EE90;
  padding: 2px 8px;
  display: inline;
  font-weight: 700;
  font-style: normal;
}

/* ===== PARENT PHOTO ===== */
.parent-photo {
  position: relative;
  display: inline-block;
}
.parent-photo img {
  border-radius: 2px;
  filter: drop-shadow(0 8px 24px rgba(0,0,0,0.4));
}
.parent-photo-overlay {
  position: absolute;
  inset: 0;
  border-radius: 2px;
  box-shadow: inset 0 0 0 1px rgba(197,165,90,0.15);
  pointer-events: none;
}

/* ===== BULLET BOX ===== */
.bullet-box {
  margin: 2.5rem 0;
  padding: 1.5rem;
  background-color: rgba(197,165,90,0.06);
  border-left: 3px solid #C5A55A;
}
.bullet-box .body-text { margin-bottom: 0.75rem; }
.bullet-box .body-text:last-child { margin-bottom: 0; }

/* ===== SEPIA PHOTO ===== */
.sepia-photo {
  width: 100%;
  border-radius: 2px;
  filter: sepia(0.15) contrast(1.05);
  border: 1px solid rgba(197,165,90,0.2);
}

/* ===== OVERFLOW TABLE ===== */
.table-wrap { overflow-x: auto; margin: 2.5rem 0; }

/* ===== CTA SECTION CENTERED ===== */
.cta-centered { text-align: center; }
.cta-centered .mid-cta-fine { font-size: 0.75rem; color: #4A5568; margin-top: 1rem; }
.cta-centered .italic-note { font-size: 0.75rem; font-style: italic; color: #8B7355; margin-top: 0.25rem; }


/* ============================================================
   UTILITY CLASSES (migrated from inline styles)
   ============================================================ */

/* ===== BACKGROUND UTILITIES ===== */
.bg-navy { background-color: #0A1628; }
.bg-navy-dark { background-color: #0F1D35; }
.bg-darkest { background-color: #0B1120; }
.bg-footer { background-color: #070D1A; }
.bg-cream { background-color: #FAF7F2; }
.bg-warm-cream { background-color: #F5F0E8; }
.bg-gold { background-color: #C5A55A; }
.bg-gold-faint { background-color: rgba(197,165,90,0.2); }

/* ===== TEXT COLOR UTILITIES ===== */
.text-gold { color: #C5A55A; }
.text-gold-dark { color: #8B6914; }
.text-gold-muted { color: rgba(197,165,90,0.7); }
.text-light { color: #D0D5DE; }
.text-light-secondary { color: #B0B8C8; }
.text-light-alt { color: #D1D5DB; }
.text-dark { color: #2D3142; }
.text-dark-muted { color: #3A4050; }
.text-navy-heading { color: #1A2A44; }
.text-white { color: #fff; }
.text-cream { color: #FAF7F2; }
.text-red { color: #B8432F; }
.text-secondary { color: #4A5568; }
.text-slate { color: #3A4A5C; }
.text-gray { color: #6B7280; }
.text-gray-strike { color: #999; }
.text-gray-dark { color: #666; }
.text-muted { color: #7A8599; }
.text-muted-gray { color: #8A8F98; }
.text-muted-blue { color: #8A93A6; }
.text-warm { color: #E8DCC8; }
.text-warm-half { color: rgba(232,220,200,0.5); }
.text-warm-faint { color: rgba(232,220,200,0.4); }
.text-brown { color: #8B7355; }
.text-underline { text-decoration: underline; }

/* ===== FONT-WEIGHT UTILITIES ===== */
.fw-bold { font-weight: 700; }
.fw-600 { font-weight: 600; }
.fw-500 { font-weight: 500; }
.fw-normal { font-weight: 400; }

/* ===== TEXT DECORATION ===== */
.line-through { text-decoration: line-through; }
.line-through-gold { text-decoration: line-through #C5A55A; }

/* ===== BORDER UTILITIES ===== */
.border-gold { border: 2px solid #C5A55A; }
.border-gold-light { border: 1px solid rgba(197,165,90,0.3); }
.border-l-gold-faint { border-left: 2px solid rgba(197,165,90,0.2); }
.border-b-gold { border-bottom: 2px solid #C5A55A; }
.border-b-gold-faint { border-bottom: 1px solid rgba(197,165,90,0.133); }

/* ===== OBJECT POSITION / MAX-HEIGHT ===== */
.obj-pos-15 { object-position: center 15%; }
.obj-pos-20 { object-position: center 20%; }
.obj-pos-30 { object-position: center 30%; }
.obj-pos-center { object-position: center center; }
.obj-pos-top { object-position: center top; }
.max-h-190 { max-height: 190px; }
.max-h-280 { max-height: 280px; }
.max-h-300 { max-height: 300px; }
.max-h-340 { max-height: 340px; }
.h-220 { height: 220px; }
.aspect-3-4 { aspect-ratio: 3/4; }
.z-10 { z-index: 10; }

/* ===== COUPON TAG VARIANTS ===== */
.coupon-dark { color: #2D3142; }
.coupon-lg { padding: 3px 10px; letter-spacing: 0.08em; font-size: 1.05em; }

/* ===== CALLOUT BOX VARIANTS ===== */
.callout-gold { color: #C5A55A; background-color: rgba(197,165,90,0.08); }
.callout-navy { color: #1A2A44; background-color: rgba(197,165,90,0.1); }
.callout-cream { color: #2D3142; background-color: #F0EBE3; }

/* ===== TESTIMONIAL STYLE (inline variant) ===== */
.testimonial-style {
  border-left: 3px solid #C5A55A;
  background-color: rgba(197,165,90,0.05);
}

/* ===== CELEBRITY PHOTO (inline variant) ===== */
.celeb-photo-style {
  border: 3px solid #C5A55A;
  box-shadow: 0 8px 30px rgba(0,0,0,0.4);
}

/* ===== SCREENSHOTS ===== */
.screenshot-light {
  box-shadow: 0 6px 24px rgba(0,0,0,0.12);
  border: 1px solid rgba(26,42,68,0.1);
}
.screenshot-dark {
  box-shadow: 0 8px 30px rgba(0,0,0,0.3);
  border: 1px solid rgba(197,165,90,0.2);
}

/* ===== SHADOW / FILTER UTILITIES ===== */
.shadow-hero-book { filter: drop-shadow(0 20px 40px rgba(0,0,0,0.4)); }
.shadow-photo { filter: drop-shadow(0 8px 24px rgba(0,0,0,0.4)); }
.shadow-card-img { filter: drop-shadow(0 2px 8px rgba(0,0,0,0.15)); }
.shadow-book-display {
  filter: drop-shadow(8px 6px 12px rgba(0,0,0,0.6))
         drop-shadow(-6px 6px 10px rgba(0,0,0,0.4))
         drop-shadow(0 10px 15px rgba(0,0,0,0.5))
         drop-shadow(0 2px 3px rgba(0,0,0,0.3));
  margin-bottom: -2px;
}
.shadow-book-mid {
  filter: drop-shadow(8px 6px 12px rgba(0,0,0,0.6))
         drop-shadow(-6px 6px 10px rgba(0,0,0,0.4))
         drop-shadow(0 10px 15px rgba(0,0,0,0.5));
}

/* ===== POLAROID WRAP UTILITIES ===== */
.pw { z-index: 10; }
.pw-rotate-n2 { width: 280px; transform: rotate(-2.5deg); }
.pw-rotate-n3 { width: 280px; transform: rotate(-3deg); }
.pw-rotate-p2 { width: 320px; transform: rotate(2deg); }
.pw-rotate-p3 { width: 320px; transform: rotate(3deg); }
.pw-w300 { width: 300px; }
.pw-w320 { width: 320px; }
.pw-offset-right { width: 270px; transform: rotate(-2deg); margin-left: 40px; }
.pw-offset-left { width: 270px; transform: rotate(3deg); margin-top: -20px; margin-left: -20px; }
.polaroid-caption-sm { font-size: 17px; }

/* ===== CHART FILLS ===== */
.chart-fill { width: 100%; border-radius: 2px 2px 0 0; }
.chart-fill-1 { height: 200px; background: linear-gradient(#E8C252 0%,#D4AF61 20%,#C5A55A 50%,#8B7340 100%); box-shadow: 0 0 35px rgba(197,165,90,0.35); }
.chart-fill-2 { height: 90px; background: linear-gradient(#D4AF61 0%,#C5A55A 40%,#8B7340 100%); box-shadow: 0 0 25px rgba(197,165,90,0.25); }
.chart-fill-3 { height: 48px; background: linear-gradient(#C5A55A 0%,#8B7340 100%); box-shadow: 0 0 20px rgba(197,165,90,0.2); }
.chart-fill-4 { height: 24px; background: linear-gradient(#C5A55A 0%,#8B7340 100%); box-shadow: 0 0 20px rgba(197,165,90,0.15); }
.chart-bars-height { height: 340px; }
.chart-bar-width { width: clamp(60px, 15%, 100px); }

/* ===== RESPONSIVE & MOBILE ENHANCEMENTS ===== */
@media (max-width: 639px) {
  .cta-button { display: block; width: 100%; padding: 1.125rem 1.5rem; font-size: 0.9375rem; }
  .chart-bars { height: 240px; gap: 0.5rem; }
  .chart-fill-1 { height: 140px; }
  .chart-fill-2 { height: 64px; }
  .chart-fill-3 { height: 34px; }
  .chart-fill-4 { height: 17px; }
  .chart-container { padding: 1.5rem 1rem 1rem; }
  .celeb-row { gap: 1rem; }
  .offer-card { padding: 1rem 1.25rem; }
  .callout-box { padding: 1.25rem 0.75rem; font-size: 1.1rem; }
  .testimonial { padding: 1.5rem 1.25rem; }
  .principles-box { padding: 1.25rem; }
  .bullet-box { padding: 1.25rem; }
  .photo-grid-3 { gap: 0.5rem; }
  .about-photo-grid img { height: 160px; }
  .comparison-table th, .comparison-table td { font-size: 0.875rem; padding: 0.75rem 0.5rem; }
}
@media (min-width: 640px) and (max-width: 1023px) {
  .reading-column { padding-left: 2.5rem; padding-right: 2.5rem; }
}
@media (min-width: 1440px) {
  .reading-column { max-width: 860px; }
}

/* ===== HERO BACKGROUND ===== */
.hero-bg {
  background-color: #0A1628;
  background-image: url("https://private-us-east-1.manuscdn.com/sessionFile/H8AfQLuBlqc8IgBrYtSr8c/sandbox/xQ3EC2ikiTu0i07LJHSiiX-img-2_1770722713000_na1fn_aGVyby10ZXh0dXJl.png?x-oss-process=image/resize,w_1920,h_1920/format,webp/quality,q_80&Expires=1798761600&Policy=eyJTdGF0ZW1lbnQiOlt7IlJlc291cmNlIjoiaHR0cHM6Ly9wcml2YXRlLXVzLWVhc3QtMS5tYW51c2Nkbi5jb20vc2Vzc2lvbkZpbGUvSDhBZlFMdUJscWM4SWdCcll0U3I4Yy9zYW5kYm94L3hRM0VDMmlraVR1MGkwN0xKSFNpaVgtaW1nLTJfMTc3MDcyMjcxMzAwMF9uYTFmbl9hR1Z5YnkxMFpYaDBkWEpsLnBuZz94LW9zcy1wcm9jZXNzPWltYWdlL3Jlc2l6ZSx3XzE5MjAsaF8xOTIwL2Zvcm1hdCx3ZWJwL3F1YWxpdHkscV84MCIsIkNvbmRpdGlvbiI6eyJEYXRlTGVzc1RoYW4iOnsiQVdTOkVwb2NoVGltZSI6MTc5ODc2MTYwMH19fV19&Key-Pair-Id=K2HSFNDJXOU9YS&Signature=T3yP~KtEeP2gXaurR3tXJF9W9ESfrDrDbZhEyOaYBc4Sqw17NpMNTCteHvpRhf9VHqOeG1qa7XGjVn~Haq5YnfdPl7okbdh~rlGcn-fNArE-TNdJhIfzuPQDszUAGSXuVUVrID3ojt83O7cSqc58Tobgtp8m4lQFNm2Jud2sxkxFnQytLBZO7DSXE2jFyRGBQoeAMDev3UCXsurtZai07mWjuvbJ3jcDi18nJqfnbwNtf5MzKyaRw1sx8YGS8GGwrivI2QnWCCD3j0Qob8zOmKGW4EQXKEPJgbzC6p4PsrUh-vK~63p0VVa0mHX2WQyn0oKTg7EWx77O1azLiuiwlA__");
  background-size: cover;
  background-position: center center;
}

/* ===== BOOK DISPLAY BACKGROUND ===== */
.book-bg {
  background-image: url("https://private-us-east-1.manuscdn.com/sessionFile/H8AfQLuBlqc8IgBrYtSr8c/sandbox/hidVyDSQn4VOpgiCsx3BWg-img-1_1770732384000_na1fn_Ym9vay1zY2VuZS1iZw.png?x-oss-process=image/resize,w_1920,h_1920/format,webp/quality,q_80&Expires=1798761600&Policy=eyJTdGF0ZW1lbnQiOlt7IlJlc291cmNlIjoiaHR0cHM6Ly9wcml2YXRlLXVzLWVhc3QtMS5tYW51c2Nkbi5jb20vc2Vzc2lvbkZpbGUvSDhBZlFMdUJscWM4SWdCcll0U3I4Yy9zYW5kYm94L2hpZFZ5RFNRbjRWT3BnaUNzeDNCV2ctaW1nLTFfMTc3MDczMjM4NDAwMF9uYTFmbl9ZbTl2YXkxelkyVnVaUzFpWncucG5nP3gtb3NzLXByb2Nlc3M9aW1hZ2UvcmVzaXplLHdfMTkyMCxoXzE5MjAvZm9ybWF0LHdlYnAvcXVhbGl0eSxxXzgwIiwiQ29uZGl0aW9uIjp7IkRhdGVMZXNzVGhhbiI6eyJBV1M6RXBvY2hUaW1lIjoxNzk4NzYxNjAwfX19XX0_&Key-Pair-Id=K2HSFNDJXOU9YS&Signature=KVsKGgZ8aorBg2NHm9FcBMWQAJc-AWBWUEifBIRs8xoQKcLGsFcvJ33~AkQGB1gcYWZ6038xP7ntRTTIYvb1oQl72ZzsBOlSbqsRNbHnk~8I9duZ705XblJSoZ~or-idrXantK1yNGuOUgDO5pcRsyDrWZYjHp1ror2hr1c70x8UgndxyFcCqHa94r7y9D-zqJG7zgEgwKA~tGjdWg1shzy2vNVJX9ZUoEkw3E~t6B~~qHrmLBGdk9ie3Y0Lf5LDaGCrx-NiLFGTyng~p5PEcBSO6~h~pLIloBL875ATEkiyHwuh1SvvpApzpjkbxn91vZcZHhh8XJNzspNUr-Y3VQ__");
  background-size: cover;
  background-position: center bottom;
  background-repeat: no-repeat;
}
.hero-bg .hero-headline {
  line-height: 1.1 !important;
}
.reveal.visible h2,
.reveal h2 {
  max-inline-size: 38rem;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center;
  display: block;
}

