/* ============ RESET / BASE ============ */
* { margin: 0; padding: 0; box-sizing: border-box; }
:root{
  --black: #1e1e1e;
  --off-black: #262626;
  --white: #f7f6f2;
  --paper: #efeee9;
  --yellow: #fdd400;
  --grey: #8a8a8a;
  --line: rgba(30,30,30,0.12);
  --line-dark: rgba(247,246,242,0.14);
  --serif: 'Lora', Georgia, serif;
  --sans: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
html{ scroll-behavior: smooth; }
body{
  background: var(--paper);
  color: var(--black);
  font-family: var(--sans);
  overflow-x: hidden;
  cursor: default;
}
a{ color: inherit; text-decoration: none; }
img{ max-width: 100%; display:block; }
em{ font-style: italic; font-family: var(--serif); font-weight: 500; color: inherit; }

::selection{ background: var(--yellow); color: var(--black); }

/* ============ GRAIN OVERLAY ============ */
.grain{
  position: fixed; inset: 0; pointer-events: none; z-index: 999;
  opacity: 0.035; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ============ CUSTOM CURSOR ============ */
.cursor-dot{
  position: fixed; top:0; left:0; width: 14px; height:14px; border-radius: 50%;
  background: var(--black); pointer-events:none; z-index: 9999;
  transform: translate(-50%,-50%);
  transition: width .25s ease, height .25s ease, background .25s ease, opacity .25s ease;
  mix-blend-mode: difference;
}
.cursor-dot.hovering{ width: 46px; height: 46px; background: var(--yellow); }
@media (hover:none){ .cursor-dot{ display:none; } }

/* ============ REVEAL ANIMATION ============ */
.reveal{
  opacity: 0; transform: translateY(28px);
  transition: opacity .8s cubic-bezier(.16,.84,.44,1), transform .8s cubic-bezier(.16,.84,.44,1);
}
.reveal.in{ opacity: 1; transform: translateY(0); }

/* ============ HEADER ============ */
.site-header{
  position: fixed; top:0; left:0; right:0; z-index: 500;
  display:flex; align-items:center; justify-content: space-between;
  padding: 16px 4vw;
  mix-blend-mode: difference;
  color: var(--white);
}
.logo{ display:flex; align-items:center; gap:12px; font-weight:700; letter-spacing: .01em; }
.logo-mark{
  width: 38px; height: 38px; object-fit: contain;
  filter: brightness(0) invert(1);
  mix-blend-mode: normal;
}
.logo-text{ font-family: var(--sans); font-weight: 700; font-size: 18px; letter-spacing: -0.01em; }
.main-nav{ display:flex; gap: 30px; font-size: 12.5px; text-transform: uppercase; letter-spacing:.07em; font-weight: 500; }
.main-nav a{ position:relative; padding-bottom:3px; }
.main-nav a::after{
  content:''; position:absolute; left:0; right:100%; bottom:0; height:1px; background: currentColor;
  transition: right .35s cubic-bezier(.16,.84,.44,1);
}
.main-nav a:hover::after{ right:0; }
.btn-ghost{
  border:1px solid currentColor; padding: 9px 18px; border-radius: 100px;
  font-size: 12px; text-transform: uppercase; letter-spacing:.08em; font-weight: 600; display:flex; align-items:center; gap:6px;
}
@media (max-width: 980px){ .main-nav{ display:none; } }

/* ============ HERO ============ */
.hero{
  min-height: 100svh;
  display:flex; flex-direction: column; justify-content:center;
  padding: 140px 4vw 60px;
  background: var(--paper);
  color: var(--black);
  position: relative;
}
.hero-kicker{
  display:flex; align-items:center; gap: 14px; flex-wrap:wrap;
  font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--grey); font-weight: 600;
  margin-bottom: 34px;
}
.hero-kicker .dot{ color: var(--yellow); font-size: 8px; -webkit-text-stroke: 1px var(--black); }
.hero-title{
  font-family: var(--sans);
  font-weight: 800;
  font-size: clamp(48px, 8.5vw, 128px);
  line-height: 0.98;
  letter-spacing: -0.02em;
  color: var(--black);
}
.hero-title .hl{ color: var(--yellow); -webkit-text-stroke: 1.5px var(--black); paint-order: stroke fill; }
.hero-sub{
  display:flex; justify-content: space-between; align-items: flex-end; gap: 40px; flex-wrap: wrap;
  margin-top: 48px; padding-top: 34px; border-top: 1px solid var(--line);
}
.hero-sub p{ max-width: 500px; font-size: 17px; line-height: 1.6; color: #3a3a3a; }
.hero-cta{ display:flex; align-items:center; gap: 26px; }
.btn-primary{
  background: var(--black); color: var(--yellow); font-weight: 700; font-size: 14px;
  padding: 16px 30px; border-radius: 100px; display:inline-block; text-align:center;
  transition: transform .3s cubic-bezier(.16,.84,.44,1), background .3s;
  border: none; cursor: pointer;
}
.btn-primary:hover{ transform: translateY(-3px); }
.btn-primary.full{ width: 100%; margin-top: 26px; }
.btn-text{ font-size: 14px; font-weight: 600; color: var(--black); display:flex; align-items:center; gap:8px; }
.hero-meta{
  display:grid; grid-template-columns: repeat(3,1fr); gap: 30px;
  margin-top: 70px; padding-top: 30px; border-top: 1px solid var(--line);
}
.hero-meta .num{ font-family: var(--serif); font-style: italic; font-size: 13px; color: var(--black); background: var(--yellow); display:inline-block; padding: 2px 8px; border-radius: 4px; margin-bottom: 10px; }
.hero-meta p{ font-size: 14.5px; color: #4a4a4a; line-height: 1.5; max-width: 240px; }
@media (max-width: 760px){
  .hero-meta{ grid-template-columns: 1fr; gap: 22px; }
  .hero-sub{ flex-direction: column; align-items: flex-start; }
}

/* ============ MARQUEE ============ */
.marquee{
  background: var(--yellow); color: var(--black); overflow:hidden; white-space:nowrap;
  padding: 16px 0; border-top: 1px solid var(--black); border-bottom: 1px solid var(--black);
}
.marquee-track{ display:inline-flex; animation: scroll 26s linear infinite; }
.marquee-track span{
  font-family: var(--sans); font-weight: 700; text-transform: uppercase;
  font-size: 16px; letter-spacing: .04em; padding-right: 4px;
}
@keyframes scroll{ from{ transform: translateX(0);} to{ transform: translateX(-50%);} }

/* ============ OUR BOOKS (brand catalog) ============ */
.books{ padding: 130px 4vw 110px; background: var(--black); color: var(--white); }
.books-title{ font-family: var(--sans); font-weight: 800; font-size: clamp(38px,6vw,80px); margin-bottom: 60px; letter-spacing: -0.02em; }
.books-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 26px; }
@media (max-width: 860px){ .books-grid{ grid-template-columns: 1fr; } }
.book-card{
  display:block; border: 1px solid var(--line-dark); border-radius: 10px; padding: 46px 38px;
  transition: transform .35s cubic-bezier(.16,.84,.44,1), border-color .35s, background .35s;
}
.book-card:hover{ transform: translateY(-8px); border-color: var(--yellow); background: rgba(253,212,0,0.04); }
.book-tag{ font-size: 11.5px; text-transform: uppercase; letter-spacing:.1em; color: var(--yellow); font-weight: 700; }
.book-card h3{ font-family: var(--sans); font-weight: 700; font-size: 30px; margin: 16px 0 14px; letter-spacing: -0.01em; }
.book-card p{ font-size: 15px; color: #c7c7c7; line-height: 1.6; margin-bottom: 26px; }
.book-link{ font-weight: 600; font-size: 14px; color: var(--white); display:inline-flex; align-items:center; gap:8px; }
.book-card:hover .book-link{ color: var(--yellow); }

/* ============ BOOK HEADER BANNERS ============ */
.book-header{ padding: 110px 4vw 70px; background: var(--paper); text-align:center; border-top: 6px solid var(--yellow); }
.book-header.alt{ border-top-color: var(--black); background: var(--white); }
.book-eyebrow{ display:block; text-transform: uppercase; letter-spacing:.14em; font-size: 12.5px; font-weight: 700; color: var(--grey); margin-bottom: 18px; }
.book-header-title{ font-family: var(--sans); font-weight: 800; font-size: clamp(34px,6vw,68px); letter-spacing: -0.02em; margin-bottom: 18px; }
.book-header-sub{ font-size: 16px; color: #444; max-width: 640px; margin: 0 auto; line-height: 1.6; }

/* ============ ABOUT / BOOK ============ */
.about{ padding: 100px 4vw 130px; background: var(--paper); }
.about-grid{ display:grid; grid-template-columns: 0.85fr 1.15fr; gap: 80px; align-items:start; }
.about-grid.reverse{ grid-template-columns: 1.15fr 0.85fr; }
@media (max-width: 900px){
  .about-grid, .about-grid.reverse{ grid-template-columns: 1fr; gap: 50px; }
  .about-grid.reverse .about-cover{ order: -1; }
}

.cover-card{
  aspect-ratio: 3/4; background: var(--black); color: var(--white);
  padding: 44px 34px; display:flex; flex-direction: column; justify-content: space-between;
  border-radius: 4px; position: relative; overflow:hidden;
}
.cover-card::before{
  content:''; position:absolute; inset:14px; border: 1px solid var(--line-dark); pointer-events:none;
}
.cover-kicker{ font-size: 11px; text-transform: uppercase; letter-spacing:.12em; color: var(--yellow); font-weight: 700; }
.cover-card h2{ font-family: var(--sans); font-size: clamp(28px,3.2vw,40px); line-height: 1.12; font-weight: 800; margin-top: 20px; letter-spacing: -0.01em; }
.cover-sub{ font-size: 12px; color: var(--grey); text-transform: uppercase; letter-spacing: .1em; margin-top: auto; padding-top: 20px; }
.cover-author{ font-family: var(--serif); font-style: italic; font-size: 18px; margin-top: 8px; }
.lentils-cover{ background: var(--yellow); color: var(--black); }
.lentils-cover .cover-kicker{ color: var(--black); opacity: 0.6; }
.lentils-cover::before{ border-color: rgba(30,30,30,0.18); }
.lentils-cover .cover-sub{ color: rgba(30,30,30,0.55); }

.eyebrow{ display:block; text-transform: uppercase; letter-spacing:.12em; font-size:12px; font-weight: 700; color: var(--grey); margin-bottom: 22px; }
.pull-quote{
  font-family: var(--serif); font-style: italic; font-weight: 400;
  font-size: clamp(22px, 2.6vw, 32px); line-height: 1.4; color: var(--black); max-width: 640px;
}
.about-details{ margin-top: 44px; border-top: 1px solid var(--line); }
.detail-row{
  display:flex; justify-content: space-between; padding: 16px 0; border-bottom: 1px solid var(--line);
  font-size: 14.5px;
}
.detail-row span:first-child{ color: var(--grey); text-transform: uppercase; font-size: 11.5px; letter-spacing: .08em; font-weight: 600; }
.btn-underline{
  display:inline-flex; align-items:center; gap:8px; margin-top: 34px; font-weight: 600; font-size: 14.5px;
  border-bottom: 2px solid var(--yellow); padding-bottom: 4px;
}

/* ============ WHY ============ */
.why, .lentils-teaser{ padding: 100px 4vw 120px; background: var(--paper); border-top: 1px solid var(--line); }
.section-label{ display:block; text-transform: uppercase; letter-spacing:.12em; font-size: 12px; font-weight: 700; color: var(--grey); margin-bottom: 18px; }
.section-label.light{ color: #999; }
.why-title{ font-family: var(--sans); font-weight: 800; font-size: clamp(32px, 4.6vw, 56px); line-height: 1.1; margin-bottom: 70px; max-width: 760px; letter-spacing: -0.01em; }
.why-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap: 40px; }
@media (max-width: 860px){ .why-grid{ grid-template-columns: 1fr; } }
.why-card{ padding-top: 26px; border-top: 1px solid var(--line); }
.why-num{ font-family: var(--sans); font-weight: 800; color: var(--black); background: var(--yellow); display:inline-block; padding: 3px 10px; border-radius: 5px; font-size: 13px; margin-bottom: 20px; }
.why-card h3{ font-family: var(--sans); font-weight: 700; font-size: 22px; margin-bottom: 14px; letter-spacing: -0.01em; }
.why-card p{ font-size: 15px; line-height: 1.6; color: #444; }

/* ============ CONTENTS ============ */
.contents{ padding: 110px 4vw 100px; background: var(--black); color: var(--white); }
.contents-title{ font-family: var(--sans); font-weight: 800; font-size: clamp(36px,5.6vw,72px); margin-bottom: 60px; letter-spacing: -0.02em; }
.toc-list{ border-top: 1px solid var(--line-dark); }
.toc-row{
  display:grid; grid-template-columns: 60px 1fr auto 30px; align-items:center; gap: 20px;
  padding: 20px 4px; border-bottom: 1px solid var(--line-dark);
  cursor: pointer; transition: padding-left .35s cubic-bezier(.16,.84,.44,1), background .35s;
}
.toc-row:hover{ padding-left: 18px; background: rgba(247,246,242,0.035); }
.toc-num{ font-family: var(--serif); font-style: italic; color: var(--grey); font-size: 14px; }
.toc-name{ font-family: var(--sans); font-weight: 600; font-size: clamp(16px,2.1vw,24px); letter-spacing: -0.01em; }
.toc-sub{ font-size: 12px; color: var(--grey); text-transform: uppercase; letter-spacing:.08em; justify-self: end; }
.toc-arrow{
  font-size: 18px; opacity:0; transform: translateX(-8px);
  transition: opacity .35s, transform .35s; color: var(--yellow);
}
.toc-row:hover .toc-arrow{ opacity:1; transform: translateX(0); }
.toc-preview{
  margin-top: 34px; min-height: 24px; font-family: var(--serif); font-style: italic;
  font-size: 16px; color: var(--yellow); transition: opacity .3s;
}
@media (max-width: 700px){
  .toc-row{ grid-template-columns: 40px 1fr 20px; }
  .toc-sub{ display:none; }
}

/* ============ EXCERPTS GALLERY ============ */
.excerpts{ padding: 110px 0 120px; background: var(--paper); overflow:hidden; }
.excerpts-head{ padding: 0 4vw; max-width: 640px; margin-bottom: 50px; }
.excerpts-head h2{ font-family: var(--sans); font-weight: 800; font-size: clamp(32px,4.4vw,52px); margin: 10px 0 16px; letter-spacing: -0.01em; }
.excerpts-head p{ color:#555; font-size: 15.5px; line-height:1.6; }
.excerpts-scroll{
  display:flex; gap: 20px; overflow-x: auto; padding: 0 4vw 24px; scrollbar-width: none;
}
.excerpts-scroll::-webkit-scrollbar{ display:none; }
.excerpt-card{
  flex: 0 0 280px; height: 350px; object-fit: cover; border-radius: 6px;
  transition: transform .35s cubic-bezier(.16,.84,.44,1), box-shadow .35s;
}
.excerpt-card:hover{ transform: translateY(-8px) scale(1.01); box-shadow: 0 24px 44px rgba(0,0,0,0.18); }

/* ============ CASES ============ */
.cases{ padding: 100px 0 130px; background: var(--white); overflow: hidden; border-top: 1px solid var(--line); }
.cases-head{ padding: 0 4vw; max-width: 640px; margin-bottom: 60px; }
.cases-head h2{ font-family: var(--sans); font-weight: 800; font-size: clamp(32px,4.4vw,52px); margin: 10px 0 16px; letter-spacing: -0.01em; }
.cases-head p{ color:#555; font-size: 15.5px; line-height:1.6; }
.cases-scroll{
  display:flex; gap: 22px; overflow-x: auto; padding: 0 4vw 20px; scrollbar-width: none;
}
.cases-scroll::-webkit-scrollbar{ display:none; }
.case-card{
  flex: 0 0 300px; background: var(--paper); border: 1px solid var(--line);
  padding: 32px 26px; border-radius: 8px; transition: transform .35s cubic-bezier(.16,.84,.44,1), box-shadow .35s;
}
.case-card:hover{ transform: translateY(-8px); box-shadow: 0 20px 40px rgba(0,0,0,0.08); }
.case-num{ font-family: var(--sans); font-weight: 800; color: var(--black); background: var(--yellow); display:inline-block; padding: 3px 10px; border-radius: 5px; font-size: 15px; margin-bottom: 18px; }
.case-card h3{ font-family: var(--sans); font-weight: 700; font-size: 18px; margin-bottom: 12px; line-height: 1.3; letter-spacing: -0.01em; }
.case-card p{ font-size: 14px; color:#555; line-height: 1.55; }

/* ============ PRICING ============ */
.pricing{ padding: 120px 4vw; background: var(--black); color: var(--white); text-align:center; }
.pricing-title{ font-family: var(--sans); font-weight: 800; font-size: clamp(36px,5.6vw,64px); letter-spacing: -0.02em; }
.pricing-sub{ color: var(--grey); margin: 18px auto 60px; max-width: 480px; font-size: 15px; }
.pricing-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap: 26px; text-align:left; max-width: 1100px; margin: 0 auto; }
@media (max-width: 860px){ .pricing-grid{ grid-template-columns: 1fr; } }
.price-card{
  border: 1px solid var(--line-dark); border-radius: 8px; padding: 40px 32px;
  transition: transform .35s cubic-bezier(.16,.84,.44,1), border-color .35s;
}
.price-card:hover{ transform: translateY(-6px); border-color: var(--yellow); }
.price-card.featured{ background: var(--off-black); border-color: var(--yellow); }
.price-tag{ font-size: 11px; text-transform: uppercase; letter-spacing:.1em; color: var(--yellow); font-weight: 700; }
.price-card h3{ font-family: var(--sans); font-weight: 700; font-size: 22px; margin: 14px 0 6px; letter-spacing: -0.01em; }
.price-amount{ font-family: var(--sans); font-weight: 800; font-size: 42px; margin-bottom: 14px; }
.price-amount span{ font-size: 16px; color: var(--grey); font-weight: 500; }
.price-desc{ font-size: 14px; color: #bdbdbd; line-height: 1.55; min-height: 44px; }
.pricing-note{ margin-top: 40px; font-size: 13px; color: var(--grey); }

.notify-form{ display:flex; gap: 12px; max-width: 460px; margin: 0 auto; flex-wrap: wrap; justify-content:center; }
.notify-form input{
  flex: 1 1 260px; padding: 16px 22px; border-radius: 100px; border: 1px solid var(--line-dark);
  background: var(--off-black); color: var(--white); font-family: var(--sans); font-size: 14px;
}
.notify-form input::placeholder{ color: var(--grey); }
.notify-form .btn-primary{ flex: 0 0 auto; }

/* ============ LENTILS TEASER TWEAK ============ */
.lentils-teaser{ border-top: 1px solid var(--line); }

/* ============ FAQ ============ */
.faq{ padding: 110px 4vw; background: var(--paper); max-width: 820px; margin: 0 auto; }
.faq > h2{ font-family: var(--sans); font-weight: 800; font-size: clamp(32px,4.4vw,52px); margin-bottom: 50px; letter-spacing: -0.01em; }
.faq-item{ border-top: 1px solid var(--line); }
.faq-item:last-child{ border-bottom: 1px solid var(--line); }
.faq-q{
  width:100%; background:none; border:none; text-align:left; padding: 24px 0;
  font-family: var(--sans); font-weight: 600; font-size: 17px; display:flex; justify-content: space-between; align-items:center;
  cursor:pointer; color: var(--black);
}
.faq-q span{ font-size: 20px; font-weight: 700; transition: transform .3s; color: var(--black); background: var(--yellow); width: 26px; height: 26px; border-radius: 50%; display:inline-flex; align-items:center; justify-content:center; flex-shrink: 0; }
.faq-item.open .faq-q span{ transform: rotate(45deg); }
.faq-a{ max-height:0; overflow:hidden; transition: max-height .4s cubic-bezier(.16,.84,.44,1); }
.faq-a p{ padding-bottom: 24px; font-size: 15px; color:#444; line-height:1.6; max-width: 620px; }

/* ============ BRAND ABOUT ============ */
.brand-about{ padding: 130px 4vw; background: var(--black); color: var(--white); text-align:center; }
.brand-about-title{ font-family: var(--sans); font-weight: 800; font-size: clamp(30px,5vw,58px); line-height: 1.2; letter-spacing: -0.01em; max-width: 900px; margin: 0 auto 26px; }
.brand-about-title em{ color: var(--yellow); font-family: var(--serif); }
.brand-about-copy{ max-width: 620px; margin: 0 auto; color: #bdbdbd; font-size: 16px; line-height: 1.7; }

/* ============ FOOTER ============ */
.site-footer{ background: var(--black); color: var(--white); padding: 90px 4vw 30px; text-align:center; border-top: 1px solid var(--line-dark); }
.footer-cta{
  font-family: var(--sans); font-weight: 800; font-size: clamp(38px,7.5vw,100px);
  display:inline-flex; align-items:center; gap: 22px; line-height: 1; letter-spacing: -0.02em;
}
.footer-cta span{ color: var(--yellow); }
.footer-links{ display:flex; justify-content:center; gap: 30px; flex-wrap: wrap; margin-top: 50px; font-size: 13.5px; font-weight: 500; }
.footer-links a{ opacity: 0.75; }
.footer-links a:hover{ opacity: 1; color: var(--yellow); }
.footer-bottom{
  display:flex; justify-content: space-between; margin-top: 50px; padding-top: 24px;
  border-top: 1px solid var(--line-dark); font-size: 12.5px; color: var(--grey); flex-wrap: wrap; gap: 10px;
}

/* ============ REAL BOOK COVER PHOTO (Lentils) ============ */
.cover-photo{
  width: 100%; aspect-ratio: 3/4.8; object-fit: cover; border-radius: 4px;
  box-shadow: 0 30px 60px rgba(0,0,0,0.25);
}
.lentils-lede{
  font-size: 16px; color: #444; line-height: 1.7; max-width: 700px; margin: -40px 0 50px;
}