/* style: thebbco */

@font-face{
  font-family:'Libre Franklin';
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url(librefranklin-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face{
  font-family:'Libre Franklin';
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url(librefranklin-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;
}

:root{
  --papel:#fffbf7;
  --branco:#ffffff;
  --areia:#f6efe5;
  --faixa:#eaf2f5;
  --tinta:#1c1e21;
  --cinza:#3a3a3a;
  --claro:#6f6f6f;
  --mar:#0081a7;
  --mar-fundo:#00647f;
  --sol:#f3bb00;
  --linha:#dfe4e6;
  --linha-areia:#e2d7c7;
}

*{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

body{
  margin:0;
  background:var(--papel);
  color:var(--tinta);
  font-family:'Libre Franklin',Arial,Helvetica,sans-serif;
  font-size:16.5px;
  line-height:1.62;
}

img{max-width:100%;display:block}

a{color:var(--mar)}

h1,h2,h3{line-height:1.13;margin:0;font-weight:800;letter-spacing:-.021em}

.largo{max-width:1250px;margin:0 auto;padding:0 22px}

.estreito{max-width:730px;margin:0 auto;padding:0 22px}

.folgado{padding:34px 0}
.justo{padding:84px 0}

.fundo{background:var(--faixa)}
.duna{background:var(--areia)}

/* cabecalho */

.faixa-paga{background:var(--sol);color:var(--tinta)}
.faixa-paga .largo{font-size:13.5px;line-height:1.45;padding-top:10px;padding-bottom:10px}
.faixa-paga b{text-transform:uppercase;letter-spacing:.06em;margin-right:4px}

.cabecalho{background:var(--branco);border-bottom:1px solid var(--linha)}
.cabecalho .largo{display:flex;align-items:center;gap:18px;padding-top:16px;padding-bottom:16px}

.marca{
  font-size:19px;font-weight:800;color:var(--tinta);text-decoration:none;
  white-space:nowrap;flex:none;letter-spacing:-.03em;
}
.marca span{color:var(--mar)}

.leme{
  display:flex;gap:22px;overflow-x:auto;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.leme::-webkit-scrollbar{display:none}
.leme a{
  color:var(--cinza);text-decoration:none;font-size:14.5px;font-weight:600;
  white-space:nowrap;padding:6px 0;border-bottom:2px solid transparent;
}
.leme a:hover{color:var(--mar)}
.leme a.aqui{color:var(--tinta);border-bottom-color:var(--sol)}

/* capa */

.capa h1{font-size:33px;max-width:20ch}
.capa .entrada{font-size:17.5px;color:var(--cinza);margin:20px 0 0;max-width:54ch}
.capa .assinatura{
  font-size:13px;color:var(--claro);margin:24px 0 0;
  padding-top:16px;border-top:3px solid var(--sol);display:inline-block;
}

.destaque{
  margin-top:38px;background:var(--branco);
  border:1px solid var(--linha);border-radius:6px;padding:26px 24px;
}
.destaque h2{font-size:21px}
.destaque p{margin:12px 0 0;font-size:16px;color:var(--cinza)}
.destaque .ligacao{
  display:inline-block;margin-top:18px;font-weight:700;font-size:15px;
  color:var(--mar);text-decoration:none;border-bottom:2px solid var(--sol);padding-bottom:2px;
}

/* ritmo — escala de perda de peso */

.ritmo h2{font-size:27px;max-width:18ch}
.ritmo .explica{font-size:16.5px;color:var(--cinza);margin:16px 0 0;max-width:62ch}

.escala{list-style:none;margin:30px 0 0;padding:0;display:grid;gap:0}
.escala li{border-top:1px solid var(--linha-areia);padding:18px 0}
.escala b{
  display:block;font-size:30px;font-weight:800;letter-spacing:-.03em;
  color:var(--mar);line-height:1;
}
.escala span{display:block;font-size:15px;color:var(--cinza);margin-top:9px}

.ritmo .ressalva{
  font-size:15px;color:var(--cinza);margin:26px 0 0;max-width:66ch;
  border-left:3px solid var(--mar);padding-left:18px;
}

/* rubricas */

.rubricas{display:grid;gap:0;margin:0;padding:0;list-style:none}
.rubricas li{border-top:1px solid var(--linha);padding:16px 0}
.rubricas b{display:block;font-size:16.5px}
.rubricas span{font-size:14.5px;color:var(--claro)}

/* grelha de artigos */

.titulo-lista{display:flex;align-items:baseline;justify-content:space-between;gap:18px;flex-wrap:wrap}
.titulo-lista h2{font-size:26px}
.titulo-lista a{font-size:14px;font-weight:600;text-decoration:none}

.titulo-seccao{font-size:24px}

.grelha{display:grid;gap:26px;margin-top:26px}
.grelha.duplas{gap:30px}

.peca{
  background:var(--branco);border:1px solid var(--linha);border-radius:6px;
  padding:24px 24px 26px;
}
.peca .etiqueta{font-size:12px;font-weight:700;color:var(--mar)}
.peca .etiqueta i{font-style:normal;color:var(--claro);font-weight:400}
.peca h3{font-size:20px;margin:11px 0 0}
.peca h3 a{color:var(--tinta);text-decoration:none}
.peca h3 a:hover{color:var(--mar)}
.peca p{margin:11px 0 0;font-size:15px;color:var(--cinza);line-height:1.58}

.peca.paga{border-color:var(--sol);border-width:2px;margin-top:26px}
.peca.paga .etiqueta{color:#8a6a00}
.peca.paga .nota{font-size:13.5px;color:var(--claro);margin:10px 0 0}

/* alerta full bleed */

.alerta{background:var(--mar);color:var(--branco)}
.alerta h2{font-size:27px;max-width:20ch}
.alerta .intro{font-size:16.5px;margin:16px 0 0;max-width:58ch;color:#d5ecf3}
.alerta ul{margin:28px 0 0;padding:0;list-style:none;display:grid;gap:0}
.alerta li{border-top:1px solid #3a9dbb;padding:13px 0;font-size:15.5px}
.alerta .cauda{font-size:14px;margin:24px 0 0;max-width:60ch;color:#d5ecf3}
.alerta a{color:var(--sol)}

/* glossario */

.glossario{display:grid;gap:0;margin:26px 0 0}
.glossario div{border-top:1px solid var(--linha);padding:20px 0}
.glossario dt{font-weight:700;font-size:17px}
.glossario dd{margin:7px 0 0;font-size:15px;color:var(--cinza);max-width:66ch}

/* arquivo */

.arquivo{margin:24px 0 0;padding:0;list-style:none}
.arquivo li{border-top:1px solid var(--linha);padding:16px 0;display:grid;gap:4px}
.arquivo a{color:var(--tinta);text-decoration:none;font-size:17px;font-weight:700}
.arquivo a:hover{color:var(--mar)}
.arquivo .data{font-size:13px;color:var(--claro)}
.arquivo .data b{color:#8a6a00;font-weight:700}

/* perguntas */

.pergunta{border-top:1px solid var(--linha);padding:22px 0}
.pergunta h3{font-size:18px;max-width:52ch}
.pergunta p{margin:9px 0 0;font-size:15.5px;color:var(--cinza);max-width:66ch}

/* equipa */

.equipa{display:grid;gap:24px;margin-top:26px}
.pessoa b{display:block;font-size:17px}
.pessoa .papel{font-size:13.5px;color:var(--claro);margin:2px 0 8px}
.pessoa p{margin:0;font-size:15px;color:var(--cinza)}

/* texto de artigo */

.migalhas{font-size:13px;color:var(--claro);padding:18px 0 0}
.migalhas a{color:var(--claro)}

.texto{padding:26px 0 60px}
.texto h1{font-size:31px;margin:12px 0 0}
.texto .autoria{
  font-size:13px;color:var(--claro);margin:20px 0 32px;
  padding-bottom:20px;border-bottom:1px solid var(--linha);
}
.texto>p{font-size:17px;margin:0 0 21px;line-height:1.68}
.texto h2{font-size:23px;margin:42px 0 15px;max-width:32ch}
.texto ul,.texto ol{margin:0 0 26px;padding-left:22px}
.texto li{margin-bottom:11px;font-size:16.5px;line-height:1.62}
.texto li::marker{color:var(--mar)}
.texto .ficha{font-size:14px;color:var(--mar-fundo);font-weight:700}
.texto .ficha b{
  background:var(--sol);color:var(--tinta);
  padding:3px 9px;border-radius:6px;margin-right:8px;
}

.caixa{
  background:var(--areia);border-left:4px solid var(--mar);
  padding:22px 24px;margin:32px 0;border-radius:0 6px 6px 0;
}
.caixa p{font-size:16px;margin:0}
.caixa b{display:block;margin-bottom:7px}

.fontes{border-top:1px solid var(--linha);margin-top:46px;padding-top:26px}
.fontes h2{font-size:18px;margin:0 0 12px}
.fontes ul{margin:0;padding-left:20px}
.fontes li{font-size:14.5px;color:var(--cinza);margin-bottom:8px}

.continua{border-top:1px solid var(--linha);margin-top:40px;padding-top:26px}
.continua h2{font-size:19px;margin:0 0 4px}

/* produto e formulario */

.frasco{
  margin:36px 0;text-align:center;
  background:var(--areia);border-radius:6px;padding:30px 20px;
}
.frasco img{width:240px;height:auto;margin:0 auto}
.frasco figcaption{font-size:13px;color:var(--claro);margin-top:14px}

.botao{
  display:inline-block;background:var(--mar);color:var(--branco);
  text-decoration:none;font-weight:700;font-size:16.5px;
  padding:18px 40px;border:0;border-radius:20px;
}
.botao:hover{background:var(--mar-fundo)}

.texto .preco{font-size:34px;font-weight:800;letter-spacing:-.02em;line-height:1;margin:26px 0 0}

.accao{max-width:420px;margin:26px 0 0}
.accao .botao{display:block;text-align:center;padding-left:18px;padding-right:18px}

.texto .entrega{font-size:13px;color:var(--claro);margin:14px 0 0;max-width:420px}

.texto .revelacao{
  font-size:13.5px;color:var(--tinta);margin:12px 0 0;max-width:420px;
  border-left:3px solid var(--mar);padding-left:12px;
}

/* paginas legais */

.legal-pagina{padding:26px 0 60px}
.legal-pagina h1{font-size:29px}
.legal-pagina .actualizado{font-size:13px;color:var(--claro);margin:14px 0 32px}
.legal-pagina h2{font-size:20px;margin:36px 0 12px}
.legal-pagina p{font-size:16.5px;margin:0 0 18px}
.legal-pagina ul{margin:0 0 22px;padding-left:22px}
.legal-pagina li{margin-bottom:9px;font-size:16px}

/* rodape */

.rodape{background:var(--branco);border-top:1px solid var(--linha);padding:46px 0 34px}
.rodape .colunas{display:grid;gap:30px}
.rodape .marca{font-size:19px;display:block;margin-bottom:12px}
.rodape .sumario{font-size:14px;color:var(--cinza);margin:0 0 10px;max-width:44ch}
.rodape b{display:block;font-size:14px;margin-bottom:12px}
.rodape ul{margin:0;padding:0;list-style:none;display:grid;gap:9px}
.rodape ul a{font-size:14px;color:var(--cinza);text-decoration:none}
.rodape ul a:hover{color:var(--mar)}

.repor-consentimento{
  font:inherit;font-size:14px;color:var(--cinza);
  background:0;border:0;padding:0;text-align:left;cursor:pointer;
}
.repor-consentimento:hover{color:var(--mar)}

.remate{border-top:1px solid var(--linha);margin-top:34px;padding-top:24px}
.aviso{font-size:12.5px;color:var(--claro);margin:0 0 12px;line-height:1.6}
.aviso a{color:var(--claro)}

/* consentimento */

.consentimento{
  position:fixed;left:0;right:0;bottom:0;z-index:50;
  background:var(--branco);border-top:1px solid var(--linha);
  box-shadow:0 -12px 34px rgba(0,0,0,.12);
}
.consentimento-corpo{max-width:760px;margin:0 auto;padding:20px 22px 22px}
.consentimento-titulo{font-size:16px;font-weight:800;margin:0 0 8px}
.consentimento-corpo p{font-size:13.5px;line-height:1.55;color:var(--tinta);margin:0}
.consentimento-botoes{display:flex;gap:12px;margin:16px 0 0}
.consentimento-botoes button{
  flex:1 1 0;font:inherit;font-size:15px;font-weight:700;
  background:var(--branco);color:var(--tinta);
  border:2px solid var(--tinta);border-radius:14px;padding:13px 18px;cursor:pointer;
}
.consentimento-botoes button:hover{background:var(--areia)}
.consentimento-botoes button[data-escolha="aceite"]{
  background:var(--mar);color:var(--branco);border-color:var(--mar);
}
.consentimento-botoes button[data-escolha="aceite"]:hover{
  background:var(--mar-fundo);border-color:var(--mar-fundo);
}
.consentimento-ligacao{margin:14px 0 0}
.consentimento-ligacao a{font-size:13px;color:var(--claro)}

@media(min-width:820px){
  body{font-size:17px}
  .cabecalho .largo{gap:40px}
  .marca{font-size:24px}
  .leme{gap:26px}

  .capa h1{font-size:52px;max-width:19ch;line-height:1.05}
  .capa .entrada{font-size:19.5px;margin-top:26px}
  .destaque{display:grid;grid-template-columns:1fr auto;align-items:center;gap:34px;padding:30px 32px}
  .destaque .ligacao{margin-top:0}

  .ritmo h2{font-size:36px}
  .ritmo .explica{font-size:17.5px}
  .escala{grid-template-columns:repeat(4,1fr);column-gap:36px;margin-top:38px}
  .escala li{padding:20px 0 4px}
  .escala b{font-size:40px}

  .rubricas{grid-template-columns:repeat(3,1fr);column-gap:34px}

  .grelha{grid-template-columns:repeat(3,1fr)}
  .grelha.duplas{grid-template-columns:repeat(2,1fr)}

  .titulo-lista h2{font-size:30px}

  .alerta h2{font-size:36px}
  .alerta ul{grid-template-columns:repeat(2,1fr);column-gap:44px}

  .arquivo li{grid-template-columns:1fr auto;align-items:baseline;gap:20px}
  .arquivo .data{text-align:right}

  .peca.paga{
    display:grid;grid-template-columns:1.7fr 1fr;column-gap:48px;
    padding:32px 34px;
  }
  .peca.paga .nota{grid-column:2;grid-row:1/span 3;margin:0;border-left:1px solid var(--linha);padding-left:28px}
  .peca.paga h3{font-size:25px;max-width:20ch}
  .peca.paga p{max-width:58ch}

  .glossario{grid-template-columns:repeat(2,1fr);column-gap:56px}
  .glossario dd{max-width:none}

  .perguntas{display:grid;grid-template-columns:repeat(2,1fr);column-gap:56px}
  .pergunta h3{max-width:none}
  .pergunta p{max-width:none}

  .equipa{grid-template-columns:repeat(2,1fr);gap:30px}

  .texto h1{font-size:44px}
  .texto>p{font-size:18.5px}
  .texto h2{font-size:28px}

  .legal-pagina h1{font-size:36px}

  .rodape .colunas{grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px}

  .consentimento-corpo{padding:24px 26px 26px}
  .consentimento-botoes{max-width:420px}
}
