/*
Theme Name: Innovadores Media
Theme URI: https://innovadoresmedia.cl
Author: Innovadores Media
Author URI: https://innovadoresmedia.cl
Description: Tema para el medio y agencia de comunicación Innovadores Media — noticias, podcast y servicios para el ecosistema de innovación.
Version: 3.30
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: innovadores-media
*/

/* ============ BASE (compartido en todas las páginas) ============ */
:root{
  --blue: #037BFE;
  --blue-deep: #0B1F3A;
  --yellow: #FFBC00;
  --paper: #F7F5F0;
  --paper-dim: #EDEAE2;
  --ink: #0B1F3A;
  --ink-soft: #55606E;
  --white: #FFFFFF;
  --line: rgba(11,31,58,0.12);
  --radius: 14px;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}

body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Sora', sans-serif;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,.display{
  font-family:'Newsreader', serif;
  font-weight:600;
  letter-spacing:-0.015em;
  line-height:1.08;
}

.mono{
  font-family:'Space Grotesk', monospace;
  text-transform:uppercase;
  letter-spacing:0.08em;
  font-size:0.72rem;
  font-weight:500;
}

a{color:inherit;text-decoration:none;}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px;}

/* ---------- NAV ---------- */
header{
  position:sticky;top:0;z-index:50;
  background:var(--blue);
  box-shadow:0 8px 20px -6px rgba(11,31,58,0.45);
  border-bottom:2px solid rgba(11,31,58,0.15);
}
nav{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 28px;max-width:1180px;margin:0 auto;
}
.brand{display:flex;align-items:center;gap:10px;}
.brand-logo-link{display:flex;align-items:center;}
.brand img{height:88px;width:auto;object-fit:contain;display:block;}

.nav-links{display:flex;gap:30px;align-items:center;}
.nav-links a{
  font-family:'Space Grotesk';font-size:0.86rem;
  text-transform:uppercase;letter-spacing:0.06em;
  color:rgba(255,255,255,0.8);
  position:relative;padding:4px 0;
  transition:color .2s ease;
}
.nav-links a:hover{color:var(--white);}
.nav-links a.active{color:var(--white);}
.nav-links a.active::after{
  content:"";position:absolute;left:0;bottom:-4px;
  width:100%;height:2px;background:var(--yellow);
}

.nav-cta{
  background:var(--blue-deep);color:var(--white);
  padding:10px 20px;border-radius:100px;
  font-family:'Space Grotesk';font-size:0.72rem;
  text-transform:uppercase;letter-spacing:0.06em;
  display:flex;align-items:center;gap:8px;
}
.nav-actions{display:flex;align-items:center;gap:18px;}
.nav-socials{display:flex;align-items:center;gap:10px;}
/* Círculo de fondo para cada ícono (antes eran solo los glifos sueltos,
   sin marco, y se perdían un poco contra el azul del header) — alto un
   poco menor que el botón "Ingreso Clientes" para que no compita con él. */
.nav-socials a{
  width:36px;height:36px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  color:rgba(255,255,255,0.9);
  background:rgba(255,255,255,0.14);border:1px solid rgba(255,255,255,0.22);
  transition:color .2s ease, background .2s ease, border-color .2s ease;
}
.nav-socials a:hover{color:var(--white);background:rgba(255,255,255,0.24);border-color:rgba(255,255,255,0.4);}
@media (max-width:600px){.nav-socials{display:none;}}

/* play badge - signature element */
.play-badge{
  width:20px;height:20px;border-radius:50%;
  background:var(--yellow);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.play-badge::after{
  content:"";width:0;height:0;
  border-top:5px solid transparent;border-bottom:5px solid transparent;
  border-left:8px solid var(--blue-deep);
  margin-left:2px;
}

.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 24px;border-radius:100px;
  font-family:'Space Grotesk';font-size:0.76rem;
  text-transform:uppercase;letter-spacing:0.05em;
  transition:transform .18s ease, box-shadow .18s ease;
  border:none;cursor:pointer;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--ink);color:var(--white);}
.btn-primary:hover{box-shadow:0 10px 24px rgba(11,31,58,0.25);}
.btn-outline{background:transparent;color:var(--ink);border:1.5px solid var(--line);}
.btn-outline:hover{border-color:var(--ink);}

