/*
Theme Name: México Subterráneo Vanguard
Theme URI: https://www.mexicosubterraneo.site/
Author: FactoriaDigital
Author URI: https://factoriadigital.store/
Description: Tema editorial vanguardista, asimétrico y oscuro para México Subterráneo. Hero con categoría Portada, secciones por categorías existentes, arquitectura SEO, widgets publicitarios y páginas institucionales.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mexico-subterraneo-vanguard
Tags: news, blog, grid-layout, custom-logo, featured-images, footer-widgets
*/

:root{
  --ms-black:#050506;
  --ms-ink:#0b0c0f;
  --ms-concrete:#17191f;
  --ms-tunnel:#22252e;
  --ms-bone:#f1eee8;
  --ms-muted:#a6a6a6;
  --ms-neon:#39ffb5;
  --ms-acid:#d8ff3d;
  --ms-ember:#ff4d2e;
  --ms-gold:#c8a24a;
  --ms-line:rgba(255,255,255,.12);
  --ms-glow:0 0 34px rgba(57,255,181,.22);
  --ms-wrap:min(1360px, calc(100vw - 36px));
  --ms-radius:28px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ms-bone);
  background:
    radial-gradient(circle at 20% 10%, rgba(57,255,181,.12), transparent 30%),
    radial-gradient(circle at 85% 18%, rgba(255,77,46,.10), transparent 26%),
    linear-gradient(180deg, #050506 0%, #08090b 45%, #0b0c0f 100%);
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height:1.55;
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.075;
  z-index:-1;
  background-image:
    linear-gradient(90deg, rgba(255,255,255,.8) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,.8) 1px, transparent 1px);
  background-size:60px 60px;
  mask-image:linear-gradient(to bottom, #000 0%, transparent 80%);
}

a{color:inherit;text-decoration:none}
a:hover{color:var(--ms-neon)}
img{max-width:100%;height:auto;display:block}
button,input,textarea,select{font:inherit}

