/*
Theme Name: EC Lawyers (Twenty Twenty-Five Child)
Theme URI: https://ec-lawyers.co
Description: Rediseño v5 — full-bleed real, sin page-title, tipografía editorial con peso medio, blog estilo periodístico.
Author: EC Lawyers
Template: twentytwentyfive
Version: 5.0.0
Text Domain: eclawyers-tt5
*/

/* ============================================================
   0 · TOKENS
   ============================================================ */
:root {
  --ec-navy:        #0B1F3F;
  --ec-navy-ink:    #061226;
  --ec-navy-soft:   #14315A;
  --ec-lime:        #9ACA3C;
  --ec-lime-bright: #B5E55C;
  --ec-lime-deep:   #6F9626;
  --ec-lime-glow:   rgba(154, 202, 60, 0.18);
  --ec-cream:       #FBFAF6;
  --ec-paper:       #F4F1EA;
  --ec-mist:        #F5F7FA;
  --ec-line:        #E1E6EE;
  --ec-line-dark:   #CDD4DF;
  --ec-ink:         #1F2A3D;
  --ec-ink-soft:    #4A5568;
  --ec-ink-faint:   #6B7689;

  --ec-shadow-1: 0 1px 2px rgba(11,31,63,.05), 0 4px 12px rgba(11,31,63,.04);
  --ec-shadow-2: 0 4px 16px rgba(11,31,63,.08), 0 20px 48px rgba(11,31,63,.08);
  --ec-shadow-3: 0 24px 60px rgba(11,31,63,.18);

  --ec-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --ec-pad-x:    clamp(1.25rem, 4vw, 4rem);
  --ec-maxw:     1320px;
  --ec-maxw-prose: 760px;

  --ec-r-sm: 6px;
  --ec-r-md: 12px;
  --ec-r-lg: 24px;

  --ec-ease: cubic-bezier(.22, 1, .36, 1);
}

/* ============================================================
   1 · RESET BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--ec-font);
  color: var(--ec-ink);
  background: var(--ec-cream);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "kern", "liga", "ss01", "cv11";
  overflow-x: hidden;
}

img, svg { max-width: 100%; display: block; }
a  { color: inherit; text-decoration: none; }
ul { list-style: none; padding: 0; margin: 0; }

h1, h2, h3, h4, h5, h6,
.wp-block-heading,
.wp-block-site-title,
button, input, select, textarea {
  font-family: var(--ec-font) !important;
}

/* ============================================================
   2 · FULL-BLEED REAL — eliminar paddings/margins WP por defecto
   ============================================================ */
.wp-site-blocks { padding: 0 !important; }
main.wp-block-group { margin: 0 !important; padding: 0 !important; }
main.wp-block-group.has-global-padding { padding: 0 !important; }
.entry-content,
.wp-block-post-content,
.wp-block-post-content.has-global-padding {
  padding: 0 !important;
  margin: 0 !important;
  max-width: none !important;
}
.is-layout-constrained > * { max-width: none; }
.wp-block-group.alignfull,
.wp-block-group.has-global-padding > .alignfull { margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; }

/* Ocultar page-title automático de WP (fallback si el template fallara) */
.wp-block-post-title,
.entry-title,
h1.wp-block-post-title { display: none !important; }

/* Cuando el post-title sí queremos mostrarlo (en single), va con clase explícita */
.ec-post-hero__title.wp-block-post-title,
.ec-post-hero .wp-block-post-title { display: block !important; }

/* ============================================================
   3 · TIPOGRAFÍA EDITORIAL (Punto: H1 más delgado, line-height mayor)
   ============================================================ */
h1, h2, h3, h4 {
  margin: 0 0 .65rem;
  color: var(--ec-ink);
  letter-spacing: -0.02em;
  line-height: 1.14;
  text-wrap: balance;
}

h1 {
  font-size: clamp(2.4rem, 5.5vw, 4.6rem);
  font-weight: 600;          /* antes 800 — ahora editorial */
  letter-spacing: -0.022em;  /* antes -0.04em — más suelto */
  line-height: 1.15;         /* antes 0.98 — más respirado */
}

h2 {
  font-size: clamp(1.75rem, 3.2vw, 2.85rem);
  font-weight: 600;          /* antes 700 */
  letter-spacing: -0.02em;
  line-height: 1.16;
}

h3 {
  font-size: clamp(1.08rem, 1.4vw, 1.3rem);
  font-weight: 600;
  letter-spacing: -0.012em;
  line-height: 1.35;
}

p {
  margin: 0 0 1rem;
  color: var(--ec-ink-soft);
  line-height: 1.65;
  font-size: 1rem;
}

.ec-lead {
  font-size: clamp(1.05rem, 1.2vw, 1.22rem);
  color: var(--ec-ink-soft);
  line-height: 1.6;
  max-width: 62ch;
  font-weight: 400;
}