/* ---------- SECTION ---------- */
.section{padding:80px 0;}
.section-alt{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.sec-head{
  display:flex;justify-content:space-between;align-items:flex-end;
  margin-bottom:44px;flex-wrap:wrap;gap:20px;
}
.sec-head .mono{color:var(--blue);margin-bottom:10px;display:block;}
.sec-head h2{font-size:clamp(1.7rem,3.2vw,2.4rem);font-weight:600;}
.sec-head .see-all{
  font-family:'Space Grotesk';font-size:0.75rem;
  text-transform:uppercase;letter-spacing:0.05em;
  color:var(--ink-soft);
  border-bottom:1px solid var(--line);
  padding-bottom:2px;
}
.sec-head .see-all:hover{color:var(--ink);border-color:var(--ink);}

/* ---------- FOOTER ---------- */
footer{background:var(--ink);color:rgba(255,255,255,0.6);padding:56px 0 28px;}
.foot-grid{
  display:flex;justify-content:space-between;align-items:flex-start;
  margin-bottom:44px;flex-wrap:wrap;gap:30px;
}
.foot-brand{display:flex;align-items:center;gap:20px;flex-wrap:wrap;}
.foot-brand .foot-logo{height:68px;width:auto;display:block;}
.foot-by{display:flex;align-items:center;gap:22px;padding-left:24px;border-left:1px solid rgba(255,255,255,0.15);}
.foot-by .mono{color:rgba(255,255,255,0.4);}
.foot-by .partner-logo{height:68px;width:auto;opacity:0.9;}
.foot-links{display:flex;gap:50px;flex-wrap:wrap;}
.foot-col h4{
  font-family:'Space Grotesk';font-size:0.68rem;text-transform:uppercase;
  letter-spacing:0.06em;color:rgba(255,255,255,0.4);margin-bottom:14px;
}
.foot-col a{display:block;font-size:0.87rem;margin-bottom:10px;color:rgba(255,255,255,0.75);}
.foot-col a:hover{color:var(--white);}

.foot-bottom{
  border-top:1px solid rgba(255,255,255,0.1);padding-top:22px;
  display:flex;justify-content:space-between;font-size:0.78rem;flex-wrap:wrap;gap:10px;
}

@media (max-width:900px){
  .nav-links{display:none;}
}


/* ============ HOME (index.php) ============ */
  /* ---- Home-specific ---- */
  .hero{padding:100px 0 84px;position:relative;overflow:hidden;}
  .hero::before{
    content:"";position:absolute;top:-280px;right:-280px;width:640px;height:640px;
    border-radius:50%;background:radial-gradient(circle at 35% 35%, var(--blue) 0%, transparent 72%);
    opacity:0.14;
  }
  .hero-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:32px;align-items:center;position:relative;}

  .eyebrow{
    display:inline-flex;align-items:center;gap:10px;
    padding:7px 14px;border:1px solid var(--line);border-radius:100px;
    margin-bottom:24px;background:var(--white);
  }
  .eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--yellow);}
  .hero h1{font-size:clamp(2.4rem, 4.8vw, 4rem);margin-bottom:22px;}
  .hero h1 em{font-style:italic;color:var(--blue);}
  .hero h1 .h1-sub{display:block;font-size:0.42em;font-weight:500;margin-top:10px;letter-spacing:-0.005em;}
  .hero p.lede{font-size:1.1rem;color:var(--ink-soft);max-width:460px;margin-bottom:32px;font-weight:400;}
  .hero-actions{display:flex;gap:14px;flex-wrap:wrap;}

  .hero-visual{position:relative;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;}
  .ring{position:absolute;border-radius:50%;border:1px solid rgba(3,123,254,0.18);}
  .ring.r1{width:100%;height:100%;}
  .ring.r2{width:78%;height:78%;border-color:rgba(3,123,254,0.28);}
  .ring.r3{width:64%;height:64%;border-color:rgba(3,123,254,0.4);}
  .hero-core{
    position:relative;width:70%;height:70%;border-radius:50%;overflow:hidden;
  }
  .hero-core img{width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block;}

  /* podcast: imagen de fondo real en TODA LA SECCIÓN (Fondo-Podcast.png,
     subida por el cliente a la biblioteca de medios) — el recuadro
     ("card") blanco del carrusel se mantiene tal cual estaba (sin la
     foto ni cambios de color), la foto va detrás, cubriendo la sección,
     con un degradado oscuro encima para que el título y el link de la
     cabecera (ahora en tonos claros) se lean bien sobre cualquier zona
     de la imagen. */
  #podcast{position:relative;overflow:hidden;}
  #podcast::before{
    content:"";position:absolute;inset:0;
    background:
      linear-gradient(180deg, rgba(11,31,58,0.82), rgba(11,31,58,0.6)),
      url('https://innovadoresmedia.cl/wp-content/uploads/2026/09/Fondo-Podcast.png') center/cover no-repeat;
  }
  #podcast .wrap{position:relative;z-index:1;}
  #podcast .sec-head .mono{color:var(--yellow);}
  #podcast .sec-head h2{color:var(--white);}
  /* .pill-more es azul sobre fondo claro por defecto — sobre la foto oscura
     del podcast eso casi no se lee, así que acá se vuelve clara/translúcida
     (mismo trato que el resto de los elementos de esta sección). */
  #podcast .pill-more{color:#fff;border-color:rgba(255,255,255,0.35);background:rgba(255,255,255,0.12);}
  #podcast .pill-more:hover{background:rgba(255,255,255,0.22);border-color:#fff;}

  /* podcast: destacado + carrusel de próximos */
  .carousel-wrap{position:relative;}
  /* alto fijo en desktop: .yt-thumb y .upnext-item ya son de tamaño fijo
     (ancho fijo + aspect-ratio), así que antes el único elemento de altura
     variable era .feat-info (según cuánto texto tuviera el nombre/rol de
     cada episodio) — eso hacía que la fila completa creciera o achicara
     entre episodios, y con align-items:center el bloque de texto quedaba
     flotando en distinta posición cada vez. Con altura fija + .feat-info
     estirado a esa altura (más abajo), "Ver episodio" se puede anclar
     siempre al fondo sin importar cuánto texto haya arriba. */
  .feat-card{
    background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:28px;
    display:flex;align-items:center;justify-content:center;gap:36px;flex-wrap:wrap;
    height:372px;
  }
  .yt-thumb{
    position:relative;display:block;flex:0 0 420px;width:420px;aspect-ratio:16/9;border-radius:12px;overflow:hidden;
    background-color:var(--blue-deep);background-size:cover;background-position:center;
  }
  .play-btn{
    position:absolute;bottom:16px;left:16px;
    width:56px;height:56px;border-radius:50%;background:var(--yellow);
    display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(11,31,58,0.25);
  }
  .play-btn::after{
    content:"";border-style:solid;border-width:10px 0 10px 16px;
    border-color:transparent transparent transparent var(--blue-deep);margin-left:3px;
  }

  /* ancho fijo (no "auto"): así el largo del texto de cada episodio no cambia
     el ancho total de la fila y no reposiciona la imagen principal al rotar.
     align-self:stretch (sobre el align-items:center de .feat-card) hace que
     esta columna ocupe todo el alto fijo de la card. Adentro hay dos filas:
     .feat-info-top (badge + botón, fijos arriba) y .feat-info-center (nombre
     + rol, centrados verticalmente en el espacio restante con justify-content
     :center) — así el nombre queda centrado en altura y "Ver episodio" no se
     mueve según cuánto texto tenga cada episodio. */
  .feat-info{flex:0 0 360px;width:360px;display:flex;flex-direction:column;gap:14px;min-width:0;align-self:stretch;}
  .feat-info-top{display:flex;align-items:center;justify-content:flex-start;gap:10px;}
  .feat-info-center{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:4px;}
  .feat-badge{
    display:inline-flex;align-items:center;
    background:rgba(3,123,254,0.08);color:var(--blue);border:1px solid rgba(3,123,254,0.3);border-radius:100px;
    padding:7px 15px;font-family:'Space Grotesk';font-size:0.74rem;font-weight:500;
    letter-spacing:0.05em;text-transform:uppercase;
  }
  .feat-info h3{
    font-family:'Newsreader';font-weight:600;font-size:clamp(1.6rem,2.8vw,2.1rem);margin:0;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  }
  /* más cerca del nombre (gap:4px del padre) y más grande que antes (0.98rem
     → 1.05rem): antes quedaba un espacio muy grande entre el nombre y la
     empresa/rol. */
  .feat-role{color:var(--ink-soft);font-size:1.05rem;margin:0;}
  /* Botón amarillo (mismo acento que el play de las miniaturas), con ícono
     de play en vez de flecha, pegado al badge arriba (justify-content:
     flex-start en .feat-info-top, no space-between: separados dejaba un
     espacio en blanco muy grande entre ambos). */
  .feat-link{
    flex-shrink:0;
    display:inline-flex;align-items:center;gap:7px;
    background:var(--yellow);color:var(--blue-deep);
    border:1px solid var(--yellow);border-radius:100px;
    padding:9px 16px;
    font-family:'Space Grotesk';font-size:0.72rem;font-weight:600;text-transform:uppercase;letter-spacing:0.04em;
    text-decoration:none;width:fit-content;white-space:nowrap;
    transition:transform .15s ease, box-shadow .15s ease;
  }
  .feat-link:hover{transform:translateY(-1px);box-shadow:0 6px 14px rgba(255,188,0,0.4);}
  .feat-link-icon{
    width:0;height:0;flex-shrink:0;
    border-top:4px solid transparent;border-bottom:4px solid transparent;
    border-left:7px solid currentColor;
  }

  .upnext{flex:0 0 168px;width:168px;display:flex;flex-direction:column;gap:12px;}
  .upnext-item{
    position:relative;width:100%;aspect-ratio:16/9;border-radius:10px;overflow:hidden;cursor:pointer;
    background-color:var(--blue-deep);background-size:cover;background-position:center;
    opacity:0.85;transition:opacity .2s ease, transform .2s ease;display:flex;align-items:flex-end;
  }
  .upnext-item:hover{opacity:1;transform:translateY(-2px);}
  .up-label{
    font-family:'Space Grotesk';font-size:0.64rem;text-transform:uppercase;letter-spacing:0.04em;
    color:#fff;background:rgba(11,31,58,0.6);padding:3px 7px;border-radius:5px;margin:6px;line-height:1;
  }

  .nav-arrow{
    position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;
    background:var(--white);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;
    cursor:pointer;font-size:1.05rem;color:var(--ink);box-shadow:0 6px 16px rgba(11,31,58,0.08);
  }
  .nav-arrow.left{left:-20px;} .nav-arrow.right{right:-20px;}

  @media (max-width:900px){
    .feat-card{flex-direction:column;padding:18px;height:auto;}
    .yt-thumb{flex:1 1 auto;width:100%;}
    .feat-info{flex:1 1 auto;max-width:none;width:100%;}
    .upnext{flex:1 1 auto;flex-direction:row;width:100%;}
    .upnext-item{aspect-ratio:1/1;}
    .nav-arrow{display:none;}
  }

  /* news */
  .news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
  /* antes era solo una línea superior (border-top) sin fondo ni bordes —
     se veía como si el contenido "flotara". Ahora es una card real (fondo
     blanco, borde suave, sombra leve) para darle más forma y que no quede
     suelta sobre el fondo de la sección. */
  .news-card{
    background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
    padding:16px;box-shadow:0 10px 24px -18px rgba(11,31,58,0.35);
    transition:transform .18s ease, box-shadow .18s ease;
  }
  .news-card:hover{transform:translateY(-3px);box-shadow:0 18px 36px -20px rgba(11,31,58,0.28);}
  .news-photo{
    aspect-ratio:16/9;border-radius:10px;background:var(--blue-deep);margin-bottom:16px;
    background-image:radial-gradient(circle at 20% 20%, rgba(3,123,254,0.55), transparent 55%),
                      radial-gradient(circle at 80% 75%, rgba(255,188,0,0.22), transparent 50%);
  }
  .news-tag{
    color:var(--blue);margin-bottom:12px;display:inline-block;
    padding:5px 12px;border:1px solid rgba(3,123,254,0.3);
    background:rgba(3,123,254,0.08);border-radius:100px;
  }
  .news-card h3{font-family:'Newsreader';font-weight:600;font-size:1.1rem;letter-spacing:-0.01em;margin-bottom:8px;}
  .news-card p{color:var(--ink-soft);font-size:0.92rem;margin-bottom:14px;}
  .news-date{color:var(--ink-soft);}

  .services-panel{
    text-align:center;background:var(--white);border:1px dashed var(--line);border-radius:var(--radius);padding:64px 40px;
  }
  .services-panel .mono{color:var(--blue);margin-bottom:14px;display:block;}
  .services-panel h2{font-size:clamp(1.5rem,2.8vw,2rem);margin-bottom:14px;}
  .services-panel p{color:var(--ink-soft);max-width:480px;margin:0 auto;}

  /* services grid */
  .svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
  .svc-card{background:var(--white);padding:32px 26px;transition:background .2s ease;}
  .svc-card:hover{background:var(--paper-dim);}
  .svc-card .svc-mark{
    width:52px;height:52px;border-radius:14px;margin-bottom:20px;
    background:rgba(3,123,254,0.08);border:1px solid rgba(3,123,254,0.18);
    display:flex;align-items:center;justify-content:center;color:var(--blue);
    transition:background .2s ease, border-color .2s ease;
  }
  .svc-card .svc-mark svg{width:26px;height:26px;}
  .svc-card:hover .svc-mark{background:rgba(3,123,254,0.14);border-color:rgba(3,123,254,0.32);}
  .svc-card h3{font-family:'Newsreader';font-weight:600;font-size:1.08rem;letter-spacing:-0.01em;margin-bottom:10px;}
  .svc-card p{color:var(--ink-soft);font-size:0.88rem;}
  @media (max-width:900px){.svc-grid{grid-template-columns:1fr 1fr;}}
  @media (max-width:560px){.svc-grid{grid-template-columns:1fr;}}

  /* nosotros / equipo */
  .team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
  .team-card{
    text-align:center;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
    padding:20px 18px 22px;transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  }
  .team-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px -24px rgba(11,31,58,0.25);border-color:var(--blue);}
  .team-avatar{
    width:100%;aspect-ratio:1/1;border-radius:10px;background:var(--blue-deep);
    background-image:radial-gradient(circle at 30% 30%, rgba(3,123,254,0.5), transparent 60%);
    margin-bottom:14px;overflow:hidden;transition:transform .3s ease;
  }
  .team-card:hover .team-avatar{transform:scale(1.03);}
  .team-card .mono{color:var(--ink-soft);}
  .team-name{font-family:'Newsreader';font-weight:600;font-size:1.05rem;margin-bottom:4px;}
  .team-role{color:var(--ink-soft);display:block;margin-bottom:12px;}
  .team-links{display:flex;flex-direction:column;align-items:center;gap:8px;}
  .team-link-icon{color:var(--blue);display:flex;transition:color .15s ease;}
  .team-link-icon:hover{color:var(--ink);}
  .team-email{display:inline-flex;align-items:center;gap:6px;}
  .team-email a{font-family:'Sora';font-size:0.78rem;color:var(--ink-soft);border-bottom:1px solid var(--line);padding-bottom:1px;}
  .team-email a:hover{color:var(--ink);border-color:var(--ink);}
  .copy-email-btn{background:none;border:none;padding:2px;margin:0;color:var(--ink-soft);opacity:0.55;cursor:pointer;display:flex;transition:opacity .15s ease, color .15s ease;}
  .copy-email-btn:hover{opacity:1;color:var(--blue);}
  .copy-email-btn.copied{opacity:1;color:var(--blue);}
  @media (max-width:860px){.team-grid{grid-template-columns:1fr 1fr;}}

  /* entrevistas: carrusel horizontal (home) */
  .entrevistas-carousel{
    display:flex;gap:20px;overflow-x:auto;padding-bottom:12px;scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
  }
  .entrevistas-carousel::-webkit-scrollbar{height:6px;}
  .entrevistas-carousel::-webkit-scrollbar-thumb{background:var(--line);border-radius:100px;}
  .entrevista-card{
    flex:0 0 280px;scroll-snap-align:start;background:var(--white);border:1px solid var(--line);
    border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;
    transition:transform .2s ease, box-shadow .2s ease;
  }
  .entrevista-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px -24px rgba(11,31,58,0.25);}
  .entrevista-card-photo{
    aspect-ratio:4/5;background:var(--blue-deep);position:relative;
    background-image:radial-gradient(circle at 30% 30%, rgba(3,123,254,0.5), transparent 60%);
  }
  .entrevista-card-body{padding:18px 20px 20px;display:flex;flex-direction:column;gap:8px;}
  .entrevista-card-cita{
    font-family:'Newsreader';font-style:italic;font-size:0.92rem;color:var(--ink-soft);
    line-height:1.4;margin-bottom:4px;
  }
  .entrevista-card-body h3{font-family:'Newsreader';font-weight:600;font-size:1.05rem;letter-spacing:-0.01em;}
  .entrevista-card-role{color:var(--ink-soft);font-size:0.82rem;}

  /* visor destacado "hojeable" (home): bloque oscuro, imagen a la izq y
     texto a la der, con deslizamiento lateral al cambiar de nota.
     height fija (no min-height): con min-height, el grid dejaba que la
     fila creciera según el largo del título de cada nota, así que la
     imagen "cambiaba de tamaño" al pasar de una nota corta a una larga.
     Con height fija + line-clamp en el título (más abajo), el bloque
     completo mide siempre lo mismo sin importar la nota. */
  .featured-viewer{
    display:grid;grid-template-columns:1.1fr 0.9fr;background:var(--ink);
    border-radius:var(--radius);overflow:hidden;height:420px;
  }
  .featured-viewer-media{
    display:block;position:relative;background-color:var(--blue-deep);
    background-image:radial-gradient(circle at 20% 20%, rgba(3,123,254,0.55), transparent 55%),
                      radial-gradient(circle at 80% 75%, rgba(255,188,0,0.22), transparent 50%);
    background-size:cover;background-position:center;
  }
  .featured-viewer-num{
    position:absolute;bottom:16px;left:16px;font-family:'Space Grotesk';font-size:0.7rem;
    color:rgba(255,255,255,0.75);letter-spacing:0.04em;
  }
  .featured-viewer-content{padding:40px 44px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;}
  .featured-viewer-inner{
    display:block;overflow:hidden;
    transition:transform .45s cubic-bezier(.65,0,.35,1), opacity .35s ease;
  }
  .featured-viewer-inner.featured-viewer-slide-left{transform:translateX(-100%);opacity:0;}
  .featured-viewer-inner.featured-viewer-slide-right{transform:translateX(100%);opacity:0;}
  .featured-viewer-tag{color:#7FA6FF;margin-bottom:12px;display:block;}
  .featured-viewer-content h3{
    font-size:clamp(1.3rem,2.2vw,1.6rem);color:var(--white);margin-bottom:14px;line-height:1.3;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  }
  .featured-viewer-date{color:rgba(255,255,255,0.55);}
  .featured-viewer-nav{display:flex;gap:10px;margin-top:26px;align-items:center;}
  .fv-nav-btn{
    width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,0.28);
    background:transparent;color:var(--white);cursor:pointer;font-size:1rem;
    display:flex;align-items:center;justify-content:center;transition:border-color .15s ease;
  }
  .fv-nav-btn:hover{border-color:var(--white);}
  .fv-dots{display:flex;gap:6px;margin-left:6px;}
  .fv-dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,0.32);cursor:pointer;}
  .fv-dot.active{background:var(--white);}
  @media (max-width:900px){
    .featured-viewer{grid-template-columns:1fr;height:auto;}
    .featured-viewer-media{aspect-ratio:16/9;}
    .featured-viewer-content{padding:28px 24px;}
  }

  /* comunidad + nosotros en acción: dos columnas, listas con miniatura.
     Cada fila es ahora una card (fondo blanco, borde suave, sombra leve) en
     vez de una lista separada por líneas — así el título no queda "en el
     aire" sobre el fondo de la sección. */
  .dual-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;}
  .dual-col-head{margin-bottom:22px;}
  .dual-col-head .mono{color:var(--blue);margin-bottom:8px;display:block;}
  .dual-col-head h2{font-size:1.5rem;margin-bottom:4px;}
  .dual-col-head .sub{color:var(--ink-soft);font-size:0.85rem;}
  .mini-list{display:flex;flex-direction:column;gap:14px;}
  .mini-item{
    display:flex;gap:20px;align-items:center;
    background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
    padding:16px;box-shadow:0 10px 24px -18px rgba(11,31,58,0.35);
    transition:transform .18s ease, box-shadow .18s ease;
  }
  .mini-item:hover{transform:translateY(-3px);box-shadow:0 18px 36px -20px rgba(11,31,58,0.28);}
  .mini-thumb{
    width:140px;height:140px;flex-shrink:0;border-radius:10px;background:var(--paper-dim);
    background-size:cover;background-position:center;
  }
  .mini-item-body{flex:1;min-width:0;align-self:center;}
  .mini-item-body .mono{color:var(--blue);font-size:0.68rem;margin-bottom:6px;display:block;}
  .mini-item-body h4{font-family:'Newsreader';font-weight:600;font-size:1.08rem;line-height:1.35;letter-spacing:-0.005em;}
  @media (max-width:480px){
    .mini-item{padding:12px;gap:14px;}
    .mini-thumb{width:100px;height:100px;}
    .mini-item-body h4{font-size:0.98rem;}
  }
  @media (max-width:900px){
    .dual-grid{grid-template-columns:1fr;gap:36px;}
  }
  /* Píldora "ver más/ver todas" compartida por TODA la home (Noticias,
     Comunidad/Institucional, Entrevistas, Explora por tema y Podcast) —
     un solo estilo de botón para todos esos enlaces en vez de tratamientos
     distintos por sección. */
  .pill-more{
    display:inline-flex;align-items:center;gap:6px;
    font-family:'Space Grotesk';font-size:0.72rem;text-transform:uppercase;letter-spacing:0.05em;
    padding:8px 16px;border-radius:100px;border:1px solid rgba(3,123,254,0.3);
    background:rgba(3,123,254,0.06);color:var(--blue);cursor:pointer;transition:all .15s ease;
  }
  .pill-more:hover{background:rgba(3,123,254,0.12);border-color:var(--blue);}
  .dual-col-more{margin-top:16px;}

  /* tabs de categoría (home): reusa el pill .cat-chip/.cat-filters ya
     definido más abajo para la página de noticias — acá solo se agrega
     scroll horizontal en mobile para que quepan todas las tabs sin
     partirse en varias filas. Selector por #cat-tabs (no solo la clase
     .cat-tabs-scroll) a propósito: con la misma especificidad que
     .cat-filters{flex-wrap:wrap} (definida más abajo en el archivo, para
     noticias) gana la que aparece después en la hoja, así que sin el ID
     este override quedaba pisado. */
  .tab-panel{display:none;}
  .tab-panel.active{display:block;}
  #cat-tabs .pill-more{margin-left:auto;}
  @media (max-width:600px){
    #cat-tabs.cat-tabs-scroll{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:8px;}
    #cat-tabs.cat-tabs-scroll::-webkit-scrollbar{height:4px;}
    #cat-tabs.cat-tabs-scroll::-webkit-scrollbar-thumb{background:var(--line);border-radius:100px;}
    #cat-tabs.cat-tabs-scroll .cat-chip, #cat-tabs.cat-tabs-scroll .pill-more{flex-shrink:0;}
  }

