/* ==========================================================================
   Prime Male Health — Prostate Health After 50
   Design system: editorial serif + humanist sans, midnight navy + warm amber
   ========================================================================== */

/* FONTES HOSPEDADAS NO PROPRIO SITE (pasta fonts/) desde 13/09/2026.
   Antes vinham do Google Fonts: uma folha de estilo externa que TRAVAVA a pintura da
   pagina (1 conexao + 1 ida-e-volta a mais no caminho critico). Agora os dois arquivos
   .woff2 (subconjunto latino, baixados do proprio Google) ficam aqui e as paginas fazem
   <link rel="preload"> deles, entao o texto ja nasce na fonte certa, sem relayout.
   O Inter e VARIAVEL: um arquivo so cobre os pesos 400/600/700. */
@font-face{
  font-family:"Inter"; font-style:normal; font-weight:100 900; font-display:swap;
  src:url(fonts/inter-var-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Fraunces"; font-style:normal; font-weight:600; font-display:swap;
  src:url(fonts/fraunces-600-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

/* Fontes de RESERVA com metrica ajustada. Enquanto Inter/Fraunces nao chegam, o texto
   e desenhado em Arial/Georgia "esticadas" para ocupar quase a mesma largura e altura
   de linha da fonte real. Assim a troca (font-display:swap) nao empurra o layout.
   Valores do Inter->Arial sao os publicados pelo Fontaine/next-font. */
@font-face{
  font-family:"Inter-fallback"; src:local("Arial");
  ascent-override:90.2%; descent-override:22.48%; line-gap-override:0%; size-adjust:107.4%;
}
@font-face{
  font-family:"Fraunces-fallback"; src:local("Georgia");
  ascent-override:97%; descent-override:27%; line-gap-override:0%; size-adjust:100%;
}

:root{
  --navy-950:#0A1220;
  --navy-900:#0E1A2B;
  --navy-800:#16273E;
  --navy-700:#1E3555;
  --ink:#161C24;
  --ink-soft:#39434F;
  --muted:#67727F;
  --amber:#B8801F;
  --amber-bright:#D99A2B;
  --amber-pale:#F7EBD4;
  --amber-line:#E7CE9C;
  --amber-ink:#9C6411;   /* ambar escurecido: so para TEXTO pequeno sobre fundo claro (contraste 4.5:1) */
  --sage:#2F6B5F;
  --cream:#FBF8F2;
  --paper:#FFFFFF;
  --line:#E6DFD2;
  --line-soft:#F0EAE0;

  --serif:"Fraunces","Fraunces-fallback","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --sans:"Inter","Inter-fallback",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;

  --shell:1460px;
  --radius:14px;
  --shadow-sm:0 1px 2px rgba(16,22,32,.05), 0 4px 14px rgba(16,22,32,.05);
  --shadow-md:0 2px 6px rgba(16,22,32,.06), 0 18px 44px rgba(16,22,32,.09);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:96px}

body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:var(--sans);
  font-size:18px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img{max-width:100%; height:auto; display:block}
a{color:var(--navy-700); text-decoration:none}
a:hover{color:var(--amber)}

.shell{width:100%; max-width:var(--shell); margin:0 auto; padding:0 clamp(22px,5.5vw,80px)}
.skip{position:absolute; left:-9999px}
.skip:focus{left:12px; top:12px; z-index:999; background:var(--navy-900); color:#fff; padding:10px 16px; border-radius:8px}

/* ---------- Header ---------------------------------------------------- */
.site-header{
  position:sticky; top:0; z-index:80;
  background:rgba(251,248,242,.94);
  backdrop-filter:saturate(160%) blur(10px);
  border-bottom:1px solid var(--line);
}
.header-inner{display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:74px}
.brand{display:flex; align-items:center}
.brand-text{display:flex; flex-direction:column; line-height:1.1}
.brand-name{font-family:var(--serif); font-weight:600; font-size:20px; letter-spacing:-.02em; color:var(--navy-900)}
.brand-tag{font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--amber-ink); font-weight:600; margin-top:3px}

.nav{display:flex; align-items:center; gap:30px}
.nav a{
  font-size:14.5px; font-weight:600; color:var(--ink-soft);
  padding:6px 0; border-bottom:2px solid transparent; transition:.18s;
}
.nav a:hover,.nav a[aria-current="page"]{color:var(--navy-900); border-bottom-color:var(--amber)}
.nav-toggle{display:none}

/* ---------- Buttons --------------------------------------------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-family:var(--sans); font-weight:600; font-size:16px; line-height:1.25;
  padding:15px 28px; border-radius:10px; border:1px solid transparent;
  cursor:pointer; text-align:center; transition:.18s ease;
}
.btn-primary{
  background:linear-gradient(180deg,var(--amber-bright),var(--amber));
  color:#241703; box-shadow:0 2px 0 rgba(120,80,10,.35), var(--shadow-sm);
}
.btn-primary:hover{color:#241703; transform:translateY(-1px); box-shadow:0 3px 0 rgba(120,80,10,.35), var(--shadow-md)}
.btn-ghost{background:transparent; border-color:var(--navy-800); color:var(--navy-900)}
.btn-ghost:hover{background:var(--navy-900); color:#fff}
.btn-block{display:flex; width:100%}

/* ---------- Home hero ------------------------------------------------- */
.home-grid{
  display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:clamp(30px,3.6vw,58px);
  align-items:start; padding-top:clamp(26px,3vw,42px); padding-bottom:clamp(50px,6vw,84px);
}
.home-col{min-width:0}
.hero{position:relative; background:var(--navy-950); overflow:hidden; isolation:isolate; border-radius:var(--radius)}
.hero::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(100deg, rgba(10,18,32,.96) 0%, rgba(10,18,32,.86) 42%, rgba(10,18,32,.55) 100%),
    url("images/prostate-health-nighttime-urination.webp") center/cover no-repeat;
}
.hero-inner{padding:clamp(40px,4.6vw,64px) clamp(26px,3.2vw,48px); max-width:700px}
.hero-index{
  position:sticky; top:98px; max-height:calc(100vh - 120px); overflow-y:auto;
  background:var(--paper); border:1px solid var(--line);
  border-radius:var(--radius); padding:22px 20px; box-shadow:var(--shadow-sm);
}
.hero-index-head{
  font-size:11px; font-weight:700; letter-spacing:.15em; text-transform:uppercase;
  color:var(--amber); margin:0 0 4px;
}
.hero-index-note{font-size:12.5px; color:var(--muted); margin:0 0 12px}
.hero-index ol{list-style:none; margin:0; padding:0}
.hero-index li{
  display:grid; grid-template-columns:24px 1fr; gap:10px; align-items:baseline;
  padding:9px 0; border-top:1px solid var(--line-soft);
  font-size:14.5px; line-height:1.4; color:var(--ink-soft);
}
.hero-index li:first-child{border-top:0}
.hero-index li span{font-family:var(--serif); font-size:13px; font-weight:600; color:var(--amber)}
.hero-index a{color:var(--navy-800); font-weight:600}
.hero-index a:hover{color:var(--amber)}
.hero-index .soon{color:var(--muted)}
.hero-index .soon span{color:#C0B49B}
.hero-index em{
  display:block; font-style:normal; font-size:10px; font-weight:700;
  letter-spacing:.13em; text-transform:uppercase; color:#B0A48E; margin-top:3px;
}
.hero-index .writing em{color:var(--amber)}
.eyebrow{
  display:inline-flex; align-items:center; gap:9px;
  font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--amber-bright); margin:0 0 22px;
}
.eyebrow::before{content:""; width:26px; height:1px; background:var(--amber)}
.hero h1{
  font-family:var(--serif); font-weight:600;
  font-size:clamp(32px,3.6vw,46px); line-height:1.12; letter-spacing:-.024em;
  color:#fff; margin:0 0 24px;
}
.hero h1 em{font-style:italic; color:var(--amber-bright)}
.hero p{font-size:clamp(17px,1.45vw,20px); line-height:1.65; color:#C6CEDA; margin:0 0 34px; max-width:62ch}
.hero-actions{display:flex; flex-wrap:wrap; gap:14px}

/* ---------- Section furniture ---------------------------------------- */
.section{padding:clamp(52px,6vw,88px) 0}
.section-head{margin:0 0 40px; max-width:70ch}
.section-head h2{
  font-family:var(--serif); font-weight:600; font-size:clamp(27px,3vw,38px);
  line-height:1.15; letter-spacing:-.022em; color:var(--navy-900); margin:0 0 12px;
}
.section-head p{color:var(--muted); margin:0; font-size:17px}
.rule{height:1px; background:var(--line); border:0; margin:0}

/* ---------- Cards ----------------------------------------------------- */
.card-grid{display:grid; gap:30px; grid-template-columns:repeat(auto-fit,minmax(310px,1fr))}
.card{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; display:flex; flex-direction:column; transition:.2s ease;
}
.card:hover{transform:translateY(-3px); box-shadow:var(--shadow-md); border-color:var(--amber-line)}
.card-media{aspect-ratio:16/10; overflow:hidden; background:var(--line-soft)}
.card-media img{width:100%; height:100%; object-fit:cover; transition:.5s ease}
.card:hover .card-media img{transform:scale(1.04)}
.card-body{padding:26px 26px 30px; display:flex; flex-direction:column; flex:1}
.card-kicker{font-size:11.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--amber); margin:0 0 11px}
.card h3{font-family:var(--serif); font-weight:600; font-size:22px; line-height:1.25; letter-spacing:-.015em; margin:0 0 12px}
.card h3 a{color:var(--navy-900)}
.card h3 a:hover{color:var(--amber)}
.card p{color:var(--ink-soft); font-size:15.5px; line-height:1.65; margin:0 0 20px}
.card-more{margin-top:auto; font-size:14.5px; font-weight:600; color:var(--navy-700); display:inline-flex; align-items:center; gap:7px}
.card-more::after{content:"→"; transition:.2s}
.card:hover .card-more::after{transform:translateX(4px)}

.card-feature{grid-column:1/-1; flex-direction:row; align-items:stretch; background:var(--navy-900); border-color:var(--navy-800)}
.card-feature .card-media{aspect-ratio:auto; flex:0 0 44%; min-height:290px}
/* o rosto desta foto fica no lado direito; sem isto o corte vertical do card come a cabeca */
.card-feature .card-media img{object-position:88% center}
.card-feature .card-body{padding:clamp(28px,3.4vw,48px); justify-content:center}
.card-feature h3{font-size:clamp(25px,2.6vw,34px); line-height:1.16}
.card-feature h3 a,.card-feature .card-more{color:#fff}
.card-feature h3 a:hover{color:var(--amber-bright)}
.card-feature p{color:#B9C3D1; font-size:16.5px}
.card-feature .card-kicker{color:var(--amber-bright)}

/* ---------- Upcoming list -------------------------------------------- */
.upcoming{list-style:none; margin:0; padding:0; display:grid; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden}
.upcoming li{background:var(--paper); padding:17px 24px; display:flex; align-items:baseline; gap:16px; font-size:16px; color:var(--ink-soft)}
.upcoming li span{font-family:var(--serif); font-size:14px; font-weight:600; color:var(--amber); flex:none; min-width:22px}
.upcoming li em{font-style:normal; margin-left:auto; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); flex:none; padding-left:14px}

/* ---------- Article shell -------------------------------------------- */
.article-hero{background:var(--navy-950); color:#fff; padding:clamp(40px,5vw,72px) 0 clamp(40px,5vw,64px)}
/* Capa dividida (12/09/2026): titulo a esquerda, foto a direita, DENTRO do bloco azul.
   A foto aparece inteira (caixa 3:2 = proporcao do arquivo) e nunca e cortada nem ampliada.
   A Carla reprovou as duas versoes anteriores (faixa de ponta a ponta; 16:9 com altura
   limitada) porque em notebook de tela baixa a foto ficava enorme e cortava o rosto. */
.article-hero .shell{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,40%);
  column-gap:clamp(28px,4.5vw,72px); align-items:center;
}
.article-hero .shell{grid-template-rows:auto 1fr auto}
.article-hero .crumbs{grid-column:1/-1}
/* h1 encosta no fim da linha do meio e a byline no comeco da ultima: os dois ficam
   colados um no outro e centralizados na altura da foto */
.article-hero h1{grid-column:1; align-self:end}
.article-hero .byline{grid-column:1; align-self:start}
.crumbs{font-size:13px; color:#8C99AB; margin:0 0 22px}
.crumbs a{color:#8C99AB}
.crumbs a:hover{color:var(--amber-bright)}
.article-hero h1{
  font-family:var(--serif); font-weight:600;
  font-size:clamp(31px,4.3vw,54px); line-height:1.08; letter-spacing:-.026em;
  color:#fff; margin:0 0 22px; max-width:20ch;
}
.byline{display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; font-size:14px; color:#9AA6B7; padding-bottom:0}
.byline strong{color:#fff; font-weight:600}
.byline .dot{width:3px; height:3px; border-radius:50%; background:#4A5666}
/* A figure fica dentro de .article-hero .shell, coluna da direita, ocupando as linhas do h1 e da byline */
.hero-figure{grid-column:2; grid-row:2/4; margin:0; align-self:center}
.hero-figure img{
  display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:cover;
  border-radius:var(--radius); box-shadow:0 18px 40px rgba(0,0,0,.35);
}
/* classes antigas de recorte (focus-high / focus-top): sem efeito agora, a foto nao e cortada */
.hero-figure figcaption{font-size:13px; color:#9AA6B7; padding:10px 0 0; text-align:center}

.layout{display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:clamp(40px,4.5vw,76px); padding-top:clamp(40px,5vw,68px); padding-bottom:clamp(56px,6vw,96px); align-items:start}
.content{min-width:0; max-width:74ch}

/* ---------- Article typography --------------------------------------- */
.content > p{margin:0 0 26px; color:var(--ink-soft)}
.content > p.lede{font-size:20.5px; line-height:1.68; color:var(--ink)}
.content h2{
  font-family:var(--serif); font-weight:600;
  font-size:clamp(25px,2.7vw,34px); line-height:1.2; letter-spacing:-.02em;
  color:var(--navy-900); margin:52px 0 18px; padding-top:16px; border-top:1px solid var(--line);
}
.content h3{font-family:var(--serif); font-weight:600; font-size:21px; line-height:1.3; color:var(--navy-800); margin:34px 0 12px}
.content ul,.content ol{margin:0 0 26px; padding-left:24px; color:var(--ink-soft)}
.content li{margin-bottom:11px}
.content li::marker{color:var(--amber)}
.content strong{color:var(--ink); font-weight:600}
.content a{color:var(--navy-700); text-decoration:underline; text-decoration-color:var(--amber-line); text-underline-offset:3px; text-decoration-thickness:2px}
.content a:hover{color:var(--amber); text-decoration-color:var(--amber)}
/* Fotos do corpo do artigo (13/09/2026): antes ocupavam a coluna inteira (~800px de largura,
   530px de altura) e em notebook de tela baixa viravam foto de tela cheia. A Carla pediu
   menor. Agora: no maximo 560px de largura, centralizadas, com a legenda centralizada. */
.content figure{margin:36px auto; max-width:560px}
.content figure img{display:block; width:100%; height:auto; border-radius:var(--radius)}
.content figcaption{font-size:13.5px; color:var(--muted); margin-top:11px; line-height:1.55; text-align:center}

/* Answer block (AI + featured-snippet bait) */
.answer-block{
  background:var(--navy-900); color:#E9EDF3; border-radius:var(--radius);
  padding:clamp(24px,2.6vw,34px); margin:0 0 38px; position:relative;
  border-left:4px solid var(--amber-bright);
}
.answer-block h2{
  all:unset; display:block;
  font-family:var(--sans); font-size:11.5px; font-weight:700; letter-spacing:.17em;
  text-transform:uppercase; color:var(--amber-bright); margin-bottom:13px;
}
.answer-block p{margin:0; font-size:18.5px; line-height:1.66; color:#E9EDF3}
.answer-block p strong{color:#fff}

/* Stat callout with source */
.stat{
  display:grid; grid-template-columns:auto 1fr; gap:20px; align-items:center;
  background:var(--amber-pale); border:1px solid var(--amber-line);
  border-radius:var(--radius); padding:24px 26px; margin:34px 0;
}
.stat-num{font-family:var(--serif); font-weight:600; font-size:clamp(34px,4vw,46px); line-height:1; color:var(--amber); letter-spacing:-.03em}
.stat p{margin:0; font-size:15.5px; line-height:1.6; color:#4A3A19}
.stat cite{display:block; font-style:normal; font-size:12.5px; color:#7A6535; margin-top:7px}
.stat cite a{color:#7A6535; text-decoration-color:#C9AE72}

/* Pull quote */
.pull{
  margin:40px 0; padding:6px 0 6px 26px; border-left:3px solid var(--amber);
  font-family:var(--serif); font-size:22px; line-height:1.45; font-style:italic; color:var(--navy-800);
}
.pull footer{font-family:var(--sans); font-style:normal; font-size:13.5px; color:var(--muted); margin-top:12px}

/* Note / warning */
.note{
  background:var(--paper); border:1px solid var(--line); border-left:4px solid var(--sage);
  border-radius:var(--radius); padding:22px 26px; margin:32px 0;
}
.note h4{margin:0 0 9px; font-size:15px; font-weight:700; color:var(--sage); letter-spacing:.01em}
.note p{margin:0; font-size:15.5px; line-height:1.65; color:var(--ink-soft)}
.note p + p{margin-top:11px}

/* Checklist */
.check{list-style:none; padding:0; margin:26px 0}
.check li{position:relative; padding-left:34px; margin-bottom:14px; color:var(--ink-soft)}
.check li::before{
  content:""; position:absolute; left:0; top:8px; width:19px; height:19px; border-radius:50%;
  background:var(--amber-pale); border:1px solid var(--amber-line);
}
.check li::after{content:""; position:absolute; left:6px; top:13px; width:7px; height:4px; border-left:2px solid var(--amber); border-bottom:2px solid var(--amber); transform:rotate(-45deg)}

/* ---------- Affiliate box -------------------------------------------- */
.affiliate{
  background:var(--paper); border:1px solid var(--amber-line); border-radius:var(--radius);
  padding:clamp(26px,3vw,36px); margin:46px 0; box-shadow:var(--shadow-sm);
  position:relative; overflow:hidden;
}
.affiliate::before{content:""; position:absolute; inset:0 auto 0 0; width:5px; background:linear-gradient(180deg,var(--amber-bright),var(--amber))}
.affiliate-tag{
  display:inline-block; font-size:10.5px; font-weight:700; letter-spacing:.15em; text-transform:uppercase;
  color:#7A5210; background:var(--amber-pale); border:1px solid var(--amber-line);
  padding:5px 11px; border-radius:99px; margin-bottom:16px;
}
.affiliate h3{font-family:var(--serif); font-weight:600; font-size:clamp(21px,2.2vw,27px); line-height:1.25; color:var(--navy-900); margin:0 0 14px}
.affiliate p{font-size:16px; line-height:1.68; color:var(--ink-soft); margin:0 0 16px}
.affiliate .honest{
  font-size:14px; line-height:1.6; color:var(--muted);
  background:var(--cream); border:1px dashed var(--line);
  border-radius:10px; padding:15px 18px; margin:20px 0;
}
.affiliate .honest strong{color:var(--ink-soft)}
.affiliate .btn{margin-top:4px}
.affiliate .fineprint{font-size:12.5px; color:var(--muted); margin:14px 0 0}

/* ---------- FAQ ------------------------------------------------------- */
.faq{margin:26px 0 0; border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  cursor:pointer; list-style:none; padding:22px 44px 22px 0; position:relative;
  font-family:var(--serif); font-size:19px; font-weight:600; line-height:1.35; color:var(--navy-900);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:""; position:absolute; right:8px; top:31px; width:13px; height:13px;
  border-right:2px solid var(--amber); border-bottom:2px solid var(--amber);
  transform:rotate(45deg); transition:.25s;
}
.faq details[open] summary::after{transform:rotate(-135deg); top:35px}
.faq summary:hover{color:var(--amber)}
.faq details > div{padding:0 30px 24px 0}
.faq details p{margin:0 0 14px; color:var(--ink-soft); font-size:16.5px; line-height:1.7}
.faq details p:last-child{margin-bottom:0}

/* ---------- Author box ------------------------------------------------ */
.author-box{
  display:grid; grid-template-columns:auto 1fr; gap:26px; align-items:start;
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  padding:clamp(24px,3vw,34px); margin:52px 0 0;
}
.author-photo{
  width:104px; height:104px; border-radius:50%; flex:none; object-fit:cover;
  border:3px solid var(--paper); box-shadow:0 0 0 1px var(--amber-line), var(--shadow-sm);
  background:linear-gradient(150deg,var(--navy-800),var(--navy-950));
}
.author-box .kicker{font-size:11px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--amber-ink); margin:0 0 7px}
.author-box h3{font-family:var(--serif); font-weight:600; font-size:22px; margin:0 0 12px; color:var(--navy-900)}
.author-box p{font-size:15.5px; line-height:1.7; color:var(--ink-soft); margin:0 0 13px}
.author-box p:last-child{margin-bottom:0}
.author-box .disclaimer{font-size:14px; color:var(--muted); border-top:1px solid var(--line-soft); padding-top:13px}

/* ---------- Sidebar --------------------------------------------------- */
.sidebar{position:sticky; top:98px; display:flex; flex-direction:column; gap:24px}
.widget{background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:24px}
.widget-title{font-size:11px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--amber-ink); margin:0 0 16px}
.toc{list-style:none; margin:0; padding:0; counter-reset:toc}
.toc li{counter-increment:toc; margin-bottom:2px}
.toc a{
  display:flex; gap:11px; padding:8px 10px; margin-left:-10px; border-radius:8px;
  font-size:14.5px; line-height:1.45; color:var(--ink-soft); transition:.15s;
}
.toc a::before{content:counter(toc,decimal-leading-zero); font-family:var(--serif); font-size:12px; font-weight:600; color:var(--amber); flex:none; padding-top:2px}
.toc a:hover{background:var(--cream); color:var(--navy-900)}

.widget-author{text-align:center}
.widget-author .author-photo{margin:0 auto 15px; width:84px; height:84px}
.widget-author h4{font-family:var(--serif); font-weight:600; font-size:19px; margin:0 0 8px; color:var(--navy-900)}
.widget-author p{font-size:14.5px; line-height:1.6; color:var(--ink-soft); margin:0 0 15px}
.widget-author a{font-size:14px; font-weight:600}

.widget-cta{background:var(--navy-900); border-color:var(--navy-800)}
.widget-cta .widget-title{color:var(--amber-bright)}
.widget-cta h4{font-family:var(--serif); font-weight:600; font-size:20px; line-height:1.3; color:#fff; margin:0 0 12px}
.widget-cta p{font-size:14.5px; line-height:1.6; color:#AEB9C8; margin:0 0 18px}
.widget-cta .fineprint{font-size:12px; color:#7E8B9C; margin:12px 0 0; text-align:center}

.widget-related{padding-bottom:8px}
.related-list{list-style:none; margin:0; padding:0}
.related-list li{border-top:1px solid var(--line-soft); padding:14px 0}
.related-list li:first-child{border-top:0; padding-top:0}
.related-list a{font-size:15px; font-weight:600; line-height:1.45; color:var(--navy-800); display:block}
.related-list a:hover{color:var(--amber)}
.related-list span{display:block; font-size:12.5px; color:var(--muted); margin-top:4px}

/* ---------- About page ------------------------------------------------ */
.about-hero{background:var(--navy-950); color:#fff; padding:clamp(56px,7vw,104px) 0}
.about-hero-grid{display:grid; grid-template-columns:300px minmax(0,1fr); gap:clamp(32px,5vw,72px); align-items:center}
.about-portrait{
  width:100%; aspect-ratio:4/5; border-radius:18px; overflow:hidden;
  background:linear-gradient(150deg,var(--navy-800),var(--navy-950));
  border:1px solid rgba(231,206,156,.25);
}
.about-portrait img{width:100%; height:100%; object-fit:cover}
.about-hero h1{font-family:var(--serif); font-weight:600; font-size:clamp(33px,4.6vw,56px); line-height:1.06; letter-spacing:-.026em; margin:0 0 20px; color:#fff}
.about-hero p{font-size:clamp(17px,1.5vw,20px); line-height:1.65; color:#BFC8D5; margin:0 0 16px; max-width:60ch}
.about-hero p:last-child{margin-bottom:0}

.values{display:grid; gap:24px; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); margin:0}
.value{background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:28px}
.value-icon{width:40px; height:40px; border-radius:11px; background:var(--amber-pale); border:1px solid var(--amber-line); display:grid; place-items:center; margin-bottom:16px}
.value-icon svg{width:20px; height:20px; stroke:var(--amber); fill:none; stroke-width:1.8}
.value h3{font-family:var(--serif); font-weight:600; font-size:19px; margin:0 0 10px; color:var(--navy-900)}
.value p{font-size:15px; line-height:1.65; color:var(--ink-soft); margin:0}

/* ---------- Footer ---------------------------------------------------- */
.site-footer{background:var(--navy-950); color:#9AA6B7; padding:clamp(52px,6vw,76px) 0 34px; margin-top:auto}
.footer-grid{display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:clamp(30px,4vw,60px); padding-bottom:44px}
.footer-brand .brand-name{color:#fff}
.footer-brand p{font-size:15px; line-height:1.7; margin:18px 0 0; max-width:42ch}
.site-footer h4{font-size:11px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--amber-bright); margin:0 0 16px}
.site-footer ul{list-style:none; margin:0; padding:0}
.site-footer li{margin-bottom:11px}
.site-footer a{color:#9AA6B7; font-size:15px}
.site-footer a:hover{color:var(--amber-bright)}
.disclosures{border-top:1px solid rgba(255,255,255,.09); padding-top:28px; display:grid; gap:16px}
.disclosures p{font-size:13.5px; line-height:1.65; margin:0; color:#7E8B9C}
.disclosures strong{color:#B9C3D1; font-weight:600}
.copyright{border-top:1px solid rgba(255,255,255,.09); margin-top:26px; padding-top:22px; font-size:13px; color:#748091}

/* ---------- Responsive ------------------------------------------------ */
@media (max-width:1080px){
  .layout{grid-template-columns:minmax(0,1fr); gap:44px}
  .home-grid{grid-template-columns:minmax(0,1fr); gap:34px}
  .hero-inner{max-width:none}
  .hero-index{position:static; max-height:none; overflow:visible}
  .content{max-width:none}
  .sidebar{position:static; display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
  .widget-toc{display:none}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-brand{grid-column:1/-1}
  .card-feature{flex-direction:column}
  .card-feature .card-media{flex:none; min-height:0; aspect-ratio:16/9}
  .about-hero-grid{grid-template-columns:220px minmax(0,1fr); gap:36px}
}

@media (max-width:760px){
  body{font-size:17px}
  .header-inner{min-height:64px; flex-wrap:wrap; gap:12px}
  .nav{gap:20px; width:100%; overflow-x:auto; padding-bottom:10px; -webkit-overflow-scrolling:touch; scrollbar-width:none}
  .nav::-webkit-scrollbar{display:none}
  .nav a{white-space:nowrap; font-size:14px}
  .home-grid{padding-top:20px; padding-bottom:44px}
  .hero-actions .btn{flex:1 1 100%}
  .content > p.lede{font-size:18.5px}
  .content h2{margin-top:42px}
  .answer-block p{font-size:17px}
  .stat{grid-template-columns:1fr; gap:10px; text-align:left}
  .author-box{grid-template-columns:1fr; gap:18px; text-align:center}
  .author-box .author-photo{margin:0 auto}
  .author-box .kicker{text-align:center}
  .sidebar{grid-template-columns:1fr}
  .about-hero-grid{grid-template-columns:1fr; gap:30px}
  .about-portrait{max-width:260px; margin:0 auto}
  .footer-grid{grid-template-columns:1fr; gap:34px}
  .article-hero .shell{grid-template-columns:1fr; row-gap:0}
  .hero-figure{grid-column:1; grid-row:auto; margin-top:26px}
  .hero-figure img{border-radius:10px}
  .pull{font-size:19px}
  .faq summary{font-size:17.5px; padding-right:38px}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none !important; transition:none !important; scroll-behavior:auto !important}
}

/* ==========================================================================
   === REVIEW PAGE ===
   Estilos usados apenas em flowforce-max-review.html.
   Classes com prefixo proprio (rv-, pc-, price-, trust-, fit-, ing-) para
   nao afetar as outras paginas do site.
   ========================================================================== */

/* ---------- Review hero (ocupa a tela toda no desktop) ---------------- */
.rv-hero{
  background:var(--navy-950); color:#fff; position:relative; isolation:isolate;
  border-bottom:1px solid var(--navy-800);
  padding:clamp(28px,3.4vw,44px) 0 clamp(34px,4vw,56px);
  min-height:min(100vh,880px); display:flex; align-items:center;
}
.rv-hero::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:radial-gradient(120% 90% at 78% 30%, rgba(217,154,43,.18) 0%, rgba(10,18,32,0) 62%);
}
.rv-hero-grid{
  display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:clamp(30px,4vw,64px); align-items:center; width:100%;
}
.rv-hero .crumbs{margin:0 0 18px}
.rv-hero h1{
  font-family:var(--serif); font-weight:600;
  font-size:clamp(30px,3.9vw,50px); line-height:1.08; letter-spacing:-.026em;
  color:#fff; margin:0 0 20px; max-width:19ch;
}
.rv-verdict{
  font-size:clamp(17px,1.55vw,21px); line-height:1.6; color:#D3DAE5;
  margin:0 0 26px; max-width:52ch;
}
.rv-verdict strong{color:#fff; font-weight:600}

.rv-scorebar{
  display:flex; flex-wrap:wrap; align-items:center; gap:14px 22px;
  background:rgba(255,255,255,.05); border:1px solid rgba(231,206,156,.22);
  border-radius:var(--radius); padding:18px 22px; margin:0 0 26px;
}
.rv-score{display:flex; align-items:baseline; gap:4px; font-family:var(--serif); line-height:1}
.rv-score b{font-size:44px; font-weight:600; color:var(--amber-bright); letter-spacing:-.03em}
.rv-score span{font-size:17px; color:#8C99AB; font-weight:600}
.rv-score-meta{display:flex; flex-direction:column; gap:5px; min-width:0}
.stars{
  font-size:23px; line-height:1; letter-spacing:1px; font-family:Georgia,serif;
  background:linear-gradient(90deg,var(--amber-bright) 92%, rgba(255,255,255,.22) 92%);
  -webkit-background-clip:text; background-clip:text;
  color:transparent; -webkit-text-fill-color:transparent;
}
.rv-score-label{font-size:12.5px; letter-spacing:.08em; text-transform:uppercase; color:#93A0B2; font-weight:600}

.rv-actions{display:flex; flex-wrap:wrap; align-items:center; gap:14px 18px; margin:0 0 16px}
.rv-actions .btn{font-size:17px; padding:17px 32px}
.rv-guarantee-inline{display:flex; align-items:center; gap:11px; font-size:14.5px; color:#B9C3D1; line-height:1.4}
.rv-guarantee-inline img{width:44px; height:44px; flex:none}
.rv-disclosure-inline{margin-bottom:16px; 
  font-size:12.8px; line-height:1.55; color:#8C99AB; margin:0; max-width:56ch;
  border-left:2px solid rgba(231,206,156,.35); padding-left:12px;
}
.rv-hero-media{margin:0; display:flex; justify-content:center}
.rv-hero-media img{width:100%; max-width:470px; height:auto; filter:drop-shadow(0 30px 46px rgba(0,0,0,.5))}

/* ---------- Trust bar -------------------------------------------------- */
.trustbar{background:var(--paper); border-bottom:1px solid var(--line)}
.trustbar-inner{
  display:grid; gap:1px; grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  background:var(--line);
}
.trust-item{background:var(--paper); padding:22px 24px}
.trust-item b{display:block; font-family:var(--serif); font-size:17px; color:var(--navy-900); margin-bottom:5px; font-weight:600}
.trust-item span{display:block; font-size:13.8px; line-height:1.55; color:var(--muted)}
.trust-seals{padding:22px 0 26px; text-align:center}
.trust-seals img{max-width:660px; margin:0 auto; opacity:.82}
.trust-seals p{font-size:12.5px; color:var(--muted); margin:12px auto 0; max-width:76ch; line-height:1.6}

/* ---------- Evidence pills -------------------------------------------- */
.ing-list{list-style:none; margin:26px 0 30px; padding:0; display:grid; gap:14px}
.ing-list > li{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  padding:20px 22px;
}
.ing-head{display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; margin-bottom:9px}
.ing-head h3{font-family:var(--serif); font-size:19px; font-weight:600; color:var(--navy-900); margin:0}
.ing-list p{margin:0; font-size:15.8px; line-height:1.68; color:var(--ink-soft)}
.ing-list p + p{margin-top:9px}
.pill{
  display:inline-block; font-size:10.5px; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; padding:4px 10px; border-radius:99px; white-space:nowrap;
}
.pill-ok{background:#E4F0EC; color:#1F5449; border:1px solid #B7D6CD}
.pill-mixed{background:var(--amber-pale); color:#7A5A15; border:1px solid var(--amber-line)}
.pill-weak{background:#F2EFEA; color:#6B6152; border:1px solid #DDD5C6}
.pill-against{background:#F8E9E6; color:#8A3A2A; border:1px solid #E8C5BC}

/* ---------- Pros e contras --------------------------------------------- */
.pc-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:24px; margin:30px 0 8px}
.pc-card{background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:26px 26px 22px}
.pc-card h3{font-family:var(--serif); font-size:20px; font-weight:600; margin:0 0 16px}
.pc-pros{border-top:4px solid var(--sage)}
.pc-cons{border-top:4px solid #B4543F}
.pc-pros h3{color:var(--sage)}
.pc-cons h3{color:#A0492F}
.pc-card ul{list-style:none; margin:0; padding:0}
.pc-card li{position:relative; padding-left:28px; margin-bottom:13px; font-size:15.8px; line-height:1.62; color:var(--ink-soft)}
.pc-card li:last-child{margin-bottom:0}
.pc-pros li::before{content:"+"; position:absolute; left:0; top:-1px; font-weight:700; font-size:17px; color:var(--sage)}
.pc-cons li::before{content:"\2013"; position:absolute; left:2px; top:-1px; font-weight:700; font-size:17px; color:#A0492F}

/* ---------- Serve / nao serve ------------------------------------------ */
.fit-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:24px; margin:30px 0}
.fit-card{border-radius:var(--radius); padding:26px; border:1px solid var(--line); background:var(--paper)}
.fit-card.no{background:#FCF6F4; border-color:#E8CFC7}
.fit-card h3{font-family:var(--serif); font-size:19px; font-weight:600; margin:0 0 14px; color:var(--navy-900)}
.fit-card.no h3{color:#8A3A2A}
.fit-card ul{margin:0; padding-left:20px}
.fit-card li{font-size:15.6px; line-height:1.62; color:var(--ink-soft); margin-bottom:11px}
.fit-card li:last-child{margin-bottom:0}
.fit-card.no li::marker{color:#B4543F}

/* ---------- Precos ------------------------------------------------------ */
.price-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(188px,1fr)); gap:16px; margin:32px 0 18px; align-items:stretch}
.price-card{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  padding:24px 18px 26px; display:flex; flex-direction:column; position:relative;
}
.price-card.best{border:2px solid var(--amber); box-shadow:var(--shadow-md)}
.price-badge{
  position:absolute; top:-13px; left:50%; transform:translateX(-50%);
  background:linear-gradient(180deg,var(--amber-bright),var(--amber)); color:#241703;
  font-size:10.5px; font-weight:700; letter-spacing:.13em; text-transform:uppercase;
  padding:5px 14px; border-radius:99px; white-space:nowrap;
}
.price-card h3{font-family:var(--serif); font-size:19px; font-weight:600; margin:6px 0 4px; color:var(--navy-900)}
.price-supply{font-size:12.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); font-weight:600; margin:0 0 14px}
.price-num{font-family:var(--serif); font-size:40px; font-weight:600; line-height:1; color:var(--navy-900); letter-spacing:-.03em; margin:0}
.price-num sup{font-size:20px; top:-.55em; position:relative}
.price-per{font-size:14.5px; color:var(--muted); margin:8px 0 16px}
.price-card ul{list-style:none; margin:0 0 20px; padding:0}
.price-card li{font-size:14.5px; line-height:1.5; color:var(--ink-soft); padding:8px 0 8px 22px; position:relative; border-top:1px solid var(--line-soft)}
.price-card li:first-child{border-top:0}
.price-card li::before{content:"\2713"; position:absolute; left:0; top:8px; color:var(--amber); font-weight:700; font-size:13px}
.price-card li.no::before{content:"\00b7"; color:var(--muted); font-size:19px; top:4px; left:4px}
.price-card .btn{margin-top:auto; padding:13px 14px; font-size:15px}
.price-note{font-size:13.5px; line-height:1.65; color:var(--muted); margin:0 0 8px}

/* ---------- Veredito final / CTA --------------------------------------- */
.rv-final{
  background:var(--navy-900); border-radius:var(--radius); color:#E9EDF3;
  padding:clamp(28px,3.4vw,42px); margin:44px 0 0; border-left:4px solid var(--amber-bright);
}
.rv-final .affiliate-tag{background:rgba(217,154,43,.14); border-color:rgba(231,206,156,.3); color:var(--amber-bright)}
.rv-final h3{font-family:var(--serif); font-size:clamp(22px,2.4vw,29px); font-weight:600; color:#fff; margin:0 0 14px; line-height:1.24}
.rv-final p{font-size:16.5px; line-height:1.7; color:#C6CEDA; margin:0 0 15px}
.rv-final-cta{display:flex; flex-wrap:wrap; align-items:center; gap:16px 22px; margin-top:24px}
.rv-final-cta .btn{font-size:17px; padding:17px 32px}
.rv-final-guarantee{display:flex; align-items:center; gap:12px; font-size:14.5px; line-height:1.45; color:#B9C3D1; max-width:32ch}
.rv-final-guarantee img{width:56px; height:56px; flex:none}
.rv-final .fineprint{font-size:12.8px; color:#8C99AB; margin:18px 0 0}

/* ---------- Barra de compra fixa (desktop + celular) -------------------- */
.sticky-cta{
  position:fixed; left:0; right:0; bottom:0; z-index:90;
  background:rgba(14,26,43,.97); backdrop-filter:saturate(160%) blur(10px);
  border-top:1px solid var(--navy-700);
  padding:11px 0 calc(11px + env(safe-area-inset-bottom));
  transform:translateY(115%); transition:transform .28s ease;
  visibility:hidden;
}
body.cta-on .sticky-cta{transform:translateY(0); visibility:visible}
body.has-sticky-cta{padding-bottom:104px}

.sticky-inner{display:flex; align-items:center; gap:18px}
.sticky-thumb{width:44px; height:auto; flex:none}
.sticky-text{display:flex; flex-direction:column; gap:2px; min-width:0; margin-right:auto}
.sticky-text b{font-family:var(--serif); font-size:17px; font-weight:600; color:#fff; line-height:1.2}
.sticky-text span{font-size:12.5px; color:#9FAABA; line-height:1.35}
.sticky-text span i{font-style:normal}
.sticky-price{color:var(--amber-bright); font-weight:600; white-space:nowrap}
.sticky-cta .btn{flex:none; font-size:15.5px; padding:13px 26px}
.sticky-fine{
  margin:6px 0 0; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase;
  color:#788597; text-align:center;
}

@media (max-width:1080px){
  .rv-hero{min-height:0; padding-bottom:clamp(30px,4vw,48px)}
  .rv-hero-grid{grid-template-columns:minmax(0,1fr); gap:30px}
  .rv-hero-media{order:-1}
  .rv-hero-media img{max-width:330px}
  .rv-hero h1{max-width:none}
}

@media (max-width:760px){
  .rv-hero h1{font-size:clamp(27px,7.4vw,34px)}
  .rv-score b{font-size:38px}
  .rv-actions{flex-direction:column; align-items:stretch}
  .rv-actions .btn{width:100%}
  .rv-final-cta{flex-direction:column; align-items:stretch}
  .rv-final-cta .btn{width:100%}
  .rv-final-guarantee{max-width:none}
  .trust-seals img{max-width:100%}
  .price-grid{gap:26px}

  .sticky-inner{gap:12px}
  .sticky-thumb{width:38px}
  .sticky-text b{font-size:15px}
  .sticky-text span i{display:none}
  .sticky-cta .btn{font-size:15px; padding:12px 18px}
  .sticky-fine{font-size:9.5px; margin-top:5px}
}

@media (max-width:520px){
  .sticky-inner{flex-wrap:wrap}
  .sticky-thumb{display:none}
  .sticky-text{margin-right:0; flex:1}
  .sticky-cta .btn{width:100%; font-size:16px; padding:13px 20px}
}

@media print{.sticky-cta{display:none}}

/* ==========================================================================
   === REVIEW PAGE — escala compacta ===
   Escopado em body.rv-page para NAO afetar os artigos do blog, que ja estao
   aprovados na escala maior. Aqui a leitura e comercial, nao editorial:
   texto menor, imagens menores, menos rolagem ate o botao.
   ========================================================================== */

body.rv-page{font-size:16px; line-height:1.68}

/* Selo de confianca que ocupa o lugar do menu nesta pagina */
.header-trust{
  display:inline-flex; align-items:center; gap:8px;
  font-size:12.5px; font-weight:600; letter-spacing:.04em;
  color:var(--muted); white-space:nowrap;
}
.header-trust svg{width:15px; height:15px; fill:var(--amber); flex:none}
@media (max-width:560px){
  .header-trust{font-size:11px; gap:6px; white-space:normal; text-align:right}
}

.rv-page .content{max-width:68ch}
.rv-page .content > p{margin:0 0 20px}
.rv-page .content > p.lede{font-size:17.5px; line-height:1.62}
.rv-page .content h2{font-size:clamp(21px,1.9vw,26px); margin:40px 0 14px; padding-top:14px}
.rv-page .content h3{font-size:18px; margin:26px 0 10px}
.rv-page .content ul,.rv-page .content ol{margin:0 0 20px}
.rv-page .content li{margin-bottom:8px}

/* Imagens do corpo: menores e centralizadas */
.rv-page .content figure{margin:24px auto; max-width:400px}
.rv-page .content figcaption{font-size:12.5px; margin-top:9px}

/* Hero: nao ocupa mais a tela inteira */
.rv-page .rv-hero{min-height:0; padding:clamp(22px,2.6vw,34px) 0 clamp(26px,3vw,40px)}
.rv-page .rv-hero-grid{gap:clamp(24px,3vw,48px)}
.rv-page .rv-hero h1{font-size:clamp(27px,3vw,40px); margin:0 0 16px; max-width:21ch}
.rv-page .rv-verdict{font-size:clamp(15.5px,1.25vw,17.5px); line-height:1.55; margin:0 0 20px; max-width:56ch}
.rv-page .rv-hero-media img{max-width:390px}
.rv-page .rv-scorebar{padding:14px 18px; margin:0 0 20px}
.rv-page .rv-score b{font-size:35px}
.rv-page .rv-actions .btn{font-size:16px; padding:15px 28px}
.rv-page .rv-disclosure-inline{margin-bottom:14px; font-size:11.5px; line-height:1.5; border-left-width:2px; padding-left:10px}

/* Blocos internos */
.rv-page .answer-block{padding:clamp(20px,2.2vw,28px); margin:0 0 30px}
/* o h2 do answer-block e uma etiqueta, nao um titulo de secao: anular
   a margem/borda que .rv-page .content h2 aplicaria por ser mais especifica */
.rv-page .answer-block h2{margin:0 0 11px; padding-top:0; border-top:0; font-size:11.5px}
.rv-page .answer-block p{font-size:16.5px; line-height:1.6}
.rv-page .trust-item{padding:18px 20px}
.rv-page .trust-item b{font-size:15.5px}
.rv-page .trust-item span{font-size:13px}
.rv-page .trust-seals img{max-width:min(480px,100%)}
/* padding-left:0 anula o recuo de marcador que .content ul aplica: estes <li>
   sao cartoes, nao itens de lista, e o recuo os deixava tortos na coluna */
.rv-page .ing-list{gap:11px; margin:22px 0 26px; padding-left:0}
/* min-width:0 anula o min-width:auto que TODO item de grid tem por padrao.
   Sem isso o li se recusava a encolher abaixo da etiqueta .pill (white-space:nowrap)
   e vazava 35px para fora da tela em 320px de largura. Medido em 11/09/2026. */
.rv-page .ing-list > li{padding:17px 19px; min-width:0}
/* o h3 do ingrediente e um rotulo dentro do card, nao um titulo de secao:
   anular a margem que .rv-page .content h3 aplicaria (mesma especificidade) */
.rv-page .ing-head h3{font-size:17px; margin:0}
/* titulo e etiqueta centralizados; o paragrafo segue alinhado a esquerda,
   que e o que se le confortavelmente em bloco corrido */
.rv-page .ing-head{justify-content:center; text-align:center; margin-bottom:11px}
.rv-page .ing-list p{font-size:14.8px; line-height:1.6}
.rv-page .pc-card{padding:22px 22px 19px}
.rv-page .pc-card h3{font-size:18px; margin:0 0 13px}
.rv-page .pc-card li{font-size:14.8px; line-height:1.55; margin-bottom:11px}
.rv-page .fit-card{padding:22px}
.rv-page .fit-card h3{font-size:17.5px; margin:0 0 12px}
.rv-page .fit-card li{font-size:14.8px; line-height:1.55; margin-bottom:9px}
.rv-page .price-card h3{font-size:17.5px; margin:6px 0 4px}
.rv-page .price-num{font-size:34px}
.rv-page .price-card li{font-size:13.8px; padding:7px 0 7px 22px}
.rv-page .rv-final{padding:clamp(24px,2.8vw,34px); margin:36px 0 0}
.rv-page .rv-final h3{font-size:clamp(20px,2vw,25px); margin:0 0 12px}
.rv-page .rv-final p{font-size:15.5px; line-height:1.62; margin:0 0 13px}
.rv-page .rv-final-cta .btn{font-size:16px; padding:15px 28px}
.rv-page .author-box p{font-size:14.8px; line-height:1.62}
.rv-page .faq summary{font-size:16px}

@media (max-width:760px){
  body.rv-page{font-size:15.5px}
  .rv-page .content figure{max-width:290px}
  .rv-page .rv-hero-media img{max-width:230px}
}

/* mesmos casos: h3 que e titulo de caixa, nao de secao */
.rv-page .author-box h3{margin:0 0 10px; padding-top:0; border-top:0}
.rv-page .affiliate h3{margin:0 0 12px; padding-top:0; border-top:0}

/* link fora da coluna de texto: sublinhado explicito para nao depender da cor,
   que e o que a auditoria de acessibilidade exige */
.trust-seals p a{text-decoration:underline; text-decoration-color:var(--amber); text-underline-offset:3px; text-decoration-thickness:2px; color:var(--navy-800)}
.note h3{margin:0 0 9px; font-family:var(--sans); font-size:15px; font-weight:700; color:var(--sage); letter-spacing:.01em; padding-top:0; border-top:0}
.rv-page .note h3{margin:0 0 9px; font-size:15px; padding-top:0; border-top:0}

/* Telas muito estreitas (iPhone SE de 1a geracao, 320px): reforco contra a rolagem
   lateral. A correcao principal e o min-width:0 no li; aqui a etiqueta tambem pode
   quebrar em duas linhas em vez de esticar o cartao. Nao afeta 360px para cima. */
@media (max-width:359px){
  .rv-page .ing-head .pill{white-space:normal}
}