@font-face{font-family:Roboto;src:url(fonts/roboto.woff2) format("woff2");font-weight:100 900;font-display:swap}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:#111;font:17px/1.55 Roboto,Arial,Helvetica,sans-serif}
.wrap{max-width:900px;margin:0 auto;padding:28px 18px 40px}
h1{margin:0 0 22px;text-align:center;font:400 clamp(22px,4.2vw,32px)/1.3 Roboto,Arial,sans-serif;color:#111;letter-spacing:-.2px}
h1 strong{font-weight:700}
img{max-width:100%;height:auto;display:block}
.thumb{display:block;max-width:820px;margin:0 auto 26px;border:2px solid #000;background:#000;text-decoration:none;overflow:hidden}
.thumb-media{position:relative;display:block;line-height:0}
.thumb-media img{width:100%;height:auto}
.play{position:absolute;left:50%;top:50%;width:86px;height:60px;margin:-30px 0 0 -43px;border-radius:14px;background:#f00;box-shadow:0 2px 10px rgba(0,0,0,.45);z-index:2;pointer-events:none;transition:transform .15s}
.play::before{content:"";position:absolute;left:50%;top:50%;width:0;height:0;border-style:solid;border-width:14px 0 14px 24px;border-color:transparent transparent transparent #fff;transform:translate(-35%,-50%)}
.thumb:hover .play{transform:scale(1.06)}
.bar{display:block;background:#fff;color:#000;font:700 clamp(18px,3.6vw,26px)/1.2 Roboto,Arial,sans-serif;text-align:center;padding:14px 12px;border-top:2px solid #000;line-height:1.25}
.copy{max-width:820px;margin:0 auto 22px;font-size:clamp(15px,2.4vw,17px);line-height:1.65;color:#111}
.copy p{margin:0 0 16px}
.btn{display:block;width:fit-content;max-width:100%;margin:8px auto 28px;padding:14px 36px;background:linear-gradient(#ffe566,#f5c400);color:#000;text-decoration:none;font:700 clamp(18px,3.8vw,24px)/1.2 Roboto,Arial,sans-serif;border:2px solid #000;border-radius:40px;box-shadow:3px 4px 0 rgba(0,0,0,.55);text-align:center}
.btn:hover{background:linear-gradient(#ffec80,#ffd11a)}
footer{max-width:820px;margin:10px auto 0;font-size:12.5px;color:#666;text-align:center;line-height:1.5;padding-top:8px}
footer a{color:#666;margin:0 6px;text-decoration:none}
footer a:hover{text-decoration:underline}
.legal{max-width:800px;margin:20px auto;background:#fff;padding:20px 24px;border-radius:8px;box-shadow:0 2px 10px rgba(0,0,0,.08);font:16px/1.6 Roboto,Arial,sans-serif;color:#222}
.legal h1{font-size:28px;text-align:left;margin:0 0 14px}
@media(max-width:520px){
  .wrap{padding:18px 12px 28px}
  .play{width:68px;height:48px;margin:-24px 0 0 -34px;border-radius:12px}
  .play::before{border-width:11px 0 11px 18px}
  .bar{padding:12px 10px}
  .btn{padding:13px 22px;width:100%;box-shadow:2px 3px 0 rgba(0,0,0,.5)}
}

.curiosity{margin:0 0 10px;text-align:center;font:700 clamp(13px,2.8vw,16px)/1.3 Roboto,Arial,sans-serif;color:#c00;letter-spacing:.06em;text-transform:uppercase}