:root{--navy:#1C3557;--navy2:#14263E;--lar:#E8731A;--lar2:#F08A38;--cream:#F2EAD9;--paper:#FAF6EE;--ink:#1A2433}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Barlow',system-ui,sans-serif;background:var(--paper);color:var(--ink)}
.hat{width:44px;height:auto;display:block}
#fio{position:fixed;top:0;left:0;height:5px;background:var(--lar);width:0;z-index:30;transition:width .1s linear}

/* capa */
.capa{background:radial-gradient(1200px 600px at 50% -10%, #22456e 0%, var(--navy2) 60%);color:var(--cream);min-height:88vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:64px 24px;position:relative;overflow:hidden}
.capa::after{content:"";position:absolute;left:0;right:0;bottom:0;height:10px;background:var(--lar)}
.capa .hat{width:110px}.js .capa .hat{animation:pousa 1.1s cubic-bezier(.2,1.4,.4,1) both}
@keyframes pousa{0%{transform:translateY(-90px) rotate(-14deg);opacity:0}70%{transform:translateY(6px) rotate(2deg);opacity:1}100%{transform:translateY(0) rotate(0)}}
.capa .marca{font-family:'Oswald';font-weight:700;font-size:clamp(84px,16vw,170px);line-height:.9;letter-spacing:-.02em;color:#fff;font-style:italic}.js .capa .marca{animation:sobe .8s .25s both}
.capa .sub{font-family:'Oswald';font-weight:500;letter-spacing:.42em;font-size:14px;color:var(--lar2);margin-top:8px}.js .capa .sub{animation:sobe .8s .45s both}
.capa h1{font-family:'Barlow';font-style:italic;font-weight:500;font-size:clamp(20px,3.2vw,30px);margin-top:38px;color:#e8eef7}.js .capa h1{animation:sobe .8s .6s both}
@keyframes sobe{from{transform:translateY(24px);opacity:0}to{transform:translateY(0);opacity:1}}
.numeros{display:flex;gap:34px;margin-top:40px;flex-wrap:wrap;justify-content:center}.js .numeros{animation:sobe .8s .75s both}
.numeros div{text-align:center}
.numeros b{font-family:'Oswald';font-weight:700;font-size:44px;color:#fff;display:block}
.numeros span{font-family:'Oswald';font-size:12px;letter-spacing:.22em;color:var(--lar2)}
.desce{margin-top:44px;color:#9fb2ca;font-size:13px;letter-spacing:.18em;font-family:'Oswald';animation:pisca 2.2s 1.4s infinite}
@keyframes pisca{0%,100%{opacity:.35}50%{opacity:1}}

/* nav + busca */
.navwrap{position:sticky;top:0;z-index:20;background:var(--navy);box-shadow:0 2px 12px rgba(20,38,62,.3)}
nav{display:flex;overflow-x:auto;padding:0 10px;align-items:center;gap:2px}
nav a{color:#c6d2e2;text-decoration:none;font-family:'Oswald';font-size:14px;padding:13px 11px;border-bottom:3px solid transparent;flex:0 0 auto}
nav a:hover,nav a:focus-visible,nav a.on{color:#fff;border-color:var(--lar);outline:none}
nav .busca{margin-left:auto;flex:0 0 auto;padding:7px 10px}
nav input{background:#0f1e33;border:1px solid #35507a;color:#fff;font-family:'Barlow';font-size:14px;padding:7px 12px;width:210px;border-radius:2px}
nav input::placeholder{color:#7e93b1}
#hits{color:var(--lar2);font-family:'Oswald';font-size:12px;padding:0 10px 8px;display:none}

/* prancha */
.prancha{max-width:1180px;margin:0 auto;padding:66px 22px 22px}
.js .reveal{opacity:0;transform:translateY(34px);transition:opacity .7s ease,transform .7s ease}
.js .reveal.vis{opacity:1;transform:none}
.rotulo{display:flex;align-items:stretch;box-shadow:0 3px 14px rgba(20,38,62,.12)}
.rot-navy{background:var(--navy);display:flex;align-items:center;gap:8px;padding:14px 20px}
.rot-navy .rf{font-family:'Oswald';font-weight:700;font-size:34px;color:#fff;font-style:italic}
.rot-cream{background:var(--cream);flex:1;padding:10px 22px;border-top:1px solid #e4d9c2;border-bottom:1px solid #e4d9c2}
.rot-cream .board{font-family:'Oswald';font-size:12px;letter-spacing:.26em;color:var(--lar);font-weight:600}
.rot-cream h2{font-family:'Oswald';font-weight:600;font-size:clamp(19px,2.6vw,27px);color:var(--navy);letter-spacing:.03em}
.rot-tag{background:var(--lar);color:#fff;font-family:'Oswald';font-weight:600;font-size:14px;display:flex;align-items:center;padding:0 20px;letter-spacing:.06em;white-space:nowrap}
.tagline{font-family:'Barlow';font-style:italic;font-weight:500;color:#7a6a4d;margin:14px 2px 4px;font-size:17px}
figure{margin-top:12px}
.zoom{display:block;width:100%;border:0;padding:0;background:none;cursor:zoom-in;position:relative}
.zoom img{width:100%;display:block;border:1px solid #e7ddc8;box-shadow:0 6px 24px rgba(20,38,62,.10);transition:transform .35s ease}
.zoom:hover img{transform:scale(1.012)}
.lupa{position:absolute;right:12px;bottom:12px;background:rgba(20,38,62,.82);color:#fff;font-family:'Oswald';font-size:11px;letter-spacing:.16em;padding:6px 11px;opacity:0;transition:opacity .3s}
.zoom:hover .lupa,.zoom:focus-visible .lupa{opacity:1}
.itens{list-style:none;margin-top:16px;columns:3;column-gap:26px;font-size:14.5px}
.itens li{break-inside:avoid;padding:6px 4px;border-bottom:1px dashed #ddd2ba;color:#33405a;display:flex;gap:9px;transition:background .2s}
.itens li:hover,.itens li:focus-visible{background:#f4e8d2;outline:none}
.itens .n{font-family:'Oswald';font-weight:600;color:var(--lar)}
.itens li.some{display:none}
.itens li mark{background:#ffd9ab;color:inherit}
.prancha.apagada{opacity:.25}

/* marca */
.historia{background:var(--navy2);color:var(--cream);margin-top:80px;padding:80px 24px;text-align:center;position:relative}
.historia::before,.historia::after{content:"";position:absolute;left:0;right:0;height:8px;background:var(--lar)}
.historia::before{top:0}.historia::after{bottom:0}
.historia .hat{width:70px;margin:0 auto 10px}
.historia h2{font-family:'Oswald';font-weight:600;font-size:clamp(26px,4vw,40px);color:#fff;letter-spacing:.03em}
.historia p{max-width:640px;margin:18px auto 0;font-size:18px;line-height:1.65;color:#d7e0ec}
.historia .tres{display:flex;gap:22px;justify-content:center;margin-top:44px;flex-wrap:wrap}
.historia .tres div{background:#1B3252;border:1px solid #2d4a73;padding:22px 26px;max-width:250px}
.historia .tres b{font-family:'Oswald';color:var(--lar2);font-size:16px;letter-spacing:.08em;display:block;margin-bottom:8px}
.historia .tres span{font-size:14.5px;color:#c4d2e3}

/* rodapé */
footer{background:var(--navy2);color:#cfd9e6;margin-top:0;padding:56px 24px;text-align:center}
footer .marca{font-family:'Oswald';font-weight:700;font-size:38px;color:#fff;font-style:italic}
footer p{margin-top:10px;font-size:14px;max-width:520px;margin-left:auto;margin-right:auto}
footer .cta{display:inline-block;margin-top:22px;background:var(--lar);color:#fff;text-decoration:none;font-family:'Oswald';font-weight:600;letter-spacing:.12em;font-size:14px;padding:13px 30px;transition:background .25s}
footer .cta:hover{background:var(--lar2)}

/* lightbox */
#lb{position:fixed;inset:0;background:rgba(12,20,33,.94);display:none;z-index:40;align-items:center;justify-content:center;flex-direction:column;padding:22px}
#lb.aberto{display:flex}
#lb img{max-width:96vw;max-height:84vh;box-shadow:0 20px 60px rgba(0,0,0,.5)}
#lb figcaption{color:var(--cream);font-family:'Oswald';letter-spacing:.1em;margin-top:14px;font-size:14px}
#lb button{position:absolute;top:16px;right:20px;background:none;border:0;color:#fff;font-size:34px;cursor:pointer;line-height:1}

@media(max-width:900px){.itens{columns:2}}
@media(max-width:640px){.itens{columns:1}.rot-tag{display:none}nav input{width:150px}.numeros{gap:22px}.numeros b{font-size:34px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.capa .hat,.capa .marca,.capa .sub,.capa h1,.numeros,.desce{animation:none}.reveal{opacity:1;transform:none;transition:none}}