.ec-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  font-size: .76rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ec-lime-deep);
  margin-bottom: 1.25rem;
}
.ec-eyebrow::before {
  content: "";
  width: 32px;
  height: 1.5px;
  background: var(--ec-lime);
}

.ec-accent {
  color: var(--ec-lime);
  font-weight: 600;
}

/* ============================================================
   4 · CONTEXTO OSCURO — inversión de color (FIX H1 invisible)
   ============================================================ */
.ec-hero,
.ec-section--navy,
.ec-cta-band,
.ec-post-hero { color: #FFFFFF; }

.ec-hero h1, .ec-hero h2, .ec-hero h3,
.ec-section--navy h1, .ec-section--navy h2, .ec-section--navy h3,
.ec-cta-band h1, .ec-cta-band h2, .ec-cta-band h3,
.ec-post-hero h1, .ec-post-hero h2 { color: #FFFFFF; }

.ec-hero p, .ec-hero .ec-lead,
.ec-section--navy p, .ec-section--navy .ec-lead,
.ec-cta-band p, .ec-cta-band .ec-lead { color: rgba(255, 255, 255, 0.78); }

.ec-section--navy .ec-eyebrow,
.ec-cta-band .ec-eyebrow,
.ec-hero .ec-eyebrow { color: var(--ec-lime); }

/* ============================================================
   5 · HEADER (sticky glass)
   ============================================================ */
.wp-site-blocks > header,
header.wp-block-template-part {
  position: sticky;
  top: 0;
  z-index: 999;
  background: rgba(251, 250, 246, 0.86);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid rgba(11, 31, 63, 0.06);
  margin: 0 !important;
}

.ec-header-logo img { height: 40px; width: auto; }

.wp-block-navigation .wp-block-navigation-item__content {
  position: relative;
  font-weight: 500;
  font-size: .95rem;
  color: var(--ec-ink);
  padding-bottom: 4px;
  transition: color .2s var(--ec-ease);
}
.wp-block-navigation .wp-block-navigation-item__content::after {
  content: "";
  position: absolute;
  bottom: -2px; left: 0;
  width: 0; height: 2px;
  background: var(--ec-lime);
  transition: width .25s var(--ec-ease);
}
.wp-block-navigation .wp-block-navigation-item__content:hover::after { width: 100%; }

/* ============================================================
   6 · BOTONES
   ============================================================ */
.wp-block-button.is-style-ec-primary .wp-block-button__link,
a.is-style-ec-primary,
button.is-style-ec-primary {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  background: var(--ec-lime);
  color: var(--ec-navy);
  border: 2px solid var(--ec-lime);
  padding: .95rem 1.75rem;
  border-radius: 999px;
  font-weight: 600;
  font-size: .95rem;
  letter-spacing: -0.005em;
  text-decoration: none;
  transition: all .25s var(--ec-ease);
  cursor: pointer;
  white-space: nowrap;
}
a.is-style-ec-primary::after { content: "→"; transition: transform .25s var(--ec-ease); }
a.is-style-ec-primary:hover { background: var(--ec-lime-bright); border-color: var(--ec-lime-bright); transform: translateY(-1px); }
a.is-style-ec-primary:hover::after { transform: translateX(3px); }

a.is-style-ec-secondary {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: transparent;
  color: currentColor;
  border: 2px solid currentColor;
  padding: .95rem 1.75rem;
  border-radius: 999px;
  font-weight: 500;
  font-size: .95rem;
  opacity: .85;
  transition: all .25s var(--ec-ease);
}
a.is-style-ec-secondary:hover { opacity: 1; background: rgba(255, 255, 255, .08); }

.ec-section:not(.ec-section--navy) a.is-style-ec-secondary {
  color: var(--ec-navy);
  border-color: var(--ec-navy);
  opacity: 1;
}
.ec-section:not(.ec-section--navy) a.is-style-ec-secondary:hover {
  background: var(--ec-navy);
  color: var(--ec-cream);
}

/* ============================================================
   7 · HERO — sin margen-top, tipografía editorial respirada
   ============================================================ */
.ec-hero {
  position: relative;
  margin: 0;
  background:
    radial-gradient(80% 60% at 88% 8%, rgba(154,202,60,0.16), transparent 55%),
    radial-gradient(60% 80% at -10% 100%, rgba(154,202,60,0.10), transparent 60%),
    linear-gradient(170deg, var(--ec-navy-ink) 0%, var(--ec-navy) 60%, var(--ec-navy-soft) 100%);
  color: #FFFFFF;
  padding: clamp(5rem, 11vw, 9rem) var(--ec-pad-x) clamp(5rem, 10vw, 8rem);
  overflow: hidden;
  isolation: isolate;
}
.ec-hero::before {
  content: "";
  position: absolute;
  inset: 0; z-index: -1;
  background:
    linear-gradient(to right, rgba(255,255,255,.04) 1px, transparent 1px) 0 0 / 80px 80px,
    linear-gradient(to bottom, rgba(255,255,255,.04) 1px, transparent 1px) 0 0 / 80px 80px;
  mask-image: radial-gradient(circle at 72% 40%, #000 0%, transparent 70%);
  -webkit-mask-image: radial-gradient(circle at 72% 40%, #000 0%, transparent 70%);
  pointer-events: none;
}

.ec-hero--compact {
  padding: clamp(4rem, 8vw, 6rem) var(--ec-pad-x) clamp(3rem, 5vw, 4rem);
}

.ec-hero__inner {
  max-width: var(--ec-maxw);
  margin-inline: auto;
}
.ec-hero__inner--blog { display: block; }

/* Cabecera full-width arriba: chip + H1 a todo el ancho */
.ec-hero__top {
  margin-bottom: clamp(2.5rem, 4vw, 3.5rem);
  max-width: 100%;
  width: 100%;
}

/* Grid debajo: copy izq + visual der — ambos a la misma altura */
.ec-hero__grid {
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  gap: clamp(2rem, 5vw, 5rem);
  align-items: stretch;
}
.ec-hero__copy {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 1.5rem;
}

.ec-hero__copy { padding-top: 0; }

.ec-hero__chip {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  padding: .45rem 1rem;
  border-radius: 999px;
  background: rgba(154, 202, 60, 0.14);
  color: #DDF1B0;
  font-size: .78rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  margin-bottom: 1.75rem;
  border: 1px solid rgba(154, 202, 60, 0.26);
}
.ec-hero__chip::before {
  content: "";
  width: 6px; height: 6px;
  background: var(--ec-lime); border-radius: 50%;
  box-shadow: 0 0 10px var(--ec-lime);
}

/* H1 hero — más delgado y respirado */
.ec-hero h1 {
  font-size: clamp(2.6rem, 6vw, 5.2rem);
  font-weight: 500;            /* clave: weight medio */
  letter-spacing: -0.02em;
  line-height: 1.12;           /* clave: respirado */
  margin-bottom: 1.75rem;
  max-width: 18ch;
  color: #FFFFFF;
}
.ec-hero h1 .ec-accent { font-weight: 600; color: var(--ec-lime); }

/* H1 en el hero top — ancho completo, grande, 2 líneas balanceadas */
.ec-hero__top h1 {
  max-width: none !important;
  width: 100%;
  font-size: clamp(2.6rem, 6.5vw, 5.4rem);
  line-height: 1.05;
  letter-spacing: -0.028em;
  font-weight: 500;
  text-wrap: balance;
  margin-bottom: 0;
}
.ec-hero__top h1 .ec-accent { font-weight: 600; }
.ec-h1-break { display: none; }

.ec-hero .ec-lead {
  color: rgba(255, 255, 255, 0.82);
  max-width: 58ch;
  margin: 0;
  font-size: clamp(1.15rem, 1.45vw, 1.4rem);
  line-height: 1.55;
}

.ec-hero__actions { display: flex; flex-wrap: wrap; gap: .9rem; margin-top: 2.25rem; }

.ec-hero__stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.75rem;
  margin-top: 3rem;
  max-width: 100%;
}
.ec-hero__stat {
  border-top: 1.5px solid rgba(154, 202, 60, 0.55);
  padding-top: 1rem;
}
.ec-hero__stat strong {
  display: block;
  font-size: clamp(1.05rem, 1.35vw, 1.25rem);
  font-weight: 700;
  color: #FFFFFF;
  line-height: 1.2;
  letter-spacing: -0.012em;
  margin-bottom: .4rem;
}
.ec-hero__stat span { color: rgba(255, 255, 255, 0.6); font-size: .84rem; line-height: 1.5; display: block; }
@media (max-width: 720px) {
  .ec-hero__stats { grid-template-columns: 1fr; gap: 1rem; }
}

/* Visual derecha del hero — toma altura del copy izquierdo; balanza centrada con contain */
.ec-hero__visual {
  position: relative;
  height: 100%;
  min-height: 380px;
  border-radius: var(--ec-r-lg);
  background:
    url("/wp-content/themes/eclawyers-tt5/assets/img/hero-visual-corporate-tech.svg") center/contain no-repeat,
    radial-gradient(120% 120% at 50% 40%, rgba(154, 202, 60, 0.18), transparent 55%),
    linear-gradient(160deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  border: 1px solid rgba(255,255,255,0.10);
  overflow: hidden;
}
.ec-hero__visual svg,
.ec-hero__visual::before,
.ec-hero__visual::after { display: none; }

@media (max-width: 960px) {
  .ec-hero__grid { grid-template-columns: 1fr; gap: 3rem; align-items: start; }
  .ec-hero__visual {
    max-width: 420px;
    margin: 0 auto;
    height: auto;
    min-height: 0;
    aspect-ratio: 5/4;
  }
  .ec-hero h1 { max-width: none; }
}

/* ============================================================
   8 · SECCIONES — full bleed
   ============================================================ */
.ec-section {
  padding: clamp(4.5rem, 7vw, 6.5rem) var(--ec-pad-x);
  background: var(--ec-cream);
  margin: 0;
}
.ec-section--mist  { background: var(--ec-mist); }
.ec-section--paper { background: var(--ec-paper); }
.ec-section--navy {
  background:
    radial-gradient(60% 80% at 50% 0%, rgba(154,202,60,0.10), transparent 60%),
    var(--ec-navy);
  color: #FFFFFF;
}
.ec-section--navy .ec-eyebrow,
.ec-section--navy .ec-eyebrow { color: var(--ec-lime); }

.ec-section__inner { max-width: var(--ec-maxw); margin-inline: auto; }
.ec-section__head { max-width: 60ch; margin: 0 0 clamp(2.5rem, 4vw, 4rem); }
.ec-section__head h2 + .ec-lead { margin-top: 1rem; }

/* ============================================================
   9 · CATÁLOGO DE SERVICIOS — cards editoriales
   ============================================================ */
.ec-grid { display: grid; gap: clamp(1rem, 1.5vw, 1.5rem); }
.ec-grid--2 { grid-template-columns: repeat(2, 1fr); }
.ec-grid--3 { grid-template-columns: repeat(3, 1fr); }
.ec-grid--4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1024px) { .ec-grid--4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 820px)  { .ec-grid--3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px)  { .ec-grid--4, .ec-grid--3, .ec-grid--2 { grid-template-columns: 1fr; } }

.ec-service-card {
  position: relative;
  background: #FFFFFF;
  border: 1px solid var(--ec-line);
  border-radius: var(--ec-r-md);
  padding: clamp(1.75rem, 2.4vw, 2.25rem);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  transition: all .35s var(--ec-ease);
  overflow: hidden;
}
.ec-service-card::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 0; height: 3px;
  background: var(--ec-lime);
  transition: width .4s var(--ec-ease);
}
.ec-service-card:hover {
  border-color: var(--ec-lime);
  box-shadow: var(--ec-shadow-2);
  transform: translateY(-3px);
}
.ec-service-card:hover::after { width: 100%; }

.ec-service-card__icon {
  width: 52px; height: 52px;
  border-radius: var(--ec-r-sm);
  background: var(--ec-mist);
  display: grid; place-items: center;
  color: var(--ec-navy);
}
.ec-service-card:hover .ec-service-card__icon { background: var(--ec-lime-glow); }
.ec-service-card__icon svg,
.ec-service-card__icon img { width: 28px; height: 28px; }

.ec-service-card h3 { margin: 0; color: var(--ec-navy); font-weight: 600; }
.ec-service-card p  { margin: 0; flex: 1; font-size: .96rem; line-height: 1.6; }

.ec-service-card__cta {
  display: inline-flex; align-items: center; gap: .35rem;
  color: var(--ec-navy);
  font-weight: 500;
  font-size: .92rem;
  transition: gap .25s var(--ec-ease), color .25s var(--ec-ease);
}
.ec-service-card__cta::after { content: "→"; }
.ec-service-card:hover .ec-service-card__cta { color: var(--ec-lime-deep); gap: .65rem; }

.ec-service-card--temis {
  background: linear-gradient(180deg, var(--ec-navy) 0%, var(--ec-navy-ink) 100%);
  border-color: var(--ec-navy);
  color: #FFFFFF;
}
.ec-service-card--temis::before {
  content: "IA";
  position: absolute;
  top: 1.5rem; right: 1.5rem;
  background: var(--ec-lime);
  color: var(--ec-navy);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  padding: .25rem .55rem;
  border-radius: 999px;
}
.ec-service-card--temis h3 { color: #FFFFFF; }
.ec-service-card--temis p  { color: rgba(255, 255, 255, 0.72); }
.ec-service-card--temis .ec-service-card__icon { background: rgba(154, 202, 60, 0.16); color: var(--ec-lime); }
.ec-service-card--temis .ec-service-card__cta { color: var(--ec-lime); }

/* ============================================================
   10 · PILARES (sección "Por qué")
   ============================================================ */
.ec-pillar { padding-top: 1rem; }
.ec-pillar__num {
  display: block;
  font-size: clamp(3rem, 5vw, 4.2rem);
  font-weight: 200;
  line-height: 1;
  color: var(--ec-lime);
  letter-spacing: -0.04em;
  margin-bottom: 1.25rem;
  opacity: .85;
}
.ec-pillar h3 {
  font-size: 1.35rem;
  font-weight: 600;
  color: var(--ec-navy);
  margin: 0 0 .6rem;
  letter-spacing: -0.018em;
}
.ec-pillar p { color: var(--ec-ink-soft); font-size: .96rem; line-height: 1.6; margin: 0; }
.ec-section--navy .ec-pillar h3 { color: #FFFFFF; }
.ec-section--navy .ec-pillar p  { color: rgba(255, 255, 255, 0.7); }

/* ============================================================
   11 · EQUIPO
   ============================================================ */
.ec-team-card { display: flex; flex-direction: column; gap: 1rem; }
.ec-team-card__photo {
  display: block;
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  object-position: center top;
  background-color: var(--ec-mist);
  background-size: cover;
  background-position: center top;
  border-radius: var(--ec-r-md);
  position: relative;
  overflow: hidden;
  transition: transform .4s var(--ec-ease);
  filter: saturate(.92) contrast(1.02);
}
@supports not (aspect-ratio: 4/5) {
  .ec-team-card__photo { height: 0; padding-bottom: 125%; }
}
.ec-team-card:hover .ec-team-card__photo { transform: translateY(-4px); filter: saturate(1) contrast(1.05); }
.ec-team-card__role {
  display: inline-block;
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ec-lime-deep);
  margin-bottom: .4rem;
}
.ec-team-card h3 { font-size: 1.12rem; font-weight: 600; margin: 0 0 .4rem; letter-spacing: -0.012em; color: var(--ec-navy); }
.ec-team-card p { font-size: .9rem; color: var(--ec-ink-soft); line-height: 1.55; margin: 0; }

/* ============================================================
   12 · CTA BAND
   ============================================================ */
.ec-cta-band {
  position: relative;
  background:
    radial-gradient(60% 100% at 80% 0%, rgba(154,202,60,0.20), transparent 55%),
    radial-gradient(50% 80% at 10% 100%, rgba(154,202,60,0.08), transparent 60%),
    linear-gradient(160deg, var(--ec-navy-ink) 0%, var(--ec-navy) 100%);
  color: #FFFFFF;
  padding: clamp(4.5rem, 7vw, 6rem) var(--ec-pad-x);
  overflow: hidden;
  isolation: isolate;
}
.ec-cta-band::before {
  content: "";
  position: absolute;
  inset: 0; z-index: -1;
  background:
    linear-gradient(to right, rgba(255,255,255,.04) 1px, transparent 1px) 0 0 / 80px 80px,
    linear-gradient(to bottom, rgba(255,255,255,.04) 1px, transparent 1px) 0 0 / 80px 80px;
  mask-image: radial-gradient(circle at 60% 50%, #000 0%, transparent 70%);
  -webkit-mask-image: radial-gradient(circle at 60% 50%, #000 0%, transparent 70%);
}
.ec-cta-band__inner {
  max-width: var(--ec-maxw);
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 3rem;
  align-items: center;
}
.ec-cta-band h2 { font-size: clamp(1.85rem, 3.2vw, 2.6rem); margin: 0; line-height: 1.1; font-weight: 600; }
.ec-cta-band .ec-lead { color: rgba(255, 255, 255, 0.78); margin-top: 1rem; }
.ec-cta-band__actions {
  display: flex; flex-direction: column; gap: 1rem;
  justify-self: end;
}
@media (max-width: 820px) {
  .ec-cta-band__inner { grid-template-columns: 1fr; }
  .ec-cta-band__actions { justify-self: start; flex-direction: row; flex-wrap: wrap; }
}

/* ============================================================
   13 · FORMULARIO
   ============================================================ */
#solicitar .ec-grid--2 { gap: clamp(1.5rem, 3vw, 2.5rem); }

#solicitar input,
#solicitar select,
#solicitar textarea {
  width: 100%;
  padding: .95rem 1.1rem;
  border: 1px solid var(--ec-line);
  border-radius: var(--ec-r-sm);
  background: #FFFFFF;
  color: var(--ec-ink);
  font-family: var(--ec-font);
  font-size: .98rem;
  transition: all .2s var(--ec-ease);
}
#solicitar input::placeholder,
#solicitar textarea::placeholder { color: var(--ec-ink-faint); }
#solicitar input:focus,
#solicitar select:focus,
#solicitar textarea:focus {
  outline: none;
  border-color: var(--ec-navy);
  box-shadow: 0 0 0 4px rgba(11, 31, 63, 0.08);
}
#solicitar select { appearance: none; -webkit-appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M3 4.5L6 7.5L9 4.5' stroke='%230B1F3F' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.5rem;
}
#solicitar textarea { min-height: 110px; resize: vertical; }
#solicitar button {
  margin-top: .5rem;
  width: 100%;
  background: var(--ec-navy);
  color: #FFFFFF;
  border: 2px solid var(--ec-navy);
  padding: 1rem 1.5rem;
  border-radius: 999px;
  font-weight: 600;
  cursor: pointer;
  transition: all .25s var(--ec-ease);
}
#solicitar button:hover {
  background: var(--ec-lime);
  border-color: var(--ec-lime);
  color: var(--ec-navy);
  transform: translateY(-1px);
}

