:root{
  --teal-dark:#0b3d3a;
  --teal:#10645c;
  --teal-pale:#e8f1ef;
  --gold:#c79a3c;
  --gold-pale:#f7efdc;
  --ink:#1b1f1e;
  --ink-soft:#525b58;
  --paper:#f7f8f6;
  --white:#ffffff;
  --line:#d9ddda;
  --serif:'Fraunces', Georgia, serif;
  --sans:'Inter', -apple-system, sans-serif;
  --mono:'IBM Plex Mono', monospace;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--sans); -webkit-font-smoothing:antialiased;
}
a{color:inherit; text-decoration:none;}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
.eyebrow{
  font-family:var(--mono); font-size:11px; letter-spacing:.14em;
  text-transform:uppercase; font-weight:500;
}

/* ---------- HEADER / NAV ---------- */
header{position:sticky; top:0; z-index:50; background:var(--white); border-bottom:1px solid var(--line);}
.topbar{display:flex; align-items:center; justify-content:space-between; padding:16px 28px; max-width:1180px; margin:0 auto;}
.brand{font-family:var(--serif); font-weight:700; font-size:22px; color:var(--teal-dark);}
.brand span{color:var(--gold);}
nav{display:flex; align-items:center; gap:26px;}
nav a{font-size:13px; font-weight:600; color:var(--ink-soft); padding:6px 0; border-bottom:2px solid transparent; transition:.15s;}
nav a:hover, nav a.active{color:var(--teal-dark); border-color:var(--gold);}
.nav-cta{background:var(--teal-dark); color:var(--white) !important; padding:9px 16px !important; border-radius:2px; font-size:12px !important;}
.nav-cta:hover{background:var(--teal); border-color:transparent !important;}

/* ---------- PAGE HEAD ---------- */
.page-head{padding:40px 28px 30px; background:var(--white); border-bottom:1px solid var(--line);}
.page-head h1{font-family:var(--serif); font-size:clamp(24px,3vw,32px); font-weight:700; margin:8px 0 8px; color:var(--teal-dark);}
.page-head p{font-size:14px; color:var(--ink-soft); max-width:640px; line-height:1.6; margin:0;}

section{padding:44px 0;}
.section-title{font-family:var(--serif); font-size:19px; font-weight:600; margin:0 0 20px; color:var(--teal-dark); border-bottom:2px solid var(--ink); padding-bottom:10px;}