/* ============ PAGE HEAD (compartido: noticias, episodios) ============ */
.page-head{padding:70px 0 40px;}
.page-head .mono{color:var(--blue);margin-bottom:12px;display:block;}
.page-head h1{font-size:clamp(2rem,4vw,3rem);margin-bottom:16px;}

/* ============ NOTICIAS (page-noticias.php) ============ */
  .page-head{padding:70px 0 40px;}
  .page-head .mono{color:var(--blue);margin-bottom:12px;display:block;}
  .page-head h1{font-size:clamp(2rem,4vw,3rem);margin-bottom:16px;}
  .page-head p{color:var(--ink-soft);max-width:560px;font-size:1.05rem;}

  /* La etiqueta de categoría (.news-tag) es un pill que debe ajustarse a su
     texto, pero al vivir dentro de .page-head hereda ".page-head .mono{display:block}"
     (misma especificidad, definida antes) y se estira al ancho completo. */
  .page-head .news-tag{display:inline-block;}

  .cat-filters{display:flex;gap:10px;margin-bottom:40px;flex-wrap:wrap;}
  .cat-chip{
    font-family:'Space Grotesk';font-size:0.72rem;text-transform:uppercase;letter-spacing:0.05em;
    padding:8px 16px;border-radius:100px;border:1px solid var(--line);
    background:var(--white);color:var(--ink-soft);cursor:pointer;transition:all .15s ease;
  }
  .cat-chip:hover{border-color:var(--ink);color:var(--ink);}
  .cat-chip.active{background:var(--ink);color:var(--white);border-color:var(--ink);}

  .featured-news{
    display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center;
    background:var(--white);border:1px solid var(--line);border-radius:20px;
    padding:8px;margin-bottom:56px;overflow:hidden;
  }
  .featured-news .news-visual{
    aspect-ratio:16/9;border-radius:14px;background:var(--blue-deep);
    background-image:radial-gradient(circle at 25% 25%, rgba(3,123,254,0.6), transparent 55%),
                      radial-gradient(circle at 80% 80%, rgba(255,188,0,0.2), transparent 50%);
  }
  .featured-news .news-copy{padding:20px 32px 20px 0;}
  .featured-news .mono.news-tag{
    color:var(--blue);margin-bottom:14px;display:inline-block;
    padding:5px 12px;border:1px solid rgba(3,123,254,0.3);
    background:rgba(3,123,254,0.08);border-radius:100px;
  }
  .featured-news h2{font-size:clamp(1.5rem,2.6vw,2rem);margin-bottom:16px;line-height:1.15;}
  .featured-news p{color:var(--ink-soft);font-size:1rem;margin-bottom:20px;}
  .featured-news .news-date{color:var(--ink-soft);}

  .news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;padding-bottom:80px;}
  /* antes era solo una línea superior (border-top) sin fondo ni bordes —
     se veía como si el contenido "flotara". Ahora es una card real (fondo
     blanco, borde suave, sombra leve) para darle más forma y que no quede
     suelta sobre el fondo de la sección. */
  .news-card{
    background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
    padding:16px;box-shadow:0 10px 24px -18px rgba(11,31,58,0.35);
    transition:transform .18s ease, box-shadow .18s ease;
  }
  .news-card:hover{transform:translateY(-3px);box-shadow:0 18px 36px -20px rgba(11,31,58,0.28);}
  .news-tag{
    color:var(--blue);margin-bottom:12px;display:inline-block;
    padding:5px 12px;border:1px solid rgba(3,123,254,0.3);
    background:rgba(3,123,254,0.08);border-radius:100px;
  }
  .news-card h3{font-family:'Newsreader';font-weight:600;font-size:1.12rem;letter-spacing:-0.01em;margin-bottom:10px;line-height:1.25;}
  .news-card p{color:var(--ink-soft);font-size:0.92rem;margin-bottom:14px;}
  .news-date{color:var(--ink-soft);}

  @media (max-width:900px){
    .featured-news{grid-template-columns:1fr;padding:16px;}
    .featured-news .news-copy{padding:8px 8px 16px;}
    .news-grid{grid-template-columns:1fr;}
  }