.ec-callout {
  background: #FFFFFF;
  border: 1px solid var(--ec-line);
  border-left: 3px solid var(--ec-lime);
  padding: 1.5rem 1.75rem;
  border-radius: 0 var(--ec-r-md) var(--ec-r-md) 0;
}
.ec-callout p { margin: 0; color: var(--ec-ink); font-size: .96rem; }
.ec-callout p + p { margin-top: .85rem; color: var(--ec-ink-soft); font-size: .9rem; }
.ec-callout strong { color: var(--ec-navy); font-weight: 600; }

/* ============================================================
   14 · CHECKS / DETAILS / STEP / PRICE
   ============================================================ */
.ec-checks li {
  position: relative;
  padding: .55rem 0 .55rem 2rem;
  color: var(--ec-ink-soft);
  line-height: 1.6;
}
.ec-checks li::before {
  content: "";
  position: absolute;
  left: 0; top: .8rem;
  width: 18px; height: 18px;
  background: var(--ec-lime);
  border-radius: 50%;
}
.ec-checks li::after {
  content: "";
  position: absolute;
  left: 3px; top: .95rem;
  width: 12px; height: 12px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M4 7.5L2.2 5.7 1.3 6.6 4 9.3 10.7 2.6 9.8 1.7z' fill='%230B1F3F'/%3E%3C/svg%3E") no-repeat center;
}
.ec-checks li strong { color: var(--ec-navy); font-weight: 600; }

