/* ===================== TOKENS ===================== */
:root{
  --black: #0B0B0C;
  --black-soft: #141416;
  --ivory: #FAF8F3;
  --white: #FFFFFF;
  --grey: #8B8B85;
  --grey-line: #E3E0D8;
  --grey-line-dark: #2A2A2C;
  --gold: #C9A24B;
  --gold-light: #E8D9B5;
  --gold-dim: rgba(201,162,75,0.35);

  --serif: 'Playfair Display', Georgia, serif;
  --sans: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  --ease: cubic-bezier(.22,.61,.36,1);
  --container: 1180px;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--sans);
  background:var(--ivory);
  color:var(--black);
  font-weight:300;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important;}
}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;background:none;border:none;cursor:pointer;color:inherit;}
img{max-width:100%;display:block;}
:focus-visible{outline:2px solid var(--gold); outline-offset:3px;}

.section-inner{max-width:var(--container); margin:0 auto; padding:0 6vw;}
.section-inner.narrow{max-width:820px;}
.section-inner.center{text-align:center;}
.section{position:relative; padding:130px 0;}

.eyebrow{
  font-family:var(--sans); font-weight:600;
  font-size:11px;
  letter-spacing:0.28em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:22px;
  display:block;
}
.eyebrow-light{color:var(--gold-light);}

.section-title{
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(2rem, 4vw, 3.1rem);
  line-height:1.15;
  letter-spacing:-0.01em;
  margin-bottom:40px;
  max-width:16ch;
}
.section-title.light{color:var(--white); max-width:none;}
.center .section-title{margin-left:auto; margin-right:auto;}

.lead{font-size:1.25rem; line-height:1.65; font-weight:300; color:var(--black); margin-bottom:24px;}
.body{font-size:1.02rem; line-height:1.85; color:#3d3d3a; margin-bottom:18px; max-width:60ch;}

/* Horizon rule — signature motif */
.horizon-rule{
  width:0; height:1px; background:var(--gold);
  margin:0 auto 90px; max-width:var(--container);
  transition: width 1.4s var(--ease);
}
.horizon-rule.light{background:var(--gold-light);}
.horizon-rule.in-view{width:120px;}

/* ===================== LOADER ===================== */
#loader{
  position:fixed; inset:0; background:var(--black); z-index:9999;
  display:flex; align-items:center; justify-content:center;
  transition: opacity 0.9s var(--ease), visibility 0.9s;
}
#loader.hidden{opacity:0; visibility:hidden;}
.loader-mark{display:flex; flex-direction:column; align-items:center; gap:18px;}
.loader-line{width:1px; height:0; background:var(--gold); animation: riseLine 1.2s var(--ease) forwards 0.2s;}
.loader-word{
  font-family:var(--sans); font-weight:600; font-size:12px; letter-spacing:0.4em; color:var(--gold-light);
  opacity:0; animation: fadeUp 0.8s var(--ease) forwards 0.9s;
}
@keyframes riseLine{ to{height:60px;} }
@keyframes fadeUp{ from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:translateY(0);} }

/* ===================== NAV ===================== */
.site-nav{
  position:fixed; top:0; left:0; right:0; z-index:500;
  display:flex; align-items:center; justify-content:space-between;
  padding:26px 6vw; background:transparent;
  transition: padding 0.4s var(--ease), background 0.4s var(--ease), backdrop-filter 0.4s var(--ease), border-color 0.4s var(--ease);
  border-bottom:1px solid transparent;
}
.site-nav.scrolled{
  padding:16px 6vw;
  background:rgba(11,11,12,0.82);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--grey-line-dark);
}
.nav-mark{font-family:var(--serif); font-size:20px; letter-spacing:0.05em; color:var(--white);}
.nav-links{display:flex; align-items:center; gap:38px;}
.nav-links a{
  font-family:var(--sans); font-weight:600; font-size:11px; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--white); position:relative; padding-bottom:4px;
}
.nav-links a:not(.nav-cta)::after{
  content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--gold);
  transition:width 0.35s var(--ease);
}
.nav-links a:not(.nav-cta):hover::after{width:100%;}
.nav-cta{
  border:1px solid var(--gold); padding:9px 18px; color:var(--gold-light) !important;
}
.nav-toggle{display:none; flex-direction:column; gap:5px; width:26px;}
.nav-toggle span{height:1px; background:var(--white); width:100%;}

