/* Quero Seu Terreno — estilo do artigo e da lista pública */

:root{
  --bg:#f4f5f7; --ink:#16243a; --body:#33415a; --muted:#8190a4;
  --accent:#2f6df0; --tint:#eef2fb; --line:#e4e8ef; --card:#ffffff;
  --green:#1f8a5b; --red:#c2483d;
  --display:'Spectral',Georgia,serif;
  --sans:'IBM Plex Sans',system-ui,sans-serif;
  --mono:'IBM Plex Mono',monospace;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--bg);color:var(--body);font-family:var(--sans);
  -webkit-font-smoothing:antialiased;line-height:1.5;}

/* top bar */
.topbar{position:sticky;top:0;z-index:40;background:rgba(244,245,247,.86);
  backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid var(--line);}
.topbar .in{max-width:1080px;margin:0 auto;padding:14px 32px;display:flex;align-items:center;gap:12px;}
.brand{display:flex;align-items:center;gap:10px;font-weight:600;color:var(--ink);font-size:15px;
  letter-spacing:-.01em;text-decoration:none;}
.brand .mark{width:26px;height:26px;border-radius:7px;background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;font-family:var(--display);font-size:15px;font-weight:600;}
.brand .dom{color:var(--muted);font-weight:400;font-family:var(--mono);font-size:12px;}
.topbar .spacer{flex:1;}
.topbar .cta{font-size:13px;color:var(--accent);font-weight:600;text-decoration:none;
  border:1px solid var(--accent);border-radius:999px;padding:7px 15px;transition:background .15s,color .15s;}
.topbar .cta:hover{background:var(--accent);color:#fff;}

/* ── LISTA DE POSTS ── */
.list-wrap{max-width:1080px;margin:0 auto;padding:0 32px 80px;}
.list-header{padding:72px 0 48px;max-width:640px;}
.list-header h1{font-family:var(--display);font-size:clamp(36px,5vw,56px);line-height:1.1;
  font-weight:500;color:var(--ink);margin:0 0 16px;letter-spacing:-.015em;text-wrap:balance;}
.list-header h1 em{font-style:italic;font-weight:400;color:var(--body);}
.list-sub{font-size:18px;color:var(--muted);margin:0;line-height:1.6;max-width:520px;}

.post-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:28px;}
.post-card{text-decoration:none;color:inherit;background:var(--card);border:1px solid var(--line);
  border-radius:20px;overflow:hidden;display:flex;flex-direction:column;
  transition:box-shadow .18s,border-color .18s;}
