/* BonsTutoriais - Blog e arquivos */

/* Blog */
.blog-page .blog-hero {
  background: linear-gradient(135deg, var(--blue-800), var(--blue-950));
  padding: 58px 0;
  color: var(--white);
}

.blog-page .blog-hero .section-head {
  margin-bottom: 28px;
}

.blog-page .blog-hero .section-head h1,
.blog-page .blog-hero .section-head p {
  color: var(--white);
}

.blog-page .blog-hero .eyebrow {
  color: var(--blue-300);
}

.featured-grid {
  display: grid;
  grid-template-columns: 1.35fr 1fr 1fr;
  gap: 22px;
}

.featured-grid .post-card:first-child .post-title {
  font-size: 26px;
}

.blog-menu {
  background: var(--bg-primary);
  border-bottom: 1px solid var(--border-card);
  position: sticky;
  top: 0;
  z-index: 30;
}

body.admin-bar .blog-menu {
  top: 32px;
}

.blog-menu-list {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding: 14px 0;
}

.blog-menu-list a {
  flex: 0 0 auto;
  background: var(--blue-50);
  color: var(--blue-700);
  border: 1px solid var(--border-card);
  border-radius: 999px;
  padding: 9px 16px;
  font-size: 13px;
  font-weight: 900;
}

.blog-menu-list a.active,
.blog-menu-list a:hover {
  background: var(--blue-700);
  color: var(--white);
}

.blog-main-section .post-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.blog-main-column .section-head {
  margin-bottom: 24px;
}

.blog-page .blog-sidebar {
  position: static;
}

.blog-empty-message {
  color: var(--text-secondary);
  font-weight: 800;
}

html[data-theme="dark"] .blog-menu {
  background: var(--bg-primary);
}

@media (max-width: 980px) {
  .featured-grid,
  .blog-layout {
    grid-template-columns: 1fr;
  }

  .blog-page .blog-sidebar {
    position: static;
  }
}

@media (max-width: 560px) {
  .blog-main-section .post-list {
    grid-template-columns: 1fr;
  }

  body.admin-bar .blog-menu {
    top: 0;
  }
}


/* ---- blog-v2.html ---- */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --navy:#383b67;--navy-d:#23254a;--navy-dd:#14152e;
  --purple:#7c3aed;--purple-l:#9d62f5;--purple-ll:#c4b5fd;
  --purple-xl:#ede9fe;--purple-d:#5b21b6;--purple-dd:#3b0f9e;
  --cyan:#06b6d4;--white:#fff;--off:#f8f7ff;
  --text:#1a1a2e;--text-m:#4a4a6a;--text-l:#9090b0;--border:#e4e2f4;
  --fh:'Poppins',sans-serif;--fb:'Open Sans',sans-serif;
  --r:14px;--r-sm:8px;--r-lg:20px;
}
html{scroll-behavior:smooth}
body{font-family:var(--fb);color:var(--text);background:var(--white);line-height:1.6;overflow-x:hidden}
a{text-decoration:none;color:inherit}
button{font-family:var(--fb);cursor:pointer;border:none;outline:none}

