/* ===== JesHODL theme: Portugal red / green / gold ===== */
:root{
  --space:#0b1410; --space2:#101c16; --cream:#fdf6e6; --gold:#ffcc29; --gold2:#f0a500;
  --blue:#0b8a4a; --red:#d7263d; --green:#1ee88a;
}
body{background:var(--space)}
.nav{background:rgba(11,20,16,.9)}
.logo{color:#fff}
.logo span{color:var(--gold)}

.hero{background:
  radial-gradient(700px 380px at 12% 0%, rgba(255,255,230,.18) 0, transparent 60%),
  radial-gradient(700px 380px at 88% 0%, rgba(255,255,230,.18) 0, transparent 60%),
  linear-gradient(180deg, #0b1410 0%, #0e2418 70%, #135a31 100%)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:90px;
  background:repeating-linear-gradient(90deg,#1f7a3d 0 80px,#23883f 80px 160px);border-top:4px solid rgba(255,255,255,.7)}
.hero-inner{z-index:2}
.hero-title{text-shadow:5px 5px 0 var(--ink), 9px 9px 0 var(--red)}
.hero-title .up{color:#fff}
.hero-title .only{color:var(--gold)}
.btn-blue{background:var(--blue);color:#fff}
.cream .hl{color:var(--red);text-shadow:3px 3px 0 var(--gold)}
.marquee{background:var(--red);color:#fff}
.quote:nth-child(3n+2){background:var(--gold)}
.quote:nth-child(5n+4){background:#c9f2da}
.tok-card:nth-child(4){background:#c9f2da}
.answer-tag{color:var(--red)}
.sw.green{background:var(--blue)}
.chart-box{box-shadow:8px 8px 0 var(--red)}
.zero-pop{transform-origin:318px 84px;animation:zeropop 1.6s ease-in-out infinite}
@keyframes zeropop{50%{transform:scale(1.25) rotate(8deg)}}

/* bench */
.bench-wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center}
.bench-art svg{width:100%;height:auto;filter:drop-shadow(8px 8px 0 rgba(0,0,0,.5))}
.shirt{transform-origin:260px 210px;animation:shirt 3s ease-in-out infinite}
@keyframes shirt{50%{transform:rotate(-2deg)}}
.warm{background:#fff;color:var(--ink);border:3px solid var(--ink);border-radius:18px;box-shadow:6px 6px 0 var(--gold);padding:20px}
.warm-top{display:flex;justify-content:space-between;font-weight:700}
.warm-bar{height:26px;border:3px solid var(--ink);border-radius:999px;margin:10px 0;overflow:hidden;background:#eee}
.warm-fill{height:100%;width:0;background:repeating-linear-gradient(45deg,var(--red) 0 14px,#ff5a6c 14px 28px);transition:width .25s linear}
.warm-msg{font-weight:700;min-height:3em;margin:0 0 14px}

/* timeline */
.timeline{list-style:none;padding:0;margin:0;position:relative}
.timeline::before{content:"";position:absolute;left:18px;top:6px;bottom:6px;border-left:4px dashed var(--ink)}
.timeline li{position:relative;margin:0 0 22px 50px;background:#fff;border:3px solid var(--ink);border-radius:16px;box-shadow:5px 5px 0 var(--ink);padding:16px 20px}
.timeline li::before{content:"";position:absolute;left:-43px;top:18px;width:20px;height:20px;border-radius:50%;background:var(--red);border:3px solid var(--ink)}
.timeline li:nth-child(even)::before{background:var(--blue)}
.timeline li:last-child::before{background:var(--gold)}
.timeline h3{font-family:var(--fh);font-weight:400;font-size:1.7rem;margin:.1em 0 .2em;letter-spacing:.03em}
.timeline p{margin:0}
.t-date{display:inline-block;font-weight:700;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;background:var(--gold);border:2px solid var(--ink);border-radius:999px;padding:1px 10px}
.sources{font-size:.85rem;color:#444;margin-top:24px}
.sources a{font-weight:700}

.footer{border-top-color:var(--red)}

@media (max-width:1000px){ .bench-wrap{grid-template-columns:1fr} }
@media (max-width:600px){ .timeline li{margin-left:40px} .timeline li::before{left:-35px} .timeline::before{left:12px} }

.num{font-family:'Arial Black',Impact,sans-serif;font-weight:900;font-size:.85em}

/* ===== v2: duo hero, mullet, gum, dictionary ===== */
@media (min-width:1001px){.hero-inner{grid-template-columns:.9fr 1.3fr;max-width:1320px}}
.hero-art.duo{display:grid;grid-template-columns:1fr 1fr;gap:6px;align-items:end;width:100%}
.duo-col{position:relative;display:flex;flex-direction:column;align-items:center;padding-top:92px}
.duo .bubble{top:0;left:50%;transform:translateX(-50%) rotate(-4deg);font-size:clamp(.95rem,1.6vw,1.45rem);max-width:96%;width:max-content;text-align:center;padding:10px 14px}
.duo .bubble-cr{transform:translateX(-50%) rotate(3deg);background:#d8ff3c}
.duo .bubble-cr::after{left:40px;right:auto}
.duo .bubble.pop{animation:pop2 .35s}
@keyframes pop2{0%{scale:.6}70%{scale:1.08}100%{scale:1}}
.cr-bob{transform-origin:200px 300px;animation:bob 2.6s ease-in-out infinite reverse}
.calma-arm{transform-origin:288px 392px;animation:calma 1.2s ease-in-out infinite}
@keyframes calma{50%{transform:rotate(3deg) translateY(4px)}}
.sparkle{animation:twinkle 1.4s ease-in-out infinite}
@keyframes twinkle{50%{opacity:.2}}
.hero-tools{grid-column:1 / -1;display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap;margin-top:6px}
.chip-dark{background:var(--gold)}
.hair-mullet{display:none}
.mullet .hair-mullet{display:inline}
.mullet .hair-short{display:none}
.gum{transform-box:fill-box;transform-origin:30% 50%;animation:gum 3.2s ease-in-out infinite}
@keyframes gum{0%,15%{transform:scale(.25)}70%{transform:scale(1.15)}78%{transform:scale(1.25);opacity:1}80%,100%{transform:scale(.2);opacity:0}}
.big-gum{animation-duration:4s}
.idea-lines{animation:twinkle .9s ease-in-out infinite}

.dict-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:22px}
.dict{background:#fff;border:3px solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px 20px 16px;position:relative}
.dict h3{font-family:var(--fh);font-weight:400;font-size:1.75rem;line-height:1.05;margin:.35em 0 .3em;letter-spacing:.02em}
.dict .pos{font-style:italic;color:#555;font-size:.9rem}
.dict p{margin:.35em 0}
.dict .orig{font-size:.85rem;color:#555}
.tag{display:inline-block;font-weight:700;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;border:2px solid var(--ink);border-radius:999px;padding:1px 9px}
.tag.rec{background:#c9f2da} .tag.folk{background:var(--gold)}
.press-dark .answer, .press-dark .press-form input{color:var(--ink)}
.press-dark p{color:#dfe6e1}

@media (max-width:1000px){
  .hero-art.duo{max-width:640px;margin:0 auto}
  .duo .bubble{font-size:clamp(.9rem,3.2vw,1.35rem)}
}
@media (max-width:600px){
  .duo .bubble{font-size:1.05rem;max-width:160px}
  .duo-col{padding-top:78px}
}

/* historic-moment ribbon */
.moment{position:relative;z-index:3;max-width:1180px;margin:18px auto 0;padding:14px 20px;display:flex;align-items:center;gap:16px;
  background:var(--gold);border:4px solid var(--ink);border-radius:16px;box-shadow:6px 6px 0 var(--red);transform:rotate(-.6deg);width:calc(100% - 40px)}
.moment p{margin:0;font-weight:500;font-size:1.02rem;line-height:1.4}
.moment-tag{flex:none;font-family:var(--fh);font-size:1.35rem;letter-spacing:.04em;background:var(--ink);color:var(--gold);border-radius:10px;padding:4px 12px}
.hero:has(.moment){flex-direction:column;align-items:stretch}
@media (max-width:600px){.moment{flex-direction:column;align-items:flex-start;gap:8px;width:calc(100% - 32px);padding:12px 14px}.moment p{font-size:.95rem}}