:root{--navy:#11263e;--gold:#e6ad3a;--pale:#fff6dd;--teal:#167b79;--ink:#1a2938;--muted:#617080;--line:#e9dfcc;--paper:#fffdf8}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#7bcf56 url("historic-folsom-stinky-socks-style.png") center/cover fixed no-repeat;color:var(--ink);font:16px/1.65 "DM Sans",sans-serif}
header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:30px;padding:14px 6vw;background:#fffdf8ee;border-bottom:1px solid #11263e16;backdrop-filter:blur(14px)}
.brand{display:flex;align-items:center;gap:10px;color:var(--navy);font:700 1rem "Fredoka";letter-spacing:.06em;text-decoration:none}
.brand span{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--gold)}
nav{display:flex;gap:26px}
nav a{color:var(--ink);font-size:.9rem;font-weight:700;text-decoration:none}
nav a:hover{color:var(--teal)}
.linktree{padding:8px 13px;border-radius:999px;background:var(--gold);color:var(--navy)}
.linktree:hover{color:var(--navy);transform:translateY(-1px)}
.mystery-sound-control{position:fixed;left:50%;bottom:82px;z-index:1001;display:flex;align-items:center;gap:10px;min-height:48px;max-width:calc(100vw - 28px);padding:9px 16px 9px 9px;transform:translateX(-50%);border:2px solid #fff;border-radius:999px;background:#11263eee;color:#fff;font:800 .86rem "DM Sans",sans-serif;box-shadow:0 8px 28px #09192c66;cursor:pointer;backdrop-filter:blur(10px);white-space:nowrap}
.mystery-sound-control:hover,.mystery-sound-control:focus-visible{background:#167b79;transform:translateX(-50%) translateY(-2px)}
.mystery-sound-control:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.mystery-sound-control .sound-icon{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--gold);color:var(--navy);font-size:1rem}
.mystery-sound-control.is-playing .sound-icon{animation:mystery-pulse 1.8s ease-in-out infinite}
@keyframes mystery-pulse{50%{box-shadow:0 0 0 7px #e6ad3a44;transform:scale(1.06)}}
.hero{position:relative;isolation:isolate;min-height:680px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:6vw;padding:70px 7vw;background:linear-gradient(90deg,rgba(255,253,248,.95) 0%,rgba(255,249,232,.83) 40%,rgba(255,247,229,.3) 100%),url("historic-folsom-stinky-socks-style.png") center/cover no-repeat}
.hero:after{content:"Historic Folsom, California";position:absolute;z-index:-1;right:7vw;bottom:22px;padding:7px 12px;border-radius:999px;background:#fffdf8d9;color:var(--navy);font:700 .72rem "DM Sans";letter-spacing:.08em;box-shadow:0 4px 14px #11263e1a}
.hero>*{position:relative;z-index:1}
.hero-copy{max-width:720px}
.eyebrow{margin:0 0 12px;color:var(--teal);font-size:.78rem;font-weight:800;letter-spacing:.17em}
.hero h1,.heading h2,.book h2,.memory h2,.closing h2{margin:0;color:var(--navy);font-family:"Fredoka";line-height:1.04;letter-spacing:-.035em}
.hero h1{font-size:clamp(3.4rem,6vw,6.6rem)}
.hero h1 em{color:var(--teal);font-style:normal}
.hero-copy>p:not(.eyebrow){max-width:630px;margin:28px 0;color:#48596b;font-size:1.12rem}
.actions{display:flex;flex-wrap:wrap;gap:12px}
.actions a,.amazon,.closing a{display:inline-flex;padding:14px 21px;border-radius:12px;font-weight:800;text-decoration:none}
.primary,.amazon{background:var(--navy);color:#fff;box-shadow:0 10px 24px #11263e2b}
.secondary{border:1px solid var(--line);background:#fff;color:var(--navy)}
figure{margin:0;overflow:hidden;border-radius:28px;background:var(--navy);box-shadow:0 20px 55px #11263e26;transform:rotate(1deg)}
figure img{width:100%;height:490px;display:block;object-fit:cover;object-position:54% 30%}
figcaption{padding:13px;color:#fff;font:600 1rem "Fredoka";text-align:center}
.detective-portrait{display:grid;grid-template-columns:minmax(300px,.9fr) minmax(0,1.1fr);align-items:center;gap:clamp(34px,6vw,84px);padding:86px 7vw;background:linear-gradient(135deg,rgba(9,25,44,.98),rgba(33,55,75,.96));color:#fff}
.detective-art{max-width:560px;justify-self:center;padding:10px;border:2px solid #e6ad3a;border-radius:26px;background:#fff6dd;box-shadow:0 24px 60px #0007;transform:rotate(-1deg)}
.detective-art img{width:100%;display:block;aspect-ratio:2/3;object-fit:cover;border-radius:17px}
.detective-copy{max-width:650px}
.detective-copy .eyebrow{color:#f8d57c}
.detective-copy h2{margin:0;color:#fff;font:600 clamp(2.8rem,5vw,5rem)/1.03 "Fredoka";letter-spacing:-.035em}
.detective-copy>p:not(.eyebrow){margin:22px 0;color:#dbe5ed;font-size:1.12rem}
.crest-note{display:inline-flex;padding:9px 14px;border:1px solid #e6ad3a;border-radius:999px;color:#f8d57c;font-size:.82rem;font-weight:800;letter-spacing:.05em}
.kalimae-game{padding:86px 7vw;background:linear-gradient(135deg,#fff2b8,#f9c54f);text-align:center}
.game-heading{max-width:760px;margin:0 auto 30px}
.game-heading h2{margin:0;color:var(--navy);font:600 clamp(2.7rem,5vw,5rem)/1.03 "Fredoka";letter-spacing:-.035em}
.game-heading>p:last-child{color:#48596b;font-size:1.08rem}
.game-play-counter{width:max-content;max-width:100%;margin:0 auto 30px;padding:12px 22px;border:3px solid var(--navy);border-radius:999px;background:#f2b632;color:#09192c;font:800 1.05rem/1.25 "Nunito",sans-serif;box-shadow:5px 6px 0 var(--navy)}
.game-launcher{position:relative;display:block;width:min(100%,520px);margin:0 auto 28px;overflow:hidden;border:5px solid var(--navy);border-radius:30px;background:#fff7dc;color:#fff;text-decoration:none;box-shadow:10px 12px 0 var(--navy)}
.game-launcher img{width:100%;height:560px;display:block;object-fit:cover;object-position:center 28%}
.game-launcher:after{content:"▶";position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:5rem;text-shadow:0 5px 18px #000;background:#07192b22}
.game-launch-copy{position:absolute;z-index:2;right:0;bottom:0;left:0;display:flex;flex-direction:column;padding:20px;background:linear-gradient(transparent,#07192bf2 32%);text-align:center}
.game-launch-copy strong{font:700 1.45rem "Fredoka"}
.game-launch-copy small{font-size:.85rem}
.game-launcher:hover,.game-launcher:focus-visible{transform:translateY(-3px);box-shadow:12px 16px 0 var(--navy)}
.game-rules{max-width:760px;margin:0 auto 25px;padding:25px;border:3px solid var(--navy);border-radius:22px;background:#fffdf4;text-align:left;box-shadow:6px 7px 0 #20354a}
.game-rules h3{margin:0 0 16px;color:var(--navy);font:600 1.6rem "Fredoka";text-align:center}
.game-rules ol{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin:0;padding:0;list-style:none}
.game-rules li{display:flex;align-items:flex-start;gap:10px;padding:13px;border-radius:14px;background:#eaf7dd}
.game-rules li span{flex:0 0 30px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--gold);color:var(--navy);font-weight:900}
.game-rules p{margin:2px 0 0;color:#48596b;font-size:.92rem;line-height:1.45}
.game-download{display:inline-flex;padding:14px 22px;border-radius:999px;background:var(--coral,#e85d45);color:#fff;font-weight:900;text-decoration:none;box-shadow:0 8px 20px #6c301f35}
.monthly-contest{max-width:760px;margin:34px auto;padding:28px;border:4px solid var(--navy);border-radius:24px;background:#fffdf4;text-align:left;box-shadow:8px 9px 0 var(--navy)}
.contest-badge{display:inline-block;padding:7px 11px;border-radius:999px;background:var(--gold);color:var(--navy);font-size:.78rem;font-weight:900;letter-spacing:.07em}
.monthly-contest h2{margin:12px 0 8px;color:var(--navy);font:700 clamp(1.8rem,4vw,2.7rem) "Fredoka"}
.monthly-contest p,.monthly-contest li{color:#48596b;line-height:1.5}.monthly-contest ol{padding-left:22px}
.monthly-contest a{display:inline-flex;margin:8px 0 14px;padding:14px 20px;border-radius:999px;background:var(--coral,#e85d45);color:#fff;font-weight:900;text-decoration:none}
.monthly-contest small{display:block;color:#66727f;font-size:.78rem;line-height:1.45}
.tiktok-callout{display:grid;grid-template-columns:minmax(260px,420px) 1fr;align-items:center;gap:clamp(34px,6vw,88px);padding:70px 7vw;background:linear-gradient(135deg,rgba(15,105,103,.95),rgba(22,123,121,.91));color:#fff}
.kalimae-video{justify-self:center;width:min(100%,360px);padding:10px;border-radius:30px;background:#fff;box-shadow:0 24px 55px #082d2c55;transform:rotate(-1deg)}
.kalimae-video video{width:100%;aspect-ratio:9/16;display:block;border-radius:21px;background:#071a1a;object-fit:cover}
.tiktok-copy{max-width:680px}
.tiktok-callout .eyebrow{margin:0;color:#dceeed}
.tiktok-callout h2{margin:7px 0 12px;color:#fff;font:600 clamp(2.2rem,4vw,4rem)/1.06 "Fredoka";letter-spacing:-.025em}
.tiktok-copy>p:not(.eyebrow){margin:0 0 23px;color:#dceeed;font-size:1.05rem}
.tiktok-callout a{display:inline-flex;align-items:center;gap:15px;max-width:440px;padding:15px 19px;border-radius:14px;background:var(--gold);color:var(--navy);font-weight:800;line-height:1.35;text-decoration:none;box-shadow:0 10px 24px #0b41402b}
.tiktok-callout a:hover{transform:translateY(-2px);box-shadow:0 14px 28px #0b41403d}
.tiktok-callout strong{font-size:1.25rem}
.friends{padding:100px 7vw;background:rgba(255,255,255,.91);backdrop-filter:blur(2px)}
.heading{max-width:760px;margin-bottom:42px}
.heading h2,.book h2,.memory h2,.closing h2{font-size:clamp(2.5rem,4.4vw,4.4rem)}
.heading>p:last-child{color:var(--muted);font-size:1.05rem}
.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.cards article{overflow:hidden;border:1px solid var(--line);border-radius:24px;background:var(--paper);box-shadow:0 14px 38px #11263e10}
.cards img{width:100%;height:370px;display:block;object-fit:cover}
.cards article:first-child img{object-position:58% 25%}
.cards article:last-child img{object-position:center 35%}
.cards article>div{padding:29px}
.cards small,.memorial small{color:var(--teal);font-weight:800;letter-spacing:.13em}
.cards h3{margin:4px 0 10px;color:var(--navy);font:600 2rem "Fredoka"}
.cards p{color:#536171}
.cards ul{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0;padding:0;list-style:none}
.cards li{padding:6px 11px;border-radius:999px;background:var(--pale);color:var(--navy);font-size:.82rem;font-weight:700}
.book{display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:7vw;padding:100px 7vw;background:rgba(17,38,62,.95);color:#fff}
.book-image{position:relative}
.book-image:after{content:"";position:absolute;inset:16px -16px -16px 16px;border:2px solid var(--gold);border-radius:24px}
.book-image img{position:relative;z-index:1;width:100%;height:480px;display:block;object-fit:cover;object-position:55% 30%;border-radius:24px}
.book .eyebrow{color:#f8d57c}
.book h2{color:#fff}
.book>div:last-child>p:not(.eyebrow){color:#d5dfe8;font-size:1.08rem}
.book .byline{color:#f8d57c!important;font-weight:700}
.amazon{margin-top:9px;background:var(--gold);color:var(--navy)}
.amazon span{margin-left:25px}
.note{display:block;margin-top:12px;color:#aebdca}
.memory{display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:7vw;padding:100px 7vw;background:linear-gradient(145deg,rgba(255,253,248,.94),rgba(255,241,206,.9));backdrop-filter:blur(2px)}
.portrait img{width:100%;height:570px;display:block;object-fit:cover;object-position:center 35%;border-radius:48% 52% 45% 55%/45% 42% 58% 55%;box-shadow:0 18px 48px #11263e1f}
.memory>div:last-child>p:not(.eyebrow){color:#506071}
.memory blockquote{margin:26px 0;padding:18px 0 18px 22px;border-left:4px solid var(--gold);color:var(--navy);font-size:1.15rem;font-style:italic}
.memorial{display:flex;align-items:center;gap:15px;margin-top:25px}
.memorial>span{display:grid;place-items:center;width:55px;height:55px;border-radius:50%;background:var(--navy);font-size:1.5rem}
.memorial p{display:flex;flex-direction:column;margin:0}
.memorial strong{font:600 1.3rem "Fredoka"}
.closing{padding:90px 24px;background:rgba(22,123,121,.93);color:#fff;text-align:center}
.closing>span{font-size:3rem}
.closing h2{color:#fff}
.closing p{color:#dceeed}
.closing a{margin-top:10px;background:var(--gold);color:var(--navy)}
.paw-qr-card{position:relative;overflow:hidden;width:min(100%,360px);margin:38px auto 0;padding:28px 24px 24px;border:3px solid #fff;border-radius:28px;background:#fffdf6;color:var(--navy);box-shadow:0 18px 40px #09192c4d}
.paw-qr-card h3{position:relative;margin:0;font:700 1.6rem "Fredoka";color:var(--navy)}
.paw-qr-card p{position:relative;margin:5px 0 16px;color:#496072;font-size:.95rem}
.closing .paw-qr-link{position:relative;display:block;width:min(100%,250px);margin:0 auto;padding:12px;border-radius:22px;background:#f2b632;box-shadow:0 8px 18px #09192c24}
.paw-qr-link img{display:block;width:100%;height:auto;border-radius:12px}
.paw-qr-card strong{position:relative;display:block;margin-top:14px;font-size:.9rem;letter-spacing:.03em}
.paw-qr-print{position:absolute;color:#f2b632;opacity:.22;font-size:4.5rem;line-height:1;transform:rotate(-20deg)}
.paw-qr-print-one{top:-10px;left:-12px}
.paw-qr-print-two{right:-12px;bottom:-8px;transform:rotate(22deg)}
footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:32px 7vw;background:#09192c;color:#bdcad6;font-size:.86rem}
footer .brand{color:#fff}
.footer-contact{text-align:center}
.footer-contact p{margin:0 0 3px}
.footer-contact a{color:#f8d57c;font-weight:700;text-decoration:none}
.footer-contact a:hover{text-decoration:underline}
.footer-contact .visitor-counter{position:fixed;left:50%;bottom:16px;z-index:1000;width:max-content;max-width:calc(100vw - 28px);margin:0;padding:12px 20px;transform:translateX(-50%);border:3px solid #fff;border-radius:999px;background:#f2b632;color:#09192c;font-size:1rem;font-weight:800;letter-spacing:.01em;box-shadow:0 8px 28px #09192c66,0 0 0 4px #f2b63255;backdrop-filter:blur(8px)}
.footer-contact .privacy-note{max-width:520px;margin:8px auto 0;color:#9fb0c1;font-size:.74rem;line-height:1.45}
.footer-social{padding:9px 14px;border:1px solid #ffffff4a;border-radius:999px;color:#fff;font-weight:700;text-decoration:none}
.footer-social:hover{background:#fff;color:var(--navy)}
.superdave{padding:78px 24px;background:linear-gradient(135deg,#09192c,#183c5f);color:#fff;text-align:center}
.superdave .eyebrow{color:#f8d57c}
.superdave h2{margin:0;color:#fff;font:600 clamp(2.4rem,5vw,4.8rem)/1.05 "Fredoka";letter-spacing:-.035em}
.superdave p:not(.eyebrow){margin:15px auto 25px;color:#d9e4ed;font-size:1.1rem}
.superdave-videos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;max-width:1120px;margin:34px auto}
.superdave-videos article{overflow:hidden;border:1px solid #ffffff30;border-radius:18px;background:#ffffff0d;box-shadow:0 16px 36px #0004}
.superdave-videos iframe{width:100%;aspect-ratio:16/9;display:block;border:0;background:#000}
.superdave-videos h3{margin:0;padding:15px 18px;color:#fff;font:600 1.08rem "Fredoka";text-align:left}
.superdave .superdave-site{display:inline-flex;padding:17px 26px;border-radius:13px;background:var(--gold);color:var(--navy);font-size:1.08rem;font-weight:900;text-decoration:none;box-shadow:0 12px 28px #0005}
.superdave .superdave-site:hover{transform:translateY(-2px);box-shadow:0 16px 32px #0006}
@media(max-width:700px){.superdave-videos{grid-template-columns:1fr}.superdave{padding:65px 20px}}
@media(max-width:900px){nav{display:none}
.hero,.detective-portrait,.book,.memory{grid-template-columns:1fr}
.hero{padding-top:50px}
.detective-copy{text-align:center}
.cards{grid-template-columns:1fr}
figure img{height:400px}
.book-image img,.portrait img{height:420px}
}
.book-trailer{max-width:1180px;margin:34px auto 64px;padding:42px;display:grid;grid-template-columns:1fr minmax(240px,360px);gap:46px;align-items:center;background:linear-gradient(135deg,#fff7d6 0%,#ffe28a 100%);border:3px solid #27361d;border-radius:28px;box-shadow:10px 12px 0 #27361d}.trailer-copy h2{margin:.25rem 0 1rem;font-family:"Fredoka",sans-serif;font-size:clamp(2rem,4vw,3.4rem);line-height:1.02;color:#27361d}.trailer-copy p:not(.eyebrow){font-size:1.1rem;line-height:1.7;color:#3f4b35}.trailer-copy a{display:inline-block;margin-top:1rem;padding:14px 20px;border-radius:999px;background:#d8472d;color:#fff;font-weight:700;text-decoration:none}.trailer-copy a:hover{background:#b93620}.trailer-video{justify-self:center;width:min(100%,320px);padding:10px;background:#27361d;border-radius:24px;box-shadow:0 14px 30px rgba(39,54,29,.22)}.trailer-video video{display:block;width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:16px;background:#000}@media(max-width:760px){.book-trailer{margin:24px 18px 48px;padding:28px 20px;grid-template-columns:1fr;gap:28px;text-align:center;box-shadow:6px 8px 0 #27361d}.trailer-copy a{width:100%;box-sizing:border-box}.trailer-video{width:min(100%,300px)}}
@media(max-width:600px){header{padding:12px 18px}
body{background-attachment:scroll}
.mystery-sound-control{bottom:82px;padding-right:13px;font-size:.78rem}
.brand{font-size:.82rem}
.hero,.detective-portrait,.friends,.book,.memory{padding:65px 20px}
.kalimae-game{padding:65px 20px}
.game-launcher{border-width:4px;box-shadow:6px 8px 0 var(--navy)}.game-launcher img{height:480px}
.game-rules{padding:20px 16px}.game-rules ol{grid-template-columns:1fr}
.hero h1{font-size:3.2rem}
figure img,.cards img,.book-image img,.portrait img{height:320px}
.actions{flex-direction:column}
.actions a{justify-content:center}
.book-image:after{inset:10px -8px -10px 8px}
footer{flex-direction:column;text-align:center}
.tiktok-callout{grid-template-columns:1fr;padding:60px 20px}
.tiktok-copy{text-align:center}
.tiktok-callout a{max-width:none;justify-content:center;text-align:center}
}
