/* StreamChoice Lab — review.css
   Paleta derivada das imagens do site: petróleo-marinho do selo,
   verde-mar do mapa, off-white do fundo das ilustrações. */

:root{
  --brand:#0B3A63;          /* marinho do selo */
  --brand-d:#082B4A;
  --accent:#2E7D6E;         /* verde-mar escurecido p/ contraste AA */
  --accent-l:#4D9687;       /* verde do mapa */
  --accent-bg:#EAF2F0;
  --bg:#FBFAF6;
  --card:#FFFFFF;
  --ink:#191C1E;
  --ink-2:#41484D;
  --ink-3:#6C757B;
  --line:#E3E0D9;
  --line-2:#EFEDE7;
  --warn-bg:#FDF6E8;
  --warn-line:#E8CE95;
  --radius:12px;
  --wrap:1180px;
  --font:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--font);font-size:18.5px;line-height:1.68;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--brand);text-underline-offset:2px}
a:hover{color:var(--accent)}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
.col{max-width:760px}

.skip{position:absolute;left:-9999px;top:0;background:var(--brand);color:#fff;
  padding:10px 16px;z-index:100;font-family:var(--sans)}
.skip:focus{left:8px;top:8px}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}

/* ── barra de divulgação ─────────────────────────────────── */
.disclosure-bar{background:var(--brand);color:#DCE8F1;
  font-family:var(--sans);font-size:12.5px;line-height:1.5;padding:8px 0}
.disclosure-bar .wrap{max-width:var(--wrap)}

/* ── cabeçalho ───────────────────────────────────────────── */
.site-head{background:var(--card);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:40}
.site-head .wrap{display:flex;align-items:center;gap:22px;
  justify-content:space-between;min-height:60px;flex-wrap:wrap}
.logo{display:inline-flex;align-items:center;gap:9px;font-family:var(--sans);
  font-weight:700;font-size:16.5px;letter-spacing:-.01em;color:var(--brand);
  text-decoration:none}
.site-nav{display:flex;gap:20px;font-family:var(--sans);font-size:14px}
.site-nav a{color:var(--ink-2);text-decoration:none}
.site-nav a:hover{color:var(--accent);text-decoration:underline}

/* ── cabeçalho do artigo ─────────────────────────────────── */
main{padding:34px 0 0}
.crumbs{font-family:var(--sans);font-size:13px;color:var(--ink-3);margin-bottom:20px}
.crumbs a{color:var(--ink-3)}
.crumbs span{margin:0 5px}
.article-head{margin-bottom:30px}
.kicker{font-family:var(--sans);font-size:12.5px;font-weight:700;
  letter-spacing:.10em;text-transform:uppercase;color:var(--accent);margin:0 0 12px}
h1{font-size:clamp(30px,4.6vw,44px);line-height:1.16;letter-spacing:-.018em;
  margin:0 0 18px;font-weight:600}
.standfirst{font-size:20.5px;line-height:1.56;color:var(--ink-2);margin:0 0 22px}
.byline{display:flex;align-items:center;gap:9px;flex-wrap:wrap;
  font-family:var(--sans);font-size:13.5px;color:var(--ink-3);
  border-top:1px solid var(--line);padding-top:16px}
.byline b{color:var(--ink-2);font-weight:600}
.sep{color:var(--line)}
.mono{display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:50%;background:var(--accent-bg);
  color:var(--brand);font-family:var(--sans);font-weight:700;font-size:14px;
  letter-spacing:.03em;flex:none}
.mono.lg{width:64px;height:64px;font-size:19px}

/* ── layout ──────────────────────────────────────────────── */
.layout{display:grid;grid-template-columns:minmax(0,1fr) 316px;gap:52px;
  align-items:start;padding-bottom:70px}
.content{min-width:0;max-width:760px}

.content h2{font-size:clamp(24px,3vw,31px);line-height:1.24;letter-spacing:-.015em;
  margin:52px 0 16px;font-weight:600;scroll-margin-top:78px}
.content h3{font-size:20px;line-height:1.32;margin:32px 0 10px;font-weight:600}
.content p{margin:0 0 18px}
.content ul,.content ol{margin:0 0 20px;padding-left:24px}
.content li{margin-bottom:9px}
.content figure{margin:30px 0;border-radius:var(--radius);overflow:hidden;
  background:var(--card);border:1px solid var(--line)}
