:root{
  --cream:#fff6e6;
  --cream2:#fffaf0;
  --gold:#ffc857;
  --gold2:#f7a928;
  --amber:#c97823;
  --charcoal:#2b221d;
  --brown:#4a2b16;
  --coral:#ff7a6a;
  --blue:#182c4c;
  --moon:#6b7fa6;
  --plum:#6b4a6e;
  --white:#ffffff;
  --shadow: 0 24px 80px rgba(76,38,0,.22);
  --radius: 28px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color:var(--charcoal);
  background:
    radial-gradient(circle at 20% 0%, rgba(255,200,87,.35), transparent 35%),
    radial-gradient(circle at 80% 20%, rgba(255,122,106,.16), transparent 28%),
    linear-gradient(180deg, #fff8ea 0%, #fff3db 48%, #fffaf0 100%);
  overflow-x:hidden;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.35;
  background-image:
    linear-gradient(rgba(255,255,255,.35) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.28) 1px, transparent 1px);
  background-size:60px 60px;
  mask-image:linear-gradient(to bottom, black, transparent 70%);
  z-index:-2;
}

.ambient{position:fixed; inset:0; pointer-events:none; overflow:hidden; z-index:-1}
.orb{position:absolute; border-radius:999px; filter:blur(24px); opacity:.35; animation:floaty 12s ease-in-out infinite}
.orb-a{width:360px;height:360px;background:var(--gold);left:-120px;top:14%}
.orb-b{width:260px;height:260px;background:var(--coral);right:-60px;top:34%;animation-delay:-3s}
.orb-c{width:300px;height:300px;background:#ffe7a8;left:52%;bottom:-120px;animation-delay:-6s}
@keyframes floaty{50%{transform:translate3d(18px,-28px,0) scale(1.05)}}

.site-header{
  position:fixed;
  top:18px;
  left:50%;
  transform:translateX(-50%);
  width:min(1120px, calc(100% - 32px));
  z-index:50;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 12px 10px 16px;
  border:1px solid rgba(255,255,255,.55);
  border-radius:999px;
  background:rgba(255,250,240,.72);
  backdrop-filter: blur(16px);
  box-shadow:0 12px 40px rgba(79,44,0,.12);
}
.brand-lockup{display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--brown); font-weight:800; letter-spacing:.01em}
.brand-lockup img{width:36px;height:36px;border-radius:50%}
.site-nav{display:flex;align-items:center;gap:6px}
.site-nav a{color:var(--brown); text-decoration:none; font-weight:700; font-size:.92rem; padding:10px 13px; border-radius:999px}
.site-nav a:hover{background:rgba(255,200,87,.22)}
.nav-pill{background:var(--charcoal)!important;color:#fff!important}
.nav-toggle{display:none; border:0; background:var(--charcoal); color:#fff; border-radius:999px; width:40px; height:40px; font-size:1.1rem}

.hero-shell{
  position:relative;
  min-height:100vh;
  display:grid;
  place-items:center;
  overflow:hidden;
  isolation:isolate;
}
.hero-bg{
  position:absolute;
  inset:0;
  background-image:url("assets/youtube-banner-2048x1152.jpg");
  background-size:cover;
  background-position:center;
  transform:scale(1.03);
  animation:slowZoom 16s ease-in-out infinite alternate;
  z-index:-3;
}
@keyframes slowZoom{to{transform:scale(1.09)}}
.hero-overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(circle at center, rgba(255,255,255,.48) 0%, rgba(255,239,185,.18) 32%, rgba(135,71,0,.24) 100%),
    linear-gradient(180deg, rgba(255,246,230,.18), rgba(255,246,230,.50));
  z-index:-2;
}
.hero-safe{
  width:min(860px, calc(100% - 36px));
  padding:150px 22px 90px;
  text-align:center;
}
.chuckle-stage{
  width:180px;
  height:180px;
  margin:0 auto 12px;
  position:relative;
  display:grid;
  place-items:center;
}
.chuckle-face{
  width:100%;
  height:100%;
  object-fit:contain;
  filter:drop-shadow(0 20px 38px rgba(255, 167, 0, .35));
  animation:chuckleBob 4.5s ease-in-out infinite;
  position:relative;
  z-index:3;
}
@keyframes chuckleBob{50%{transform:translateY(-9px) rotate(-1.2deg)}}
.halo-pulse,.light-ring{
  position:absolute; inset:0; border-radius:50%;
  background:radial-gradient(circle, rgba(255,217,111,.45), transparent 62%);
  animation:haloBloom 3.6s ease-in-out infinite;
}
.light-ring{border:1px solid rgba(255,255,255,.55); background:transparent}
.ring-one{animation-delay:.8s}.ring-two{animation-delay:1.6s}
@keyframes haloBloom{0%,100%{transform:scale(.85);opacity:.15}50%{transform:scale(1.55);opacity:.55}}

.eyebrow{
  text-transform:uppercase;
  letter-spacing:.22em;
  font-weight:900;
  color:var(--amber);
  font-size:.82rem;
  margin:0 0 10px;
}
h1,h2,h3{
  font-family: Georgia, "Times New Roman", serif;
  margin:0;
  color:var(--brown);
  letter-spacing:-.03em;
}
h1{font-size:clamp(3rem, 9vw, 7.3rem); line-height:.92; text-shadow:0 2px 26px rgba(255,255,255,.65)}
.subhero{font-family:Georgia,serif;font-size:clamp(1.25rem,3vw,2.2rem);margin:18px 0 28px;color:#7b4211}
.hero-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:48px; padding:0 20px; border-radius:999px;
  text-decoration:none; font-weight:900; transition:.25s ease; border:1px solid rgba(74,43,22,.15)
}
.btn.primary{background:linear-gradient(135deg,var(--gold),#ffe29a); color:var(--brown); box-shadow:0 12px 34px rgba(247,169,40,.35)}
.btn.ghost{background:rgba(255,255,255,.46);color:var(--brown);backdrop-filter:blur(10px)}
.btn:hover{transform:translateY(-3px)}
.scroll-cue{position:absolute;bottom:22px;font-size:2rem;color:rgba(74,43,22,.55);animation:bounce 1.8s infinite}
@keyframes bounce{50%{transform:translateY(7px)}}

.section{
  width:min(1180px, calc(100% - 34px));
  margin:0 auto;
  padding:92px 0;
}
.section-head{max-width:800px;margin:0 auto 36px;text-align:center}
.section-head h2{font-size:clamp(2rem,5vw,4rem);line-height:1.02}
.section-head p{font-size:1.1rem;line-height:1.8;color:#64452e}
.ritual-grid,.podcast-panel{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:34px;
  align-items:center;
}
.daily-card{
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow);
  border:1px solid rgba(255,255,255,.7);
  background:#fff;
}
.daily-card img,.podcast-art img{width:100%;display:block}
.tilt-card{transform-style:preserve-3d; transition:transform .15s ease}
.ritual-copy,.podcast-copy,.join-card{
  background:rgba(255,250,240,.68);
  border:1px solid rgba(255,255,255,.72);
  box-shadow:var(--shadow);
  border-radius:var(--radius);
  padding:34px;
  backdrop-filter:blur(16px);
}
.ritual-copy p,.podcast-copy p{font-size:1.07rem;line-height:1.8;color:#64452e}
.mini-chuckle{display:flex;align-items:center;gap:16px;margin-bottom:22px}
.mini-chuckle img{width:72px;height:72px;border-radius:22px}
.mini-chuckle strong{display:block;font-family:Georgia,serif;font-size:1.8rem;color:var(--brown)}
.mini-chuckle span{color:#7b4211}
.quiet{font-style:italic}
.podcast-panel{
  width:min(1180px, calc(100% - 34px));
  background:
    linear-gradient(135deg, rgba(43,34,29,.88), rgba(88,45,17,.78)),
    url("assets/podcast-cover.png") center/cover;
  border-radius:42px;
  padding:38px;
  color:#fff;
  box-shadow:var(--shadow);
}
.podcast-art img{border-radius:28px;box-shadow:0 26px 70px rgba(0,0,0,.36)}
.podcast-copy h2,.podcast-copy p,.podcast-copy .eyebrow{color:#fff}
.episode-flow{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:24px}
.episode-flow span{
  background:rgba(255,255,255,.13);
  border:1px solid rgba(255,255,255,.22);
  border-radius:18px;
  padding:14px;
  font-weight:800;
}

.pillar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.pillar,.lane,.asset{
  background:rgba(255,250,240,.72);
  border:1px solid rgba(255,255,255,.74);
  box-shadow:0 16px 44px rgba(87,51,9,.12);
  border-radius:24px;
  padding:24px;
  backdrop-filter:blur(10px);
}
.pillar span{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:14px;background:rgba(255,200,87,.28);font-weight:900;color:var(--amber)}
.pillar h3,.lane h3{font-size:1.65rem;margin:14px 0 8px}
.pillar p,.lane p{line-height:1.65;color:#67482f;margin:0}

.lanes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.lane{min-height:220px;position:relative;overflow:hidden}
.lane::after{content:"";position:absolute;right:-40px;bottom:-60px;width:160px;height:160px;border-radius:50%;background:currentColor;opacity:.12}
.lane.gold{color:#c77d00}.lane.amber{color:#ba5a31}.lane.blue{color:#254b81}

.asset-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.asset{text-decoration:none;color:var(--brown);padding:12px;overflow:hidden}
.asset img{width:100%;aspect-ratio:1.35;object-fit:cover;border-radius:18px;display:block;margin-bottom:12px;background:#fff5dd}
.asset strong{display:block;font-size:1.05rem}.asset span{color:#7b5c42;font-size:.9rem}

.join-card{
  max-width:720px;
  margin:auto;
  text-align:center;
}
.join-card img{width:110px;height:110px;object-fit:contain;margin-bottom:10px}
.join-card h2{font-size:clamp(2rem,5vw,3.5rem)}
.join-card p{color:#66452b;line-height:1.7}
.signup{display:flex;gap:10px;margin:26px auto 10px;max-width:520px}
.signup input{flex:1;border:1px solid rgba(74,43,22,.18);border-radius:999px;padding:0 18px;min-height:52px;font-size:1rem;background:#fff}
.signup button{border:0;border-radius:999px;background:var(--charcoal);color:#fff;font-weight:900;padding:0 22px;cursor:pointer}
small{color:#7b5c42}

.site-footer{
  width:min(1180px, calc(100% - 34px));
  margin:0 auto 28px;
  padding:22px;
  border-radius:24px;
  display:flex;justify-content:space-between;gap:20px;align-items:center;
  background:rgba(43,34,29,.92);
  color:#fff;
}
.site-footer strong{display:block}.site-footer span{color:#ffe0a1}
.footer-links{display:flex;gap:14px}
.footer-links a{color:#fff;text-decoration:none;font-weight:800}

[data-reveal]{opacity:0; transform:translateY(22px); transition:opacity .8s ease, transform .8s ease}
[data-reveal].visible{opacity:1; transform:none}

@media (max-width: 820px){
  .nav-toggle{display:block}
  .site-nav{
    position:absolute; right:0; top:58px; display:none; flex-direction:column; align-items:stretch;
    min-width:230px; padding:12px; border-radius:24px; background:rgba(255,250,240,.94); box-shadow:var(--shadow)
  }
  .site-nav.open{display:flex}
  .hero-safe{padding-top:120px}
  .chuckle-stage{width:132px;height:132px}
  .ritual-grid,.podcast-panel{grid-template-columns:1fr}
  .pillar-grid,.asset-grid{grid-template-columns:1fr 1fr}
  .lanes{grid-template-columns:1fr}
  .episode-flow{grid-template-columns:1fr}
  .site-footer{flex-direction:column;text-align:center}
}
@media (max-width: 520px){
  .pillar-grid,.asset-grid{grid-template-columns:1fr}
  .signup{flex-direction:column}
  .signup button{min-height:52px}
  .hero-bg{background-image:url("assets/x-banner-1500x500.jpg");}
}