/* Focus Man™ — styled to match /scam-proof-kids/ (Bungee / Space Grotesk / Plus Jakarta Sans, comic borders) */
:root{--fm-dark:#090D16;--fm-card:#121826;--fm-cyan:#00F0FF;--fm-yellow:#FFE600;--fm-pink:#FF2E7E;--fm-green:#00FF66;--fm-purple:#8B5CF6}
body.fm{background:var(--fm-dark);color:#f1f5f9}
body.fm main{font-family:"Plus Jakarta Sans",var(--font)}
body.fm::before{display:none}
body.fm ::selection{background:var(--fm-yellow);color:#000}
.fm-wrap{position:relative;z-index:1;width:min(100% - 2rem,1120px);margin-inline:auto}
.fm-halftone{background-image:radial-gradient(rgba(255,255,255,.1) 1.5px,transparent 1.5px);background-size:16px 16px}
.fm-dots{background-image:radial-gradient(rgba(0,240,255,.15) 2px,transparent 2px);background-size:20px 20px}
.fm-skew{transform:skew(-8deg)}

/* Hero */
.fm-hero{position:relative;overflow:hidden;padding:2rem 0 3.5rem;text-align:center}
.fm-glow{position:absolute;border-radius:50%;filter:blur(64px);pointer-events:none}
.fm-glow--cyan{width:24rem;height:24rem;top:10%;left:50%;transform:translateX(-50%);background:rgba(0,240,255,.15)}
.fm-glow--pink{width:20rem;height:20rem;bottom:2rem;right:-4rem;background:rgba(255,46,126,.15)}
.fm-badge{display:inline-flex;align-items:center;gap:.5rem;background:var(--fm-card);border:2px solid var(--fm-yellow);padding:.4rem .9rem;border-radius:999px;box-shadow:4px 4px 0 #000;font:900 .75rem/1.2 "Space Grotesk",sans-serif;color:var(--fm-yellow);text-transform:uppercase;letter-spacing:.06em;margin-bottom:1.25rem}
.fm-ping{position:relative;width:.6rem;height:.6rem;border-radius:50%;background:var(--fm-yellow)}
.fm-ping::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--fm-yellow);animation:fm-ping 1.2s cubic-bezier(0,0,.2,1) infinite}
@keyframes fm-ping{75%,100%{transform:scale(2.2);opacity:0}}
.fm-h1{font-family:"Bungee",cursive;font-weight:400;font-size:clamp(2.6rem,11vw,5.5rem);line-height:1;letter-spacing:.02em;color:#fff;text-transform:uppercase;margin:0 0 .75rem;text-shadow:4px 4px 0 #000,0 0 30px rgba(0,240,255,.35)}
.fm-h1 .fm-tm{font-size:.38em;vertical-align:super;color:var(--fm-yellow);margin-left:.05em}
.fm-sub{font:800 clamp(1.1rem,4.4vw,1.75rem)/1.25 "Space Grotesk",sans-serif;color:#e2e8f0;margin:0 auto 1.75rem;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.6rem}
.fm-sub__tag{font-family:"Bungee",cursive;font-weight:400;font-size:.8em;background:var(--fm-yellow);color:#000;border:2px solid #000;border-radius:.6rem;padding:.15rem .6rem;box-shadow:3px 3px 0 #000;transform:rotate(-3deg)}
.fm-video{max-width:960px;margin:0 auto;border:3px solid #000;border-radius:1.25rem;overflow:hidden;background:#000;box-shadow:7px 7px 0 #000,0 0 0 3px var(--fm-cyan),0 0 25px rgba(0,240,255,.4)}
.fm-video video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#000}

/* Sections */
.fm-section{padding:3.5rem 0;border-top:2px solid #1e293b}
.fm-kicker{display:inline-block;font:400 .95rem/1 "Bungee",cursive;letter-spacing:.06em;text-transform:uppercase;color:#000;background:var(--fm-yellow);border:2px solid #000;border-radius:.6rem;padding:.55rem .9rem;box-shadow:4px 4px 0 #000;margin:0 0 1.5rem;transform:skew(-8deg)}
.fm-h2{font:400 clamp(1.8rem,7vw,3rem)/1.08 "Bungee",cursive;color:#fff;text-transform:uppercase;letter-spacing:.02em;margin:0 0 2rem;text-align:center}
.fm-hl-cyan{color:var(--fm-cyan)}
.fm-about .fm-wrap{max-width:820px;text-align:center}
.fm-bubble{position:relative;background:var(--fm-card);border:3px solid #000;border-radius:1.25rem;padding:1.5rem 1.35rem;box-shadow:6px 6px 0 var(--fm-cyan);text-align:left}
.fm-bubble p{color:#cbd5e1;font-size:1.05rem;line-height:1.65;margin:0}
.fm-bubble p + p{margin-top:.9rem}
.fm-bubble .fm-lead{font:700 clamp(1.2rem,4.6vw,1.6rem)/1.35 "Space Grotesk",sans-serif;color:#fff}
.fm-bubble strong{color:var(--fm-yellow)}

/* Coming soon */
.fm-soon{padding-bottom:4.5rem}
.fm-soon__box{max-width:760px;margin:0 auto;text-align:center;background:var(--fm-yellow);color:#000;border:3px solid #000;border-radius:1.5rem;padding:2.25rem 1.25rem;box-shadow:10px 10px 0 var(--fm-pink);animation:fm-pulse 3s ease-in-out infinite}
.fm-h2--dark{color:#000;margin-bottom:.75rem}
.fm-soon__box p{font:800 clamp(1.1rem,4.5vw,1.5rem)/1.35 "Space Grotesk",sans-serif;margin:0}
@keyframes fm-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.02)}}

@media (min-width:768px){.fm-hero{padding:4rem 0 5rem}.fm-section{padding:5rem 0}.fm-bubble{padding:2rem 2.25rem}}
@media (prefers-reduced-motion:reduce){.fm-ping::after,.fm-soon__box{animation:none}}

/* ===== Character scenes (v2) ===== */
.fm-chars{position:relative;border-top:2px solid #1e293b;padding:3.5rem 0 1rem;overflow:hidden;overflow:clip}
.fm-chars__head .fm-h2{margin-bottom:1rem}
.fm-scene{--c:var(--fm-cyan);--cr:0,240,255;position:relative;display:grid;grid-template-columns:1fr;align-items:center;width:min(100% - 2rem,1120px);margin:0 auto;padding:2.25rem 0}
.fm-scene--pink{--c:var(--fm-pink);--cr:255,46,126}
.fm-scene--yellow{--c:var(--fm-yellow);--cr:255,230,0}
.fm-scene--green{--c:var(--fm-green);--cr:0,255,102}
.fm-scene--purple{--c:var(--fm-purple);--cr:139,92,246}
.fm-scene__stage{position:relative;display:flex;justify-content:center;align-items:flex-end;min-height:400px;container-type:inline-size;isolation:isolate}
.fm-scene__ghost{position:absolute;left:-6%;right:-6%;bottom:2%;top:auto;display:flex;flex-direction:column;align-items:center;text-align:center;z-index:0;pointer-events:none;
  font:400 min(calc(118cqi / (var(--gl) * .74)),13rem)/.84 "Bungee",cursive;letter-spacing:.01em;color:transparent;-webkit-text-stroke:1.5px rgba(var(--cr),.42);user-select:none;white-space:nowrap}
.fm-scene__ghost span{display:block}
.fm-scene__glow{position:absolute;z-index:0;left:50%;top:52%;width:min(92cqi,560px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;
  background:radial-gradient(circle,rgba(var(--cr),.42) 0%,rgba(var(--cr),.16) 40%,transparent 68%);filter:blur(6px)}
.fm-scene__ring{position:absolute;z-index:1;left:50%;top:46%;width:min(64cqi,360px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;
  border:3px solid #000;background-color:rgba(var(--cr),.92);box-shadow:7px 7px 0 #000;
  background-image:radial-gradient(rgba(0,0,0,.22) 1.6px,transparent 1.8px);background-size:12px 12px}
.fm-scene picture{position:relative;z-index:2;display:block;line-height:0}
.fm-scene__img{display:block;height:min(400px,105cqi);width:auto;max-width:100%;object-fit:contain;filter:drop-shadow(0 14px 22px rgba(0,0,0,.55)) drop-shadow(4px 4px 0 rgba(0,0,0,.35))}
.fm-scene__empty{position:relative;z-index:2;height:min(400px,105cqi);width:1px}
.fm-scene__text{position:relative;z-index:3;text-align:center;margin-top:1.25rem}
.fm-scene__name{margin:0 0 1rem;font:400 clamp(2.1rem,9.5vw,4.6rem)/.95 "Bungee",cursive;letter-spacing:.02em;color:#fff;text-transform:uppercase;
  text-shadow:3px 3px 0 #000,6px 6px 0 var(--c);overflow-wrap:anywhere}
.fm-scene__callout{position:relative;display:inline-block;max-width:30rem;margin:0;text-align:left;background:var(--fm-card);border:3px solid #000;border-radius:1rem;
  padding:1rem 1.15rem 1rem 1.35rem;box-shadow:6px 6px 0 var(--c);font:700 clamp(1.05rem,4.2vw,1.35rem)/1.4 "Space Grotesk",sans-serif;color:#f1f5f9}
.fm-scene__callout::before{content:"";position:absolute;left:.55rem;top:.8rem;bottom:.8rem;width:4px;border-radius:4px;background:var(--c)}
.fm-scene__callout::after{content:"";position:absolute;top:-15px;left:50%;margin-left:-12px;border-width:0 12px 14px;border-style:solid;border-color:transparent transparent #000}
.fm-scene__name .nw{white-space:nowrap}
.fm-scene[data-art="missing"] .fm-scene__ring{background:transparent;border:3px dashed rgba(var(--cr),.85);box-shadow:none}
.fm-scene[data-art="missing"] .fm-scene__stage{min-height:340px}
.fm-scene[data-art="missing"] .fm-scene__empty{height:300px}
.fm-scene--lead .fm-scene__name{font-size:clamp(2.8rem,13vw,6rem)}
@media (min-width:768px){
  .fm-chars{padding:5rem 0 2rem}
  .fm-scene{grid-template-columns:1.1fr .9fr;gap:2.5rem;padding:3rem 0}
  .fm-scene.is-flip .fm-scene__stage{order:2}
  .fm-scene__stage{min-height:600px}
  .fm-scene__img,.fm-scene__empty{height:min(600px,120cqi)}
  .fm-scene--lead .fm-scene__img{height:min(640px,125cqi)}
  .fm-scene__text{text-align:left;margin-top:0}
  .fm-scene__callout{font-size:1.45rem;padding:1.15rem 1.35rem 1.15rem 1.6rem}
  .fm-scene__callout::before{left:.7rem}
  .fm-scene[data-art="missing"] .fm-scene__stage{min-height:460px}
  .fm-scene[data-art="missing"] .fm-scene__empty{height:440px}
  .fm-scene.is-flip .fm-scene__text{text-align:right}
  .fm-scene.is-flip .fm-scene__callout{text-align:left}
  .fm-scene__callout::after{top:50%;left:-16px;margin:-12px 0 0;border-width:12px 15px 12px 0;border-color:transparent #000 transparent transparent}
  .fm-scene.is-flip .fm-scene__callout::after{left:auto;right:-16px;border-width:12px 0 12px 15px;border-color:transparent transparent transparent #000}
}
/* scroll-in motion (JS adds .fm-anim to <html>; content stays visible without JS) */
.fm-anim .fm-scene picture,.fm-anim .fm-scene__empty{opacity:0;transform:translate3d(-48px,24px,0) scale(.97);transition:opacity .8s ease,transform .9s cubic-bezier(.2,.8,.2,1)}
.fm-anim .fm-scene.is-flip picture,.fm-anim .fm-scene.is-flip .fm-scene__empty{transform:translate3d(48px,24px,0) scale(.97)}
.fm-anim .fm-scene__text{opacity:0;transform:translate3d(0,28px,0);transition:opacity .7s ease .15s,transform .8s cubic-bezier(.2,.8,.2,1) .15s}
.fm-anim .fm-scene__ring,.fm-anim .fm-scene__ghost{opacity:0;transition:opacity .9s ease,transform 1s cubic-bezier(.2,.8,.2,1)}
.fm-anim .fm-scene__ring{transform:translate(-50%,-50%) scale(.6)}
.fm-anim .fm-scene.is-in picture,.fm-anim .fm-scene.is-in .fm-scene__empty,.fm-anim .fm-scene.is-in .fm-scene__text{opacity:1;transform:none}
.fm-anim .fm-scene.is-in .fm-scene__ring{opacity:1;transform:translate(-50%,-50%) scale(1)}
.fm-anim .fm-scene.is-in .fm-scene__ghost{opacity:1}
@media (prefers-reduced-motion:reduce){.fm-anim .fm-scene *{transition:none!important}}
/* v3: landscape scene (Uncle Stetson + coupe) — never upscaled past the 773px-wide source */
.fm-scene--wide .fm-scene__stage{min-height:0;padding-top:2rem}
.fm-scene--wide picture{width:100%;max-width:773px}
.fm-scene--wide .fm-scene__img{width:100%;height:auto;max-width:773px}
.fm-scene--wide .fm-scene__ghost{bottom:auto;top:0}
@media (min-width:768px){
  .fm-scene--wide{grid-template-columns:1.35fr .65fr}
  .fm-scene--wide.is-flip{grid-template-columns:.65fr 1.35fr}
  .fm-scene--wide .fm-scene__stage{min-height:480px;align-items:center}
  .fm-scene--wide .fm-scene__img{height:auto}
}
@media (min-width:768px){.fm-scene--wide .fm-scene__name{font-size:clamp(2rem,4vw,3.2rem);overflow-wrap:normal}}

/* ===== Ten Doors Planner product section (added 2026-10-22, scoped to .fm-planner) ===== */
.fm-planner .fm-wrap{max-width:1040px}
.fm-planner__grid{display:grid;grid-template-columns:1fr;gap:2rem;align-items:center}
.fm-planner__art{width:100%;max-width:420px;margin:0 auto;border:3px solid #000;border-radius:1.25rem;overflow:hidden;box-shadow:7px 7px 0 #000,0 0 0 3px var(--fm-yellow)}
.fm-planner__art picture{display:block}
.fm-planner__art img{display:block;width:100%;height:auto}
.fm-planner .fm-h2{text-align:left;margin-bottom:1.25rem}
.fm-planner__list{list-style:none;margin:1.25rem 0 0;padding:0;display:grid;gap:.55rem}
.fm-planner__list li{position:relative;padding-left:1.6rem;color:#cbd5e1;font-size:1rem;line-height:1.55}
.fm-planner__list li::before{content:"";position:absolute;left:0;top:.45em;width:.8rem;height:.8rem;background:var(--fm-yellow);border:2px solid #000;border-radius:.2rem}
.fm-planner__price{font:800 clamp(1.05rem,4vw,1.3rem)/1.35 "Space Grotesk",sans-serif;color:#fff;margin:1.5rem 0 1rem}
.fm-btn-gold{display:inline-block;font:400 1.05rem/1 "Bungee",cursive;letter-spacing:.04em;text-transform:uppercase;color:#000;background:var(--fm-yellow);border:3px solid #000;border-radius:.8rem;padding:1rem 1.5rem;box-shadow:5px 5px 0 #000;text-decoration:none;transition:transform .12s,box-shadow .12s}
.fm-btn-gold:hover{color:#000;transform:translate(-2px,-2px);box-shadow:7px 7px 0 #000}
.fm-btn-gold:active{transform:translate(3px,3px);box-shadow:1px 1px 0 #000}
@media (max-width:767px){.fm-planner .fm-h2{text-align:center}.fm-btn-gold{display:block;text-align:center}}
@media (min-width:768px){.fm-planner__grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:3rem}}