/*
Theme Name: Fivebucks Magazine
Theme URI: https://www.fivebucks.com.br
Author: Fivebucks
Description: Tema editorial da Fivebucks Magazine. Editorias: Vivências, Coleções e Histórias.
Version: 1.0.6
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: fivebucks-magazine
*/
:root{
  --bg:#f2efe9; --fg:#0c0c0c; --muted:#5f5b55; --line:#0c0c0c; --red:#d4141c; --block:#e4e0d8; --inv-bg:#0c0c0c; --inv-fg:#f2efe9;
  --display:"Archivo","Helvetica Neue",Arial,sans-serif; --body:"Archivo","Helvetica Neue",Arial,sans-serif; --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
}
@media (prefers-color-scheme:dark){:root{--bg:#0c0c0c;--fg:#f2efe9;--muted:#a09a91;--line:#f2efe9;--red:#ff2a33;--block:#1b1b1a;--inv-bg:#f2efe9;--inv-fg:#0c0c0c;color-scheme:dark}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--body);font-size:16px;line-height:1.5}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.screen-reader-text{position:absolute;left:-9999px}
.wrap{max-width:1240px;margin-inline:auto;padding-inline:20px}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.tag{color:var(--red)}
.top{display:flex;justify-content:space-between;gap:12px;padding-block:12px;border-bottom:2px solid var(--line);flex-wrap:wrap}
.mast{padding-block:28px 12px;border-bottom:2px solid var(--line);position:relative}
.mast .logo{display:block;margin:0;font-family:var(--display);font-stretch:62%;font-weight:900;font-size:clamp(64px,17vw,230px);line-height:.82;letter-spacing:-.01em;text-transform:uppercase;padding-right:120px}
.mast .logo span{color:var(--red)}
.mast.small .logo{font-size:clamp(40px,8vw,84px)}
.corner-brand{position:absolute;top:18px;right:0;display:block;width:86px;z-index:2}
.corner-brand img{width:100%;height:auto;display:block}
@media (prefers-color-scheme:dark){.corner-brand img{filter:invert(1) brightness(2)}}
.nav{display:flex;flex-wrap:wrap;gap:8px 28px;padding-block:14px;border-bottom:2px solid var(--line);margin:0;list-style:none}
.nav li{margin:0}
.nav a{font-weight:800;font-stretch:75%;text-transform:uppercase;font-size:18px}
.nav a:hover,.nav .current-menu-item a,.nav .current-cat a{color:var(--red)}
.cover{display:grid;grid-template-columns:1.35fr 1fr;border-bottom:2px solid var(--line)}
.cover-img{min-height:520px;border-right:2px solid var(--line);position:relative;background:var(--inv-bg);color:var(--inv-fg);display:flex;align-items:flex-end;padding:24px;overflow:hidden}
.cover-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cover-img .big{position:relative;font-family:var(--display);font-stretch:62%;font-weight:900;text-transform:uppercase;font-size:clamp(48px,8vw,104px);line-height:.85;text-wrap:balance;color:#f2efe9;text-shadow:0 2px 24px rgba(0,0,0,.45)}
.ph{position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent 0 22px,rgba(128,128,128,.14) 22px 24px)}
.cover-txt{padding:24px;display:flex;flex-direction:column;justify-content:space-between;gap:24px;min-width:0}
.cover-txt h2{margin:0;font-family:var(--display);font-stretch:75%;font-weight:900;font-size:clamp(34px,4vw,54px);line-height:.95;text-transform:uppercase;text-wrap:balance}
.cover-txt p{margin:0;max-width:44ch;color:var(--muted)}
.meta{display:flex;gap:16px;flex-wrap:wrap;color:var(--muted)}
.sec-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-block:44px 16px;flex-wrap:wrap}
.sec-h h1,.sec-h h3{margin:0;font-family:var(--display);font-stretch:62%;font-weight:900;font-size:clamp(44px,8vw,96px);line-height:.85;text-transform:uppercase}
.sec-h p{margin:0;max-width:38ch;color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.card{display:flex;flex-direction:column;gap:10px;min-width:0}
.card .img{aspect-ratio:4/5;background:var(--block);position:relative;overflow:hidden;border:2px solid var(--line)}
.card.wide .img{aspect-ratio:16/10}
.card .img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.card h4{margin:0;font-family:var(--display);font-stretch:75%;font-weight:800;font-size:clamp(22px,2.4vw,30px);line-height:1;text-transform:uppercase;text-wrap:balance}
.card:hover h4,.story:hover h4{color:var(--red)}
.card p{margin:0;color:var(--muted);font-size:15px}
.s3{grid-column:span 3}.s4{grid-column:span 4}.s5{grid-column:span 5}.s6{grid-column:span 6}.s7{grid-column:span 7}
.stories{display:grid;grid-template-columns:1fr 1fr;border-top:2px solid var(--line)}
.story{padding:20px 20px 20px 0;border-bottom:2px solid var(--line);display:grid;grid-template-columns:110px auto 1fr;gap:16px;align-items:center}
.story-img{width:110px;aspect-ratio:4/5;overflow:hidden;border:2px solid var(--line);display:block}
.story-img img{width:100%;height:100%;object-fit:cover}
.story:nth-child(even){padding:20px 0 20px 20px;border-left:2px solid var(--line)}
.story h4{margin:0 0 4px;font-family:var(--display);font-stretch:75%;font-weight:800;font-size:26px;line-height:1;text-transform:uppercase}
.story p{margin:0;color:var(--muted);font-size:15px}
.strip{margin-top:56px;background:var(--red);color:#0c0c0c;overflow:hidden;white-space:nowrap;border-block:2px solid var(--line)}
.strip div{display:inline-block;padding-block:10px;font-family:var(--display);font-stretch:62%;font-weight:900;font-size:28px;text-transform:uppercase;animation:run 30s linear infinite}
@keyframes run{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.strip div{animation:none}}
.tpl{display:grid;grid-template-columns:200px 1fr;gap:32px;padding-block:32px}
.tpl aside{color:var(--muted);display:flex;flex-direction:column;gap:12px;min-width:0}
.tpl aside b{color:var(--fg);font-weight:500}
.art{max-width:none;min-width:0}
.art h1,.art .lead{max-width:22ch}.art .lead{max-width:56ch}
.art h1{margin:0 0 16px;font-family:var(--display);font-stretch:62%;font-weight:900;font-size:clamp(44px,7vw,84px);line-height:.88;text-transform:uppercase;text-wrap:balance}
.art .lead{font-size:21px;line-height:1.35;font-weight:500;margin:0 0 24px}
.art .entry>*{margin:0 0 18px}
.art .entry h2,.art .entry h3{font-family:var(--display);font-stretch:75%;font-weight:900;text-transform:uppercase;line-height:1;margin:36px 0 14px}
.art .entry h2{font-size:clamp(30px,4vw,44px)}.art .entry h3{font-size:26px}
.art .entry a{color:var(--red);text-decoration:underline;text-underline-offset:3px}
.art blockquote,.art .wp-block-quote{margin:28px 0;padding:0 0 0 18px;border-left:6px solid var(--red);font-family:var(--display);font-stretch:75%;font-weight:800;font-size:clamp(26px,3.4vw,38px);line-height:1;text-transform:uppercase}
.art blockquote p{margin:0}
.art figure{margin:28px 0}
.art figcaption{color:var(--muted);font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin-top:8px}
.art .hero-img{margin:0 0 28px;border:2px solid var(--line)}
.art ul,.art ol{padding-left:22px}
.next{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}
.next a{border:2px solid var(--line);padding:14px;display:flex;flex-direction:column;gap:6px;min-width:0}
.next a:hover{background:var(--inv-bg);color:var(--inv-fg)}
.next strong{font-family:var(--display);font-stretch:75%;font-weight:800;text-transform:uppercase;font-size:20px;line-height:1}
.news{margin-top:56px;background:var(--inv-bg);color:var(--inv-fg);padding:40px 24px;display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:end}
.news h3{margin:0;font-family:var(--display);font-stretch:62%;font-weight:900;font-size:clamp(40px,6vw,76px);line-height:.85;text-transform:uppercase}
.news form{display:flex;gap:8px;flex-wrap:wrap}
.news input[type=email]{flex:1 1 200px;min-width:0;padding:14px;border:2px solid var(--inv-fg);background:transparent;color:var(--inv-fg);font:inherit}
.news input::placeholder{color:var(--inv-fg);opacity:.6}
.news button{padding:14px 22px;border:0;background:var(--red);color:#0c0c0c;font:800 16px var(--display);font-stretch:75%;text-transform:uppercase;cursor:pointer}
.msg{flex-basis:100%;font-family:var(--mono);font-size:12px}
.pager{display:flex;justify-content:space-between;gap:12px;padding-block:32px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.pager a{border:2px solid var(--line);padding:10px 16px}
.pager a:hover{background:var(--inv-bg);color:var(--inv-fg)}
.empty{padding:40px 0;color:var(--muted)}
footer.site{padding-block:32px 48px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--muted)}
.footer-brand{display:flex;align-items:center;gap:8px}
.footer-brand img{width:72px;height:auto}
@media (prefers-color-scheme:dark){.footer-brand img{filter:invert(1) brightness(2)}}
@media (max-width:520px){.corner-brand{width:62px;top:14px}.mast .logo{padding-right:78px}.story{grid-template-columns:78px 1fr}.story .tag{display:none}.story-img{width:78px}}
@media (max-width:860px){
  .cover{grid-template-columns:1fr}.cover-img{min-height:380px;border-right:0;border-bottom:2px solid var(--line)}
  .s3,.s4,.s5,.s6,.s7{grid-column:span 6}.stories{grid-template-columns:1fr}.story:nth-child(even){border-left:0;padding-left:0}.story{padding-right:0}
  .tpl{grid-template-columns:1fr;gap:16px}.tpl aside{flex-direction:row;flex-wrap:wrap;gap:8px 20px}
  .news{grid-template-columns:1fr}.next{grid-template-columns:1fr}
}
@media (max-width:520px){.s3,.s4,.s5,.s6,.s7{grid-column:span 12}}

/* ===== Blocos editoriais das matérias ===== */
.entry>*{max-width:68ch}
.entry>.full,.entry>.duo,.entry>.trio,.entry>.wp-block-columns,.entry>.ficha,.entry>.bignum,.entry>.names,.entry>.compare,.entry>.wp-block-quote,.entry>.wp-block-image,.entry>.wp-block-gallery{max-width:none}
.entry>p:first-of-type.cap::first-letter,.entry>.wp-block-paragraph.cap::first-letter{float:left;font-family:var(--display);font-stretch:62%;font-weight:900;font-size:5.4em;line-height:.78;padding:.04em .08em 0 0;color:var(--red)}
.entry h2{display:flex;align-items:baseline;gap:14px;border-top:2px solid var(--line);padding-top:14px;max-width:none}
.entry h2::before{content:"✕";color:var(--red);font-size:.5em;transform:translateY(-.15em)}
/* espaços de foto */
.ph-fig{margin:0;position:relative}
.ph-box{position:relative;aspect-ratio:16/9;background:var(--inv-bg);color:var(--inv-fg);border:2px solid var(--line);overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;padding:16px}
.ph-box::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent 0 22px,rgba(128,128,128,.16) 22px 24px)}
.ph-box span,.ph-box em{position:relative}
.ph-box span{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--red)}
.ph-box em{font-style:normal;font-family:var(--display);font-stretch:75%;font-weight:800;text-transform:uppercase;font-size:clamp(16px,2vw,22px);line-height:1;max-width:28ch}
.ph-box.r45{aspect-ratio:4/5}.ph-box.r11{aspect-ratio:1/1}.ph-box.r32{aspect-ratio:3/2}
.ph-fig img{width:100%;height:auto;border:2px solid var(--line)}
.ph-fig figcaption{margin-top:8px}
.full{margin:36px 0}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:36px 0}
.duo .ph-fig:nth-child(2){margin-top:48px}
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:36px 0}
.trio .ph-fig:nth-child(2){margin-top:32px}
.wp-block-columns{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start;margin:36px 0}
.wp-block-columns .wp-block-column{min-width:0}
.wp-block-columns .wp-block-column>p{margin:0 0 18px}
/* ficha */
.ficha{margin:36px 0;background:var(--inv-bg);color:var(--inv-fg);padding:24px;display:grid;grid-template-columns:auto 1fr;gap:16px 32px}
.ficha h3{margin:0;grid-column:1/-1;font-family:var(--display);font-stretch:62%;font-weight:900;font-size:clamp(32px,5vw,56px);line-height:.85;text-transform:uppercase}
.ficha dl{display:contents;margin:0}
.ficha dt{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--red);padding-top:4px}
.ficha dd{margin:0;font-family:var(--display);font-stretch:75%;font-weight:800;font-size:22px;line-height:1.1;text-transform:uppercase}
.ficha .row{display:contents}
/* número grande */
.bignum{margin:44px 0;display:flex;align-items:flex-end;gap:20px;flex-wrap:wrap;border-block:2px solid var(--line);padding-block:20px}
.bignum b{font-family:var(--display);font-stretch:62%;font-weight:900;font-size:clamp(120px,24vw,280px);line-height:.75;color:var(--red)}
.bignum span{font-family:var(--display);font-stretch:75%;font-weight:900;text-transform:uppercase;font-size:clamp(26px,4vw,48px);line-height:.95;max-width:14ch;padding-bottom:6px}
/* parede de nomes */
.names{margin:36px 0;display:flex;flex-wrap:wrap;gap:6px 22px;padding-block:22px;border-block:2px solid var(--line)}
.names span{font-family:var(--display);font-stretch:62%;font-weight:900;text-transform:uppercase;font-size:clamp(28px,5vw,60px);line-height:.95}
.names span:nth-child(3n+1){color:var(--red)}
.names span:nth-child(4n){-webkit-text-stroke:2px var(--fg);color:transparent}
/* comparativo */
.compare{margin:36px 0;display:grid;grid-template-columns:1fr 1fr;border:2px solid var(--line)}
.compare div{padding:22px}
.compare div+div{border-left:2px solid var(--line);background:var(--inv-bg);color:var(--inv-fg)}
.compare b{display:block;font-family:var(--display);font-stretch:62%;font-weight:900;font-size:clamp(64px,10vw,120px);line-height:.85}
.compare small{font-family:var(--display);font-stretch:62%;font-size:.3em;font-weight:800}
.compare span{display:block;margin-top:8px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.entry>.wp-block-quote{margin:44px 0;font-size:clamp(34px,6vw,72px);line-height:.92;border-left-width:10px}
@media (max-width:860px){.duo .ph-fig:nth-child(2),.trio .ph-fig:nth-child(2){margin-top:0}.wp-block-columns{grid-template-columns:1fr}.compare{grid-template-columns:1fr}.compare div+div{border-left:0;border-top:2px solid var(--line)}.ficha{grid-template-columns:1fr;gap:4px}.ficha dd{margin-bottom:12px}}
@media (max-width:520px){.trio{grid-template-columns:1fr}.duo{grid-template-columns:1fr}}

/* Botão flutuante */
.fab{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:calc(16px + env(safe-area-inset-bottom));z-index:60;display:flex;flex-direction:column;gap:2px;max-width:min(320px,calc(100vw - 32px));background:var(--red);color:#0c0c0c;padding:12px 18px;border:2px solid var(--line);font-family:var(--display);font-stretch:75%;font-weight:800;font-size:18px;line-height:1.05;text-transform:uppercase;transform:translateY(140%);transition:transform .3s ease,background .2s}
.fab small{color:#0c0c0c;opacity:.75}
.fab.show{transform:none}
.fab:hover{background:var(--inv-bg);color:var(--inv-fg)}
.fab:hover small{color:var(--inv-fg)}
@media (prefers-reduced-motion:reduce){.fab{transition:none}}


/* Controle de tamanho de fotos no corpo das matérias (evita fotos gigantes/duplicadas em altura) */
.art .hero-img img,
.entry>.wp-block-image img,
.entry>p>img{
  width:100%;
  max-height:64vh;
  object-fit:cover;
  object-position:center;
}
@media (max-width:860px){
  .art .hero-img img,
  .entry>.wp-block-image img,
  .entry>p>img{max-height:46vh}
}
/* No desktop, foto solta no corpo fica com diagramação própria (não ocupa a coluna inteira) */
@media (min-width:861px){
  .entry>.wp-block-image{max-width:640px;margin-left:0;margin-right:0}
  .entry>.wp-block-image.aligncenter{margin-inline:auto}
}
