/* 🤝 creator-page.css: the shared hero for every creator × Poppy page built by scripts/build-creator-page.py (Lance 2026-10-18).
   The page is a clone of the current homepage; only this hero is the creator's. Colors come from two CSS variables the page sets
   on <html> (--cp-dark = their primary, --cp-accent = their highlight), so a brand change is a config edit, never a CSS edit. */
.hero.cp-hero{padding:38px 0 64px;background:#fff}
.cp-hero .wrap{max-width:1100px}
.cp-hero .cp-lockup{display:flex;justify-content:center;align-items:center;gap:22px;margin:12px auto 30px}
.cp-lockup .cp-name{font-family:var(--cp-font,inherit);font-size:27px;font-weight:800;letter-spacing:-1px;color:var(--cp-dark,#204147)}
.cp-lockup .cp-times{color:#9aa8a9;font-size:23px;font-weight:400}
.cp-lockup .cp-poppy{display:flex;align-items:center;gap:8px;font-size:27px;font-weight:800;letter-spacing:-1px;color:var(--cp-dark,#204147)}
.cp-poppy img{width:40px;height:40px;object-fit:contain}
.cp-poppy i{color:var(--cp-accent,#F05B56);font-style:normal}
.cp-hero .hero-badge{font:700 12px/1.3 Inter,sans-serif;letter-spacing:.12em;padding:9px 16px;color:var(--cp-dark,#204147);background:color-mix(in srgb,var(--cp-accent,#F05B56) 8%,#fff);border:1px solid color-mix(in srgb,var(--cp-accent,#F05B56) 28%,#fff);box-shadow:none;margin-bottom:22px;white-space:normal}
.cp-hero h1{font-family:var(--cp-font,inherit);font-size:clamp(36px,5.1vw,66px);font-weight:800;line-height:1.08;letter-spacing:-.035em;max-width:1040px;color:var(--cp-dark,#204147);text-wrap:balance}
.cp-hero h1 span{color:var(--cp-accent,#F05B56)}
.cp-hero p.lede{font-size:19px;line-height:1.65;color:#3B3B3B;max-width:740px;margin:22px auto 0}
.cp-hero .ctarow{margin-top:26px}
.cp-hero .ctarow .btn-p,html.novsl .cp-hero .ctarow .btn-p{background:var(--cp-dark,#204147);color:#fff;min-width:0;justify-content:center;font-size:18px;padding:16px 36px;border-radius:8px;box-shadow:0 8px 24px -12px rgba(0,0,0,.35)}
.cp-hero .ctarow .btn-p:hover{filter:brightness(.92)}
.cp-hero .cp-terms{font-size:13px;line-height:1.65;color:#667578;margin-top:12px}
.cp-hero .cp-terms b{color:var(--cp-dark,#204147);font-weight:600}
.cp-video{max-width:900px;margin:38px auto 0}
.cp-video-stage{position:relative;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#1A1B1C;box-shadow:0 6px 10px -8px rgba(0,0,0,.2),0 24px 70px -35px rgba(0,0,0,.4);border:1px solid #dce4e4}
.cp-video-poster,.cp-video-stage iframe,.cp-video-stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0;display:block}
.cp-video-play{position:absolute;inset:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;cursor:pointer;border:0;background:linear-gradient(180deg,rgba(0,0,0,.04) 35%,rgba(0,0,0,.64));color:white;font-family:Inter,sans-serif}
.cp-video-play:hover .cp-play-icon{transform:scale(1.07);background:#fff}
.cp-play-icon{width:76px;height:76px;border-radius:50%;background:rgba(255,255,255,.96);display:grid;place-items:center;box-shadow:0 4px 28px rgba(0,0,0,.2);transition:transform .2s,background .2s}
.cp-play-icon svg{width:27px;height:27px;fill:var(--cp-dark,#204147);transform:translateX(2px)}
.cp-video-play-label{font-size:16px;font-weight:700;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.cp-video-caption{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:14px;text-align:left;color:#667578;font:400 12px/1.5 Inter,sans-serif}
.cp-video-caption a{color:var(--cp-dark,#204147);text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.cp-hero a:focus-visible,.cp-hero button:focus-visible{outline:3px solid #055ECD;outline-offset:5px}
.cp-video-play:focus-visible{outline-offset:-6px}
.cp-partnership{font-size:12px;color:#667578;margin-top:8px}
@media(max-width:640px){
  .hero.cp-hero{padding:56px 0 44px}
  .cp-hero .wrap{padding:0 20px}
  .cp-hero .cp-lockup{gap:14px;margin:0 auto 25px}
  .cp-lockup .cp-name,.cp-lockup .cp-poppy{font-size:23px}
  .cp-poppy img{width:32px;height:32px}
  .cp-lockup .cp-times{font-size:19px}
  .cp-hero .hero-badge{font-size:10px;letter-spacing:.1em;padding:8px 12px;margin-bottom:18px}
  .cp-hero h1{font-size:clamp(33px,8.6vw,46px);line-height:1.1}
  .cp-hero p.lede{font-size:16px;line-height:1.6;margin:18px auto 0;max-width:500px}
  .cp-hero .ctarow{margin-top:23px}
  .cp-hero .ctarow .btn-p{width:100%;font-size:17px;padding:15px 26px}
  .cp-hero .ctarow>div{width:100%}
  .cp-hero .cp-terms{font-size:11px;max-width:320px;margin:11px auto 0}
  .cp-video{margin-top:28px}
  .cp-video-stage{border-radius:10px}
  .cp-play-icon{width:58px;height:58px}
  .cp-play-icon svg{width:23px;height:23px}
  .cp-video-play-label{font-size:12px}
  .cp-video-caption{font-size:10px;gap:10px;align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){.cp-play-icon{transition:none}}

/* 🙋 the Meet band (Lance 2026-10-18): their photo + the facts their own channel and site state, no quote, no result, no promise */
.cp-meet{background:color-mix(in srgb,var(--cp-accent,#F05B56) 6%,#fff);padding:56px 0;border-top:1px solid color-mix(in srgb,var(--cp-accent,#F05B56) 18%,#fff)}
.cp-meet .wrap{max-width:980px;display:flex;gap:40px;align-items:center}
.cp-meet-photo{width:200px;height:200px;border-radius:50%;object-fit:cover;flex:0 0 200px;border:5px solid #fff;box-shadow:0 12px 32px -14px rgba(0,0,0,.35)}
.cp-meet h2{font-family:var(--cp-font,inherit);font-size:34px;font-weight:800;letter-spacing:-.03em;color:var(--cp-dark,#204147);margin:0 0 12px}
.cp-meet p{font-size:17px;line-height:1.65;color:#3B3B3B;margin:0 0 10px}
.cp-facts{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 12px}
.cp-fact{font:600 13px/1.3 Inter,sans-serif;padding:7px 12px;border-radius:999px;color:var(--cp-dark,#204147);background:#fff;border:1px solid color-mix(in srgb,var(--cp-accent,#F05B56) 35%,#fff)}
.cp-meet-links a{font:600 14px/1.4 Inter,sans-serif;color:var(--cp-accent,#F05B56);text-decoration:none;margin-right:16px}
@media (max-width:720px){.cp-meet .wrap{flex-direction:column;text-align:center}.cp-facts,.cp-meet-links{justify-content:center}}