.screen-reader-text,.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{left:20px;top:20px;width:auto;height:auto;padding:10px 14px;z-index:999;background:#fff;color:#000;border-radius:999px}

.ms-wrap{width:var(--ms-wrap);margin-inline:auto}
.ms-topline{
  border-bottom:1px solid var(--ms-line);
  background:linear-gradient(90deg, rgba(57,255,181,.09), rgba(255,77,46,.08));
  font-size:.77rem;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.ms-topline-inner{display:flex;gap:18px;align-items:center;justify-content:space-between;padding:9px 0;color:rgba(241,238,232,.78)}
.ms-pulse{display:inline-flex;align-items:center;gap:8px}
.ms-pulse:before{content:"";width:8px;height:8px;background:var(--ms-neon);border-radius:50%;box-shadow:0 0 18px var(--ms-neon)}

.ms-site-header{
  position:sticky;
  top:0;
  z-index:100;
  backdrop-filter:blur(18px);
  background:rgba(5,5,6,.78);
  border-bottom:1px solid var(--ms-line);
}
.ms-header-inner{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:18px 0}
.ms-brand{display:flex;align-items:center;gap:15px;min-width:270px}
.ms-brand svg{width:min(330px, 62vw);height:auto;filter:drop-shadow(0 0 18px rgba(57,255,181,.17))}
.ms-brand-text{display:none}
.ms-slogan{font-size:.78rem;color:var(--ms-muted);letter-spacing:.11em;text-transform:uppercase;margin-top:2px}
.ms-primary-nav{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.ms-primary-nav ul{display:flex;align-items:center;justify-content:flex-end;gap:8px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.ms-primary-nav a{
  display:block;
  padding:9px 12px;
  color:rgba(241,238,232,.82);
  font-weight:800;
  font-size:.78rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  border:1px solid transparent;
  border-radius:999px;
}
.ms-primary-nav a:hover,.ms-primary-nav .current-cat a{border-color:rgba(57,255,181,.42);background:rgba(57,255,181,.08);color:#fff}
.ms-header-cta{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(216,255,61,.38);background:linear-gradient(135deg,rgba(216,255,61,.14),rgba(57,255,181,.09));padding:10px 14px;border-radius:999px;font-size:.77rem;text-transform:uppercase;letter-spacing:.12em;font-weight:900;color:#fff;white-space:nowrap}

.ms-section{margin:34px auto}
.ms-section-head{display:flex;align-items:end;justify-content:space-between;gap:22px;margin-bottom:18px;border-top:1px solid var(--ms-line);padding-top:22px}
.ms-eyebrow{display:inline-flex;gap:8px;align-items:center;color:var(--ms-neon);font-size:.78rem;font-weight:900;letter-spacing:.15em;text-transform:uppercase}
.ms-eyebrow:before{content:"";width:34px;height:2px;background:var(--ms-neon);box-shadow:var(--ms-glow)}
h1,h2,h3,h4{line-height:.98;margin:0;font-family:"Arial Narrow", Impact, Haettenschweiler, 'Roboto Condensed', sans-serif;letter-spacing:-.04em;text-transform:uppercase}
.ms-section-title{font-size:clamp(2rem, 5vw, 5.4rem)}
.ms-section-desc{max-width:620px;color:rgba(241,238,232,.68);font-size:1rem;margin:8px 0 0}

.ms-hero{padding:34px 0 10px}
.ms-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.32fr) minmax(280px,.68fr);
  gap:20px;
  align-items:stretch;
}
.ms-hero-main{
  position:relative;
  min-height:620px;
  overflow:hidden;
  border:1px solid var(--ms-line);
  background:#111;
  border-radius:var(--ms-radius);
  clip-path:polygon(0 0, 100% 0, 96% 100%, 0 94%);
}
.ms-hero-main .ms-thumb{position:absolute;inset:0;z-index:0}
.ms-hero-main img{width:100%;height:100%;object-fit:cover;filter:grayscale(.1) contrast(1.08) brightness(.67)}
.ms-hero-main:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,5,6,.15),rgba(5,5,6,.72) 58%,rgba(5,5,6,.95));z-index:1}
.ms-hero-content{position:absolute;inset:auto 34px 36px 34px;z-index:2;max-width:860px}
.ms-kicker{display:inline-flex;align-items:center;gap:8px;background:rgba(5,5,6,.72);border:1px solid rgba(57,255,181,.45);padding:8px 12px;border-radius:999px;color:var(--ms-neon);font-size:.75rem;font-weight:900;letter-spacing:.16em;text-transform:uppercase;margin-bottom:14px}
.ms-hero-title{font-size:clamp(2.4rem, 7vw, 7.5rem);max-width:980px;text-shadow:0 6px 30px rgba(0,0,0,.55)}
.ms-hero-excerpt{max-width:720px;font-size:1.05rem;color:rgba(241,238,232,.86);margin:16px 0 22px}
.ms-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--ms-neon);color:#05100b!important;border-radius:999px;padding:12px 17px;font-weight:1000;letter-spacing:.08em;text-transform:uppercase;font-size:.78rem;box-shadow:var(--ms-glow)}
.ms-button:hover{background:var(--ms-acid);color:#000!important}
.ms-hero-stack{display:grid;grid-template-rows:repeat(3,1fr);gap:20px}
.ms-hero-mini{position:relative;overflow:hidden;min-height:190px;border:1px solid var(--ms-line);border-radius:22px;background:#101216}
.ms-hero-mini:nth-child(2){clip-path:polygon(5% 0,100% 0,100% 93%,0 100%,0 8%)}
.ms-hero-mini img{width:100%;height:100%;object-fit:cover;opacity:.52;filter:grayscale(.25) contrast(1.2)}
.ms-hero-mini .ms-mini-content{position:absolute;inset:auto 18px 18px 18px;z-index:2}
.ms-hero-mini:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(0,0,0,.88))}
.ms-hero-mini h3{font-size:1.55rem;letter-spacing:-.03em}
.ms-date{font-size:.76rem;color:var(--ms-muted);letter-spacing:.08em;text-transform:uppercase;font-weight:800;margin-top:10px}

