/* =========================================================
   TRES ARCOS — hoja de estilos principal
   ========================================================= */
:root{
  --paper:#FFFFFF;
  --paper-dim:#F2F2F0;
  --ink:#1B1A17;
  --text-soft:#3a382f;
  --accent:#FF6B00;
  --muted:#7A756B;
  --line: rgba(27,26,23,0.14);
  --radius: 3px;
}
html[data-theme="dark"]{
  --paper:#141311;
  --paper-dim:#201E1A;
  --ink:#F2EFE8;
  --text-soft:#D8D4C8;
  --muted:#A39D8E;
  --line: rgba(242,239,232,0.16);
}
*{box-sizing:border-box;}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'Roboto',sans-serif;
  transition:background-color .2s ease, color .2s ease;}
.eyebrow{font-family:'Roboto',sans-serif;text-transform:uppercase;letter-spacing:.09em;font-size:11px;font-weight:600;}
h1,h2,h3,.display{font-family:'Roboto',sans-serif;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px;}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--paper);padding:10px 16px;z-index:999;}
.skip-link:focus{left:12px;top:12px;}

/* Red de seguridad: impide que cualquier elemento ancho haga que la página
   se pueda arrastrar hacia los lados en el teléfono. */
html,body{max-width:100%;overflow-x:hidden;}

/* iPhone/iPad: Safari agranda por su cuenta el texto de algunos bloques, y eso
   ensancha botones y cajas hasta que se salen de la pantalla. Esto lo impide. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;}

/* Nada con ancho propio (fotos, videos incrustados, tablas) puede pasarse. */
img,svg,video,iframe,embed,object,table{max-width:100%;}
img,video{height:auto;}
pre,code{white-space:pre-wrap;word-wrap:break-word;}

/* ---------- MASTHEAD ---------- */
/* El tamaño del logo y el espacio a su alrededor se controlan desde
   Apariencia > Personalizar > Logo y encabezado. */
.masthead{padding:18px 28px 0;}
/* Bloque normal centrado por texto, NO flex: con flex el navegador calcula el
   ancho a partir del tamaño original de la imagen y el logo estira la página
   entera. Así el ancho lo manda el contenedor y el logo se ajusta a él. */
/* font-size:0 y line-height:0 eliminan el hueco invisible que el navegador
   deja DEBAJO de una imagen en línea (el espacio de las "colas" de las letras).
   Ese hueco hacía que el logo se viera corrido hacia arriba. */
.masthead-top{display:block;width:100%;max-width:100%;text-align:center;
  font-size:0;line-height:0;}
.site-logo,.custom-logo-link{display:inline-block;max-width:100%;
  font-size:0;line-height:0;vertical-align:top;}
/* Selector amplio a propósito: alcanza al logo venga como venga (PNG, JPG o SVG,
   con o sin el enlace propio de WordPress). */
.masthead-top img{max-height:60px;max-width:100%;width:auto;height:auto;
  display:block;margin:0 auto;}

.site-logo-placeholder{font-family:'Roboto',sans-serif;font-size:40px;font-weight:600;letter-spacing:-1px;}

.masthead-links{display:flex;align-items:center;justify-content:center;gap:22px;flex-wrap:wrap;
  margin-top:18px;padding:10px 0 14px;border-top:none;}
.search-slot{display:flex;justify-content:center;}
.social-icons{display:flex;justify-content:center;align-items:center;gap:16px;}
.social-icon{width:19px;height:19px;color:var(--ink);}
.social-icon:hover{color:var(--accent);}
.dark-toggle{border:1px solid var(--line);background:none;border-radius:50%;width:32px;height:32px;
  display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink);padding:0;}
.dark-toggle:hover{border-color:var(--accent);color:var(--accent);}
.dark-toggle .icon-sun{display:none;}
html[data-theme="dark"] .dark-toggle .icon-moon{display:none;}
html[data-theme="dark"] .dark-toggle .icon-sun{display:block;}

