@font-face{font-family:'Degular';src:url('/uploads/fonts/degular-thin.woff2') format('woff2');font-weight:100;font-style:normal;font-display:swap}
@font-face{font-family:'Degular';src:url('/uploads/fonts/degular-light.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Degular';src:url('/uploads/fonts/degular-regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Degular';src:url('/uploads/fonts/degular-medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Degular';src:url('/uploads/fonts/degular-semibold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Degular';src:url('/uploads/fonts/degular-bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Degular';src:url('/uploads/fonts/degular-black.woff2') format('woff2');font-weight:900;font-style:normal;font-display:swap}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Degular',sans-serif;background:#010A14;color:#FFFFFF;overflow-x:hidden}

/* ═══ DESIGN TOKENS — mesmo sistema da home (New Style Marketing.dc.html) ═══ */
:root{
  --bg:#010A14;
  --pink:#FB923C;
  --cyan:#38BDF8;
  --cobalto:#0369A1;
  --text:#FFFFFF;
  --text-muted:#7DD3FC;

  --surface-1:#050F1C;
  --surface-2:#081627;

  --hairline: rgba(56,189,248,0.16);
  --hairline-strong: rgba(56,189,248,0.55);
  --hairline-active: rgba(251,146,60,0.40);

  --cut-sm:8px;
  --cut-md:16px;
  --cut-lg:24px;

  --sp-4:4px;--sp-8:8px;--sp-12:12px;--sp-16:16px;--sp-24:24px;
  --sp-32:32px;--sp-48:48px;--sp-64:64px;--sp-96:96px;

  --fs-h2-sm: clamp(32px,4vw,56px);
  --fs-h2-md: clamp(36px,6vw,80px);
  --fs-h2-lg: clamp(48px,8vw,104px);

  --fs-body-lg:18px;
  --fs-body:16px;
  --fs-body-sm:14px;
  --fs-caption:12px;
}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important;animation-iteration-count:1 !important;transition-duration:0.001ms !important;}
}

/* ── Chanfro reutilizável — wrapper (fio) + inner (superfície) ── */
.chanfro-wrap{
  display:block;
  background:var(--hairline);
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--cut,16px)),calc(100% - var(--cut,16px)) 100%,0 100%);
  padding:1px;
  transition:background 0.2s;
}
.chanfro-wrap:hover,.chanfro-wrap:focus-within{ background:var(--hairline-active); }
.chanfro-inner{
  display:block;
  height:100%;
  background:var(--surface-1);
  clip-path:polygon(0 0,100% 0,100% calc(100% - (var(--cut,16px) - 1px)),calc(100% - (var(--cut,16px) - 1px)) 100%,0 100%);
}
.chanfro-sm{ --cut:8px; }
.chanfro-md{ --cut:16px; }
.chanfro-lg{ --cut:24px; }

.card-pad{ padding:var(--sp-16); }
@media (min-width:640px){ .card-pad{ padding:var(--sp-32); } }

/* ── Papéis tipográficos ── */
.t-display{ font-weight:700; letter-spacing:-0.02em; }
.t-echo{ font-weight:400; letter-spacing:0.22em; text-transform:uppercase; font-size:11px; }
.t-body{ font-weight:500; line-height:1.65; max-width:68ch; }

/* ── Botões globais ── */
.btn-primary{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--pink);color:var(--bg);border:none;
  font-family:'Degular',sans-serif;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;
  cursor:pointer;text-decoration:none;
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--cut-sm)),calc(100% - var(--cut-sm)) 100%,0 100%);
  transition:transform 0.25s;
}
.btn-primary:hover{ transform:translateY(-2px); }

.btn-ghost{
  display:inline-flex;align-items:center;justify-content:center;
  position:relative;overflow:hidden;isolation:isolate;
  background:transparent;color:var(--cyan);border:none;
  font-family:'Degular',sans-serif;font-weight:600;letter-spacing:0.10em;text-transform:uppercase;
  cursor:pointer;text-decoration:none;
  clip-path:polygon(0 0,100% 0,100% calc(100% - (var(--cut,8px) - 1px)),calc(100% - (var(--cut,8px) - 1px)) 100%,0 100%);
  transition:color 0.25s;
}
.btn-ghost::before{
  content:'';position:absolute;top:0;left:-15%;width:0;height:140%;
  background:var(--cyan);transform:skewX(-20deg);transition:width 0.3s ease;z-index:-1;
}
.btn-ghost:hover,.btn-ghost:focus-visible{ color:var(--bg); }
.btn-ghost:hover::before,.btn-ghost:focus-visible::before{ width:130%; }

/* ── Foco visível ── */
a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--cyan);
  outline-offset:3px;
}