/* ============ EPISODIOS (page-episodios.php) ============ */
  .page-head p{color:var(--ink-soft);max-width:560px;font-size:1.05rem;}

  .archive-note{
    display:flex;align-items:center;gap:10px;margin-top:22px;
    font-family:'Space Grotesk';font-size:0.76rem;color:var(--ink-soft);
    border:1px solid var(--line);background:var(--white);
    padding:10px 16px;border-radius:100px;width:fit-content;
  }
  .archive-note .dot{width:6px;height:6px;border-radius:50%;background:var(--yellow);flex-shrink:0;}

  .filters{
    display:flex;gap:10px;margin-bottom:36px;flex-wrap:wrap;
  }
  .filter-btn{
    font-family:'Space Grotesk';font-size:0.74rem;text-transform:uppercase;letter-spacing:0.05em;
    padding:9px 18px;border-radius:100px;border:1px solid var(--line);
    background:var(--white);color:var(--ink-soft);cursor:pointer;transition:all .15s ease;
  }
  .filter-btn:hover{border-color:var(--ink);color:var(--ink);}
  .filter-btn.active{background:var(--ink);color:var(--white);border-color:var(--ink);}

  .season-block{padding-bottom:56px;}
  .season-head{margin-bottom:26px;}
  .season-head .mono{color:var(--blue);margin-bottom:8px;display:block;}
  .season-head h2{font-size:clamp(1.3rem,2.4vw,1.7rem);}

  .ep-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
  .ep-card{
    display:block;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
    transition:transform .2s ease, box-shadow .2s ease;
  }
  .ep-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px -24px rgba(11,31,58,0.25);}
  .ep-card.hidden{display:none;}
  .ep-card.ep-placeholder{opacity:0.55;}
  .ep-card.ep-placeholder:hover{transform:none;box-shadow:none;}
  .ep-card.ep-placeholder .pod-thumb{background-image:none;}

  .archive-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding-bottom:80px;}
  .archive-item{
    background:var(--white);border:1px dashed var(--line);border-radius:var(--radius);
    padding:22px 20px;text-align:center;
  }
  .archive-item .mono{color:var(--ink-soft);display:block;margin-bottom:8px;}
  .archive-item strong{font-family:'Newsreader';font-weight:600;font-size:1.15rem;}
  button.archive-item{font:inherit;color:inherit;cursor:pointer;width:100%;transition:border-color .15s ease, background .15s ease;}
  button.archive-item:hover{border-color:var(--blue);border-style:solid;}
  button.archive-item.active{border-color:var(--blue);border-style:solid;background:rgba(3,123,254,0.05);}
  button.archive-item.active .mono{color:var(--blue);}
  .archive-ep-grid{margin-top:22px;}
  @media (max-width:700px){.archive-strip{grid-template-columns:1fr;}}
  .pod-thumb{
    aspect-ratio:16/9;background:var(--blue-deep);position:relative;
    background-image:radial-gradient(circle at 20% 20%, rgba(3,123,254,0.55), transparent 55%),
                      radial-gradient(circle at 80% 75%, rgba(255,188,0,0.22), transparent 50%);
  }
  .pod-thumb .play-badge{position:absolute;bottom:12px;left:12px;width:42px;height:42px;}
  .pod-thumb .play-badge::after{border-top:9px solid transparent;border-bottom:9px solid transparent;border-left:14px solid var(--blue-deep);margin-left:3px;}
  .pod-rank{
    position:absolute;top:12px;left:12px;font-family:'Space Grotesk';font-size:0.62rem;color:var(--white);
    background:rgba(255,255,255,0.14);border:1px solid rgba(255,255,255,0.28);
    padding:4px 9px;border-radius:100px;letter-spacing:0.04em;
  }
  .pod-body{padding:16px 18px 18px;}
  .pod-body .ep-num{color:var(--blue);margin-bottom:8px;display:block;}
  .pod-body h3{font-family:'Newsreader';font-weight:600;font-size:0.98rem;letter-spacing:-0.005em;margin-bottom:2px;}
  .ep-role{display:block;font-family:'Sora';font-weight:400;font-size:0.82rem;color:var(--ink-soft);}
  .ep-seasons.filter-specific .ep-season-prefix{display:none;}

  @media (max-width:900px){
    .ep-grid{grid-template-columns:repeat(2,1fr);}
  }

