/* ==============================================
   Clarity Bright — Landing
   Palette (from cover + interior art):
   cream #FBF3E4  peach #F7D9B8  coral #E87A47
   choco #4B2E1F  sky #B6C9D6    butter #F5D56B
   heart #D9574A  rose #F4B9A8
============================================== */

:root{
  --cream:#FBF3E4;
  --cream-2:#FAEAD2;
  --peach:#F7D9B8;
  --coral:#E87A47;
  --coral-dk:#C95E2B;
  --choco:#4B2E1F;
  --choco-soft:#6B4630;
  --sky:#B6C9D6;
  --butter:#F5D56B;
  --heart:#D9574A;
  --rose:#F4B9A8;
  --ink:#2C1B10;

  --font-display:'Fraunces', Georgia, serif;
  --font-body:'Nunito', system-ui, sans-serif;

  --r-sm:10px; --r-md:18px; --r-lg:28px; --r-xl:40px;
  --shadow-soft: 0 10px 30px -10px rgba(75,46,31,.18);
  --shadow-lift: 0 24px 60px -20px rgba(75,46,31,.28);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:
    radial-gradient(1200px 600px at 10% 0%, #FFF6E4 0%, transparent 60%),
    radial-gradient(900px 500px at 90% 20%, #FDE6D0 0%, transparent 55%),
    linear-gradient(180deg, var(--cream) 0%, #FAE9D1 100%);
  overflow-x:hidden;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;display:block}
a{color:var(--coral-dk)}

/* ------- Paper / sparkle texture overlay ------- */
body::before{
  content:"";
  position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:
    radial-gradient(circle at 12% 18%, rgba(245,213,107,.35) 0 1.5px, transparent 2px),
    radial-gradient(circle at 78% 9%, rgba(232,122,71,.28) 0 1.2px, transparent 2px),
    radial-gradient(circle at 40% 80%, rgba(182,201,214,.35) 0 1.2px, transparent 2px),
    radial-gradient(circle at 85% 60%, rgba(245,213,107,.35) 0 1.2px, transparent 2px),
    radial-gradient(circle at 20% 50%, rgba(217,87,74,.25) 0 1px, transparent 2px);
  background-size: 520px 520px, 460px 460px, 600px 600px, 500px 500px, 480px 480px;
  opacity:.9;
}

/* ============ NAV ============ */
.nav{
  position:fixed;top:14px;left:50%;transform:translateX(-50%);
  z-index:50;
  background:rgba(255,250,240,.78);
  backdrop-filter:saturate(1.4) blur(14px);
  -webkit-backdrop-filter:saturate(1.4) blur(14px);
  border:1px solid rgba(75,46,31,.1);
  border-radius:999px;
  padding:8px 10px 8px 18px;
  display:flex;align-items:center;gap:18px;
  box-shadow:var(--shadow-soft);
  max-width: 1180px;
  width: 100%;
  justify-content: center;
}
.nav-brand{
  font-family:var(--font-display);font-weight:700;color:var(--choco);
  font-size:18px; letter-spacing:.2px;
  display:flex;align-items:center;gap:8px;white-space:nowrap;
}
.nav-logo{height:28px;width:auto;display:block}
.nav-links{display:flex;gap:4px;flex-wrap:nowrap;overflow:hidden}
.nav-links a{
  text-decoration:none;color:var(--choco-soft);
  padding:8px 10px;border-radius:999px;font-weight:600;font-size:13px;
  transition:all .2s ease;white-space:nowrap;
}
.nav-links a:hover{background:var(--peach);color:var(--choco)}
.nav-cta{
  background:var(--coral);color:#fff;padding:9px 16px;border-radius:999px;
  text-decoration:none;font-weight:700;font-size:13px;white-space:nowrap;
  box-shadow:0 6px 18px -6px rgba(232,122,71,.6);
  transition:transform .15s ease, box-shadow .2s ease;
}
.nav-cta:hover{transform:translateY(-1px);box-shadow:0 10px 22px -6px rgba(232,122,71,.7)}

/* language switch */
.lang-switch{
  display:inline-flex;background:#FFF2DE;border:1px solid rgba(75,46,31,.12);
  border-radius:999px;padding:3px;gap:2px;
}
.lang-btn{
  background:transparent;border:0;cursor:pointer;
  font-family:inherit;font-weight:800;font-size:12px;letter-spacing:.06em;
  color:var(--choco-soft);padding:6px 10px;border-radius:999px;
  transition:all .2s ease;
}
.lang-btn.active{background:var(--choco);color:#FFF3D8;box-shadow:0 4px 10px -4px rgba(75,46,31,.4)}
.lang-btn:not(.active):hover{color:var(--choco)}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:6px}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--choco);margin:4px 0;border-radius:2px}

@media (max-width: 900px){
  .nav{gap:10px;padding:8px 8px 8px 14px}
  .nav-links{
    position:absolute;top:calc(100% + 10px);left:0;right:0;
    flex-direction:column;background:#FFF8EC;border-radius:22px;
    padding:10px;box-shadow:var(--shadow-soft);
    border:1px solid rgba(75,46,31,.1);
    display:none;
  }
  .nav-links.open{display:flex}
  .nav-toggle{display:block}
}

/* ============ SECTION BASE ============ */
section{position:relative;z-index:1}
.container{max-width:1180px;margin:0 auto;padding:0 24px}
.eyebrow{
  display:inline-block;text-transform:uppercase;letter-spacing:.18em;
  font-size:12px;font-weight:800;color:var(--coral-dk);
  background:#FFE7D3;padding:6px 12px;border-radius:999px;
}
h1,h2,h3{font-family:var(--font-display);color:var(--choco);font-weight:600;letter-spacing:-.01em;text-wrap:balance}
h2{font-size:clamp(32px, 4.4vw, 56px);line-height:1.05;margin:14px 0 18px}
h3{font-size:clamp(20px, 2vw, 26px);margin:0 0 8px}
p{color:var(--choco-soft);font-size:17px;text-wrap:pretty}
.lead{font-size:19px;color:var(--choco-soft);max-width:62ch}

/* ============ HERO ============ */
.hero{
  min-height:100vh;padding:120px 0 80px;display:flex;align-items:center;
  position:relative;overflow:hidden;
}
.hero-sparkle{
  position:absolute;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(500px 300px at 80% 30%, rgba(245,213,107,.28), transparent 70%),
    radial-gradient(600px 340px at 10% 70%, rgba(244,185,168,.35), transparent 70%);
}
.hero-grid{
  display:grid;grid-template-columns: 1.05fr .95fr;gap:60px;align-items:center;
  position:relative;z-index:2;
}
.hero-copy h1{
  font-family:var(--font-display);
  font-size:clamp(38px, 5vw, 68px);
  line-height:1.08;margin:18px 0 34px;
  color:var(--choco);font-weight:600;
  font-style:italic;
}
.hero-copy h1 .amp{color:var(--coral);font-style:italic}
.hero-copy h1 .quoted{color:var(--coral);font-style:italic}
.hero-sub{font-size:19px;max-width:52ch}
.hero-cta-row{display:flex;gap:14px;margin-top:26px;flex-wrap:wrap;align-items:center}
.btn{
  display:inline-flex;align-items:center;gap:10px;
  background:var(--coral);color:#fff;
  padding:16px 26px;border-radius:999px;text-decoration:none;font-weight:800;
  box-shadow:0 14px 30px -12px rgba(232,122,71,.7);
  transition:transform .15s ease, box-shadow .2s ease;
  border:0;cursor:pointer;font-size:16px;font-family:inherit;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 18px 36px -12px rgba(232,122,71,.8)}
.btn.ghost{background:#fff;color:var(--choco);box-shadow:inset 0 0 0 2px var(--choco)}
.btn.ghost:hover{background:var(--choco);color:#fff}
.hero-meta{display:flex;gap:18px;margin-top:24px;align-items:center;color:var(--choco-soft);font-size:14px;flex-wrap:wrap}
.stars{color:var(--coral);letter-spacing:2px;font-size:18px}

.hero-book{
  position:relative;display:flex;justify-content:center;align-items:center;
}
.book-wrap{
  position:relative;width:min(440px, 100%);aspect-ratio: 2/3;
  transform-style: preserve-3d;perspective:1200px;
}
.book-cover{
  width:100%;height:auto;object-fit:cover;
  transform: rotateY(-8deg) rotateX(2deg);
  transition: transform .6s cubic-bezier(.2,.8,.2,1);
}
.book-wrap:hover .book-cover{transform: rotateY(-2deg) rotateX(0deg) translateY(-6px)}
.book-glow{
  position:absolute;inset:-40px;z-index:-1;border-radius:50%;
  background:radial-gradient(ellipse, rgba(245,213,107,.55), transparent 60%);
  filter:blur(20px);
}

/* Floating decorations */
.float{
  position:absolute;pointer-events:none;z-index:1;opacity:.92;
  will-change:transform;filter:drop-shadow(0 10px 16px rgba(75,46,31,.18));
}
.float.planet-1{top:10%;left:3%;width:110px}
.float.planet-2{top:68%;left:4%;width:88px}
.float.sock-1{top:16%;right:4%;width:120px;transform:rotate(18deg)}
.float.sock-2{bottom:8%;right:8%;width:110px;transform:rotate(-12deg)}
.float.gear-1{top:18%;left:46%;width:64px;opacity:.7;z-index:0}
.float.gear-2{bottom:20%;left:50%;width:58px;opacity:.7}

/* ============ MEET CLARITY ============ */
.meet{padding:120px 0}
.meet-grid{display:grid;grid-template-columns: 1fr 1.2fr;gap:70px;align-items:center}
.meet-portrait{
  position:relative;border-radius:var(--r-xl);overflow:hidden;
  aspect-ratio: 4/5;
  background:
    radial-gradient(ellipse at 50% 30%, #FDEBD0, #F6D3B0 60%, #EEBA91);
  box-shadow:var(--shadow-lift);
  border:1px solid rgba(75,46,31,.08);
}
.meet-portrait img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:center 28%;
}
.meet-portrait::after{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(800px 400px at 80% 10%, rgba(245,213,107,.45), transparent 60%),
    radial-gradient(500px 400px at 10% 90%, rgba(232,122,71,.25), transparent 60%);
  pointer-events:none;
}
.meet-tags{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.tag{
  background:#FFF3E1;border:1.5px dashed var(--coral);color:var(--coral-dk);
  padding:8px 14px;border-radius:999px;font-weight:700;font-size:14px;
}
.traits{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:28px}
.trait{
  background:rgba(255,255,255,.7);
  border:1px solid rgba(75,46,31,.08);
  border-radius:var(--r-md);padding:16px 18px;
}
.trait .icon{font-size:22px;margin-bottom:6px}
.trait strong{font-family:var(--font-display);color:var(--choco);font-size:17px;display:block;margin-bottom:2px}
.trait span{color:var(--choco-soft);font-size:14px}

/* ============ ABOUT THE BOOK ============ */
.about-book{
  padding:140px 0;position:relative;
  background:
    linear-gradient(180deg, transparent 0%, #FFEAD0 10%, #FFEAD0 90%, transparent 100%);
}
.about-book::before{
  content:"";position:absolute;inset:0;opacity:.35;pointer-events:none;
  background:
    radial-gradient(600px 300px at 15% 20%, rgba(245,213,107,.5), transparent 60%),
    radial-gradient(600px 300px at 85% 80%, rgba(244,185,168,.5), transparent 60%);
}
.book-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;
  position:relative;z-index:1;
}
.book-display{
  position:relative;display:flex;justify-content:center;
}
.book-display .book-wrap{width:min(360px,100%);}
.audience{
  display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:28px;
}
.audience-card{
  background:#fff;border-radius:var(--r-lg);padding:22px;
  border:1px solid rgba(75,46,31,.08);box-shadow:var(--shadow-soft);
}
.audience-card.kids{background:linear-gradient(180deg,#FFF4DC,#FFE3B5)}
.audience-card.adults{background:linear-gradient(180deg,#EAF1F7,#D4E1EB)}
.audience-card h4{
  font-family:var(--font-display);color:var(--choco);margin:8px 0 8px;
  font-size:20px;font-weight:600;
}
.audience-card p{font-size:14.5px;margin:0}
.pill-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}
.pill{
  background:#fff;border:1px solid rgba(75,46,31,.12);
  padding:8px 14px;border-radius:999px;font-size:13px;font-weight:700;color:var(--choco);
}
.pill .dot{width:7px;height:7px;border-radius:50%;display:inline-block;margin-right:7px;background:var(--coral);vertical-align:middle}
.pill:nth-child(2) .dot{background:var(--butter)}
.pill:nth-child(3) .dot{background:var(--sky)}
.pill:nth-child(4) .dot{background:var(--heart)}

/* ============ SERIES ============ */
.series-sec{
  padding:140px 0;position:relative;
  background:linear-gradient(180deg, transparent 0%, #EBF2F7 10%, #EBF2F7 90%, transparent 100%);
}
.series-sec::before{
  content:"";position:absolute;inset:0;opacity:.45;pointer-events:none;
  background:
    radial-gradient(600px 300px at 15% 30%, rgba(182,201,214,.55), transparent 60%),
    radial-gradient(500px 280px at 85% 70%, rgba(244,185,168,.45), transparent 60%);
}
.series-head{
  text-align:center;max-width:720px;margin:0 auto 52px;position:relative;z-index:1;
}
.series-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:22px;
  position:relative;z-index:1;
}

/* --- Flip card --- */
.flip-card{
  perspective:1100px;height:400px;cursor:pointer;
}
.flip-inner{
  position:relative;width:100%;height:100%;
  transform-style:preserve-3d;
  transition:transform .65s cubic-bezier(.4,0,.2,1);
}
.flip-card:hover .flip-inner{
  transform:rotateY(180deg);
}
.flip-front,
.flip-back{
  position:absolute;inset:0;
  backface-visibility:hidden;-webkit-backface-visibility:hidden;
  border-radius:var(--r-lg);overflow:hidden;
  box-shadow:var(--shadow-soft);
}
.flip-front{background:var(--peach)}
.flip-front img{width:100%;height:100%;object-fit:cover;display:block}
.flip-label{
  position:absolute;bottom:0;left:0;right:0;
  padding:14px 16px 16px;
  background:linear-gradient(to top, rgba(44,27,16,.70) 0%, transparent 100%);
  color:#fff;font-family:var(--font-display);font-size:17px;font-weight:600;
}
.flip-back{
  transform:rotateY(180deg);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:28px 24px;text-align:center;
  background:linear-gradient(135deg,#B6C9D6 0%,#8AADBF 100%);
}
.flip-back h4{
  font-family:var(--font-display);color:var(--choco);
  font-size:20px;font-weight:700;margin:0 0 12px;
}
.flip-back p{font-size:14.5px;color:var(--choco-soft);line-height:1.6;margin:0}
.flip-card:nth-child(2) .flip-back{background:linear-gradient(135deg,#FFE5C5 0%,#F7C498 100%)}
.flip-card:nth-child(3) .flip-back{background:linear-gradient(135deg,#FFF4D4 0%,#F0CC5A 100%)}
.flip-card:nth-child(4) .flip-back{background:linear-gradient(135deg,#F4B9A8 0%,#E87A47 100%)}
.flip-card:nth-child(4) .flip-back h4,
.flip-card:nth-child(4) .flip-back p{color:#fff}
.flip-card:nth-child(5) .flip-back{background:linear-gradient(135deg,#EAF1F7 0%,#B6C9D6 100%)}
.flip-card:nth-child(6) .flip-back{background:linear-gradient(135deg,#FFF4D4 0%,#F0CC5A 100%)}

/* ============ TESTIMONIALS ============ */
.testi{padding:140px 0;position:relative;overflow:hidden}
.testi-head{text-align:center;max-width:720px;margin:0 auto 48px}
.testi-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:22px;
}
.quote{
  background:#fff;border-radius:var(--r-lg);
  padding:28px 26px;border:1px solid rgba(75,46,31,.08);
  box-shadow:var(--shadow-soft);
  position:relative;transform:rotate(var(--tilt,0deg));
  transition:transform .3s ease;
}
.quote:hover{transform:rotate(0deg) translateY(-4px)}
.quote:nth-child(1){--tilt:-1.2deg;background:linear-gradient(180deg,#fff,#FFF5E4)}
.quote:nth-child(2){--tilt:.8deg;background:linear-gradient(180deg,#fff,#FCE7D7)}
.quote:nth-child(3){--tilt:-.6deg;background:linear-gradient(180deg,#fff,#ECEFF3)}
.quote .mark{
  font-family:var(--font-display);font-size:64px;line-height:.2;color:var(--coral);
  display:block;margin-bottom:10px;
}
.quote p{font-size:16px;color:var(--choco);font-style:italic;margin:0 0 20px}
.author{display:flex;align-items:center;gap:12px}
.avatar{
  width:44px;height:44px;border-radius:50%;flex:none;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-weight:700;color:#fff;font-size:17px;
  box-shadow:0 4px 10px rgba(75,46,31,.2);
}
.author strong{font-family:var(--font-display);display:block;color:var(--choco);font-size:15px;font-weight:600}
.author span{font-size:13px;color:var(--choco-soft)}
.stars-row{color:var(--coral);letter-spacing:3px;margin-bottom:10px;font-size:14px}

/* ============ AUTHOR ============ */
.author-sec{padding:140px 0;position:relative}
.author-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:70px;align-items:center}
.author-photo-wrap{
  position:relative;
}
.author-photo{
  border-radius:var(--r-xl);overflow:hidden;
  background:linear-gradient(180deg,#F7D9B8,#EEBA91);
  box-shadow:var(--shadow-lift);
  border:6px solid #FFF8EC;
  position:relative;
  outline:1px solid rgba(75,46,31,.1);
}
.author-photo img{
  width:100%;height:100%;object-fit:cover;object-position:center 22%;
  filter:saturate(.92) contrast(1.02) brightness(1.03) sepia(.06);
}
.author-photo::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(120% 60% at 50% 0%, rgba(255,237,205,.35), transparent 55%),
    radial-gradient(140% 70% at 50% 120%, rgba(232,122,71,.18), transparent 55%);
  mix-blend-mode:soft-light;
}
.author-badge{
  position:absolute;bottom:-22px;right:-22px;
  background:var(--coral);color:#fff;border-radius:50%;
  width:130px;height:130px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;font-family:var(--font-display);font-weight:600;line-height:1.1;
  box-shadow:0 20px 30px -10px rgba(232,122,71,.55);
  transform:rotate(-8deg);
}
.author-badge .big{font-size:28px;display:block}
.author-badge .small{font-size:11px;text-transform:uppercase;letter-spacing:.15em;font-family:var(--font-body);font-weight:700}
.author-sig{
  font-family:var(--font-display);font-style:italic;font-size:32px;color:var(--coral-dk);
  margin-top:18px;border-top:1px dashed rgba(75,46,31,.2);padding-top:18px;display:inline-block;
}

/* ============ STORE ============ */
.store{padding:140px 0;background:linear-gradient(180deg,transparent,#FFEAD0 20%,#FFEAD0 80%,transparent)}
.store-head{text-align:center;max-width:640px;margin:0 auto 44px}
.store-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.product{
  background:#fff;border-radius:var(--r-lg);overflow:hidden;
  border:1px solid rgba(75,46,31,.08);box-shadow:var(--shadow-soft);
  transition:transform .25s ease, box-shadow .25s ease;
  display:flex;flex-direction:column;
}
.product:hover{transform:translateY(-6px);box-shadow:var(--shadow-lift)}
.product-img{
  aspect-ratio: 4/3;background:linear-gradient(135deg,#FFE5C5,#F7D9B8);
  display:flex;align-items:center;justify-content:center;font-size:64px;
  position:relative;overflow:hidden;
}
.product-img.p2{background:linear-gradient(135deg,#EAF1F7,#C9DAE6)}
.product-img.p3{background:linear-gradient(135deg,#FFF4D4,#F5D56B)}
.product-img .tag-new{
  position:absolute;top:12px;left:12px;background:var(--heart);color:#fff;
  padding:4px 10px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.1em;
}
.product-info{padding:20px 22px 22px;flex:1;display:flex;flex-direction:column}
.product-info h4{font-family:var(--font-display);font-size:20px;color:var(--choco);margin:0 0 6px;font-weight:600}
.product-info p{font-size:14px;margin:0 0 14px;flex:1}
.price-row{display:flex;justify-content:space-between;align-items:center;margin-top:auto}
.price{font-family:var(--font-display);font-size:22px;color:var(--coral-dk);font-weight:600}
.add{
  display:inline-block;background:var(--choco);color:#fff;border:0;border-radius:999px;
  padding:9px 16px;font-weight:700;font-size:13px;cursor:pointer;
  transition:background .2s ease;font-family:inherit;text-decoration:none;
}
.add:hover{background:var(--coral)}

/* ============ AMAZON CTA ============ */
.amazon-cta{padding:120px 0;position:relative}
.amazon-card{
  background:linear-gradient(135deg,#4B2E1F 0%, #2C1B10 100%);
  color:#FFEFD6;border-radius:var(--r-xl);padding:60px;
  display:grid;grid-template-columns:1.3fr 1fr;gap:60px;align-items:center;
  position:relative;overflow:hidden;
  box-shadow:var(--shadow-lift);
}
.amazon-card::before{
  content:"";position:absolute;inset:0;opacity:.25;pointer-events:none;
  background:
    radial-gradient(500px 280px at 15% 100%, rgba(245,213,107,.6), transparent 60%),
    radial-gradient(500px 280px at 100% 10%, rgba(232,122,71,.5), transparent 60%);
}
.amazon-card h2{color:#FFF3D8;margin:10px 0 14px;position:relative}
.amazon-card p{color:#F4D9B5;max-width:46ch;position:relative}
.amazon-card .eyebrow{background:rgba(245,213,107,.2);color:var(--butter);position:relative}
.amazon-card .btn{background:var(--butter);color:var(--choco);box-shadow:0 14px 30px -10px rgba(245,213,107,.6)}
.amazon-card .btn:hover{background:#FFE18A}
.amazon-card .btn.ghost{background:transparent;color:#FFEFD6;box-shadow:inset 0 0 0 2px rgba(255,239,214,.5)}
.amazon-card .btn.ghost:hover{background:rgba(255,239,214,.12);color:#fff}
.amazon-visual{
  position:relative;display:flex;justify-content:center;align-items:center;
}
.amazon-visual .book-wrap{width:min(280px,100%);transform:rotate(4deg)}
.formats{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap;position:relative}
.format{
  background:rgba(255,239,214,.1);border:1px solid rgba(255,239,214,.3);
  color:#FFEFD6;padding:8px 14px;border-radius:999px;font-weight:700;font-size:13px;
}

/* ============ CONTACT ============ */
.contact{padding:140px 0}
.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:70px;align-items:start}
.contact-copy .eyebrow{margin-bottom:10px}
.contact-tips{margin-top:28px;display:grid;gap:14px}
.contact-tip{display:flex;gap:14px;align-items:flex-start;background:#fff;border-radius:var(--r-md);padding:16px 18px;border:1px solid rgba(75,46,31,.08)}
.contact-tip .bubble{
  width:38px;height:38px;border-radius:50%;flex:none;
  display:flex;align-items:center;justify-content:center;font-size:18px;
  background:var(--peach);color:var(--coral-dk);
}
.contact-tip strong{font-family:var(--font-display);color:var(--choco);font-size:15px;display:block;font-weight:600}
.contact-tip span{font-size:13.5px;color:var(--choco-soft)}

.form{
  background:#fff;border-radius:var(--r-lg);padding:32px;
  border:1px solid rgba(75,46,31,.1);box-shadow:var(--shadow-lift);
  display:grid;gap:16px;
}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-weight:700;font-size:13px;color:var(--choco)}
.field input, .field select, .field textarea{
  font-family:inherit;font-size:15px;
  padding:13px 14px;border-radius:12px;
  border:1.5px solid #EADDC6;background:#FFFBF3;
  transition:border-color .2s, box-shadow .2s;color:var(--ink);
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none;border-color:var(--coral);
  box-shadow:0 0 0 4px rgba(232,122,71,.15);
}
.field textarea{resize:vertical;min-height:120px}
.field .err{color:var(--heart);font-size:12px;font-weight:700;display:none}
.field.invalid .err{display:block}
.field.invalid input, .field.invalid textarea, .field.invalid select{border-color:var(--heart)}
.checkbox{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--choco-soft)}
.checkbox input{width:18px;height:18px;accent-color:var(--coral)}
.form-success{
  background:#EAF7E8;border:1px solid #A8D5A4;color:#2D6A2A;
  padding:14px 16px;border-radius:12px;font-weight:700;display:none;
}
.form-success.show{display:block}

/* ============ FOOTER ============ */
footer{
  background:var(--choco);color:#F4D9B5;padding:60px 0 30px;margin-top:40px;
  position:relative;
}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;margin-bottom:40px}
.foot-brand{font-family:var(--font-display);font-size:28px;color:#FFEFD6;margin:0 0 8px;font-weight:600}
.foot-grid p{color:#C9B08F;font-size:14px}
.foot-grid h5{font-family:var(--font-body);font-weight:800;color:#FFEFD6;text-transform:uppercase;font-size:12px;letter-spacing:.15em;margin:0 0 14px}
.foot-grid a{display:block;color:#C9B08F;text-decoration:none;padding:4px 0;font-size:14px}
.foot-grid a:hover{color:var(--butter)}
.foot-bottom{border-top:1px solid rgba(255,239,214,.15);padding-top:24px;display:flex;justify-content:space-between;font-size:13px;color:#A69377}

/* ============ REVEAL ON SCROLL ============ */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .8s cubic-bezier(.2,.8,.2,1), transform .8s cubic-bezier(.2,.8,.2,1)}
.reveal.in{opacity:1;transform:translateY(0)}
.reveal.delay-1{transition-delay:.1s}
.reveal.delay-2{transition-delay:.2s}
.reveal.delay-3{transition-delay:.3s}

/* ============ Decorative sparkles (absolute) ============ */
.spark{
  position:absolute;pointer-events:none;color:var(--butter);z-index:0;
  filter:drop-shadow(0 0 8px rgba(245,213,107,.5));
}

/* ============ RESPONSIVE ============ */
@media (max-width:900px){
  .hero{padding:110px 0 60px}
  .hero-grid,.meet-grid,.book-grid,.author-grid,.contact-grid{grid-template-columns:1fr;gap:40px}
  .hero-book{order:-1}
  .traits,.audience{grid-template-columns:1fr 1fr}
  .testi-grid,.store-grid{grid-template-columns:1fr}
  .series-grid{grid-template-columns:1fr 1fr}
  .amazon-card{grid-template-columns:1fr;padding:40px 28px;text-align:center}
  .amazon-card .hero-cta-row{justify-content:center}
  .foot-grid{grid-template-columns:1fr 1fr;gap:30px}
  .foot-bottom{flex-direction:column;gap:8px;text-align:center}
  .form-row{grid-template-columns:1fr}
  .author-badge{width:100px;height:100px;bottom:-16px;right:-16px}
  .author-badge .big{font-size:22px}
}
@media (max-width:500px){
  .traits,.audience,.foot-grid,.series-grid{grid-template-columns:1fr}
  .nav-brand .label {display: none;}
}