.wp-block-details {
  background: #FFFFFF;
  border: 1px solid var(--ec-line);
  border-radius: var(--ec-r-md);
  padding: 1.25rem 1.6rem;
  margin-bottom: .85rem;
  transition: all .25s var(--ec-ease);
}
.wp-block-details:hover { border-color: var(--ec-lime); }
.wp-block-details[open] { border-color: var(--ec-lime); box-shadow: var(--ec-shadow-1); }
.wp-block-details summary {
  color: var(--ec-navy); font-weight: 600;
  cursor: pointer; list-style: none;
  position: relative; padding-right: 2rem;
}
.wp-block-details summary::after {
  content: "+";
  position: absolute; right: 0; top: 50%;
  transform: translateY(-50%);
  width: 26px; height: 26px;
  border-radius: 50%;
  background: var(--ec-mist); color: var(--ec-navy);
  display: grid; place-items: center;
  font-weight: 600;
  transition: all .25s var(--ec-ease);
}
.wp-block-details[open] summary::after { content: "−"; background: var(--ec-lime); }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details p { margin: 1rem 0 0; color: var(--ec-ink-soft); }

.ec-step {
  background: #FFFFFF;
  border: 1px solid var(--ec-line);
  border-radius: var(--ec-r-md);
  padding: 1.75rem;
  height: 100%;
  transition: all .3s var(--ec-ease);
}
.ec-step:hover { border-color: var(--ec-lime); transform: translateY(-3px); box-shadow: var(--ec-shadow-1); }
.ec-step__num {
  display: inline-block; font-size: 2rem; font-weight: 200;
  color: var(--ec-lime); letter-spacing: -0.04em;
  margin-bottom: .75rem; line-height: 1;
}
.ec-step__title { font-size: 1.08rem; font-weight: 600; color: var(--ec-navy); margin: 0 0 .5rem; }
.ec-step__text { font-size: .92rem; color: var(--ec-ink-soft); margin: 0; line-height: 1.55; }

