/* ============================================================
   STORZ · Capa de rediseño — Medicaltech
   Se carga DESPUÉS de style.css. Tokens de marca + tipografía.
   Identidad anclada en marca: #00415B / #2792D0 / #89C3E0
   Fase 1: fundamentos (tokens + tipografía).
   ============================================================ */

:root{
  /* Solo modo claro: evita el auto dark theme de navegadores móviles
     (Chrome Android, Samsung Internet). El keyword `only` impide que el
     navegador aplique su propio oscurecido automático. */
  color-scheme: only light;
  /* superficies */
  --ground:#EEF2F5; --ground-2:#E6ECEF; --paper:#FBFCFD;
  /* tinta / estructura (petróleo corporativo) */
  --ink:#00415B; --ink-panel:#00415B; --muted:#4F6B79;
  --line:rgba(0,65,91,.12); --line-strong:rgba(0,65,91,.22);
  /* firmas de energía (marca) */
  --cyan:#2792D0; --cyan-deep:#1B6494;    /* ondas de choque focales */
  --coral:#89C3E0; --coral-deep:#1E5169;  /* magnetotransducción (azul claro de marca) */
  /* sobre fondos oscuros */
  --on-dark:#E7F0F2; --on-dark-mut:#8FB0BB;
  /* escala / radios */
  --r:14px; --maxw:1150px;
  /* tipografía */
  --sans:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --disp:'Bricolage Grotesque',var(--sans);
  --mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;
}

/* ---- Tipografía base ---- */
body{
  font-family:var(--sans);
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* Display: Bricolage Grotesque. Las clases de peso del theme (.bold/.extra-bold)
   siguen mandando; sin clase, el navegador usa la cara más cercana (600). */
h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4{
  font-family:var(--disp);
  letter-spacing:-.02em;
}

/* Datos / instrumentación */
.mono{
  font-family:var(--mono);
  font-variant-numeric:tabular-nums;
  letter-spacing:.01em;
}

/* Foco accesible coherente con la marca */
:focus-visible{
  outline:2.5px solid var(--cyan-deep);
  outline-offset:3px;
}

/* ============================================================
   COMPONENTES (sistema de rediseño)
   ============================================================ */

/* Eyebrow */
.eyebrow{font-family:var(--mono); font-weight:500; font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); display:inline-flex; align-items:center; gap:.7em; margin:0}
.eyebrow::before{content:""; width:1.6em; height:2px; background:var(--cyan); display:inline-block}
.eyebrow--ondark{color:var(--on-dark-mut)}

/* Display / lead */
.d1{font-family:var(--disp); font-weight:800; font-size:clamp(2.5rem,6.4vw,5rem); line-height:.98; letter-spacing:-.025em; margin:0; color:var(--ink)}
.lead{font-size:clamp(1.05rem,1.7vw,1.3rem); line-height:1.5; color:var(--ink); max-width:42ch}

/* Chips de datos */
.chips{display:flex; flex-wrap:wrap; gap:.55rem; padding:0; margin:0; list-style:none}
.chip{font-family:var(--mono); font-size:.74rem; letter-spacing:.04em; color:var(--ink); background:var(--paper); border:1px solid var(--line); border-radius:999px; padding:.5em .9em; display:inline-flex; align-items:center; gap:.55em; margin:0}
.chip::before{content:""; width:.5em; height:.5em; border-radius:50%; background:var(--cyan)}
.chip--coral::before{background:var(--coral)}

