/* Fallbacks com metricas ajustadas (CLS ~0 no swap das webfonts): Arial/Courier
   esticadas pra ocupar o mesmo espaco da fonte final. Medidas no navegador. */
@font-face{font-family:'Space Grotesk Fallback';src:local('Arial');size-adjust:104.56%;ascent-override:93.73%;descent-override:27.74%;line-gap-override:0%;}
@font-face{font-family:'Inter Fallback';src:local('Arial');size-adjust:104.83%;ascent-override:92.53%;descent-override:22.89%;line-gap-override:0%;}
@font-face{font-family:'JetBrains Mono Fallback';src:local('Courier New');size-adjust:100%;ascent-override:102%;descent-override:30%;line-gap-override:0%;}
/* Estilo compartilhado do blog da CarrosseIA (índice + artigos).
   Um arquivo só: páginas mais leves e cache entre as visitas, o que ajuda no SEO. */
:root{
  --cream:#F5F1EA; --paper:#FFFDF9; --surface-2:#EDE6D8;
  --black:#1A1714; --ink-2:#4A443C; --ink-3:#7C756A; --line:#D8CDB4;
  --orange:#FF5A1F; --orange-2:#FF9142; --queimado:#C2410C; --amber:#FFA94D;
  --dark:#131009; --dark-mut:#B0A796; --dark-line:#2E2820;
  --shadow:6px 6px 0 var(--black); --shadow-sm:4px 4px 0 var(--black);
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--cream);color:var(--black);font-family:'Inter','Inter Fallback',system-ui,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.7;}
a{color:var(--queimado);}
h1,h2,h3{font-family:'Space Grotesk','Space Grotesk Fallback',sans-serif;letter-spacing:-0.02em;line-height:1.15;}

/* cabeçalho e rodapé */
header{background:rgba(245,241,234,.94);backdrop-filter:blur(10px);border-bottom:3px solid var(--black);position:sticky;top:0;z-index:20;}
.head-in{max-width:940px;margin:0 auto;padding:14px 22px;display:flex;align-items:center;justify-content:space-between;gap:14px;}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;}
.brand img{height:32px;width:auto;display:block;}
.brand .tag{font-family:'Space Grotesk','Space Grotesk Fallback';font-weight:700;font-size:13px;color:var(--ink-2);border-left:2px solid var(--line);padding-left:12px;}
.head-cta{font-family:'Space Grotesk','Space Grotesk Fallback';font-weight:700;font-size:13px;color:#fff;background:var(--orange);border:2px solid var(--black);border-radius:5px;padding:8px 15px;box-shadow:3px 3px 0 var(--black);text-decoration:none;}
.head-cta:hover{background:var(--queimado);}
footer{background:var(--dark);color:var(--dark-mut);border-top:2px solid var(--dark-line);}
.foot{max-width:940px;margin:0 auto;padding:30px 22px;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;font-size:13px;}
.foot b{color:var(--cream);font-family:'Space Grotesk','Space Grotesk Fallback';}
.foot .fl{display:flex;gap:18px;flex-wrap:wrap;}
.foot a{color:var(--dark-mut);text-decoration:none;} .foot a:hover{color:var(--orange-2);}

/* artigo */
article{max-width:720px;margin:0 auto;padding:0 22px 40px;}
.crumb{font-size:13px;color:var(--ink-3);padding:22px 0 0;}
.crumb a{color:var(--ink-3);}
article h1{font-size:clamp(28px,4.6vw,42px);font-weight:700;margin:16px 0 14px;}
.meta{font-size:13.5px;color:var(--ink-3);margin-bottom:26px;padding-bottom:22px;border-bottom:2px solid var(--line);}
.lead{font-size:19px;color:var(--ink-2);margin-bottom:26px;}
article h2{font-size:26px;font-weight:700;margin:38px 0 14px;}
article h3{font-size:19px;font-weight:700;margin:26px 0 10px;}
article p{margin-bottom:16px;font-size:16.5px;}
article ul,article ol{margin:0 0 16px 22px;}
article li{margin-bottom:8px;font-size:16.5px;}
article strong{font-weight:700;}
.toc{background:var(--paper);border:2px solid var(--black);border-radius:8px;box-shadow:var(--shadow-sm);padding:20px 24px;margin:0 0 30px;}
.toc h2{font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);margin:0 0 12px;}
.toc ol{margin:0 0 0 18px;}
.toc li{font-size:15px;margin-bottom:6px;}
.cta{background:var(--dark);color:#fff;border:2px solid var(--black);border-radius:10px;padding:28px 26px;margin:34px 0;}
.cta h3{color:#fff;font-size:22px;margin-bottom:8px;}
.cta p{color:var(--dark-mut);margin-bottom:18px;}
.cta a{display:inline-block;font-family:'Space Grotesk','Space Grotesk Fallback';font-weight:700;font-size:15px;color:#fff;background:var(--orange);border:2px solid var(--black);border-radius:6px;padding:12px 22px;text-decoration:none;box-shadow:4px 4px 0 rgba(0,0,0,.4);}
.cta a:hover{background:var(--queimado);}
table{width:100%;border-collapse:collapse;margin:20px 0;font-size:15px;border:2px solid var(--black);border-radius:8px;overflow:hidden;}
th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);}
th{background:var(--surface-2);font-family:'Space Grotesk','Space Grotesk Fallback';font-size:13px;text-transform:uppercase;letter-spacing:.04em;}
.faq{margin-top:36px;}
.faq details{border:2px solid var(--black);border-radius:8px;background:var(--paper);padding:0 20px;margin-bottom:12px;}
.faq summary{font-family:'Space Grotesk','Space Grotesk Fallback';font-weight:700;font-size:16px;padding:16px 0;cursor:pointer;list-style:none;}
.faq summary::-webkit-details-marker{display:none;}
.faq p{padding-bottom:16px;margin:0;color:var(--ink-2);}
.related{border-top:2px solid var(--line);margin-top:40px;padding-top:26px;}
.related h2{font-size:18px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-2);margin-bottom:14px;}
.related a{display:block;font-family:'Space Grotesk','Space Grotesk Fallback';font-weight:600;font-size:16px;padding:8px 0;}