.ec-price-card {
  background: #FFFFFF;
  border: 1px solid var(--ec-line);
  border-radius: var(--ec-r-md);
  padding: 2rem;
  height: 100%;
  position: relative;
  transition: all .3s var(--ec-ease);
}
.ec-price-card:hover { transform: translateY(-3px); box-shadow: var(--ec-shadow-1); }
.ec-price-card--featured {
  background: linear-gradient(180deg, var(--ec-navy) 0%, var(--ec-navy-ink) 100%);
  color: #FFFFFF;
  border-color: var(--ec-navy);
  transform: scale(1.02);
  box-shadow: var(--ec-shadow-3);
}
.ec-price-card--featured::before {
  content: "Más elegido";
  position: absolute;
  top: -12px; left: 50%;
  transform: translateX(-50%);
  background: var(--ec-lime); color: var(--ec-navy);
  font-size: .7rem; font-weight: 700;
  padding: .25rem .8rem; border-radius: 999px;
  letter-spacing: 0.08em; text-transform: uppercase;
  white-space: nowrap;
}
.ec-price-card__name { font-size: .82rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.12em; color: var(--ec-ink-soft); margin: 0 0 .8rem; }
.ec-price-card--featured .ec-price-card__name { color: var(--ec-lime); }
.ec-price-card__amount { font-size: 2.3rem; font-weight: 700; color: var(--ec-navy); letter-spacing: -0.025em; line-height: 1; margin: 0 0 .4rem; }
.ec-price-card--featured .ec-price-card__amount { color: #FFFFFF; }
.ec-price-card__period { font-size: .85rem; color: var(--ec-ink-soft); margin: 0 0 1.25rem; line-height: 1.5; }
.ec-price-card--featured .ec-price-card__period { color: rgba(255, 255, 255, 0.7); }

/* ============================================================
   15 · BLOG · estilo editorial Ámbito Jurídico / altas cortes
   ============================================================ */

/* Post hero (single.html) — navy con jerarquía periodística */
.ec-post-hero {
  position: relative;
  margin: 0 !important;
  background:
    radial-gradient(80% 60% at 88% 8%, rgba(154,202,60,0.14), transparent 55%),
    linear-gradient(170deg, var(--ec-navy-ink) 0%, var(--ec-navy) 100%);
  color: #FFFFFF;
  padding: clamp(5rem, 9vw, 7.5rem) var(--ec-pad-x) clamp(3rem, 4vw, 4rem);
  isolation: isolate;
}
.ec-post-hero::before {
  content: "";
  position: absolute;
  inset: 0; z-index: -1;
  background:
    linear-gradient(to right, rgba(255,255,255,.04) 1px, transparent 1px) 0 0 / 80px 80px,
    linear-gradient(to bottom, rgba(255,255,255,.04) 1px, transparent 1px) 0 0 / 80px 80px;
  mask-image: radial-gradient(circle at 75% 30%, #000 0%, transparent 70%);
  -webkit-mask-image: radial-gradient(circle at 75% 30%, #000 0%, transparent 70%);
}
.ec-post-hero__inner {
  max-width: var(--ec-maxw-prose);
  margin-inline: auto;
}
.ec-post-hero__cat,
.ec-post-hero__cat a {
  display: inline-block;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ec-lime);
  margin-bottom: 1.5rem;
  text-decoration: none;
}
.ec-post-hero__title.wp-block-post-title {
  display: block !important;
  font-size: clamp(2.2rem, 4.8vw, 3.8rem);
  font-weight: 600;
  color: #FFFFFF;
  letter-spacing: -0.018em;
  line-height: 1.15;
  margin: 0 0 2rem;
  text-wrap: balance;
}
.ec-post-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  font-size: .85rem;
}
.ec-post-hero__author,
.ec-post-hero__date {
  color: rgba(255, 255, 255, 0.72);
  font-weight: 500;
}
.ec-post-hero__author::before {
  content: "Por ";
  color: rgba(255, 255, 255, 0.45);
  font-weight: 400;
}
.ec-post-hero__date {
  color: rgba(255, 255, 255, 0.5);
}

/* Cuerpo del post (single) */
.ec-post-body {
  background: var(--ec-cream);
  padding: clamp(3rem, 5vw, 5rem) var(--ec-pad-x);
  margin: 0 !important;
}
.ec-post-body__inner {
  max-width: var(--ec-maxw-prose);
  margin-inline: auto;
}
.ec-post-body__inner .wp-block-post-content > * {
  margin-bottom: 1.25rem;
}
.ec-post-body__inner p {
  font-size: 1.08rem;
  line-height: 1.75;
  color: var(--ec-ink);
}
.ec-post-body__inner h2 {
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  font-weight: 600;
  color: var(--ec-navy);
  margin: 2.5rem 0 1rem;
  letter-spacing: -0.015em;
}
.ec-post-body__inner h3 {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--ec-navy);
  margin: 2rem 0 .75rem;
}
.ec-post-body__inner blockquote {
  border-left: 3px solid var(--ec-lime);
  padding: .5rem 0 .5rem 1.5rem;
  margin: 2rem 0;
  font-style: normal;
  color: var(--ec-ink);
  font-size: 1.15rem;
  line-height: 1.6;
}
.ec-post-body__inner figure {
  margin: 2rem 0;
}
.ec-post-body__inner img {
  border-radius: var(--ec-r-md);
}
.ec-post-body__inner a {
  color: var(--ec-navy);
  border-bottom: 1px solid var(--ec-lime);
  transition: color .2s;
}
.ec-post-body__inner a:hover { color: var(--ec-lime-deep); }
.ec-post-body__inner sup { font-size: .7em; color: var(--ec-lime-deep); }