@media(max-width:900px){
  .nav-links{
    position:fixed; inset:0; top:0; background:var(--black); flex-direction:column;
    justify-content:center; gap:34px; transform:translateY(-100%); transition:transform 0.5s var(--ease);
  }
  .nav-links.open{transform:translateY(0);}
  .nav-links a{font-size:14px;}
  .nav-toggle{display:flex;}
}

/* ===================== HERO ===================== */
.hero{
  position:relative; min-height:100vh; overflow:hidden;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  background:var(--black); color:var(--white); text-align:center;
  padding:120px 6vw 60px;
}
.hero-sky{position:absolute; inset:0; z-index:0;}
.sun{
  position:absolute; left:50%; bottom:18%; transform:translateX(-50%);
  width:240px; height:240px; border-radius:50%;
  background:radial-gradient(circle, var(--gold-light) 0%, var(--gold) 45%, rgba(201,162,75,0) 75%);
  opacity:0; animation: sunrise 3.2s var(--ease) forwards 0.4s;
  filter:blur(3px);
}
@keyframes sunrise{
  from{opacity:0; bottom:6%; transform:translateX(-50%) scale(0.7);}
  to{opacity:0.5; bottom:20%; transform:translateX(-50%) scale(1);}
}
.hero-scrim{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    radial-gradient(ellipse 70% 55% at 50% 38%, rgba(11,11,12,0.72) 0%, rgba(11,11,12,0.35) 55%, transparent 80%),
    linear-gradient(180deg, rgba(11,11,12,0.55) 0%, rgba(11,11,12,0.15) 30%, rgba(11,11,12,0.2) 70%, rgba(11,11,12,0.7) 100%);
}
.mountains{position:absolute; left:0; right:0; bottom:0; height:46%; background:var(--black);}
.mountains-back{
  clip-path: polygon(0% 60%, 12% 40%, 24% 55%, 38% 30%, 52% 50%, 68% 25%, 82% 48%, 100% 35%, 100% 100%, 0% 100%);
  opacity:0.75; height:50%;
}
.mountains-front{
  clip-path: polygon(0% 75%, 15% 55%, 30% 68%, 45% 45%, 60% 65%, 78% 42%, 92% 60%, 100% 50%, 100% 100%, 0% 100%);
}
.hero-content{position:relative; z-index:2; display:flex; flex-direction:column; align-items:center;}
.hero .eyebrow{opacity:0; animation: fadeUp 1s var(--ease) forwards 1.6s;}
.hero-title{
  font-family:var(--serif); font-weight:500; font-size:clamp(2.4rem, 6vw, 5rem);
  line-height:1.08; letter-spacing:-0.01em; max-width:15ch; margin-bottom:26px;
  text-shadow:0 6px 40px rgba(0,0,0,0.55);
  opacity:0; animation: fadeUp 1.1s var(--ease) forwards 1.85s;
}
.hero-sub{
  max-width:52ch; font-size:1.08rem; line-height:1.7; color:#D9D6CE; font-weight:300;
  margin-bottom:44px; text-shadow:0 4px 24px rgba(0,0,0,0.5);
  opacity:0; animation: fadeUp 1.1s var(--ease) forwards 2.1s;
}
.hero-actions{
  display:flex; gap:20px; flex-wrap:wrap; justify-content:center; margin-bottom:70px;
  opacity:0; animation: fadeUp 1.1s var(--ease) forwards 2.35s;
}
.btn{
  font-family:var(--sans); font-weight:600; font-size:11px; letter-spacing:0.16em; text-transform:uppercase;
  padding:16px 34px; display:inline-flex; align-items:center; gap:10px; transition:all 0.35s var(--ease);
}
.btn-gold{background:var(--gold); color:var(--black);}
.btn-gold:hover{background:var(--gold-light); transform:translateY(-2px);}
.btn-ghost{border:1px solid rgba(255,255,255,0.35); color:var(--white);}
.btn-ghost:hover{border-color:var(--gold); color:var(--gold-light);}
.btn-outline-light{border:1px solid var(--gold); color:var(--gold-light); padding:15px 30px;}
.btn-outline-light:hover{background:var(--gold); color:var(--black);}
.play-dot{width:7px; height:7px; border-radius:50%; background:var(--gold); display:inline-block;}