/* ============ NOTA INDIVIDUAL (single.php) ============ */
.page-head-nota h1,.entrevista-head h1{max-width:900px;}
/* El título/etiqueta/fecha vive en su propio .wrap (1180px), separado del
   de .single-article — por eso, aunque el artículo ya se centró, el título
   seguía empezando en el borde del wrap ancho en vez de alinearse con la
   caja de 900px de abajo. 956px = 900px + el padding de .wrap (28px x2),
   así el contenido interno mide lo mismo que el artículo y queda alineado. */
.page-head-nota .wrap{max-width:956px;}
.single-article{
  max-width:900px;margin:0 auto;background:var(--white);
  border:1px solid var(--line);border-radius:20px;padding:8px;overflow:hidden;
}
.single-featured-img{
  aspect-ratio:16/9;border-radius:14px;background-color:var(--blue-deep);
  background-size:cover;background-position:center;
}
.single-body{padding:32px 28px 28px;}
.single-content{font-size:1.15rem;line-height:1.75;color:var(--ink);}
.single-content p{margin-bottom:20px;}
.single-content h2{font-size:1.5rem;margin:36px 0 16px;}
.single-content h3{font-size:1.2rem;margin:30px 0 14px;}
.single-content img{max-width:100%;height:auto;border-radius:12px;margin:24px 0;display:block;}
.single-content a{color:var(--blue);text-decoration:underline;}
.single-content ul,.single-content ol{margin:0 0 20px 22px;}
.single-content blockquote{border-left:3px solid var(--blue);padding-left:18px;margin:24px 0;color:var(--ink-soft);font-style:italic;}
.single-article .see-all{display:inline-block;margin-top:24px;}

/* ============ NOTA — ENTREVISTA (single-entrevista.php) ============ */
.entrevista-founder{color:var(--ink-soft);font-size:1.05rem;margin-top:4px;}
.entrevista-founder strong{color:var(--ink);}
.entrevista-layout{display:grid;grid-template-columns:1fr 280px;gap:32px;align-items:start;}
.entrevista-article{max-width:none;margin:0;}
.entrevista-portrait{
  aspect-ratio:4/3;border-radius:14px;background-color:var(--blue-deep);
  background-size:cover;background-position:center;
}
.entrevista-cita{
  font-family:'Newsreader';font-style:italic;font-size:1.3rem;line-height:1.4;
  color:var(--ink);border-left:3px solid var(--blue);padding-left:20px;margin:0 0 28px;
}
.entrevista-ficha{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
  padding:22px 20px;position:sticky;top:100px;
}
.entrevista-ficha h4{color:var(--blue);margin-bottom:14px;}
.entrevista-ficha p{display:flex;flex-direction:column;gap:2px;margin-bottom:14px;}
.entrevista-ficha p:last-child{margin-bottom:0;}
.entrevista-ficha .mono{color:var(--ink-soft);}
.entrevista-ficha strong{font-family:'Newsreader';font-weight:600;font-size:1rem;}
@media (max-width:900px){
  .entrevista-layout{grid-template-columns:1fr;}
  .entrevista-ficha{position:static;}
}

/* ============ GRILLA DE APROBACIÓN (page-clientes.php) ============ */
.grilla-login-section{padding:60px 0;}
#view-login{max-width:420px;margin:0 auto;}
.login-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:44px 36px;text-align:center;}
.login-card .badge{width:52px;height:52px;border-radius:50%;background:var(--blue-deep);margin:0 auto 20px;position:relative;}
.login-card .badge::after{content:"";position:absolute;top:50%;left:50%;width:15px;height:15px;background:var(--yellow);border-radius:50%;transform:translate(-50%,-50%);}
.login-card h1{font-family:'Newsreader';font-weight:600;font-size:1.5rem;margin:0 0 6px;}
.login-card p.lede{color:var(--ink-soft);font-size:0.92rem;margin:0 0 28px;}
.field{text-align:left;margin-bottom:16px;}
.field label{display:block;font-size:0.8rem;color:var(--ink-soft);margin-bottom:6px;}
.field input{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font-family:'Sora';font-size:0.95rem;background:var(--paper);}
.login-btn{width:100%;background:var(--blue-deep);color:#fff;border:none;padding:13px;border-radius:10px;font-family:'Sora';font-weight:600;font-size:0.95rem;cursor:pointer;}
.login-btn:hover{background:var(--blue);}
.captcha-note{margin-top:16px;font-size:0.72rem;color:var(--ink-soft);opacity:0.8;}

.grilla-app-section{padding:36px 0 80px;}
.grid-topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;flex-wrap:wrap;gap:14px;}
.client-select{font-family:'Sora';font-size:0.92rem;padding:9px 14px;border-radius:10px;border:1px solid var(--line);background:var(--white);color:var(--ink);}
.new-post-btn{background:var(--yellow);color:var(--blue-deep);border:none;padding:11px 18px;border-radius:100px;font-family:'Sora';font-weight:700;font-size:0.88rem;cursor:pointer;}

/* Tarjetas de cliente del planificador: reemplazan la vista "todos los
   clientes mezclados" cuando no hay uno elegido todavía. */