/* ---------- PLACEHOLDER BOX (o coração do wireframe) ---------- */
.box{
  border:1.5px dashed #b9c2be;
  background:repeating-linear-gradient(135deg, #eef1ef, #eef1ef 10px, #e5e9e6 10px, #e5e9e6 20px);
  border-radius:4px;
  padding:18px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; gap:4px; color:#6d7672;
  min-height:90px;
}
.box .box-label{font-family:var(--mono); font-size:11px; font-weight:600; letter-spacing:.03em; color:var(--ink-soft);}
.box .box-sub{font-family:var(--mono); font-size:9.5px; color:#8a938f;}
.box.ad{background:repeating-linear-gradient(135deg,#f2ede0,#f2ede0 10px,#ecE4d0 10px,#ecE4d0 20px); border-color:#cbb271;}
.box.ad .box-label{color:#7a5c1e;}
.box.onco{border-color:#9fc4bd;}
.box.spine{border-color:#d9c184;}

.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
.grid-3{display:grid; grid-template-columns:1fr 1fr 1fr; gap:20px;}
.grid-main-side{display:grid; grid-template-columns:1fr 280px; gap:28px;}
.stack{display:flex; flex-direction:column; gap:16px;}
.pill-row{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:22px;}
.pill{font-family:var(--mono); font-size:10.5px; padding:7px 14px; border-radius:20px; border:1px solid var(--line); background:var(--white); color:var(--ink-soft);}
.pill.active{background:var(--teal-dark); color:var(--white); border-color:var(--teal-dark);}

/* ---------- FOOTER ---------- */
.cta-strip{background:var(--teal); color:var(--white); text-align:center; padding:44px 28px;}
.cta-strip h2{font-family:var(--serif); font-size:22px; margin:0 0 8px; font-weight:600;}
.cta-strip p{opacity:.85; font-size:13.5px; margin:0 0 18px;}
.cta-btn{display:inline-block; background:var(--gold); color:var(--teal-dark); font-weight:700; font-size:13px; padding:12px 24px; border-radius:2px;}

footer{background:var(--ink); color:#b7bdba; padding:36px 28px 22px;}
.footer-grid{display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:32px; padding-bottom:24px; border-bottom:1px solid #333;}
.footer-brand{font-family:var(--serif); color:var(--white); font-size:18px; font-weight:700; margin-bottom:8px;}
.footer-grid p{font-size:12px; line-height:1.6; max-width:280px; color:#8f9793;}
.footer-col h5{font-family:var(--mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:#8f9793; margin:0 0 12px;}
.footer-col a{display:block; font-size:12.5px; margin-bottom:8px; color:#d3d7d4;}
.footer-col a:hover{color:var(--gold);}
.footer-bottom{padding-top:16px; display:flex; justify-content:space-between; font-family:var(--mono); font-size:10px; color:#6f7773;}

/* ---------- HERO (Home) ---------- */
.hero{display:grid; grid-template-columns:1fr 60px 1fr; border-bottom:1px solid var(--line);}
.vertical{padding:44px 36px 38px; background:var(--white);}
.vertical .eyebrow{display:flex; align-items:center; gap:8px; margin-bottom:14px;}
.vertical.onco .eyebrow{color:var(--teal);}
.vertical.spine .eyebrow{color:var(--gold);}
.dot{width:6px; height:6px; border-radius:50%; display:inline-block;}
.onco .dot{background:var(--teal);}
.spine .dot{background:var(--gold);}
.headline{font-family:var(--serif); font-size:clamp(22px,2.6vw,28px); line-height:1.16; font-weight:600; letter-spacing:-.01em; margin:0 0 12px;}
.headline a:hover{text-decoration:underline; text-decoration-color:var(--gold);}
.deck{font-size:13.5px; line-height:1.6; color:var(--ink-soft); margin:0 0 16px;}
.byline{font-family:var(--mono); font-size:10.5px; color:#8a938f; display:flex; gap:10px; align-items:center; flex-wrap:wrap;}
.byline b{color:var(--ink-soft); font-weight:600;}
.divider{background:linear-gradient(180deg, var(--teal-dark) 0%, var(--gold) 100%); display:flex; align-items:center; justify-content:center;}
.divider svg{width:26px; height:auto; opacity:.92;}

/* ---------- AD SLOT ---------- */
.ad-slot{
  border:1.5px dashed #cbb271;
  background:repeating-linear-gradient(135deg,#f2ede0,#f2ede0 10px,#ecE4d0 10px,#ecE4d0 20px);
  color:#7a5c1e; display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; gap:3px; font-family:var(--mono); border-radius:4px;
}
.ad-slot .ad-label{font-size:10px; letter-spacing:.1em; text-transform:uppercase; font-weight:600;}
.ad-slot .ad-size{font-size:9.5px; opacity:.8;}

/* ---------- ARTICLE CARD (real content) ---------- */
.article-card{display:flex; gap:14px; padding:16px 0; border-bottom:1px solid var(--line);}
.article-card:last-child{border-bottom:none;}
.thumb{width:56px; height:56px; flex:none; border-radius:3px; display:flex; align-items:center; justify-content:center;}
.thumb.onco{background:var(--teal-pale);}
.thumb.spine{background:var(--gold-pale);}
.thumb svg{width:24px; height:24px;}
.article-card h4{font-family:var(--serif); font-size:14.5px; font-weight:600; line-height:1.32; margin:0 0 6px;}
.article-card h4 a:hover{text-decoration:underline; text-decoration-color:var(--gold);}
.article-meta{font-family:var(--mono); font-size:10px; color:#8a938f; display:flex; gap:8px; flex-wrap:wrap; align-items:center;}
.tag{font-family:var(--mono); font-size:9px; letter-spacing:.05em; padding:2px 6px; border-radius:2px; text-transform:uppercase; display:inline-block;}
.tag.onco{background:var(--teal-pale); color:var(--teal-dark);}
.tag.spine{background:var(--gold-pale); color:#7a5c1e;}
.result-count{font-family:var(--mono); font-size:11px; color:var(--ink-soft); margin-bottom:14px; display:block;}

/* ---------- COLUNISTAS ---------- */
.columnists-wrap{background:var(--teal-dark);}
.columnists-wrap .section-title{color:var(--white); border-bottom-color:rgba(255,255,255,.25);}
.columnist-card{background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.14); border-radius:4px; padding:24px; display:flex; gap:16px;}
.avatar{width:52px; height:52px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-weight:600; font-size:17px; color:var(--white);}
.columnist-card:nth-child(odd) .avatar{background:var(--teal);}
.columnist-card:nth-child(even) .avatar{background:var(--gold);}
.columnist-info h4{font-family:var(--serif); color:var(--white); font-size:16px; margin:0 0 3px;}
.columnist-role{font-family:var(--mono); font-size:10px; color:var(--gold); letter-spacing:.04em; margin-bottom:8px; display:block;}
.columnist-quote{color:rgba(255,255,255,.72); font-size:13px; line-height:1.55; margin:0 0 10px;}
.columnist-bio{color:rgba(255,255,255,.55); font-size:12px; line-height:1.55; margin:0;}
.column-archive-item{padding:14px 0; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; gap:16px; align-items:baseline;}
.column-archive-item:last-child{border-bottom:none;}
.column-archive-item h5{font-family:var(--serif); font-size:14.5px; margin:0; font-weight:600;}
.column-archive-item span{font-family:var(--mono); font-size:10px; color:#8a938f; white-space:nowrap;}

/* ---------- PATROCINADO ---------- */
.sponsored-card{background:var(--white); border:1.5px dashed #cbb271; border-radius:4px; padding:22px;}
.sponsored-card .tag{background:var(--gold); color:var(--white); margin-bottom:12px;}
.sponsored-card h4{font-family:var(--serif); font-size:15px; margin:0 0 8px;}
.sponsored-card p{font-size:12.5px; color:var(--ink-soft); line-height:1.6; margin:0 0 10px;}
.sponsored-by{font-family:var(--mono); font-size:10px; color:#8a7746;}
.sponsored-note{font-family:var(--mono); font-size:11px; color:#7a5c1e; background:var(--white); border:1px solid #e3d3a8; padding:9px 14px; border-radius:2px; display:inline-block;}

/* ---------- TABELA PREÇOS ---------- */
.price-table{width:100%; border-collapse:collapse; font-size:13px;}
.price-table th{font-family:var(--mono); font-size:10.5px; text-transform:uppercase; letter-spacing:.06em; background:var(--teal-dark); color:var(--white); text-align:left; padding:11px 14px;}
.price-table td{padding:12px 14px; border-bottom:1px solid var(--line);}
.price-table tr:nth-child(even) td{background:var(--paper);}

/* ---------- FORMULÁRIO ---------- */
.form-card{background:var(--white); border:1px solid var(--line); border-radius:4px; padding:26px;}
.field{margin-bottom:16px;}
.field label{display:block; font-family:var(--mono); font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-soft); margin-bottom:6px;}
.field input, .field textarea{
  width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:3px;
  font-family:var(--sans); font-size:13.5px; color:var(--ink); background:var(--paper);
}
.field input:focus, .field textarea:focus{outline:2px solid var(--teal); outline-offset:1px; background:var(--white);}
.field.field-error input, .field.field-error textarea, input.field-error, textarea.field-error{border-color:#c0392b;}
.submit-btn{
  background:var(--teal-dark); color:var(--white); border:none; font-weight:700; font-size:13px;
  padding:12px 24px; border-radius:2px; cursor:pointer; font-family:var(--sans);
}
.submit-btn:hover{background:var(--teal);}
.form-feedback{margin-top:14px; font-size:12.5px; font-family:var(--mono); display:none;}
.form-feedback.success{display:block; color:var(--teal-dark);}
.form-feedback.error{display:block; color:#c0392b;}
.contact-info-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px;}
.contact-info-list li{font-size:13.5px; color:var(--ink-soft);}
.contact-info-list b{display:block; font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.05em; color:var(--teal-dark); margin-bottom:3px;}

/* ---------- MOBILE NAV TOGGLE ---------- */
.mobile-toggle{
  display:none; flex-direction:column; gap:4px; background:none; border:none; cursor:pointer; padding:6px;
}
.mobile-toggle span{width:22px; height:2px; background:var(--teal-dark); border-radius:2px; transition:.2s;}
.mobile-toggle.is-active span:nth-child(1){transform:translateY(6px) rotate(45deg);}
.mobile-toggle.is-active span:nth-child(2){opacity:0;}
.mobile-toggle.is-active span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}

@media (max-width:900px){
  .mobile-toggle{display:flex;}
  nav{
    display:none; position:absolute; top:100%; left:0; right:0; background:var(--white);
    flex-direction:column; align-items:flex-start; gap:0; border-bottom:1px solid var(--line);
    padding:6px 28px 14px;
  }
  nav.nav-open{display:flex;}
  nav a{padding:11px 0; width:100%; border-bottom:1px solid var(--line) !important;}
  .nav-cta{width:100%; text-align:center; margin-top:8px;}
  header{position:sticky;}
  .topbar{position:relative;}

  .hero{grid-template-columns:1fr;}
  .divider{padding:10px;}
  .divider svg{transform:rotate(90deg); width:22px;}
  .grid-2, .grid-3{grid-template-columns:1fr;}
  .grid-main-side{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr; row-gap:22px;}
}
