/* =====================================================================
   TEACHER BUNDLE LANDING PAGE
   A warm, editorial palette that matches the products themselves —
   distinct from the cooler navy/green teaching pages, but still ties
   back to the MyTeacher brand through the CTA buttons and trust strip.
   ===================================================================== */

.mt-bundle-page{
  --pb-cream:      #FBF5EA;
  --pb-cream-deep: #F3E9D8;
  --pb-terracotta: #B84A2A;
  --pb-terracotta-deep: #9C3D22;
  --pb-terracotta-tint: #F3DED3;
  --pb-sage:       #6F8259;
  --pb-sage-tint:  #E7EDE0;
  --pb-gold:       #B8892B;
  --pb-ink:        #3C2F22;
  --pb-ink-soft:   #6B5C4A;
  --pb-navy:       #213A47;
  --pb-green:      #0E9A6E;
  --pb-green-deep: #0A7A56;
  --pb-radius:     20px;
  --pb-shadow:     0 14px 34px rgba(60,47,34,.14);

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

.mt-bundle-page h1,
.mt-bundle-page h2,
.mt-bundle-page h3{
  font-family:'Playfair Display',serif;
  font-weight:800;
  color:var(--pb-terracotta-deep);
  line-height:1.15;
  margin:0;
}
.mt-bundle-page em{ font-style:italic; color:var(--pb-sage); }

.mtb-wrap{ max-width:1140px; margin:0 auto; padding:0 24px; }
.mtb-eyebrow{
  display:inline-block; font-family:'Nunito',sans-serif; font-weight:800;
  font-size:.78rem; letter-spacing:2px; text-transform:uppercase;
  color:var(--pb-gold); margin-bottom:14px;
}

/* ---------------- HERO ---------------- */
.mtb-hero-grid{
  display:grid; grid-template-columns:1.1fr .9fr; gap:50px; align-items:center;
}
.mtb-hero-copy h1{ font-size:clamp(2rem,3.6vw,2.85rem); line-height:1.22; margin-bottom:20px; }
.mtb-hero-lead{
  font-size:1.12rem; color:var(--pb-ink-soft); font-weight:600;
  max-width:46ch; margin-bottom:28px; line-height:1.6;
}
.mtb-hero-cta{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:18px; }
.mtb-hero-note{ font-size:.86rem; color:var(--pb-ink-soft); font-weight:700; }

.mtb-btn{
  display:inline-block; font-family:'Nunito',sans-serif; font-weight:800;
  padding:15px 30px; border-radius:999px; text-decoration:none !important;
  transition:transform .18s, box-shadow .18s;
}
.mtb-btn-primary{ background:var(--pb-navy); color:#fff !important; box-shadow:var(--pb-shadow); }
.mtb-btn-primary:hover{ transform:translateY(-2px); background:var(--pb-green-deep); }
.mtb-btn-ghost{
  background:transparent; color:var(--pb-terracotta-deep) !important;
  border:2px solid var(--pb-terracotta-deep);
}
.mtb-btn-ghost:hover{ background:var(--pb-terracotta-tint); }

.mtb-hero{ padding:64px 0 40px; overflow:hidden; }
.mtb-hero-art{ position:relative; height:500px; overflow:hidden; }
.mtb-cover{
  position:absolute !important; width:40% !important; border-radius:14px;
  box-shadow:0 24px 50px rgba(60,47,34,.28); border:6px solid #fff;
  overflow:hidden; aspect-ratio:933/1400;
}
.mtb-cover-1{ top:0; left:8%; transform:rotate(-6deg); z-index:1; }
.mtb-cover-2{ top:22%; right:6%; transform:rotate(5deg); z-index:2; }

.mtb-shot-wrap.mtb-cover::before,
.mtb-shot-wrap.mtb-bonus-cover::before{ content:none; }

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

/* ---------------- BOOK SECTIONS ---------------- */
.mtb-book{ padding:70px 0; }
.mtb-book-alt{ background:var(--pb-sage-tint); }
.mtb-book-head{ text-align:center; max-width:640px; margin:0 auto 40px; }
.mtb-book-head h2{ font-size:clamp(1.8rem,3.4vw,2.4rem); margin:8px 0 12px; }
.mtb-book-head p{ color:var(--pb-ink-soft); font-weight:600; font-size:1.05rem; }

.mtb-showcase{ margin-bottom:20px; }

/* Every preview is a plain div with its picture as a CSS
   background-image (not a real <img>), so right-click "save image"
   / "open image in new tab" aren't offered by the browser. */
.mtb-shot-wrap{
  position:relative; overflow:hidden; border-radius:14px;
  box-shadow:var(--pb-shadow); border:4px solid #fff; display:block;
  background-color:#fff;
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
  width:100%;
  -webkit-user-select:none; user-select:none;
}
.mtb-shot-wrap::after{
  content:"";
  position:absolute; inset:-25%;
  background-image:url('../img/logo.png');
  background-repeat:repeat;
  background-size:56px 56px;
  opacity:.18;
  transform:rotate(-28deg);
  pointer-events:none;
  filter:brightness(0);
}
/* Fade out the lower part of the page so no single shot is ever a
   complete, print-ready view — even before the overlap kicks in. */
.mtb-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%);
}