/* ---------- NAV DE CATEGORÍAS ---------- */
.site-nav-wrap{position:relative;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);}
.site-nav-wrap::before,.site-nav-wrap::after{content:none;}
.site-nav{display:flex;flex-wrap:wrap;justify-content:center;list-style:none;margin:0;padding:0;}
.site-nav li{border-right:1px solid var(--line);}
.site-nav li:last-child{border-right:none;}
.site-nav a{display:block;padding:17px 24px;font-weight:700;font-size:14px;letter-spacing:.01em;color:var(--ink);}
.site-nav a:hover{color:var(--accent);}
.site-nav li.current-menu-item>a,
.site-nav li.current-cat>a{color:var(--accent);}
.nav-close-item{display:none;}
.nav-toggle{display:none;background:none;border:1px solid var(--ink);border-radius:4px;padding:8px 12px;
  font-family:'Roboto',sans-serif;font-size:12px;margin:12px auto;color:var(--ink);}
.nav-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;z-index:150;}
.nav-overlay.is-open{display:block;}
@media (max-width:760px){
  .nav-toggle{display:block;}
  .site-nav{position:fixed;top:0;right:0;height:100vh;width:260px;max-width:80vw;background:var(--paper);
    flex-direction:column;padding:20px 0;z-index:160;overflow-y:auto;
    border-left:1px solid var(--line);
    transform:translateX(100%);transition:transform .25s ease;}
  .site-nav.is-open{transform:translateX(0);}
  .site-nav li{border-right:none;border-bottom:1px solid var(--line);width:100%;text-align:left;}
  .site-nav a{padding:14px 24px;}
  .nav-close-item{display:block;border-bottom:1px solid var(--ink) !important;}
  .nav-close{background:none;border:none;font-size:18px;padding:14px 24px;cursor:pointer;color:var(--ink);width:100%;text-align:left;}
}

/* ---------- BREADCRUMBS ---------- */
.breadcrumbs{padding:14px 28px;font-family:'Roboto',sans-serif;font-size:11.5px;color:var(--muted);}
.breadcrumbs a{color:var(--muted);}
.breadcrumbs a:hover{color:var(--accent);}
.breadcrumbs .current{color:var(--ink);}
.breadcrumbs .sep{margin:0 6px;}

/* ---------- LAYOUT ---------- */
.content-grid{display:grid;grid-template-columns:1fr 300px;gap:36px;padding:20px 0 60px;align-items:start;}
@media (max-width:860px){.content-grid{grid-template-columns:1fr;}}

/* ---------- CATEGORY BADGE ---------- */
.cat-badge{display:inline-flex;align-items:center;gap:6px;font-family:'Roboto',sans-serif;
  font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;}
.cat-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}

/* ---------- HERO ---------- */
.hero{border-bottom:1px solid var(--line);padding-bottom:28px;margin-bottom:28px;}
.hero-img{width:100%;aspect-ratio:16/8;object-fit:cover;background:var(--paper-dim);border-radius:var(--radius);margin-bottom:16px;}
.hero-title{font-size:38px;line-height:1.05;font-weight:600;margin:12px 0 10px;}
.hero-title a:hover{color:var(--accent);}
.hero-summary{font-size:16.5px;color:var(--text-soft);line-height:1.5;max-width:70ch;}
.meta-row{font-family:'Roboto',sans-serif;font-size:11px;color:var(--muted);margin-top:12px;
  text-transform:uppercase;letter-spacing:.05em;}

/* ---------- SECTION LABEL ---------- */
.section-label{font-family:'Roboto',sans-serif;font-size:11.5px;font-weight:600;text-transform:uppercase;
  letter-spacing:.08em;color:var(--accent);border-bottom:1px solid var(--ink);padding-bottom:8px;margin:34px 0 18px;}

/* ---------- GRID DE TARJETAS ---------- */
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:26px 24px;}
.cards.row-4{grid-template-columns:repeat(4,1fr);}
@media (max-width:900px){.cards.row-4{grid-template-columns:repeat(2,1fr);}}
@media (max-width:640px){.cards{grid-template-columns:1fr;}}
.card{border-bottom:1px solid var(--line);padding-bottom:20px;}
.card-img{width:100%;aspect-ratio:16/10;object-fit:cover;background:var(--paper-dim);border-radius:var(--radius);margin-bottom:10px;}
.card-title{font-size:19px;font-weight:600;line-height:1.15;margin:6px 0 6px;}
.card-title.small{font-size:15px;}
.card-title a:hover{color:var(--accent);}
.card-summary{font-size:13.5px;color:var(--muted);line-height:1.4;}
.card-meta{font-family:'Roboto',sans-serif;font-size:10px;color:var(--muted);margin-top:8px;text-transform:uppercase;}

