/* =====================================================================
   ENGLISH MOMENTUM LANDING PAGE
   "Rising Momentum" identity — navy/teal/violet/gold, matching the
   book's own cover and the 1st Bac interactive lesson engine, so the
   whole 1st Bac product family feels connected. This file intentionally
   duplicates the other landing pages' structure rather than sharing
   it, so no other live page is ever put at risk by changes made here.
   ===================================================================== */

.mtem-page{
  --em-cream:      #F6F4EC;
  --em-cream-deep: #EDE8D8;
  --em-navy:       #213A47;
  --em-navy-deep:  #152A34;
  --em-teal:       #1B8A8A;
  --em-teal-deep:  #146E6E;
  --em-violet:     #7A5A96;
  --em-violet-tint:#EFEAF4;
  --em-gold:       #E0A93F;
  --em-gold-deep:  #C8902A;
  --em-ink-soft:   #52646D;
  --em-radius:     18px;
  --em-shadow:     0 14px 34px rgba(33,58,71,.16);

  background:var(--em-cream);
  color:var(--em-navy);
  font-family:'Nunito',sans-serif;
  overflow-x:hidden;
}

.mtem-page h1,
.mtem-page h2,
.mtem-page h3{
  font-family:'Poppins',sans-serif;
  font-weight:800;
  color:var(--em-navy);
  line-height:1.18;
  margin:0;
}

.mtem-wrap{ max-width:1140px; margin:0 auto; padding:0 24px; }
.mtem-eyebrow{
  display:inline-block; font-family:'Poppins',sans-serif; font-weight:800;
  font-size:.76rem; letter-spacing:1.6px; text-transform:uppercase;
  color:var(--em-gold-deep); margin-bottom:12px;
}

/* ---------------- HERO ---------------- */
/* Mobile-safe: a fixed-height hero with background-position centered,
   so whichever edges get cropped on a narrow screen, the illustration
   (which was deliberately composed centered) survives intact. */
.mtem-hero{
  min-height:560px; display:flex; align-items:center; justify-content:center;
  background-image:url('../img/momentum/hero.jpg');
  background-size:cover; background-position:center center; background-repeat:no-repeat;
  position:relative; padding:60px 0;
}
.mtem-hero::before{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(21,42,52,.35) 0%, rgba(21,42,52,.72) 100%);
}
.mtem-hero-inner{ position:relative; z-index:1; text-align:center; max-width:680px; margin:0 auto; }
.mtem-hero h1{ font-size:clamp(2.2rem,5vw,3.2rem); color:#fff; margin-bottom:14px; }
.mtem-hero h1 span{ color:var(--em-gold); }
.mtem-hero-lead{
  font-size:1.08rem; color:rgba(255,255,255,.88); font-weight:600;
  max-width:52ch; margin:0 auto 28px; line-height:1.65;
}
.mtem-hero-cta{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-bottom:16px; }
.mtem-hero-note{ font-size:.86rem; color:rgba(255,255,255,.75); font-weight:700; }

.mtem-btn{
  display:inline-block; font-family:'Poppins',sans-serif; font-weight:800;
  padding:15px 30px; border-radius:999px; text-decoration:none !important;
  transition:transform .18s, box-shadow .18s;
}
.mtem-btn-primary{ background:var(--em-gold); color:var(--em-navy-deep) !important; box-shadow:var(--em-shadow); }
.mtem-btn-primary:hover{ transform:translateY(-2px); background:var(--em-gold-deep); color:#fff !important; }
.mtem-btn-ghost{
  background:rgba(255,255,255,.1); color:#fff !important;
  border:2px solid #fff;
}
.mtem-btn-ghost:hover{ background:rgba(255,255,255,.2); }

/* ---------------- STAT STRIP (Cinematic Hero signature) ---------------- */
.mtem-stats{ background:var(--em-navy-deep); padding:34px 0; }
.mtem-stats-row{
  display:flex; justify-content:center; gap:60px; flex-wrap:wrap; text-align:center;
}
.mtem-stat-num{
  font-family:'Poppins',sans-serif; font-weight:800; font-size:2.6rem;
  color:var(--em-gold); line-height:1;
}
.mtem-stat-label{
  font-size:.86rem; color:rgba(255,255,255,.8); font-weight:700;
  text-transform:uppercase; letter-spacing:1px; margin-top:6px;
}

/* ---------------- TRUST STRIP ---------------- */
.mtem-trust{ background:var(--em-navy); padding:16px 0; }
.mtem-trust-row{
  display:flex; justify-content:center; gap:38px; flex-wrap:wrap;
  color:#fff; font-weight:700; font-size:.9rem;
}

/* ---------------- BOOK SECTIONS ---------------- */
.mtem-book{ padding:70px 0; }
.mtem-book-alt{ background:var(--em-violet-tint); }
.mtem-book-head{ text-align:center; max-width:640px; margin:0 auto 40px; }
.mtem-book-head h2{ font-size:clamp(1.7rem,3.2vw,2.3rem); margin:8px 0 12px; }
.mtem-book-head p{ color:var(--em-ink-soft); font-weight:600; font-size:1.02rem; }

.mtem-collage{
  display:flex; justify-content:center; align-items:flex-end;
  padding:20px 10px 34px; margin-bottom:14px;
}

/* Protected preview: CSS background-image on a plain div (no real
   <img>), watermark overlay, and a bottom fade so no single shot is
   ever a complete, print-ready page. */
.mtem-shot-wrap{
  position:relative; overflow:hidden; border-radius:14px; aspect-ratio:933/1400;
  box-shadow:var(--em-shadow); border:4px solid #fff; display:block;
  background-color:#fff; background-repeat:no-repeat; background-position:center;
  background-size:cover; width:190px; flex-shrink:0;
  -webkit-user-select:none; user-select:none;
}
.mtem-shot-wrap::after{
  content:""; position:absolute; inset:-25%;
  background-image:url('../img/logo.png'); background-repeat:repeat;
  background-size:56px 56px; opacity:.16; transform:rotate(-28deg);
  pointer-events:none; filter:brightness(0);
}
.mtem-shot-wrap::before{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,0) 55%, rgba(255,255,255,.94) 92%);
}
.mtem-collage .mtem-shot-wrap:nth-child(1){ transform:rotate(-6deg); margin-right:-32px; z-index:1; }
.mtem-collage .mtem-shot-wrap:nth-child(2){ transform:rotate(2deg) translateY(-12px); z-index:3; }
.mtem-collage .mtem-shot-wrap:nth-child(3){ transform:rotate(8deg); margin-left:-32px; z-index:2; }