/* Botones */
.btn{font-family:var(--sans); font-weight:600; font-size:.98rem; border-radius:999px; padding:.85em 1.5em; border:1px solid transparent; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; gap:.6em; transition:transform .25s cubic-bezier(.2,.7,.3,1), background .25s, color .25s, border-color .25s; line-height:1}
.btn--primary{background:var(--ink); color:var(--on-dark)}
.btn--primary:hover{background:var(--cyan-deep); transform:translateY(-2px); color:#fff}
.btn--ghost{background:transparent; color:var(--ink); border-color:var(--line-strong)}
.btn--ghost:hover{border-color:var(--ink); transform:translateY(-2px)}
.btn .ar{transition:transform .25s}
.btn:hover .ar{transform:translateX(3px)}
.btn-row{display:flex; flex-wrap:wrap; gap:.8rem; align-items:center}

/* ---- Hero ---- */
.storz-hero{background:var(--ground); padding:clamp(2rem,5vw,4.5rem) 0 clamp(2.5rem,6vw,5rem); overflow:hidden}
.storz-hero .hero{display:grid; gap:clamp(1.5rem,4vw,3.5rem); align-items:center; grid-template-columns:1fr}
@media(min-width:920px){.storz-hero .hero{grid-template-columns:1.02fr .98fr}}
.hero__copy>*{margin:0}
.hero__copy>*+*{margin-top:1.4rem}
.hero__stage{position:relative; aspect-ratio:1/1; max-height:min(68vh,580px); width:100%}
.hero__fx{position:absolute; inset:0; width:100%; height:100%}
.hero__render{position:absolute; inset:0; margin:auto; width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; padding:6% 2% 2%}
.hero__data{position:absolute; left:0; bottom:0}

/* Reveal (namespaced para no chocar con reveal-animation.css) */
.s-reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.3,1)}
.s-reveal.in{opacity:1; transform:none}
@media(prefers-reduced-motion:reduce){.s-reveal{opacity:1!important; transform:none!important; transition:none}}

/* ============================================================
   HEADER — sticky, claro translúcido, logo petróleo
   ============================================================ */
#head{position:sticky; top:0; background:rgba(238,242,245,.86); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); transition:box-shadow .3s, background .3s}
body:not(.menu-active).scrolling #head{background:rgba(238,242,245,.93); box-shadow:0 6px 24px -18px rgba(0,65,91,.55)}

/* subhead fino en petróleo */
#head .subhead{background:var(--ink); color:var(--on-dark); padding:.45rem 0; font-size:.82rem}
#head .subhead .lightblue{color:var(--on-dark)}
#head .subhead a{color:#fff}

/* barra principal transparente sobre el head claro */
#head .head{background:transparent; color:var(--ink); padding:.55rem 0}