/* ---------- RELACIONADAS ---------- */
.related-posts{margin-top:40px;padding-top:10px;}

/* ---------- PANEL DE OPINIÓN (portada) ---------- */
.opinion-panel{background:var(--paper-dim);border-radius:8px;padding:26px 24px 30px;margin:8px 0 34px;}
.opinion-panel .section-label{margin-top:0;}
.opinion-row{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.opinion-card{text-align:center;}
.opinion-avatar{width:64px;height:64px;border-radius:50%;object-fit:cover;margin:0 auto 10px;
  display:block;border:2px solid var(--accent);}
.opinion-tag{color:var(--accent);font-size:10px;font-weight:700;text-transform:uppercase;
  letter-spacing:.06em;display:block;margin-bottom:6px;font-family:'Roboto',sans-serif;}
.opinion-card-title{font-size:14px;font-weight:600;line-height:1.25;margin:0;}
.opinion-card-title a:hover{color:var(--accent);}
.opinion-card-author{font-size:11px;color:var(--muted);margin-top:6px;}
@media (max-width:700px){.opinion-row{grid-template-columns:repeat(2,1fr);gap:18px;}}
@media (max-width:420px){.opinion-row{grid-template-columns:1fr;}}

/* ---------- REPORTAJE DESTACADO (portada) ---------- */
.reportaje-feature{position:relative;display:flex;align-items:flex-end;min-height:340px;
  border-radius:8px;overflow:hidden;background:var(--ink);margin-bottom:20px;}
.reportaje-feature img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5;}
.reportaje-feature .content{position:relative;z-index:1;padding:28px;}
.reportaje-feature .eyebrow{color:var(--accent);}
.reportaje-feature h3{font-size:28px;line-height:1.15;color:#fff;margin:8px 0 0;}
@media (max-width:640px){
  .reportaje-feature{min-height:240px;}
  .reportaje-feature .content{padding:20px;}
  .reportaje-feature h3{font-size:21px;}
}

/* ---------- PAGINACIÓN ---------- */
.pagination-nav{margin-top:34px;}
.pagination-nav ul.page-numbers{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;
  list-style:none;margin:0;padding:0;font-family:'Roboto',sans-serif;font-size:12px;}
.pagination-nav .page-numbers li{display:block;}
.pagination-nav a.page-numbers, .pagination-nav span.page-numbers{
  display:block;padding:8px 14px;border:1px solid var(--ink);border-radius:20px;color:var(--ink);}
.pagination-nav a.page-numbers:hover{border-color:var(--accent);color:var(--accent);}
.pagination-nav span.page-numbers.current{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.pagination-nav span.page-numbers.dots{border:none;}

/* ---------- SIDEBAR ---------- */
.sidebar{border-left:1px solid var(--line);padding-left:28px;}
@media (max-width:860px){.sidebar{border-left:none;padding-left:0;border-top:1px solid var(--line);padding-top:24px;}}
.col-item{padding:16px 0;border-bottom:1px solid var(--line);}
.col-item:first-child{padding-top:0;}
.col-author{font-family:'Roboto',sans-serif;font-size:10.5px;color:var(--accent);font-weight:600;
  text-transform:uppercase;margin-bottom:4px;}
.col-title{font-family:'Roboto',sans-serif;font-style:normal;font-weight:700;font-size:17px;line-height:1.2;margin:0 0 6px;}
.col-title a:hover{color:var(--accent);}
.col-summary{font-size:12.5px;color:var(--muted);line-height:1.4;}
.empty-note{color:var(--muted);font-size:13px;font-style:italic;padding:10px 0;}
.widget{margin-top:30px;}
.widget-title{font-family:'Roboto',sans-serif;font-size:11px;font-weight:600;text-transform:uppercase;
  letter-spacing:.06em;border-bottom:1px solid var(--ink);padding-bottom:8px;margin-bottom:14px;}
.side-list-item{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);align-items:baseline;}
.side-list-item:first-child{padding-top:0;}
.side-rank{font-family:'Roboto',sans-serif;font-size:18px;font-weight:700;color:var(--accent);
  flex-shrink:0;line-height:1.25;min-width:16px;text-align:right;}
.side-list-title{font-size:14px;font-weight:600;line-height:1.25;margin:0;}
.side-list-title a:hover{color:var(--accent);}
.side-list-meta{font-family:'Roboto',sans-serif;font-size:10px;color:var(--muted);margin-top:4px;text-transform:uppercase;}
.side-cat-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;}
.side-cat-list li{font-family:'Roboto',sans-serif;font-size:11px;}
.side-cat-list a{border:1px solid var(--line);border-radius:14px;padding:5px 12px;display:inline-block;}
.side-cat-list a:hover{border-color:var(--accent);color:var(--accent);}
.ad-slot{border:1px dashed var(--line);border-radius:6px;padding:16px;text-align:center;color:var(--muted);font-size:12px;}