.content figcaption{font-family:var(--sans);font-size:13px;line-height:1.5;
  color:var(--ink-3);padding:12px 16px;border-top:1px solid var(--line-2)}
.micro-note{font-family:var(--sans);font-size:13.5px;line-height:1.6;
  color:var(--ink-3);border-left:3px solid var(--line);padding-left:14px}
.code-line{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:13.5px;line-height:1.9;background:var(--card);
  border:1px solid var(--line);border-radius:8px;padding:12px 14px;
  overflow-x:auto;color:var(--ink-2)}
.steps{display:flex;flex-direction:column;gap:12px;margin:22px 0}

/* ── caixa de veredito ───────────────────────────────────── */
.verdict-box{background:var(--card);border:1px solid var(--line);
  border-top:4px solid var(--brand);border-radius:var(--radius);
  padding:26px 26px 24px;margin:0 0 6px}
.vb-label{font-family:var(--sans);font-size:12px;font-weight:700;
  letter-spacing:.10em;text-transform:uppercase;color:var(--ink-3);margin:0 0 10px}
.verdict-box h2{font-size:24px!important;margin:0 0 14px!important}
.verdict-box ul{padding-left:20px;margin-bottom:0}
.verdict-box li{margin-bottom:12px;font-size:17px;line-height:1.6}

/* ── botões ──────────────────────────────────────────────── */
.btn{display:inline-block;background:var(--accent);color:#fff;
  font-family:var(--sans);font-size:15px;font-weight:600;line-height:1.3;
  padding:14px 24px;border-radius:8px;text-decoration:none;text-align:center;
  transition:background .15s}