/* logo en petróleo (SVG inline hereda currentColor) */
#head .logo{width:auto; color:var(--ink)}
#head .logo svg{display:block; height:auto; width:min(46vw,200px)}
@media(min-width:992px){#head .logo svg{width:auto; height:clamp(24px,2vw,28px)}}

/* nav desktop */
#head ul.menu > li > a{color:var(--ink); font-family:var(--sans); font-weight:500; font-size:.95rem}
#head ul.menu > li > a:after{background:var(--cyan)}
#head ul.menu > li:hover > a{color:var(--cyan-deep)}
#head ul.menu > li.menu-item-has-children:after{border-left-color:var(--ink); border-bottom-color:var(--ink)}

/* hamburguesa e iconos en petróleo */
#head .hamburger-inner, #head .hamburger-inner:after, #head .hamburger-inner:before{background-color:var(--ink)}
#head .icons a{color:var(--ink)}

/* neutraliza el estado .transparent heredado (ya no hay hero-imagen de fondo) */
body #head.transparent{background:rgba(238,242,245,.86)}
body #head.transparent .logo{color:var(--ink)}
body #head.transparent .hamburger-inner, body #head.transparent .hamburger-inner:after, body #head.transparent .hamburger-inner:before{background-color:var(--ink)}

/* con header sticky el contenido ya fluye debajo: sin padding-top de compensación */
#main{padding-top:0}

/* ============================================================
   BLOQUES DE SECCIÓN + CARDS (tecnologías / productos)
   ============================================================ */
.storz-block{padding:clamp(3rem,7vw,5.5rem) 0}
.storz-block__head{margin-bottom:clamp(1.8rem,4vw,2.8rem)}
.d2{font-family:var(--disp); font-weight:700; font-size:clamp(1.7rem,4vw,2.9rem); line-height:1.04; letter-spacing:-.02em; margin:.6rem 0 0; color:var(--ink)}

.grid2{display:grid; gap:1.4rem; grid-template-columns:1fr}
@media(min-width:780px){.grid2{grid-template-columns:1fr 1fr}}

.card{position:relative; background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:clamp(1.4rem,3vw,2.1rem); overflow:hidden; transition:transform .3s cubic-bezier(.2,.7,.3,1), border-color .3s, box-shadow .3s; display:flex; flex-direction:column; gap:1rem; text-decoration:none; color:var(--ink); height:100%}
.card:hover{transform:translateY(-4px); box-shadow:0 22px 50px -28px rgba(0,65,91,.4)}
.card::before{content:""; position:absolute; inset:0 0 auto 0; height:4px; background:var(--cyan); z-index:1}
.card--coral::before{background:var(--coral)}
.card--coral:hover{border-color:var(--coral)}
.card:not(.card--coral):hover{border-color:var(--cyan)}
.card__no{font-family:var(--mono); font-size:.74rem; letter-spacing:.12em; color:var(--muted)}
.card__media{position:relative; aspect-ratio:16/11; background:radial-gradient(120% 120% at 70% 20%, #fff, var(--ground-2)); border-radius:8px; overflow:hidden}
.card__media img{position:absolute; inset:0; width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; padding:4%}
/* variante con foto real (blog): sin recorte de fondo */
.card--photo .card__media{background:var(--ground-2)}
.card--photo .card__media img{mix-blend-mode:normal; object-fit:cover; padding:0}
.card__title{font-family:var(--disp); font-weight:700; font-size:clamp(1.15rem,2vw,1.5rem); line-height:1.1; letter-spacing:-.01em; margin:0; color:var(--ink)}
.card__text{color:var(--muted); margin:0; font-size:.98rem; line-height:1.5}
.card__tags{display:flex; flex-wrap:wrap; gap:.4rem; list-style:none; padding:0; margin:0}
.card__tag{font-size:.8rem; color:var(--muted); border:1px solid var(--line); border-radius:6px; padding:.25em .65em}
.card__link{font-weight:600; text-decoration:none; display:inline-flex; gap:.45em; align-items:center; margin-top:auto; color:var(--cyan-deep)}
.card--coral .card__link{color:var(--coral-deep)}
.card__link .ar{transition:transform .25s}
.card:hover .card__link .ar{transform:translateX(4px)}

/* ============================================================
   FOOTER
   ============================================================ */
#footer .darkblue-content{background:var(--ink); color:var(--on-dark); padding:clamp(3rem,6vw,5rem) 0; position:relative}
#footer .darkblue-content::before{content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--cyan),var(--coral))}
#footer .logo{display:block; width:auto}
#footer .logo img{width:min(230px,60vw); height:auto; display:block}
/* títulos de columna como eyebrows */
#footer .h3{font-family:var(--mono); font-weight:500; font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--on-dark-mut); margin:0 0 1.1rem; display:inline-flex; align-items:center; gap:.6em}
#footer .h3::before{content:""; width:1.4em; height:2px; background:var(--cyan); display:inline-block}
#footer ul.menu{margin:0; padding:0}
#footer ul.menu li{list-style:none; margin:0 0 .6rem}
#footer ul.menu li > a{color:var(--on-dark); text-decoration:none; opacity:.85; font-size:.98rem; transition:opacity .2s, color .2s}
#footer ul.menu li > a:hover{opacity:1; color:#fff}
/* newsletter destacada con degradado de marca */
#footer .newsletter-section{background:linear-gradient(135deg,var(--cyan),var(--cyan-deep)); border-radius:18px; padding:clamp(1.6rem,3vw,2.4rem)}
#footer .newsletter-section .h3{font-family:var(--disp); color:#fff; font-size:clamp(1.1rem,2vw,1.4rem); letter-spacing:-.01em; text-transform:none; margin-bottom:1.1rem}
#footer .newsletter-section .h3::before{display:none}
/* franja inferior integrada en petróleo profundo */
#footer .lightblue-content{background:#002C3F; color:var(--on-dark-mut); padding:1.1rem 0; font-size:.9rem}
#footer .lightblue-content a{color:#fff; font-weight:600; text-decoration:none}

/* ============================================================
   SECCIÓN DE CONTACTO — formulario rediseñado (panel petróleo)
   ============================================================ */
.contact-section{background:var(--ink); padding:clamp(3.5rem,7vw,6rem) 0}
.contact-section .container{max-width:920px}
.contact-section__eyebrow{display:flex; justify-content:center; width:100%; color:var(--on-dark-mut); margin:0}
.contact-section__eyebrow::before{background:var(--cyan)}
.contact-section .d2{color:#fff; text-align:center; margin:.7rem 0 2.6rem}

/* Layout del formulario en 2 columnas — flexbox robusto (independiente del grid de GF) */
.contact-section [class*="gform_fields"]{display:flex !important; flex-wrap:wrap !important; gap:1rem 1.2rem !important; grid-template-columns:none !important}
.contact-section [class*="gform_fields"] > .gfield{width:calc(50% - .6rem) !important; max-width:calc(50% - .6rem) !important; grid-column:auto !important; margin:0 !important; min-width:0 !important}
.contact-section [class*="gform_fields"] > .gfield--type-textarea,
.contact-section [class*="gform_fields"] > .gfield--type-radio,
.contact-section [class*="gform_fields"] > .gfield--type-consent{width:100% !important; max-width:100% !important}
@media(max-width:600px){.contact-section [class*="gform_fields"] > .gfield{width:100% !important; max-width:100% !important}}

/* Inputs claros sobre petróleo */
.contact-section .gform_wrapper.gravity-theme input[type=text],
.contact-section .gform_wrapper.gravity-theme input[type=email],
.contact-section .gform_wrapper.gravity-theme textarea{
	background:#fff !important; border:1px solid transparent !important; border-radius:10px !important;
	padding:.95rem 1.15rem !important; font-family:var(--sans) !important; font-size:1rem !important; color:var(--ink) !important;
}
.contact-section textarea{min-height:140px !important; margin:0 !important}
.contact-section input::placeholder, .contact-section textarea::placeholder{color:#6b8593; opacity:1}

/* Radios como PILLS horizontales (Paciente / Médico / Distribuidor) */
.contact-section .gfield--type-radio .gfield_label{color:#fff; font-family:var(--mono); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; margin-bottom:.85rem; display:block}
.contact-section .gfield_radio{display:flex !important; flex-wrap:wrap; gap:.8rem}
.contact-section .gfield_radio .gchoice{margin:0 !important; position:relative}
.contact-section .gfield_radio input[type=radio]{position:absolute !important; opacity:0 !important; width:1px !important; height:1px !important; pointer-events:none}
.contact-section .gfield_radio label{display:inline-flex !important; align-items:center; padding:.72em 1.6em !important; border:1.5px solid rgba(255,255,255,.35) !important; border-radius:999px !important; cursor:pointer; color:var(--on-dark) !important; font-size:1rem !important; transition:all .2s; margin:0 !important}
.contact-section .gfield_radio label:hover{border-color:#fff !important}
.contact-section .gfield_radio input[type=radio]:checked + label{background:var(--cyan) !important; border-color:var(--cyan) !important; color:#fff !important}

/* Consentimiento (checkbox normal, teñido de cian) */
.contact-section .gfield--type-consent .gchoice{display:flex; align-items:flex-start; gap:.55rem}
.contact-section .gfield--type-consent input[type=checkbox]{-webkit-appearance:auto !important; appearance:auto !important; position:static !important; opacity:1 !important; visibility:visible !important; width:18px !important; height:18px !important; min-width:18px; accent-color:var(--cyan); margin:.15rem 0 0 !important}
.contact-section .gfield--type-consent label{color:var(--on-dark) !important; font-size:.9rem; line-height:1.5}
.contact-section .gfield--type-consent label::before, .contact-section .gfield--type-consent label::after{display:none !important}
.contact-section .gfield--type-consent a{color:#fff !important; font-weight:600}

/* Botón de envío — grande, cian, destacado */
.contact-section .gform_footer{display:flex !important; justify-content:center; margin-top:2rem}
.contact-section .gform_footer .gform_button{
	background:var(--cyan) !important; color:#fff !important; border:none !important;
	font-family:var(--sans) !important; font-weight:700 !important; font-size:1.05rem !important;
	padding:1.05em 2.8em !important; border-radius:999px !important; cursor:pointer; width:auto !important;
	display:inline-flex !important; align-items:center; gap:.5em; line-height:1;
	box-shadow:0 12px 30px -12px rgba(39,146,208,.65); transition:transform .2s, background .2s, color .2s;
}
.contact-section .gform_footer .gform_button:hover{background:#fff !important; color:var(--ink) !important; transform:translateY(-2px)}

/* Refuerzo con ID del formulario de contacto (#gform_1): gana a empates con el CSS de GF */
#gform_1 .gfield_radio{display:flex !important; flex-direction:row !important; flex-wrap:wrap !important; gap:.8rem !important}
#gform_1 .gfield_radio .gchoice{width:auto !important; flex:0 0 auto !important; display:inline-block !important; margin:0 !important}
#gform_1 .gform_footer{display:flex !important; justify-content:center}
#gform_1 .gform_footer .gform_button{
	background:var(--cyan) !important; color:#fff !important; border:none !important;
	font-weight:700 !important; font-size:1.05rem !important; padding:1.05em 2.9em !important;
	border-radius:999px !important; width:auto !important; display:inline-flex !important; align-items:center; gap:.5em;
	box-shadow:0 12px 30px -12px rgba(39,146,208,.65);
}
#gform_1 .gform_footer .gform_button:hover{background:#fff !important; color:var(--ink) !important}
/* Botón de Gravity Forms (texto, sustituye al image-button roto).
   !important para ganar a las variables/estilos por defecto de GF. */
.gform_wrapper .gform_button.btn{background:var(--ink) !important; color:var(--on-dark) !important; border:none !important; cursor:pointer; border-radius:999px}
.gform_wrapper .gform_button.btn:hover{background:var(--cyan-deep) !important; color:#fff !important}
/* en el newsletter (sobre degradado cian) hover a blanco */
#footer .newsletter-section .gform_button.btn:hover{background:#fff !important; color:var(--ink) !important}

/* ============================================================
   HOME · jerarquía productos > noticias + variación de formato
   ============================================================ */

/* Display intermedio (menor que .d2) — para secciones secundarias */
.d3{font-family:var(--disp); font-weight:700; font-size:clamp(1.35rem,2.6vw,2rem); line-height:1.08; letter-spacing:-.015em; margin:.45rem 0 0; color:var(--ink)}

/* Cabecera con CTA en línea (variación frente a las cabeceras centradas) */
.storz-block__head--row{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:.6rem 1.5rem}
.storz-block__head--center{text-align:center; display:flex; flex-direction:column; align-items:center}
.storz-block__head--center .eyebrow{justify-content:center}
.storz-block__cta{font-family:var(--sans); font-weight:600; font-size:.98rem; color:var(--cyan-deep); text-decoration:none; display:inline-flex; align-items:center; gap:.5em; white-space:nowrap; padding-bottom:.2rem}
.storz-block__cta .ar{transition:transform .25s}
.storz-block__cta:hover{color:var(--ink)}
.storz-block__cta:hover .ar{transform:translateX(4px)}

/* ---- Productos destacados: "showroom" sobre superficie diferenciada ---- */
.storz-showcase{background:linear-gradient(180deg,var(--ground-2),var(--ground)); position:relative}
.showcase-grid{display:grid; gap:1.2rem; grid-template-columns:1fr}
@media(min-width:560px){.showcase-grid{grid-template-columns:1fr 1fr}}
@media(min-width:980px){.showcase-grid{grid-template-columns:repeat(4,1fr); gap:1.4rem}}
/* cards de producto más presentes: media mayor y elevación marcada */
.storz-showcase .card{background:var(--paper)}
.storz-showcase .card .card__media{aspect-ratio:4/3}
.storz-showcase .card:hover{box-shadow:0 26px 56px -26px rgba(0,65,91,.45)}

/* ---- Noticias: tira compacta, formato editorial (claramente secundario) ---- */
.news-strip{display:grid; gap:1rem; grid-template-columns:1fr}
@media(min-width:720px){.news-strip{grid-template-columns:1fr 1fr}}
/* card horizontal: miniatura izquierda + texto derecha (grid, sin tocar el partial) */
.news-strip .card{display:grid; grid-template-columns:34% 1fr; gap:.35rem 1.1rem; align-content:start; padding:.8rem; border-radius:10px}
.news-strip .card::before{display:none}                 /* sin barra de acento: más sobrio */
.news-strip .card:hover{transform:none; border-color:var(--line); box-shadow:0 14px 30px -22px rgba(0,65,91,.4)}
.news-strip .card .card__media{grid-column:1; grid-row:1 / span 3; align-self:stretch; height:100%; aspect-ratio:1/1; border-radius:7px}
.news-strip .card .card__title{grid-column:2; grid-row:1; font-size:clamp(1rem,1.5vw,1.12rem)}
.news-strip .card .card__text{grid-column:2; grid-row:2; font-size:.88rem; line-height:1.45; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.news-strip .card .card__link{grid-column:2; grid-row:3; font-size:.85rem; margin-top:.15rem}
/* sin imagen destacada: una sola columna, sin hueco de miniatura */
.news-strip .card--nophoto{grid-template-columns:1fr}
.news-strip .card--nophoto .card__title,
.news-strip .card--nophoto .card__text,
.news-strip .card--nophoto .card__link{grid-column:1}
@media(max-width:420px){.news-strip .card{grid-template-columns:40% 1fr}}

/* ============================================================
   BANNER RECLAMO — sección fullscreen intermedia
   ============================================================ */
/* formato cinematográfico 21:9; en pantallas estrechas el alto lo marca el contenido (min-height:max-content) para no recortar */
.storz-claim{position:relative; aspect-ratio:21/9; min-height:max-content; max-height:90vh; display:flex; align-items:center; background:var(--ink); overflow:hidden; isolation:isolate}
.storz-claim__bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2}
.storz-claim__veil{position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(0,44,63,.82),rgba(0,44,63,.6) 45%,rgba(0,33,47,.94))}
/* anillos de energía: eco del motivo de ondas de choque del hero (solo CSS) */
.storz-claim__rings{position:absolute; z-index:-1; right:-12%; top:50%; translate:0 -50%; width:min(115vh,980px); aspect-ratio:1; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle,transparent 37%,rgba(39,146,208,.12) 38%,transparent 39.5%,transparent 51%,rgba(39,146,208,.09) 52%,transparent 53.5%,transparent 66%,rgba(39,146,208,.06) 67%,transparent 68.5%)}
.storz-claim__inner{position:relative; max-width:46rem; padding:clamp(1.8rem,5vh,4rem) 0}
.storz-claim__inner>*+*{margin-top:1.4rem}
.storz-claim__title{font-family:var(--disp); font-weight:800; font-size:clamp(2.2rem,5.5vw,4rem); line-height:1; letter-spacing:-.025em; color:#fff; margin:0}
.storz-claim__lead{color:var(--on-dark); max-width:48ch; margin:0}

/* Botones sobre fondo oscuro */
.btn--on-dark{background:var(--cyan); color:#fff}
.btn--on-dark:hover{background:#fff; color:var(--ink); transform:translateY(-2px)}
.btn--ghost-light{background:transparent; color:#fff; border-color:rgba(255,255,255,.45)}
.btn--ghost-light:hover{border-color:#fff; transform:translateY(-2px)}

/* ============================================================
   SINGLE DE NOTICIA — pieza editorial
   ============================================================ */
.post-single{padding:0 0 clamp(3rem,7vw,5.5rem)}
.post-single .container{max-width:var(--maxw)}

/* Cabecera sobre banda clínica */
.post-single__band{background:var(--ground); border-bottom:1px solid var(--line); padding:clamp(2rem,5vw,3.6rem) 0 clamp(3rem,6vw,4.6rem)}
.post-single__head{max-width:800px; margin:0 auto; text-align:center}
.post-single__head .eyebrow{justify-content:center}
.post-single__head .eyebrow a{color:inherit; text-decoration:none}
.post-single__head .eyebrow a:hover{color:var(--cyan-deep)}
.post-single__title{font-family:var(--disp); font-weight:800; color:var(--ink); font-size:clamp(1.9rem,4.6vw,3.15rem); line-height:1.05; letter-spacing:-.025em; margin:1.1rem 0 0}
.post-single__meta{list-style:none; display:flex; flex-wrap:wrap; justify-content:center; gap:.9rem; padding:0; margin:1.4rem 0 0; font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
.post-single__meta li{display:inline-flex; align-items:center}
.post-single__meta li+li::before{content:""; width:4px; height:4px; border-radius:50%; background:var(--cyan); margin-right:.9rem}

/* Imagen destacada: sube y solapa la banda (gesto editorial) */
.post-single__media{position:relative; z-index:1; max-width:920px; margin:clamp(-2.4rem,-5vw,-3.4rem) auto clamp(2rem,4.5vw,3.2rem); border-radius:var(--r); overflow:hidden; border:1px solid var(--line); background:var(--ground-2); aspect-ratio:16/9; box-shadow:0 30px 60px -34px rgba(0,65,91,.5)}
.post-single__media img{display:block; width:100%; height:100%; object-fit:cover}
/* si no hay imagen, el cuerpo respira desde la banda */
.post-single .container > .post-single__body:first-child{margin-top:clamp(2.2rem,5vw,3.4rem)}

/* ---- Cuerpo / prosa ---- */
.prose{max-width:720px; margin:0 auto; color:var(--ink); font-size:1.075rem; line-height:1.78}
.prose > *{margin:0}
.prose > * + *{margin-top:1.35em}
.prose > *:first-child{margin-top:0; padding-top:0; border-top:none}
.prose > p:first-of-type{font-size:clamp(1.15rem,2vw,1.28rem); line-height:1.62; color:var(--ink)}
.prose p{color:#1c4152}
.prose h2{font-family:var(--disp); font-weight:700; color:var(--ink); font-size:clamp(1.4rem,2.8vw,1.95rem); line-height:1.16; letter-spacing:-.02em; margin-top:2em; padding-top:1.2em; border-top:1px solid var(--line)}
.prose h3{font-family:var(--disp); font-weight:700; color:var(--ink); font-size:clamp(1.12rem,2vw,1.34rem); line-height:1.22; margin-top:1.8em}
.prose a{color:var(--cyan-deep); text-decoration:underline; text-underline-offset:2px; text-decoration-thickness:1px}
.prose a:hover{color:var(--ink)}
.prose strong{font-weight:700; color:var(--ink)}
/* énfasis suelto (pregunta retórica): párrafo con sólo <strong> */
.prose p > strong:only-child{display:block; font-family:var(--disp); font-size:clamp(1.2rem,2.2vw,1.5rem); line-height:1.25; padding-left:1rem; border-left:3px solid var(--cyan)}

/* listas con marcador de marca */
.prose ul{list-style:none; padding:0}
.prose ul li{position:relative; padding-left:1.7em; margin-top:.55em}
.prose ul li::before{content:""; position:absolute; left:.1em; top:.62em; width:.55em; height:.55em; border-radius:50%; border:2px solid var(--cyan)}
.prose ol{padding-left:1.4em}
.prose ol li{margin-top:.55em; padding-left:.3em}
.prose ol li::marker{color:var(--cyan-deep); font-family:var(--mono); font-weight:600}

/* tabla — lenguaje de instrumentación */
.prose .wp-block-table{margin-top:1.7em; margin-bottom:1.7em; overflow-x:auto; -webkit-overflow-scrolling:touch}
.prose table{width:100%; border-collapse:collapse; font-size:.97rem; background:var(--paper); border:1px solid var(--line); border-radius:10px; overflow:hidden}
.prose thead th{background:var(--ink); color:var(--on-dark); font-family:var(--sans); font-weight:600; text-align:left; padding:.85em 1em; font-size:.92rem}
.prose tbody td{padding:.8em 1em; border-top:1px solid var(--line); color:var(--ink); vertical-align:top}
.prose tbody tr:nth-child(even) td{background:rgba(0,65,91,.035)}

.prose blockquote{margin:1.5em 0; padding:.3em 0 .3em 1.3em; border-left:3px solid var(--cyan); font-family:var(--disp); font-size:1.2rem; line-height:1.4; color:var(--ink)}
.prose blockquote p{margin:0; color:var(--ink)}
.prose img{max-width:100%; height:auto; border-radius:10px}

/* ---- Pie: compartir ---- */
.post-single__foot{max-width:720px; margin:clamp(2.6rem,5vw,3.6rem) auto 0; padding-top:1.7rem; border-top:1px solid var(--line)}
.post-share{display:flex; align-items:center; gap:1.1rem; flex-wrap:wrap}
.post-share__label{font-family:var(--mono); font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted)}
.post-share__links{display:flex; gap:.55rem; list-style:none; margin:0; padding:0}
.post-share__links a{width:42px; height:42px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--line-strong); color:var(--ink); text-decoration:none; transition:transform .25s cubic-bezier(.2,.7,.3,1), background .25s, color .25s, border-color .25s}
.post-share__links a:hover{background:var(--ink); color:#fff; border-color:var(--ink); transform:translateY(-3px)}
.post-share__links i{font-size:16px; line-height:1}

/* ---- Anterior / siguiente ---- */
.post-nav{margin-top:clamp(2.6rem,5vw,4rem)}
.post-nav__grid{display:grid; gap:1rem; grid-template-columns:1fr}
@media(min-width:720px){.post-nav__grid{grid-template-columns:1fr 1fr}}
.post-nav__item{display:flex; flex-direction:column; gap:.5rem; padding:clamp(1.1rem,2.4vw,1.5rem); background:var(--paper); border:1px solid var(--line); border-radius:var(--r); text-decoration:none; color:var(--ink); transition:transform .3s cubic-bezier(.2,.7,.3,1), border-color .3s, box-shadow .3s}
.post-nav__item:hover{transform:translateY(-3px); border-color:var(--cyan); box-shadow:0 20px 44px -30px rgba(0,65,91,.45)}
.post-nav__item--next{text-align:right; align-items:flex-end}
.post-nav__dir{font-family:var(--mono); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--cyan-deep); display:inline-flex; align-items:center; gap:.5em}
.post-nav__ttl{font-family:var(--disp); font-weight:700; font-size:1.02rem; line-height:1.2; letter-spacing:-.01em; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.post-nav__item .ar{transition:transform .25s}
.post-nav__item--prev:hover .ar{transform:translateX(-3px)}
.post-nav__item--next:hover .ar{transform:translateX(3px)}

.storz-related{background:var(--ground); border-top:1px solid var(--line)}

/* ============================================================
   Pendiente: SEO (Fase 4) y copy editable vía ACF.
   ============================================================ */