/*
Theme Name: Dato Crudo
Theme URI: https://www.datocrudo.site/
Author: FactoriaDigital
Author URI: https://factoriadigital.store/
Description: Tema editorial vanguardista para periodismo narrativo, crónica urbana e investigación profunda en Ciudad de México. Incluye arquitectura comercial, directorio, páginas institucionales, espacios publicitarios y portada dinámica por categorías existentes.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: datocrudo
*/

:root {
  --dc-black: #070706;
  --dc-ink: #12100c;
  --dc-ink-soft: #1e1b15;
  --dc-gold: #a77b2b;
  --dc-gold-bright: #d6a84a;
  --dc-ivory: #f3efe5;
  --dc-paper: #fffaf0;
  --dc-muted: #8a7d68;
  --dc-line: rgba(167, 123, 43, 0.32);
  --dc-danger: #c9472d;
  --dc-radius: 26px;
  --dc-shadow: 0 30px 80px rgba(0, 0, 0, 0.24);
  --dc-max: 1320px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background:
    radial-gradient(circle at top left, rgba(167,123,43,.16), transparent 34rem),
    linear-gradient(180deg, #0b0a08 0%, #18130c 18%, #f1eadc 18%, #f1eadc 100%);
  color: var(--dc-ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.58;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
a:hover { color: var(--dc-gold); }
img { max-width: 100%; height: auto; display: block; }

.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
}

.dc-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 4px;
  width: 0%;
  background: linear-gradient(90deg, var(--dc-gold), var(--dc-gold-bright));
  z-index: 9999;
}

.dc-site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  color: var(--dc-ivory);
  transition: transform .35s ease, background .35s ease, box-shadow .35s ease;
  background: rgba(7,7,6,.88);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(167,123,43,.25);
}
.dc-site-header.is-hidden { transform: translateY(-105%); }
.dc-site-header.is-scrolled { box-shadow: 0 12px 40px rgba(0,0,0,.28); }

.dc-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  max-width: var(--dc-max);
  margin: 0 auto;
  padding: .55rem 1rem;
  font-size: .76rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(243,239,229,.74);
  border-bottom: 1px solid rgba(167,123,43,.18);
}
.dc-topbar strong { color: var(--dc-gold-bright); }
.dc-date-stamp { white-space: nowrap; }

.dc-brand-row {
  max-width: var(--dc-max);
  margin: 0 auto;
  padding: 1.05rem 1rem;
  display: grid;
  grid-template-columns: 310px minmax(0, 1fr) auto;
  align-items: center;
  gap: 1.2rem;
}
.dc-logo-wrap { display: flex; align-items: center; gap: .9rem; min-width: 0; }
.dc-logo-wrap img { width: min(300px, 64vw); height: auto; }
.dc-wordmark-fallback {
  font-family: "Courier New", Courier, monospace;
  font-size: clamp(1.8rem, 4vw, 3.2rem);
  line-height: .86;
  letter-spacing: -.08em;
  color: var(--dc-ivory);
  text-transform: uppercase;
}
.dc-wordmark-fallback span { color: var(--dc-gold-bright); }
.dc-slogan {
  max-width: 560px;
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  color: rgba(243,239,229,.74);
  font-size: .98rem;
}
.dc-slogan em { color: var(--dc-gold-bright); font-style: normal; }
.dc-commercial-button,
.dc-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  padding: .88rem 1.15rem;
  background: var(--dc-gold);
  color: #080704;
  border-radius: 999px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
  box-shadow: 0 14px 34px rgba(167,123,43,.24);
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
  border: 0;
}
.dc-commercial-button:hover,
.dc-button:hover { color: #080704; background: var(--dc-gold-bright); transform: translateY(-2px); box-shadow: 0 18px 44px rgba(167,123,43,.34); }

.dc-menu-strip {
  border-top: 1px solid rgba(167,123,43,.18);
  background: rgba(0,0,0,.22);
}
.dc-primary-menu {
  max-width: var(--dc-max);
  margin: 0 auto;
  padding: 0 .7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: .08rem;
  list-style: none;
}
.dc-primary-menu ul { list-style: none; }
.dc-primary-menu li { position: relative; }
.dc-primary-menu a {
  display: block;
  padding: .82rem .72rem;
  font-size: .78rem;
  line-height: 1.2;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(243,239,229,.82);
  border-radius: 14px;
}
.dc-primary-menu a:hover { color: var(--dc-black); background: var(--dc-gold-bright); }

.dc-ad-shell { max-width: var(--dc-max); margin: 0 auto; padding: .9rem 1rem; }
.dc-ad-placeholder {
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  min-height: 110px;
  display: grid;
  place-items: center;
  text-align: center;
  color: var(--dc-ivory);
  background:
    linear-gradient(135deg, rgba(7,7,6,.88), rgba(23,20,15,.86)),
    url('assets/images/ad-tech.svg') center/cover no-repeat;
  border: 1px solid rgba(214,168,74,.46);
  box-shadow: var(--dc-shadow);
  isolation: isolate;
}
.dc-ad-placeholder::before {
  content: "";
  position: absolute;
  inset: -30%;
  background: linear-gradient(100deg, transparent 0%, rgba(214,168,74,.18) 48%, transparent 56%);
  transform: rotate(8deg);
  animation: dcScan 7s infinite linear;
  z-index: -1;
}
@keyframes dcScan {
  from { translate: -40% 0; }
  to { translate: 40% 0; }
}
.dc-ad-label {
  display: inline-block;
  font-size: .72rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--dc-gold-bright);
  margin-bottom: .2rem;
}
.dc-ad-title {
  font-family: "Courier New", Courier, monospace;
  font-size: clamp(1.4rem, 3.3vw, 3.15rem);
  line-height: .95;
  letter-spacing: -.08em;
  text-transform: uppercase;
}
.dc-ad-size { color: rgba(243,239,229,.72); font-size: .9rem; margin-top: .35rem; }
.dc-ad-970 { min-height: 250px; }
.dc-ad-728 { min-height: 90px; max-width: 728px; margin-inline: auto; }
.dc-ad-300 { min-height: 250px; }

