/* ============================================================ Fleyn — Advertorial system (editorial / native-ad look) Mobile-first · WCAG AA (texto #16181d sobre #fff = 15.8:1) Cada página define --accent no ou . ============================================================ */ :root{ --ink:#16181d; /* texto principal */ --ink-soft:#3d4148; /* texto secundário (AA sobre branco) */ --line:#e6e7ea; --bg:#ffffff; --bg-soft:#f6f5f2; /* bege papel */ --accent:#0e7a48; /* default verde-viagem (override por página) */ --accent-ink:#0a5733; --warn:#b3261e; /* preço caro / alerta */ --radius:14px; --maxw:680px; --serif:"Lora",Georgia,"Times New Roman",serif; --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; } *{box-sizing:border-box} html{-webkit-text-size-adjust:100%} body{ margin:0;background:var(--bg);color:var(--ink); font-family:var(--sans);font-size:18px;line-height:1.72; -webkit-font-smoothing:antialiased;padding-bottom:84px; /* espaço p/ CTA sticky */ } img{max-width:100%;height:auto;display:block} a{color:var(--accent-ink)} /* ---- topo tipo portal ---- */ .ad-topbar{ background:var(--ink);color:#fff;text-align:center; font-family:var(--sans);font-size:12px;letter-spacing:.14em; text-transform:uppercase;padding:9px 12px;font-weight:600; } .ad-topbar b{color:#ffd24a} .ad-wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px} .ad-kicker{ color:var(--accent-ink);font-weight:800;font-size:12.5px; letter-spacing:.13em;text-transform:uppercase;margin:28px 0 10px } .ad-headline{ font-family:var(--serif);font-weight:700;color:var(--ink); font-size:clamp(28px,7.4vw,44px);line-height:1.12; letter-spacing:-.01em;margin:0 0 14px } .ad-dek{ font-family:var(--serif);font-size:clamp(18px,4.6vw,22px); line-height:1.4;color:var(--ink-soft);margin:0 0 20px;font-style:italic } .ad-byline{ display:flex;align-items:center;gap:10px;flex-wrap:wrap; font-size:13.5px;color:var(--ink-soft);border-top:1px solid var(--line); border-bottom:1px solid var(--line);padding:12px 0;margin:0 0 24px } .ad-byline b{color:var(--ink)} .ad-byline .dot{width:4px;height:4px;border-radius:50%;background:#c3c5ca} .ad-hero{width:100%;border-radius:var(--radius);overflow:hidden;margin:0 0 8px} .ad-hero img{width:100%} .ad-figcaption{font-size:13px;color:#7a7e86;margin:0 0 26px;line-height:1.45} .ad-body p{margin:0 0 20px} .ad-body p.lead{font-size:21px;line-height:1.6} .ad-body h2{ font-family:var(--serif);font-size:clamp(22px,5.6vw,30px); line-height:1.2;margin:34px 0 14px;color:var(--ink) } .ad-body strong{color:var(--ink);font-weight:700} .ad-body em{font-style:italic} /* ---- citação destacada ---- */ .ad-pull{ font-family:var(--serif);font-size:clamp(20px,5.4vw,27px); line-height:1.34;color:var(--accent-ink);font-weight:600; border-left:4px solid var(--accent);padding:4px 0 4px 20px; margin:28px 0;font-style:italic } /* ---- caixa mecanismo / destaque ---- */ .ad-callout{ background:var(--bg-soft);border:1px solid var(--line); border-radius:var(--radius);padding:22px 22px;margin:28px 0 } .ad-callout h3{margin:0 0 8px;font-size:17px;font-weight:800;letter-spacing:.01em} .ad-callout p{margin:0 0 10px;font-size:16.5px;color:var(--ink-soft)} .ad-callout p:last-child{margin:0} /* ---- comparativo tarifa ---- */ .ad-compare{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:26px 0} .ad-compare .col{border-radius:var(--radius);padding:18px 16px;text-align:center;border:1px solid var(--line)} .ad-compare .col .lab{font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:700;margin-bottom:6px} .ad-compare .col .val{font-family:var(--serif);font-size:30px;font-weight:700;line-height:1} .ad-compare .col.bad{background:#fdf1f0} .ad-compare .col.bad .lab{color:var(--warn)} .ad-compare .col.bad .val{color:var(--warn);text-decoration:line-through;text-decoration-thickness:2px} .ad-compare .col.good{background:#eafaf0} .ad-compare .col.good .lab{color:var(--accent-ink)} .ad-compare .col.good .val{color:var(--accent-ink)} /* ---- prova social ---- */ .ad-proof{ display:flex;gap:14px;align-items:flex-start;background:#fff; border:1px solid var(--line);border-radius:var(--radius); padding:18px;margin:24px 0;box-shadow:0 2px 10px rgba(0,0,0,.04) } .ad-proof img{width:64px;height:64px;border-radius:50%;object-fit:cover;flex:0 0 64px} .ad-proof .q{font-size:16.5px;line-height:1.5;margin:0 0 8px} .ad-proof .who{font-size:13.5px;color:var(--ink-soft);font-weight:600} .ad-proof .stars{color:#f5a623;font-size:14px;letter-spacing:2px;margin-bottom:6px} /* ---- CTA ---- */ .ad-cta-block{text-align:center;margin:34px 0} .ad-cta{ display:inline-block;width:100%;max-width:460px; background:var(--accent);color:#fff;font-family:var(--sans); font-weight:800;font-size:19px;line-height:1.25;text-decoration:none; padding:18px 24px;border-radius:999px;letter-spacing:.01em; box-shadow:0 8px 22px rgba(14,122,72,.32);transition:transform .12s } .ad-cta:active{transform:scale(.98)} .ad-cta small{display:block;font-weight:600;font-size:13px;opacity:.92;margin-top:3px} .ad-cta-sub{font-size:13px;color:#7a7e86;margin-top:10px} /* ---- CTA sticky mobile ---- */ .ad-sticky{ position:fixed;left:0;right:0;bottom:0;z-index:50; background:rgba(255,255,255,.96);backdrop-filter:blur(8px); border-top:1px solid var(--line);padding:10px 16px env(safe-area-inset-bottom); } .ad-sticky a{ display:block;text-align:center;background:var(--accent);color:#fff; font-weight:800;font-size:17px;text-decoration:none;padding:15px;border-radius:999px } /* ---- urgência / aviso ---- */ .ad-flag{ display:inline-block;background:#fff3cd;color:#8a6d00;font-weight:700; font-size:13px;padding:5px 12px;border-radius:999px;margin:0 0 16px } /* ---- rodapé ---- */ .ad-foot{ max-width:var(--maxw);margin:40px auto 0;padding:24px 20px 30px; border-top:1px solid var(--line);font-size:12.5px;color:#9a9ea6;line-height:1.6 } .ad-foot a{color:#9a9ea6} @media(min-width:560px){ body{padding-bottom:0} .ad-sticky{display:none} }