.btn:hover{background:#255F55;color:#fff}
.btn-row{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.cta-block{background:var(--brand);color:#EAF1F7;border-radius:var(--radius);
  padding:32px 28px;margin:38px 0;text-align:center}
.cta-block h3{color:#fff;margin:0 0 10px;font-size:23px}
.cta-block p{color:#C6D6E4;margin:0 0 20px;font-size:17px}
.cta-block .btn{background:var(--accent-l);color:#04211A}
.cta-block .btn:hover{background:#63A899}
.cta-fine{font-family:var(--sans);font-size:12.5px;color:#93AEC4;margin:14px 0 0}

/* ── perguntas do anúncio ────────────────────────────────── */
.claims{display:flex;flex-direction:column;gap:2px;margin:24px 0 26px;
  border-left:3px solid var(--accent-l);padding-left:0;overflow:hidden}
.claim-q{display:grid;grid-template-columns:190px 1fr;gap:16px;
  padding:13px 0 13px 18px;border-bottom:1px solid var(--line-2)}
.claim-q:last-child{border-bottom:0}
.claim-q b{font-family:var(--sans);font-size:12.5px;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3);padding-top:3px}
.claim-q span{font-size:17px;line-height:1.55;color:var(--ink)}

/* ── cartões de capacidade ───────────────────────────────── */
.cap-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));
  gap:16px;margin:26px 0}
.cap{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:20px 18px}
.cap .sym{display:inline-flex;align-items:center;justify-content:center;
  width:32px;height:32px;border-radius:8px;background:var(--accent-bg);
  color:var(--brand);font-family:var(--sans);font-weight:700;font-size:15px;
  margin-bottom:12px}
.cap h3{margin:0 0 6px;font-size:17.5px;line-height:1.3}
.cap .lead{font-family:var(--sans);font-size:13px;font-weight:600;
  color:var(--accent);margin:0 0 10px}
.cap p{font-size:15.5px;line-height:1.58;color:var(--ink-2);margin:0}

/* ── tabelas ─────────────────────────────────────────────── */
.tw{overflow-x:auto;margin:24px 0;border:1px solid var(--line);
  border-radius:var(--radius);background:var(--card)}
table{border-collapse:collapse;width:100%;font-family:var(--sans);font-size:15px}
th,td{text-align:left;padding:13px 16px;border-bottom:1px solid var(--line-2);
  vertical-align:top}
thead th{background:#F5F3EE;font-size:12.5px;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;color:var(--ink-3);white-space:nowrap}
tbody tr:last-child td{border-bottom:0}
td:first-child{color:var(--ink)}

.chip{display:inline-block;font-family:var(--sans);font-size:12.5px;font-weight:600;
  padding:3px 9px;border-radius:999px;white-space:nowrap}
.chip.si{background:var(--accent-bg);color:#1F5B50}
.chip.no{background:#F2EFE9;color:#6C6154}

/* ── notas ───────────────────────────────────────────────── */
.note{background:var(--card);border:1px solid var(--line);
  border-left:4px solid var(--accent-l);border-radius:8px;
  padding:20px 22px;margin:26px 0}
.note h3{margin:0 0 8px;font-size:18px}
.note p{margin:0;font-size:16.5px;line-height:1.62;color:var(--ink-2)}
.note.warn{background:var(--warn-bg);border-color:var(--warn-line);
  border-left-color:#C89A3C}

/* ── preços ──────────────────────────────────────────────── */
.pack-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));
  gap:16px;margin:26px 0}
.pack{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:22px 18px;display:flex;flex-direction:column;gap:5px;
  font-family:var(--sans);position:relative}
.pack.best{border:2px solid var(--accent);padding-top:30px}
.tagbest{position:absolute;top:-11px;left:14px;background:var(--accent);color:#fff;
  font-size:11.5px;font-weight:700;letter-spacing:.03em;padding:4px 10px;
  border-radius:999px}
.pack .name{font-size:13px;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;color:var(--ink-3)}
.pack .unit{font-size:31px;font-weight:700;letter-spacing:-.02em;color:var(--ink);
  line-height:1.15}
.pack .unit span{font-size:14px;font-weight:600;color:var(--ink-3)}
.pack .was{font-size:13px;color:var(--ink-3);text-decoration:line-through}
.pack .total{font-size:14.5px;color:var(--ink-2);margin-top:6px;line-height:1.5}

/* ── método ──────────────────────────────────────────────── */
.method-row{display:grid;grid-template-columns:96px 1fr;gap:20px;
  align-items:start;margin:22px 0}
.method-row img{border-radius:8px}

/* ── prós e contras ──────────────────────────────────────── */
.proscons{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));
  gap:16px;margin:26px 0}
.pc{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:22px}
.pc h3{margin:0 0 12px;font-size:18px}
.pc ul{padding-left:0;list-style:none;margin:0}
.pc li{position:relative;padding-left:26px;margin-bottom:11px;font-size:16px;
  line-height:1.55;color:var(--ink-2)}
.pc li::before{position:absolute;left:0;top:0;font-weight:700}
.pc.pro{border-top:3px solid var(--accent)}
.pc.pro li::before{content:"+";color:var(--accent);font-size:19px;line-height:1.3}
.pc.con{border-top:3px solid #B4763A}
.pc.con li::before{content:"−";color:#B4763A;font-size:19px;line-height:1.3}

/* ── FAQ ─────────────────────────────────────────────────── */
details{background:var(--card);border:1px solid var(--line);border-radius:8px;
  margin-bottom:10px;overflow:hidden}
summary{cursor:pointer;padding:16px 20px;font-family:var(--sans);font-size:16px;
  font-weight:600;list-style:none;position:relative;padding-right:46px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:20px;top:13px;font-size:21px;
  color:var(--accent);font-weight:400}
details[open] summary::after{content:"−"}
details p{margin:0;padding:0 20px 18px;font-size:16.5px;line-height:1.62;
  color:var(--ink-2)}

/* ── cluster ─────────────────────────────────────────────── */
.cluster-list{display:grid;gap:10px;margin:24px 0}
.cluster-item{display:flex;gap:16px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);padding:18px 20px;text-decoration:none;color:inherit;
  transition:border-color .15s}
.cluster-item:hover{border-color:var(--accent)}
.ci-n{flex:none;width:28px;height:28px;border-radius:50%;background:var(--accent-bg);
  color:var(--brand);font-family:var(--sans);font-weight:700;font-size:13.5px;
  display:inline-flex;align-items:center;justify-content:center}
.ci-t{display:block;font-family:var(--sans);font-size:16px;font-weight:600;
  color:var(--brand);line-height:1.35;margin-bottom:5px}
.ci-d{display:block;font-family:var(--sans);font-size:14px;line-height:1.5;
  color:var(--ink-3)}

/* ── hub de mercados ─────────────────────────────────────── */
.hub-lead{color:var(--ink-2)}
.market-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));
  gap:14px;margin:22px 0}
.market{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:18px 20px;text-decoration:none;transition:border-color .15s}
.market:hover{border-color:var(--accent)}
.m-lang{display:block;font-family:var(--sans);font-size:16.5px;font-weight:700;
  color:var(--brand);margin-bottom:4px}
