:root{
  --navy:#1E4590;
  --navy-deep:#16376E;
  --amber:#EFAE6A;
  --amber-soft:#FBE2C2;
  --coral:#E66162;
  --coral-deep:#D6484A;
  --coral-soft:#FBE3E1;
  --green:#16866D;
  --cream:#FBF6EE;
  --paper:#FFFFFF;
  --ink:#231F20;
  --ink-soft:#5b5652;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:'Roboto Condensed',serif;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;}
img{max-width:100%; display:block;}
.wrap{max-width:1120px; margin:0 auto; padding:0 32px;}
.eyebrow{
  font-family:'Roboto Condensed',serif; font-size:12px; letter-spacing:.26em; text-transform:uppercase;
  font-weight:600; color:var(--coral-deep); margin:0 0 14px;
}
h1,h2,h3{font-family:'Playfair Display',serif; margin:0; color:var(--navy-deep);}
.script{font-family:'Pacifico',cursive; font-weight:400;}
.btn{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'Roboto Condensed',serif; font-weight:600; font-size:15px;
  padding:15px 30px; border-radius:100px; text-decoration:none;
  transition:transform .15s ease, box-shadow .15s ease;
  border:none; cursor:pointer;
}
.btn-coral{background:var(--coral); color:#fff; box-shadow:0 10px 24px rgba(230,97,98,0.35);}
.btn-coral:hover{transform:translateY(-2px); box-shadow:0 14px 28px rgba(230,97,98,0.42);}
.btn-ghost{background:transparent; color:var(--navy-deep); border:1.5px solid var(--navy-deep);}
.btn-ghost:hover{background:var(--navy-deep); color:#fff;}

/* ===== NAV ===== */
nav{
  position:sticky; top:0; z-index:50;
  background:rgba(251,246,238,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid #ECE1CB;
}
nav .wrap{display:flex; align-items:center; justify-content:space-between; padding:16px 32px;}
.nav-brand{display:flex; align-items:center; gap:10px; font-weight:700; color:var(--navy-deep); text-decoration:none;}
.nav-brand img{width:34px; height:34px; border-radius:8px;}
.nav-brand span{font-family:'Playfair Display',serif; font-size:17px;}
.nav-links{display:flex; gap:26px; font-size:13.5px; font-weight:600; color:var(--ink-soft); font-family:'Cinzel',serif;}
.nav-links a{text-decoration:none; white-space:nowrap;}
.nav-links a:hover{color:var(--coral-deep);}
.nav-links a.active{color:var(--coral-deep);}
.nav-toggle{display:none; flex-direction:column; justify-content:center; gap:5px; width:34px; height:34px; background:none; border:none; cursor:pointer; padding:0;}
.nav-toggle span{width:22px; height:2px; background:var(--navy-deep); border-radius:2px; transition:transform .2s ease, opacity .2s ease;}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
@media(max-width:1140px){ .nav-links{gap:16px; font-size:12.5px;} }
@media(max-width:900px){
  nav .wrap{position:relative; flex-wrap:wrap;}
  .nav-toggle{display:flex;}
  .nav-links{
    display:none; position:absolute; top:100%; left:0; right:0;
    background:var(--cream); border-bottom:1px solid #ECE1CB;
    flex-direction:column; gap:0; padding:6px 32px 14px;
  }
  .nav-links.open{display:flex;}
  .nav-links a{padding:13px 0; border-bottom:1px solid #ECE1CB;}
  .nav-links a:last-child{border-bottom:none;}
}

/* ===== HERO ===== */
.hero{position:relative; overflow:hidden; padding:76px 0 40px;}
.hero .wrap{display:grid; grid-template-columns:1.05fr .95fr; gap:50px; align-items:center;}
.hero-copy{position:relative; z-index:1;}
.hero h1{font-size:48px; line-height:1.14; font-weight:700; letter-spacing:-.01em;}
.hero h1 .accent{display:block; font-size:52px; color:var(--coral-deep); margin-top:2px;}
.hero p.lead{font-family:'Roboto Condensed',serif; font-size:16.5px; line-height:1.75; color:var(--ink-soft); margin:22px 0 30px; max-width:460px;}
.hero-ctas{display:flex; gap:14px; flex-wrap:wrap; margin-bottom:26px;}
.trust-row{display:flex; gap:22px; flex-wrap:wrap; font-size:12.5px; color:var(--ink-soft); font-weight:600; font-family:'Roboto Condensed',serif;}
.hero-art{position:relative;}
.hero-card{background:var(--paper); border-radius:24px; padding:26px; box-shadow:0 30px 60px rgba(30,69,144,0.14); border:1px solid #ECE1CB; position:relative; z-index:2;}
.hero-card img{border-radius:16px;}
.float-chip{position:absolute; background:#fff; border-radius:14px; padding:10px 16px; box-shadow:0 14px 30px rgba(0,0,0,0.12); font-size:12.5px; font-weight:700; font-family:'Roboto Condensed',serif; display:flex; align-items:center; gap:8px; z-index:3;}
.chip-1{top:-16px; right:-14px; color:var(--green);}
.chip-2{bottom:-18px; left:-18px; color:var(--coral-deep);}
.hero::before{content:""; position:absolute; width:420px; height:420px; border-radius:50%; background:var(--amber-soft); top:-180px; left:-160px; z-index:0; opacity:.7;}
@media(max-width:860px){ .hero .wrap{grid-template-columns:1fr;} .hero h1{font-size:36px;} .hero h1 .accent{font-size:38px;} }

/* ===== PAGE HERO BACKGROUND PHOTOS =====
   Each hero + the panel that follows it share ONE fixed (viewport-anchored)
   copy of the same photo — since a fixed background doesn't move when the
   page scrolls, the image never "jumps" at the seam between the two
   sections; only the gradient tint layered on top (which does scroll with
   its own element) changes to keep each panel's text readable. ===== */
.home-hero-photo::before{display:none;}
.hero.home-hero-photo{min-height:640px;}
.home-hero-photo{
  background-image:
    linear-gradient(100deg, rgba(251,246,238,.46) 0%, rgba(251,246,238,.28) 30%, rgba(251,246,238,.08) 56%, rgba(251,246,238,0) 82%),
    url('images/hero/blueberry-muffins.jpg');
  background-size:auto, cover;
  background-position:center, center 38%;
  background-attachment:scroll, fixed;
  background-repeat:no-repeat, no-repeat;
}
/* let the same fixed photo carry on into the course strip below */
.home-hero-photo + #courses{
  background-image:
    linear-gradient(180deg, rgba(251,246,238,.85) 0%, rgba(251,246,238,.38) 20%, rgba(251,246,238,.38) 78%, rgba(251,246,238,.92) 100%),
    url('images/hero/blueberry-muffins.jpg');
  background-size:auto, cover;
  background-position:center, center 38%;
  background-attachment:scroll, fixed;
  background-repeat:no-repeat, no-repeat;
}
/* background-attachment:fixed sizes "cover" against the full (tall) viewport, not the
   short mobile hero box, which throws crops off — use plain scroll-positioned crops
   on mobile instead (the seam is far less noticeable on a short, quickly-scrolled strip). */
@media(max-width:860px){
  .hero.home-hero-photo{min-height:0;}
  .home-hero-photo{
    background-image:
      linear-gradient(180deg, rgba(251,246,238,.60) 0%, rgba(251,246,238,.30) 45%, rgba(251,246,238,.08) 75%, rgba(251,246,238,0) 90%),
      url('images/hero/blueberry-muffins.jpg');
    background-position:center, center 30%;
    background-attachment:scroll, scroll;
  }
  .home-hero-photo + #courses{
    background-position:center, center 80%;
    background-attachment:scroll, scroll;
  }
}

.about-hero{
  padding:150px 0 130px; text-align:center; min-height:60vh;
  background-image:
    radial-gradient(ellipse 62% 75% at center, rgba(251,246,238,.58) 0%, rgba(251,246,238,.26) 55%, rgba(251,246,238,.05) 85%),
    url('images/hero/banana-bread-loaf.jpg');
  background-size:auto, cover;
  background-position:center, center 68%;
  background-attachment:scroll, fixed;
  background-repeat:no-repeat, no-repeat;
}
.about-hero .wrap{max-width:620px;}
.about-hero h1{font-size:42px; margin-bottom:14px;}
.about-hero .lead{font-family:'Roboto Condensed',serif; font-size:16px; line-height:1.8; color:var(--ink-soft); max-width:560px; margin:0 auto;}
/* carry the same fixed photo through the instructor panel, fading out before "From my kitchen to yours" */
.about-hero + .instructor{
  background-image:
    linear-gradient(180deg, rgba(251,246,238,.52) 0%, rgba(251,246,238,.52) 60%, rgba(251,246,238,.95) 100%),
    url('images/hero/banana-bread-loaf.jpg');
  background-size:auto, cover;
  background-position:center, center 68%;
  background-attachment:scroll, fixed;
  background-repeat:no-repeat, no-repeat;
}
@media(max-width:640px){
  .about-hero{padding:110px 0 90px; min-height:46vh; background-attachment:scroll, scroll;}
  .about-hero h1{font-size:34px;}
  .about-hero + .instructor{background-attachment:scroll, scroll;}
}

.offer-page-hero.offer-hero-photo{
  padding:150px 0 130px; min-height:60vh;
  background-image:
    linear-gradient(rgba(251,246,238,.16), rgba(251,246,238,.16)),
    url('images/hero/orange-brownies.jpg');
  background-size:auto, cover;
  background-position:center, center bottom;
  background-attachment:scroll, fixed;
  background-repeat:no-repeat, no-repeat;
}
/* carry the same fixed photo into the 3-card panel below */
.offer-page-hero.offer-hero-photo + section{
  background-image:
    linear-gradient(180deg, rgba(251,246,238,.85) 0%, rgba(251,246,238,.40) 20%, rgba(251,246,238,.40) 78%, rgba(251,246,238,.92) 100%),
    url('images/hero/orange-brownies.jpg');
  background-size:auto, cover;
  background-position:center, center bottom;
  background-attachment:scroll, fixed;
  background-repeat:no-repeat, no-repeat;
}
@media(max-width:640px){
  .offer-page-hero.offer-hero-photo{padding:110px 0 90px; min-height:46vh; background-attachment:scroll, scroll;}
  .offer-page-hero.offer-hero-photo + section{background-attachment:scroll, scroll;}
}

.coming-soon-hero.desi-hero-photo{
  padding:70px 0 0; text-align:center;
  aspect-ratio:1699/1920;
  background:
    linear-gradient(180deg, rgba(251,246,238,.6) 0%, rgba(251,246,238,.2) 22%, rgba(251,246,238,0) 40%),
    url('images/hero/cinnamon-rolls.jpg') center/cover no-repeat;
}
.coming-soon-hero.desi-hero-photo h1{
  font-size:44px; margin:0;
  text-shadow:0 1px 3px rgba(251,246,238,.9), 0 4px 18px rgba(251,246,238,.8);
}
@media(max-width:640px){
  .coming-soon-hero.desi-hero-photo{padding:96px 0 0;}
  .coming-soon-hero.desi-hero-photo h1{font-size:32px;}
}

/* soft glow so text stays legible over busier parts of the photo, without a heavier overlay */
.home-hero-photo .hero-copy .eyebrow, .home-hero-photo .hero-copy h1, .home-hero-photo .hero-copy p.lead, .home-hero-photo .hero-copy .trust-row span,
.about-hero .eyebrow, .about-hero h1, .about-hero .lead,
.offer-page-hero.offer-hero-photo .eyebrow, .offer-page-hero.offer-hero-photo h1, .offer-page-hero.offer-hero-photo p{
  text-shadow:0 1px 3px rgba(251,246,238,.9), 0 4px 18px rgba(251,246,238,.75);
}

/* scroll-down hint */
.scroll-hint{
  display:flex; flex-direction:column; align-items:center; gap:8px;
  margin:10px auto 0; width:fit-content; text-decoration:none;
  color:var(--ink-soft); font-size:11px; letter-spacing:.14em; text-transform:uppercase; font-weight:600;
}
.scroll-hint .dot{
  width:30px; height:46px; border:1.5px solid var(--coral); border-radius:20px; position:relative;
}
.scroll-hint .dot::before{
  content:""; position:absolute; top:8px; left:50%; width:5px; height:5px; margin-left:-2.5px;
  background:var(--coral); border-radius:50%;
  animation:scrolldot 1.6s infinite ease-in-out;
}
@keyframes scrolldot{ 0%{transform:translateY(0); opacity:1;} 70%{transform:translateY(16px); opacity:0;} 100%{opacity:0;} }

/* course intro divider (marks the "scroll to the course" transition) */
.course-divider{
  background:var(--navy); color:#fff; text-align:center; padding:52px 0 60px;
}
.course-divider .eyebrow{color:var(--amber);}
.course-divider h2{color:#fff; font-size:30px; margin-bottom:12px;}
.course-divider p{font-family:'Roboto Condensed',serif; color:#C9D5EC; max-width:480px; margin:0 auto; font-size:15px; line-height:1.7;}

section{padding:80px 0;}
.section-head{max-width:600px; margin:0 auto 44px; text-align:center;}
.section-head.light h2{color:#fff;}
.section-head.light p{color:#C9D5EC;}
.section-head h2{font-size:32px; font-weight:700;}
.section-head p{font-family:'Roboto Condensed',serif; color:var(--ink-soft); font-size:15px; line-height:1.7; margin-top:14px;}

/* ===== AFTER THIS COURSE (benefit cards) ===== */
.benefits{background:var(--coral-soft);}
.benefit-stack{display:flex; flex-direction:column; gap:22px; max-width:560px; margin:0 auto;}
.benefit-card{
  background:var(--cream); border:1.5px solid var(--coral); border-radius:22px;
  padding:34px 32px; text-align:center;
}
.benefit-card .ico{width:56px; height:56px; margin:0 auto 20px;}
.benefit-card h3{font-size:21px; color:var(--coral-deep); margin-bottom:10px;}
.benefit-card p{font-family:'Roboto Condensed',serif; font-size:14.5px; line-height:1.7; color:var(--ink-soft); margin:0;}

/* ===== MENU TILES (icon + title + description) ===== */
.watch-badge{
  display:inline-flex; align-items:center; gap:10px; background:var(--amber-soft);
  border:1.5px solid var(--coral); color:var(--coral-deep); font-weight:700; font-size:13px;
  padding:10px 20px; border-radius:12px; margin:0 auto 40px; font-family:'Roboto Condensed',serif;
}
.watch-wrap{text-align:center;}
.menu-grid{display:flex; flex-wrap:wrap; justify-content:center; gap:22px;}
.menu-tile{
  background:var(--paper); border:1px solid #ECE1CB; border-radius:18px;
  padding:26px 24px; position:relative; overflow:hidden;
  flex:1 1 300px; max-width:330px;
}
.menu-tile .num{
  position:absolute; top:14px; right:18px; font-family:'Playfair Display',serif;
  font-size:34px; color:var(--amber-soft); font-weight:700;
}
.menu-tile .ico{width:40px; height:40px; margin-bottom:16px;}
.menu-tile h3{font-size:17px; margin-bottom:8px; color:var(--navy-deep);}
.menu-tile p{font-family:'Roboto Condensed',serif; font-size:13.5px; color:var(--ink-soft); line-height:1.6; margin:0;}

/* ===== MODULES (solid navy, numbered) ===== */
.modules{background:var(--navy); color:#fff;}
.modules-head{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-bottom:56px;}
.modules-head h2{color:#fff; font-size:30px;}
.lifetime-badge{
  display:inline-flex; align-items:center; gap:10px; background:var(--amber-soft);
  color:var(--navy-deep); font-weight:700; font-size:12.5px; padding:9px 18px; border-radius:10px;
  font-family:'Roboto Condensed',serif;
}
.module-list{max-width:600px; margin:0 auto; display:flex; flex-direction:column; gap:44px;}
.module-row{display:flex; flex-direction:column; align-items:center; text-align:center;}
.modcircle{
  width:66px; height:66px; border-radius:50%; border:1.5px solid var(--amber);
  display:flex; align-items:center; justify-content:center;
  font-family:'Playfair Display',serif; font-size:24px; font-weight:700; color:var(--amber);
  margin-bottom:18px;
}
.module-row h3{color:#fff; font-size:20px; margin-bottom:8px;}
.module-row p{font-family:'Roboto Condensed',serif; color:#C9D5EC; font-size:14px; line-height:1.7; max-width:420px; margin:0;}
.module-row .sub-recipes{margin-top:10px; font-size:13.5px; color:var(--amber); font-style:italic; font-family:'Roboto Condensed',serif;}

/* ===== INSTRUCTOR (full, used on about.html) ===== */
.instructor .wrap{display:grid; grid-template-columns:.85fr 1.15fr; gap:56px; align-items:center;}
.instr-photo{background:var(--navy); border-radius:24px; aspect-ratio:4/5; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;}
.instr-photo .initials{font-family:'Playfair Display',serif; font-size:120px; color:rgba(255,255,255,0.14); font-weight:700;}
.instr-photo::after{content:""; position:absolute; inset:14px; border:1.5px solid rgba(239,174,106,0.5); border-radius:16px;}
.instr-credit{font-family:'Cormorant Garamond',serif; font-weight:600; letter-spacing:.16em; color:var(--coral); text-transform:uppercase; font-size:14px; position:absolute; bottom:26px; z-index:2;}
.instructor h2{font-size:30px; margin-bottom:16px;}
.instructor p{font-family:'Roboto Condensed',serif; font-size:15px; line-height:1.8; color:var(--ink-soft); margin-bottom:14px;}
.instr-tags{display:flex; gap:10px; flex-wrap:wrap; margin-top:18px;}
.instr-tags span{background:var(--amber-soft); color:var(--navy-deep); font-size:12px; font-weight:700; padding:7px 14px; border-radius:100px; font-family:'Roboto Condensed',serif;}
@media(max-width:820px){ .instructor .wrap{grid-template-columns:1fr;} }

/* ===== INSTRUCTOR TEASER (condensed, used on index.html, links to about.html) ===== */
.instr-teaser{background:var(--paper);}
.instr-teaser .wrap{display:flex; align-items:center; gap:44px; flex-wrap:wrap;}
.teaser-photo{
  width:180px; height:220px; flex-shrink:0; background:var(--navy); border-radius:20px;
  display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;
}
.teaser-photo .initials{font-family:'Playfair Display',serif; font-size:70px; color:rgba(255,255,255,0.16); font-weight:700;}
.teaser-photo::after{content:""; position:absolute; inset:10px; border:1.5px solid rgba(239,174,106,0.5); border-radius:12px;}
.teaser-copy{flex:1; min-width:260px;}
.teaser-copy h2{font-size:26px; margin-bottom:10px;}
.teaser-copy p{font-family:'Roboto Condensed',serif; font-size:14.5px; line-height:1.75; color:var(--ink-soft); margin:0 0 16px; max-width:480px;}
.teaser-link{color:var(--coral-deep); font-weight:700; text-decoration:none; font-size:14px;}
.teaser-link:hover{text-decoration:underline;}

/* ===== REVIEWS ===== */
.reviews{background:var(--coral);}
.review-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.review-card{background:var(--cream); border-radius:16px; padding:26px 24px; box-shadow:0 20px 40px rgba(0,0,0,0.15);}
.review-card:nth-child(2){transform:rotate(-1.2deg);}
.review-card:nth-child(1){transform:rotate(1deg);}
.review-card:nth-child(3){transform:rotate(-0.6deg);}
.stars{color:var(--amber); font-size:14px; letter-spacing:2px; margin-bottom:12px;}
.review-card p.quote{font-family:'Roboto Condensed',serif; font-style:italic; font-size:14px; line-height:1.7; color:var(--ink); margin:0 0 16px;}
.review-card .who{font-size:12.5px; font-weight:700; color:var(--navy-deep); font-family:'Roboto Condensed',serif;}
.review-card .who span{display:block; font-weight:400; color:var(--ink-soft); font-size:11.5px; margin-top:2px;}
@media(max-width:860px){ .review-grid{grid-template-columns:1fr;} .review-card{transform:none !important;} }

/* ===== PRICING ===== */
.pricing-card{max-width:600px; margin:0 auto; background:var(--paper); border-radius:24px; border:2px solid var(--coral); padding:40px 38px; text-align:center;}
.pricing-card .kicker{font-family:'Playfair Display',serif; font-size:19px; color:var(--navy-deep); margin-top:6px;}
.includes{text-align:left; margin:26px auto; max-width:400px; display:flex; flex-direction:column; gap:12px;}
.includes div{display:flex; gap:10px; font-family:'Roboto Condensed',serif; font-size:14px; color:var(--ink-soft); align-items:flex-start;}
.includes svg{width:18px; height:18px; flex-shrink:0; margin-top:2px; color:var(--green);}

.price-pill{
  display:inline-flex; align-items:center; background:var(--amber); border-radius:100px;
  padding:6px; margin-top:8px; box-shadow:0 14px 30px rgba(239,174,106,0.4);
}
.price-pill .chip{
  background:var(--coral); color:#fff; font-weight:700; font-size:13px; letter-spacing:.05em;
  padding:12px 22px; border-radius:100px; font-family:'Roboto Condensed',serif;
}
.price-pill .amt{padding:12px 24px 12px 16px; font-family:'Playfair Display',serif; font-weight:700; font-size:19px; color:var(--navy-deep);}
.price-strike{color:var(--navy-deep); opacity:.5; text-decoration:line-through; font-size:14px; font-weight:500; margin-right:4px;}

/* ===== FAQ (plain Q&A, no accordion) ===== */
.faq-item{padding:24px 0; border-bottom:1px solid var(--amber);}
.faq-item:last-child{border-bottom:none;}
.faq-item h3{font-size:18px; color:var(--coral-deep); margin-bottom:10px;}
.faq-item p{font-family:'Roboto Condensed',serif; font-size:14.5px; color:var(--ink-soft); line-height:1.75; margin:0;}

/* ===== INSTAGRAM SCROLL WIDGET ===== */
.insta{background:var(--cream);}
.insta .section-head{margin-bottom:30px;}
.insta-follow{
  display:inline-flex; align-items:center; gap:8px; background:var(--navy); color:#fff;
  font-weight:700; font-size:13px; padding:11px 22px; border-radius:100px; text-decoration:none;
  margin-top:6px;
}
.insta-follow:hover{background:var(--navy-deep);}
.insta-scroll{
  display:flex; gap:16px; overflow-x:auto; padding:6px 32px 18px; scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
}
.insta-scroll::-webkit-scrollbar{height:6px;}
.insta-scroll::-webkit-scrollbar-thumb{background:var(--amber); border-radius:10px;}
.insta-tile{
  scroll-snap-align:start; flex-shrink:0; width:220px; height:220px; border-radius:16px;
  display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;
  text-decoration:none;
}
.insta-tile svg{width:44px; height:44px; opacity:.9;}
.insta-tile .tag{
  position:absolute; bottom:10px; left:12px; color:#fff; font-size:11px; font-weight:700;
  letter-spacing:.04em;
}

/* ===== FINAL CTA ===== */
.final-cta{background:var(--navy); text-align:center; padding:84px 0;}
.final-cta h2{color:#fff; font-size:34px; margin-bottom:16px;}
.final-cta p{font-family:'Roboto Condensed',serif; color:#C9D5EC; max-width:460px; margin:0 auto 32px; font-size:15px;}

/* ===== COURSES PAGE ===== */
.courses-hero{padding:64px 0 20px; text-align:center;}
.courses-hero h1{font-size:38px; margin-bottom:14px;}
.courses-hero p{font-family:'Roboto Condensed',serif; color:var(--ink-soft); max-width:560px; margin:0 auto; font-size:15.5px; line-height:1.75;}

.course-offer{
  background:var(--paper); border:1.5px solid #ECE1CB; border-radius:24px;
  padding:0; overflow:hidden; margin-bottom:34px;
  display:grid; grid-template-columns:1fr 1.3fr;
}
.course-offer.reverse{grid-template-columns:1.3fr 1fr;}
.course-offer.reverse .offer-panel{order:2;}
.offer-panel{
  display:flex; align-items:center; justify-content:center; padding:40px;
  min-height:220px;
}
.offer-panel svg{width:100px; height:100px;}
.offer-copy{padding:38px 40px;}
.offer-tag{
  display:inline-block; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  padding:5px 13px; border-radius:20px; margin-bottom:12px;
}
.offer-copy h2{font-size:25px; margin-bottom:10px;}
.offer-copy p{font-family:'Roboto Condensed',serif; font-size:14.5px; line-height:1.75; color:var(--ink-soft); margin:0 0 16px;}
.offer-meta{display:flex; gap:20px; flex-wrap:wrap; margin-bottom:20px;}
.offer-meta div{font-size:12.5px; color:var(--ink-soft);}
.offer-meta b{display:block; font-family:'Playfair Display',serif; font-size:15px; color:var(--navy-deep);}
.placeholder-note{
  font-size:11.5px; color:var(--coral-deep); font-style:italic; margin-top:14px;
}
@media(max-width:780px){
  .course-offer, .course-offer.reverse{grid-template-columns:1fr;}
  .course-offer.reverse .offer-panel{order:0;}
}

footer{background:var(--cream); color:var(--ink-soft); padding:50px 0 26px; font-size:13px; font-family:'Cinzel',serif; border-top:1px solid #ECE1CB;}
footer .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:20px; align-items:center;}
footer .f-brand{display:flex; align-items:center; gap:10px; color:var(--navy-deep); font-family:'Playfair Display',serif; font-size:16px;}
footer .f-brand img{width:28px; border-radius:6px;}
footer .f-links{display:flex; gap:22px; flex-wrap:wrap;}
footer .f-links a{text-decoration:none; opacity:.85;}
footer .f-links a:hover{opacity:1; color:var(--coral-deep);}
.f-bottom{text-align:center; font-size:11.5px; opacity:.7; margin-top:30px; padding-top:20px; border-top:1px solid #ECE1CB;}

/* ===== COURSE LESSON PAGE ===== */
.lesson-block{
  padding:32px 0; border-bottom:1px solid #ECE1CB;
}
.lesson-block:last-child{border-bottom:none;}
.lesson-head{display:flex; align-items:baseline; gap:14px; margin-bottom:16px; flex-wrap:wrap;}
.lesson-num{
  font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:#fff; background:var(--coral); padding:5px 12px; border-radius:20px;
}
.lesson-head h2{font-size:22px;}
.video-frame{
  position:relative; width:100%; padding-top:56.25%; background:var(--navy);
  border-radius:14px; overflow:hidden; margin-bottom:14px;
}
.video-frame iframe{position:absolute; top:0; left:0; width:100%; height:100%; border:0;}
.video-frame.video-pending{
  display:flex; align-items:center; justify-content:center; padding-top:0; height:0;
  min-height:220px; background:var(--amber-soft);
}
.video-frame.video-pending p{
  font-family:'Playfair Display',serif; color:var(--navy-deep); font-size:16px; font-style:italic; margin:0;
}
.lesson-desc{font-family:'Roboto Condensed',serif; font-size:14.5px; color:var(--ink-soft); line-height:1.7; margin:0 0 12px; max-width:640px;}
.lesson-dl{
  display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:700;
  color:var(--coral-deep); text-decoration:none;
}
.lesson-dl:hover{text-decoration:underline;}

/* ===== COURSES STRIP (courses.html) — the site's hero page. Thumbnails show
   the FULL photo (no crop), horizontal scroll-snap so the list can keep
   growing as more courses are added without needing a reflow/pagination
   scheme. Card width is fluid (clamp) rather than fixed so ~3 cards fill
   the available width on desktop instead of leaving it mostly empty; it
   still degrades to one peeking card on mobile. ===== */
.course-strip{
  display:flex; justify-content:safe center; gap:26px; overflow-x:auto;
  padding:10px 32px 30px; scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
}
.course-strip::-webkit-scrollbar{height:6px;}
.course-strip::-webkit-scrollbar-thumb{background:var(--amber); border-radius:10px;}
.course-tile{
  scroll-snap-align:start; flex:0 0 clamp(300px, 31vw, 420px);
  background:var(--paper); border:1.5px solid #ECE1CB; border-radius:22px; overflow:hidden;
  display:flex; flex-direction:column; text-decoration:none; color:inherit;
  transition:transform .18s ease, box-shadow .18s ease;
}
a.course-tile:hover{transform:translateY(-4px); box-shadow:0 16px 32px rgba(30,69,144,0.14);}
.course-tile-media{aspect-ratio:4/3; background:var(--amber-soft); overflow:hidden;}
.course-tile-media img{width:100%; height:100%; object-fit:contain; object-position:center;}
.course-tile-media.icon-media{display:flex; align-items:center; justify-content:center;}
.course-tile-media.icon-media svg{width:64px; height:64px;}
.course-tile-body{padding:22px 24px 26px; display:flex; flex-direction:column; flex:1;}
.course-tile .offer-tag{font-size:11.5px; padding:5px 12px; margin-bottom:10px;}
.course-tile h3{font-size:20px; margin-bottom:8px; line-height:1.25;}
.course-tile p{font-family:'Roboto Condensed',serif; font-size:14.5px; line-height:1.55; color:var(--ink-soft); margin:0 0 14px; flex:1;}
.course-tile .card-meta{font-size:12.5px; color:var(--ink-soft); font-weight:600; margin-bottom:12px;}
.course-tile .card-cta{
  display:inline-flex; align-items:center; gap:6px; font-size:14px; font-weight:700;
  color:var(--coral-deep); margin-top:auto;
}
.course-tile.coming-soon{border-style:dashed; border-color:var(--amber);}
.course-tile.coming-soon .course-tile-media{background:var(--cream); display:flex; align-items:center; justify-content:center;}
.course-tile.coming-soon .course-tile-media span{font-family:'Playfair Display',serif; font-style:italic; color:var(--amber); font-size:15px; text-align:center; padding:0 14px;}

/* ===== COURSE DETAIL PAGE ===== */
.course-detail-hero{padding:56px 0 10px;}
.course-detail-hero .wrap{max-width:960px;}
.course-detail-hero h1{font-size:36px; margin-bottom:14px;}
.course-detail-hero .lead{font-family:'Roboto Condensed',serif; font-size:15.5px; line-height:1.8; color:var(--ink-soft); max-width:640px; margin:0 0 24px;}
.detail-meta{display:flex; gap:28px; flex-wrap:wrap; margin-bottom:8px;}
.detail-meta div{font-size:12.5px; color:var(--ink-soft);}
.detail-meta b{display:block; font-family:'Playfair Display',serif; font-size:17px; color:var(--navy-deep);}

/* ===== CAROUSEL ===== */
.carousel{
  position:relative; border-radius:24px; overflow:hidden; aspect-ratio:4/3; max-width:960px;
  margin:0 auto; background:var(--navy); box-shadow:0 30px 60px rgba(30,69,144,0.16);
}
.carousel-slide{position:absolute; inset:0; opacity:0; transition:opacity 1.1s ease;}
.carousel-slide.active{opacity:1;}
.carousel-slide img{width:100%; height:100%; object-fit:cover;}
.carousel-dots{position:absolute; bottom:16px; left:0; right:0; display:flex; justify-content:center; gap:8px; z-index:2;}
.carousel-dots button{width:8px; height:8px; border-radius:50%; border:none; background:rgba(255,255,255,0.55); padding:0; cursor:pointer;}
.carousel-dots button.active{background:#fff; width:22px; border-radius:10px; transition:width .25s ease;}
.carousel-arrow{
  position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:42px; height:42px; border-radius:50%; border:none; cursor:pointer;
  background:rgba(22,55,110,0.55); color:#fff; display:flex; align-items:center; justify-content:center;
  transition:background .15s ease, transform .15s ease;
}
.carousel-arrow:hover{background:rgba(22,55,110,0.85);}
.carousel-arrow svg{width:20px; height:20px;}
.carousel-arrow.prev{left:14px;}
.carousel-arrow.next{right:14px;}
@media(prefers-reduced-motion: reduce){ .carousel-slide{transition:none;} }
@media(max-width:620px){ .carousel{aspect-ratio:1/1;} .carousel-arrow{width:36px; height:36px;} }

/* ===== SIMPLE "COMING SOON" PAGE (Desi Dough Recipes, Grandma's Bakes) ===== */
.coming-soon-page{padding:96px 0; text-align:center;}
.coming-soon-page .wrap{max-width:560px;}
.coming-soon-badge{
  display:inline-flex; align-items:center; gap:10px; background:var(--amber-soft);
  border:1.5px solid var(--coral); color:var(--coral-deep); font-weight:700; font-size:13px;
  padding:8px 18px; border-radius:12px; margin-bottom:22px; font-family:'Roboto Condensed',serif;
}
.coming-soon-page h1{font-size:34px; margin-bottom:16px;}
.coming-soon-page p{font-family:'Roboto Condensed',serif; font-size:15px; line-height:1.8; color:var(--ink-soft); margin:0 0 30px;}

/* ===== WHAT WE OFFER — blocks side by side, not stacked ===== */
.offer-page-hero{padding:56px 0 16px; text-align:center;}
.offer-page-hero h1{font-size:36px; margin-bottom:14px;}
.offer-page-hero p{font-family:'Roboto Condensed',serif; color:var(--ink-soft); max-width:560px; margin:0 auto; font-size:15.5px; line-height:1.75;}
.offer-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
@media(max-width:900px){ .offer-grid{grid-template-columns:1fr; max-width:460px; margin:0 auto;} }
.offer-block{
  background:var(--paper); border:1.5px solid #ECE1CB; border-radius:24px; overflow:hidden;
  display:flex; flex-direction:column;
}
.offer-block .offer-panel{min-height:150px; padding:28px;}
.offer-block .offer-panel svg{width:64px; height:64px;}
.offer-block .offer-copy{padding:26px 26px 30px; display:flex; flex-direction:column; flex:1;}
.offer-block .offer-copy p{flex:1;}
.offer-block .btn{align-self:flex-start;}

/* ===== INSTAGRAM THUMBNAILS (Recipes page, About widget) =====
   Self-hosted photos, not a live embed — Instagram's official embed.js
   widget reliably fails to render its content in third-party iframes under
   modern cookie/tracking protection (confirmed: the iframe loads and even
   completes its network request, but the post itself never paints, with or
   without a forced height). Showing the real thumbnail beats waiting on a
   widget that doesn't work. ===== */
.insta-embed-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:start;}
@media(max-width:820px){ .insta-embed-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:560px){ .insta-embed-grid{grid-template-columns:1fr; max-width:400px; margin:0 auto;} }
.insta-thumb-card{
  position:relative; display:block; aspect-ratio:1/1; border-radius:16px; overflow:hidden;
  text-decoration:none; box-shadow:0 14px 30px rgba(30,69,144,0.14);
}
.insta-thumb-card img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .3s ease;}
.insta-thumb-card:hover img{transform:scale(1.06);}
.insta-thumb-card .insta-thumb-overlay{
  position:absolute; left:0; right:0; bottom:0; padding:14px 16px 12px;
  background:linear-gradient(to top, rgba(22,55,110,0.88), rgba(22,55,110,0));
  color:#fff; font-weight:700; font-size:12.5px; display:flex; align-items:center; gap:7px;
}
.insta-thumb-card .insta-thumb-overlay svg{width:16px; height:16px; flex-shrink:0;}
