/* HERTEMUS VISUAL V18 — PORTAL PUBLICO
   Identidade: metal, ciano, azul e violeta.
   As cores editoriais continuam vindo de --category-color. */

:root{
  --h18-bg:#05070b;
  --h18-bg-2:#080b12;
  --h18-panel:#0d121b;
  --h18-panel-2:#111827;
  --h18-line:#222b3c;
  --h18-cyan:#00c8ff;
  --h18-blue:#1464ff;
  --h18-violet:#7a3cff;
  --h18-magenta:#b137ff;
  --h18-success:#35d85a;
  --h18-text:#f4f7fb;
  --h18-muted:#98a4b7;
  --bg:var(--h18-bg);
  --surface:var(--h18-panel);
  --surface-2:var(--h18-panel-2);
  --surface-3:#161d2c;
  --text:var(--h18-text);
  --muted:var(--h18-muted);
  --line:var(--h18-line);
  --line-soft:#171e2b;
  --green:var(--h18-cyan);
  --blue:var(--h18-blue);
  --radius:8px;
  --shadow:0 22px 70px rgba(0,0,0,.42);
}

html{background:var(--h18-bg);color-scheme:dark}
body{
  background:
    radial-gradient(circle at 8% 0,rgba(0,200,255,.07),transparent 29rem),
    radial-gradient(circle at 92% 11%,rgba(122,60,255,.075),transparent 31rem),
    linear-gradient(rgba(255,255,255,.012) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px),
    var(--h18-bg);
  background-size:auto,auto,42px 42px,42px 42px,auto;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.33;
  background:
    linear-gradient(135deg,transparent 0 47%,rgba(0,200,255,.04) 47% 47.12%,transparent 47.12% 100%) 0 0/520px 360px,
    linear-gradient(45deg,transparent 0 68%,rgba(177,55,255,.035) 68% 68.12%,transparent 68.12% 100%) 0 0/610px 420px;
}