/* ---- Collage: 2–3 pages scattered and overlapping on purpose ---- */
.mtb-collage{
  display:flex; justify-content:center; align-items:flex-end;
  padding:20px 10px 34px; margin-bottom:14px;
}
.mtb-collage .mtb-shot-wrap{
  width:190px; flex-shrink:0;
}
.mtb-collage .mtb-shot-wrap:nth-child(1){ transform:rotate(-7deg); margin-right:-34px; z-index:1; }
.mtb-collage .mtb-shot-wrap:nth-child(2){ transform:rotate(3deg) translateY(-14px); z-index:3; }
.mtb-collage .mtb-shot-wrap:nth-child(3){ transform:rotate(9deg); margin-left:-34px; z-index:2; }

/* A single protected page, small and fully masked at the bottom. */
.mtb-shot-solo{ max-width:230px; margin:0 auto; }

.mtb-shot-stack{ display:none; } /* superseded by .mtb-collage */

/* The most detailed, most "usable if stolen" pages: shown small on purpose. */
.mtb-shot-thumb{ max-width:230px; margin:0 auto; }

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

/* ---------------- BONUS ---------------- */
.mtb-bonus{ padding:70px 0; background:var(--pb-cream-deep); }
.mtb-bonus-grid{ display:grid; grid-template-columns:.7fr 1.3fr; gap:50px; align-items:center; }
.mtb-bonus-cover{ width:100%; }
.mtb-bonus-copy h2{ font-size:clamp(1.7rem,3vw,2.2rem); margin:8px 0 14px; }
.mtb-bonus-copy p{ color:var(--pb-ink-soft); font-weight:600; font-size:1.02rem; max-width:52ch; margin-bottom:20px; }
.mtb-bonus-shot{ width:100%; max-width:230px; }

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

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

/* ---------------- RESPONSIVE ---------------- */
@media (max-width:900px){
  .mtb-hero-grid{ grid-template-columns:1fr; }
  .mtb-hero-art{ height:320px; order:-1; }
  .mtb-cover{ width:44%; }
  .mtb-feature-list{ grid-template-columns:1fr; }
  .mtb-bonus-grid{ grid-template-columns:1fr; }
  .mtb-price-cards{ grid-template-columns:1fr; }
  .mtb-price-featured{ transform:none; }
}
@media (max-width:560px){
  .mtb-hero{ padding:40px 0 30px; }
  .mtb-trust-row{ flex-direction:column; align-items:center; gap:10px; }
  .mtb-order-form-wrap{ padding:24px 18px; }
  .mtb-collage{ flex-wrap:wrap; }
  .mtb-collage .mtb-shot-wrap{ width:140px; }
  .mtb-collage .mtb-shot-wrap:nth-child(1){ margin-right:-24px; }
  .mtb-collage .mtb-shot-wrap:nth-child(3){ margin-left:-24px; }
}

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

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