/* Idade Mídia — rebrand conceito "Voz é território" (2026)
   Sistema: editorial amazônida contemporâneo. Mata, rio, barro, sol. */
:root{
  --sand:#f8f3e6; --sand-2:#efe6cf;
  --mata:#123528; --mata-2:#0c241b; --rio:#1f6b57;
  --barro:#c9502e; --sol:#e8a93d; --ink:#1c1a16;
  --disp:"Fraunces",Georgia,serif;
  --ui:"Archivo","Helvetica Neue",Arial,sans-serif;
  --graf: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='32' viewBox='0 0 64 32'%3E%3Cpath d='M0 16 L16 2 L32 16 L48 2 L64 16' fill='none' stroke='%23c9502e' stroke-width='3'/%3E%3Cpath d='M0 30 L16 16 L32 30 L48 16 L64 30' fill='none' stroke='%23123528' stroke-width='3'/%3E%3C/svg%3E");
  --graf-sand: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='32' viewBox='0 0 64 32'%3E%3Cpath d='M0 16 L16 2 L32 16 L48 2 L64 16' fill='none' stroke='%23e8a93d' stroke-width='3'/%3E%3Cpath d='M0 30 L16 16 L32 30 L48 16 L64 30' fill='none' stroke='%23f8f3e6' stroke-width='3'/%3E%3C/svg%3E");
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--sand);color:var(--ink);font-family:var(--ui);font-size:16.5px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--barro)}
a:hover{color:var(--rio)}
.wrap{max-width:1160px;margin:0 auto;padding:0 26px}
.grafband{height:32px;background-image:var(--graf);background-repeat:repeat-x;background-position:center}
.grafband.inv{background-image:var(--graf-sand)}