/* ---------- BUSCADOR ---------- */
.search-form{display:flex;gap:6px;}
.search-form input[type=search]{border:1px solid var(--ink);border-radius:20px;padding:7px 14px;font-size:13px;
  font-family:'Roboto',sans-serif;background:transparent;color:var(--ink);width:150px;}
.search-form button{border:1px solid var(--ink);border-radius:20px;padding:7px 12px;background:var(--ink);color:var(--paper);
  font-size:12px;cursor:pointer;}

/* ---------- SINGLE / ARTÍCULO ---------- */
.single-article{padding:10px 0 60px;max-width:760px;margin:0 auto;}
.single-title{font-size:36px;line-height:1.1;margin:14px 0 10px;}
.single-img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--radius);margin:18px 0;background:var(--paper-dim);}
.single-body{font-size:16.5px;line-height:1.7;color:var(--text-soft);}
.single-body p{margin:0 0 20px;}
.single-body img{border-radius:var(--radius);margin:20px 0;max-width:100%;height:auto;}
.tags-row{margin-top:30px;display:flex;gap:8px;flex-wrap:wrap;}
.tag-chip{font-family:'Roboto',sans-serif;font-size:10.5px;border:1px solid var(--line);border-radius:14px;padding:5px 12px;}
.tag-chip:hover{border-color:var(--accent);color:var(--accent);}

.share-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:28px;padding-top:20px;border-top:1px solid var(--line);}
.share-label{font-family:'Roboto',sans-serif;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);}
.share-btn{font-family:'Roboto',sans-serif;font-size:11px;border:1px solid var(--ink);border-radius:16px;
  padding:6px 14px;background:none;color:var(--ink);cursor:pointer;}
.share-btn:hover{border-color:var(--accent);color:var(--accent);}

/* ---------- FICHA PROFESIONAL DE AUTOR ---------- */
.author-box{display:flex;gap:20px;align-items:flex-start;margin-top:36px;padding:22px;
  border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:6px;background:var(--paper-dim);}
.author-box-photo{flex-shrink:0;display:block;}
.author-box-photo img{width:88px;height:88px;border-radius:50%;object-fit:cover;background:var(--paper);}
.author-box-info{min-width:0;flex:1;}
.author-box-name{display:inline-block;font-weight:700;font-size:18px;line-height:1.2;color:var(--ink);}
.author-box-name:hover{color:var(--accent);}
.author-box-role{font-family:'Roboto',sans-serif;font-size:10.5px;font-weight:700;text-transform:uppercase;
  letter-spacing:.08em;color:var(--accent);margin-top:3px;}
.author-box-bio{font-size:13.5px;color:var(--text-soft);line-height:1.5;margin-top:8px;}
.author-box-bio p{margin:0 0 8px;}
.author-box-bio p:last-child{margin-bottom:0;}
.author-socials{display:flex;align-items:center;gap:12px;margin-top:10px;flex-wrap:wrap;}
.author-social{color:var(--muted);display:inline-flex;}
.author-social:hover{color:var(--accent);}
.author-box-footer{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:14px;
  padding-top:12px;border-top:1px solid var(--line);}
