/* Vaya CRACK Editorial — main stylesheet */

@font-face{font-family:'Bitter';src:url('fonts/bitter-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:'Bitter';src:url('fonts/bitter-900.woff2') format('woff2');font-weight:900;font-style:normal;font-display:swap;}
@font-face{font-family:'IBM Plex Sans';src:url('fonts/plex-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'IBM Plex Sans';src:url('fonts/plex-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:'IBM Plex Sans';src:url('fonts/plex-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:'IBM Plex Sans';src:url('fonts/plex-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap;}

:root{
  --bg:#F3EEE2;
  --surface:#FFFFFF;
  --ink:#18140F;
  --accent:#E23425;
  --accent-ink:#FBF5EA;
  --muted:#6B6355;
  --line:#D9D2C2;
  --font-heading:'Bitter', Georgia, serif;
  --font-body:'IBM Plex Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --sp-sm:8px; --sp-md:20px; --sp-lg:40px; --sp-xl:80px;
  --r-sm:6px; --r-md:14px; --r-pill:999px;
  --container:1280px;
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto;}}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  font-weight:400;
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block;}
body a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
button{font-family:inherit;cursor:pointer;}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}

.screen-reader-text{
  position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.skip-link{position:fixed;top:-100px;left:8px;z-index:10000;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:var(--r-sm);}
.skip-link:focus{top:8px;}

.container{max-width:var(--container);margin:0 auto;padding:0 var(--sp-md);}

h1,h2,h3,h4{
  font-family:var(--font-heading);
  font-weight:900;
  line-height:1.06;
  margin:0 0 var(--sp-sm);
  color:var(--ink);
}
p{margin:0 0 var(--sp-md);}

/* subtle graph-paper grid background, used only on hero + section heads */
.bg-grid{
  background-color:var(--bg);
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:32px 32px;
  background-position:center top;
}

/* tags / badges */
.tag{
  display:inline-flex;align-items:center;
  font-family:var(--font-body);font-weight:600;font-size:12px;letter-spacing:.04em;text-transform:uppercase;
  padding:6px 14px;border-radius:var(--r-pill);
  background:var(--ink);color:var(--bg);
}
.tag--accent{background:var(--accent);color:var(--accent-ink);}
a.tag{transition:background .15s ease;}
a.tag:hover{background:var(--accent);color:var(--accent-ink);}

.badge{
  position:absolute;top:12px;left:12px;
  font-family:var(--font-body);font-weight:600;font-size:11px;letter-spacing:.04em;text-transform:uppercase;
  padding:5px 12px;border-radius:var(--r-pill);
  background:var(--ink);color:var(--bg);
}

.btn{
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font-body);font-weight:600;font-size:14px;
  padding:12px 24px;border-radius:var(--r-pill);
  background:var(--ink);color:var(--bg);
  transition:background .15s ease;
  border:none;
}
.btn:hover{background:var(--accent);color:var(--accent-ink);}

.eyebrow{
  display:block;font-family:var(--font-body);font-weight:600;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);
  margin-bottom:var(--sp-sm);
}

.dot{margin:0 6px;color:var(--muted);}

.link-arrow{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--font-body);font-weight:600;font-size:14px;
  border-bottom:2px solid var(--ink);padding-bottom:2px;
  transition:border-color .15s ease,color .15s ease;
}
.link-arrow:hover{color:var(--accent);border-color:var(--accent);}

/* ===== Header ===== */
.site-header{
  background-color:var(--bg);
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:32px 32px;
  background-position:center top;
  border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:100;
}
.site-header__inner{
  display:flex;align-items:center;gap:var(--sp-md);
  padding:10px var(--sp-md);
}
.site-brand{display:flex;align-items:center;flex-shrink:0;}
.site-brand__text{
  font-family:var(--font-heading);font-weight:900;font-size:22px;letter-spacing:-.01em;
}
.site-brand img{max-height:64px;width:auto;display:block;}