/* header */
header.site{position:sticky;top:0;z-index:50;background:var(--mata);color:var(--sand)}
.sitebar{display:flex;align-items:center;gap:14px;padding:14px 26px;max-width:1200px;margin:0 auto}
.brand{display:flex;align-items:center;gap:12px;color:var(--sand);text-decoration:none}
.brand img{width:42px;height:42px;border-radius:50%;background:#000;border:2px solid var(--sol)}
.brand .t1{font-family:var(--ui);font-weight:800;font-size:17px;letter-spacing:.02em}
.brand .t2{font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;color:#a9c6b4}
nav.main{margin-left:auto;display:flex;gap:4px}
nav.main a{color:var(--sand);text-decoration:none;font-family:var(--ui);font-weight:600;font-size:13px;letter-spacing:.06em;text-transform:uppercase;padding:9px 13px;border-radius:999px}
nav.main a:hover{background:rgba(248,243,230,.12);color:#fff}
nav.main a.on{background:var(--barro);color:#fff}
.burger{display:none;margin-left:auto;background:none;border:2px solid var(--sand);color:var(--sand);border-radius:999px;font-family:var(--ui);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:12px;padding:8px 16px;cursor:pointer}
@media(max-width:920px){
  nav.main{display:none;position:absolute;top:100%;left:0;right:0;background:var(--mata-2);flex-direction:column;padding:12px;gap:6px;border-bottom:3px solid var(--sol)}
  nav.main.open{display:flex}
  nav.main a{padding:13px 18px}
  .burger{display:block}
}

/* hero */
.hero{background:linear-gradient(160deg,var(--mata) 0%,var(--mata-2) 70%);color:var(--sand);position:relative;overflow:hidden}
.hero .wrap{position:relative;padding:88px 26px 78px;display:grid;grid-template-columns:1.2fr .8fr;gap:50px;align-items:center}
.kicker{display:inline-flex;align-items:center;gap:9px;border:1.5px solid var(--sol);color:var(--sol);font-weight:700;text-transform:uppercase;letter-spacing:.2em;font-size:11.5px;padding:8px 16px;border-radius:999px}
.kicker::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--sol)}
.hero h1{font-family:var(--disp);font-weight:600;font-variation-settings:"opsz" 144;font-size:clamp(46px,6.4vw,86px);line-height:1.02;letter-spacing:-.01em;margin:26px 0 20px}
.hero h1 em{font-style:italic;color:var(--sol)}
.hero p.lede{font-size:18.5px;max-width:52ch;color:#cfe0d2}
.hero .cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}
.hero .art{position:relative}
.hero .art img{width:min(330px,72%);margin:0 auto;border-radius:50%;border:5px solid var(--sol);box-shadow:0 24px 60px rgba(0,0,0,.45)}
.hero .art .ring{position:absolute;inset:-8%;border:2px dashed rgba(232,169,61,.5);border-radius:50%;animation:spin 70s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:920px){.hero .wrap{grid-template-columns:1fr;padding:60px 26px}.hero .art img{width:min(230px,60%)}}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--ui);font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:13.5px;padding:15px 26px;border-radius:999px;border:2px solid transparent;text-decoration:none;transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-2px)}
.btn.barro{background:var(--barro);color:#fff}
.btn.barro:hover{background:#b04023;color:#fff}
.btn.line{border-color:var(--sand);color:var(--sand)}
.btn.line:hover{background:rgba(248,243,230,.12);color:#fff}
.btn.mata{background:var(--mata);color:var(--sand)}
.btn.mata:hover{background:var(--rio);color:#fff}

/* sections */
section.band{padding:78px 0}
section.band.mata{background:var(--mata);color:var(--sand)}
section.band.deep{background:var(--mata-2);color:var(--sand)}
section.band.tint{background:var(--sand-2)}
h2.sec{font-family:var(--disp);font-weight:600;font-size:clamp(30px,3.8vw,48px);line-height:1.06;letter-spacing:-.01em;margin-bottom:10px}
h2.sec em{font-style:italic;color:var(--barro)}
.mata h2.sec em,.deep h2.sec em{color:var(--sol)}
.secrule{width:180px;height:14px;background-image:var(--graf);background-repeat:repeat-x;background-size:64px 14px;margin:18px 0 30px}
.mata .secrule,.deep .secrule{background-image:var(--graf-sand)}
.sec-intro{max-width:66ch;margin-bottom:40px;font-size:17px}
.mata .sec-intro,.deep .sec-intro{color:#cfe0d2}

/* editorial pillar rows */
.rows{border-top:1.5px solid rgba(28,26,22,.25)}
.mata .rows,.deep .rows{border-color:rgba(248,243,230,.25)}
.row{display:grid;grid-template-columns:90px 1fr 1.4fr;gap:26px;padding:26px 6px;border-bottom:1.5px solid rgba(28,26,22,.25);align-items:baseline}
.mata .row,.deep .row{border-color:rgba(248,243,230,.25)}
.row .n{font-family:var(--disp);font-size:34px;color:var(--barro)}
.mata .row .n,.deep .row .n{color:var(--sol)}
.row h3{font-family:var(--disp);font-weight:600;font-size:24px;letter-spacing:0}
.row p{font-size:15.5px}
.mata .row p,.deep .row p{color:#cfe0d2}
@media(max-width:760px){.row{grid-template-columns:56px 1fr}.row p{grid-column:2}}

/* project cards */
.grid{display:grid;gap:24px}
.grid.c2{grid-template-columns:repeat(2,1fr)}
.grid.c3{grid-template-columns:repeat(3,1fr)}
.grid.c4{grid-template-columns:repeat(4,1fr)}
@media(max-width:980px){.grid.c4{grid-template-columns:repeat(2,1fr)}.grid.c3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.grid.c2,.grid.c3,.grid.c4{grid-template-columns:1fr}}
.pcard{border-radius:18px;padding:30px 26px;background:#fff;border:1.5px solid rgba(28,26,22,.14);position:relative;overflow:hidden}
.pcard::before{content:"";position:absolute;top:0;left:0;right:0;height:10px;background-image:var(--graf);background-repeat:repeat-x;background-size:64px 10px}
.pcard h3{font-family:var(--disp);font-weight:600;font-size:23px;margin:6px 0 10px}
.pcard p{font-size:15px;color:#4a443b}
.pcard .tag{display:inline-block;background:var(--sand-2);color:var(--mata);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:5px 12px;border-radius:999px}
a.pcard{text-decoration:none;color:inherit;transition:transform .15s,box-shadow .15s;display:block}
a.pcard:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(18,53,40,.16)}
.pcard .go{display:inline-block;margin-top:14px;font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--barro)}
.mata .pcard,.deep .pcard{background:rgba(248,243,230,.06);border-color:rgba(248,243,230,.2);color:var(--sand)}
.mata .pcard p,.deep .pcard p{color:#cfe0d2}
.mata .pcard::before,.deep .pcard::before{background-image:var(--graf-sand)}
.mata .pcard .go,.deep .pcard .go{color:var(--sol)}

/* stats */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;text-align:center}
.stat b{display:block;font-family:var(--disp);font-weight:600;font-size:clamp(38px,4.6vw,58px);color:var(--sol);line-height:1}
.stat span{display:block;margin-top:8px;font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:#a9c6b4}
@media(max-width:640px){.stats{grid-template-columns:1fr;gap:34px}}

/* radio panel */
.panel{border-radius:20px;overflow:hidden;background:#fff;border:1.5px solid rgba(28,26,22,.16);box-shadow:0 22px 50px rgba(18,53,40,.14)}
.panel .bar{display:flex;align-items:center;gap:10px;background:var(--barro);color:#fff;font-weight:700;text-transform:uppercase;letter-spacing:.18em;font-size:12px;padding:12px 20px}
.dot{width:10px;height:10px;border-radius:50%;background:#fff;animation:pulse 1.4s ease-in-out infinite}
@keyframes pulse{50%{opacity:.3}}
.panel iframe{width:100%;border:0;display:block;height:560px}
@media(max-width:640px){.panel iframe{height:520px}}

/* video */
.video{position:relative;padding-top:56.25%;border-radius:16px;overflow:hidden;background:#000;border:1.5px solid rgba(28,26,22,.16)}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* posts */
.post{border-radius:18px;overflow:hidden;background:#fff;border:1.5px solid rgba(28,26,22,.14)}
.post .ph{padding:22px 24px;background:var(--sand-2);border-bottom:1.5px solid rgba(28,26,22,.12)}
.post .cat{font-weight:700;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--barro)}
.post h3{font-family:var(--disp);font-weight:600;font-size:21px;margin-top:8px}
.post .pb{padding:20px 24px;font-size:15px}
.post time{font-weight:600;text-transform:uppercase;font-size:11.5px;letter-spacing:.12em;color:#8a7f66}

/* page head + prose */
.page-head{background:linear-gradient(160deg,var(--mata),var(--mata-2));color:var(--sand);padding:70px 0 58px}
.page-head h1{font-family:var(--disp);font-weight:600;font-size:clamp(38px,5.2vw,64px);line-height:1.02;letter-spacing:-.01em}
.page-head h1 em{font-style:italic;color:var(--sol)}
.page-head p{margin-top:14px;max-width:70ch;color:#cfe0d2;font-size:17px}
.prose{max-width:76ch}
.prose p{margin-bottom:18px}
.prose ul{margin:0 0 18px 22px}
.prose li{margin-bottom:9px}
.prose h2{font-family:var(--disp);font-weight:600;font-size:30px;margin:38px 0 14px}
.prose h2 em{font-style:italic;color:var(--barro)}
.fig{border-radius:18px;overflow:hidden;border:1.5px solid rgba(28,26,22,.16);margin:26px 0}
.fig figcaption{background:var(--mata);color:var(--sand);font-weight:600;text-transform:uppercase;font-size:11.5px;letter-spacing:.16em;padding:10px 18px}

/* pix */
.pix{border-radius:18px;background:#fff;border:1.5px solid rgba(28,26,22,.14);padding:26px 24px}
.pix h4{font-family:var(--disp);font-weight:600;font-size:19px;margin-bottom:6px;color:var(--mata)}
.pix p{font-size:14.5px;color:#4a443b}
.pix code{display:block;background:var(--mata);color:var(--sand);border-radius:12px;padding:12px 16px;font-size:14.5px;margin-top:12px;word-break:break-all}

/* contact */
form.contact{display:grid;gap:18px;max-width:580px}
form.contact label{font-weight:700;text-transform:uppercase;font-size:12px;letter-spacing:.14em;display:block;margin-bottom:7px;color:var(--mata)}
form.contact input,form.contact textarea{width:100%;border:1.5px solid rgba(28,26,22,.3);border-radius:12px;background:#fff;padding:13px 16px;font-family:var(--ui);font-size:16px;color:var(--ink)}
form.contact input:focus,form.contact textarea:focus{outline:3px solid rgba(201,80,46,.4);border-color:var(--barro)}
.contactinfo{background:var(--sand-2);border-radius:18px;padding:30px 28px}
.contactinfo p{margin-bottom:14px}
.contactinfo strong{display:block;font-weight:700;text-transform:uppercase;font-size:11.5px;letter-spacing:.14em;color:var(--barro);margin-bottom:3px}

/* footer */
footer.site{background:var(--mata-2);color:#a9c6b4}
footer .grafband{opacity:.9}
.fwrap{max-width:1160px;margin:0 auto;padding:56px 26px 30px;display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:38px}
.fwrap img.seal{width:80px;border-radius:50%;border:2px solid var(--sol);margin-bottom:16px}
.fwrap h4{font-weight:800;text-transform:uppercase;letter-spacing:.16em;font-size:12px;color:var(--sand);margin-bottom:14px}
.fwrap a{color:#d8e6da;text-decoration:none}
.fwrap a:hover{color:var(--sol)}
.fwrap ul{list-style:none}
.fwrap li{margin-bottom:8px;font-size:14.5px}
.fwrap p{font-size:14.5px}
.fbot{border-top:1px solid rgba(248,243,230,.14);margin-top:36px;padding:20px 26px;text-align:center;font-size:12.5px;letter-spacing:.08em}
@media(max-width:800px){.fwrap{grid-template-columns:1fr}}

/* reveal */
.rv{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}.hero .art .ring,.dot{animation:none}}