.hero-book{opacity:0; animation: fadeUp 1.3s var(--ease) forwards 2.6s;}
.book3d{
  width:190px; aspect-ratio:900/1361; position:relative; transform-style:preserve-3d;
  transform:rotateY(-22deg) rotateX(2deg);
  animation: floatBook 6s ease-in-out infinite;
  transition: transform 0.6s var(--ease);
}
.book3d:hover{transform:rotateY(-6deg) rotateX(0deg);}
@keyframes floatBook{ 0%,100%{transform:rotateY(-22deg) rotateX(2deg) translateY(0);} 50%{transform:rotateY(-22deg) rotateX(2deg) translateY(-10px);} }
.book-cover-img{
  width:100%; height:auto; display:block; border:1px solid var(--gold-dim);
  box-shadow:-18px 20px 44px rgba(0,0,0,0.55);
}
.book-spine{position:absolute; left:-7px; top:2%; width:7px; height:96%; background:linear-gradient(180deg,#000,#1a1a1a); transform:rotateY(90deg); transform-origin:right;}

.scroll-indicator{position:absolute; bottom:34px; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:10px; z-index:2;}
.scroll-indicator .line{width:1px; height:34px; background:linear-gradient(var(--gold), transparent); animation:scrollLine 2s ease-in-out infinite;}
@keyframes scrollLine{ 0%{opacity:0.2;} 50%{opacity:1;} 100%{opacity:0.2;} }
.scroll-indicator .txt{font-family:var(--sans); font-weight:600; font-size:9px; letter-spacing:0.2em; color:var(--grey); text-transform:uppercase;}

/* ===================== REVEAL ===================== */
.reveal{opacity:0; transform:translateY(28px); transition:opacity 0.9s var(--ease), transform 0.9s var(--ease);}
.reveal.in-view{opacity:1; transform:translateY(0);}

/* ===================== BOOK SHOWCASE ===================== */
.book-showcase{
  background:var(--black); color:var(--white); text-align:center;
  padding:130px 0 150px; position:relative; overflow:hidden;
}
.showcase-glow{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:560px; height:560px; border-radius:50%;
  background:radial-gradient(circle, rgba(201,162,75,0.22) 0%, transparent 70%);
  pointer-events:none;
}
.showcase-cover{
  width:min(380px, 70vw); margin:34px auto 0; display:block;
  border:1px solid var(--gold-dim);
  box-shadow:0 30px 80px rgba(0,0,0,0.65), 0 0 60px rgba(201,162,75,0.12);
  position:relative; z-index:1;
  animation: floatCover 7s ease-in-out infinite;
}
@keyframes floatCover{ 0%,100%{transform:translateY(0);} 50%{transform:translateY(-14px);} }
.showcase-caption{
  margin-top:34px; font-family:var(--sans); font-weight:500; font-size:0.95rem;
  letter-spacing:0.04em; color:var(--gold-light); position:relative; z-index:1;
}

/* ===================== WHY ===================== */
.why-grid{display:grid; gap:0;}

/* ===================== JOURNEY ===================== */
.timeline{position:relative; padding-top:20px;}
.timeline-track{position:relative; height:1px; background:var(--grey-line); margin-bottom:60px; max-width:100%;}
.timeline-fill{position:absolute; left:0; top:0; height:1px; width:0; background:var(--gold); transition:width 1.6s var(--ease);}
.timeline-list{list-style:none; display:grid; grid-template-columns:repeat(6,1fr); gap:24px;}
.t-item{position:relative; padding-top:26px;}
.t-dot{
  position:absolute; top:-24px; left:0; width:9px; height:9px; border-radius:50%;
  background:var(--ivory); border:1px solid var(--gold); transition:background 0.4s var(--ease), transform 0.4s var(--ease);
}
.t-item.active .t-dot{background:var(--gold); transform:scale(1.3);}
.t-label{font-family:var(--serif); font-size:1.1rem; display:block; margin-bottom:10px;}
.t-item p{font-size:0.88rem; line-height:1.6; color:var(--grey);}
@media(max-width:900px){
  .timeline-list{grid-template-columns:repeat(2,1fr); row-gap:44px;}
}

/* ===================== INSIDE THE BOOK ===================== */
.inside-statement{max-width:900px; margin-bottom:80px;}
.inside-number{
  font-family:var(--serif); font-weight:600; font-size:clamp(4.5rem, 12vw, 9rem);
  line-height:0.85; color:var(--gold); display:block; margin-bottom:12px;
  background:linear-gradient(115deg, var(--gold) 20%, var(--gold-light) 50%, var(--gold) 80%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.inside-headline{
  font-family:var(--serif); font-weight:500; font-size:clamp(1.6rem, 3.4vw, 2.6rem);
  line-height:1.3; letter-spacing:-0.01em; max-width:22ch;
}
.pillars{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--grey-line); border:1px solid var(--grey-line);}
.pillar{background:var(--ivory); padding:44px 34px; transition:background 0.4s var(--ease);}
.pillar:hover{background:var(--white);}
.pillar-index{font-family:var(--sans); font-weight:600; font-size:11px; letter-spacing:0.16em; color:var(--gold); display:block; margin-bottom:18px;}
.pillar h3{font-family:var(--serif); font-weight:500; font-size:1.5rem; margin-bottom:14px;}
.pillar p{color:var(--grey); font-size:0.95rem; line-height:1.7; max-width:34ch;}
@media(max-width:900px){ .pillars{grid-template-columns:1fr;} }

/* ===================== DISCOVER ===================== */
.discover-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--grey-line); border:1px solid var(--grey-line);}
.d-card{
  background:var(--ivory); padding:44px 20px; display:flex; flex-direction:column; gap:20px;
  transition:background 0.4s var(--ease);
}
.d-card:hover{background:var(--white);}
.d-mark{width:22px; height:1px; background:var(--gold);}
.d-card h3{font-family:var(--serif); font-weight:400; font-size:1.15rem;}
@media(max-width:900px){ .discover-grid{grid-template-columns:repeat(2,1fr);} }

/* ===================== AUTHOR ===================== */
.author-section{background:var(--black); color:var(--white); padding:150px 0;}
.author-grid{display:grid; grid-template-columns:0.8fr 1.2fr; gap:80px; align-items:center;}
.portrait-frame{
  aspect-ratio:4/5; border:1px solid var(--gold-dim); position:relative; overflow:hidden;
  background:linear-gradient(155deg,#141416,#0B0B0C);
}
.portrait-frame::before{content:''; position:absolute; inset:16px; border:1px solid rgba(201,162,75,0.2); z-index:2; pointer-events:none;}
.portrait-img{width:100%; height:100%; object-fit:cover; object-position:center 15%; display:block; filter:grayscale(15%) contrast(1.04);}
.portrait-monogram{font-family:var(--serif); font-size:5rem; color:var(--gold-dim); letter-spacing:0.05em;}
.author-role{font-family:var(--sans); font-weight:600; font-size:11px; letter-spacing:0.16em; color:var(--gold-light); text-transform:uppercase; margin-bottom:28px;}
.author-bio{color:#CFCCC3; line-height:1.85; font-size:1.02rem; margin-bottom:40px; max-width:56ch;}
@media(max-width:900px){ .author-grid{grid-template-columns:1fr; gap:50px;} }

/* ===================== TRAILER ===================== */
.trailer-section{background:var(--black); color:var(--white); padding-top:0; padding-bottom:150px;}
.trailer-frame{max-width:var(--container); margin:0 auto; padding:0 6vw;}
.trailer-poster{
  position:relative; aspect-ratio:16/9; background:linear-gradient(155deg,#1a1a1c,#0B0B0C);
  border:1px solid var(--gold-dim); display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.trailer-video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;}
.trailer-poster:not(.playing) .trailer-video{opacity:0.55;}
.trailer-poster.playing .play-btn,
.trailer-poster.playing .trailer-glow{opacity:0; pointer-events:none;}
.trailer-glow{position:absolute; width:60%; height:140%; background:radial-gradient(ellipse, var(--gold-dim), transparent 70%); opacity:0.5; transition:opacity 0.4s var(--ease); z-index:1;}
.play-btn{
  width:84px; height:84px; border-radius:50%; border:1px solid var(--gold); display:flex; align-items:center; justify-content:center;
  position:relative; z-index:2; transition:transform 0.4s var(--ease), background 0.4s var(--ease), opacity 0.4s var(--ease);
  background:rgba(11,11,12,0.35); backdrop-filter:blur(4px);
}
.play-btn:hover{background:var(--gold); transform:scale(1.08);}
.play-tri{width:0; height:0; border-top:9px solid transparent; border-bottom:9px solid transparent; border-left:15px solid var(--gold-light); margin-left:4px;}
.play-btn:hover .play-tri{border-left-color:var(--black);}

/* ===================== BUY ===================== */
.buy{
  background:var(--black); color:var(--white); padding:150px 0;
  position:relative; overflow:hidden;
}
.buy::before{
  content:''; position:absolute; inset:0;
  background:
    radial-gradient(ellipse 50% 60% at 15% 20%, rgba(201,162,75,0.16), transparent 60%),
    radial-gradient(ellipse 45% 55% at 85% 80%, rgba(201,162,75,0.1), transparent 60%);
  pointer-events:none;
}
.buy-inner{
  max-width:var(--container); margin:0 auto; padding:0 6vw; position:relative; z-index:1;
  display:grid; grid-template-columns:0.7fr 1.3fr; gap:80px; align-items:center;
}
.buy-visual{display:flex; justify-content:center;}
.buy-cover-img{
  width:min(280px, 80%); aspect-ratio:900/1361; object-fit:cover; border:1px solid var(--gold-dim);
  box-shadow:-20px 24px 60px rgba(0,0,0,0.6);
  transform:rotate(-3deg);
  transition:transform 0.6s var(--ease);
}
.buy-visual:hover .buy-cover-img{transform:rotate(0deg);}
.buy-grid{display:flex; flex-direction:column; gap:16px; margin-top:44px;}
.buy-card{
  position:relative; display:flex; flex-direction:column; gap:6px;
  background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.1); border-left:3px solid var(--gold);
  padding:26px 30px; overflow:hidden; transition:background 0.35s var(--ease), transform 0.35s var(--ease), border-color 0.35s var(--ease);
}
.buy-card::before{
  content:''; position:absolute; inset:0; opacity:0; transition:opacity 0.4s var(--ease); z-index:0;
}
.buy-card:hover::before{opacity:1;}
.buy-card > *{position:relative; z-index:1;}
.buy-card:hover{transform:translateX(6px); background:rgba(255,255,255,0.06);}
.buy-amazon{border-left-color:#E8A94C;}
.buy-amazon::before{background:radial-gradient(ellipse 80% 100% at 0% 50%, rgba(232,169,76,0.14), transparent 70%);}
.buy-flipkart{border-left-color:#5B9BD5;}
.buy-flipkart::before{background:radial-gradient(ellipse 80% 100% at 0% 50%, rgba(91,155,213,0.14), transparent 70%);}
.buy-bluerose{border-left-color:#D98E9E;}
.buy-bluerose::before{background:radial-gradient(ellipse 80% 100% at 0% 50%, rgba(217,142,158,0.14), transparent 70%);}
.buy-playbooks{border-left-color:#6FBF73;}
.buy-playbooks::before{background:radial-gradient(ellipse 80% 100% at 0% 50%, rgba(111,191,115,0.14), transparent 70%);}
.buy-store{font-family:var(--serif); font-size:1.5rem; color:var(--white);}
.buy-desc{font-family:var(--sans); font-weight:600; font-size:11px; color:var(--grey); letter-spacing:0.06em;}
.buy-arrow{position:absolute; top:26px; right:30px; color:var(--gold); font-size:1.2rem; transition:transform 0.35s var(--ease);}
.buy-card:hover .buy-arrow{transform:translateX(6px);}
@media(max-width:900px){
  .buy-inner{grid-template-columns:1fr; gap:44px; text-align:center;}
  .buy-arrow{display:none;}
}

/* ===================== REVIEWS ===================== */
.review-carousel{position:relative;}
.review-track{display:flex; transition:transform 0.6s var(--ease);}
.review-slide{min-width:100%; padding:0 4px;}
.review-quote{font-family:var(--serif); font-size:clamp(1.2rem,2.6vw,1.6rem); line-height:1.5; font-style:italic; margin-bottom:26px;}
.review-name{font-family:var(--sans); font-weight:600; font-size:11px; letter-spacing:0.12em; color:var(--gold); text-transform:uppercase;}
.review-dots{display:flex; gap:10px; margin-top:36px;}
.rdot{width:7px; height:7px; border-radius:50%; border:1px solid var(--gold); background:transparent; transition:background 0.3s var(--ease);}
.rdot.active{background:var(--gold);}

/* ===================== FAQ ===================== */
.faq-list{border-top:1px solid var(--grey-line);}
.faq-item{width:100%; text-align:left; border-bottom:1px solid var(--grey-line);}
.faq-q{display:flex; justify-content:space-between; align-items:center; padding:26px 0; font-size:1.05rem;}
.faq-icon{color:var(--gold); font-family:var(--sans); font-weight:600; transition:transform 0.4s var(--ease);}
.faq-item.open .faq-icon{transform:rotate(45deg);}
.faq-a{max-height:0; overflow:hidden; transition:max-height 0.5s var(--ease);}
.faq-a p{padding:0 0 26px; color:var(--grey); line-height:1.75; max-width:60ch;}
.faq-item.open .faq-a{max-height:200px;}

/* ===================== FINAL CTA ===================== */
.final-cta{background:var(--black); color:var(--white); text-align:center; padding:160px 0;}
.quote{font-family:var(--serif); font-style:italic; font-size:clamp(1.8rem,4vw,3rem); margin-bottom:50px; line-height:1.3;}

/* ===================== FOOTER ===================== */
.site-footer{background:var(--black); color:var(--grey); padding:40px 6vw; border-top:1px solid var(--grey-line-dark);}
.footer-inner{max-width:var(--container); margin:0 auto; display:flex; flex-wrap:wrap; gap:20px; justify-content:space-between; align-items:center;}
.footer-mark{font-family:var(--sans); font-weight:600; font-size:11px; letter-spacing:0.16em; color:var(--gold-light);}
.footer-links{display:flex; gap:24px; flex-wrap:wrap;}
.footer-links a{font-family:var(--sans); font-weight:600; font-size:11px; letter-spacing:0.06em;}
.footer-links a:hover{color:var(--gold);}
.footer-copy{font-family:var(--sans); font-weight:600; font-size:10px;}

@media(max-width:600px){
  .section{padding:90px 0;}
  .author-section, .trailer-section, .final-cta{padding-top:90px; padding-bottom:90px;}
}