.clients-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(150px,1fr));gap:16px;margin-bottom:10px;}
.client-card{
  background:var(--white);border:1px solid var(--line);border-radius:14px;
  padding:20px 14px;text-align:center;cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.client-card:hover{transform:translateY(-3px);box-shadow:0 14px 28px -18px rgba(11,31,58,0.35);border-color:var(--blue);}
.client-card-logo{
  position:relative;width:72px;height:72px;margin:0 auto 12px;border-radius:50%;
  background:var(--paper);display:flex;align-items:center;justify-content:center;overflow:hidden;
  border:1px solid var(--line);
}
.client-card-logo img{width:100%;height:100%;object-fit:cover;}
.client-card-logo-ph{font-family:'Newsreader';font-weight:600;font-size:1.6rem;color:var(--ink-soft);}
.client-card-logo-edit{
  position:absolute;bottom:-2px;right:-2px;width:24px;height:24px;border-radius:50%;
  background:var(--blue-deep);color:#fff;border:2px solid var(--white);font-size:0.7rem;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
}
.client-card-name{font-family:'Newsreader';font-weight:600;font-size:0.95rem;margin-bottom:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.client-card-networks{display:flex;gap:6px;justify-content:center;}
/* Chips de red social EN LA TARJETA (marcan qué redes usa esa marca) — no
   confundir con .platform-chip, que son los del detalle de una publicación. */
.client-network-chip{
  width:24px;height:24px;border-radius:50%;border:1px solid var(--line);background:var(--paper);
  color:var(--ink-soft);font-family:'Space Grotesk';font-size:0.68rem;font-weight:700;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.client-network-chip.on{background:var(--blue);color:#fff;border-color:var(--blue);}

.month-tabs{display:flex;gap:6px;margin-bottom:14px;border-bottom:1px solid var(--line);flex-wrap:wrap;}
.month-tabs button{font-family:'Space Grotesk';font-size:0.74rem;text-transform:uppercase;letter-spacing:0.05em;padding:10px 4px;margin-right:20px;border:none;background:none;color:var(--ink-soft);cursor:pointer;border-bottom:2px solid transparent;}
.month-tabs button.active{color:var(--ink);border-bottom-color:var(--blue);font-weight:600;}

.platform-tabs{display:flex;gap:6px;margin-bottom:26px;flex-wrap:wrap;}
.platform-tabs button{font-family:'Space Grotesk';font-size:0.72rem;text-transform:uppercase;letter-spacing:0.05em;padding:8px 14px;border-radius:100px;border:1px solid var(--line);background:var(--white);color:var(--ink-soft);cursor:pointer;}
.platform-tabs button.active{background:var(--blue-deep);color:#fff;border-color:var(--blue-deep);}
.platform-tabs button.metrics-link{background:var(--blue);color:#fff;border-color:var(--blue);font-weight:700;margin-left:6px;box-shadow:0 2px 0 rgba(11,31,58,0.18);}
.platform-tabs button.metrics-link:hover{filter:brightness(0.92);}

.posts-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(230px,1fr));gap:18px;}
.post-card{background:var(--white);border:1px solid var(--line);border-radius:14px;overflow:hidden;cursor:pointer;transition:transform .12s ease, border-color .12s ease;}
.post-card:hover{border-color:var(--blue);transform:translateY(-2px);}
.post-card[draggable="true"]{cursor:grab;}
.post-card.dragging{opacity:0.4;}
.post-card.drag-over{outline:2px dashed var(--blue);outline-offset:-2px;}
.post-thumb{position:relative;aspect-ratio:4/5;background:var(--paper-dim);display:flex;align-items:center;justify-content:center;overflow:hidden;}
.post-thumb .ph{font-family:'Space Grotesk';font-size:0.68rem;color:var(--ink-soft);}
.status-corner{position:absolute;top:10px;right:10px;width:11px;height:11px;border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,0.8);}
.comment-badge{position:absolute;bottom:10px;right:10px;background:rgba(11,31,58,0.7);color:#fff;font-family:'Space Grotesk';font-size:0.62rem;padding:4px 7px;border-radius:100px;}
/* Marca la miniatura de la grilla como video (el <video> no reproduce solo
   ahí, así que sin esto se vería igual que una foto). */
.video-indicator{position:absolute;bottom:10px;left:10px;width:26px;height:26px;border-radius:50%;background:rgba(11,31,58,0.65);display:flex;align-items:center;justify-content:center;}
.video-indicator::after{content:"";width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:8px solid #fff;margin-left:2px;}
.post-info{padding:11px 12px 13px;}
.post-title{font-family:'Newsreader';font-weight:600;font-size:0.9rem;line-height:1.25;margin-bottom:5px;}
.post-meta-row{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.post-date{font-family:'Space Grotesk';font-size:0.64rem;color:var(--ink-soft);text-transform:uppercase;}
.post-type-label{font-family:'Space Grotesk';font-size:0.64rem;color:var(--blue);text-transform:uppercase;letter-spacing:0.03em;}

/* align-items:flex-start (no "center"/"safe center"): cuando el modal es más
   alto que la pantalla, centrarlo verticalmente deja la mitad que "sobra"
   por arriba fuera del rango de scroll alcanzable (bug clásico de flexbox +
   overflow) — con flex-start el tope del modal (título, flecha de cerrar)
   siempre es alcanzable haciendo scroll hasta arriba. */
.overlay{position:fixed;inset:0;background:rgba(11,31,58,0.5);display:none;align-items:flex-start;justify-content:center;padding:36px 20px;overflow-y:auto;overscroll-behavior:contain;z-index:100;}
.overlay.open{display:flex;}
.detail{background:var(--white);border-radius:18px;max-width:1120px;width:100%;overflow:hidden;position:relative;display:grid;grid-template-columns:1.05fr 1fr;}
.detail-close{position:absolute;top:14px;right:14px;background:rgba(11,31,58,0.55);color:#fff;border:none;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:1rem;z-index:5;}

.detail-left{display:flex;flex-direction:column;max-height:88vh;overflow-y:auto;overscroll-behavior:contain;background:var(--paper-dim);}
.detail-header{padding:20px 22px 14px;background:var(--white);flex-shrink:0;}

.carousel-meta{display:flex;align-items:center;gap:10px;padding:8px 22px 6px;background:var(--white);flex-shrink:0;}
.slide-counter{font-family:'Space Grotesk';font-size:0.7rem;color:var(--ink-soft);letter-spacing:0.03em;}
.dots{display:flex;align-items:center;gap:7px;margin:0 auto;}
.dots span{width:7px;height:7px;border-radius:50%;background:var(--line);}
.dots span.on{background:var(--blue);transform:scale(1.15);}

.detail-carousel{position:relative;background:var(--paper-dim);display:flex;align-items:center;justify-content:center;aspect-ratio:4/5;flex-shrink:0;}
.detail-carousel .ph{font-family:'Space Grotesk';font-size:0.72rem;color:var(--ink-soft);}
.detail-carousel img,.detail-carousel video{box-shadow:0 0 0 1px rgba(11,31,58,0.08), 0 8px 24px rgba(11,31,58,0.12);}
.arrow{position:absolute;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:50%;background:rgba(11,31,58,0.55);color:#fff;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1rem;}
.arrow.left{left:12px;} .arrow.right{right:12px;}
.img-delete{position:absolute;top:12px;right:12px;width:28px;height:28px;border-radius:50%;background:rgba(11,31,58,0.5);color:#fff;border:none;display:none;align-items:center;justify-content:center;cursor:pointer;z-index:5;transition:background .15s ease;}
.img-delete svg{width:15px;height:15px;}
.img-delete:hover{background:rgba(179,38,30,0.75);}

.carousel-thumbs{display:flex;flex-wrap:wrap;gap:10px;padding:14px 20px;overflow-y:auto;max-height:230px;min-height:104px;background:var(--white);flex-shrink:0;}
.carousel-thumb{width:80px;height:80px;flex-shrink:0;border-radius:10px;overflow:hidden;cursor:grab;border:2px solid transparent;opacity:0.75;transition:opacity .15s ease, border-color .15s ease;}
.carousel-thumb img,.carousel-thumb video{width:100%;height:100%;object-fit:cover;display:block;}
.carousel-thumb.active{border-color:var(--blue);opacity:1;}
.carousel-thumb:hover{opacity:1;}
.carousel-thumb.dragging{opacity:0.3;}
.carousel-thumb.drag-over{border-color:var(--yellow);}

.admin-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:4px 20px 18px;background:var(--white);flex-shrink:0;}
.upload-label{font-family:'Space Grotesk';font-size:0.7rem;text-transform:uppercase;letter-spacing:0.04em;padding:9px 14px;border-radius:100px;border:1px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer;}
.upload-label:hover{border-color:var(--blue);color:var(--blue);}
.delete-post-btn{background:none;border:none;font-family:'Space Grotesk';font-size:0.68rem;text-transform:uppercase;letter-spacing:0.04em;color:var(--ink-soft);cursor:pointer;padding:6px 2px;}
.delete-post-btn:hover{color:#B3261E;}
.share-post-btn{background:none;border:none;font-family:'Space Grotesk';font-size:0.68rem;text-transform:uppercase;letter-spacing:0.04em;color:var(--ink-soft);cursor:pointer;padding:6px 2px;}
.share-post-btn:hover{color:var(--blue);}

/* Barra de progreso de subida (imágenes y videos) */
.upload-status{display:none;padding:12px 20px 16px;background:var(--white);border-top:1px solid var(--line);}
.upload-status.show{display:block;}
.upload-line{display:flex;justify-content:space-between;gap:12px;font-family:'Space Grotesk';font-size:0.7rem;margin-bottom:8px;color:var(--ink);}
.upload-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;}
.upload-pct{flex-shrink:0;font-weight:700;}
.upload-bar{height:8px;background:var(--paper-dim);border-radius:100px;overflow:hidden;}
.upload-bar-fill{height:100%;width:0;background:var(--blue);border-radius:100px;transition:width .15s linear;}
.upload-status.processing .upload-bar-fill{background:repeating-linear-gradient(45deg,var(--blue),var(--blue) 10px,#4DA3FF 10px,#4DA3FF 20px);background-size:28px 28px;animation:grilla-stripes 1s linear infinite;}
.upload-status.done .upload-bar-fill{background:#1FA971;}
.upload-status.error .upload-bar-fill{background:#B3261E;}
.upload-msg{font-size:0.76rem;line-height:1.4;margin-top:8px;color:var(--ink-soft);}
.upload-msg:empty{display:none;}
.upload-status.error .upload-msg{color:#B3261E;}
@keyframes grilla-stripes{to{background-position:28px 0;}}

/* Caption: fila con botón de copiar */
.field-label-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:14px 0 6px;}
.field-label-row .field-label{margin:0;}
.copy-btn,.refresh-btn{display:inline-flex;align-items:center;gap:6px;background:var(--white);border:1px solid var(--line);border-radius:100px;padding:5px 11px 5px 9px;font-family:'Space Grotesk';font-size:0.62rem;text-transform:uppercase;letter-spacing:0.05em;color:var(--ink-soft);cursor:pointer;transition:border-color .15s ease,color .15s ease;}
.copy-btn:hover,.refresh-btn:hover{border-color:var(--blue);color:var(--blue);}
.copy-btn svg,.refresh-btn svg{width:13px;height:13px;flex-shrink:0;}
.copy-btn .ico-check{display:none;}
.copy-btn.copied{color:#1FA971;border-color:#1FA971;}
.copy-btn.copied .ico-copy{display:none;}
.copy-btn.copied .ico-check{display:inline;}

/* Botón "Actualizar" de las vistas de cliente */
.refresh-btn.loading svg{animation:grilla-spin .8s linear infinite;}
.refresh-btn.loading{color:var(--blue);border-color:var(--blue);}
.refresh-detail{position:absolute;top:14px;right:54px;z-index:5;}
.refresh-detail--solo{right:14px;}
@keyframes grilla-spin{to{transform:rotate(360deg);}}
@media (max-width:900px){
  .refresh-detail .refresh-text{display:none;}
  .refresh-detail{padding:7px;}
}

/* Métricas de la publicación (admin) */
.metrics-box{margin-top:4px;}
.metrics-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.metrics-fields label{display:flex;flex-direction:column;gap:4px;font-family:'Space Grotesk';font-size:0.62rem;text-transform:uppercase;letter-spacing:0.05em;color:var(--ink-soft);}
.metrics-fields input{border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-family:'Sora';font-size:0.9rem;background:var(--paper);color:var(--ink);width:100%;}
.metrics-fields input:focus{outline:none;border-color:var(--blue);}
.metrics-hint{font-size:0.7rem;color:var(--ink-soft);margin-top:6px;}
#grilla-delete-client-btn:hover{border-color:#B3261E;color:#B3261E;}

.detail-body{padding:22px 24px;max-height:88vh;overflow-y:auto;overscroll-behavior:contain;}
.title-input{font-family:'Newsreader';font-weight:600;font-size:1.15rem;border:none;border-bottom:2px solid transparent;padding:4px 2px;background:transparent;color:var(--ink);width:100%;margin-bottom:12px;}
.title-input:focus{outline:none;border-bottom-color:var(--blue);}

.subrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.date-chip{font-family:'Space Grotesk';font-size:0.72rem;text-transform:uppercase;border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:var(--paper);color:var(--ink);cursor:pointer;position:relative;display:flex;align-items:center;gap:6px;}
.date-chip svg{width:14px;height:14px;flex-shrink:0;color:var(--ink-soft);}
.type-select{font-family:'Space Grotesk';font-size:0.7rem;text-transform:uppercase;border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:var(--paper);color:var(--ink);cursor:pointer;}

.platform-picker{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px;}
.platform-chip{font-family:'Space Grotesk';font-size:0.68rem;text-transform:uppercase;letter-spacing:0.04em;padding:7px 12px;border-radius:100px;border:1px solid var(--line);background:var(--paper);color:var(--ink-soft);cursor:pointer;}
.platform-chip.on{background:var(--blue);color:#fff;border-color:var(--blue);}
.platform-chip.viewing{box-shadow:0 0 0 2px var(--yellow);}

.approve-row{display:flex;gap:10px;align-items:center;}
.status-select{flex:none;width:auto;font-family:'Space Grotesk';font-size:0.68rem;text-transform:uppercase;letter-spacing:0.03em;padding:10px 16px;border-radius:100px;border:none;color:#fff;cursor:pointer;-webkit-appearance:none;appearance:none;}
.approve-btn{flex:none;background:var(--blue-deep);color:#fff;border:none;padding:10px 18px;border-radius:100px;font-family:'Sora';font-weight:600;font-size:0.74rem;cursor:pointer;white-space:nowrap;}
.approve-btn:hover{background:var(--blue);}

/* Antes era una "ruleta" de solo los días del mes actual (sin poder cambiar
   de mes) — se reemplaza por un calendario navegable (◄ ►) para poder ir,
   por ejemplo, a agosto y cargar publicaciones ahí sin importar el mes en
   que esté parada la grilla. */
.wheel-pop{position:absolute;top:100%;left:0;margin-top:6px;background:var(--white);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 28px rgba(11,31,58,0.18);z-index:10;width:264px;padding:14px;display:none;}
.wheel-pop.open{display:block;}
.cal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.cal-month-label{font-family:'Space Grotesk';font-size:0.76rem;font-weight:600;text-transform:uppercase;letter-spacing:0.03em;color:var(--ink);}
.cal-nav{width:24px;height:24px;flex-shrink:0;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--ink-soft);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:0.9rem;line-height:1;transition:border-color .15s ease, color .15s ease;}
.cal-nav:hover{border-color:var(--blue);color:var(--blue);}
.cal-weekdays{display:grid;grid-template-columns:repeat(7,1fr);margin-bottom:2px;}
.cal-weekdays span{text-align:center;font-family:'Space Grotesk';font-size:0.6rem;text-transform:uppercase;color:var(--ink-soft);}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;}
.cal-day{aspect-ratio:1/1;border:none;background:none;border-radius:50%;font-family:'Space Grotesk';font-size:0.78rem;color:var(--ink);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s ease, color .15s ease;}
.cal-day:hover{background:var(--paper-dim);}
.cal-day.selected{background:var(--blue);color:#fff;font-weight:700;}
.cal-day.today:not(.selected){box-shadow:inset 0 0 0 1px var(--blue);}
.cal-day.empty{cursor:default;}
.cal-day.empty:hover{background:none;}
.wheel-nodate{width:100%;margin-top:10px;background:none;border:1px solid var(--line);padding:6px;border-radius:8px;font-family:'Space Grotesk';font-size:0.68rem;text-transform:uppercase;letter-spacing:0.03em;color:var(--ink-soft);cursor:pointer;}
.wheel-nodate:hover{border-color:var(--blue);color:var(--blue);}
.wheel-done{width:100%;margin-top:8px;background:var(--blue-deep);color:#fff;border:none;padding:7px;border-radius:8px;font-family:'Sora';font-size:0.76rem;font-weight:600;cursor:pointer;}

.field-label{font-family:'Space Grotesk';font-size:0.66rem;text-transform:uppercase;letter-spacing:0.05em;color:var(--ink-soft);margin:14px 0 6px;display:block;}
.caption{width:100%;border:1px solid var(--line);border-radius:10px;padding:12px 13px;font-family:'Sora';font-size:0.88rem;line-height:1.45;color:var(--ink);resize:vertical;min-height:320px;background:var(--paper);}
.extra-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px;}
.extra-fields{align-items:start;}
.extra-fields textarea{width:100%;border:1px solid var(--line);border-radius:10px;padding:9px 10px;font-family:'Sora';font-size:0.8rem;line-height:1.4;background:var(--paper);color:var(--ink);resize:none;overflow:hidden;display:block;}
.extra-fields label{display:flex;flex-direction:column;gap:4px;font-family:'Space Grotesk';font-size:0.62rem;text-transform:uppercase;letter-spacing:0.05em;color:var(--ink-soft);}
.extra-fields input{width:100%;border:1px solid var(--line);border-radius:10px;padding:9px 10px;font-family:'Sora';font-size:0.8rem;background:var(--paper);color:var(--ink);}

.comments-box{margin-top:6px;border:1px solid var(--line);border-radius:10px;overflow:hidden;}
.comment-item{padding:9px 11px;border-bottom:1px solid var(--line);font-size:0.8rem;}
.comment-item:last-child{border-bottom:none;}
.comment-item .who{font-family:'Space Grotesk';font-size:0.62rem;text-transform:uppercase;color:var(--blue);display:flex;align-items:center;margin-bottom:3px;gap:8px;}
.comment-item .who span.when{color:var(--ink-soft);text-transform:none;letter-spacing:0;margin-left:auto;}
.comment-delete{background:none;border:none;color:var(--ink-soft);opacity:0.5;cursor:pointer;font-size:0.68rem;padding:0 0 0 4px;line-height:1;flex-shrink:0;}
.comment-delete:hover{opacity:1;color:#B3261E;}
.comment-empty{padding:12px;font-size:0.78rem;color:var(--ink-soft);text-align:center;}
.comment-add{display:flex;gap:6px;padding:9px;background:var(--paper);}
.comment-add input{flex:1;border:1px solid var(--line);border-radius:8px;padding:7px 9px;font-family:'Sora';font-size:0.8rem;}
.comment-add button{background:var(--blue-deep);color:#fff;border:none;padding:7px 12px;border-radius:8px;font-family:'Sora';font-size:0.76rem;font-weight:600;cursor:pointer;}

.detail-foot{display:flex;justify-content:space-between;align-items:center;margin-top:26px;gap:14px;flex-wrap:wrap;}
.saved-note{font-size:0.7rem;color:var(--ink-soft);font-family:'Space Grotesk';}

@media (max-width:760px){
  .detail{grid-template-columns:1fr;max-height:none;}
  .detail-left,.detail-body{max-height:none;overflow-y:visible;}
  .detail-carousel{aspect-ratio:1/1;}
}

/* ============ PANEL DE ADMINISTRACIÓN (menú lateral, solo agencia) ============ */
[hidden]{display:none !important;}
body.adm-mode > header, body.adm-mode > footer{display:none;}
.adm-shell{display:flex;align-items:flex-start;min-height:100vh;background:var(--paper);}
.adm-side{position:sticky;top:0;flex:0 0 232px;width:232px;height:100vh;background:var(--blue-deep);color:#fff;display:flex;flex-direction:column;padding:22px 14px 18px;}
body.admin-bar .adm-side{top:32px;height:calc(100vh - 32px);}
.adm-brand{display:block;padding:2px 10px 22px;color:#fff;font-weight:700;}
.adm-brand img{display:block;width:168px;max-width:100%;height:auto;margin:-14px 0 -10px -6px;}
.adm-nav{display:flex;flex-direction:column;gap:3px;}
.adm-nav button{display:flex;align-items:center;gap:11px;width:100%;text-align:left;background:transparent;border:0;border-radius:10px;color:rgba(255,255,255,0.72);font-family:'Sora',sans-serif;font-size:0.88rem;font-weight:500;padding:10px 12px;cursor:pointer;}
.adm-nav button:hover{background:rgba(255,255,255,0.08);color:#fff;}
.adm-nav button.active{background:var(--blue);color:#fff;}
.adm-nav-label{font-family:'Space Grotesk';font-size:0.66rem;text-transform:uppercase;letter-spacing:0.1em;color:rgba(255,255,255,0.45);padding:20px 12px 6px;}
.adm-side-foot{margin-top:auto;display:flex;flex-direction:column;gap:6px;padding:14px 12px 0;border-top:1px solid rgba(255,255,255,0.12);font-size:0.8rem;}
.adm-side-foot a{color:rgba(255,255,255,0.7);}
.adm-side-foot a:hover{color:#fff;}
.adm-user{color:#fff;font-weight:600;}
.adm-main{flex:1;min-width:0;}
.adm-main .grilla-app-section{padding:30px 0 80px;}
.adm-main .wrap{max-width:none;padding:0 36px;}
.adm-page{padding:34px 36px 80px;max-width:1100px;}
.adm-h1{font-family:'Newsreader',serif;font-weight:600;font-size:2rem;line-height:1.15;margin-bottom:4px;}
.adm-h2{font-family:'Space Grotesk';font-weight:700;font-size:0.8rem;text-transform:uppercase;letter-spacing:0.08em;margin:34px 0 6px;}
.adm-sub{color:var(--ink-soft);font-size:0.9rem;margin-bottom:22px;}
.adm-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 22px;color:var(--ink-soft);font-size:0.92rem;}
.adm-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;}
.adm-stat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 18px;}
.adm-stat strong{display:block;font-family:'Sora',sans-serif;font-size:1.9rem;font-weight:700;line-height:1.1;}
.adm-stat span{font-family:'Space Grotesk';font-size:0.7rem;text-transform:uppercase;letter-spacing:0.06em;color:var(--ink-soft);}
.adm-rows{display:flex;flex-direction:column;gap:10px;}
.adm-row{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 16px;cursor:pointer;transition:border-color .15s,transform .15s;}
.adm-row:hover{border-color:var(--blue);transform:translateY(-1px);}
.adm-row-logo{flex:0 0 40px;width:40px;height:40px;border-radius:10px;border:1px solid var(--line);background:var(--paper);display:flex;align-items:center;justify-content:center;overflow:hidden;font-family:'Newsreader';font-weight:600;color:var(--ink-soft);}
.adm-row-logo img{width:100%;height:100%;object-fit:cover;}
.adm-row-name{flex:1;min-width:0;font-weight:600;font-size:0.95rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.adm-chips{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;}
.adm-chip{font-family:'Space Grotesk';font-size:0.68rem;text-transform:uppercase;letter-spacing:0.04em;padding:4px 10px;border-radius:100px;color:#fff;white-space:nowrap;}
.adm-chip.vacio{background:var(--paper) !important;color:var(--ink-soft);}
@media (max-width:900px){
  .adm-shell{flex-direction:column;}
  .adm-side{position:static;flex:none;width:100%;height:auto;padding:12px 14px;}
  body.admin-bar .adm-side{top:auto;height:auto;}
  .adm-brand{padding:0 6px 10px;}
  .adm-brand img{width:130px;margin:-10px 0 -8px -4px;}
  .adm-nav{flex-direction:row;flex-wrap:wrap;gap:6px;}
  .adm-nav button{width:auto;padding:8px 12px;}
  .adm-nav-label{display:none;}
  .adm-side-foot{flex-direction:row;flex-wrap:wrap;gap:14px;margin-top:10px;padding-top:10px;}
  .adm-main .wrap{padding:0 18px;}
  .adm-page{padding:24px 18px 60px;}
}

.aud-bar{display:flex;align-items:center;gap:14px;margin-bottom:22px;flex-wrap:wrap;}
.aud-estado{font-family:'Space Grotesk';font-size:0.74rem;color:var(--ink-soft);}
.aud-sec{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 22px;margin-bottom:18px;}
.aud-sec h2{font-family:'Space Grotesk';font-weight:700;font-size:0.82rem;text-transform:uppercase;letter-spacing:0.08em;margin-bottom:12px;}
.aud-f{display:block;margin-bottom:12px;}
.aud-f span{display:block;font-family:'Space Grotesk';font-size:0.68rem;text-transform:uppercase;letter-spacing:0.05em;color:var(--ink-soft);margin-bottom:4px;}
.aud-f input,.aud-f textarea,.aud-red select{width:100%;border:1px solid var(--line);background:var(--paper);border-radius:8px;padding:9px 11px;font:400 0.88rem/1.45 'Sora',sans-serif;color:var(--ink);outline:none;resize:vertical;}
.aud-f input:focus,.aud-f textarea:focus,.aud-red select:focus{border-color:var(--blue);background:#fff;}
.aud-2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px;}
.aud-item{position:relative;border:1px solid var(--line);border-radius:12px;padding:14px 16px 4px;margin-bottom:12px;}
.aud-del{position:absolute;top:8px;right:10px;background:none;border:0;font-size:1.2rem;line-height:1;color:var(--ink-soft);cursor:pointer;}
.aud-red-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.aud-chk{display:flex;align-items:center;gap:8px;font-size:0.92rem;}
.aud-nota{font-family:'Space Grotesk';font-size:0.74rem;text-transform:uppercase;color:var(--ink-soft);display:flex;align-items:center;gap:8px;}
.aud-red select{width:64px;padding:5px 8px;}
.aud-add{background:transparent;border:1.5px dashed var(--line);color:var(--ink-soft);border-radius:100px;padding:8px 18px;font-family:'Space Grotesk';font-size:0.74rem;text-transform:uppercase;letter-spacing:0.05em;font-weight:600;cursor:pointer;}
.aud-add:hover{border-color:var(--blue);color:var(--blue);}
@media (max-width:760px){.aud-2{grid-template-columns:1fr;}}
.aud-descargas{display:flex;gap:8px;margin-left:auto;}