.author-box-count{font-family:'Roboto',sans-serif;font-size:11.5px;color:var(--muted);}
.author-box-btn{font-family:'Roboto',sans-serif;font-size:11px;font-weight:700;text-transform:uppercase;
  letter-spacing:.05em;border:1px solid var(--ink);border-radius:18px;padding:7px 16px;color:var(--ink);
  display:inline-block;transition:background-color .15s ease,color .15s ease,border-color .15s ease;}
.author-box-btn:hover{background:var(--accent);border-color:var(--accent);color:#fff;}
@media (max-width:560px){
  .author-box{flex-direction:column;align-items:center;text-align:center;gap:14px;padding:20px 16px;}
  .author-box-photo img{width:76px;height:76px;}
  .author-socials{justify-content:center;}
  .author-box-footer{justify-content:center;flex-direction:column;gap:10px;}
}

/* ---------- ARCHIVO / CATEGORÍA / AUTOR ---------- */
.archive-header{padding:20px 0 10px;text-align:center;}
.archive-title{font-size:32px;margin:0;}
.archive-desc{color:var(--muted);font-size:14px;margin-top:8px;}
.author-archive-box{display:flex;gap:22px;align-items:flex-start;padding:26px 0;
  border-bottom:1px solid var(--line);margin-bottom:10px;}
.author-archive-photo{flex-shrink:0;}
.author-archive-box img{width:110px;height:110px;border-radius:50%;object-fit:cover;background:var(--paper-dim);}
.author-archive-info{min-width:0;}
.author-archive-name{font-size:28px;line-height:1.15;margin:0;font-weight:700;}
.author-archive-box .author-box-count{margin-top:10px;}
@media (max-width:560px){
  .author-archive-box{flex-direction:column;align-items:center;text-align:center;}
  .author-archive-box img{width:92px;height:92px;}
  .author-archive-name{font-size:22px;}
  .author-archive-box .author-socials{justify-content:center;}
}

/* ---------- FOOTER ---------- */
.site-footer{border-top:1px solid var(--ink);margin-top:10px;padding:30px 0 20px;}
.footer-widgets-row{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-bottom:26px;padding-bottom:26px;
  border-bottom:1px solid var(--line);}
@media (max-width:700px){.footer-widgets-row{grid-template-columns:1fr;}}
.footer-widgets-row .widget{margin-top:0;}
.footer-inner{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;}
.footer-links{display:flex;gap:24px;flex-wrap:wrap;justify-content:center;list-style:none;margin:0;padding:0;}
.footer-links a{font-family:'Roboto',sans-serif;font-size:11px;font-weight:600;text-transform:uppercase;
  letter-spacing:.06em;color:var(--ink);padding:4px 0;border-bottom:1px solid transparent;}
.footer-links a:hover{border-bottom:1px solid var(--accent);color:var(--accent);}
.footer-socials{gap:18px;margin:2px 0 4px;}
.footer-meta{font-family:'Roboto',sans-serif;font-size:10.5px;color:var(--muted);}

/* ---------- 404 / ESTADOS ---------- */
.state-message{text-align:center;padding:60px 20px;}
.state-message h1{font-size:28px;}

/* ---------- AJUSTES FINOS PARA CELULARES ---------- */
@media (max-width:480px){
  .wrap{padding:0 18px;}
  .masthead{padding:18px 18px 0;}
  .hero-title{font-size:26px;}
  .single-title{font-size:26px;}
  .archive-title{font-size:24px;}
  .site-logo-placeholder{font-size:28px;}
  .masthead-links{flex-direction:column;gap:12px;}
  .search-form{width:100%;max-width:300px;}
  .search-form input[type=search]{flex:1;min-width:0;width:auto;font-size:13px;padding:8px 12px;}
  .social-icons{gap:20px;}
  .cards.row-4{grid-template-columns:1fr;}
  .site-nav{width:220px;}
  .reportaje-feature h3{font-size:19px;}
}
@media (max-width:340px){
  .search-form{width:100%;justify-content:center;}
  .search-form input[type=search]{width:100%;}
}