.site-nav{flex:1 1 auto;min-width:0;}
.site-nav__list{display:flex;flex-wrap:nowrap;gap:4px;}
.site-nav__list li{position:relative;}
.site-nav__list > li > a{
  display:block;padding:10px 16px;border-radius:var(--r-pill);
  font-weight:700;font-size:15px;letter-spacing:.03em;text-transform:uppercase;color:var(--ink);
  transition:background .15s ease,color .15s ease;
  white-space:nowrap;
}
.site-nav__list > li > a:hover,
.site-nav__list > li.current-menu-item > a{
  background:var(--ink);color:var(--bg);
}
.site-nav__list .icon{display:none;}

/* dropdown submenus (2nd and 3rd level) */
.site-nav__list .sub-menu{
  display:none;flex-direction:column;
  position:absolute;top:100%;left:0;
  min-width:200px;margin-top:4px;padding:6px;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);
  box-shadow:0 12px 24px -12px rgba(24,20,15,.25);
  z-index:200;gap:0;
}
.site-nav__list li:hover > .sub-menu,
.site-nav__list li:focus-within > .sub-menu{display:flex;}
.site-nav__list .sub-menu .sub-menu{top:0;left:100%;margin-top:0;margin-left:4px;}
.site-nav__list .sub-menu a{
  display:block;padding:8px 12px;border-radius:var(--r-sm);
  font-weight:500;font-size:14px;color:var(--ink);white-space:nowrap;
}
.site-nav__list .sub-menu a:hover{background:var(--bg);color:var(--ink);}

.site-search{
  display:flex;align-items:center;
  background:var(--bg);border:1px solid var(--line);border-radius:var(--r-pill);
  padding:6px 6px 6px 16px;flex-shrink:0;
}
.site-search__field{
  border:none;background:transparent;font-family:var(--font-body);font-size:14px;color:var(--ink);
  width:160px;max-width:30vw;
}
.site-search__field:focus{outline:none;}
.site-search__submit{
  display:flex;align-items:center;justify-content:center;
  width:32px;height:32px;border-radius:50%;border:none;background:var(--ink);color:var(--bg);
}
.site-search__submit:hover{background:var(--accent);color:var(--accent-ink);}

.nav-toggle{
  display:none;background:none;border:none;padding:8px;
}
.nav-toggle__bars{display:flex;flex-direction:column;gap:4px;width:22px;}
.nav-toggle__bars span{display:block;height:2px;background:var(--ink);border-radius:2px;}
.nav-toggle .toggle-text{display:none;}

/* reuse Orbital's modal-menu markup, restyled */
.menu-modal{
  position:fixed;inset:0;z-index:200;background:var(--bg);
  transform:translateY(-100%);transition:transform .25s ease;
  overflow-y:auto;
}
.showing-menu-modal .menu-modal{transform:translateY(0);}
@media (prefers-reduced-motion: reduce){.menu-modal{transition:none;}}
.menu-modal .menu-top{padding:20px var(--sp-md);}
.menu-modal .close-nav-toggle{
  background:var(--ink);color:var(--bg);border:none;border-radius:var(--r-pill);
  padding:10px 16px;font-weight:600;margin-bottom:var(--sp-lg);
}
.menu-modal .modal-menu{display:flex;flex-direction:column;gap:4px;}
.menu-modal .modal-menu a{
  font-family:var(--font-heading);font-weight:900;font-size:28px;padding:10px 0;display:block;border-bottom:1px solid var(--line);
}
.menu-modal .modal-menu a:hover{color:var(--accent);}
.site-overlay{position:fixed;inset:0;background:rgba(24,20,15,.4);opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:150;}
.showing-menu-modal .site-overlay{opacity:1;pointer-events:auto;}

@media (max-width:900px){
  .site-nav{display:none;}
  .nav-toggle{display:flex;}
  .site-search__field{width:110px;}
}
@media (max-width:600px){
  .site-search{display:none;}
}

/* ===== Hero ===== */
.hero{padding:var(--sp-xl) 0;}
.hero__grid{
  display:grid;grid-template-columns:1.7fr 1fr;gap:var(--sp-xl);align-items:start;
}
.hero__main .tag{margin-bottom:var(--sp-md);}
.hero__title{font-size:clamp(2.4rem,5vw,4.2rem);margin:0;}
.hero__title a{transition:color .15s ease;}
.hero__title a:hover{color:var(--accent);}
.hero__aside{
  position:relative;padding-left:var(--sp-lg);padding-top:8px;
}
.hero__bar{position:absolute;left:0;top:4px;bottom:4px;width:4px;background:var(--accent);border-radius:2px;}
.hero__lead{font-weight:600;font-size:1.1rem;margin-bottom:var(--sp-sm);}
.hero__text{color:var(--muted);}