.m-geo{display:block;font-family:var(--sans);font-size:13.5px;line-height:1.5;
  color:var(--ink-3)}

/* ── caixa do autor, fontes, relacionados ────────────────── */
.author-box{display:grid;grid-template-columns:64px 1fr;gap:18px;align-items:start;
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:22px;margin:44px 0 0}
.author-box h3{margin:0 0 6px;font-size:17.5px}
.author-box p{margin:0;font-family:var(--sans);font-size:14.5px;line-height:1.6;
  color:var(--ink-2)}
.sources{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:22px 24px}
.sources ol{margin:0;padding-left:22px}
.sources li{font-family:var(--sans);font-size:14px;line-height:1.6;color:var(--ink-2);
  margin-bottom:10px}
.related{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:22px 24px;margin:34px 0 0}
.related h3{margin:0 0 12px;font-size:18px}
.related ul{margin:0;padding-left:20px}
.related li{margin-bottom:8px;font-size:16.5px}

/* ── barra lateral ───────────────────────────────────────── */
.sidebar{position:sticky;top:78px;display:flex;flex-direction:column;gap:16px}
.side-card{background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);padding:22px 20px}
.side-card h3{margin:0 0 14px;font-size:18px;text-align:center}
.side-card .device{margin:0 auto 12px;width:190px;height:auto}
.side-facts{list-style:none;margin:0 0 18px;padding:0;font-family:var(--sans);
  font-size:13.5px}
.side-facts li{display:flex;justify-content:space-between;gap:10px;
  padding:8px 0;border-bottom:1px solid var(--line-2);align-items:center}
.side-facts li:last-child{border-bottom:0}
.side-facts span{color:var(--ink-3)}
.side-facts b{color:var(--ink);text-align:right;font-weight:600}
.side-card .btn{display:block;width:100%}
.side-fine{font-family:var(--sans);font-size:12.5px;color:var(--ink-3);
  margin:10px 0 0;text-align:center}
.toc{list-style:none;margin:0;padding:0;font-family:var(--sans);font-size:14px}
.toc li{margin-bottom:9px}
.toc a{color:var(--ink-2);text-decoration:none}
.toc a:hover{color:var(--accent);text-decoration:underline}

/* ── rodapé ──────────────────────────────────────────────── */
.site-foot{background:var(--brand-d);color:#A9BFD2;padding:34px 0 100px;
  font-family:var(--sans);font-size:13.5px}
.lang-switch{display:flex;gap:14px;flex-wrap:wrap;align-items:center;
  padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid rgba(255,255,255,.13)}
.lang-lead{color:#7E97AC;font-size:12.5px}
.lang-switch a{color:#CFE0EE;text-decoration:none}
.lang-switch a:hover{text-decoration:underline;color:#fff}
.lang-switch a.cur{color:#fff;font-weight:700}
.foot-nav{display:flex;gap:18px;flex-wrap:wrap;margin-bottom:16px}
.foot-nav a{color:#CFE0EE;text-decoration:none}
.foot-nav a:hover{text-decoration:underline}
.legal{font-size:12.5px;line-height:1.65;color:#8AA3B8;margin:0;max-width:900px}

/* ── CTA fixa ────────────────────────────────────────────── */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:50;
  background:rgba(251,250,246,.96);backdrop-filter:blur(8px);
  border-top:1px solid var(--line);padding:10px 20px;
  display:flex;justify-content:center}
.sticky-cta .btn{width:100%;max-width:460px;padding:13px 20px}

/* ── responsivo ──────────────────────────────────────────── */
@media (max-width:980px){
  .layout{grid-template-columns:1fr;gap:36px}
  .sidebar{position:static;order:2}
  .side-card{max-width:520px}
}
@media (max-width:620px){
  body{font-size:17.5px}
  .standfirst{font-size:18.5px}
  .claim-q{grid-template-columns:1fr;gap:5px}
  .method-row{grid-template-columns:1fr}
  .method-row img{width:72px;height:72px}
  .author-box{grid-template-columns:1fr}
  .content h2{margin-top:42px}
  .cta-block{padding:26px 20px}
  .site-nav{display:none}
}
@media print{
  .sticky-cta,.site-head,.disclosure-bar,.sidebar,.cta-block{display:none}
}