.ms-ad{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(216,255,61,.28);
  background:
    linear-gradient(135deg, rgba(216,255,61,.13), rgba(255,77,46,.09)),
    repeating-linear-gradient(135deg, rgba(255,255,255,.06) 0 1px, transparent 1px 11px),
    #111319;
  min-height:112px;
  border-radius:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  box-shadow:0 24px 70px rgba(0,0,0,.28);
}
.ms-ad:before{content:"";position:absolute;inset:-80px auto auto -80px;width:220px;height:220px;border-radius:50%;background:rgba(57,255,181,.16);filter:blur(8px)}
.ms-ad strong{position:relative;z-index:1;font-family:Impact,"Arial Narrow",sans-serif;font-size:clamp(1.8rem,4vw,4.8rem);line-height:1;letter-spacing:.05em;text-transform:uppercase;color:#fff;text-shadow:0 0 20px rgba(57,255,181,.35)}
.ms-widget-space{margin:28px auto}
.ms-widget-inner > *{margin:0}

.ms-category-grid{
  display:grid;
  grid-template-columns:1.07fr .93fr;
  gap:20px;
}
.ms-category-grid.reverse{grid-template-columns:.93fr 1.07fr}
.ms-post-card{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018));
  border:1px solid var(--ms-line);
  border-radius:24px;
  transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.ms-post-card:hover{transform:translateY(-4px);border-color:rgba(57,255,181,.4);box-shadow:0 22px 60px rgba(0,0,0,.35)}