/* Toolbar del blog index */
.ec-blog-archive { padding-top: clamp(2rem, 3vw, 3rem); padding-bottom: 1rem; }
.ec-blog-toolbar { display: flex; align-items: center; justify-content: space-between; }
.ec-blog-toolbar .ec-eyebrow { margin: 0; }

/* Query loop — grid de cards editoriales */
.ec-blog-query.wp-block-query {
  padding: 0 var(--ec-pad-x) clamp(3rem, 5vw, 5rem);
  background: var(--ec-paper);
}
.ec-blog-query .wp-block-post-template {
  max-width: var(--ec-maxw);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1.25rem, 2.2vw, 2rem);
  list-style: none;
  padding: 0;
}
@media (max-width: 1024px) { .ec-blog-query .wp-block-post-template { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .ec-blog-query .wp-block-post-template { grid-template-columns: 1fr; } }

/* Post card */
.ec-post-card {
  background: #FFFFFF;
  border: 1px solid var(--ec-line);
  border-radius: var(--ec-r-md);
  padding: 1.75rem;
  transition: all .3s var(--ec-ease);
  display: flex;
  flex-direction: column;
  gap: .75rem;
  height: 100%;
}
.ec-post-card:hover {
  border-color: var(--ec-lime);
  box-shadow: var(--ec-shadow-1);
  transform: translateY(-3px);
}

/* Categoría como eyebrow lima */
.ec-post-card__cat,
.ec-post-card__cat a {
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ec-lime-deep);
  text-decoration: none;
  margin-bottom: .25rem;
}

