/* ========================================================================= JORNAL DA FRANCA â€” PROTÃ“TIPO DE LAYOUT Toda a marca vive aqui em cima. Troque os HEX de --primary/--secondary pelos da marca atual e o site inteiro acompanha. No tema final, estes viram tokens do @theme do Tailwind 4. ========================================================================= */ :root{ /* ---- ESQUEMA SEMÃ‚NTICO (troque aqui) ---- */ --primary:#C8102E; /* vermelho da marca */ --primary-dark:#9B0C23; --primary-soft:#FCE9EC; --secondary:#1F2733; /* grafite â€” contraste/UI */ --secondary-soft:#EDEFF2; --info:#1D6FB8; --info-soft:#E7F1FA; --success:#1F8A4C; --success-soft:#E6F4EC; --warning:#C77800; --warning-soft:#FBF0DC; --danger:#D32F2F; --danger-soft:#FBE9E9; /* ---- ACENTOS DE EDITORIA (o "etc") ---- */ --agro:#5C7A1E; --agro-soft:#EEF3DF; /* boi + café Franca */ --saude:#0E8C84; --saude-soft:#E1F4F2; --cultura:#6A4AC0; --cultura-soft:#EDE9FB; /* ---- NEUTROS ---- */ --bg:#F3F4F6; --surface:#FFFFFF; --surface-2:#FAFAFB; --line:#E4E6EB; --line-strong:#D3D7DE; --text:#181B20; --muted:#5B626D; --soft:#8B919C; /* ---- TIPOGRAFIA ---- */ --display:'Archivo',system-ui,sans-serif; /* manchetes */ --body:'Inter',system-ui,sans-serif; /* texto */ --data:'Roboto Mono',ui-monospace,monospace;/* nÃºmeros / cotaÃ§Ãµes */ --maxw:1280px; --touch:44px; --jdf-chrome-bottom:0px; --radius:10px; --radius-sm:6px; --nav-offset:48px; } *{box-sizing:border-box;margin:0;padding:0} html{scroll-behavior:smooth} body{font-family:var(--body);background:var(--bg);color:var(--text);line-height:1.5;-webkit-font-smoothing:antialiased} a{color:inherit;text-decoration:none} img{max-width:100%;display:block} .wrap{max-width:var(--maxw);margin:0 auto;padding:0 16px} h1,h2,h3,h4{font-family:var(--display);font-weight:700;line-height:1.15;letter-spacing:-.01em} /* ---------- DEMARCAÃ‡Ã•ES (foto + banner) ---------- */ .ph{position:relative;background:repeating-linear-gradient(45deg,#e9ebef,#e9ebef 10px,#eef0f3 10px,#eef0f3 20px); display:flex;align-items:center;justify-content:center;color:var(--soft);font:600 11px/1 var(--data); border-radius:var(--radius-sm);overflow:hidden} .ph::after{content:attr(data-r);position:absolute;bottom:6px;right:8px;background:#ffffffcc;padding:2px 6px;border-radius:4px;color:var(--muted)} .ph svg{width:26px;height:26px;opacity:.5} .r16{aspect-ratio:16/9}.r43{aspect-ratio:4/3}.r11{aspect-ratio:1/1}.r219{aspect-ratio:21/9} .ad{border:1.5px dashed var(--warning);background:repeating-linear-gradient(135deg,#fff,#fff 14px,#fdf6e8 14px,#fdf6e8 28px); border-radius:var(--radius-sm);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center; color:#7a5200;padding:14px;gap:3px} .ad b{font:700 13px var(--display)} .ad small{font:500 11px/1.3 var(--data);color:#9a7626;letter-spacing:.02em} .ad .tier{margin-top:4px;font:600 10px var(--body);text-transform:uppercase;letter-spacing:.08em;background:#fff;border:1px solid #eccf8f;color:#946012;padding:2px 8px;border-radius:20px} /* ---------- TAGS DE EDITORIA ---------- */ /* :not(body): WP puts `tag` on the tag-archive ; this chip rule would flatten the page. */ .tag:not(body){display:inline-flex!important;align-items:center;width:auto!important;max-width:max-content;align-self:flex-start;font:700 10.5px/1 var(--display);text-transform:uppercase;letter-spacing:.06em; padding:4px 8px;border-radius:4px;color:#fff;flex:0 0 auto} .t-cidade{background:var(--info)} .t-seg{background:var(--danger)} .t-esp{background:var(--success)} .t-eco{background:var(--warning)} .t-agro{background:var(--agro)} .t-saude{background:var(--saude)} .t-cult{background:var(--cultura)} .t-pol{background:var(--secondary)} .kicker{font:700 11px var(--display);text-transform:uppercase;letter-spacing:.08em;color:var(--primary)} /* ============================ HEADER ============================ */ /* 1) Barra utilitÃ¡ria */ .topbar{background:var(--secondary);color:#cfd4dc;font-size:12.5px} .topbar .wrap{display:flex;align-items:center;justify-content:space-between;min-height:38px;height:auto;gap:16px;padding:6px 16px} .topbar .tl{display:flex;align-items:center;gap:14px;flex-wrap:wrap} .topbar-date--short{display:none} .topbar-date__day,.topbar-date__mon{display:inline} .topbar-info__rule{display:none;width:1px;height:18px;background:rgba(255,255,255,.2);margin:0 4px} .topbar-clima{display:inline-flex;align-items:center;gap:6px} .topbar-clima__meta{display:inline-flex;align-items:baseline;gap:6px} .topbar-clima__place{color:#cfd4dc} .topbar-clima__temp{color:#fff;font-weight:600} .topbar .tl b{color:#fff;font-weight:600} .topbar .clima{display:flex;align-items:center;gap:5px} .topbar .tr{display:flex;align-items:center;gap:14px} .topbar a:hover{color:#fff} .zap{display:inline-flex;align-items:center;gap:6px;background:var(--success);color:#fff;font-weight:600; padding:5px 11px;border-radius:20px;font-size:12px} .assine{color:var(--warning);font-weight:700} .dot{width:4px;height:4px;border-radius:50%;background:#5b6473;display:inline-block} /* 2) Faixa de indicadores — ticker full-bleed (ponte topbar → masthead) */ .indic{ --indic-fg:#e8eaef; --indic-muted:#9aa3b2; --indic-up:#3ecf8e; --indic-down:#ff6b6b; --indic-flat:#8b919c; width:100%; background: linear-gradient(180deg, #1a222d 0%, #243040 48%, #2e3948 100%); border-bottom:1px solid rgba(255,255,255,.06); box-shadow:inset 0 1px 0 rgba(255,255,255,.04); overflow:hidden; } .indic__viewport{ overflow:hidden; width:100%; mask-image:linear-gradient(90deg, transparent 0%, #000 4%, #000 96%, transparent 100%); -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 4%, #000 96%, transparent 100%); } .indic__track{ display:flex; width:max-content; align-items:center; animation:jdf-indic-marquee 42s linear infinite; will-change:transform; } .indic:hover .indic__track, .indic:focus-within .indic__track{animation-play-state:paused} .indic__group{display:flex;align-items:center;flex-shrink:0} .ind{ display:inline-flex;align-items:center;gap:8px; padding:10px 14px;white-space:nowrap;font-family:var(--data); border:0;background:transparent } .ind .lbl{font:600 10px/1.2 var(--body);color:var(--indic-muted);text-transform:uppercase;letter-spacing:.05em} .ind .val{font-weight:700;font-size:13px;color:var(--indic-fg);letter-spacing:-.01em} .ind .ind-date{font:500 10px var(--body);color:var(--indic-muted)} .ind.agro{ margin:6px 4px;padding:6px 12px; background:rgba(92,122,30,.28); border:1px solid rgba(238,243,223,.14); border-radius:999px } .ind.agro .lbl{color:#c5d69a} .ind-sep{color:rgba(255,255,255,.18);padding:0 2px;font-size:14px;user-select:none} .ind-var{display:inline-flex;align-items:center;gap:3px;font-size:12px;font-weight:700;line-height:1} .ind-var__icon{font-size:10px;line-height:1} .ind-var.up,.ind .up{color:var(--indic-up)} .ind-var.down,.ind .down{color:var(--indic-down)} .ind-var.flat,.ind .flat{color:var(--indic-flat);font-weight:600} @keyframes jdf-indic-marquee{ from{transform:translate3d(0,0,0)} to{transform:translate3d(-50%,0,0)} } @media(min-width:768px){ .ind{padding:11px 18px;gap:10px} .ind .lbl{font-size:11px} .ind .val{font-size:13.5px} .indic__track{animation-duration:55s} } @media(prefers-reduced-motion:reduce){ .indic__viewport{mask-image:none;-webkit-mask-image:none;overflow-x:auto;scrollbar-width:none} .indic__viewport::-webkit-scrollbar{display:none} .indic__track{animation:none;width:100%;justify-content:flex-start} .indic__group[aria-hidden="true"]{display:none} } /* 3) Masthead: logo + banner Ad Manager 970x90 alinhado */ .masthead{background:var(--surface);border-bottom:1px solid var(--line)} .masthead .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:10px 16px;min-height:110px} .logo{flex:0 0 auto;max-width:240px;display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-decoration:none;margin-right:auto} .logo img,.jdf-logo-img{max-height:58px;width:auto;height:auto;display:block} .logo-edicao{display:block;font:500 10px/1.3 var(--data);color:var(--muted);letter-spacing:.02em;white-space:nowrap} .logo-edicao__sep{margin:0 5px;color:var(--line-strong)} .fbrand .logo-edicao{color:#aeb6c2} .fbrand .jdf-logo-img{max-height:48px} .fbrand .jdf-logo-img--fallback-dark{filter:brightness(0) invert(1) opacity(.95)} .logobox{width:180px;height:56px;border:1.5px dashed var(--line-strong);border-radius:var(--radius-sm); display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--primary);background:var(--surface-2)} .logobox b{font:800 18px var(--display);letter-spacing:-.02em} .logobox span{font:500 10px var(--data);color:var(--soft)} .head-ad{ flex:0 0 auto;min-width:0;max-width:970px;width:auto;margin-left:auto; min-height:0;height:auto;display:flex;align-items:center;justify-content:flex-end; overflow:visible } .head-ad .ad-slot{ width:fit-content;max-width:100%;min-height:0;height:auto!important;margin-left:auto; display:flex;align-items:center;justify-content:flex-end;overflow:visible!important } .head-ad .ad-slot:has(iframe), .head-ad .ad-slot--placeholder{min-height:90px} .head-ad .ad-slot iframe, .head-ad .ad-slot > div{max-width:100%!important;margin-top:0!important;margin-bottom:0!important} .head-ad .ad-slot [id^="jdf-gpt-"], .head-ad .ad-slot [id^="div-gpt-ad-"]{min-width:0!important;max-width:100%} .screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0} .skip-link{position:absolute;left:-9999px;top:0;z-index:100000;padding:8px 16px;background:var(--primary);color:#fff;font-weight:700;text-decoration:none} .skip-link:focus{left:8px;top:8px;clip:auto;width:auto;height:auto;overflow:visible} /* 4) Nav principal (sticky) + busca direita */ .nav{background:var(--primary);position:sticky;top:0;z-index:50;box-shadow:0 2px 8px rgba(0,0,0,.10)} .nav .wrap{display:flex;align-items:center;gap:2px;height:48px;position:relative} .nav > .wrap > a, .nav .mega-menu-link{color:#fff;font:600 14px var(--display);letter-spacing:.01em;padding:0 13px;height:48px;display:flex;align-items:center;gap:5px; position:relative;background:transparent;border:0;cursor:pointer;text-decoration:none} .nav > .wrap > a:hover, .nav .mega-menu-link:hover{background:var(--primary-dark)} .nav a.mais{margin-left:auto} .nav > .wrap > a.burger{display:none} .jdf-nav-search{ margin-left:auto;display:flex;align-items:center;gap:0;height:32px; background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28); border-radius:999px;padding:0 4px 0 10px;min-width:180px;max-width:240px;transition:background .15s,border-color .15s } .jdf-nav-search:focus-within{background:#fff;border-color:#fff} .jdf-nav-search__input{ flex:1;min-width:0;border:0;background:transparent;outline:none; font:500 13px var(--body);color:#fff;padding:0 6px;height:30px } .jdf-nav-search:focus-within .jdf-nav-search__input{color:var(--text)} .jdf-nav-search__input::placeholder{color:rgba(255,255,255,.75)} .jdf-nav-search:focus-within .jdf-nav-search__input::placeholder{color:var(--soft)} .jdf-nav-search__submit{ flex:0 0 auto;width:28px;height:28px;border:0;border-radius:50%; background:transparent;color:#fff;display:grid;place-items:center;cursor:pointer;padding:0 } .jdf-nav-search:focus-within .jdf-nav-search__submit{color:var(--primary)} .jdf-nav-search__submit .i{width:15px;height:15px} .jdf-search-backdrop { display: block; position: fixed; inset: 0; z-index: 110; background: rgba(15, 18, 24, .45); border: 0; padding: 0; cursor: pointer; } .jdf-search-backdrop[hidden] { display: none !important; } body.jdf-search-open { overflow: hidden; } .jdf-dock-search { position: fixed; left: 12px; right: 12px; bottom: calc(var(--jdf-chrome-bottom, 56px) + 10px); z-index: 120; } .jdf-dock-search[hidden] { display: none !important; } .jdf-dock-search__form { display: flex; align-items: center; gap: 6px; height: 52px; margin: 0; padding: 0 6px 0 14px; border-radius: 12px; background: #fff; border: 1px solid var(--line); box-shadow: 0 10px 28px rgba(0,0,0,.22); } .jdf-dock-search__input { flex: 1; min-width: 0; height: 48px; border: 0; outline: none; background: transparent; color: var(--text); font: 500 16px var(--body); } .jdf-dock-search__input::placeholder { color: var(--soft); } .jdf-dock-search__submit, .jdf-dock-search__close { flex: 0 0 auto; width: 44px; height: 44px; border: 0; border-radius: 10px; display: grid; place-items: center; cursor: pointer; padding: 0; } .jdf-dock-search__submit { color: var(--primary); background: var(--primary-soft, #f4e8eb); } .jdf-dock-search__close { color: var(--muted); background: transparent; } .jdf-dock-search__submit .i, .jdf-dock-search__close .i { width: 18px; height: 18px; } .caret{font-size:10px;opacity:.85} /* Topbar sociais */ .topbar-socials{display:inline-flex;align-items:center;gap:6px;margin-left:10px} .topbar-social{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;color:#cfd5de} .topbar-social:hover{color:#fff;background:rgba(255,255,255,.12)} .topbar-social .i{width:14px;height:14px} /* 5) Plantão / últimas — marquee como cotações */ .plantao{background:var(--secondary);color:#dfe3e9} .plantao .wrap{display:flex;align-items:center;gap:12px;height:40px;overflow:hidden} .plantao .now{background:var(--danger);color:#fff;font:700 11px var(--display);text-transform:uppercase;letter-spacing:.05em; padding:5px 10px;border-radius:2px;display:flex;align-items:center;gap:6px;flex:0 0 auto;white-space:nowrap} .blink{width:7px;height:7px;border-radius:50%;background:#fff;animation:bk 1.1s infinite} @keyframes bk{50%{opacity:.25}} .plantao__viewport{ overflow:hidden;flex:1;min-width:0; mask-image:linear-gradient(90deg,transparent 0%,#000 3%,#000 97%,transparent 100%); -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 3%,#000 97%,transparent 100%); } .plantao__track{ display:flex;width:max-content;align-items:center; animation:jdf-plantao-marquee 38s linear infinite;will-change:transform; } .plantao:hover .plantao__track, .plantao:focus-within .plantao__track{animation-play-state:paused} .plantao__group{display:flex;align-items:center;flex-shrink:0} .plantao__group a{ display:inline-flex;align-items:center;gap:8px;padding:0 18px 0 0; font-size:13px;color:#dfe3e9;text-decoration:none;white-space:nowrap; } .plantao__group a:hover{color:#fff} .plantao__group .time{font:600 11px var(--data);color:var(--warning)} .plantao__sep{color:rgba(255,255,255,.22);padding:0 4px 0 0;user-select:none} @keyframes jdf-plantao-marquee{ from{transform:translate3d(0,0,0)} to{transform:translate3d(-50%,0,0)} } @media(prefers-reduced-motion:reduce){ .plantao__viewport{mask-image:none;-webkit-mask-image:none;overflow-x:auto;scrollbar-width:none} .plantao__viewport::-webkit-scrollbar{display:none} .plantao__track{animation:none;width:100%} .plantao__group[aria-hidden="true"]{display:none} } .ticker{display:none} /* ============================ HOME ============================ */ main{padding:20px 0} .section-gap{margin-top:28px} .ad-band{width:100%;display:flex;justify-content:center;align-items:center;margin:16px 0} .ad-band--mobile-top{display:none;margin:8px auto} .ad-band .ad-slot{width:100%;max-width:728px;min-height:90px!important;overflow:visible;margin-left:auto;margin-right:auto;display:flex;justify-content:center;align-items:center} .ad-band--wide{margin:22px auto 8px} .ad-band--wide .ad-slot{max-width:970px} .ad-bleed{ width:100%;margin:0;padding:20px 16px;display:flex;justify-content:center;align-items:center; min-height:290px;box-sizing:border-box } .ad-bleed--primary{background:var(--primary);margin-top:40px} .ad-bleed--muted{background:var(--secondary-soft);margin-top:40px} .ad-bleed + .wrap > .grid{margin-top:40px} .ad-bleed--muted + .strip{margin-top:40px} .ad-bleed__inner{width:100%;max-width:970px;display:flex;justify-content:center;align-items:center} .ad-bleed .ad-slot{width:100%;max-width:970px;min-height:250px} .ad-bleed--primary .ad-slot--placeholder, .ad-bleed--primary .ad-slot--reserve{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.35);color:#fff} .ad-bleed--muted .ad-slot--reserve{background:rgba(31,39,51,.06)} .ad-slot--reserve{max-width:100%;box-sizing:border-box} .hero-fill-ad{margin:8px 0;display:flex;justify-content:center;align-items:center} .hero-fill-ad .ad-slot{width:100%;max-width:728px;min-height:90px} .hero-fill-ad .ad-slot--reserve, .hero-fill-ad .ad-slot--placeholder{background:var(--surface-2);border:1px dashed var(--line)} .cards .ad-band--listing{grid-column:1 / -1;margin:4px 0;display:flex;justify-content:center;align-items:center} .cards .ad-band--listing .ad-slot{max-width:728px;margin-left:auto;margin-right:auto} .billboard{display:flex;justify-content:center;margin:10px 0 20px} .billboard .ad-slot,.billboard .ad{width:100%;max-width:970px;min-height:90px!important;overflow:visible} /* HERO */ .hero{display:grid;grid-template-columns:1.7fr 1fr;gap:18px;margin-top:18px;align-items:start} .hero-main{display:flex;flex-direction:column;gap:14px;min-width:0} .hero-fill{margin-top:0} .hero-quad{display:flex;flex-direction:column;gap:14px;align-items:stretch} .hero-quad .cards{display:grid;grid-template-columns:1fr 1fr;gap:14px} .hero-quad .hero-fill-ad{margin:0} .hero-quad .card,.hero-quad .card>a{height:100%;display:flex;flex-direction:column;min-width:0} .hero-quad .card .ph{flex:0 0 auto;aspect-ratio:16/9} .hero-quad .card .ph img{width:100%;height:100%;object-fit:cover} .hero-quad .card .c-body{flex:1;display:flex;flex-direction:column} .hero-quad .card .tag{align-self:flex-start} .hero-quad .card h3{ display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3; overflow:hidden;min-height:calc(1.25em * 3) } .hero-quad .card .cmeta{margin-top:auto} .lead{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;align-self:start} .lead>a{display:block} .lead .ph{border-radius:0} .lead .body{padding:18px 20px 22px} .lead h1{font-size:35px;font-weight:800;margin:10px 0 8px} .lead p{color:var(--muted);font-size:15.5px;line-height:1.55} .lead .meta{margin-top:12px;font:500 12px var(--data);color:var(--soft);display:flex;gap:10px;align-items:center} .hero-side{display:flex;flex-direction:column;gap:14px} .mini{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column} .mini .ph{border-radius:0} .mini .body{padding:11px 13px 13px} .mini h3{font-size:16px;font-weight:700;margin:7px 0 0;line-height:1.22} .agora{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px} .agora h4{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--primary);border-bottom:2px solid var(--primary); padding-bottom:8px;margin-bottom:6px;display:inline-block} .agora li{list-style:none;padding:10px 0;border-bottom:1px solid var(--line);display:flex;gap:10px;font-size:13.5px;line-height:1.35} .agora li:last-child{border:0;padding-bottom:0} .agora .h{font:700 13px var(--data);color:var(--soft)} /* GRID PRINCIPAL */ .grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:26px;margin-top:26px;align-items:start} .grid > .content{min-width:0} /* bloco de editoria */ .block{margin-bottom:26px} .block-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px; border-bottom:2px solid var(--text);padding-bottom:8px} .block-head h2{font-size:20px;font-weight:800;display:flex;align-items:center;gap:9px} .block-head h2::before{content:'';width:5px;height:20px;background:var(--primary);border-radius:2px} .block-head .all{font:600 12.5px var(--body);color:var(--primary)} .cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px} .grid > .content > .cards{grid-template-columns:repeat(2,minmax(0,1fr))} .cards.two{grid-template-columns:1fr 1fr} .cards .card p{display:block} .card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.15s;min-width:0} .card:hover{border-color:var(--line-strong);transform:translateY(-2px)} .card .ph{border-radius:0;min-width:0} .card .c-body{padding:12px 13px 14px} .card h3{font-size:15.5px;font-weight:700;line-height:1.25;margin:8px 0 0} .card p{font-size:13px;color:var(--muted);margin-top:6px;line-height:1.45;display:none} .card .cmeta{margin-top:9px;font:500 11px var(--data);color:var(--soft);display:flex;gap:8px} /* lista compacta (texto, sem foto) */ .listblock{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:6px 16px} .listblock li{list-style:none;display:flex;gap:13px;padding:13px 0;border-bottom:1px solid var(--line);align-items:flex-start} .listblock li:last-child{border:0} .listblock .thumb{flex:0 0 84px} .listblock h3{font-size:14.5px;font-weight:600;line-height:1.3} .listblock .cmeta{margin-top:5px;font:500 11px var(--data);color:var(--soft)} /* destaque esportes (faixa) */ .feature{background:var(--secondary);border-radius:var(--radius);overflow:hidden;color:#fff;display:grid; grid-template-columns:1.4fr 1fr;gap:0} .feature .ph{border-radius:0;min-height:260px} .feature .f-body{padding:26px} .feature .tag{margin-bottom:12px} .feature h2{color:#fff;font-size:27px;font-weight:800;line-height:1.12} .feature p{color:#b9c0cb;margin-top:10px;font-size:14.5px;line-height:1.5} .feature .sub{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px;border-top:1px solid #36404e;padding-top:16px} .feature .sub a{font-size:13.5px;font-weight:600;line-height:1.3;color:#e6e9ee} .feature .sub .time{font:600 11px var(--data);color:var(--warning)} /* ============================ SIDEBAR ============================ */ .sb{display:flex;flex-direction:column;gap:18px} .sb-sticky{position:sticky;top:60px;display:flex;flex-direction:column;gap:18px} .widget{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden} .w-head{font:700 13px var(--display);text-transform:uppercase;letter-spacing:.05em;color:#fff;background:var(--primary); padding:10px 14px;display:flex;align-items:center;justify-content:space-between} .w-head.dark{background:var(--secondary)} .w-head.agro{background:var(--agro)} .w-body{padding:13px 14px} /* mais lidas */ .read li{list-style:none;display:flex;gap:11px;padding:11px 0;border-bottom:1px solid var(--line);align-items:flex-start} .read li:last-child{border:0;padding-bottom:2px} .read .read-more-item{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1} .read .read-more-item h4{margin:0} .read .read-more-item .cmeta{display:block;font:500 11px var(--data);color:var(--soft)} .read .n{font:800 20px var(--display);color:var(--primary-soft);-webkit-text-stroke:1px var(--primary);min-width:24px} .read h4{font-size:13.5px;font-weight:600;line-height:1.3} /* AGRO widget â€” assinatura */ .agrobox .row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 0;border-bottom:1px solid var(--line)} .agrobox .row:last-child{border:0;padding-bottom:0} .agrobox .name{font-weight:600;font-size:13.5px;min-width:0;flex:1 1 auto;padding-right:4px} .agrobox .name small{display:block;font:500 11px var(--data);color:var(--soft);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .agrobox .price{text-align:right;font-family:var(--data);flex:0 0 auto;white-space:nowrap} .agrobox .price b{font-size:15px;font-weight:600} .agrobox .price .up{color:var(--success);font-size:11.5px;font-weight:600;display:block} .agrobox .price .down{color:var(--danger);font-size:11.5px;font-weight:600;display:block} .agrobox .src{margin-top:11px;font:500 11px var(--body);color:var(--soft);display:flex;align-items:center;gap:6px} .lotbox .lot-game{padding:10px 0;border-bottom:1px solid var(--line);font-family:var(--body)} .lotbox .lot-game:last-of-type{border:0} .lotbox .lot-head{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:8px;font:600 13px var(--display);color:var(--text)} .lotbox .lot-meta{font:500 11px var(--body);color:var(--soft)} .lotbox .lot-stale{font:600 10px var(--body);color:var(--warning);text-transform:uppercase;letter-spacing:.04em} .lotbox .lot-acc{font:700 10px var(--body);color:var(--success);text-transform:uppercase;letter-spacing:.04em} .lotbox .lot-next{margin:8px 0 0;display:flex;flex-direction:column;gap:2px;font:500 11px var(--body);color:var(--muted)} .lotbox .lot-dz{display:flex;flex-wrap:wrap;gap:5px} .lotbox .dz{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:28px;padding:0 6px;border-radius:999px;background:var(--surface-2);font:600 12px var(--body);color:var(--text)} .lotbox .w-head .ic-emoji{display:none} .lotbox .src{font:500 11px var(--body);color:var(--soft);margin-top:8px;display:flex;align-items:center;gap:6px} /* clima widget */ .tempnow{display:flex;align-items:center;gap:14px;padding-bottom:12px;border-bottom:1px solid var(--line)} .tempnow .big{font:600 40px var(--data);color:var(--text)} .tempnow .sun{width:46px;height:46px;border-radius:50%;background:var(--warning-soft);display:flex;align-items:center;justify-content:center;color:var(--warning)} .tempnow .meta{font-size:12.5px;color:var(--muted)} .forecast{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:12px;text-align:center} .forecast div{font:500 11px var(--data);color:var(--muted)} .forecast .d{font-weight:600;color:var(--text);margin-bottom:5px} .forecast .ic{font-size:16px;margin:3px 0} .forecast .mx{color:var(--danger);font-weight:600}.forecast .mn{color:var(--info)} /* newsletter */ .nl{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;border-radius:var(--radius);padding:18px} .nl h3{color:#fff;font-size:17px} .nl p{font-size:13px;color:#ffd9df;margin:6px 0 12px;line-height:1.4} .nl .f{display:flex;gap:7px} .nl input{flex:1;border:0;border-radius:6px;padding:10px;font:400 13px var(--body)} .nl button{background:var(--secondary);color:#fff;border:0;border-radius:6px;padding:0 14px;font:700 13px var(--display);cursor:pointer} .jdf-nl-hp{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0} .jdf-nl-notice{margin:10px 0 0;font:600 13px var(--body)} .jdf-nl-notice--ok{color:var(--success-soft)} .jdf-nl-notice--err{color:#ffd9df} /* colunistas */ .colun li{list-style:none;display:flex;gap:11px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)} .colun li:last-child{border:0} .colun .av{width:42px;height:42px;border-radius:50%;border:1.5px dashed var(--line-strong);flex:0 0 auto; display:flex;align-items:center;justify-content:center;color:var(--soft);font:600 9px var(--data);background:var(--surface-2)} .colun .nm{font-weight:700;font-size:13.5px;font-family:var(--display)} .colun .ct{font-size:12px;color:var(--muted);line-height:1.3;margin-top:2px} /* mini serviÃ§os */ .serv{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)} .serv a{background:var(--surface);padding:13px 10px;text-align:center;font:600 12.5px var(--body);color:var(--muted)} .serv a:hover{background:var(--surface-2);color:var(--primary)} .serv .ic{display:block;font-size:18px;margin-bottom:5px} /* falecimentos */ .obit li{list-style:none;padding:9px 0;border-bottom:1px solid var(--line);font-size:13px} .obit li:last-child{border:0} .obit b{font-weight:600} .obit small{color:var(--soft);font:500 11px var(--data)} /* ============================ STRIPS LARGAS ============================ */ .strip{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:28px 0;margin-top:20px} .strip.alt{background:var(--secondary-soft);margin-top:0} .strip.alt + .strip,.strip + footer.site-foot{margin-top:0} .strip-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px} .strip-head h2{font-size:22px;font-weight:800;margin:0} .strip-head .all{font:600 13px var(--body);color:var(--primary);flex:0 0 auto;white-space:nowrap} .strip-head__copy{min-width:0} .strip-kicker{margin:0 0 6px;font:700 11px/1 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--primary)} .strip-dek{margin:6px 0 0;font:400 14px/1.4 var(--body);color:var(--muted);max-width:46ch} .colcards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px} .colcard{display:flex;gap:12px;align-items:flex-start;padding:14px;background:#fff;border:1px solid var(--line);border-radius:var(--radius)} .colcard .av{width:54px;height:54px;border-radius:50%;border:1.5px solid var(--line);flex:0 0 auto;overflow:hidden; display:flex;align-items:center;justify-content:center;color:var(--secondary);font:700 13px var(--display);background:var(--surface-2)} .colcard .av img{width:100%;height:100%;object-fit:cover;display:block} .colcard .nm{font:700 13px var(--display);color:var(--primary)} .colcard .nm a{color:inherit} .colcard h3{font-size:14px;font-weight:600;line-height:1.3;margin-top:4px} .colcard h3 a{color:var(--text)} .colcard h3 a:hover{color:var(--primary)} .colcard .col-t{display:block;margin-top:6px;font-size:11.5px;color:var(--soft);font-family:var(--data)} .vids{display:grid;grid-template-columns:repeat(4,1fr);gap:16px} .vid{position:relative;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line)} .vid .play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center} .vid .play span{width:46px;height:46px;border-radius:50%;background:#000000aa;color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px} .vid h3{font-size:13.5px;font-weight:600;padding:10px 12px;line-height:1.3} /* ============================ RODAPÉ — colofão editorial ============================ */ footer.site-foot, footer{ background:var(--secondary); color:#9aa3b0; margin-top:28px; border-top:3px solid var(--primary); } .foot-band{border-bottom:1px solid rgba(255,255,255,.08)} .foot-band__inner{ display:flex;align-items:center;justify-content:space-between; gap:28px 40px;padding:22px 16px;flex-wrap:wrap } .foot-brand{display:flex;align-items:center;gap:16px;min-width:0} .foot-brand .logo{display:block;max-width:168px;line-height:0} .foot-brand .logo-edicao{display:none!important} .foot-brand .jdf-logo-img--fallback-dark{filter:brightness(0) invert(1);opacity:.95} .foot-brand__tag{ margin:0;max-width:16ch;font:500 12.5px/1.35 var(--display);letter-spacing:.02em; color:#c5ccd6;border-left:2px solid var(--primary);padding-left:14px } .foot-nl{ display:flex;align-items:flex-start;gap:16px 20px;flex:1 1 320px; justify-content:flex-end;flex-wrap:wrap;min-width:0 } .foot-nl__label{ display:flex;flex-direction:column;gap:2px;text-align:right; padding-top:5px; /* centra o bloco do título com a altura do input */ } .foot-nl__kicker{font:700 10px/1 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--primary)} .foot-nl__label strong{font:600 15px/1.2 var(--display);color:#fff;letter-spacing:-.01em} .foot-nl__form{display:flex;flex-wrap:wrap;gap:0;min-width:min(100%,280px);max-width:340px;flex:1 1 280px;align-items:stretch;min-height:0;height:auto;position:relative} .foot-nl__form input[type="email"]{ flex:1;min-width:0;border:1px solid rgba(255,255,255,.14);border-right:0; border-radius:2px 0 0 2px;background:rgba(0,0,0,.22);color:#fff;padding:11px 12px;font:400 13px var(--body) } .foot-nl__form input[type="email"]::placeholder{color:#7f8895} .foot-nl__form input[type="email"]:focus{outline:none;border-color:var(--primary);background:rgba(0,0,0,.35)} .foot-nl__form button{ border:0;border-radius:0 2px 2px 0;background:var(--primary);color:#fff;padding:0 16px; font:700 12px/1 var(--display);letter-spacing:.04em;text-transform:uppercase;cursor:pointer } .foot-nl__form button:hover{background:var(--primary-dark)} .foot-nl__consent{ flex:1 1 100%;display:flex;align-items:flex-start;gap:8px;margin-top:10px; font:400 12px/1.4 var(--body);color:#9aa3b2;cursor:pointer } .foot-nl__consent input{flex:0 0 auto;margin:2px 0 0;width:auto;accent-color:var(--primary)} .foot-nl__consent a{color:#ffb3c0;text-decoration:underline} .foot-nl__consent a:hover{color:#fff} .foot-nl__unsub{flex:1 1 100%;margin-top:8px;font:500 12px/1.3 var(--body);color:#8b939f} .foot-nl__unsub summary{cursor:pointer;list-style:none;color:#aeb6c2} .foot-nl__unsub summary::-webkit-details-marker{display:none} .foot-nl__unsub summary:hover{color:#fff} .foot-nl__unsub-form{display:flex;gap:0;margin-top:8px;max-width:340px} .foot-nl__unsub-form input[type="email"]{ flex:1;min-width:0;border:1px solid rgba(255,255,255,.14);border-right:0; border-radius:2px 0 0 2px;background:rgba(0,0,0,.22);color:#fff;padding:8px 10px;font:400 12px var(--body) } .foot-nl__unsub-form button{ border:0;border-radius:0 2px 2px 0;background:rgba(255,255,255,.12);color:#fff;padding:0 12px; font:700 11px/1 var(--display);letter-spacing:.04em;text-transform:uppercase;cursor:pointer } .foot-nl__unsub-form button:hover{background:var(--primary)} .foot-band .jdf-nl-notice{width:100%;margin:0;order:3;text-align:right;font-size:12.5px} .foot-band .jdf-nl-notice--ok,.foot-cta .jdf-nl-notice--ok{color:#d4edda} .foot-band .jdf-nl-notice--err,.foot-cta .jdf-nl-notice--err{color:#ffd9df} .foot-edits{border-bottom:1px solid rgba(255,255,255,.08);padding:12px 0} .foot-edits .wrap{display:flex;align-items:center;gap:14px 18px;min-width:0} .foot-edits__label{flex:0 0 auto;font:700 10px/1 var(--display);letter-spacing:.16em;text-transform:uppercase;color:var(--primary)} .foot-edits__list{display:flex;flex-wrap:nowrap;align-items:center;gap:0;list-style:none;margin:0;padding:0;min-width:0;overflow:hidden;mask-image:linear-gradient(90deg,#000 92%,transparent)} .foot-edits__list li{display:inline-flex;align-items:center;flex:0 0 auto} .foot-edits__list li.has-sep::before{content:"";width:3px;height:3px;margin:0 10px;border-radius:50%;background:rgba(255,255,255,.28);flex:0 0 auto} .foot-edits__list a{color:#c5ccd6;text-decoration:none;font:500 13px/1.2 var(--display);letter-spacing:.01em;white-space:nowrap} .foot-edits__list a:hover{color:#fff} .foot-meta{padding:14px 0} .foot-meta__inner{display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap} .foot-links__list{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;margin:0;padding:0} .foot-links__list a{color:#aeb6c2;text-decoration:none;font:500 12.5px/1.2 var(--body)} .foot-links__list a:hover{color:#fff} .foot-social{display:flex;gap:8px;align-items:center} .foot-social a{ width:var(--touch);height:var(--touch);display:inline-flex;align-items:center;justify-content:center;color:#c5ccd6; border:1px solid rgba(255,255,255,.12);border-radius:2px; transition:background .15s ease,color .15s ease,border-color .15s ease } .foot-social a:hover{background:var(--primary);border-color:var(--primary);color:#fff} .foot-social .i{width:15px;height:15px} .foot-legal{border-top:1px solid rgba(255,255,255,.08);padding:14px 0 18px} .foot-legal__inner{display:flex;flex-direction:column;gap:4px} .foot-legal p{margin:0;font:400 11.5px/1.45 var(--body);color:#6f7885;letter-spacing:.01em} .foot-legal__copy{color:#8b939f} .foot-legal__pub{color:#7a828e;font-style:italic} .foot-legal__addr a{color:#9aa3b0;text-decoration:none} .foot-legal__addr a:hover{color:#fff} .foot-legal__dot{margin:0 6px;opacity:.7} .foot-legal__nav{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:6px;font:600 12.5px/1.3 var(--body)} .foot-legal__nav a,.foot-legal__nav .jdf-unsub-trigger{color:#ffb3c0;text-decoration:none} .foot-legal__nav a:hover,.foot-legal__nav .jdf-unsub-trigger:hover{color:#fff;text-decoration:underline} .foot-legal__sep{color:#6f7885;font-weight:400} .foot-ad{padding:18px 0;background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)} .foot-ad .wrap{display:flex;justify-content:center;align-items:center} .foot-ad .ad-slot,.foot-ad .ad{width:100%;max-width:970px;min-height:90px;overflow:visible;background:transparent;border:0} .foot-ad .ad-slot iframe,.foot-ad .ad-slot > div{max-width:100%!important} /* Cookie consent (GAM) */ .jdf-cookie{ position:fixed;z-index:9999;left:16px;right:16px;bottom:16px;max-width:520px;margin:0 auto; display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 16px; padding:14px 16px;background:#1a2230;color:#d7dde6;border:1px solid rgba(255,255,255,.12); border-radius:6px;box-shadow:0 8px 28px rgba(0,0,0,.35);font:400 13px/1.45 var(--body) } .jdf-cookie__text{margin:0;flex:1 1 220px} .jdf-cookie__text a{color:#ffb3c0;text-decoration:underline} .jdf-cookie__actions{display:flex;gap:8px;flex:0 0 auto} .jdf-cookie__btn{ appearance:none;border:1px solid rgba(255,255,255,.25);background:transparent;color:#fff; min-height:36px;padding:0 12px;border-radius:2px;font:700 12px/1 var(--display);cursor:pointer } .jdf-cookie__btn--ok{background:var(--primary);border-color:var(--primary)} .jdf-cookie__btn:hover{border-color:#fff} .jdf-unsub-overlay{ position:fixed;inset:0;z-index:10040;background:rgba(20,24,32,.55) } .jdf-unsub-overlay[hidden],.jdf-unsub[hidden]{display:none!important} .jdf-unsub{ position:fixed;z-index:10050;left:50%;top:50%;transform:translate(-50%,-50%); width:min(440px,calc(100vw - 32px));max-height:min(90vh,640px);overflow:auto; background:#fff;color:var(--text);border:1px solid var(--line); border-radius:8px;box-shadow:0 24px 64px rgba(20,24,32,.28); padding:28px 24px 22px;font:400 15px/1.5 var(--body) } .jdf-unsub__close{ position:absolute;top:10px;right:10px;width:36px;height:36px;border:0;background:transparent; color:var(--muted);font-size:26px;line-height:1;cursor:pointer } .jdf-unsub__close:hover{color:var(--text)} .jdf-unsub__kicker{margin:0 0 6px;font:700 11px/1 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--primary)} .jdf-unsub__title{margin:0 0 8px;font:800 24px/1.2 var(--display);letter-spacing:-.02em;color:var(--secondary)} .jdf-unsub__dek{margin:0 0 16px;color:var(--muted);font-size:14.5px} .jdf-unsub .jdf-nl-notice{margin:0 0 14px;font:600 14px var(--body)} .jdf-unsub .jdf-nl-notice--ok{color:var(--success)} .jdf-unsub .jdf-nl-notice--err{color:var(--danger)} .jdf-unsub__form label{display:block;font:700 12px/1.2 var(--display);margin:0 0 6px;color:var(--secondary)} .jdf-unsub__form input[type="email"]{ width:100%;box-sizing:border-box;min-height:44px;padding:0 12px;margin:0 0 12px; border:1px solid var(--line-strong);border-radius:4px;font:400 15px var(--body) } .jdf-unsub__form input[type="email"]:focus{outline:2px solid var(--primary);outline-offset:1px} .jdf-unsub__form button{ width:100%;min-height:44px;border:0;border-radius:4px;background:var(--primary);color:#fff; font:700 13px/1 var(--display);letter-spacing:.04em;text-transform:uppercase;cursor:pointer } .jdf-unsub__form button:hover{background:var(--primary-dark)} .jdf-unsub__hint{margin:12px 0 0;font-size:13px;color:var(--muted)} .jdf-unsub-cta{ display:inline-flex;align-items:center;min-height:44px;padding:0 16px;margin-top:4px; background:var(--primary);color:#fff;font:700 13px/1 var(--display);letter-spacing:.03em; text-transform:uppercase;text-decoration:none;border-radius:4px } .jdf-unsub-cta:hover{background:var(--primary-dark);color:#fff} body.jdf-unsub-open{overflow:hidden} @media (max-width:720px){ .foot-band__inner{padding:20px 16px;gap:18px} .foot-brand{width:100%} .foot-brand__tag{max-width:none} .foot-nl{width:100%;justify-content:stretch;flex-direction:column;align-items:stretch} .foot-nl__label{text-align:left;padding-top:0} .foot-nl__form{max-width:none} .foot-band .jdf-nl-notice{text-align:left} .foot-edits .wrap{gap:8px 10px;align-items:flex-start;flex-direction:column} .foot-edits__list{flex-wrap:wrap;mask-image:none;max-height:4.2em;overflow:hidden} .foot-edits__list li{max-width:100%} .foot-edits__list a{max-width:100%;white-space:normal} .foot-meta__inner{align-items:flex-start} } /* ============================ COLUNAS INDEX — Opinion Salon ============================ */ .ed-archive{padding-bottom:40px} .ed-archive__body{padding-top:28px} .ed-archive__body .grid{margin-top:0} .ed-feed__cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:0 0 22px} .ed-lead{margin:0 0 22px;background:#fff;border-bottom:1px solid var(--secondary)} .ed-lead__link{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.9fr);gap:0;text-decoration:none;color:inherit;min-height:280px} .ed-lead__ph{min-height:280px;background:var(--surface-2);overflow:hidden} .ed-lead__ph img{width:100%;height:100%;object-fit:cover;display:block} .ed-lead__ph--empty{display:grid;place-items:center;color:var(--soft)} .ed-lead__ph--empty .i{width:42px;height:42px} .ed-lead__body{padding:22px 24px 24px;display:flex;flex-direction:column;justify-content:center;border-left:3px solid var(--primary)} .ed-lead__title{font:800 clamp(26px,3.2vw,40px)/1.12 var(--display);letter-spacing:-.03em;margin:10px 0 12px;color:var(--secondary)} .ed-lead__dek{margin:0;font:400 16px/1.5 var(--body);color:var(--muted)} .ed-lead__meta{margin-top:16px;display:flex;align-items:center;gap:8px;font:600 12px var(--data);color:var(--soft);text-transform:uppercase;letter-spacing:.04em} .ed-feed__list{list-style:none;margin:0 0 8px;padding:0;border-top:1px solid var(--line)} .ed-row{border-bottom:1px solid var(--line)} .ed-row__link{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;padding:14px 0;text-decoration:none;color:inherit;align-items:center} .ed-row__ph{width:120px;height:80px;overflow:hidden;background:var(--surface-2)} .ed-row__ph img{width:100%;height:100%;object-fit:cover;display:block} .ed-row__ph--empty{display:grid;place-items:center;color:var(--soft)} .ed-row__body{min-width:0} .ed-row__title{font:800 18px/1.25 var(--display);letter-spacing:-.02em;margin:4px 0 6px;color:var(--secondary)} .ed-row:hover .ed-row__title,.ed-lead:hover .ed-lead__title{color:var(--primary)} .ed-row__time{font:600 11px var(--data);color:var(--soft)} .ed-archive .ad-band--archive-top,.ed-archive .ad-band--after-lead,.ed-archive .ad-band--mid-list,.ed-archive .ad-band--before-pager{margin:8px 0 22px} .ad-band:not(:has(.ad-slot)){display:none} .ed-pager{margin:36px 0 8px;padding-top:22px;border-top:1px solid var(--secondary)} .ed-pager__status{ margin:0 0 16px;text-align:center; font:700 11px/1 var(--data);letter-spacing:.16em;text-transform:uppercase;color:var(--soft) } .ed-pager .navigation.pagination{margin:0;padding:0;border:0} .navigation.pagination{margin:28px 0 8px;padding-top:18px;border-top:1px solid var(--secondary)} .navigation.pagination .nav-links{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px} .navigation.pagination .page-numbers{ min-width:42px;height:42px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center; border:1px solid var(--line);background:#fff;color:var(--secondary);text-decoration:none; font:700 13px var(--display);letter-spacing:.02em } .navigation.pagination .page-numbers:hover{border-color:var(--primary);color:var(--primary)} .navigation.pagination .page-numbers.current{background:var(--primary);border-color:var(--primary);color:#fff} .navigation.pagination .page-numbers.dots{border:0;background:transparent;min-width:auto;padding:0 4px;color:var(--soft)} .navigation.pagination .prev,.navigation.pagination .next{ min-width:auto;padding:0 16px;text-transform:uppercase;letter-spacing:.14em;font-size:11px; background:var(--secondary);border-color:var(--secondary);color:#fff } .navigation.pagination .prev:hover,.navigation.pagination .next:hover{ background:var(--primary);border-color:var(--primary);color:#fff } .ed-mast--editoria .ed-mast__title{max-width:14ch} .ed-mast--caderno .ed-mast__kicker{color:var(--cultura)} .ed-mast--assunto{ background: linear-gradient(180deg,#fff 0%,#f7f6f3 100%); } .ed-mast--assunto::before{ content:"#"; font:800 200px/.7 var(--display); color:rgba(200,16,46,.07); letter-spacing:-.08em; top:-28px;right:6%;width:auto;height:auto;border:0;border-radius:0 } .ed-mast--assunto .ed-mast__kicker::before{ content:"#";margin-right:.3em;letter-spacing:0 } .ed-mast--assunto .ed-mast__title{ max-width:16ch; font-size:clamp(40px,6.4vw,68px); line-height:.92 } .ed-mast--assunto .ed-mast__lead{max-width:46ch} .ed-mast__crumbs{margin:0 0 18px;color:var(--soft)} .ed-mast__crumbs a{color:var(--soft)} .tag-index{ background:var(--surface-2); border-bottom:1px solid var(--line); padding:20px 0 22px } .tag-index__inner{display:flex;flex-direction:column;gap:16px} .tag-index__block{min-width:0} .tag-index__kicker{ margin:0 0 8px;font:700 10px/1 var(--data);letter-spacing:.18em;text-transform:uppercase;color:var(--primary) } .tag-index__chips,.tag-index__eds{ list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px } .tag-index__chips a{ display:inline-flex;align-items:center;gap:0; padding:7px 12px 7px 10px; border:1px solid var(--line);background:#fff;border-radius:999px; font:600 13px/1.2 var(--display);color:var(--secondary);text-decoration:none } .tag-index__chips a::before{ content:"#";color:var(--primary);font-weight:800;margin-right:5px;letter-spacing:0 } .tag-index__chips a:hover{border-color:var(--primary);color:var(--primary)} .tag-index__eds a{ font:700 11px/1 var(--display);letter-spacing:.08em;text-transform:uppercase; color:var(--muted);text-decoration:none;padding:6px 0 } .tag-index__eds a:hover{color:var(--primary)} .ed-empty{ margin:8px 0 40px;padding:28px 8px;font:500 16px/1.5 var(--body);color:var(--muted); border-bottom:1px solid var(--line) } .cols-index{padding-bottom:56px;background: radial-gradient(1200px 400px at 0% 0%,rgba(200,16,46,.05),transparent 55%), var(--bg)} .ed-mast{ background: linear-gradient(105deg,rgba(31,39,51,.06) 0%,transparent 42%), repeating-linear-gradient(0deg,transparent,transparent 27px,rgba(31,39,51,.04) 27px,rgba(31,39,51,.04) 28px), #fff; border-bottom:1px solid var(--line); margin-bottom:0;padding:42px 0 32px;position:relative;overflow:hidden } .ed-mast::before{ content:"";position:absolute;top:-40px;right:8%;width:220px;height:220px;border-radius:50%; border:1px solid rgba(200,16,46,.12);pointer-events:none } .ed-mast::after{ content:"";position:absolute;left:0;right:0;bottom:0;height:3px; background:linear-gradient(90deg,var(--primary) 0,var(--primary) 140px,rgba(200,16,46,.25) 140px,transparent 42%) } .ed-mast__inner{position:relative;z-index:1} .ed-mast__kicker{ margin:0 0 10px;font:700 11px/1 var(--display);letter-spacing:.22em;text-transform:uppercase;color:var(--primary) } .ed-mast__row{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap} .ed-mast__title{ margin:0;font:800 clamp(48px,8vw,84px)/.88 var(--display);letter-spacing:-.045em;color:var(--secondary); max-width:9ch } .ed-mast__count{ font:700 clamp(36px,6vw,64px)/1 var(--data);color:rgba(31,39,51,.12);letter-spacing:-.03em; border-bottom:2px solid rgba(200,16,46,.35);padding-bottom:4px } .ed-mast__lead{ margin:16px 0 0;max-width:38ch;font:500 16px/1.5 var(--body);color:var(--muted) } .cols-index__body{padding-top:0} .cols-grid{ list-style:none;margin:0;padding:0;background:#fff; display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0; border:1px solid var(--line);border-top:0 } .cols-tile{border-bottom:1px solid var(--line);border-right:1px solid var(--line);position:relative} .cols-tile:nth-child(2n){border-right:0} .cols-tile--lead{grid-column:1 / -1;background:linear-gradient(90deg,rgba(200,16,46,.04),transparent 55%)} .cols-tile--lead .cols-tile__link{min-height:132px;padding:28px 22px} .cols-tile--lead .cols-tile__av{width:88px;height:88px} .cols-tile--lead .cols-tile__name{font-size:22px} .cols-tile--lead .cols-tile__piece{font-size:15px;-webkit-line-clamp:2} .cols-tile__link{ display:grid;grid-template-columns:auto 68px 1fr;gap:14px 18px;align-items:center; padding:22px 18px;min-height:118px;color:inherit;text-decoration:none; transition:background .2s ease;position:relative } .cols-tile__link::before{ content:"";position:absolute;left:0;top:0;bottom:0;width:0;background:var(--primary); transition:width .2s ease } .cols-tile__link:hover{background:#fafafa} .cols-tile__link:hover::before{width:3px} .cols-tile__link:hover .cols-tile__go{color:var(--primary);transform:translateX(4px)} .cols-tile__link:hover .cols-tile__name{color:var(--primary)} .cols-tile__num{ font:600 12px/1 var(--data);color:var(--soft);letter-spacing:.06em;align-self:start;padding-top:6px } .cols-tile__av{ width:68px;height:68px;border-radius:2px;overflow:hidden;background:var(--secondary); display:flex;align-items:center;justify-content:center;flex:0 0 auto; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08) } .cols-tile__av--mono{ background: linear-gradient(145deg,rgba(200,16,46,.22),transparent 50%), var(--secondary) } .cols-tile__av img{width:100%;height:100%;object-fit:cover} .cols-tile__mono{ font:700 18px/1 var(--display);color:rgba(255,255,255,.82);letter-spacing:.04em } .cols-tile__body{min-width:0} .cols-tile__name{ margin:0;font:700 17px/1.15 var(--display);letter-spacing:-.02em;color:var(--text); transition:color .15s ease } .cols-tile__piece{ margin:7px 0 0;font:500 13.5px/1.4 var(--body);color:var(--muted); display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden } .cols-tile__piece--mute{font-style:italic;opacity:.75} .cols-tile__go{ display:inline-block;margin-top:12px;font:700 11px/1 var(--display);letter-spacing:.12em; text-transform:uppercase;color:var(--soft);transition:color .15s ease,transform .15s ease } .cols-index__empty{padding:40px 0;color:var(--muted)} @media (min-width:960px){ .cols-grid{grid-template-columns:repeat(3,minmax(0,1fr))} .cols-tile{border-right:1px solid var(--line)} .cols-tile:nth-child(2n){border-right:1px solid var(--line)} .cols-tile:nth-child(3n){border-right:0} .cols-tile--lead{grid-column:1 / -1;border-right:0} .cols-tile--lead .cols-tile__link{grid-template-columns:auto 96px 1fr;gap:20px 24px} } @media (max-width:640px){ .ed-mast{padding:28px 0 22px} .cols-grid{grid-template-columns:1fr} .cols-tile,.cols-tile:nth-child(2n),.cols-tile--lead{border-right:0;grid-column:auto} .cols-tile__link,.cols-tile--lead .cols-tile__link{grid-template-columns:auto 52px 1fr;padding:18px 12px;gap:12px;min-height:0} .cols-tile__av,.cols-tile--lead .cols-tile__av{width:52px;height:52px} .cols-tile--lead .cols-tile__name{font-size:17px} } /* ============================ ANCHOR MOBILE ============================ */ .anchor{display:none} /* ============================ ÃCONES (inline) ============================ */ .i{width:1em;height:1em;display:inline-block;vertical-align:-.12em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round} /* ============================ RESPONSIVO ============================ */ @media(max-width:1180px){ .masthead .jdf-search{max-width:160px} .logo{max-width:200px} .head-ad{flex:0 1 auto;width:auto;min-width:0;max-width:970px;margin-left:auto} } @media(max-width:1080px){ .cards{grid-template-columns:1fr 1fr} .colcards,.vids{grid-template-columns:1fr 1fr} .masthead .jdf-search{display:none} .nav button.navsearch{display:flex} } @media(max-width:860px){ .head-ad{display:none} .ad-slot--placeholder{width:var(--ad-mw)!important;height:var(--ad-mh)!important;min-height:var(--ad-mh)!important} .ad-slot--in-content{min-height:250px!important;max-width:300px} .ad-slot--home-sb-lidas, .ad-slot--busca-sb-lidas, .ad-slot--arquivo-sb-lidas, .ad-slot--single-sb-lidas{min-height:250px!important} .hero{grid-template-columns:1fr} .grid{grid-template-columns:1fr} .sb-sticky{position:static} .feature{grid-template-columns:1fr} .feature .ph{min-height:200px} .nav .wrap{gap:0} .nav a:not(.burger):not(.navsearch){display:none} .nav > .wrap > a.burger{display:flex;font-size:20px} .nav a.mais{margin-left:auto} .nav button.navsearch{display:flex} } @media(max-width:600px){ .topbar-date--full{display:none} .topbar-date--short{display:inline-flex} .lead h1{font-size:25px} .cards{grid-template-columns:1fr} .hero-quad{display:flex;flex-direction:column} .colcards,.vids,.serv{grid-template-columns:1fr 1fr} .masthead .wrap{flex-wrap:wrap} .jdf-search{max-width:none;order:3;flex-basis:100%} body{padding-bottom:var(--jdf-chrome-bottom,56px)} .anchor{display:flex;position:fixed;left:0;right:0;z-index:95;background:#fff;border-top:1px solid var(--line); padding:6px;box-shadow:0 -2px 10px rgba(0,0,0,.12);align-items:center} .anchor .ad,.anchor .ad-slot{flex:1;min-height:50px;padding:6px;display:flex;align-items:center;justify-content:center} } /* ---------- BANNER SLOTS (tema) ---------- */ .ad-slot{overflow:visible;border-radius:var(--radius-sm)} .ad-slot img,.ad-slot picture{width:100%;height:auto;display:block} .ad-slot--header-leaderboard{min-height:90px!important} .ad-slot--in-content{min-height:90px!important;max-width:728px;margin-left:auto;margin-right:auto} .ad-slot--home-before-colunas{min-height:250px!important} .ad-slot--home-sb-lidas, .ad-slot--busca-sb-lidas, .ad-slot--arquivo-sb-lidas, .ad-slot--single-sb-lidas{min-height:600px} .ad-slot--mobile-anchor{min-height:50px} .ad-slot a{display:block;line-height:0} .ad-slot--script iframe,.ad-slot--script ins{max-width:100%} .ad-slot--placeholder{ border:1.5px dashed #8e96a3; background:#c5cbd4; color:#3a4250; display:flex; align-items:center; justify-content:center; text-align:center; max-width:100%; box-sizing:border-box; margin-left:auto; margin-right:auto; overflow:hidden } .ad-band .ad-slot--placeholder, .head-ad .ad-slot--placeholder{ width:var(--ad-w)!important; height:var(--ad-h)!important; min-height:var(--ad-h)!important; max-width:100% } .ad-slot__wait{font:600 12px/1.4 var(--body);padding:10px 12px;color:#2f3642} .ad-slot__wait small{display:block;margin-top:4px;font:500 10px/1.3 var(--data);color:#4a5260;letter-spacing:.02em} .sb .ad-slot--placeholder{max-width:300px} .obit-more{margin:10px 0 0;font:600 12px var(--body)} .obit-more a{color:var(--primary)} /* ---------- SINGLE / ARCHIVE extras ---------- */ .single-body{padding:24px 0} .single-body .entry-content{font-size:16px;line-height:1.7;color:var(--text)} .single-body .entry-content p{margin-bottom:1.2em} .single-body .entry-content img{border-radius:var(--radius-sm);margin:1em 0} .archive-head{margin:20px 0 24px} .archive-head h1{font-size:28px;font-family:var(--display);letter-spacing:-.02em} .archive-head__meta{margin-top:6px;font-size:14px;color:var(--soft)} .jdf-empty{padding:24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);color:var(--muted)} .page-content{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:28px;margin:20px 0} .error-404{text-align:center;padding:56px 20px 48px;max-width:640px;margin:0 auto} .error-404__kicker{font:700 11px var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--primary);margin:0 0 8px} .error-404 h1,.error-404__title{font:800 clamp(28px,5vw,42px)/1.1 var(--display);color:var(--secondary);margin:0 0 14px;letter-spacing:-.03em} .error-404 p{color:var(--muted);font-size:16px;line-height:1.5} .error-404 .jdf-search,.error-404__search{max-width:420px;margin:24px auto;display:flex;gap:8px;align-items:center;border:1px solid var(--line);border-radius:8px;padding:8px 12px;background:#fff} .error-404 .jdf-search input,.error-404__search input{flex:1;border:0;font:400 15px var(--body);outline:0;min-width:0} .error-404 .jdf-search button,.error-404__search button{background:var(--primary);color:#fff;border:0;border-radius:6px;padding:8px 14px;font:700 13px var(--display);cursor:pointer} .error-404__home{margin-top:20px} .error-404__home a,.error-404__cta{font:700 14px var(--display);color:var(--primary);text-decoration:none} .error-404__cta:hover{text-decoration:underline} .error-404--lost{max-width:none;padding:0 0 64px;text-align:center} .error-404__stage{ position:relative;padding:64px 20px 40px;margin:0 auto 8px;max-width:720px;overflow:hidden; background: linear-gradient(180deg,#fff 0%,#f7f6f3 100%); border-bottom:1px solid var(--line) } .error-404__edition{margin:0 0 10px;font:600 12px/1 var(--data);letter-spacing:.04em;color:var(--soft);text-transform:uppercase} .error-404__big{ margin:0;font:800 clamp(96px,22vw,180px)/.85 var(--display);letter-spacing:-.06em; color:rgba(200,16,46,.1);user-select:none;pointer-events:none } .error-404__lead{margin:0 auto;max-width:42ch;font:500 17px/1.55 var(--body);color:var(--muted)} .error-404__rail{padding:28px 16px 0;text-align:left;max-width:720px;margin:0 auto} .error-404__rail-kicker{margin:0 0 14px;font:700 11px/1 var(--display);letter-spacing:.16em;text-transform:uppercase;color:var(--primary)} .error-404__list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)} .error-404__list li{border-bottom:1px solid var(--line)} .error-404__list a{ display:flex;gap:14px;align-items:baseline;padding:14px 2px;text-decoration:none;color:var(--secondary) } .error-404__list a:hover .error-404__list-title{color:var(--primary)} .error-404__list-time{flex:0 0 auto;font:700 12px/1.2 var(--data);color:var(--soft);text-transform:uppercase;min-width:3.5rem} .error-404__list-title{font:700 17px/1.25 var(--display);letter-spacing:-.02em} .nav a.nav-open{display:flex!important} .banner-mobile-before-header .banner-placeholder{width:100%;max-width:100%;height:auto;min-height:50px} /* Editorial image fit — object-fit cover in aspect-ratio boxes */ .ph:has(img), .av:has(img) { display: grid; } .ph:has(img) > img, .av:has(img) > img, .ph img, .av img, .entry-content .wp-block-image img, .jdf-leia-tambem__thumb img { grid-area: 1 / 1; width: 100%; height: 100%; object-fit: cover; display: block; } .ph.r16 { aspect-ratio: 16 / 9; } .ph.r43 { aspect-ratio: 4 / 3; } .av { aspect-ratio: 1 / 1; } /* Leia Também inline */ .jdf-leia-tambem { margin: 1.5rem 0; padding: 14px 14px 12px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-2); } .jdf-leia-tambem__label { display: block; font: 700 11px/1.2 var(--display); text-transform: uppercase; letter-spacing: .08em; margin: 0 0 10px; color: var(--primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .jdf-leia-tambem__link { display: grid; grid-template-columns: 72px minmax(0,1fr); gap: 12px; align-items: center; text-decoration: none; color: inherit; } .jdf-leia-tambem__thumb { width: 72px; height: 54px; border-radius: 2px; overflow: hidden; background: var(--line); } .jdf-leia-tambem__thumb img, .jdf-leia-tambem__img { width: 100%; height: 100%; object-fit: cover; display: block; } .jdf-leia-tambem__title { font: 700 15.5px/1.3 var(--display); letter-spacing: -.01em; color: var(--secondary); } .jdf-leia-tambem__link:hover .jdf-leia-tambem__title { color: var(--primary); } .jdf-share { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.5rem; margin: 1.25rem 0 1.5rem; } .jdf-share--compact { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 4px 0 20px; padding-top: 14px; border-top: 1px solid var(--line); } .jdf-share__label { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--soft); margin-right: 2px; } .jdf-share--compact .jdf-share__btn { min-height: 36px; min-width: 36px; width: 36px; height: 36px; padding: 0; border-radius: 50%; border: 0; color: #fff; } .jdf-share--compact .jdf-share__btn .i { width: 16px; height: 16px; fill: currentColor; stroke: none; } .jdf-share--compact .jdf-share__btn--wa { background: #25d366; } .jdf-share--compact .jdf-share__btn--fb { background: #1877f2; } .jdf-share--compact .jdf-share__btn--x { background: #111; } .jdf-share--compact .jdf-share__btn--copy { background: #4b5563; } .jdf-share--compact .jdf-share__btn:hover { filter: brightness(1.08); transform: translateY(-1px); } .jdf-share--compact .jdf-share__btn.is-copied { background: #059669; } .jdf-share__btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; min-width: 44px; padding: 0.5rem 0.75rem; border-radius: 6px; font-size: 0.875rem; font-weight: 600; text-decoration: none; border: none; cursor: pointer; color: #fff; } .jdf-share__btn--wa { background: #25d366; } .jdf-share__btn--fb { background: #1877f2; } .jdf-share__btn--x { background: #000; } .jdf-share__btn--copy { background: #374151; } .jdf-share__btn.is-copied { background: #059669; } @media (min-width: 640px) { .jdf-share:not(.jdf-share--compact) { grid-template-columns: repeat(4, auto); } } /* Single article */ .jdf-article { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 28px 32px 36px; min-width: 0; } .jdf-article__header { margin-bottom: 20px; } .jdf-breadcrumb { font-size: 12px; color: var(--soft); margin-bottom: 14px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; } .jdf-breadcrumb a { color: var(--soft); text-decoration: none; } .jdf-breadcrumb a:hover { color: var(--primary); } .jdf-article__tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; } .jdf-article__tags .tag { text-decoration: none; } .jdf-article__title { font-size: clamp(29px, 4vw, 41px); line-height: 1.15; margin: 0 0 12px; font-family: var(--display); letter-spacing: -.02em; } .jdf-article__excerpt { font-size: 18px; line-height: 1.5; color: var(--muted); margin: 0 0 16px; } .jdf-article__meta { display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: center; font-size: 13px; color: var(--soft); margin: 0 0 16px; } .jdf-listen-trigger { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 12px; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--secondary); font: 700 12px var(--display); cursor: pointer; } .jdf-listen-trigger:hover { border-color: var(--primary); color: var(--primary); } .jdf-article__header .jdf-share--compact { margin-top: 4px; padding-top: 14px; border-top: 1px solid var(--line); } .jdf-article__meta-item a { color: var(--text); font-weight: 600; text-decoration: none; } .jdf-article__meta-item a:hover { color: var(--primary); } .jdf-article__meta-label { font: 700 11px var(--data); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-right: 6px; } .jdf-article__meta-item--published time, .jdf-article__meta-item--updated time { color: var(--text); font-weight: 600; } .jdf-article__meta-reading { display: inline-flex; align-items: center; gap: 4px; } .jdf-article__figure { margin: 0 0 28px; } .jdf-article__photo { border-radius: var(--radius-sm); overflow: hidden; } .jdf-article__caption, .jdf-article__credit { margin: 0; padding: 10px 2px 12px; border-bottom: 1px solid var(--line); font: 400 13.5px/1.45 var(--body); color: var(--muted); font-style: normal; } .jdf-article__figure:has(.jdf-article__caption) { margin-bottom: 32px; } .jdf-article__content { margin-top: 8px; font-size: 17.5px; line-height: 1.75; color: var(--text); } .jdf-article__content p { margin: 0 0 1.2em; } .jdf-article__content h2,.jdf-article__content h3 { font-family: var(--display); margin: 1.6em 0 .6em; line-height: 1.25; } .jdf-article__content ul,.jdf-article__content ol { margin: 0 0 1.2em; padding-left: 1.25em; } .jdf-article__content li { margin-bottom: .4em; } .jdf-article__content a { color: var(--primary); text-decoration: underline; text-underline-offset: 2px; } .jdf-article__content figure, .jdf-article__content .wp-caption, .jdf-article__content .wp-block-image { margin: 1.75em 0 2em; max-width: 100%; } .jdf-article__content figure img, .jdf-article__content .wp-caption img, .jdf-article__content .wp-block-image img { display: block; width: 100%; height: auto; border-radius: var(--radius-sm); } .jdf-article__content figcaption, .jdf-article__content .wp-caption-text, .jdf-article__content .wp-element-caption { display: block; margin: 0 !important; padding: 10px 2px 12px; border-bottom: 1px solid var(--line); font: 400 13.5px/1.45 var(--body) !important; color: var(--muted); font-style: normal; } .jdf-article__content .jdf-leia-tambem a, .jdf-article__content .jdf-ad-break a, .jdf-article__content .jdf-mrail a, .jdf-article__content .jdf-continue a, .jdf-article__content .listblock a, .jdf-article__content .ad-band a { color: inherit; text-decoration: none; } .jdf-article__content .listblock a:hover, .jdf-article__content .jdf-leia-tambem a:hover { color: var(--primary); } .jdf-ad-break { margin: 1.25rem 0; text-align: center; clear: both; background: #d8dde5; border: 1px solid #c5ccd6; border-radius: var(--radius-sm); padding: 14px 12px 16px; } .jdf-ad-break--related { margin: 32px 0 36px; padding: 20px 16px 22px; display: flex; flex-direction: column; align-items: center; } .jdf-ad-break__label { font: 600 11px/1 var(--data); letter-spacing: .08em; text-transform: uppercase; color: #5a6472; margin: 0 0 10px; } .jdf-ad-break .ad-slot, .jdf-ad-break .ad-slot--in-content, .jdf-ad-break .ad-slot--single-before-related { margin-left: auto; margin-right: auto; max-width: 728px; display: flex; justify-content: center; align-items: center; } .ad-slot--single-before-related { margin-left: auto; margin-right: auto; max-width: 728px; display: flex; justify-content: center; align-items: center; } .jdf-article__content blockquote { margin: 1.4em 0; padding: 12px 18px; border-left: 4px solid var(--primary); background: var(--surface-2); color: var(--muted); font-size: 1.05em; } .jdf-article__content strong { font-weight: 700; color: var(--text); } .single-body.jdf-article { background: var(--surface); } .jdf-listen-trigger { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--primary); background: #fff; color: var(--primary); border-radius: 999px; padding: 4px 12px; font-size: 12px; font-weight: 700; cursor: pointer; } .jdf-listen-trigger:hover { background: var(--primary); color: #fff; } .jdf-listen-trigger .i, .jdf-listen-trigger .jdf-tts__glyph { width: 14px; height: 14px; flex: 0 0 auto; display: block; } .jdf-article__figure { margin: 0 0 28px; } .jdf-article__photo { border-radius: var(--radius-sm); overflow: hidden; } .jdf-article__caption, .jdf-article__credit { margin: 0; padding: 10px 2px 12px; border-bottom: 1px solid var(--line); font: 400 13.5px/1.45 var(--body); color: var(--muted); font-style: normal; } .jdf-article__content { margin-top: 8px; font-size: 17.5px; line-height: 1.75; color: var(--text); } .jdf-tts { border: 1px solid var(--line); border-left: 4px solid var(--primary); border-radius: var(--radius-sm); background: linear-gradient(180deg, #fff 0%, #fafafa 100%); padding: 14px 16px; margin: 0 0 14px; } .jdf-tts__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; align-items: center; } .jdf-tts__brand { display: flex; gap: 10px; align-items: center; } .jdf-tts__icon { width: 36px; height: 36px; border-radius: 50%; background: var(--primary); color: #fff; display: grid; place-items: center; flex: 0 0 auto; } .jdf-tts__icon .i, .jdf-tts__icon .jdf-tts__glyph { width: 18px; height: 18px; display: block; } .jdf-tts__glyph { display: block; overflow: visible; } .jdf-tts__status { display: block; font-size: 12px; color: var(--soft); font-weight: 400; } .jdf-tts__controls { display: flex; gap: 6px; align-items: center; } .jdf-tts__btn { border: 1px solid var(--line); background: #fff; border-radius: 6px; min-height: 32px; padding: 0 10px; font-size: 12px; font-weight: 600; cursor: pointer; } .jdf-tts__btn--play { width: 36px; height: 36px; border-radius: 50%; background: var(--primary); color: #fff; border-color: var(--primary); padding: 0; display: grid; place-items: center; position: relative; } .jdf-tts__btn--play .jdf-tts__glyph { width: 14px; height: 14px; fill: currentColor; } .jdf-tts__btn--play .jdf-tts__glyph--pause[hidden], .jdf-tts__btn--play .jdf-tts__glyph--play[hidden] { display: none !important; } .jdf-tts__btn--play .i { width: 14px; height: 14px; fill: currentColor; stroke: none; } .jdf-tts__speed { border: 1px solid var(--line); background: #fff; border-radius: 6px; min-width: 48px; min-height: 32px; font-size: 12px; font-weight: 700; cursor: pointer; } .jdf-tts__progress { height: 4px; background: #ececec; border-radius: 999px; overflow: hidden; margin: 12px 0 6px; } .jdf-tts__bar { height: 100%; width: 0; background: var(--primary); transition: width 0.2s linear; } .jdf-tts__times { display: flex; justify-content: space-between; font-size: 11px; color: var(--soft); } .jdf-author-box { display: grid; grid-template-columns: 96px minmax(0,1fr); gap: 0 20px; align-items: start; padding: 22px 24px 22px 20px; margin: 28px 0 0; border: 1px solid var(--line); border-left: 4px solid var(--primary); border-radius: var(--radius-sm); background: var(--surface-2); } .jdf-author-box__avatar { display: block; width: 96px; height: 96px; border-radius: 50%; overflow: hidden; flex-shrink: 0; box-shadow: 0 0 0 3px #fff, 0 0 0 5px rgba(200,16,46,.35); line-height: 0; text-decoration: none; } .jdf-author-box__avatar img, .jdf-author-box__photo { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; } .jdf-author-box__body { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; } .jdf-author-box__kicker { margin: 0 0 2px !important; font: 700 10px/1 var(--data); letter-spacing: .16em; text-transform: uppercase; color: var(--primary); } .jdf-author-box__name, .jdf-article__content .jdf-author-box__name, .jdf-article__content h2.jdf-author-box__name { font: 800 22px/1.15 var(--display) !important; margin: 0 0 4px !important; letter-spacing: -.02em; color: var(--secondary); } .jdf-author-box__name a { color: inherit; text-decoration: none; } .jdf-author-box__name a:hover { color: var(--primary); } .jdf-author-box__role { margin: 0 0 10px; font: 600 13px/1.3 var(--body); color: var(--soft); } .jdf-author-box__bio { margin: 0 0 12px; max-width: 42em; font-size: 14.5px; line-height: 1.5; color: var(--muted); } .jdf-author-box__meta { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--line); width: 100%; font: 600 12px/1 var(--data); color: var(--soft); } .jdf-author-box__count { color: var(--soft); } .jdf-author-box__more { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; padding: 7px 12px; border-radius: 999px; background: var(--primary-soft); color: var(--primary); text-decoration: none; font: 700 12px/1 var(--display); letter-spacing: .01em; } .jdf-author-box__more:hover { background: var(--primary); color: #fff; text-decoration: none; } .jdf-article-tags { margin: 28px 0 8px; padding-top: 20px; border-top: 1px solid var(--line); } .jdf-article-tags h2 { font: 700 12px var(--display); text-transform: uppercase; letter-spacing: .06em; color: var(--soft); margin: 0 0 12px; } .jdf-article-tags__list { display: flex; flex-wrap: wrap; gap: 8px; } .jdf-article-tags__item { font: 600 12px var(--body); padding: 6px 12px; border-radius: 6px; border: 1px solid var(--line); background: var(--surface-2); color: var(--muted); text-decoration: none; } .jdf-article-tags__item:hover { border-color: var(--primary); background: var(--primary-soft); color: var(--primary); } /* Continuar lendo */ .jdf-continue{position:relative;margin:1.25em 0 0} .jdf-continue__body{ max-height:10.5rem;overflow:hidden; -webkit-mask-image:linear-gradient(to bottom,#000 28%,transparent 100%); mask-image:linear-gradient(to bottom,#000 28%,transparent 100%); transition:max-height .45s ease } .jdf-continue__btn{ position:absolute;left:50%;bottom:.15rem;transform:translateX(-50%); z-index:2;display:inline-flex;align-items:center;justify-content:center;gap:6px; min-height:44px;padding:10px 22px;width:auto;max-width:calc(100% - 24px); border:0;border-radius:999px;background:var(--primary);color:#fff; font:700 14px var(--display);cursor:pointer;box-shadow:0 4px 14px rgba(200,16,46,.28); transition:opacity .25s ease,background .2s ease,filter .2s ease } .jdf-continue__btn:hover{background:var(--primary-dark,#a50e28);color:#fff;filter:brightness(1.05)} .jdf-continue[data-expanded="true"] .jdf-continue__body{ max-height:none;overflow:visible; -webkit-mask-image:none;mask-image:none } .jdf-continue[data-expanded="true"] .jdf-continue__btn{display:none;opacity:0;pointer-events:none} .masthead.is-search-open .jdf-search{display:flex;order:3;flex-basis:100%;max-width:none} @media (max-width: 860px) { .jdf-article { padding: 18px 16px 28px; } } .jdf-related { margin-top: 0; } .jdf-related__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); overflow: hidden; } .jdf-related__item { border-bottom: 1px solid var(--line); } .jdf-related__item:last-child { border-bottom: 0; } .jdf-related__link { display: grid; grid-template-columns: 96px minmax(0,1fr); gap: 12px; padding: 12px 14px; text-decoration: none; color: inherit; align-items: center; } .jdf-related__link:hover { background: var(--surface-2); } .jdf-related__ph { width: 96px; height: 72px; border-radius: 2px; overflow: hidden; background: var(--line); display: block; } .jdf-related__ph img { width: 100%; height: 100%; object-fit: cover; display: block; } .jdf-related__ph--empty { display: flex; align-items: center; justify-content: center; color: var(--soft); } .jdf-related__body { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; } .jdf-related__title { font: 700 15px/1.3 var(--display); color: var(--secondary); } .jdf-related__link:hover .jdf-related__title { color: var(--primary); } .jdf-related__time { font: 500 11px var(--data); color: var(--soft); } /* Mobile rail */ .jdf-mrail { display: none; } .jdf-mrail-tail { display: none; } .hidden { display: none !important; } /* Archive filters */ .jdf-archive-filters { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; margin-bottom: 20px; padding: 16px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-sm); } .jdf-archive-filters label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 600; } .jdf-archive-filters select, .jdf-archive-filters input[type="date"] { min-height: 36px; padding: 4px 8px; } /* Mega menu */ .nav .mega-menu-container { flex: 1; min-width: 0; } .nav .main-menu { display: flex; flex-wrap: wrap; align-items: center; gap: 0; list-style: none; margin: 0; padding: 0; } .nav .mega-menu-item { position: relative; } .nav .mega-menu-item:has(.mega-index) { position: static; } .nav .mega-menu-link { display: flex; align-items: center; gap: 5px; color: #fff; font: 600 14px var(--display); letter-spacing: .01em; padding: 0 13px; height: 48px; text-decoration: none; text-transform: uppercase; } .nav .mega-menu-link:hover { background: var(--primary-dark); color: #fff; } .nav .mega-menu-arrow { width: 1rem; height: 1rem; } .mega-menu-dropdown { position: absolute; left: 0; top: 100%; background: #fff; box-shadow: 0 8px 24px rgba(0,0,0,.15); border-radius: 0 0 8px 8px; margin-top: 0; padding: 1.5rem; width: 100vw; max-width: 900px; z-index: 50; color: #1f2937; } .mega-menu-dropdown::before { content: ""; position: absolute; left: 0; right: 0; top: -10px; height: 10px; } .mega-menu-dropdown-large { max-width: 1100px; } .nav .mega-menu-dropdown a, .nav .mega-menu-dropdown .mega-menu-link-item, .nav .mega-menu-dropdown .mega-menu-category-link, .nav .mega-menu-dropdown .mega-menu-popular-title { color: #1f2937 !important; height: auto; min-height: 0; padding: 6px 0; font: 500 14px var(--body); background: transparent !important; text-transform: none; letter-spacing: 0; } .nav .mega-menu-dropdown a:hover, .nav .mega-menu-dropdown .mega-menu-link-item:hover, .nav .mega-menu-dropdown .mega-menu-category-link:hover, .nav .mega-menu-dropdown .mega-menu-popular-title:hover { color: var(--primary) !important; background: transparent !important; } .nav .mega-menu-dropdown .mega-menu-section-title { color: var(--primary); } @media (min-width: 1024px) { .mega-menu-item:hover .mega-menu-dropdown, .mega-menu-item:hover .mega-menu-dropdown.hidden { display: flex !important; flex-direction: column; } } .mega-menu-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; } .mega-menu-grid-large { display: grid; grid-template-columns: 2fr 1fr; gap: 1.5rem; } .mega-menu-dropdown-large { display: flex; flex-direction: column; height: auto; max-height: min(82vh, 760px); max-width: 960px; padding: 0; overflow: hidden; } .mega-menu-section-title { font-size: 1rem; font-weight: 700; color: var(--primary); margin: 0 0 12px; } .mega-menu-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 4px; } .mega-menu-link-item, .mega-menu-category-link { color: #374151; text-decoration: none; font-size: 14px; display: block; padding: 4px 0; } .mega-menu-link-item:hover, .mega-menu-category-link:hover { color: var(--primary); } .mega-menu-categories-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px 16px; align-content: start; flex: 1; min-height: 0; overflow: auto; max-height: none; } .mega-menu-cat-group { display: flex; flex-direction: column; gap: 2px; padding-bottom: 8px; } .mega-menu-category-link--parent { font-weight: 700; color: var(--secondary); } .mega-menu-category-link--child { padding-left: 12px; font-size: 13px; color: var(--muted); } .mega-menu-popular-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; } .mega-menu-popular-item { display: flex; gap: 10px; align-items: flex-start; } .mega-menu-popular-image { flex-shrink: 0; width: 64px; height: 64px; overflow: hidden; border-radius: 4px; } .mega-menu-thumb, .colcard .av img { width: 100%; height: 100%; object-fit: cover; display: block; } .mega-menu-popular-title { font-size: 14px; font-weight: 600; color: #1a1a1a; text-decoration: none; line-height: 1.35; } .mega-menu-popular-title:hover { color: var(--primary); } .mega-menu-no-posts { font-size: 14px; color: var(--soft); margin: 0; } .nav .mega-index.mega-menu-dropdown-large { left: 0; right: 0; width: auto; max-width: none; } .mega-index__mast { flex: 0 0 auto; padding: 16px 22px 12px; border-bottom: 1px solid var(--secondary); } .mega-index__kicker { font: 700 10px var(--data); letter-spacing: .22em; text-transform: uppercase; color: var(--primary); margin: 0; } .mega-index__lede { font: 800 22px/.95 var(--display); letter-spacing: -.03em; margin: 4px 0 0; } .mega-index__body { display: grid; grid-template-columns: minmax(0,1fr) 250px; flex: 1 1 auto; min-height: 0; overflow: hidden; } .mega-index__cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 24px; align-content: start; padding: 14px 22px 18px; min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; scrollbar-width: thin; } .mega-index__entry { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid rgba(31,39,51,.14); } .nav .mega-index .mega-index__parent { font: 800 12px/1.25 var(--display) !important; letter-spacing: .06em; text-transform: uppercase; color: var(--secondary) !important; padding: 0 !important; } .mega-index__kids { margin: 3px 0 0; font: 400 12.5px/1.4 var(--display); color: var(--muted); } .nav .mega-index .mega-index__kids a { font: inherit !important; color: var(--muted) !important; padding: 0 !important; display: inline !important; } .nav .mega-index .mega-index__kids a:hover { color: var(--primary) !important; } .mega-index__rail { border-left: 1px solid var(--secondary); padding: 14px 16px 18px; background: #fff; min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; } .mega-index__rail-kicker { font: 700 10px var(--data); letter-spacing: .18em; text-transform: uppercase; color: var(--primary); margin: 0 0 10px; } .mega-index__hits { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; } .mega-index__hits li { display: grid; grid-template-columns: 1.6rem 1fr; gap: 8px; align-items: start; } .mega-index__num { font: 800 22px/.9 var(--display); color: var(--primary); } .nav .mega-index .mega-index__hits a { font: 700 13.5px/1.3 var(--display) !important; color: var(--secondary) !important; padding: 0 !important; } .nav .mega-index .mega-index__hits a:hover { color: var(--primary) !important; } .obit-item { display: flex; flex-direction: column; gap: 2px; } .obit-item b { font: 700 13.5px var(--display); } .obit-item small { display: block; color: var(--muted); font: 500 11.5px/1.35 var(--body); } .obit-fonte { font: 500 10px var(--data) !important; letter-spacing: .1em; text-transform: uppercase; color: var(--soft) !important; } .obit-page { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0; } .obit-card { padding: 20px 0; border-bottom: 1px solid var(--line); } .obit-card:last-child { border-bottom: 0; } .obit-card__name { font: 800 26px/1.15 var(--display); letter-spacing: -.02em; margin: 0 0 12px; color: var(--secondary); } .obit-card__meta { margin: 0; display: flex; flex-direction: column; gap: 10px; } .obit-card__meta div { margin: 0; } .obit-card__meta dt { font: 700 10px var(--data); letter-spacing: .14em; text-transform: uppercase; color: var(--primary); margin: 0 0 2px; } .obit-card__meta dd { margin: 0; font: 500 15px/1.45 var(--display); color: var(--text); } .obit-card__meta dd span { display: block; } .obit-card__fonte { margin: 14px 0 0; font: 500 10px var(--data); letter-spacing: .14em; text-transform: uppercase; color: var(--soft); } /* ============================ OFFCANVAS + DOCK + SHEET ============================ */ .jdf-offcanvas__week { padding: 14px 18px 8px; border-bottom: 2px solid var(--primary); } .jdf-offcanvas__week-kicker { font: 700 10px var(--data); letter-spacing: .16em; text-transform: uppercase; color: var(--primary); margin: 0 0 8px; } .jdf-offcanvas__week ol { list-style: none; margin: 0; padding: 0; counter-reset: w; } .jdf-offcanvas__week li { counter-increment: w; margin: 0 0 6px; } .jdf-offcanvas__week a { font: 800 16px/1.2 var(--display); color: var(--secondary); } .jdf-offcanvas__week a::before { content: counter(w) "."; color: var(--primary); margin-right: 8px; font-size: 13px; } body.jdf-offcanvas-open, body.jdf-sheet-open { overflow: hidden; } .jdf-offcanvas-overlay, .jdf-sheet-overlay { position: fixed; inset: 0; background: rgba(15,18,24,.55); z-index: 120; border: 0; } .jdf-offcanvas-overlay[hidden], .jdf-offcanvas[hidden], .jdf-sheet-overlay[hidden], .jdf-sheet[hidden], .jdf-dock { display: none !important; } .jdf-offcanvas { position: fixed; top: 0; left: 0; bottom: 0; width: min(100%, 360px); background: #fff; z-index: 130; display: flex; flex-direction: column; box-shadow: 8px 0 32px rgba(0,0,0,.18); color: var(--text); } .jdf-offcanvas__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--line); background: var(--secondary); color: #fff; position: sticky; top: 0; z-index: 2; } .jdf-offcanvas__head h2 { font: 800 15px/1 var(--display); letter-spacing: .06em; text-transform: uppercase; margin: 0; } .jdf-offcanvas__close { display: inline-flex; align-items: center; gap: 6px; min-height: var(--touch); min-width: var(--touch); padding: 0 12px; border: 1px solid rgba(255,255,255,.25); border-radius: 2px; background: transparent; color: #fff; font: 700 12px/1 var(--display); letter-spacing: .04em; text-transform: uppercase; cursor: pointer; } .jdf-offcanvas__close .i { width: 16px; height: 16px; } .jdf-offcanvas__scroll { overflow: auto; -webkit-overflow-scrolling: touch; flex: 1; padding-bottom: 28px; } .jdf-offcanvas__sec { padding: 18px 18px 8px; border-bottom: 1px solid var(--line); } .jdf-offcanvas__kicker { margin: 0 0 12px; font: 700 10px/1 var(--display); letter-spacing: .16em; text-transform: uppercase; color: var(--primary); } .jdf-offcanvas__cta { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; margin: 0 0 10px; padding: 0 14px; border-radius: 2px; font: 700 13px/1 var(--display); letter-spacing: .02em; text-decoration: none; } .jdf-offcanvas__cta--assine { background: var(--primary); color: #fff; } .jdf-offcanvas__cta--zap { background: #25d366; color: #fff; } .jdf-offcanvas__cta--utils { width: 100%; background: var(--surface-2); color: var(--secondary); border: 1px solid var(--line); cursor: pointer; } .jdf-offcanvas__cta .i { width: 18px; height: 18px; } .jdf-offcanvas__links { list-style: none; margin: 0; padding: 0; } .jdf-offcanvas__links a { display: flex; align-items: center; min-height: var(--touch); padding: 4px 0; font: 600 15px/1.2 var(--display); color: var(--secondary); text-decoration: none; border-bottom: 1px solid var(--line); } .jdf-offcanvas__links li:last-child a { border-bottom: 0; } .jdf-offcanvas__links a:hover { color: var(--primary); } .jdf-offcanvas__socials { display: flex; gap: 10px; flex-wrap: wrap; } .jdf-offcanvas__socials a { width: var(--touch); height: var(--touch); display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--line); border-radius: 2px; color: var(--secondary); } .jdf-offcanvas__socials a:hover { background: var(--primary); border-color: var(--primary); color: #fff; } .jdf-offcanvas__socials .i { width: 18px; height: 18px; } .jdf-offcanvas__week-list { list-style: none; margin: 0; padding: 0; counter-reset: w; } .jdf-offcanvas__week-list li { counter-increment: w; } .jdf-offcanvas__week-list a { display: flex; align-items: center; gap: 10px; min-height: var(--touch); font: 700 15px/1.2 var(--display); color: var(--secondary); text-decoration: none; } .jdf-offcanvas__week-list a::before { content: counter(w, decimal-leading-zero); color: var(--primary); font: 700 12px/1 var(--data); min-width: 1.6em; } .jdf-offcanvas__sec--editorias { border-bottom: 0; padding-bottom: 24px; } .jdf-offcanvas__group { padding: 4px 0 10px; border-bottom: 1px solid var(--line); } .jdf-offcanvas__group:last-child { border-bottom: 0; } .jdf-offcanvas__parent { display: flex; align-items: center; min-height: var(--touch); font: 700 15px var(--display); color: var(--secondary); text-decoration: none; } .jdf-offcanvas__parent:hover { color: var(--primary); } .jdf-offcanvas__children { list-style: none; margin: 0; padding: 0 0 0 12px; } .jdf-offcanvas__children a { display: flex; align-items: center; min-height: var(--touch); padding: 0; font-size: 14px; color: var(--muted); text-decoration: none; } .jdf-offcanvas__children a:hover { color: var(--primary); } /* Dock */ .jdf-dock { position: fixed; left: 0; right: 0; bottom: 0; z-index: 100; display: none; grid-template-columns: repeat(4, 1fr); gap: 0; background: var(--secondary); border-top: 2px solid var(--primary); padding: 4px 0 max(4px, env(safe-area-inset-bottom)); box-shadow: 0 -6px 24px rgba(0,0,0,.18); } .jdf-dock__btn { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 52px; border: 0; background: transparent; color: #c5ccd6; cursor: pointer; font: 700 10px/1 var(--display); letter-spacing: .06em; text-transform: uppercase; text-decoration: none; } .jdf-dock__btn .i { width: 20px; height: 20px; } .jdf-dock__btn[aria-expanded="true"], .jdf-dock__btn:active, .jdf-dock__btn:hover { color: #fff; } /* Sheet */ .jdf-sheet { position: fixed; left: 0; right: 0; bottom: 0; z-index: 125; max-height: 85vh; background: #fff; border-radius: 14px 14px 0 0; display: flex; flex-direction: column; box-shadow: 0 -12px 40px rgba(0,0,0,.22); padding-bottom: max(12px, env(safe-area-inset-bottom)); } .jdf-sheet__handle { width: 40px; height: 4px; border-radius: 99px; background: var(--line-strong); margin: 10px auto 0; } .jdf-sheet__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px 10px; border-bottom: 1px solid var(--line); } .jdf-sheet__head h2 { margin: 0; font: 800 16px/1 var(--display); letter-spacing: -.01em; } .jdf-sheet__close { display: inline-flex; align-items: center; gap: 6px; min-height: var(--touch); min-width: var(--touch); padding: 0 12px; border: 1px solid var(--line); border-radius: 2px; background: #fff; font: 700 11px/1 var(--display); letter-spacing: .04em; text-transform: uppercase; cursor: pointer; color: var(--muted); } .jdf-sheet__body { overflow: auto; -webkit-overflow-scrolling: touch; padding: 12px 14px 24px; display: flex; flex-direction: column; gap: 14px; } .jdf-sheet__body .widget { margin: 0; } @media (max-width: 860px) { /* Topbar — data + clima diagramados */ .topbar-actions { display: none !important; } .topbar { border-bottom: 1px solid rgba(255,255,255,.06); } .topbar .wrap { justify-content: center; min-height: 44px; padding: 8px 16px; } .topbar-info { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: nowrap; } .topbar-date--full { display: none !important; } .topbar-date--short { display: inline-flex !important; align-items: baseline; gap: 6px; color: #fff; } .topbar-date__day { font: 800 18px/1 var(--display); letter-spacing: -.02em; } .topbar-date__mon { font: 700 11px/1 var(--data); letter-spacing: .14em; text-transform: uppercase; color: #aeb6c2; } .topbar-info__rule { display: none; } .topbar-clima, .topbar .clima { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; padding: 5px 12px 5px 8px; border-radius: 999px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.1); } .topbar-clima__icon { font-size: 15px; line-height: 1; } .topbar-clima__meta { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; line-height: 1.1; } .topbar-clima__place { font: 600 9px/1 var(--data); letter-spacing: .1em; text-transform: uppercase; color: #aeb6c2; } .topbar-clima__temp { font: 800 14px/1 var(--display); color: #fff; letter-spacing: -.02em; } /* Masthead — logo centralizado */ .masthead { min-height: 0; } .masthead .wrap { padding: 14px 16px 12px; justify-content: center; } .masthead .logo { margin: 0 auto !important; align-items: center; max-width: 200px; text-align: center; } .masthead .logo img, .masthead .jdf-logo-img { max-height: 48px; margin-left: auto; margin-right: auto; } .sb { display: none !important; } .jdf-dock { display: grid !important; } .ad-band--mobile-top { display: flex; margin: 10px auto; } .ad-bleed { margin: 0; padding: 14px 16px; min-height: 128px; } .ad-bleed--primary, .ad-bleed--muted { margin-top: 24px; } .ad-bleed + .wrap > .grid { margin-top: 24px; } .ad-bleed--muted + .strip { margin-top: 24px; } .ad-bleed .ad-slot { min-height: 100px !important; } .ad-slot--placeholder, .ad-slot--reserve { width: var(--ad-mw) !important; height: var(--ad-mh) !important; min-height: var(--ad-mh) !important; } .jdf-nav-search__submit { width: var(--touch); height: var(--touch); min-width: var(--touch); } .pagination a, .pagination span { min-width: var(--touch); min-height: var(--touch); display: inline-flex; align-items: center; justify-content: center; } .jdf-share--compact .jdf-share__btn { width: var(--touch); height: var(--touch); min-width: var(--touch); } .jdf-tts__btn { min-height: var(--touch); } .jdf-tts__btn--play { width: var(--touch); height: var(--touch); } .jdf-continue__btn { width: auto; min-height: 44px; } .page-content { padding: 18px 16px 28px; } .ed-mast__title { font-size: clamp(36px, 10vw, 52px) !important; max-width: none; } .ed-mast--assunto .ed-mast__title { font-size: clamp(32px, 9vw, 44px) !important; } .ed-mast--assunto::before { font-size: 120px; top: -16px; right: 4%; } .ed-mast__count { font-size: clamp(28px, 8vw, 40px) !important; } .ed-archive__body { padding-top: 18px; } .ed-lead__link { grid-template-columns: 1fr; min-height: 0; } .ed-lead__ph { min-height: 0; max-height: 200px; aspect-ratio: 16/9; } .ed-lead__ph img { width: 100%; height: 100%; object-fit: cover; } .ed-lead__body { border-left: 0; border-top: 3px solid var(--primary); padding: 14px 2px 6px; } .ed-lead__title { font-size: clamp(22px, 6vw, 28px) !important; line-height: 1.2; } .ed-lead__dek { font-size: 14px; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; } .ed-feed__cards { grid-template-columns: 1fr; } .ed-row__link { grid-template-columns: 96px minmax(0,1fr); gap: 12px; } .ed-row__ph { width: 96px; height: 72px; } .navigation.pagination .page-numbers { min-width: var(--touch); min-height: var(--touch); height: auto; } /* Plantão — sem scroll manual */ .plantao { min-height: 40px; height: 40px; } .plantao .wrap { height: 40px; overflow: hidden; } .plantao__viewport { overflow: hidden; } .colcards, .vids { grid-template-columns: 1fr !important; } .anchor { bottom: calc(56px + env(safe-area-inset-bottom)); } .anchor__close { min-width: var(--touch); min-height: var(--touch); display: inline-flex; align-items: center; justify-content: center; border: 0; background: transparent; color: var(--soft); font-size: 16px; cursor: pointer; } body { padding-bottom: var(--jdf-chrome-bottom, 56px); } /* Feed mobile — cards em linha (thumb + texto), hero contido */ main.wrap, main.jdf-home > .wrap { padding-top: 12px; } .hero { gap: 14px; margin-top: 8px; } .lead > a { display: block; } .lead .ph { width: 100%; height: 180px; max-height: 180px; aspect-ratio: auto; overflow: hidden; } .lead .ph img { width: 100%; height: 100%; object-fit: cover; } .lead .body { padding: 14px 14px 16px; } .lead h1 { font-size: clamp(20px, 5.4vw, 24px) !important; line-height: 1.18; margin: 6px 0 0; } .lead p { font-size: 13.5px; line-height: 1.35; margin-top: 5px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .lead .meta { font-size: 11px; margin-top: 8px; } .hero-quad { gap: 10px; } .hero-quad .card > a, .cards .card > a, .content .card > a, .grid .card > a { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 0 12px; align-items: stretch; } .hero-quad .card .ph, .cards .card .ph, .content .card .ph, .grid .card .ph { aspect-ratio: 4 / 3; height: 78px; max-height: 78px; width: 104px; flex: none; overflow: hidden; } .hero-quad .card .ph img, .cards .card .ph img, .content .card .ph img, .grid .card .ph img { width: 100%; height: 100%; object-fit: cover; } .hero-quad .card .c-body, .cards .card .c-body, .content .card .c-body, .grid .card .c-body { padding: 2px 4px 2px 0; display: flex; flex-direction: column; justify-content: center; min-width: 0; } .hero-quad .card h3, .cards .card h3, .content .card h3, .grid .card h3 { font-size: 14.5px; line-height: 1.25; margin: 4px 0 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .hero-quad .card p, .cards .card p, .content .card p { display: none !important; } .hero-quad .card .cmeta, .cards .card .cmeta, .content .card .cmeta { margin-top: 6px; } .hero-quad .card .tag, .cards .card .tag, .content .card .tag { font-size: 10px; padding: 2px 6px; } .mini > a { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 10px; align-items: center; } .mini .ph { width: 88px; height: 66px; aspect-ratio: auto; max-height: 66px; } .mini h3 { font-size: 14px; line-height: 1.25; } .feature { gap: 12px; } .feature .ph { min-height: 0 !important; aspect-ratio: 16/9; max-height: 200px; } .jdf-article__photo { max-height: 240px; } .jdf-article__figure { max-height: none; margin-bottom: 24px; } .jdf-article__photo img { width: 100%; height: 100%; object-fit: cover; } .jdf-article__title { font-size: clamp(24px, 7vw, 32px) !important; } .jdf-about__plate { margin: 1.4em 0 1.6em; width: 100%; max-width: 100%; border-radius: 2px; overflow: hidden; } .jdf-about__plate img { display: block; width: 100%; height: auto; max-width: 100%; } } @media (min-width: 861px) { .jdf-offcanvas, .jdf-offcanvas-overlay, .jdf-sheet, .jdf-sheet-overlay, .jdf-dock, .jdf-dock-search, .jdf-search-backdrop { display: none !important; } .ad-band--mobile-top, .ad-slot--mobile-top, .ad-slot--mobile-anchor, .ad-slot--mobile-sheet, .jdf-mrail-ad { display: none !important; } .topbar-date--short { display: none; } .topbar-date--full { display: inline; } } /* Página institucional */ .jdf-about { background: #fff; padding-bottom: 56px; } .jdf-about__hero { border-bottom: 1px solid var(--line); background: linear-gradient(180deg, rgba(200,16,46,.06), transparent 72%), repeating-linear-gradient(0deg, transparent, transparent 27px, rgba(31,39,51,.035) 27px, rgba(31,39,51,.035) 28px); padding: 40px 0 32px; } .jdf-about__kicker { font: 700 12px var(--data); letter-spacing: .16em; text-transform: uppercase; color: var(--primary); margin: 0 0 8px; } .jdf-about__title { font: 800 clamp(36px, 6vw, 64px)/1.05 var(--display); letter-spacing: -.03em; color: var(--secondary); margin: 0; } .jdf-about__dek { font: 500 22px/1.35 var(--display); color: var(--primary); margin: 14px 0 0; max-width: 28ch; } .jdf-about__plate { margin: 1.5em 0 1.75em; width: 100%; max-width: 100%; border-radius: 2px; overflow: hidden; border: 1px solid var(--line); } .jdf-about__plate img { display: block; width: 100%; height: auto; max-width: 100%; } .jdf-about__grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 40px; padding: 36px 16px 0; align-items: start; } .jdf-about__story { max-width: 65ch; } .jdf-about__p { font-size: 17.5px; line-height: 1.7; color: var(--text); margin: 0 0 1.1em; } .jdf-about__p--lead::first-letter { float: left; font: 800 4.4rem/0.8 var(--display); color: var(--primary); padding-right: 10px; padding-top: 6px; } .jdf-about__quote { margin: 28px 0; padding: 8px 0 8px 18px; border-left: 3px solid var(--primary); } .jdf-about__quote p { font: 700 26px/1.25 var(--display); color: var(--secondary); letter-spacing: -.02em; } .jdf-about__close { margin: 32px 0 0; font: 500 20px/1.4 var(--display); color: var(--secondary); } .jdf-about__close span { display: block; } .jdf-about__close strong { display: block; margin-top: 6px; color: var(--primary); font-weight: 800; } .jdf-about__card { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 22px 20px; position: sticky; top: 64px; } .jdf-about__card-kicker { font: 700 11px var(--data); letter-spacing: .14em; text-transform: uppercase; color: var(--primary); margin: 0 0 6px; } .jdf-about__card h2 { font: 800 22px/1.2 var(--display); margin: 0 0 10px; } .jdf-about__card-legal { font-size: 13px; color: var(--muted); margin: 0 0 12px; } .jdf-about__card address { font-style: normal; font-size: 14px; line-height: 1.5; margin: 0 0 12px; } .jdf-about__card address a { color: var(--primary); font-weight: 600; } .jdf-about__wa { display: inline-flex; align-items: center; gap: 8px; margin-top: 8px; background: #128C7E; color: #fff; font: 700 14px var(--display); padding: 10px 14px; border-radius: 4px; } .jdf-about__wa:hover { background: #0e6e63; color: #fff; } .jdf-about__wa .i { width: 16px; height: 16px; } .jdf-about__equipe { padding-top: 8px; } @media (max-width: 860px) { .jdf-about__grid { grid-template-columns: 1fr; gap: 24px; } .jdf-about__card { position: static; } .jdf-about__title { font-size: 40px; } .jdf-about__dek { font-size: 18px; } } .jdf-about__dek { max-width: 42ch; } .jdf-about__sec { margin: 0 0 32px; padding-top: 20px; border-top: 1px solid var(--line); } .jdf-about__sec:first-child { border-top: 0; padding-top: 0; } .jdf-about__num { font: 700 11px var(--data); letter-spacing: .16em; color: var(--primary); margin: 0 0 6px; } .jdf-about__sec-title { font: 800 26px/1.2 var(--display); letter-spacing: -.02em; color: var(--secondary); margin: 0 0 12px; } .jdf-about__list { margin: 0 0 1em; padding-left: 1.15em; } .jdf-about__list li { margin: 0 0 .45em; font-size: 17.5px; line-height: 1.65; color: var(--text); } .jdf-about__toc { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--line); } .jdf-about__toc ol { list-style: none; margin: 0; padding: 0; } .jdf-about__toc li { margin: 0 0 8px; } .jdf-about__toc a { font-size: 13.5px; line-height: 1.35; color: var(--secondary); text-decoration: none; font-weight: 600; } .jdf-about__toc a:hover { color: var(--primary); } .jdf-about__cta { margin: 16px 0 0; } /* ========== 1.9.7 mobile craft overrides ========== */ .jdf-mrail { display: none; margin: 18px 0; } .jdf-mrail .widget { margin: 0; } @media (max-width: 860px) { .jdf-mrail { display: block; } .jdf-mrail-tail:not(:has(.jdf-mrail)) { display: none; } /* Topbar slim + full date + rich weather */ .topbar { border-bottom: 1px solid rgba(255,255,255,.06); } .topbar .wrap { min-height: 30px !important; height: auto !important; padding: 5px 14px !important; justify-content: space-between; } .topbar-info { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: nowrap; } .topbar-date--full { display: none !important; } .topbar-date--short { display: inline !important; font: 500 11px/1.2 var(--body) !important; color: #c5ccd6 !important; letter-spacing: .01em; text-transform: none !important; white-space: nowrap; } .topbar-date__day, .topbar-date__mon { display: none !important; } .topbar-clima { display: inline-flex !important; align-items: center; gap: 5px; margin: 0; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; font: 500 11px/1.2 var(--data); color: #c5ccd6; white-space: nowrap; } .topbar-clima__icon { font-size: 12px; line-height: 1; } .topbar-clima__temp { font: 700 12px/1 var(--display); color: #fff; } .topbar-clima__range { color: #9aa3b2; font-size: 10px; } .topbar-clima__hum { color: #9aa3b2; font-size: 10px; } .topbar-clima__hum::before { content: "· "; } .topbar-clima__place { color: #aeb6c2; font-size: 10px; text-transform: none; letter-spacing: 0; } .topbar-clima__place::before { content: "· "; color: #6f7885; } .topbar-clima__meta { display: contents; } /* Lead — full-bleed photo, padded text */ .lead { overflow: hidden; } .lead > a { display: block; } .lead .ph { width: 100% !important; max-width: 100% !important; height: 180px !important; max-height: 180px !important; aspect-ratio: auto !important; overflow: hidden; } .lead .ph img { width: 100%; height: 100%; object-fit: cover; display: block; } .lead .body { padding: 14px 14px 16px !important; } .lead h1 { font-size: clamp(20px, 5.5vw, 24px) !important; line-height: 1.2; margin: 8px 0 6px; } .lead p { font-size: 13.5px; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; } .lead .tag { margin-bottom: 2px; } .hero-quad { gap: 0; } .hero-quad .cards { display: flex !important; flex-direction: column !important; gap: 0 !important; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 0 12px; overflow: hidden; } .hero-quad .cards .card { border: 0 !important; border-radius: 0 !important; border-bottom: 1px solid var(--line) !important; background: transparent !important; box-shadow: none !important; } .hero-quad .cards .card:last-child { border-bottom: 0 !important; } .hero-quad .hero-fill-ad { margin: 12px 0 !important; padding: 4px 0; } .cards:not(.two) { display: flex !important; flex-direction: column !important; gap: 0 !important; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 0 12px; overflow: hidden; } .cards:not(.two) .card { border: 0 !important; border-radius: 0 !important; border-bottom: 1px solid var(--line) !important; background: transparent !important; box-shadow: none !important; transform: none !important; } .cards:not(.two) .card:last-child { border-bottom: 0 !important; } .cards:not(.two) .card:hover { border-color: transparent !important; transform: none !important; } /* Cards: horizontal list style — except .cards.two */ .hero-quad .card > a, .cards:not(.two) .card > a, .ed-feed__cards .card > a, .content .cards:not(.two) .card > a { display: grid !important; grid-template-columns: 104px minmax(0,1fr) !important; gap: 0 12px !important; align-items: stretch; height: auto !important; } .hero-quad .card .ph, .cards:not(.two) .card .ph, .ed-feed__cards .card .ph { width: 104px !important; height: 78px !important; max-height: 78px !important; aspect-ratio: 4/3 !important; overflow: hidden; } .hero-quad .card .c-body, .cards:not(.two) .card .c-body, .ed-feed__cards .card .c-body { padding: 10px 4px 10px 0 !important; display: flex; flex-direction: column; align-items: flex-start !important; justify-content: center; min-width: 0; } .hero-quad .card h3, .cards:not(.two) .card h3, .ed-feed__cards .card h3 { font-size: 14.5px; line-height: 1.25; margin: 4px 0 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .cards:not(.two) .card p, .hero-quad .card p { display: none !important; } /* Segurança / Saúde — 2 colunas, foto em cima */ .cards.two { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px !important; } .cards.two .card > a { display: flex !important; flex-direction: column !important; grid-template-columns: none !important; height: 100% !important; } .cards.two .card .ph { width: 100% !important; height: auto !important; max-height: none !important; aspect-ratio: 16/9 !important; } .cards.two .card .c-body { padding: 8px 8px 10px !important; align-items: flex-start !important; } .cards.two .card h3 { font-size: 13px !important; -webkit-line-clamp: 3; } .cards.two .card p { display: none !important; } /* Listblock — no overflow, tags shrink */ .listblock { overflow: hidden; max-width: 100%; } .listblock li { min-width: 0; } .listblock li > div { min-width: 0; } .listblock .tag { display: inline-flex !important; width: auto !important; } .listblock h3 { overflow-wrap: anywhere; } .agora { overflow: hidden; max-width: 100%; } .agora li { min-width: 0; } .agora a { overflow-wrap: anywhere; } /* Tags never stretch */ .card .tag, .ed-row .tag, .ed-lead .tag, .listblock .tag, .mini .tag { display: inline-flex !important; width: auto !important; max-width: max-content !important; align-self: flex-start !important; } /* Continue — never full width */ .jdf-continue__btn { width: auto !important; min-width: 160px; max-width: calc(100% - 32px); } /* Ad equal margins */ .ad-band, .ad-band--after-hero, .ad-band--listing, .section-gap.ad-band, .hero-fill-ad, .jdf-ad-break, .jdf-mrail-ad { margin-top: 16px !important; margin-bottom: 16px !important; } .jdf-ad-break--related { margin-top: 24px !important; margin-bottom: 28px !important; padding: 16px 12px 18px; } /* Article meta rhythm */ .jdf-article__meta { gap: 12px 16px; margin-bottom: 18px; } .jdf-article__header .jdf-share--compact { margin-top: 6px; padding-top: 16px; } .jdf-author-box { grid-template-columns: 64px minmax(0,1fr); gap: 0 12px; padding: 16px 14px 16px 12px; margin: 20px 0 6px; } .jdf-author-box__avatar { width: 64px; height: 64px; box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(200,16,46,.35); } .jdf-author-box__body { min-height: 0; } .jdf-author-box__kicker { margin: 0 0 1px !important; } .jdf-author-box__name, .jdf-article__content .jdf-author-box__name, .jdf-article__content h2.jdf-author-box__name { font-size: 17px !important; margin: 0 0 2px !important; line-height: 1.2 !important; } .jdf-author-box__role { margin: 0 !important; font-size: 12.5px; } .jdf-author-box__bio { margin: 8px 0 0; font-size: 13.5px; } .jdf-author-box__meta { gap: 8px 10px; padding-top: 10px; margin-top: 10px; } .jdf-author-box__more { margin-left: 0; padding: 6px 10px; font-size: 11.5px; } .jdf-author-box__count { width: 100%; } /* List cards — foto centralizada */ .listblock li, .hero-quad .card > a, .cards:not(.two) .card > a, .ed-feed__cards .card > a { align-items: center !important; } .listblock .thumb, .listblock .ph, .hero-quad .card .ph, .cards:not(.two) .card .ph, .ed-feed__cards .card .ph { display: flex !important; align-items: center; justify-content: center; overflow: hidden; } .listblock .thumb img, .listblock .ph img, .hero-quad .card .ph img, .cards:not(.two) .card .ph img, .ed-feed__cards .card .ph img, .jdf-related .listblock .ph img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } /* Leia também — padding menor */ .jdf-leia-tambem { margin: 0.85rem 0; padding: 0; border: 0; background: transparent; } .jdf-leia-tambem__label { margin: 0 0 6px; padding: 0 2px; font-size: 10.5px; } .jdf-leia-tambem .listblock { padding: 2px 10px !important; } .jdf-leia-tambem .listblock li { padding: 8px 0 !important; gap: 10px; } .jdf-leia-tambem .listblock .thumb { flex-basis: 72px; width: 72px; } /* Footer newsletter — sem flex-basis virando altura */ .foot-band__inner { padding: 14px 16px 10px !important; gap: 10px !important; } .foot-band { border-bottom: 0; } .foot-edits { margin-top: 0; padding-top: 0; } .foot-nl { gap: 8px !important; align-items: stretch !important; } .foot-nl__label { padding-top: 0 !important; } .foot-nl__form { flex: 0 0 auto !important; flex-basis: auto !important; width: 100% !important; max-width: none !important; min-height: 0 !important; height: auto !important; align-items: stretch; } .foot-nl__form input[type="email"] { min-height: 40px !important; height: 40px !important; padding: 0 12px !important; font-size: 14px !important; } .foot-nl__form button { min-height: 40px !important; height: 40px !important; padding: 0 14px !important; } .foot-nl__consent { margin-top: 8px; font-size: 11.5px; line-height: 1.35; } .foot-nl__form .jdf-nl-hp, .foot-nl__form .screen-reader-text { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; border: 0 !important; } .foot-edits .wrap { flex-direction: column; align-items: center !important; text-align: center; } .foot-edits__label { width: 100%; text-align: center; } .foot-edits__list { justify-content: center; flex-wrap: wrap; max-height: none !important; overflow: visible !important; mask-image: none !important; } .foot-meta__inner { flex-direction: column !important; align-items: center !important; justify-content: center !important; text-align: center; gap: 14px !important; } .foot-links { width: 100%; } .foot-links__list { justify-content: center !important; align-items: center; } .foot-social { justify-content: center !important; width: 100%; } .foot-legal { padding: 14px 0 18px !important; } .foot-legal__inner { align-items: center; text-align: center; } .foot-legal p { text-align: center; } /* Prevent page horizontal scroll */ main, .wrap, .hero, .grid, .content, .block, .cards, .listblock, .agora { max-width: 100%; overflow-x: clip; } } @media (max-width: 860px) { .topbar .wrap { min-height: 28px !important; padding: 4px 14px !important; } .topbar-info { gap: 8px; } .topbar-date--short { font-size: 11px !important; } .topbar-clima { flex-wrap: nowrap !important; gap: 4px !important; font-size: 11px !important; } .topbar-clima > * { display: inline !important; } .topbar-clima__icon { display: inline !important; } .topbar-clima__range::before { content: "· "; color: #6f7885; } .topbar-clima__place::before { content: "· "; color: #6f7885; } .topbar-clima__hum { display: none !important; } } .anchor:has(.ad-slot[style*="display: none"]), .anchor:has(.ad-slot[style*="display:none"]), .anchor:not(:has(iframe)) { display: none !important; } @media (max-width: 600px) { .anchor:has(iframe) { display: flex !important; } } /* ============================ MEDIA KIT / ANUNCIE ============================ */ .jdf-mk { background: #fff; color: var(--text); } .jdf-mk__hero { background: radial-gradient(1200px 480px at 10% -10%, rgba(200,16,46,.22), transparent 55%), linear-gradient(165deg, #141a22 0%, #1f2733 48%, #161c26 100%); color: #e8ecf2; padding: 56px 0 48px; border-bottom: 4px solid var(--primary); } .jdf-mk__kicker { margin: 0 0 10px; font: 700 11px/1 var(--data); letter-spacing: .16em; text-transform: uppercase; color: var(--primary); } .jdf-mk__kicker--on-dark { color: #ffb3c0; } .jdf-mk__title { margin: 0; font: 800 clamp(34px, 6vw, 58px)/1.05 var(--display); letter-spacing: -.03em; color: #fff; } .jdf-mk__aeo { margin: 22px 0 0; padding: 16px 18px; border-left: 3px solid var(--primary); background: rgba(255,255,255,.06); font: 500 17px/1.55 var(--body); color: #d7dde6; } .jdf-mk__cta-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; } .jdf-mk__btn { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 18px; border-radius: 2px; font: 700 14px/1 var(--display); text-decoration: none; border: 1px solid transparent; } .jdf-mk__btn--primary { background: var(--primary); color: #fff; } .jdf-mk__btn--primary:hover { background: var(--primary-dark); color: #fff; } .jdf-mk__btn--ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,.35); } .jdf-mk__btn--ghost:hover { border-color: #fff; } .jdf-mk__btn--ghost-light { background: transparent; color: #fff; border-color: rgba(255,255,255,.35); } .jdf-mk__btn--ghost-light:hover { border-color: #fff; color: #fff; } .jdf-mk__proof { list-style: none; margin: 28px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 18px; font: 600 12px/1.2 var(--data); color: #9aa3b2; letter-spacing: .04em; text-transform: uppercase; } .jdf-mk__proof li { position: relative; padding-left: 14px; } .jdf-mk__proof li::before { content: ""; position: absolute; left: 0; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: var(--primary); } .jdf-mk__section { padding: 56px 0; border-bottom: 1px solid var(--line); } .jdf-mk__section--problem { background: var(--surface-2); } .jdf-mk__section--solution { background: #fff; } .jdf-mk__section--audience { background: var(--surface-2); } .jdf-mk__kpis { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; } .jdf-mk__kpi { background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--primary); border-radius: var(--radius-sm); padding: 22px 18px 18px; display: flex; flex-direction: column; gap: 6px; min-height: 120px; } .jdf-mk__kpi-value { font: 800 clamp(28px, 3.5vw, 40px)/1 var(--display); color: var(--secondary); letter-spacing: -.03em; } .jdf-mk__kpi-label { font: 700 14px/1.3 var(--display); color: var(--text); } .jdf-mk__kpi-note { margin-top: auto; font: 600 11px/1.3 var(--data); letter-spacing: .04em; text-transform: uppercase; color: var(--soft); } .jdf-mk__section h2 { font: 800 clamp(26px, 4vw, 36px)/1.15 var(--display); letter-spacing: -.02em; color: var(--secondary); margin: 0 0 14px; } .jdf-mk__section p { margin: 0 0 1em; font-size: 16.5px; line-height: 1.65; color: var(--muted); } .jdf-mk__sec-head { margin-bottom: 28px; } .jdf-mk__lede { margin: 0; font-size: 16px; color: var(--soft); } .jdf-mk__table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius-sm); background: #fff; } .jdf-mk__table { width: 100%; border-collapse: collapse; min-width: 640px; font-size: 14px; } .jdf-mk__table th, .jdf-mk__table td { text-align: left; vertical-align: top; padding: 14px 16px; border-bottom: 1px solid var(--line); } .jdf-mk__table thead th { background: var(--secondary); color: #fff; font: 700 12px/1.2 var(--data); letter-spacing: .06em; text-transform: uppercase; } .jdf-mk__table tbody th { font-weight: 700; color: var(--secondary); width: 18%; } .jdf-mk__table code { font: 600 12px/1 var(--data); color: var(--primary); background: var(--primary-soft); padding: 4px 7px; border-radius: 3px; white-space: nowrap; } .jdf-mk__table tbody tr:last-child th, .jdf-mk__table tbody tr:last-child td { border-bottom: 0; } .jdf-mk__table--compare tbody th { width: 22%; } /* Wireframe tabs (media kit) */ .jdf-mk-tabs { margin: 0; } .jdf-mk-tabs__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; } .jdf-mk-tabs__pages, .jdf-mk-tabs__view { display: inline-flex; flex-wrap: wrap; gap: 6px; padding: 4px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 8px; } .jdf-mk-tabs__btn { appearance: none; border: 0; background: transparent; cursor: pointer; font: 700 13px/1 var(--data); letter-spacing: .02em; color: var(--soft); padding: 9px 14px; border-radius: 6px; transition: background .15s, color .15s; } .jdf-mk-tabs__btn:hover { color: var(--secondary); } .jdf-mk-tabs__btn.is-active { background: #fff; color: var(--primary); box-shadow: 0 1px 2px rgba(20,28,40,.08); } .jdf-mk-tabs__panel[hidden] { display: none !important; } .jdf-mk-tabs__panel.is-active { display: block; } .jdf-wf { margin: 0; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 16px 16px 18px; overflow: hidden; } .jdf-wf figcaption { font: 700 12px/1 var(--data); letter-spacing: .08em; text-transform: uppercase; color: var(--soft); margin: 0 0 14px; } .jdf-wf__chrome { display: flex; flex-direction: column; gap: 6px; background: #fff; border: 1px solid #d8dee8; border-radius: 4px; padding: 8px; max-width: none; margin: 0; width: 100%; } .jdf-wf__phone { width: min(280px, 100%); margin: 0 auto; display: flex; flex-direction: column; gap: 6px; padding: 12px 10px 10px; border: 2px solid #2a3340; border-radius: 22px; background: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.4); } .jdf-wf__topbar { height: 8px; background: #1a2230; border-radius: 1px; } .jdf-wf__mast { display: grid; grid-template-columns: 90px 1fr; gap: 8px; align-items: center; } .jdf-wf__mast--m { grid-template-columns: 1fr; } .jdf-wf__logo { height: 28px; background: var(--primary); border-radius: 2px; opacity: .9; } .jdf-wf__nav { height: 14px; background: #e8ecf2; border-radius: 2px; } .jdf-wf__plantao { height: 10px; background: #f3c5cd; border-radius: 2px; } .jdf-wf__hero { display: grid; grid-template-columns: 1.55fr .9fr; gap: 8px; } .jdf-wf__hero-main, .jdf-wf__hero-side, .jdf-wf__quad, .jdf-wf__content, .jdf-wf__sb, .jdf-wf__block { display: flex; flex-direction: column; gap: 6px; } .jdf-wf__hero-side { gap: 5px; } .jdf-wf__lead { display: flex; flex-direction: column; gap: 5px; } .jdf-wf__ph { background: #d5dae3; border-radius: 2px; } .jdf-wf__ph--hero { min-height: 88px; } .jdf-wf__ph--feat { min-height: 72px; } .jdf-wf__lines { display: flex; flex-direction: column; gap: 3px; } .jdf-wf__lines i { display: block; height: 5px; background: #e2e6ed; border-radius: 1px; } .jdf-wf__lines i:nth-child(2) { width: 88%; } .jdf-wf__lines i:nth-child(3) { width: 72%; } .jdf-wf__lines i:nth-child(4) { width: 80%; } .jdf-wf__mini { display: block; min-height: 36px; background: #e7ebf1; border-radius: 2px; } .jdf-wf__agora { display: flex; flex-direction: column; gap: 3px; padding: 6px; background: #f6f7fa; border: 1px solid #e4e8ef; border-radius: 2px; } .jdf-wf__agora b { display: block; height: 8px; width: 40%; background: var(--primary); border-radius: 1px; opacity: .7; } .jdf-wf__agora i { display: block; height: 4px; background: #dde2ea; border-radius: 1px; } .jdf-wf__cards2, .jdf-wf__cards3 { display: grid; gap: 5px; } .jdf-wf__cards2 { grid-template-columns: 1fr 1fr; } .jdf-wf__cards3 { grid-template-columns: repeat(3, 1fr); } .jdf-wf__cards2 span, .jdf-wf__cards3 span { display: block; min-height: 42px; background: #e7ebf1; border-radius: 2px; } .jdf-wf__grid { display: grid; grid-template-columns: 1fr 92px; gap: 8px; align-items: start; } .jdf-wf__block > b { display: block; height: 8px; width: 28%; background: #cfd5de; border-radius: 1px; } .jdf-wf__list { display: flex; flex-direction: column; gap: 4px; } .jdf-wf__list i { display: block; height: 16px; background: #eef1f5; border-radius: 2px; border-left: 18px solid #d8dee8; } .jdf-wf__hrow { display: grid; grid-template-columns: 56px 1fr; gap: 6px; align-items: center; } .jdf-wf__hrow > span { display: block; min-height: 40px; background: #e0e5ec; border-radius: 2px; } .jdf-wf__wid { min-height: 28px; background: #eef1f5; border: 1px solid #e0e5ec; border-radius: 2px; } .jdf-wf__kicker { height: 6px; width: 22%; background: var(--primary); border-radius: 1px; opacity: .65; } .jdf-wf__htitle { height: 22px; width: 92%; background: #c8ced8; border-radius: 2px; } .jdf-wf__meta { height: 6px; width: 48%; background: #e4e8ef; border-radius: 1px; } .jdf-wf__author { height: 36px; background: #f3f5f8; border: 1px solid #e4e8ef; border-radius: 2px; } .jdf-wf__edmast { display: flex; flex-direction: column; gap: 4px; padding: 6px 0 2px; } .jdf-wf__edmast b { display: block; height: 14px; width: 36%; background: #1a2230; border-radius: 1px; } .jdf-wf__edmast i { display: block; height: 5px; width: 55%; background: #dde2ea; border-radius: 1px; } .jdf-wf__edmast--busca b { width: 48%; background: var(--primary); opacity: .85; } .jdf-wf__foot { height: 28px; background: #1a2230; border-radius: 2px; margin-top: 4px; } .jdf-wf__dock { height: 22px; background: #1a2230; border-radius: 6px; margin-top: 2px; } .jdf-wf__slot { position: relative; min-height: 28px; border: 1.5px dashed rgba(200,16,46,.75); background: repeating-linear-gradient(-45deg, rgba(200,16,46,.1), rgba(200,16,46,.1) 5px, rgba(200,16,46,.03) 5px, rgba(200,16,46,.03) 10px); border-radius: 2px; } .jdf-wf__slot::after { content: attr(data-l); position: absolute; inset: 0; display: grid; place-items: center; font: 700 8px/1.15 var(--data); letter-spacing: .03em; text-transform: uppercase; color: var(--primary); text-align: center; padding: 3px 4px; } .jdf-wf__slot--lb { min-height: 26px; } .jdf-wf__slot--mpu { min-height: 48px; } .jdf-wf__slot--half { min-height: 78px; } .jdf-wf__slot--bleed { min-height: 40px; } .jdf-wf__slot--bleed.jdf-wf__slot--muted { border-color: rgba(90,100,120,.55); background: repeating-linear-gradient(-45deg, rgba(90,100,120,.1), rgba(90,100,120,.1) 5px, rgba(90,100,120,.03) 5px, rgba(90,100,120,.03) 10px); } .jdf-wf__slot--bleed.jdf-wf__slot--muted::after { color: #5a6478; } .jdf-wf__slot--in { min-height: 56px; } .jdf-wf__slot--mtop { min-height: 32px; } .jdf-wf__slot--anchor { min-height: 22px; } @media (max-width: 720px) { .jdf-wf__hero { grid-template-columns: 1fr; } .jdf-wf__grid { grid-template-columns: 1fr; } .jdf-wf__sb { display: none; } .jdf-mk-tabs__bar { flex-direction: column; align-items: stretch; } } .jdf-mk__section--midcta { background: var(--primary-soft); border-bottom: 1px solid #f3c5cd; padding: 36px 0; } .jdf-mk__midcta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; } .jdf-mk__midcta h2 { margin: 0 0 6px; font-size: 26px; } .jdf-mk__midcta p { margin: 0; } .jdf-mk__steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; } .jdf-mk__steps li { background: var(--surface-2); border: 1px solid var(--line); border-top: 3px solid var(--primary); border-radius: var(--radius-sm); padding: 18px 16px; display: flex; flex-direction: column; gap: 8px; } .jdf-mk__steps strong { font: 800 15px/1.25 var(--display); color: var(--secondary); } .jdf-mk__steps span { font-size: 14px; line-height: 1.5; color: var(--muted); } .jdf-mk__glossary { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px 18px; margin: 0; } .jdf-mk__glossary-item { margin: 0; padding: 16px 16px 14px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: #fff; } .jdf-mk__glossary-item dt { font: 800 14px/1.2 var(--display); color: var(--primary); margin: 0 0 6px; } .jdf-mk__glossary-item dd { margin: 0; font-size: 14px; line-height: 1.5; color: var(--muted); } .jdf-mk__faq { display: flex; flex-direction: column; gap: 8px; } .jdf-mk__faq-item { border: 1px solid var(--line); border-radius: var(--radius-sm); background: #fff; padding: 0 14px; } .jdf-mk__faq-item summary { cursor: pointer; list-style: none; font: 700 15px/1.35 var(--display); color: var(--secondary); padding: 14px 0; } .jdf-mk__faq-item summary::-webkit-details-marker { display: none; } .jdf-mk__faq-item p { margin: 0 0 14px; font-size: 14.5px; } .jdf-mk__trust-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 12px; } .jdf-mk__trust-list li { position: relative; padding: 14px 16px 14px 42px; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius-sm); font-size: 15px; line-height: 1.5; color: var(--muted); } .jdf-mk__trust-list li::before { content: ""; position: absolute; left: 16px; top: 18px; width: 12px; height: 12px; border: 2px solid var(--primary); border-radius: 50%; } .jdf-mk__finale { background: var(--secondary); color: #d7dde6; padding: 56px 0 64px; } .jdf-mk__finale h2 { margin: 0 0 12px; font: 800 clamp(28px, 4vw, 40px)/1.1 var(--display); color: #fff; letter-spacing: -.02em; } .jdf-mk__finale p { margin: 0 0 8px; font-size: 16.5px; line-height: 1.55; } @media (max-width: 960px) { .jdf-mk__steps { grid-template-columns: 1fr 1fr; } .jdf-mk__glossary { grid-template-columns: 1fr; } .jdf-mk__kpis { grid-template-columns: 1fr 1fr; } } @media (max-width: 640px) { .jdf-mk__hero { padding: 36px 0 32px; } .jdf-mk__aeo { font-size: 15.5px; } .jdf-mk__section { padding: 40px 0; } .jdf-mk__steps { grid-template-columns: 1fr; } .jdf-mk__kpis { grid-template-columns: 1fr; } .jdf-mk__midcta { align-items: flex-start; } }