.dc-main { max-width: var(--dc-max); margin: 0 auto; padding: 1.3rem 1rem 4rem; }
.dc-kicker {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  color: var(--dc-gold);
  font-size: .75rem;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.dc-kicker::before { content: ""; width: 32px; height: 2px; background: currentColor; }

.dc-hero {
  color: var(--dc-ivory);
  border-radius: 34px;
  overflow: hidden;
  padding: clamp(1rem, 2vw, 1.4rem);
  background:
    radial-gradient(circle at 10% 15%, rgba(214,168,74,.25), transparent 22rem),
    linear-gradient(135deg, #070706, #17120b 48%, #080704);
  border: 1px solid rgba(214,168,74,.35);
  box-shadow: var(--dc-shadow);
}
.dc-hero-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}
.dc-hero h1 {
  max-width: 760px;
  margin: .2rem 0 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 5vw, 5rem);
  line-height: .9;
  letter-spacing: -.055em;
}
.dc-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
  gap: 1rem;
}
.dc-card {
  position: relative;
  background: var(--dc-paper);
  border: 1px solid rgba(167,123,43,.22);
  border-radius: 26px;
  overflow: hidden;
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.dc-card:hover { transform: translateY(-5px); box-shadow: 0 22px 52px rgba(0,0,0,.18); border-color: rgba(167,123,43,.55); }
.dc-card .thumb { aspect-ratio: 16/9; background: #201b12; overflow: hidden; }
.dc-card .thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease, filter .5s ease; }
.dc-card:hover .thumb img { transform: scale(1.06); filter: saturate(1.1) contrast(1.05); }
.dc-card-body { padding: 1rem; }
.dc-card h2, .dc-card h3 { margin: 0 0 .5rem; line-height: 1.04; letter-spacing: -.04em; }
.dc-card h2 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.8rem, 4vw, 3.9rem); }
.dc-card h3 { font-size: clamp(1.08rem, 2vw, 1.55rem); }
.dc-card p { color: #4d4538; margin: 0; }
.dc-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-bottom: .7rem;
  font-size: .72rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--dc-gold);
  font-weight: 900;
}
.dc-hero-main { min-height: 100%; }
.dc-hero-main .thumb { aspect-ratio: 16/9; }
.dc-hero-main .dc-card-body { padding: clamp(1.1rem, 3vw, 2rem); }
.dc-hero-side { display: grid; gap: 1rem; }
.dc-hero-side .dc-card { display: grid; grid-template-columns: 42% 1fr; align-items: stretch; background: rgba(255,250,240,.96); }
.dc-hero-side .thumb { aspect-ratio: auto; min-height: 150px; }
.dc-hero-side .dc-card-body { padding: .9rem; }
.dc-hero-side h3 { font-size: 1.02rem; }
.dc-hero-side p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: .88rem; }