/* índice do blog */
.wrap{max-width:1000px;margin:0 auto;padding:0 22px;}
.hero{padding:56px 0 26px;text-align:center;}
.hero h1{font-size:clamp(30px,5vw,46px);font-weight:700;max-width:18ch;margin:0 auto 16px;}
.hero h1 .hl{color:var(--orange);}
.hero p{color:var(--ink-2);font-size:clamp(15px,2vw,18px);max-width:60ch;margin:0 auto;}
.hero p+p{margin-top:14px;font-size:clamp(14px,1.8vw,16px);}
.secname{font-family:'Space Grotesk','Space Grotesk Fallback';font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin:34px 0 14px;padding-top:20px;border-top:2px solid var(--line);}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;}
.post{display:flex;flex-direction:column;background:var(--paper);border:2px solid var(--black);border-radius:10px;box-shadow:var(--shadow-sm);padding:26px 24px;transition:transform .16s ease,box-shadow .16s ease;text-decoration:none;}
.post:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--black);}
.post .kicker{font-family:'Space Grotesk','Space Grotesk Fallback';font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--queimado);margin-bottom:12px;}
.post h2{font-size:21px;font-weight:700;color:var(--black);margin-bottom:10px;}
.post p{color:var(--ink-2);font-size:14.5px;margin-bottom:16px;flex:1;}
.post .more{font-family:'Space Grotesk','Space Grotesk Fallback';font-weight:700;font-size:14px;color:var(--orange);}
.feat{grid-column:1 / -1;background:var(--dark);border-color:var(--black);}
.feat .kicker{color:var(--amber);}
.feat h2{color:#fff;font-size:27px;}
.feat p{color:var(--dark-mut);}
.blogfoot{margin-top:60px;}
@media(max-width:720px){ .grid{grid-template-columns:1fr;} }