.ms-card-large{min-height:100%}
.ms-card-large{clip-path:polygon(0 0,100% 0,100% 92%,92% 100%,0 100%)}
.ms-card-thumb{background:linear-gradient(135deg,#161922,#2a2e39);aspect-ratio:16/9;overflow:hidden}
.ms-card-thumb img{width:100%;height:100%;object-fit:cover;filter:contrast(1.05) saturate(1.03)}
.ms-card-body{padding:18px}
.ms-card-large .ms-card-body{padding:24px}
.ms-card-cat{color:var(--ms-neon);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:1000;margin-bottom:10px}
.ms-card-title{font-size:clamp(1.35rem,2.2vw,2.85rem);letter-spacing:-.035em}
.ms-card-small .ms-card-title{font-size:1.38rem}
.ms-card-excerpt{color:rgba(241,238,232,.72);margin:10px 0 0;font-size:.96rem}
.ms-card-small .ms-card-excerpt{font-size:.89rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ms-small-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.ms-section:nth-of-type(even) .ms-post-card{background:linear-gradient(180deg,rgba(57,255,181,.05),rgba(255,255,255,.018))}
.ms-section:nth-of-type(odd) .ms-post-card{background:linear-gradient(180deg,rgba(255,77,46,.05),rgba(255,255,255,.018))}

.ms-empty{border:1px dashed rgba(255,255,255,.24);border-radius:24px;padding:28px;color:var(--ms-muted);background:rgba(255,255,255,.03)}
.ms-pagination{margin:36px 0;display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.ms-pagination a,.ms-pagination span{padding:9px 13px;border:1px solid var(--ms-line);border-radius:999px;background:rgba(255,255,255,.04);font-weight:900}
.ms-pagination .current{background:var(--ms-neon);color:#00130c}

.ms-archive-hero,.ms-page-hero,.ms-single-hero{padding:42px 0 18px;border-bottom:1px solid var(--ms-line);margin-bottom:28px;background:linear-gradient(90deg,rgba(57,255,181,.06),transparent)}
.ms-archive-title,.ms-page-title,.ms-single-title{font-size:clamp(2.5rem,7vw,7.2rem);max-width:1120px}
.ms-archive-desc,.ms-page-desc{max-width:760px;color:rgba(241,238,232,.72);font-size:1.05rem;margin-top:14px}
.ms-post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:28px 0 44px}
.ms-content-shell{width:min(900px,calc(100vw - 36px));margin:0 auto 44px}
.ms-single-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;color:var(--ms-muted);font-weight:800;text-transform:uppercase;font-size:.8rem;letter-spacing:.08em}
.ms-single-image{width:var(--ms-wrap);margin:0 auto 28px;border-radius:28px;overflow:hidden;border:1px solid var(--ms-line);max-height:620px}
.ms-single-image img{width:100%;height:100%;object-fit:cover}
.ms-content{font-size:1.08rem;color:rgba(241,238,232,.88)}
.ms-content p{margin:0 0 1.15em}
.ms-content h2,.ms-content h3{margin:1.4em 0 .55em;color:#fff}
.ms-content a{text-decoration:underline;text-decoration-color:rgba(57,255,181,.6);text-underline-offset:4px}
.ms-content blockquote{margin:28px 0;padding:22px 24px;border-left:4px solid var(--ms-neon);background:rgba(57,255,181,.06);border-radius:0 20px 20px 0;font-size:1.25rem}
.ms-author-box{border:1px solid var(--ms-line);border-radius:24px;padding:20px;margin:32px 0;background:rgba(255,255,255,.035)}
.ms-author-box strong{display:block;font-size:1.1rem;color:#fff}
.ms-tags{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0}
.ms-tags a{padding:7px 10px;border:1px solid var(--ms-line);border-radius:999px;color:var(--ms-muted);font-size:.82rem;font-weight:800}

.ms-footer{margin-top:54px;border-top:1px solid var(--ms-line);background:#050506}
.ms-footer-widgets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding:34px 0}
.ms-footer-widget{min-height:150px}
.ms-footer-main{display:grid;grid-template-columns:1fr 1.4fr;gap:28px;border-top:1px solid var(--ms-line);padding:34px 0}
.ms-footer-logo svg{width:260px;max-width:100%}
.ms-footer p{color:rgba(241,238,232,.65);margin:10px 0 0}
.ms-footer-menu ul{list-style:none;margin:0;padding:0;columns:2;column-gap:30px}
.ms-footer-menu li{break-inside:avoid;margin:0 0 9px}
.ms-footer-menu a{color:rgba(241,238,232,.76);font-weight:800;font-size:.93rem}
.ms-credit{border-top:1px solid var(--ms-line);padding:15px 0;color:rgba(241,238,232,.52);font-size:.86rem;display:flex;gap:12px;justify-content:space-between;flex-wrap:wrap}
.ms-credit a{color:var(--ms-neon);font-weight:900}

.search-form{display:flex;gap:8px;margin-top:18px}
.search-field{width:100%;background:rgba(255,255,255,.06);border:1px solid var(--ms-line);border-radius:999px;color:#fff;padding:12px 15px}
.search-submit{background:var(--ms-neon);border:0;border-radius:999px;padding:12px 16px;font-weight:1000;cursor:pointer;color:#05100b}

@media (max-width: 1040px){
  .ms-header-inner{align-items:flex-start;flex-direction:column}
  .ms-primary-nav{justify-content:flex-start}
  .ms-hero-grid,.ms-category-grid,.ms-category-grid.reverse,.ms-footer-main{grid-template-columns:1fr}
  .ms-hero-main{min-height:520px;clip-path:none}
  .ms-hero-stack{grid-template-columns:repeat(3,1fr);grid-template-rows:auto}
  .ms-post-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 720px){
  :root{--ms-wrap:calc(100vw - 24px)}
  .ms-topline-inner{flex-direction:column;align-items:flex-start;gap:5px}
  .ms-header-inner{gap:12px;padding:14px 0}
  .ms-primary-nav ul{gap:5px}
  .ms-primary-nav a{font-size:.7rem;padding:8px 9px}
  .ms-header-cta{display:none}
  .ms-hero{padding-top:18px}
  .ms-hero-main{min-height:460px;border-radius:20px}
  .ms-hero-content{inset:auto 18px 22px 18px}
  .ms-hero-excerpt{font-size:.95rem}
  .ms-hero-stack,.ms-small-grid,.ms-post-grid,.ms-footer-widgets{grid-template-columns:1fr}
  .ms-hero-mini{min-height:220px;clip-path:none!important}
  .ms-section-head{align-items:flex-start;flex-direction:column}
  .ms-footer-menu ul{columns:1}
}