.post-card:hover{box-shadow:0 6px 32px rgba(47,109,240,.1);border-color:rgba(47,109,240,.3);}
.card-cover{height:200px;overflow:hidden;flex-shrink:0;}
.card-cover img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s;}
.post-card:hover .card-cover img{transform:scale(1.03);}
.card-imgph{width:100%;height:100%;
  background:repeating-linear-gradient(135deg,#e7eaf0 0 16px,#eef1f5 16px 32px);}
.card-body{padding:24px 26px 28px;display:flex;flex-direction:column;flex:1;}
.card-kicker{font-size:11px;letter-spacing:.18em;color:var(--accent);font-weight:600;
  text-transform:uppercase;margin:0 0 12px;}
.card-title{font-family:var(--display);font-size:clamp(20px,2.4vw,24px);line-height:1.2;
  font-weight:500;color:var(--ink);margin:0 0 10px;letter-spacing:-.01em;text-wrap:balance;}
.card-title em{font-style:italic;font-weight:400;}
.card-dek{font-size:15px;color:var(--muted);line-height:1.5;margin:0 0 20px;flex:1;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.card-meta{display:flex;align-items:center;gap:10px;margin-top:auto;}
.card-ava{width:34px;height:34px;border-radius:50%;background:var(--accent);color:#fff;
  flex-shrink:0;display:flex;align-items:center;justify-content:center;
  font-family:var(--display);font-weight:600;font-size:14px;}
.card-author{display:block;font-size:13px;font-weight:600;color:var(--ink);}
.card-time{font-size:12px;color:var(--muted);font-family:var(--mono);}

.list-empty{padding:80px 0;text-align:center;color:var(--muted);}
.list-empty a{color:var(--accent);}

/* ── ARTIGO ── */
.wrap{max-width:720px;margin:0 auto;padding:0 32px;}

header.post{padding:64px 0 8px;}
.kicker{font-size:12px;letter-spacing:.18em;color:var(--accent);font-weight:600;
  text-transform:uppercase;margin:0 0 22px;}
h1.title{font-family:var(--display);font-size:clamp(40px,6vw,62px);line-height:1.07;font-weight:500;
  color:var(--ink);margin:0;letter-spacing:-.015em;text-wrap:balance;}
h1.title em{font-style:italic;font-weight:400;color:var(--body);}
.dek{font-size:clamp(19px,2.4vw,23px);line-height:1.5;color:var(--muted);font-weight:400;
  margin:24px 0 0;max-width:640px;text-wrap:pretty;}
.byline{display:flex;align-items:center;gap:13px;margin:34px 0 0;padding:20px 0;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.ava{width:42px;height:42px;border-radius:50%;background:var(--accent);color:#fff;flex:0 0 auto;
  display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:600;font-size:18px;}
.bymeta b{color:var(--ink);display:block;font-weight:600;font-size:15px;}
.bymeta span{color:var(--muted);font-size:13px;font-family:var(--mono);letter-spacing:.02em;}

figure{margin:0;}
.media{display:block;width:100%;overflow:hidden;border:1px solid var(--line);border-radius:18px;}
.media.hero-img{height:clamp(240px,46vw,400px);margin:34px 0 0;}
.media.inline-img{height:clamp(220px,40vw,360px);margin:44px 0 6px;}
.media img{width:100%;height:100%;object-fit:cover;display:block;}
.imgph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;
  background:repeating-linear-gradient(135deg,#e7eaf0 0 16px,#eef1f5 16px 32px);}
.imgph span{font-family:var(--mono);font-size:12px;color:var(--muted);background:var(--bg);
  padding:6px 10px;border-radius:6px;text-align:center;}
figcaption{font-size:13px;color:var(--muted);margin:12px 2px 0;font-style:italic;line-height:1.5;}

article{font-size:19px;line-height:1.68;color:var(--body);}
article p{margin:26px 0 0;text-wrap:pretty;}
article p.first{margin-top:38px;}
article strong{color:var(--ink);font-weight:600;}
article a{color:var(--accent);}
h2{font-family:var(--display);font-size:clamp(28px,3.4vw,34px);line-height:1.2;font-weight:500;
  color:var(--ink);margin:64px 0 0;letter-spacing:-.01em;text-wrap:balance;}
h2 .q{color:var(--accent);}
.sub{font-size:17px;color:var(--muted);margin:12px 0 0;}

.lead{margin:38px 0 0;background:var(--tint);border-radius:20px;padding:32px 36px;}
.lead .q{font-family:var(--display);font-style:italic;font-size:23px;color:var(--accent);margin:0 0 14px;}
.lead p{font-size:20px;line-height:1.62;color:var(--body);margin:0;}

.figure{margin:32px 0 0;background:var(--card);border:1px solid var(--line);border-radius:20px;
  padding:10px 30px;}
.frow{display:flex;align-items:baseline;justify-content:space-between;gap:20px;
  padding:22px 0;border-bottom:1px solid var(--line);}
.frow:last-child{border-bottom:0;}
.frow .fl{font-size:16.5px;color:var(--body);}
.frow .fl b{display:block;color:var(--ink);font-weight:600;font-size:17px;margin:0 0 3px;}
.frow .fl span{color:var(--muted);font-size:14px;font-style:italic;}
.frow .fv{font-family:var(--display);font-size:30px;font-weight:600;color:var(--ink);white-space:nowrap;}
.frow.dim .fv{color:var(--muted);}
.frow.hi .fv{color:var(--accent);}

.stat{margin:40px 0 0;display:flex;gap:24px;align-items:center;background:var(--card);
  border:1px solid var(--line);border-radius:18px;padding:26px 30px;}
.stat .big{font-family:var(--display);font-size:56px;font-weight:600;line-height:1;color:var(--ink);}
.stat .big.red{color:var(--red);} .stat .big.green{color:var(--green);}
.stat .txt{font-size:16px;line-height:1.5;color:var(--body);}
.stat .txt b{color:var(--ink);}

.costs{margin:34px 0 0;background:var(--card);border:1px solid var(--line);border-radius:20px;
  padding:14px 30px 26px;}
.costrow{display:flex;align-items:baseline;gap:16px;padding:15px 0;border-bottom:1px solid var(--line);}
.costrow .cl{flex:1;font-size:16.5px;color:var(--body);}
.costrow .cv{flex:0 0 auto;text-align:right;font-family:var(--mono);font-size:16px;font-weight:500;color:var(--ink);}
.costtotal{display:flex;align-items:center;justify-content:space-between;margin:18px 0 0;
  padding-top:20px;border-top:2px solid var(--ink);}
.costtotal .l{font-family:var(--display);font-size:19px;font-weight:600;color:var(--ink);}
.costtotal .v{font-family:var(--display);font-size:28px;font-weight:600;color:var(--red);}

.pull{margin:60px 0;padding:0 0 0 26px;border-left:3px solid var(--accent);}
.pull p{font-family:var(--display);font-size:clamp(24px,3.4vw,30px);line-height:1.34;font-weight:500;
  color:var(--ink);margin:0;font-style:italic;text-wrap:pretty;}

.takeaway{margin:44px 0 0;background:var(--ink);color:#dfe6f0;border-radius:22px;padding:36px 38px;}
.takeaway h3{font-family:var(--display);font-size:24px;font-weight:600;color:#fff;margin:0 0 6px;}
.takeaway .lede{font-size:15px;color:#9fb0c8;margin:0 0 20px;}
.takeaway ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px;}
.takeaway li{display:flex;gap:14px;align-items:flex-start;font-size:16.5px;line-height:1.5;}
.takeaway li .n{flex:0 0 auto;width:26px;height:26px;border-radius:8px;background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:13px;font-weight:500;margin-top:1px;}
.takeaway li b{color:#fff;font-weight:600;}

footer.post{margin:72px 0 0;padding:40px 0 80px;border-top:1px solid var(--line);text-align:center;}
footer.post .share{display:flex;gap:10px;justify-content:center;margin:0 0 26px;flex-wrap:wrap;}
footer.post .share a{font-size:13.5px;color:var(--ink);text-decoration:none;border:1px solid var(--line);
  background:var(--card);border-radius:999px;padding:9px 18px;transition:border-color .15s,color .15s;}
footer.post .share a:hover{border-color:var(--accent);color:var(--accent);}
footer.post .sig{font-family:var(--display);font-size:15px;color:var(--muted);}
footer.post .sig b{color:var(--ink);}

.disc{font-size:13px;color:var(--muted);margin:30px auto 0;max-width:640px;line-height:1.5;font-style:italic;}

@media(max-width:640px){
  .list-wrap{padding:0 20px 60px;}
  .wrap{padding:0 20px;}
  .post-grid{grid-template-columns:1fr;}
  .stat{flex-direction:column;align-items:flex-start;gap:12px;}
  .frow{flex-direction:column;align-items:flex-start;gap:6px;}
  .frow .fv{font-size:26px;}
}