@media (max-width:900px){
  .hero__grid{grid-template-columns:1fr;gap:var(--sp-lg);}
  .hero__aside{padding-left:var(--sp-md);}
}

/* ===== News / grid ===== */
.news{padding:var(--sp-xl) 0;}
.news__head{
  display:flex;flex-direction:column;
  padding:var(--sp-lg) var(--sp-md);margin:0 calc(var(--sp-md) * -1) var(--sp-lg);
  border-radius:var(--r-md);
}
.news__head h2{font-size:clamp(1.6rem,3vw,2.4rem);margin:0;}

.news__grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-lg) var(--sp-md);
}
@media (max-width:900px){.news__grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:600px){.news__grid{grid-template-columns:1fr;}}

.card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;display:flex;flex-direction:column;
  transition:box-shadow .15s ease,transform .15s ease;
}
.card:hover{box-shadow:0 12px 24px -12px rgba(24,20,15,.25);transform:translateY(-2px);}
@media (prefers-reduced-motion: reduce){.card{transition:none;}.card:hover{transform:none;}}
.card__media{position:relative;display:block;aspect-ratio:16/10;background:var(--bg);overflow:hidden;}
.card__media img{width:100%;height:100%;object-fit:cover;}
.card__media-fallback{
  display:block;width:100%;height:100%;
  background:linear-gradient(135deg,var(--bg),var(--line));
}
.card__body{padding:var(--sp-md);display:flex;flex-direction:column;gap:6px;flex:1;}
.card__meta{
  display:flex;align-items:center;font-size:12px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:var(--muted);
  margin:0;
}
.card__title{font-size:1.15rem;margin:0;}
.card__title a:hover{color:var(--accent);}
.card__excerpt{color:var(--muted);font-size:14px;margin:0;}

/* ===== Page head (single/page/archive/search/404) ===== */
.page-head{padding:var(--sp-lg) 0;}
.page-head__title{font-size:clamp(1.9rem,4vw,3rem);}
.page-head__meta{color:var(--muted);font-size:14px;}
.breadcrumbs{font-size:13px;color:var(--muted);margin-bottom:var(--sp-sm);}
.breadcrumbs a:hover{color:var(--accent);}

/* ===== Article ===== */
.article__container{padding:var(--sp-lg) 0 var(--sp-xl);}
.article__content{max-width:760px;margin:0 auto;}
.article__cover{margin:0 0 var(--sp-lg);}
.article__cover img{border-radius:var(--r-md);}
.article__cover-credit{font-size:12px;color:var(--muted);margin-top:6px;}
.entry-content{font-size:1.05rem;line-height:1.75;}
.entry-content p{max-width:70ch;}
.entry-content h2{font-size:1.6rem;margin-top:var(--sp-lg);}
.entry-content h3{font-size:1.3rem;margin-top:var(--sp-md);}
.entry-content img{border-radius:var(--r-md);}
.entry-content a{color:var(--accent);text-decoration:underline;text-underline-offset:2px;}
.article__tags{display:flex;flex-wrap:wrap;gap:8px;margin:var(--sp-lg) 0;}
.article__tags .tag{background:var(--bg);color:var(--ink);border:1px solid var(--line);}
.article__tags .tag:hover{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);}

.related{margin-top:var(--sp-xl);padding-top:var(--sp-lg);border-top:1px solid var(--line);}
.related__title{font-size:1.4rem;}