/* TOPBAR */
.topbar{background:linear-gradient(90deg,var(--navy-dd),var(--purple-d),var(--navy-dd));background-size:200%;animation:tbslide 6s linear infinite;color:#fff;font-size:13px;text-align:center;padding:9px 16px;font-family:var(--fh);font-weight:500}
@keyframes tbslide{0%{background-position:0%}100%{background-position:200%}}
.topbar a{color:var(--purple-ll);font-weight:700;text-decoration:underline;text-underline-offset:3px}

/* HEADER */
header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border-bottom:1px solid var(--border)}
.header-inner{max-width:1240px;margin:0 auto;padding:0 28px;height:70px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.logo{font-family:var(--fh);font-size:22px;font-weight:800;color:var(--navy-d);display:flex;align-items:center;gap:10px;flex-shrink:0}
.logo-mark{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,var(--purple),var(--purple-d));display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(124,58,237,.4)}
.logo-mark svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.logo em{background:linear-gradient(90deg,var(--purple),var(--cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-style:normal}
nav{display:flex;align-items:center;gap:2px}
nav a{font-family:var(--fh);font-size:14px;font-weight:500;color:var(--text-m);padding:7px 14px;border-radius:var(--r-sm);transition:background .18s,color .18s}
nav a:hover{background:var(--purple-xl);color:var(--purple-d)}
nav a.active{color:var(--purple);font-weight:700}
.h-search{flex:1;max-width:300px;display:flex;align-items:center;background:var(--off);border:1.5px solid var(--border);border-radius:999px;padding:0 16px;gap:8px;transition:border-color .2s,box-shadow .2s}
.h-search:focus-within{border-color:var(--purple-l);box-shadow:0 0 0 3px rgba(124,58,237,.12)}
.h-search input{border:none;background:transparent;font-family:var(--fb);font-size:14px;color:var(--text);width:100%;padding:9px 0;outline:none}
.h-search input::placeholder{color:var(--text-l)}
.h-search svg{width:15px;height:15px;flex-shrink:0;stroke:var(--text-l);fill:none;stroke-width:2;stroke-linecap:round}
.btn-hdr{background:linear-gradient(135deg,var(--purple),var(--purple-d));color:#fff;font-family:var(--fh);font-size:14px;font-weight:700;padding:10px 24px;border-radius:999px;box-shadow:0 4px 16px rgba(124,58,237,.35);transition:transform .15s,box-shadow .15s;white-space:nowrap}
.btn-hdr:hover{transform:translateY(-2px);box-shadow:0 6px 22px rgba(124,58,237,.45)}

/* HERO BLOG */
.blog-hero{
  background:linear-gradient(160deg,var(--navy-dd) 0%,var(--navy-d) 55%,#1e1040 100%);
  padding:64px 28px 72px;position:relative;overflow:hidden;
}
.blog-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 65% 70% at 60% 50%,rgba(124,58,237,.35) 0%,transparent 65%);pointer-events:none}
.blog-hero-grid{position:absolute;inset:0;pointer-events:none;opacity:.04;background-image:linear-gradient(rgba(255,255,255,.8) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.8) 1px,transparent 1px);background-size:60px 60px}
.blog-hero-inner{max-width:1240px;margin:0 auto;position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}

.blog-hero-text{}
.hero-eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(124,58,237,.2);border:1px solid rgba(196,181,253,.3);color:var(--purple-ll);font-family:var(--fh);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:5px 16px;border-radius:999px;margin-bottom:22px}
.blog-hero-text h1{font-family:var(--fh);font-size:clamp(28px,3.5vw,46px);font-weight:900;color:#fff;line-height:1.1;margin-bottom:16px;letter-spacing:-.02em}
.blog-hero-text h1 em{background:linear-gradient(90deg,var(--purple-ll),var(--cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-style:normal}
.blog-hero-text p{font-size:16px;color:rgba(255,255,255,.55);line-height:1.75;margin-bottom:28px;max-width:460px}

.hero-search-big{
  display:flex;align-items:center;
  background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.15);
  backdrop-filter:blur(12px);border-radius:999px;padding:7px 7px 7px 22px;
  gap:8px;max-width:460px;transition:border-color .2s,box-shadow .2s;
}
.hero-search-big:focus-within{border-color:rgba(196,181,253,.5);box-shadow:0 0 0 4px rgba(124,58,237,.18)}
.hero-search-big input{flex:1;border:none;background:transparent;font-family:var(--fb);font-size:15px;color:#fff;outline:none}
.hero-search-big input::placeholder{color:rgba(255,255,255,.35)}
.hero-search-big button{background:linear-gradient(135deg,var(--purple),var(--purple-d));color:#fff;font-family:var(--fh);font-size:14px;font-weight:700;padding:11px 24px;border-radius:999px;white-space:nowrap;box-shadow:0 4px 14px rgba(124,58,237,.45);transition:transform .15s}
.hero-search-big button:hover{transform:scale(1.03)}

/* DESTAQUE (FEATURED) */
.blog-hero-featured{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
  backdrop-filter:blur(8px);border-radius:var(--r-lg);overflow:hidden;cursor:pointer;
  transition:transform .2s,box-shadow .2s;
}
.blog-hero-featured:hover{transform:translateY(-4px);box-shadow:0 20px 60px rgba(0,0,0,.3)}
.feat-thumb{height:200px;display:flex;align-items:center;justify-content:center;font-size:64px;position:relative;overflow:hidden}
.feat-thumb::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,transparent 30%,rgba(0,0,0,.6))}
.feat-badge{position:absolute;top:14px;left:14px;z-index:2;background:linear-gradient(135deg,var(--purple),var(--purple-d));color:#fff;font-family:var(--fh);font-size:11px;font-weight:800;padding:4px 12px;border-radius:999px;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 2px 10px rgba(124,58,237,.5)}
.feat-body{padding:20px}
.feat-cat{display:inline-flex;align-items:center;gap:5px;font-family:var(--fh);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:3px 12px;border-radius:999px;margin-bottom:10px;background:rgba(196,181,253,.15);border:1px solid rgba(196,181,253,.2);color:var(--purple-ll)}
.feat-body h2{font-family:var(--fh);font-size:20px;font-weight:800;color:#fff;margin-bottom:8px;line-height:1.25}
.feat-body p{font-size:13px;color:rgba(255,255,255,.5);margin-bottom:14px;line-height:1.6}
.feat-meta{display:flex;align-items:center;gap:14px;font-size:12px;color:rgba(255,255,255,.4)}

/* FILTROS */
.filters-bar{background:var(--white);border-bottom:1px solid var(--border);position:sticky;top:70px;z-index:50}
.filters-inner{max-width:1240px;margin:0 auto;padding:0 28px;display:flex;align-items:center;gap:10px;height:60px;overflow-x:auto;scrollbar-width:none}
.filters-inner::-webkit-scrollbar{display:none}
.filter-label{font-family:var(--fh);font-size:13px;font-weight:700;color:var(--text-l);white-space:nowrap;margin-right:4px}
.filter-btn{
  font-family:var(--fh);font-size:13px;font-weight:600;
  padding:7px 18px;border-radius:999px;white-space:nowrap;
  border:1.5px solid var(--border);background:transparent;color:var(--text-m);
  transition:all .18s;cursor:pointer;display:flex;align-items:center;gap:5px;
}
.filter-btn:hover{border-color:var(--purple-ll);color:var(--purple-d);background:var(--purple-xl)}
.filter-btn.active{background:linear-gradient(135deg,var(--purple),var(--purple-d));color:#fff;border-color:transparent;box-shadow:0 3px 12px rgba(124,58,237,.3)}
.filters-sort{margin-left:auto;flex-shrink:0}
.sort-select{font-family:var(--fh);font-size:13px;font-weight:600;color:var(--text-m);border:1.5px solid var(--border);border-radius:var(--r-sm);padding:7px 12px;background:var(--white);outline:none;cursor:pointer;transition:border-color .2s}
.sort-select:focus{border-color:var(--purple-l)}

/* LAYOUT PRINCIPAL */
.main{max-width:1240px;margin:0 auto;padding:48px 28px 72px;display:grid;grid-template-columns:1fr 340px;gap:48px;align-items:start}

/* GRID DE ARTIGOS */
.articles-wrap{}
.articles-count{font-family:var(--fh);font-size:14px;font-weight:600;color:var(--text-l);margin-bottom:24px;display:flex;align-items:center;gap:8px}
.articles-count strong{color:var(--navy-d)}

.articles-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-bottom:40px}

/* CARD GRANDE (destaque na listagem) */
.art-card-big{
  grid-column:1/-1;
  display:flex;border-radius:var(--r-lg);overflow:hidden;
  border:1.5px solid var(--border);background:var(--white);
  transition:transform .2s,box-shadow .2s;cursor:pointer;
}
.art-card-big:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(56,59,103,.13)}
.art-card-big .thumb{flex-shrink:0;width:320px;min-height:200px;display:flex;align-items:center;justify-content:center;font-size:64px;position:relative;overflow:hidden}
.art-card-big .thumb::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.08),rgba(0,0,0,.25))}
.art-card-big .body{padding:28px 30px;flex:1;display:flex;flex-direction:column;justify-content:space-between}