.dc-commercial-deck {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin: 1.1rem 0;
}
.dc-commercial-tile {
  position: relative;
  overflow: hidden;
  min-height: 176px;
  padding: 1.3rem;
  border-radius: 28px;
  background: var(--dc-black);
  color: var(--dc-ivory);
  border: 1px solid rgba(214,168,74,.32);
}
.dc-commercial-tile::after {
  content: "";
  position: absolute;
  right: -40px;
  bottom: -50px;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  border: 34px solid rgba(214,168,74,.12);
}
.dc-commercial-tile h3 { margin: .5rem 0; font-size: 1.35rem; line-height: 1.02; letter-spacing: -.04em; }
.dc-commercial-tile p { margin: 0; color: rgba(243,239,229,.72); }

.dc-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 1.2rem;
  align-items: start;
}
.dc-sections { display: grid; gap: 1.3rem; }
.dc-category-section {
  background: rgba(255,250,240,.92);
  border: 1px solid rgba(167,123,43,.24);
  border-radius: 34px;
  padding: clamp(1rem, 2.5vw, 1.45rem);
  box-shadow: 0 18px 50px rgba(30,27,21,.08);
}
.dc-section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}
.dc-section-title {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.8rem, 4vw, 3.1rem);
  line-height: .92;
  letter-spacing: -.055em;
}
.dc-section-link { color: var(--dc-gold); font-weight: 900; text-transform: uppercase; font-size: .74rem; letter-spacing: .12em; }
.dc-post-grid { display: grid; grid-template-columns: 1.1fr .9fr .9fr; gap: 1rem; }
.dc-category-section:nth-child(even) .dc-post-grid { grid-template-columns: .9fr .9fr 1.1fr; }
.dc-category-section:nth-child(3n) .dc-post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dc-post-grid .dc-card:first-child { grid-row: span 2; }
.dc-category-section:nth-child(even) .dc-post-grid .dc-card:first-child { order: 3; }
.dc-post-grid .dc-card:first-child h3 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.6rem, 3vw, 2.4rem); }
.dc-post-grid .dc-card:not(:first-child) .thumb { aspect-ratio: 16/10; }
.dc-post-grid .dc-card:not(:first-child) p { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

.dc-sidebar { position: sticky; top: 120px; display: grid; gap: 1rem; }
.dc-sidebar-box {
  background: var(--dc-black);
  color: var(--dc-ivory);
  border: 1px solid rgba(214,168,74,.32);
  border-radius: 28px;
  padding: 1.05rem;
  box-shadow: var(--dc-shadow);
}
.dc-sidebar-box h3 { margin: 0 0 .5rem; font-size: 1rem; letter-spacing: .12em; text-transform: uppercase; color: var(--dc-gold-bright); }
.dc-sidebar-box ul { margin: 0; padding-left: 1rem; }
.dc-sidebar-box li { margin: .5rem 0; color: rgba(243,239,229,.78); }

.dc-page-wrap,
.dc-single-wrap {
  max-width: 980px;
  margin: 0 auto;
  padding: 2rem 1rem 5rem;
}
.dc-page-card,
.dc-article-card {
  background: rgba(255,250,240,.96);
  border: 1px solid rgba(167,123,43,.25);
  border-radius: 34px;
  padding: clamp(1.2rem, 4vw, 3rem);
  box-shadow: var(--dc-shadow);
}
.dc-page-card h1,
.dc-article-card h1 {
  margin-top: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.1rem, 6vw, 5rem);
  line-height: .9;
  letter-spacing: -.06em;
}
.dc-entry-content { font-size: 1.06rem; }
.dc-entry-content a { color: var(--dc-gold); font-weight: 800; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.dc-entry-content h2 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.7rem, 4vw, 3rem); line-height: .98; letter-spacing: -.045em; margin-top: 2rem; }
.dc-entry-content blockquote { border-left: 5px solid var(--dc-gold); margin-left: 0; padding-left: 1rem; color: #4d4538; font-family: Georgia, "Times New Roman", serif; font-size: 1.35rem; }

.dc-directory-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1.2rem; }
.dc-person-card {
  padding: 1.15rem;
  background: #11100d;
  color: var(--dc-ivory);
  border-radius: 24px;
  border: 1px solid rgba(214,168,74,.28);
  position: relative;
  overflow: hidden;
}
.dc-person-card::before {
  content: attr(data-initials);
  position: absolute;
  right: -8px;
  top: -20px;
  font-family: "Courier New", monospace;
  font-size: 6rem;
  letter-spacing: -.12em;
  color: rgba(214,168,74,.10);
  font-weight: 900;
}
.dc-person-card h3 { margin: 0; color: var(--dc-gold-bright); font-size: 1.15rem; }
.dc-person-role { margin: .2rem 0 .55rem; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(243,239,229,.7); }
.dc-person-card p { margin: 0; color: rgba(243,239,229,.82); }