/* Título tipo headline editorial */
.ec-post-card__title.wp-block-post-title {
  display: block !important;
  font-size: clamp(1.15rem, 1.4vw, 1.4rem);
  font-weight: 600;
  letter-spacing: -0.015em;
  line-height: 1.25;
  margin: 0 0 .5rem;
  color: var(--ec-navy);
}
.ec-post-card__title a {
  color: inherit;
  transition: color .2s;
}
.ec-post-card__title a:hover { color: var(--ec-lime-deep); }

.ec-post-card__excerpt {
  font-size: .92rem;
  color: var(--ec-ink-soft);
  line-height: 1.55;
  margin: 0;
  flex: 1;
}
.ec-post-card__excerpt p { margin: 0; }

/* Meta inferior (fecha + autor) */
.ec-post-card__meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding-top: .85rem;
  border-top: 1px solid var(--ec-line);
  margin-top: .25rem;
}
.ec-post-card__date {
  font-size: .78rem;
  color: var(--ec-ink-faint);
}
.ec-post-card__author {
  font-size: .78rem;
  color: var(--ec-ink-soft);
  font-weight: 500;
}
.ec-post-card__author::before { content: "Por "; color: var(--ec-ink-faint); font-weight: 400; }

/* Paginación del blog */
.ec-blog-pagination.wp-block-query-pagination {
  max-width: var(--ec-maxw);
  margin: 3rem auto 0 !important;
  padding: 0 var(--ec-pad-x);
  display: flex;
  justify-content: center;
  gap: .5rem;
}
.ec-blog-pagination a,
.ec-blog-pagination .wp-block-query-pagination-numbers,
.ec-blog-pagination .wp-block-query-pagination-previous,
.ec-blog-pagination .wp-block-query-pagination-next {
  color: var(--ec-navy);
  font-weight: 500;
  font-size: .9rem;
}
.ec-blog-pagination a:hover { color: var(--ec-lime-deep); }