::selection{background:rgba(20,100,255,.72);color:#fff}

/* Cabeçalho e assinatura */
.site-header{
  background:rgba(4,7,12,.92);
  border-bottom:1px solid transparent;
  border-image:linear-gradient(90deg,rgba(0,200,255,.72),rgba(20,100,255,.3) 45%,rgba(122,60,255,.55),rgba(177,55,255,.72)) 1;
  box-shadow:0 12px 42px rgba(0,0,0,.34);
}
.site-header::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.32;
  background:
    linear-gradient(90deg,transparent 0 21%,rgba(0,200,255,.06) 21% 21.1%,transparent 21.1% 70%,rgba(122,60,255,.06) 70% 70.1%,transparent 70%),
    linear-gradient(135deg,transparent 0 58%,rgba(255,255,255,.025) 58% 58.1%,transparent 58.1%);
}
.header-main{min-height:74px;grid-template-columns:minmax(230px,1fr) auto minmax(220px,1fr)}
.brand-word,.footer-brand{
  position:relative;
  display:inline-block;
  width:max-content;
  color:#eaf1f7;
  font-family:Impact,"Arial Black",Inter,sans-serif;
  font-style:italic;
  font-weight:900;
  letter-spacing:-.035em;
  transform:skewX(-4deg);
  background:linear-gradient(180deg,#fff 0%,#d9e3ec 36%,#7f8f9e 52%,#eef5fa 69%,#7c8792 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  filter:drop-shadow(0 2px 0 #1a2531) drop-shadow(-2px 0 0 rgba(0,200,255,.34)) drop-shadow(2px 0 0 rgba(122,60,255,.32));
}
.brand-word{font-size:34px}
.brand-word::after{
  content:"GAMES  •  TECNOLOGIA  •  CULTURA";
  position:absolute;
  left:2px;
  top:calc(100% + 4px);
  font-family:Inter,"Segoe UI",sans-serif;
  font-style:normal;
  font-size:7px;
  font-weight:900;
  letter-spacing:.23em;
  white-space:nowrap;
  background:linear-gradient(90deg,var(--h18-cyan),#69aaff 52%,var(--h18-magenta));
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  filter:none;
}
.main-nav{height:74px;gap:31px}
.main-nav a,.nav-more summary{font-size:12px;font-weight:800;letter-spacing:.035em;text-transform:uppercase}
.main-nav a:hover,.main-nav a.active,.nav-more summary:hover{color:#fff}
.main-nav a.active{color:var(--h18-cyan);text-shadow:0 0 18px rgba(0,200,255,.35)}
.main-nav a.active::after{
  bottom:-25px;
  height:2px;
  background:linear-gradient(90deg,var(--h18-cyan),var(--h18-violet));
  box-shadow:0 0 12px rgba(0,200,255,.52);
}
.icon-button,.language-pill,.login-button{
  border-color:#263249;
  background:linear-gradient(180deg,rgba(17,24,39,.9),rgba(8,12,20,.9));
  border-radius:7px;
}
.icon-button:hover,.language-pill:hover,.login-button:hover{border-color:var(--h18-cyan);color:#fff;box-shadow:0 0 18px rgba(0,200,255,.1)}
.login-button{color:#dce8ff;border-color:rgba(122,60,255,.48)}
.search-panel{background:#070b12;border-top-color:#1c2636}
.search-form input,.large-search input{background:#080d16;border-color:#263249}
.search-form input:focus,.large-search input:focus{border-color:var(--h18-cyan);box-shadow:0 0 0 3px rgba(0,200,255,.08)}
.search-form button,.large-search button,.button{
  border-color:transparent;
  background:linear-gradient(115deg,var(--h18-blue),var(--h18-violet));
  color:#fff;
  box-shadow:0 10px 28px rgba(20,100,255,.18);
}

/* Estrutura editorial */
.home-hero-v3{padding:28px 0 13px}
.home-hero-grid{gap:17px}
.home-hero-side{gap:17px}
.post-card,.video-card{
  position:relative;
  border-color:#253047;
  border-radius:8px;
  background:linear-gradient(145deg,rgba(17,24,39,.98),rgba(7,11,18,.98));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 14px 38px rgba(0,0,0,.24);
}
.post-card::before,.video-card::before{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:3;
  pointer-events:none;
  border-radius:inherit;
  background:
    linear-gradient(90deg,var(--h18-cyan),transparent 22%) top left/42% 1px no-repeat,
    linear-gradient(270deg,var(--h18-magenta),transparent 22%) top right/42% 1px no-repeat,
    linear-gradient(0deg,var(--h18-cyan),transparent 30%) bottom left/1px 28% no-repeat,
    linear-gradient(0deg,var(--h18-violet),transparent 30%) bottom right/1px 28% no-repeat;
  opacity:.72;
}
.post-card:hover,.video-card:hover{
  transform:translateY(-4px);
  border-color:#40506f;
  box-shadow:0 24px 64px rgba(0,0,0,.46),-12px 0 44px rgba(0,200,255,.045),12px 0 44px rgba(122,60,255,.055);
}
.post-card-image::after,.video-thumb::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(115deg,rgba(0,200,255,.035),transparent 35%,rgba(122,60,255,.04));
}
.post-card-shade{background:linear-gradient(0deg,rgba(4,7,12,.93),transparent 70%)}
.post-card-feature{min-height:430px}
.post-card-feature .post-card-body{min-height:430px;padding:38px 42px}
.post-card-feature h3{font-size:32px;letter-spacing:-.035em}
.post-card-feature .post-card-shade{
  background:linear-gradient(0deg,rgba(3,6,11,.98) 0,rgba(3,6,11,.78) 25%,rgba(3,6,11,.05) 70%),linear-gradient(90deg,rgba(0,200,255,.035),transparent 45%,rgba(122,60,255,.055));
}
.post-card-side{min-height:206px}
.post-card-side .post-card-body{padding:24px}
.post-card-side h3{font-size:18px;line-height:1.28}
.post-card h3 a:hover,.video-body h3 a:hover,.video-card-copy h3:hover{color:#d8e9ff;text-shadow:0 0 20px rgba(0,200,255,.17)}
.post-card p{color:#a8b2c1}
.post-meta,.video-meta{color:#758398}
.post-author-mini img{border-color:rgba(0,200,255,.45);box-shadow:0 0 0 2px rgba(122,60,255,.12)}
.post-card-bookmark{color:#8190a4}

/* A categoria nunca herda a cor da identidade geral. */
.category-label{
  color:var(--category-color);
  border-color:color-mix(in srgb,var(--category-color) 72%,transparent);
  background:color-mix(in srgb,var(--category-color) 15%,rgba(5,7,11,.92));
  box-shadow:0 0 18px color-mix(in srgb,var(--category-color) 18%,transparent);
}
.category-button,.overview-card,.adaptive-category-card{--category-accent:var(--category-color)}

.section{border-top:1px solid #182132}
.home-news-v3,.home-videos-v3,.home-news-section,.video-section{background:rgba(5,8,13,.55)}
.section-heading-v3>div,.section-heading>div{position:relative;border-left:0;padding-left:15px}
.section-heading-v3>div::before,.section-heading>div::before{
  content:"";
  position:absolute;
  left:0;
  top:1px;
  bottom:1px;
  width:2px;
  background:linear-gradient(180deg,var(--h18-cyan),var(--h18-violet));
  box-shadow:0 0 14px rgba(0,200,255,.34);
}
.section-heading-v3 span,.section-heading span,.eyebrow{
  color:#9a81ff;
  letter-spacing:.14em;
}
.section-heading-v3 h2,.section-heading h2{color:#f1f5fb}
.section-heading-v3>a,.section-heading>a{color:var(--h18-cyan);font-weight:850;letter-spacing:.06em}
.section-heading-v3>a:hover,.section-heading>a:hover{color:#fff;text-shadow:0 0 16px rgba(0,200,255,.45)}
.news-strip-grid,.video-strip-grid{gap:16px}
.post-card-compact{border-color:#28344c}
.post-card-compact .post-card-body{padding:15px}
.post-card-compact h3{font-size:13px}

.video-play,.play-button{
  border:1px solid rgba(255,255,255,.72);
  background:linear-gradient(135deg,rgba(0,200,255,.92),rgba(122,60,255,.92));
  color:#fff;
  box-shadow:0 0 0 5px rgba(4,7,12,.42),0 0 28px rgba(20,100,255,.42);
}
.video-card-copy{background:linear-gradient(180deg,rgba(13,18,27,.86),rgba(8,11,18,.98))}

.category-directory-v3{border-top:1px solid #182132;background:radial-gradient(circle at 50% 100%,rgba(122,60,255,.07),transparent 40%)}
.adaptive-category-card{
  border-color:color-mix(in srgb,var(--category-color) 42%,#202a3d);
  border-radius:8px;
  background:linear-gradient(110deg,color-mix(in srgb,var(--category-color) 11%,#0d121b),#0d121b 72%);
  box-shadow:inset 2px 0 0 color-mix(in srgb,var(--category-color) 70%,transparent);
}
.adaptive-category-card:hover{
  border-color:var(--category-color);
  box-shadow:inset 3px 0 0 var(--category-color),0 16px 40px color-mix(in srgb,var(--category-color) 10%,rgba(0,0,0,.35));
  transform:translateY(-2px);
}
.adaptive-category-card>i{color:var(--category-color);background:color-mix(in srgb,var(--category-color) 14%,transparent)}

/* Arquivos, páginas e artigos */
.page-hero,.author-hero{
  background:
    radial-gradient(circle at 8% 15%,rgba(0,200,255,.1),transparent 28%),
    radial-gradient(circle at 85% 15%,rgba(122,60,255,.09),transparent 32%),
    linear-gradient(180deg,#0b1019,#080b12);
  border-color:#1e2839;
}
.category-hero{border-top-color:var(--category-color)}
.article-header h1,.page-hero h1,.author-profile h1{color:#f5f7fb;text-wrap:balance}
.article-deck{color:#b1bbc9}
.article-media img,.author-box{border-color:#29354b;background:#0c111a;border-radius:8px}
.article-content a,.prose-page a:not(.button){color:#6fdcff}
.article-content blockquote{border-left-color:var(--h18-violet);background:linear-gradient(90deg,rgba(122,60,255,.11),rgba(13,18,27,.72));color:#eef2f8}
.article-content h2,.article-content h3{position:relative}
.tag-list a:hover,.author-box a,.breadcrumbs a:hover{border-color:var(--h18-cyan);color:var(--h18-cyan)}
.page-item.active .page-link{border-color:var(--h18-blue);background:linear-gradient(135deg,var(--h18-blue),var(--h18-violet));color:#fff}

/* Rodapé */
.site-footer{background:#070a10;border-top:1px solid #222c3e}
.site-footer::before{content:"";display:block;height:1px;background:linear-gradient(90deg,transparent,var(--h18-cyan),var(--h18-violet),transparent);opacity:.7}
.footer-brand{font-size:27px}
.footer-column a:hover,.footer-mini-socials a:hover{color:var(--h18-cyan)}

/* Estados e acessibilidade */
.skip-link{background:linear-gradient(115deg,var(--h18-blue),var(--h18-violet));color:#fff}
.flash-public{border-color:rgba(0,200,255,.35);background:rgba(0,200,255,.08)}
.error-page{background:radial-gradient(circle at center,rgba(122,60,255,.08),transparent 38%),var(--h18-bg)}
.error-page>span{color:var(--h18-cyan)}

@media(max-width:1180px){
  .main-nav{gap:20px}.main-nav a,.nav-more summary{font-size:11px}
  .post-card-feature{min-height:390px}.post-card-feature .post-card-body{min-height:390px}
}
@media(max-width:900px){
  .header-main{min-height:64px}.main-nav{top:64px;height:auto;background:rgba(5,8,14,.98);border-color:#263148}
  .brand-word{font-size:29px}.brand-word::after{font-size:6px}
  .main-nav a.active::after{display:none}
  .post-card-feature{min-height:370px}.post-card-feature .post-card-body{min-height:370px}
}
@media(max-width:620px){
  .site-header::before{display:none}.brand-word{font-size:25px}.brand-word::after{display:none}
  .home-hero-v3{padding-top:14px}.post-card-feature{min-height:465px}.post-card-feature .post-card-body{min-height:465px;padding:24px}
  .post-card-feature h3{font-size:25px}.post-card-side{min-height:118px}
  .section-heading-v3>div{padding-left:12px}
}

/* =========================================================
   V18.2 — COMPOSIÇÃO FIEL AO PROTÓTIPO APROVADO
   ========================================================= */
.header-main{min-height:88px;grid-template-columns:minmax(270px,1fr) auto minmax(210px,1fr)}
.brand-word{
  width:260px;
  height:76px;
  padding:0;
  margin:0;
  overflow:visible;
  font-size:0;
  line-height:0;
  transform:none;
  filter:drop-shadow(0 7px 17px rgba(0,0,0,.48));
  background:url('/assets/hertemus-logo-v18.png') left center/contain no-repeat;
  -webkit-text-fill-color:transparent;
}
.brand-word::after{content:none!important;display:none!important}
.main-nav{height:88px}
.main-nav a.active::after{bottom:-32px}

.home-hero-v3{padding-top:21px}
.home-hero-grid{grid-template-columns:minmax(0,1.62fr) minmax(390px,.95fr);gap:16px}
.home-hero-side{gap:16px}
.post-card-feature{position:relative;min-height:445px;display:block}
.post-card-feature .post-card-image{position:absolute!important;inset:0!important;display:block;width:100%;height:100%;aspect-ratio:auto}
.post-card-feature .post-card-body{
  position:absolute!important;
  z-index:5;
  left:0!important;
  right:0!important;
  bottom:0!important;
  width:100%!important;
  min-height:0!important;
  margin:0!important;
  padding:88px 34px 26px!important;
  justify-content:flex-end!important;
  background:linear-gradient(0deg,rgba(3,6,11,.98) 0,rgba(3,6,11,.78) 48%,transparent 100%);
}
.post-card-feature .post-card-shade{background:linear-gradient(0deg,rgba(3,6,11,.95),rgba(3,6,11,.08) 72%),linear-gradient(90deg,rgba(0,200,255,.025),transparent 55%,rgba(122,60,255,.04))}
.post-card-feature h3{max-width:810px;margin-bottom:10px;font-size:30px;line-height:1.16;text-wrap:balance}
.post-card-feature p{max-width:730px;margin-bottom:13px;font-size:13px;line-height:1.48;-webkit-line-clamp:2}
.post-card-feature .post-meta{margin-top:5px}
.post-card-feature .category-label{left:18px;top:18px;bottom:auto}

.post-card-side{position:relative;display:block;min-height:214px;overflow:hidden}
.post-card-side .post-card-image{position:absolute!important;inset:0!important;width:100%;height:100%;min-height:0!important;aspect-ratio:auto;grid-column:auto;grid-row:auto}
.post-card-side .post-card-image img{width:100%;height:100%;object-fit:cover}
.post-card-side .post-card-shade{background:linear-gradient(90deg,rgba(4,7,12,.97) 0,rgba(4,7,12,.83) 42%,rgba(4,7,12,.2) 75%,rgba(4,7,12,.08))}
.post-card-side .post-card-body{
  position:relative;
  z-index:5;
  width:62%;
  min-height:214px;
  padding:24px 22px!important;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.post-card-side h3{font-size:18px;line-height:1.28;text-wrap:balance}
.post-card-side .category-label{left:16px;right:auto;top:15px}

@media(max-width:1180px){
  .header-main{grid-template-columns:minmax(230px,1fr) auto minmax(170px,1fr)}
  .brand-word{width:225px;height:68px}.main-nav{gap:17px}.main-nav a{font-size:10px}
  .home-hero-grid{grid-template-columns:minmax(0,1.45fr) minmax(330px,.85fr)}
}
@media(max-width:900px){
  .header-main{min-height:72px}.brand-word{width:220px;height:64px}.main-nav{height:auto;top:72px}
  .home-hero-grid{grid-template-columns:1fr}.home-hero-side{display:grid;grid-template-columns:1fr 1fr}
  .post-card-side .post-card-body{width:72%}
}
@media(max-width:620px){
  .header-main{min-height:64px}.brand-word{width:185px;height:56px}
  .home-hero-side{grid-template-columns:1fr}.post-card-feature{min-height:460px}
  .post-card-feature .post-card-body{padding:95px 20px 22px!important}.post-card-feature h3{font-size:24px}
  .post-card-side{min-height:190px}.post-card-side .post-card-body{width:78%;min-height:190px;padding:22px 17px!important}
}