/* ═══ NAV (mesma estrutura da home) ═══ */
.blog-nav{ position:fixed;top:0;left:0;right:0;z-index:100;height:72px;display:flex;align-items:center;justify-content:space-between;background:rgba(1,10,20,0.72);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--hairline); }
.blog-nav-inner{ padding:0 24px;width:100%;max-width:1440px;margin:0 auto;display:flex;align-items:center;justify-content:space-between; }
.blog-logo{ display:flex;align-items:center;gap:9px;text-decoration:none; }
.blog-logo img{ width:22px;height:22px;flex-shrink:0; }
.blog-logo span{ font-family:'Degular',sans-serif;font-weight:900;font-size:21px;letter-spacing:0.10em;color:#FFFFFF; }
.blog-logo span em{ color:var(--pink);font-style:normal; }
.blog-nav-links{ display:none;gap:30px;align-items:center; }
.blog-nav-links a{ font-size:12px;font-weight:500;letter-spacing:0.09em;text-transform:uppercase;color:var(--text-muted);text-decoration:none;transition:color 0.2s; }
.blog-nav-links a:hover,.blog-nav-links a.active{ color:#FFFFFF; }
@media (min-width:640px){ .blog-nav-inner{ padding:0 48px; } .blog-nav-links{ display:flex; } }
@media (min-width:1024px){ .blog-nav-inner{ padding:0 64px; } }

/* ═══ FOOTER (mesma linguagem da home) ═══ */
.blog-footer{ padding:56px 24px;background:#010A14;border-top:1px solid var(--hairline); }
.blog-footer-inner{ display:flex;flex-direction:column;align-items:center;text-align:center;gap:24px;max-width:1440px;margin:0 auto; }
.blog-footer-inner a{ color:var(--text-muted);text-decoration:none;font-size:12px; }
@media (min-width:1024px){ .blog-footer-inner{ flex-direction:row;justify-content:space-between;text-align:left; } }

/* ═══ Conteúdo/layout do blog ═══ */
.blog-shell{ min-height:100vh;background:#010A14;padding-top:72px; }
.blog-container{ max-width:1120px;margin:0 auto;padding:0 24px; }
@media (min-width:640px){ .blog-container{ padding:0 48px; } }
@media (min-width:1024px){ .blog-container{ padding:0 80px; } }

.blog-hero{ padding:64px 0 48px; }
.blog-grid{ display:grid;grid-template-columns:1fr;gap:var(--sp-24);padding-bottom:96px; }
@media (min-width:640px){ .blog-grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1024px){ .blog-grid{ grid-template-columns:repeat(3,1fr); } }

.post-card{ display:flex;flex-direction:column;height:100%; }
.post-card-img{ width:100%;aspect-ratio:16/10;object-fit:cover;display:block; }
.post-card-body{ display:flex;flex-direction:column;flex:1; }
.post-card-cat{ color:var(--cyan);margin-bottom:12px; }
.post-card-title{ font-size:19px;font-weight:700;color:#FFFFFF;margin-bottom:10px;letter-spacing:0.01em;line-height:1.3; }
.post-card-excerpt{ font-size:var(--fs-body-sm);color:var(--text-muted);flex:1;margin-bottom:16px; }
.post-card-date{ font-size:var(--fs-caption);color:var(--cobalto); }
.post-card-link{ text-decoration:none;color:inherit;display:block;height:100%; }

.blog-empty{ padding:96px 24px;text-align:center;color:var(--text-muted); }

.pagination{ display:flex;justify-content:center;gap:var(--sp-8);padding-bottom:96px; }
.pagination a,.pagination span{ display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 14px;font-size:13px;font-weight:600;text-decoration:none;color:var(--text-muted);background:var(--surface-1);border:1px solid var(--hairline); }
.pagination a:hover{ color:#FFFFFF;border-color:var(--hairline-active); }
.pagination .current{ color:var(--bg);background:var(--pink);border-color:var(--pink); }

/* ── Post individual ── */
.post-breadcrumb{ font-size:var(--fs-caption);color:var(--text-muted);margin-bottom:24px; }
.post-breadcrumb a{ color:var(--text-muted);text-decoration:none; }
.post-breadcrumb a:hover{ color:var(--cyan); }
.post-header{ max-width:800px;margin:0 auto;padding:48px 0 32px;text-align:left; }
.post-cover{ width:100%;max-height:480px;object-fit:cover;margin-bottom:48px; }
.post-meta{ display:flex;gap:var(--sp-16);align-items:center;color:var(--text-muted);font-size:var(--fs-caption);margin-top:20px; }

.post-content{ max-width:800px;margin:0 auto;padding-bottom:80px;font-size:var(--fs-body);font-weight:400;line-height:1.75;color:var(--text-muted); }
.post-content h2{ font-family:'Degular',sans-serif;font-weight:700;letter-spacing:-0.01em;font-size:clamp(24px,3.5vw,36px);color:#FFFFFF;margin:48px 0 20px;line-height:1.2; }
.post-content h3{ font-family:'Degular',sans-serif;font-weight:700;font-size:clamp(19px,2.5vw,24px);color:#FFFFFF;margin:36px 0 16px; }
.post-content p{ margin-bottom:24px; }
.post-content ul,.post-content ol{ margin:0 0 24px;padding-left:24px; }
.post-content li{ margin-bottom:10px; }
.post-content a{ color:var(--cyan); }
.post-content strong{ color:#FFFFFF;font-weight:600; }
.post-content blockquote{ border-left:3px solid var(--pink);padding:4px 0 4px 24px;margin:32px 0;font-style:italic;color:#FFFFFF; }
.post-content img{ max-width:100%;height:auto;margin:32px 0; }

.post-cta{ max-width:800px;margin:0 auto 96px; }

.related-posts{ padding:64px 0 96px;border-top:1px solid var(--hairline); }
.related-posts-title{ font-size:var(--fs-h2-sm);margin-bottom:40px; }