/* ============================================================
   16 · FOOTER
   ============================================================ */
footer.wp-block-template-part,
.ec-footer {
  background: var(--ec-navy-ink) !important;
  color: rgba(255, 255, 255, 0.72);
  padding: clamp(4rem, 6vw, 6rem) var(--ec-pad-x) 2rem;
  margin: 0 !important;
}
footer.wp-block-template-part * { color: inherit; }

.ec-footer__inner {
  max-width: var(--ec-maxw);
  margin-inline: auto;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: clamp(2rem, 4vw, 4rem);
  padding-bottom: 3rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
@media (max-width: 1024px) { .ec-footer__inner { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px)  { .ec-footer__inner { grid-template-columns: 1fr; } }

.ec-footer__about { font-size: .94rem; line-height: 1.65; margin-bottom: 1rem; max-width: 52ch; color: rgba(255,255,255,.7); }
.ec-footer__social { display: flex; gap: 1.25rem; margin: 1.25rem 0 0; }
.ec-footer__social a { color: var(--ec-lime); font-weight: 600; font-size: .88rem; }

.ec-footer__col h4 {
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ec-lime);
  margin: 0 0 1.25rem;
}
.ec-footer__col ul { display: grid; gap: .65rem; }
.ec-footer__col a { color: rgba(255, 255, 255, 0.82); font-size: .93rem; transition: color .2s; }
.ec-footer__col a:hover { color: var(--ec-lime); }

.ec-footer__bar {
  max-width: var(--ec-maxw);
  margin: 0 auto;
  padding-top: 1.5rem;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .75rem;
  font-size: .8rem;
  color: rgba(255, 255, 255, 0.5);
}
.ec-footer__compliance { font-size: .76rem; }

footer.wp-block-template-part .wp-block-heading {
  color: var(--ec-lime) !important;
  font-size: .72rem !important;
  letter-spacing: 0.16em !important;
  font-weight: 600 !important;
}
footer.wp-block-template-part .wp-block-list a { color: rgba(255,255,255,.82); transition: color .2s; }
footer.wp-block-template-part .wp-block-list a:hover { color: var(--ec-lime); }

/* ============================================================
   17 · PREVIEW HEADER (oculto en WP)
   ============================================================ */
.preview-header, .preview-note { display: none; }

/* ============================================================
   18 · Override final del global del theme.json
   ============================================================ */
:where(h1) { color: inherit; }
:where(.wp-block-post-content) { padding: 0; max-width: none; }
