/* ============================================================
   Giro da Sorte — Portal de notícias (tema claro)
   Identidade própria: jornal contemporâneo, slab + grotesque.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Zilla+Slab:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Libre+Franklin:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400&display=swap');

:root{
  --ink:#16181d;            /* texto principal */
  --ink-soft:#454a54;       /* texto secundário */
  --ink-faint:#7c828d;      /* legendas */
  --line:#e4e6ea;           /* divisórias */
  --line-strong:#cfd2d8;
  --paper:#f4f5f7;          /* fundo geral (não branco puro) */
  --card:#ffffff;           /* cartões */
  --accent:#d4322b;         /* vermelho-carmim de ação */
  --accent-dark:#a82420;
  --accent-soft:#fbeceb;
  --gold:#b8893b;           /* detalhe quente */
  --footer:#1b1e24;         /* rodapé escuro */
  --footer-soft:#9aa0ab;
  --maxw:1180px;
  --gap:48px;
  --radius:4px;
  --shadow:0 1px 2px rgba(20,24,29,.04), 0 6px 22px rgba(20,24,29,.06);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Libre Franklin',-apple-system,Segoe UI,sans-serif;
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}

/* ---------- TOP BAR ---------- */
.topbar{
  background:var(--ink);
  color:#cfd2d8;
  font-size:12.5px;
  letter-spacing:.02em;
}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:38px;}
.topbar .data{text-transform:uppercase;letter-spacing:.12em;font-weight:600;color:#9aa0ab;font-size:11.5px;}
.topbar .top-links{display:flex;gap:20px;}
.topbar .top-links a{color:#cfd2d8;transition:color .15s;}
.topbar .top-links a:hover{color:#fff;}

/* ---------- MASTHEAD ---------- */
.masthead{background:var(--card);border-bottom:1px solid var(--line);}
.masthead .wrap{display:flex;align-items:center;justify-content:space-between;padding-top:22px;padding-bottom:22px;gap:24px;}
.brand{display:flex;align-items:center;gap:14px;}
.brand .mark{width:46px;height:46px;flex:0 0 auto;}
.brand .name{
  font-family:'Zilla Slab',Georgia,serif;
  font-weight:700;
  font-size:30px;
  line-height:1;
  letter-spacing:-.01em;
  display:block;
  color:var(--ink);
}
.brand .name span{color:var(--accent);}
.brand .tag{
  display:block;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ink-faint);
  margin-top:5px;
  font-weight:600;
}
.masthead .ad-slot{
  flex:0 0 auto;
  width:300px;max-width:40%;height:74px;
  border:1px dashed var(--line-strong);
  border-radius:var(--radius);
  display:flex;align-items:center;justify-content:center;
  color:#aeb3bc;font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  background:repeating-linear-gradient(45deg,#fafbfc,#fafbfc 10px,#f4f5f7 10px,#f4f5f7 20px);
}

/* ---------- NAV ---------- */
.primary{background:var(--accent);position:sticky;top:0;z-index:50;box-shadow:0 2px 10px rgba(168,36,32,.18);}
.primary .wrap{display:flex;align-items:center;}
.primary .links{display:flex;flex-wrap:wrap;}
.primary .links a{
  color:#fff;
  font-weight:600;
  font-size:14px;
  letter-spacing:.01em;
  padding:14px 16px;
  position:relative;
  transition:background .15s;
}
.primary .links a:hover{background:rgba(0,0,0,.12);}
.primary .links a.active{background:var(--accent-dark);}
.nav-toggle{display:none;background:none;border:0;color:#fff;font-size:22px;padding:12px 16px;cursor:pointer;}

/* ---------- BREADCRUMB ---------- */
.crumbs{font-size:13px;color:var(--ink-faint);padding:18px 0 4px;}
.crumbs a:hover{color:var(--accent);}
.crumbs span{margin:0 7px;color:var(--line-strong);}

/* ---------- LAYOUT 2 COLUNAS ---------- */
.layout{display:grid;grid-template-columns:minmax(0,1fr) 332px;gap:var(--gap);padding:14px 0 64px;align-items:start;}
.col-main{min-width:0;}
.col-side{position:sticky;top:70px;}

/* ---------- ARTIGO ---------- */
.kicker{
  display:inline-block;
  color:var(--accent);
  font-weight:700;
  font-size:12.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  margin-bottom:14px;
}
.article h1,.page-hd h1{
  font-family:'Zilla Slab',Georgia,serif;
  font-weight:700;
  font-size:clamp(30px,4.4vw,46px);
  line-height:1.08;
  letter-spacing:-.015em;
  margin:0 0 18px;
  color:var(--ink);
}
.article h1 em,.page-hd h1 em{color:var(--accent);font-style:italic;}
.standfirst{
  font-size:20px;
  line-height:1.5;
  color:var(--ink-soft);
  font-weight:400;
  margin:0 0 22px;
}
.byline{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:14px 0;margin-bottom:26px;
  font-size:13.5px;color:var(--ink-faint);
}
.byline .avatar{
  width:42px;height:42px;border-radius:50%;
  background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-family:'Zilla Slab',serif;font-weight:700;font-size:19px;
}
.byline strong{color:var(--ink);font-weight:600;}
.byline .sep{flex:1;}
.share{display:flex;gap:8px;}
.share a{
  width:32px;height:32px;border-radius:50%;
  border:1px solid var(--line-strong);
  display:flex;align-items:center;justify-content:center;
  color:var(--ink-faint);font-size:13px;font-weight:700;transition:all .15s;
}
.share a:hover{background:var(--accent);color:#fff;border-color:var(--accent);}

.article-figure{margin:0 0 30px;}
.article-figure img{width:100%;border-radius:var(--radius);background:#eceef1;}
.article-figure figcaption,.lead-figure figcaption{
  font-size:13px;color:var(--ink-faint);margin-top:9px;
  padding-left:14px;border-left:3px solid var(--accent);line-height:1.45;
}

/* ---------- PROSE ---------- */
.prose{font-size:17.5px;line-height:1.72;color:#262a31;}
.prose p{margin:0 0 22px;}
.prose h2{
  font-family:'Zilla Slab',Georgia,serif;
  font-weight:600;font-size:27px;line-height:1.2;
  margin:40px 0 14px;color:var(--ink);
  padding-bottom:8px;border-bottom:2px solid var(--line);
}
.prose h3{font-family:'Zilla Slab',serif;font-weight:600;font-size:21px;margin:30px 0 10px;color:var(--ink);}
.prose strong{color:var(--ink);font-weight:700;}
.prose em{font-style:italic;}
.prose a{color:var(--accent);font-weight:600;border-bottom:1px solid var(--accent-soft);}
.prose a:hover{border-color:var(--accent);}
.prose ul,.prose ol{margin:0 0 22px;padding-left:22px;}
.prose li{margin-bottom:9px;}
.prose blockquote{
  margin:30px 0;padding:22px 26px;
  background:var(--card);border-left:4px solid var(--gold);
  font-family:'Zilla Slab',serif;font-size:21px;font-style:italic;
  color:var(--ink);line-height:1.4;border-radius:0 var(--radius) var(--radius) 0;
  box-shadow:var(--shadow);
}

/* callout / responsible / prize boxes */
.callout{
  background:var(--accent-soft);border:1px solid #f1cfcd;
  border-radius:var(--radius);padding:20px 24px;margin:28px 0;
}
.callout .h{font-family:'Zilla Slab',serif;font-weight:700;color:var(--accent-dark);margin-bottom:6px;font-size:16px;letter-spacing:.01em;}
.callout p{margin:0;color:#5a3b39;font-size:16px;}
.responsible{
  background:#fffaf0;border:1px solid #f0e2c4;
  border-radius:var(--radius);padding:20px 24px;margin:30px 0 0;
}
.responsible .h{font-family:'Zilla Slab',serif;font-weight:700;color:var(--gold);margin-bottom:6px;font-size:16px;}
.responsible p{margin:0;color:#6b5a36;font-size:15.5px;}

/* tabela de dados / definição */
.data-table{width:100%;border-collapse:collapse;margin:26px 0;font-size:15.5px;background:var(--card);box-shadow:var(--shadow);border-radius:var(--radius);overflow:hidden;}
.data-table th,.data-table td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--line);}
.data-table th{background:#fafbfc;font-weight:700;color:var(--ink);font-size:13px;text-transform:uppercase;letter-spacing:.05em;}
.data-table tr:last-child td{border-bottom:0;}

/* ---------- LEAD (HOME) ---------- */
.lead-figure .frame img{width:100%;border-radius:var(--radius);background:#eceef1;}
.lead{margin-bottom:34px;}
.lead-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:34px;align-items:center;}
.prize-strip{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--line);border:1px solid var(--line);
  border-radius:var(--radius);overflow:hidden;margin-top:30px;
}
.prize-strip .cell{background:var(--card);padding:18px 20px;}
.prize-strip .cell .lbl{font-size:11.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-faint);font-weight:600;}
.prize-strip .cell .val{font-family:'Zilla Slab',serif;font-weight:700;font-size:24px;color:var(--ink);margin-top:4px;line-height:1;}
.prize-strip .cell .val.hl{color:var(--accent);}

/* ---------- SECTION HEADINGS ---------- */
.section-head{display:flex;align-items:center;gap:16px;margin:42px 0 22px;}
.section-head h2{
  font-family:'Zilla Slab',serif;font-weight:700;font-size:22px;margin:0;
  text-transform:uppercase;letter-spacing:.04em;color:var(--ink);
  position:relative;padding-left:16px;
}
.section-head h2::before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:5px;background:var(--accent);border-radius:3px;}
.section-head .rule{flex:1;height:1px;background:var(--line);}

/* ---------- CARDS GRID ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:column;transition:transform .18s,box-shadow .18s;
}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.card .thumb{aspect-ratio:16/10;background:#eceef1;overflow:hidden;}
.card .thumb img{width:100%;height:100%;object-fit:cover;}
.card .body{padding:16px 18px 20px;}
.card .cat-tag{display:inline-block;color:var(--accent);font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px;}
.card h3{font-family:'Zilla Slab',serif;font-weight:600;font-size:18.5px;line-height:1.22;margin:0 0 8px;color:var(--ink);}
.card p{margin:0;font-size:14.5px;color:var(--ink-soft);line-height:1.5;}

/* feature split (home) */
.feature{display:grid;grid-template-columns:1fr 1fr;gap:30px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-bottom:10px;}
.feature .ph{background:#eceef1;min-height:240px;}
.feature .ph img{width:100%;height:100%;object-fit:cover;}
.feature .txt{padding:30px 32px;}
.feature .txt .cat-tag{color:var(--accent);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;}
.feature .txt h2{font-family:'Zilla Slab',serif;font-size:27px;line-height:1.16;margin:10px 0 12px;}
.feature .txt p{color:var(--ink-soft);margin:0 0 16px;}

/* numbers band */
.numbers{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;background:var(--ink);border-radius:var(--radius);padding:30px;margin:10px 0;}
.numbers .n .fig{font-family:'Zilla Slab',serif;font-weight:700;font-size:36px;color:#fff;line-height:1;}
.numbers .n .fig span{color:var(--accent);}
.numbers .n .cap{color:#aeb3bc;font-size:13px;margin-top:8px;line-height:1.4;}

/* read-more inline link */
.more{display:inline-flex;align-items:center;gap:7px;color:var(--accent);font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.05em;}
.more::after{content:"→";transition:transform .15s;}
.more:hover::after{transform:translateX(4px);}

/* ---------- SIDEBAR ---------- */
.side-block{margin-bottom:34px;}
.side-hd{
  font-family:'Zilla Slab',serif;font-weight:700;font-size:16px;
  text-transform:uppercase;letter-spacing:.06em;color:var(--ink);
  padding-bottom:10px;margin:0 0 16px;border-bottom:3px solid var(--accent);
  display:flex;align-items:center;gap:8px;
}
.side-news{display:flex;flex-direction:column;gap:14px;}
.side-item{display:grid;grid-template-columns:84px 1fr;gap:13px;align-items:start;}
.side-item .ph{aspect-ratio:1/1;background:#eceef1;border-radius:var(--radius);overflow:hidden;}
.side-item .ph img{width:100%;height:100%;object-fit:cover;}
.side-item .it-cat{color:var(--accent);font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;}
.side-item h4{font-family:'Zilla Slab',serif;font-weight:600;font-size:15px;line-height:1.24;margin:3px 0 5px;color:var(--ink);transition:color .15s;}
.side-item:hover h4{color:var(--accent);}
.side-item .it-meta{font-size:11.5px;color:var(--ink-faint);}
.side-rank{counter-reset:rk;}
.side-rank .side-item{grid-template-columns:36px 1fr;align-items:center;}
.side-rank .side-item .rk{
  font-family:'Zilla Slab',serif;font-weight:700;font-size:30px;color:var(--line-strong);
  text-align:center;
}
.side-ad{
  border:1px dashed var(--line-strong);border-radius:var(--radius);
  height:280px;display:flex;align-items:center;justify-content:center;
  color:#aeb3bc;font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  background:repeating-linear-gradient(45deg,#fafbfc,#fafbfc 10px,#f4f5f7 10px,#f4f5f7 20px);
  margin-bottom:34px;
}
.side-tags{display:flex;flex-wrap:wrap;gap:8px;}
.side-tags a{
  font-size:13px;padding:6px 12px;background:var(--card);border:1px solid var(--line);
  border-radius:40px;color:var(--ink-soft);transition:all .15s;
}
.side-tags a:hover{background:var(--accent);color:#fff;border-color:var(--accent);}
.side-about{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px;}
.side-about p{font-size:14.5px;color:var(--ink-soft);margin:0 0 12px;line-height:1.55;}

/* ---------- AUTHOR BOX ---------- */
.author-box{
  display:flex;gap:18px;align-items:flex-start;
  background:var(--card);border:1px solid var(--line);border-left:4px solid var(--accent);
  border-radius:var(--radius);padding:22px 24px;margin:40px 0 0;
}
.author-box .pic{
  width:64px;height:64px;border-radius:50%;flex:0 0 auto;
  background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;
  font-family:'Zilla Slab',serif;font-weight:700;font-size:26px;
}
.author-box .who{font-family:'Zilla Slab',serif;font-weight:700;font-size:18px;color:var(--ink);}
.author-box .role{font-size:12.5px;color:var(--accent);text-transform:uppercase;letter-spacing:.08em;font-weight:600;margin-bottom:8px;}
.author-box p{margin:0;font-size:14.5px;color:var(--ink-soft);line-height:1.55;}

/* ---------- RELATED ---------- */
.related-wrap{margin-top:50px;}

/* ---------- PÁGINAS INSTITUCIONAIS ---------- */
.page-hd{margin-bottom:8px;}
.page-body{font-size:17px;line-height:1.7;color:#262a31;}
.page-body h2{font-family:'Zilla Slab',serif;font-weight:600;font-size:24px;margin:34px 0 12px;color:var(--ink);}
.page-body h3{font-family:'Zilla Slab',serif;font-weight:600;font-size:19px;margin:24px 0 8px;}
.page-body p{margin:0 0 18px;}
.page-body ul{margin:0 0 18px;padding-left:22px;}
.page-body li{margin-bottom:8px;}
.page-body strong{color:var(--ink);font-weight:700;}
.page-body a{color:var(--accent);font-weight:600;}
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin:24px 0;}
.contact-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;}
.contact-card .lbl{font-size:11.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-faint);font-weight:700;margin-bottom:6px;}
.contact-card .v{font-size:16px;color:var(--ink);font-weight:500;word-break:break-word;}
.contact-block{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:var(--radius);padding:8px 26px;margin:24px 0;}
.contact-block dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:0;}
.contact-block dt{padding:14px 0 4px;font-size:11.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-faint);font-weight:700;grid-column:1/-1;border-top:1px solid var(--line);}
.contact-block dt:first-child{border-top:0;}
.contact-block dd{margin:0 0 8px;font-size:16.5px;color:var(--ink);grid-column:1/-1;line-height:1.5;}
.contact-block dd a{color:var(--accent);font-weight:600;}

/* ---------- FOOTER ---------- */
.site-footer{background:var(--footer);color:var(--footer-soft);margin-top:20px;}
.footer-top{padding:50px 0 38px;border-bottom:1px solid rgba(255,255,255,.08);}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1.1fr;gap:42px;}
.footer-brand .name{font-family:'Zilla Slab',serif;font-weight:700;font-size:24px;color:#fff;}
.footer-brand .name span{color:var(--accent);}
.footer-brand p{font-size:14px;line-height:1.65;margin:14px 0 0;max-width:36ch;}
.footer-col h4{color:#fff;font-family:'Zilla Slab',serif;font-weight:600;font-size:15px;text-transform:uppercase;letter-spacing:.06em;margin:0 0 16px;}
.footer-col ul{list-style:none;margin:0;padding:0;}
.footer-col li{margin-bottom:11px;}
.footer-col a{font-size:14px;transition:color .15s;}
.footer-col a:hover{color:#fff;}
.recent-foot{display:flex;flex-direction:column;gap:14px;}
.recent-foot .rf{display:grid;grid-template-columns:54px 1fr;gap:12px;align-items:center;}
.recent-foot .rf .ph{width:54px;height:54px;border-radius:var(--radius);background:#2a2e36;overflow:hidden;}
.recent-foot .rf .ph img{width:100%;height:100%;object-fit:cover;}
.recent-foot .rf h5{font-family:'Zilla Slab',serif;font-weight:500;font-size:14px;line-height:1.3;margin:0;color:#dfe2e7;}
.recent-foot .rf:hover h5{color:#fff;}
.recent-foot .rf .d{font-size:11.5px;color:#6b7079;margin-top:3px;}
.footer-note{background:#15171c;}
.footer-note .wrap{padding:24px 24px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center;}
.footer-note .legal{font-size:12.5px;line-height:1.6;color:#7c828d;max-width:74ch;}
.footer-note .legal strong{color:#aeb3bc;}
.footer-badges{display:flex;gap:10px;align-items:center;flex:0 0 auto;}
.badge18{
  width:46px;height:46px;border-radius:50%;border:2px solid var(--accent);
  color:#fff;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:14px;background:rgba(212,50,43,.12);flex:0 0 auto;
}
.disclaimer-bar{
  background:#fffaf0;border:1px solid #f0e2c4;border-radius:var(--radius);
  padding:14px 20px;margin:22px 0;font-size:13.5px;color:#6b5a36;line-height:1.55;
}
.disclaimer-bar strong{color:var(--gold);}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1000px){
  :root{--gap:34px;}
  .layout{grid-template-columns:1fr;}
  .col-side{position:static;}
  .side-news{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .footer-brand{grid-column:1/-1;}
}
@media (max-width:760px){
  body{font-size:16px;}
  .masthead .ad-slot{display:none;}
  .masthead .wrap{padding-top:16px;padding-bottom:16px;}
  .nav-toggle{display:block;}
  .primary .wrap{flex-wrap:wrap;}
  .primary .links{display:none;width:100%;flex-direction:column;}
  .primary .links.open{display:flex;}
  .primary .links a{padding:13px 16px;border-top:1px solid rgba(255,255,255,.12);}
  .lead-grid{grid-template-columns:1fr;}
  .prize-strip{grid-template-columns:1fr 1fr;}
  .cards{grid-template-columns:1fr;}
  .feature{grid-template-columns:1fr;}
  .feature .ph{min-height:200px;}
  .numbers{grid-template-columns:1fr 1fr;}
  .side-news{grid-template-columns:1fr;}
  .byline .sep{display:none;}
  .share{width:100%;margin-top:4px;}
}
@media (max-width:420px){
  .prize-strip{grid-template-columns:1fr;}
  .numbers{grid-template-columns:1fr;}
}