.mtem-feature-list{
  display:grid; grid-template-columns:1fr 1fr; gap:26px 40px; margin-top:10px;
}
.mtem-feature{ display:flex; gap:16px; align-items:flex-start; }
.mtem-feature-ic{
  flex-shrink:0; width:46px; height:46px; border-radius:50%;
  background:#fff; box-shadow:0 4px 10px rgba(33,58,71,.1);
  display:flex; align-items:center; justify-content:center; font-size:1.3rem;
}
.mtem-feature h3{ font-size:1.06rem; margin-bottom:4px; color:var(--em-teal-deep); }
.mtem-feature p{ color:var(--em-ink-soft); font-weight:600; font-size:.92rem; margin:0; line-height:1.55; }

/* ---------------- ORDER / PRICING ---------------- */
.mtem-order{ padding:70px 0 90px; }
.mtem-price-cards{
  display:grid; grid-template-columns:1fr 1fr; gap:24px;
  max-width:760px; margin:0 auto 46px;
}
.mtem-price-cards-3{ grid-template-columns:1fr 1fr 1fr; max-width:980px; }
.mtem-price-card{
  background:#fff; border-radius:var(--em-radius); padding:30px 26px;
  box-shadow:var(--em-shadow); text-align:center; position:relative;
  border:2px solid var(--em-cream-deep);
}
.mtem-price-featured{ border-color:var(--em-gold); transform:translateY(-6px); }
.mtem-price-badge{
  position:absolute; top:-14px; left:50%; transform:translateX(-50%);
  background:var(--em-gold); color:var(--em-navy-deep); font-weight:800; font-size:.72rem;
  letter-spacing:1px; text-transform:uppercase; padding:6px 16px; border-radius:999px;
}
.mtem-price-card h3{ font-size:1.28rem; margin-bottom:10px; }
.mtem-price-card p{ color:var(--em-ink-soft); font-weight:600; font-size:.92rem; min-height:66px; }
.mtem-price{
  font-family:'Poppins',sans-serif; font-weight:800; font-size:2.15rem;
  color:var(--em-teal-deep); margin:14px 0 6px;
}
.mtem-price span{ font-size:1rem; font-family:'Nunito',sans-serif; font-weight:700; color:var(--em-ink-soft); }
.mtem-price-note{ font-size:.8rem !important; min-height:0 !important; }

.mtem-order-form-wrap{
  max-width:560px; margin:0 auto; background:#fff; border-radius:var(--em-radius);
  padding:34px; box-shadow:var(--em-shadow);
}

/* ---------------- RESPONSIVE ---------------- */
@media (max-width:900px){
  .mtem-feature-list{ grid-template-columns:1fr; }
  .mtem-price-cards{ grid-template-columns:1fr; }
  .mtem-price-featured{ transform:none; }
  .mtem-stats-row{ gap:34px; }
}
@media (max-width:560px){
  .mtem-hero{ min-height:440px; padding:50px 0; }
  .mtem-hero-cta{ justify-content:center; }
  .mtem-trust-row{ flex-direction:column; align-items:center; gap:10px; }
  .mtem-order-form-wrap{ padding:24px 18px; }
  .mtem-collage{ flex-wrap:wrap; }
  .mtem-collage .mtem-shot-wrap{ width:140px; }
  .mtem-collage .mtem-shot-wrap:nth-child(1){ margin-right:-22px; }
  .mtem-collage .mtem-shot-wrap:nth-child(3){ margin-left:-22px; }
  .mtem-stat-num{ font-size:2rem; }
  .mtem-stats-row{ gap:26px; }
}

@media (prefers-reduced-motion:reduce){
  .mtem-page .mtem-btn{ transition:none; }
}

/* ---------------- CONFIRMATION-ONLY VIEW ---------------- */
.mtem-confirm-page{ min-height:60vh; display:flex; align-items:center; }
.mtem-order-confirm-only{ width:100%; padding:60px 0; }
.mtem-back-link{ text-align:center; margin-top:22px; }
.mtem-back-link a{ color:var(--em-ink-soft); font-weight:700; text-decoration:underline; }
.mtem-back-link a:hover{ color:var(--em-teal-deep); }