.dc-info-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1.1rem; }
.dc-info-box { background: #11100d; color: var(--dc-ivory); border-radius: 24px; padding: 1.2rem; border: 1px solid rgba(214,168,74,.26); }
.dc-info-box h3 { margin-top: 0; color: var(--dc-gold-bright); }
.dc-info-box p { color: rgba(243,239,229,.78); }

.dc-site-footer {
  color: var(--dc-ivory);
  background:
    linear-gradient(180deg, #15110b, #070706),
    url('assets/images/pattern-latinoa.svg') center/cover no-repeat;
  border-top: 1px solid rgba(214,168,74,.3);
  padding: 2.2rem 1rem 1rem;
}
.dc-footer-inner { max-width: var(--dc-max); margin: 0 auto; display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 1.4rem; }
.dc-footer-logo img { max-width: 240px; }
.dc-footer-inner h3 { color: var(--dc-gold-bright); margin: 0 0 .7rem; font-size: .85rem; letter-spacing: .14em; text-transform: uppercase; }
.dc-footer-inner p, .dc-footer-inner li { color: rgba(243,239,229,.72); }
.dc-footer-menu, .dc-footer-inner ul { list-style: none; padding: 0; margin: 0; }
.dc-footer-menu li { margin: .45rem 0; }
.dc-credit { max-width: var(--dc-max); margin: 1.5rem auto 0; padding-top: 1rem; border-top: 1px solid rgba(214,168,74,.2); color: rgba(243,239,229,.64); font-size: .85rem; }
.dc-credit a { color: var(--dc-gold-bright); font-weight: 800; }

.dc-empty-state { padding: 2rem; background: rgba(255,250,240,.94); border: 1px dashed rgba(167,123,43,.45); border-radius: 30px; text-align: center; }
.dc-backtop {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 900;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--dc-gold);
  color: var(--dc-black);
  font-weight: 900;
  box-shadow: 0 10px 28px rgba(0,0,0,.22);
  opacity: 0;
  pointer-events: none;
  transform: translateY(12px);
  transition: .25s ease;
}
.dc-backtop.is-visible { opacity: 1; pointer-events: auto; transform: translateY(0); }

.dc-reveal { opacity: 0; transform: translateY(18px); transition: opacity .55s ease, transform .55s ease; }
.dc-reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 1080px) {
  .dc-brand-row { grid-template-columns: 1fr; text-align: center; justify-items: center; }
  .dc-slogan { max-width: 720px; }
  .dc-hero-grid, .dc-layout, .dc-commercial-deck, .dc-footer-inner { grid-template-columns: 1fr; }
  .dc-sidebar { position: static; }
}
@media (max-width: 760px) {
  body { background: linear-gradient(180deg, #0b0a08 0%, #17130d 13%, #f1eadc 13%, #f1eadc 100%); }
  .dc-topbar { flex-direction: column; text-align: center; gap: .25rem; }
  .dc-primary-menu { justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; padding-bottom: .35rem; }
  .dc-primary-menu a { white-space: nowrap; }
  .dc-hero-side .dc-card { grid-template-columns: 1fr; }
  .dc-post-grid, .dc-category-section:nth-child(even) .dc-post-grid, .dc-category-section:nth-child(3n) .dc-post-grid, .dc-directory-grid, .dc-info-grid { grid-template-columns: 1fr; }
  .dc-post-grid .dc-card:first-child { grid-row: auto; }
  .dc-category-section:nth-child(even) .dc-post-grid .dc-card:first-child { order: 0; }
  .dc-section-head, .dc-hero-head { align-items: flex-start; flex-direction: column; }
  .dc-ad-970 { min-height: 170px; }
}