/* CARD NORMAL */
.art-card{
  border-radius:var(--r-lg);overflow:hidden;
  border:1.5px solid var(--border);background:var(--white);
  transition:transform .2s,box-shadow .2s;cursor:pointer;display:flex;flex-direction:column;
}
.art-card:hover{transform:translateY(-5px);box-shadow:0 14px 44px rgba(56,59,103,.14)}
.art-card .thumb{height:180px;display:flex;align-items:center;justify-content:center;font-size:52px;position:relative;overflow:hidden}
.art-card .thumb::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,transparent 30%,rgba(0,0,0,.4))}
.art-card .body{padding:20px;flex:1;display:flex;flex-direction:column}

/* CARD HORIZONTAL (lista) */
.art-card-h{
  grid-column:1/-1;
  display:flex;gap:0;border-radius:var(--r-lg);overflow:hidden;
  border:1.5px solid var(--border);background:var(--white);
  transition:transform .2s,box-shadow .2s;cursor:pointer;
}
.art-card-h:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(56,59,103,.1)}
.art-card-h .thumb{flex-shrink:0;width:160px;min-height:120px;display:flex;align-items:center;justify-content:center;font-size:36px;position:relative;overflow:hidden}
.art-card-h .thumb::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.05),rgba(0,0,0,.2))}
.art-card-h .body{padding:16px 20px;flex:1;display:flex;flex-direction:column;justify-content:center}

/* BODY COMPARTILHADO */
.art-cat{display:inline-flex;align-items:center;gap:5px;font-family:var(--fh);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:4px 12px;border-radius:999px;margin-bottom:10px;width:fit-content}
.art-title-text{font-family:var(--fh);font-weight:800;color:var(--navy-d);line-height:1.3;margin-bottom:8px}
.art-card-big .art-title-text{font-size:22px}
.art-card .art-title-text{font-size:17px}
.art-card-h .art-title-text{font-size:15px;margin-bottom:6px}
.art-excerpt{font-size:14px;color:var(--text-m);line-height:1.65;flex:1;margin-bottom:14px}
.art-card-h .art-excerpt{font-size:13px;margin-bottom:8px}
.art-meta{display:flex;align-items:center;gap:14px;font-size:12px;color:var(--text-l);flex-wrap:wrap}
.art-meta span{display:flex;align-items:center;gap:4px}