/* ===== Footer ===== */
.site-footer{background:var(--ink);color:var(--bg);margin-top:var(--sp-xl);}
.site-footer__inner{
  display:flex;flex-wrap:wrap;gap:var(--sp-lg);justify-content:space-between;
  padding:var(--sp-xl) var(--sp-md) var(--sp-lg);
}
.site-footer__name{font-family:var(--font-heading);font-weight:900;font-size:1.4rem;display:block;}
.site-footer__desc{color:#B8B0A0;margin-top:4px;max-width:320px;}
.site-footer__nav{display:flex;flex-wrap:wrap;gap:8px 18px;max-width:520px;}
.site-footer__nav a{color:#D9D2C2;font-weight:500;font-size:14px;}
.site-footer__nav a:hover{color:var(--accent);}
.site-footer__bottom{border-top:1px solid rgba(255,255,255,.12);}
.site-footer__bottom .container{padding:var(--sp-md);}
.site-footer__bottom p{margin:0;color:#8A8272;font-size:13px;}

/* ===== Forms / search / comments / pagination ===== */
.search-form{display:flex;gap:8px;max-width:420px;}
.search-field{
  flex:1;padding:12px 18px;border:1px solid var(--line);border-radius:var(--r-pill);
  font-family:var(--font-body);font-size:14px;background:var(--surface);color:var(--ink);
}
.search-submit{border:none;border-radius:var(--r-pill);padding:12px 22px;background:var(--ink);color:var(--bg);font-weight:600;}
.search-submit:hover{background:var(--accent);}

.pagination{display:flex;justify-content:center;gap:8px;margin-top:var(--sp-lg);flex-wrap:wrap;}
.pagination a,.pagination span{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:40px;height:40px;padding:0 12px;border-radius:var(--r-pill);
  border:1px solid var(--line);font-weight:600;font-size:14px;
}
.pagination .current{background:var(--ink);color:var(--bg);border-color:var(--ink);}
.pagination a:hover{border-color:var(--accent);color:var(--accent);}

.comments-area{max-width:760px;margin:var(--sp-xl) auto 0;}
.comments-area .comment-list{margin-top:var(--sp-lg);}
.comments-area .comment-list li{padding:var(--sp-md) 0;border-top:1px solid var(--line);}
.comment-form input[type="text"],.comment-form input[type="email"],.comment-form input[type="url"],.comment-form textarea{
  width:100%;padding:12px 16px;border:1px solid var(--line);border-radius:var(--r-sm);
  font-family:var(--font-body);margin-bottom:var(--sp-sm);background:var(--surface);color:var(--ink);
}
.comment-form textarea{min-height:120px;}

.error-404{text-align:center;padding:var(--sp-xl) 0;max-width:560px;margin:0 auto;}
.error-404 .tag{margin-bottom:var(--sp-md);}
.error-404__text{color:var(--muted);margin-bottom:var(--sp-lg);}
.error-404 .search-form{margin:0 auto var(--sp-lg);}

.archive-description{color:var(--muted);max-width:70ch;margin:var(--sp-lg) 0;}

/* ===== Ficha del entrevistado ===== */
.ficha{
  margin:var(--sp-xl) 0;padding:var(--sp-lg);
  background:var(--bg);border:1px solid var(--line);border-radius:var(--r-md);
}
.ficha__title{font-size:1.3rem;margin:0 0 var(--sp-md);}
.ficha__list{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-sm) var(--sp-lg);margin:0;}
.ficha__row{padding:10px 0;border-top:1px solid var(--line);}
.ficha__row dt{font-size:12px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:var(--muted);margin:0 0 2px;}
.ficha__row dd{margin:0;font-weight:500;}
@media (max-width:600px){.ficha__list{grid-template-columns:1fr;}}

/* ===== Entrevistas hub ===== */
.page-head__intro{max-width:70ch;color:var(--muted);margin-top:var(--sp-sm);font-weight:600;font-size:1.05rem;}
.page-head__intro a{color:var(--ink);text-decoration:underline;text-underline-offset:2px;}
.page-head__intro a:hover{color:var(--accent);}
.vc-subnav{margin:var(--sp-lg) 0;}
.vc-index-list{display:flex;flex-wrap:wrap;gap:10px;padding:var(--sp-lg) 0 var(--sp-xl);}
.vc-subnav .vc-index-list{padding-top:var(--sp-sm);padding-bottom:0;}
.vc-index-list .tag{font-size:14px;padding:10px 18px;gap:6px;}
.vc-index-count{opacity:.7;}
.page-head__intro + .search-form{margin-top:var(--sp-md);max-width:480px;}
.entrevistas-group{padding-top:0;}
.entrevistas-group .news__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:var(--sp-sm);}
.entrevistas-group .news__head h2{margin:0;}