/* BADGE NOVO / POPULAR */
.badge-new{position:absolute;top:12px;right:12px;z-index:2;background:linear-gradient(135deg,var(--purple),var(--purple-d));color:#fff;font-family:var(--fh);font-size:10px;font-weight:800;padding:3px 10px;border-radius:999px;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 2px 8px rgba(124,58,237,.4)}
.badge-hot{position:absolute;top:12px;right:12px;z-index:2;background:linear-gradient(135deg,#ef4444,#b91c1c);color:#fff;font-family:var(--fh);font-size:10px;font-weight:800;padding:3px 10px;border-radius:999px;letter-spacing:.05em;box-shadow:0 2px 8px rgba(239,68,68,.4)}

/* PAGINAÇÃO */
.pagination{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:16px}
.page-btn{width:40px;height:40px;border-radius:var(--r-sm);border:1.5px solid var(--border);background:var(--white);font-family:var(--fh);font-size:14px;font-weight:600;color:var(--text-m);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .18s}
.page-btn:hover{border-color:var(--purple-ll);color:var(--purple-d);background:var(--purple-xl)}
.page-btn.active{background:linear-gradient(135deg,var(--purple),var(--purple-d));color:#fff;border-color:transparent;box-shadow:0 3px 12px rgba(124,58,237,.3)}
.page-btn.arrow{font-size:18px}

/* SIDEBAR */
.sidebar{display:flex;flex-direction:column;gap:22px;position:sticky;top:140px}
.sb-box{border-radius:var(--r-lg);overflow:hidden;border:1.5px solid var(--border)}
.sb-hd{padding:14px 20px;background:linear-gradient(135deg,var(--navy-d),var(--navy-dd));font-family:var(--fh);font-size:14px;font-weight:700;color:#fff;display:flex;align-items:center;gap:8px}

/* TOP 5 */
.top5{list-style:none;background:var(--white)}
.top5 li{display:flex;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--border);transition:background .15s;cursor:pointer}
.top5 li:last-child{border-bottom:none}
.top5 li:hover{background:var(--off)}
.t5n{width:26px;height:26px;border-radius:7px;flex-shrink:0;background:linear-gradient(135deg,var(--purple),var(--purple-d));color:#fff;font-family:var(--fh);font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(124,58,237,.3)}
.top5 li span{font-size:13px;color:var(--text);line-height:1.4;font-weight:500}

/* CATEGORIAS SIDEBAR */
.cat-tags{padding:16px 18px;background:var(--white);display:flex;flex-wrap:wrap;gap:8px}
.cat-tag{font-family:var(--fh);font-size:12px;font-weight:600;padding:6px 14px;border-radius:999px;background:var(--off);border:1.5px solid var(--border);color:var(--text-m);cursor:pointer;transition:all .18s;display:flex;align-items:center;gap:5px}
.cat-tag:hover{background:var(--purple-xl);border-color:var(--purple-ll);color:var(--purple-d)}
.cat-tag.active{background:linear-gradient(135deg,var(--purple),var(--purple-d));color:#fff;border-color:transparent;box-shadow:0 2px 10px rgba(124,58,237,.3)}

/* PACK SIDEBAR */
.sb-pack{border-radius:var(--r-lg);background:linear-gradient(135deg,var(--navy-d),var(--purple-dd));padding:24px 20px;text-align:center;position:relative;overflow:hidden}
.sb-pack::before{content:'';position:absolute;top:-40px;right:-40px;width:140px;height:140px;border-radius:50%;background:rgba(124,58,237,.2)}
.sb-pack-emoji{font-size:44px;margin-bottom:10px;position:relative;z-index:1}
.sb-pack h3{font-family:var(--fh);font-size:15px;font-weight:800;color:#fff;margin-bottom:6px;position:relative;z-index:1}
.sb-pack p{font-size:13px;color:rgba(255,255,255,.55);margin-bottom:16px;line-height:1.6;position:relative;z-index:1}
.btn-sbpack{display:block;width:100%;background:linear-gradient(135deg,var(--purple-l),var(--purple));color:#fff;font-family:var(--fh);font-size:14px;font-weight:700;padding:12px;border-radius:var(--r-sm);text-align:center;box-shadow:0 4px 16px rgba(124,58,237,.4);transition:transform .15s,box-shadow .15s;position:relative;z-index:1}
.btn-sbpack:hover{transform:translateY(-2px);box-shadow:0 6px 22px rgba(124,58,237,.5)}

/* NEWSLETTER SIDEBAR */
.sb-nl{border-radius:var(--r-lg);background:var(--off);border:1.5px solid var(--border);padding:22px;text-align:center}
.sb-nl h3{font-family:var(--fh);font-size:15px;font-weight:800;color:var(--navy-d);margin-bottom:6px}
.sb-nl p{font-size:13px;color:var(--text-m);margin-bottom:16px;line-height:1.5}
.sb-nl input{width:100%;border:1.5px solid var(--border);background:var(--white);font-family:var(--fb);font-size:14px;color:var(--text);padding:11px 16px;border-radius:var(--r-sm);outline:none;margin-bottom:8px;transition:border-color .2s}
.sb-nl input:focus{border-color:var(--purple-l);box-shadow:0 0 0 3px rgba(124,58,237,.1)}
.sb-nl input::placeholder{color:var(--text-l)}
.btn-nl{display:block;width:100%;background:linear-gradient(135deg,var(--purple),var(--purple-d));color:#fff;font-family:var(--fh);font-size:14px;font-weight:700;padding:11px;border-radius:var(--r-sm);box-shadow:0 4px 14px rgba(124,58,237,.3);transition:transform .15s}
.btn-nl:hover{transform:scale(1.02)}

/* WHATSAPP SIDEBAR */
.sb-wa{border-radius:var(--r-lg);background:linear-gradient(135deg,#f0fdf4,#dcfce7);border:1.5px solid #bbf7d0;padding:20px;text-align:center}
.sb-wa h3{font-family:var(--fh);font-size:14px;font-weight:800;color:#14532d;margin-bottom:6px}
.sb-wa p{font-size:13px;color:#166534;margin-bottom:14px;line-height:1.5}
.btn-swa{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;background:linear-gradient(135deg,#25d366,#128c7e);color:#fff;font-family:var(--fh);font-size:14px;font-weight:700;padding:11px;border-radius:var(--r-sm);box-shadow:0 4px 14px rgba(37,211,102,.3);transition:transform .15s}
.btn-swa:hover{transform:translateY(-2px)}

/* BANNER MID LISTAGEM */
.banner-listing{
  grid-column:1/-1;
  border-radius:var(--r-lg);overflow:hidden;cursor:pointer;
  transition:transform .2s,box-shadow .2s;
}
.banner-listing:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(56,59,103,.15)}
.banner-listing-inner{background:linear-gradient(135deg,var(--navy-d) 0%,var(--purple-dd) 100%);padding:24px 32px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.bl-left .bl-badge{display:inline-flex;align-items:center;gap:5px;background:rgba(196,181,253,.15);border:1px solid rgba(196,181,253,.25);color:var(--purple-ll);font-family:var(--fh);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:3px 12px;border-radius:999px;margin-bottom:10px}
.bl-left h3{font-family:var(--fh);font-size:18px;font-weight:800;color:#fff;margin-bottom:5px}
.bl-left p{font-size:13px;color:rgba(255,255,255,.5)}
.btn-bl{background:linear-gradient(135deg,var(--purple-l),var(--purple));color:#fff;font-family:var(--fh);font-size:14px;font-weight:700;padding:12px 26px;border-radius:999px;box-shadow:0 4px 16px rgba(124,58,237,.45);transition:transform .15s;white-space:nowrap}
.btn-bl:hover{transform:scale(1.04)}

/* FOOTER */
footer{background:var(--navy-dd);padding:64px 28px 28px}
.foot-grid{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:2.2fr 1fr 1fr 1fr;gap:48px;margin-bottom:48px}
.fb-l .logo{color:#fff;margin-bottom:14px}
.fb-l p{font-size:14px;color:rgba(255,255,255,.4);line-height:1.75;margin-bottom:22px;max-width:280px}
.socials{display:flex;gap:10px}
.s-ico{width:38px;height:38px;border-radius:10px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;font-size:17px;transition:all .18s}
.s-ico:hover{background:var(--purple);border-color:var(--purple);transform:translateY(-2px)}
.fc h4{font-family:var(--fh);font-size:13px;font-weight:700;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:.08em;margin-bottom:18px}
.fc ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.fc ul li a{font-size:14px;color:rgba(255,255,255,.45);transition:color .15s;font-weight:500}
.fc ul li a:hover{color:var(--purple-ll)}
.foot-bot{max-width:1240px;margin:0 auto;padding-top:24px;border-top:1px solid rgba(255,255,255,.07);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:13px;color:rgba(255,255,255,.25)}

/* RESPONSIVE */
@media(max-width:1024px){
  .main{grid-template-columns:1fr}
  .sidebar{position:static}
  .blog-hero-inner{grid-template-columns:1fr}
  .blog-hero-featured{display:none}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
  nav,.h-search{display:none}
  .header-inner{padding:0 20px}
  .articles-grid{grid-template-columns:1fr}
  .art-card-big{flex-direction:column}
  .art-card-big .thumb{width:100%;height:200px}
  .art-card-h .thumb{width:120px}
  .banner-listing-inner{flex-direction:column;text-align:center}
  .main{padding:32px 20px 52px}
}
@media(max-width:560px){
  .foot-grid{grid-template-columns:1fr}
  .blog-hero{padding:48px 20px 56px}
}

/* =========================
   PromptHub V2 - AI Tech Upgrade
   camada visual adicionada para comparacao
   ========================= */
:root{--navy:#111827;--navy-d:#0f172a;--navy-dd:#050816;--purple:#7c3aed;--purple-l:#a78bfa;--purple-ll:#ddd6fe;--purple-xl:#f3efff;--purple-d:#6d28d9;--cyan:#00d4ff;--pink:#ff3d9a;--mint:#38f8c8;--amber:#fbbf24;--white:#fff;--off:#f6f8ff;--text:#101426;--text-m:#4b587c;--text-l:#8b96b8;--border:#dfe6f7;--shadow-soft:0 18px 55px rgba(15,23,42,.10);--shadow-glow:0 18px 60px rgba(124,58,237,.24)}
body{background:radial-gradient(circle at 10% 0%,rgba(0,212,255,.10),transparent 28rem),radial-gradient(circle at 92% 12%,rgba(255,61,154,.09),transparent 24rem),linear-gradient(180deg,#fbfcff 0%,#f5f7ff 52%,#ffffff 100%);color:var(--text)}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.34;background-image:linear-gradient(rgba(17,24,39,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(17,24,39,.045) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,black,transparent 82%)}
.topbar{background:linear-gradient(90deg,#050816,#1e1b4b 30%,#0e7490 58%,#831843 82%,#050816);color:#e0faff;box-shadow:0 1px 0 rgba(255,255,255,.08) inset}.topbar a{color:#a7f3ff;text-decoration-color:rgba(167,243,255,.6)}
header{background:rgba(255,255,255,.78);border-bottom:1px solid rgba(124,58,237,.14);box-shadow:0 14px 38px rgba(15,23,42,.07);backdrop-filter:blur(22px) saturate(1.2)}
.logo-mark{border-radius:12px;background:conic-gradient(from 180deg,var(--cyan),var(--purple),var(--pink),var(--cyan));box-shadow:0 12px 30px rgba(124,58,237,.28),0 0 0 1px rgba(255,255,255,.65) inset}
.logo em,.grad-text,.blog-hero-text h1 em,.art-title em{background:linear-gradient(90deg,#00d4ff,#a78bfa,#ff3d9a,#38f8c8);background-size:240% 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
nav a:hover,nav a.active{background:rgba(124,58,237,.10);color:var(--purple-d)}
.h-search,.hero-search,.hero-search-big,.nl-form input{background:rgba(255,255,255,.82);border-color:rgba(124,58,237,.22);box-shadow:0 10px 28px rgba(15,23,42,.06)}
.h-search:focus-within,.hero-search:focus-within,.hero-search-big:focus-within,.nl-form input:focus{border-color:rgba(0,212,255,.72);box-shadow:0 0 0 4px rgba(0,212,255,.14),0 16px 34px rgba(15,23,42,.08)}
.btn-hdr,.btn-wa,.hero-search button,.hero-search-big button,.btn-banner,.nl-form button,.btn-copy,.load-more{background:linear-gradient(135deg,#00d4ff 0%,#7c3aed 48%,#ff3d9a 100%);box-shadow:0 14px 34px rgba(124,58,237,.28),0 0 0 1px rgba(255,255,255,.24) inset}
.btn-hdr:hover,.btn-wa:hover,.hero-search button:hover,.hero-search-big button:hover,.btn-copy:hover,.load-more:hover{transform:translateY(-2px);box-shadow:0 20px 44px rgba(124,58,237,.34),0 0 30px rgba(0,212,255,.18)}
.hero,.blog-hero,.art-hero{background:radial-gradient(circle at 22% 20%,rgba(0,212,255,.25),transparent 24rem),radial-gradient(circle at 82% 18%,rgba(255,61,154,.22),transparent 24rem),radial-gradient(circle at 50% 100%,rgba(124,58,237,.34),transparent 34rem),linear-gradient(145deg,#050816 0%,#111827 48%,#1e1b4b 100%)}
.hero::after,.blog-hero::after,.art-hero::after{content:'';position:absolute;inset:0;pointer-events:none;opacity:.22;background-image:linear-gradient(120deg,transparent 0 35%,rgba(255,255,255,.18) 36%,transparent 37% 100%);background-size:140px 140px;mix-blend-mode:screen}.hero-grid,.blog-hero-grid,.art-hero-grid{opacity:.11;background-size:42px 42px}
.hero-badge,.hero-eyebrow,.bc-cat,.feat-cat{background:rgba(0,212,255,.12);border-color:rgba(0,212,255,.28);color:#bff6ff;box-shadow:0 0 28px rgba(0,212,255,.12) inset}.hero h1,.blog-hero-text h1,.art-title{text-shadow:0 18px 55px rgba(0,0,0,.34);letter-spacing:0}.hero p,.blog-hero-text p{color:rgba(234,242,255,.76)}
.hero-stats,.blog-hero-featured,.sb-box,.art-card,.art-card-big,.art-card-h,.cat-card,.art,.rel-card,.prompt-box,.newsletter-box,.smart-banner{border:1px solid rgba(124,58,237,.14);box-shadow:var(--shadow-soft);position:relative}.hero-stats::before,.blog-hero-featured::before,.art-card::before,.art-card-big::before,.cat-card::before,.art::before,.rel-card::before,.sb-box::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.55),transparent 32%,rgba(0,212,255,.10));opacity:.7}.cat-card,.art,.art-card,.art-card-big,.art-card-h,.rel-card,.sb-box{background:rgba(255,255,255,.88);backdrop-filter:blur(10px)}.cat-card:hover,.art:hover,.art-card:hover,.art-card-big:hover,.art-card-h:hover,.rel-card:hover{transform:translateY(-6px);box-shadow:0 24px 70px rgba(15,23,42,.13),0 0 34px rgba(0,212,255,.11)}
.cat-img,.art-thumb,.thumb,.feat-thumb,.rel-thumb,.art-thumb-wrap{position:relative;overflow:hidden;background-blend-mode:screen,normal}.cat-img::before,.art-thumb::before,.thumb::before,.feat-thumb::before,.rel-thumb::before,.art-thumb-wrap::before{content:'';position:absolute;inset:0;opacity:.48;pointer-events:none;background:radial-gradient(circle at 28% 24%,rgba(255,255,255,.46),transparent 23%),linear-gradient(135deg,rgba(0,212,255,.24),transparent 45%,rgba(255,61,154,.24))}.cat-emoji,.art-thumb,.thumb,.feat-thumb,.rel-thumb,.art-thumb-wrap{filter:saturate(1.12)}
.s-head h2,.prose h2,.prose h3,.sb-hd{color:#101426;letter-spacing:0}.see-all,.art-cat,.tag{box-shadow:0 8px 18px rgba(124,58,237,.08)}.filters-bar{background:rgba(255,255,255,.82);backdrop-filter:blur(18px);border-bottom-color:rgba(124,58,237,.13)}.filter-btn,.sort-select{background:rgba(255,255,255,.74);border-color:rgba(124,58,237,.18)}.filter-btn.active{background:linear-gradient(135deg,#00d4ff,#7c3aed 62%,#ff3d9a);box-shadow:0 12px 26px rgba(124,58,237,.25)}
.prose blockquote{background:linear-gradient(135deg,#eefbff,#f5efff);border-left-color:#00d4ff;box-shadow:0 14px 36px rgba(15,23,42,.06)}.prompt-box,.smart-banner{background:radial-gradient(circle at 90% 10%,rgba(0,212,255,.22),transparent 18rem),linear-gradient(135deg,#0f172a,#111827 58%,#312e81);border-color:rgba(0,212,255,.20);box-shadow:0 24px 70px rgba(15,23,42,.20)}.newsletter-box{background:linear-gradient(135deg,#ffffff,#f1f7ff);border-color:rgba(0,212,255,.18)}
footer{background:linear-gradient(145deg,#050816,#111827 55%,#1e1b4b);position:relative;overflow:hidden}footer::before{content:'';position:absolute;inset:0;opacity:.12;background-image:linear-gradient(rgba(255,255,255,.6) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.6) 1px,transparent 1px);background-size:44px 44px}.footer-inner,.footer-bottom{position:relative;z-index:1}
@media (max-width:760px){.hero,.blog-hero{padding-left:20px;padding-right:20px}.btn-hdr{padding:9px 16px}}



/* Sidebar headings: keep readable over dark tech headers */
.sidebar .sb-hd,
.blog-page .sidebar .sb-hd,
.single-page .sidebar .sb-hd {
  color: #fff !important;
  min-height: 56px;
  padding: 15px 20px;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: .01em;
  text-shadow: 0 2px 14px rgba(0,0,0,.34);
  background:
    radial-gradient(circle at 14% 18%, rgba(0,212,255,.22), transparent 9rem),
    linear-gradient(135deg, #071326, #111827 52%, #1e1b4b);
}

.sidebar .sb-hd::first-letter {
  color: #fff;
}

.sidebar .sb-hd * {
  color: inherit;
}

.ph-blog-v2 .pagination {
  display: none !important;
}

.blog-infinite-wrap {
  display: flex;
  justify-content: center;
  margin: 12px 0 52px;
}

.blog-infinite-loader,
.blog-infinite-ended {
  min-height: 46px;
  padding: 12px 24px;
  border: 1px solid rgba(124,58,237,.22);
  border-radius: 999px;
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(135deg, var(--cyan), var(--purple), var(--pink)) border-box;
  color: var(--navy-d);
  font-family: var(--fh);
  font-size: 13px;
  font-weight: 900;
  box-shadow: 0 16px 38px rgba(124,58,237,.12);
}

.blog-infinite-loader {
  cursor: pointer;
}

.blog-infinite-loader:disabled {
  cursor: progress;
  opacity: .78;
}

.ph-blog-v2 .feat-badge,
.ph-blog-v2 .badge-hot,
.ph-blog-v2 .badge-new {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  max-height: 28px;
  width: auto;
  font-size: 10px !important;
  line-height: 1 !important;
  font-weight: 900;
  white-space: nowrap;
  text-transform: uppercase;
}

.ph-blog-v2 .thumb > .badge-hot,
.ph-blog-v2 .thumb > .badge-new,
.ph-blog-v2 .feat-thumb > .feat-badge {
  font-family: var(--fh);
}

body:has(.ph-blog-v2)::before {
  display: none !important;
}

body.bt-blog-page {
  background: #fff !important;
  overflow-x: hidden !important;
}

body.bt-blog-page::before {
  content: none !important;
  display: none !important;
  background: none !important;
  opacity: 0 !important;
}

.ph-blog-v2,
.ph-blog-v2::before,
.ph-blog-v2::after,
.ph-blog-v2 .main,
.ph-blog-v2 .articles-wrap {
  box-shadow: none !important;
}

body.bt-blog-page .ph-blog-v2 {
  width: 100%;
  overflow-x: clip;
  background: #fff;
  isolation: isolate;
}

body.bt-blog-page .ph-blog-v2 .main {
  background: #fff;
}

body.bt-blog-page .header,
body.bt-blog-page header.header {
  background: #fff !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Header account buttons */
.topbar .topbar-auth-btn,
.topbar .topbar-auth-btn:hover,
.topbar .topbar-auth-btn:focus,
.topbar .topbar-auth-btn:visited {
  text-decoration: none !important;
}


/* Mobile: listagem do blog em card vertical */
@media (max-width: 640px) {
  body.bt-blog-page .ph-blog-v2 .main {
    padding-inline: 16px !important;
  }

  body.bt-blog-page .ph-blog-v2 .articles-grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  body.bt-blog-page .ph-blog-v2 .art-card,
  body.bt-blog-page .ph-blog-v2 .art-card-big,
  body.bt-blog-page .ph-blog-v2 .art-card-h {
    grid-column: 1 / -1 !important;
    display: flex !important;
    flex-direction: column !important;
    border-radius: 22px !important;
    overflow: hidden !important;
  }

  body.bt-blog-page .ph-blog-v2 .art-card .thumb,
  body.bt-blog-page .ph-blog-v2 .art-card-big .thumb,
  body.bt-blog-page .ph-blog-v2 .art-card-h .thumb {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 10 !important;
    flex: 0 0 auto !important;
    font-size: 48px !important;
  }

  body.bt-blog-page .ph-blog-v2 .art-card .thumb img,
  body.bt-blog-page .ph-blog-v2 .art-card-big .thumb img,
  body.bt-blog-page .ph-blog-v2 .art-card-h .thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
  }

  body.bt-blog-page .ph-blog-v2 .art-card .body,
  body.bt-blog-page .ph-blog-v2 .art-card-big .body,
  body.bt-blog-page .ph-blog-v2 .art-card-h .body {
    padding: 18px 18px 20px !important;
    min-height: auto !important;
  }

  body.bt-blog-page .ph-blog-v2 .art-title-text,
  body.bt-blog-page .ph-blog-v2 .art-card-big .art-title-text,
  body.bt-blog-page .ph-blog-v2 .art-card-h .art-title-text {
    font-size: 18px !important;
    line-height: 1.28 !important;
    margin-bottom: 8px !important;
  }

  body.bt-blog-page .ph-blog-v2 .art-excerpt {
    font-size: 14px !important;
    line-height: 1.55 !important;
    margin-bottom: 12px !important;
  }

  body.bt-blog-page .ph-blog-v2 .art-meta {
    gap: 10px !important;
    font-size: 12px !important;
  }
}

/* Legibilidade da busca no hero do blog */
body.bt-blog-page .ph-blog-v2 .hero-search-big {
  background: rgba(8,13,30,.68) !important;
  border-color: rgba(255,255,255,.26) !important;
  box-shadow: 0 18px 44px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

body.bt-blog-page .ph-blog-v2 .hero-search-big input {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

body.bt-blog-page .ph-blog-v2 .hero-search-big input::placeholder {
  color: rgba(255,255,255,.78) !important;
  opacity: 1 !important;
}

@media (max-width: 640px) {
  body.bt-blog-page .ph-blog-v2 .hero-search-big {
    padding-left: 18px !important;
  }

body.bt-blog-page .ph-blog-v2 .hero-search-big input {
    font-size: 14px !important;
  }
}


/* Archive/category listing v2 */
.bt-archive-v2 .archive-hero {
  position: relative;
  overflow: hidden;
  padding: 72px 0 68px;
  background:
    radial-gradient(circle at 18% 22%, rgba(0, 212, 255, .22), transparent 26rem),
    radial-gradient(circle at 84% 18%, rgba(255, 61, 154, .2), transparent 28rem),
    radial-gradient(circle at 50% 100%, rgba(124, 58, 237, .34), transparent 34rem),
    linear-gradient(145deg, #050816 0%, #111827 48%, #1e1b4b 100%);
}

.bt-archive-v2 .archive-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .22;
  background-image: linear-gradient(120deg, transparent 0 35%, rgba(255,255,255,.18) 36%, transparent 37% 100%);
  background-size: 140px 140px;
  mix-blend-mode: screen;
}

.bt-archive-v2 .archive-hero-grid {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .08;
  background-image:
    linear-gradient(rgba(255,255,255,.9) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.9) 1px, transparent 1px);
  background-size: 54px 54px;
}

.bt-archive-v2 .archive-hero .container {
  position: relative;
  z-index: 1;
}

.bt-archive-v2 .archive-breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: auto;
  margin: 0 0 28px;
  padding: 8px 14px;
  border: 1px solid rgba(0, 212, 255, .28);
  border-radius: 999px;
  background: rgba(0, 212, 255, .1);
  color: rgba(255,255,255,.72);
  font: 800 12px/1 var(--fh);
}

.bt-archive-v2 .archive-breadcrumb a,
.bt-archive-v2 .archive-breadcrumb span {
  color: inherit;
}

.bt-archive-v2 .archive-hero h1 {
  max-width: 880px;
  margin: 0;
  color: #fff;
  font-family: var(--fh);
  font-size: clamp(36px, 4.4vw, 62px);
  font-weight: 920;
  line-height: 1.04;
  letter-spacing: 0;
}

.bt-archive-v2 .archive-hero .hero-copy {
  max-width: 720px;
  margin: 18px 0 0;
  color: rgba(255,255,255,.68);
  font-size: 17px;
  line-height: 1.65;
}

.bt-archive-v2 .archive-listing-section {
  padding: 64px 0 86px;
  background:
    radial-gradient(circle at 12% 20%, rgba(0, 212, 255, .06), transparent 22rem),
    radial-gradient(circle at 90% 10%, rgba(124, 58, 237, .08), transparent 24rem),
    linear-gradient(180deg, #fff, #f7f8ff);
}

.bt-archive-v2 .archive-post-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
}

.bt-archive-v2 .post-card {
  overflow: hidden;
  border: 1px solid rgba(124,58,237,.14);
  border-radius: 20px;
  background: rgba(255,255,255,.9);
  box-shadow: 0 18px 48px rgba(15,23,42,.08);
  backdrop-filter: blur(10px);
}

.bt-archive-v2 .post-card::before {
  display: none !important;
}

.bt-archive-v2 .post-thumb {
  height: 220px;
  aspect-ratio: auto;
  background: linear-gradient(135deg, rgba(0,212,255,.12), rgba(124,58,237,.1));
}

.bt-archive-v2 .post-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.bt-archive-v2 .post-body {
  padding: 20px 20px 22px;
}

.bt-archive-v2 .post-cat {
  display: inline-flex;
  align-items: center;
  width: auto;
  max-width: 100%;
  min-height: 24px;
  margin: 0 0 10px;
  padding: 5px 11px;
  border: 1px solid rgba(0, 212, 255, .35);
  border-radius: 999px;
  background: rgba(0, 212, 255, .12);
  color: #2563eb;
  font: 850 10px/1 var(--fh);
  letter-spacing: .06em;
  text-transform: uppercase;
  white-space: normal;
  box-shadow: none;
}

.bt-archive-v2 .post-title {
  margin: 0 0 10px;
  font-size: 20px;
  line-height: 1.16;
}

.bt-archive-v2 .post-title a {
  color: #101426;
}

.bt-archive-v2 .post-excerpt {
  color: #5b6b86;
  font-size: 14px;
  line-height: 1.62;
}

.bt-archive-v2 .post-footer {
  margin-top: 18px;
}

.bt-archive-v2.is-category-listing .post-body {
  padding-top: 22px;
}

.bt-archive-v2.is-category-listing .post-cat,
.bt-archive-v2.is-category-listing .post-footer {
  display: none;
}