/*
Theme Name:  Segundo Verbo
Theme URI:   https://segundoverbo.com
Description: Child theme de Twenty Twenty-Four para Segundo Verbo. Verificación de leads y cualificación comercial.
Author:      Clica Online Soluciones S.L.
Author URI:  https://clicaonline.com
Template:    twentytwentyfour
Version:     1.0.0
Requires at least: 6.4
Tested up to:      6.7
Requires PHP:      8.0
Text Domain: segundoverbo
License:     GPL-2.0-or-later
*/

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   DESIGN TOKENS
   Colores corporativos Segundo Verbo
   Pantone 432C → #343E48 (gris azulado oscuro)
   Pantone 179C → #E33F37 (rojo vibrante)
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
:root {
  --sv-ink:    #343E48;
  --sv-red:    #E33F37;
  --sv-red-d:  #c03330;
  --sv-paper:  #F9F8F5;
  --sv-warm:   #EDE8DF;
  --sv-rule:   #D5CEBD;
  --sv-body:   #2C2A26;
  --sv-muted:  #6E6860;
  --sv-white:  #ffffff;

  /* Service card accents */
  --sv-agenda: #343E48;
  --sv-filtro: #1A3D28;
  --sv-cita:   #2A3848;

  --sv-w:      1100px;
  --sv-font:   'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   RESET & BASE
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--sv-paper);
  color: var(--sv-body);
  font-family: var(--sv-font);
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeSpeed;
}

/* Sobreescribir reset del padre TT4 */
.wp-site-blocks { padding: 0 !important; }
.wp-block-group.alignfull { max-width: none; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   LAYOUT HELPERS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sv-wrap {
  max-width: var(--sv-w);
  margin: 0 auto;
  padding: 0 32px;
}
.sv-section { padding: 96px 0; }
.sv-section--dark  { background: var(--sv-ink); }
.sv-section--warm  { background: var(--sv-warm); }
.sv-section--paper { background: var(--sv-paper); }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   TYPOGRAPHY
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sv-label {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--sv-red);
  margin-bottom: 16px;
}
.sv-label--light { color: rgba(255,255,255,.55); }

.sv-h1 {
  font-family: var(--sv-font);
  font-size: clamp(36px, 5.5vw, 64px);
  font-weight: 800;
  line-height: 1.08;
  color: var(--sv-ink);
  letter-spacing: -1.5px;
}
.sv-h1 em {
  font-style: italic;
  color: var(--sv-red);
  font-weight: 400;
}
.sv-h2 {
  font-family: var(--sv-font);
  font-size: clamp(26px, 3vw, 40px);
  font-weight: 800;
  color: var(--sv-ink);
  letter-spacing: -1px;
  line-height: 1.12;
  margin-bottom: 16px;
}
.sv-h2--light { color: #fff; }
.sv-h3 {
  font-family: var(--sv-font);
  font-size: 18px;
  font-weight: 700;
  color: var(--sv-ink);
  margin-bottom: 10px;
  line-height: 1.2;
}
.sv-sub {
  font-size: 17px;
  color: var(--sv-muted);
  line-height: 1.65;
  max-width: 540px;
}
.sv-sub strong { color: var(--sv-body); }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   BUTTONS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sv-btn-primary {
  display: inline-block;
  background: var(--sv-red);
  color: #fff;
  padding: 14px 32px;
  border-radius: 3px;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  transition: background .2s, transform .15s;
  letter-spacing: .2px;
}
.sv-btn-primary:hover {
  background: var(--sv-red-d);
  transform: translateY(-1px);
  color: #fff;
}
.sv-btn-dark {
  display: inline-block;
  background: var(--sv-ink);
  color: #fff;
  padding: 16px 40px;
  border-radius: 3px;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  transition: background .2s, transform .15s;
  white-space: nowrap;
}
.sv-btn-dark:hover {
  background: #232d37;
  transform: translateY(-2px);
  color: #fff;
}
.sv-btn-ghost {
  display: inline-block;
  color: var(--sv-muted);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  border-bottom: 1px solid var(--sv-rule);
  padding-bottom: 2px;
  transition: color .2s, border-color .2s;
}
.sv-btn-ghost:hover {
  color: var(--sv-ink);
  border-color: var(--sv-ink);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   NAV
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sv-nav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(249,248,245,.95);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--sv-rule);
  padding: 14px 0;
}
.sv-nav-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: var(--sv-w);
  margin: 0 auto;
  padding: 0 32px;
}
.sv-nav-logo {
  font-size: 21px;
  font-weight: 800;
  color: var(--sv-ink);
  text-decoration: none;
  letter-spacing: -.5px;
}
.sv-nav-logo span { color: var(--sv-red); }
.sv-nav-links {
  display: flex;
  gap: 28px;
  align-items: center;
  list-style: none;
}
.sv-nav-links a {
  font-size: 14px;
  font-weight: 500;
  color: var(--sv-muted);
  text-decoration: none;
  transition: color .2s;
}
.sv-nav-links a:hover { color: var(--sv-ink); }
.sv-nav-cta {
  background: var(--sv-red) !important;
  color: #fff !important;
  padding: 8px 20px;
  border-radius: 3px;
  font-weight: 700 !important;
  transition: background .2s !important;
}
.sv-nav-cta:hover { background: var(--sv-red-d) !important; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   HERO
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sv-hero {
  padding: 96px 0 80px;
  position: relative;
  overflow: hidden;
}
.sv-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 50% at 75% 40%, rgba(227,63,55,.06) 0%, transparent 70%),
    radial-gradient(ellipse 40% 60% at 10% 80%, rgba(52,62,72,.04) 0%, transparent 70%);
  pointer-events: none;
}
.sv-hero-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}
.sv-hero-content {}
.sv-hero-actions {
  display: flex;
  gap: 16px;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 36px;
}
.sv-hero-img {
  position: relative;
  border-radius: 4px;
  overflow: hidden;
}
.sv-hero-img img {
  width: 100%;
  height: 480px;
  object-fit: cover;
  display: block;
  border-radius: 4px;
}
.sv-hero-img-caption {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: linear-gradient(transparent, rgba(52,62,72,.85));
  padding: 32px 24px 20px;
}
.sv-hero-img-caption p {
  font-size: 13px;
  color: rgba(255,255,255,.8);
  font-style: italic;
}
.sv-hero-proof {
  margin-top: 56px;
  padding-top: 32px;
  border-top: 1px solid var(--sv-rule);
  display: flex;
  gap: 40px;
  flex-wrap: wrap;
}
.sv-proof-n {
  font-size: 34px;
  font-weight: 800;
  color: var(--sv-ink);
  letter-spacing: -1px;
  line-height: 1;
}
.sv-proof-n span { color: var(--sv-red); }
.sv-proof-l {
  font-size: 13px;
  color: var(--sv-muted);
  margin-top: 4px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   NARRATIVE (sección oscura)
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sv-narrative {
  background: var(--sv-ink);
  padding: 96px 0;
  position: relative;
  overflow: hidden;
}
.sv-narrative::before {
  content: '';
  position: absolute;
  top: -60px; right: -80px;
  width: 480px; height: 480px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(227,63,55,.08) 0%, transparent 70%);
  pointer-events: none;
}
.sv-narrative-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 72px;
  align-items: start;
}
.sv-narrative-left p {
  font-size: 16px;
  color: rgba(255,255,255,.72);
  line-height: 1.75;
  margin-bottom: 16px;
}
.sv-narrative-left p strong { color: rgba(255,255,255,.92); }
.sv-narrative-img {
  position: relative;
  border-radius: 4px;
  overflow: hidden;
}
.sv-narrative-img img {
  width: 100%;
  height: 100%;
  min-height: 420px;
  object-fit: cover;
  display: block;
  opacity: .75;
  filter: grayscale(20%);
}
.sv-narrative-img-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(52,62,72,.5) 0%, transparent 60%);
}
.sv-quote-card {
  padding: 22px 26px;
  border-left: 3px solid var(--sv-red);
  background: rgba(255,255,255,.05);
  margin-bottom: 10px;
  border-radius: 0 4px 4px 0;
}
.sv-quote-card p {
  font-size: 15px;
  font-style: italic;
  color: rgba(255,255,255,.78);
  line-height: 1.6;
  margin: 0;
}
.sv-quote-card p::before {
  content: '\201C';
  color: var(--sv-red);
  font-size: 22px;
  line-height: 0;
  vertical-align: -7px;
  margin-right: 4px;
}
.sv-quote-role {
  display: block;
  margin-top: 10px;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  color: rgba(255,255,255,.38);
  letter-spacing: 1px;
  text-transform: uppercase;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   PAIN POINTS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sv-pain { padding: 96px 0; background: var(--sv-warm); }
.sv-section-header { text-align: center; margin-bottom: 56px; }
.sv-section-header p { font-size: 16px; color: var(--sv-muted); max-width: 520px; margin: 12px auto 0; }
.sv-pain-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3px;
}
.sv-pain-item {
  background: #fff;
  padding: 30px 26px;
  border-top: 3px solid transparent;
  transition: border-color .25s;
}
.sv-pain-item:hover { border-color: var(--sv-red); }
.sv-pain-item h3 {
  font-size: 17px;
  font-weight: 700;
  color: var(--sv-ink);
  margin-bottom: 10px;
  line-height: 1.2;
}
.sv-pain-item p { font-size: 14px; color: var(--sv-muted); line-height: 1.7; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SERVICES
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sv-services { padding: 96px 0; background: var(--sv-paper); }
.sv-services-header { margin-bottom: 56px; }
.sv-services-header p { font-size: 16px; color: var(--sv-muted); max-width: 520px; margin-top: 8px; }

.sv-service-card {
  display: grid;
  grid-template-columns: 280px 1fr;
  margin-bottom: 3px;
  border: 1px solid var(--sv-rule);
  overflow: hidden;
  transition: box-shadow .25s;
}
.sv-service-card:hover { box-shadow: 0 8px 40px rgba(0,0,0,.08); }

.sv-service-accent {
  padding: 36px 32px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.sv-service-card--agenda .sv-service-accent { background: var(--sv-agenda); }
.sv-service-card--filtro .sv-service-accent { background: var(--sv-filtro); }
.sv-service-card--cita   .sv-service-accent { background: var(--sv-cita); }

.sv-svc-num {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,.45);
  margin-bottom: 8px;
  display: block;
}
.sv-svc-name {
  font-size: 36px;
  font-weight: 800;
  color: #fff;
  letter-spacing: -1.5px;
  line-height: 1;
  margin-bottom: 10px;
}
.sv-svc-tagline { font-size: 13px; color: rgba(255,255,255,.7); line-height: 1.5; }
.sv-svc-kpi {
  display: inline-block;
  margin-top: 24px;
  background: rgba(255,255,255,.12);
  padding: 6px 12px;
  border-radius: 2px;
  font-size: 11px;
  font-weight: 700;
  color: #fff;
  letter-spacing: .5px;
}

.sv-service-body {
  padding: 36px 40px;
  background: #fff;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  align-items: start;
}
.sv-svc-detail h4 {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--sv-muted);
  margin-bottom: 10px;
}
.sv-svc-detail ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin-bottom: 20px;
}
.sv-svc-detail ul li {
  font-size: 14px;
  color: var(--sv-body);
  padding-left: 16px;
  position: relative;
  line-height: 1.5;
}
.sv-svc-detail ul li::before {
  content: '→';
  position: absolute;
  left: 0;
  color: var(--sv-red);
  font-size: 11px;
  top: 3px;
}
.sv-price-box {
  background: var(--sv-warm);
  border-radius: 4px;
  padding: 18px 20px;
  margin-bottom: 10px;
}
.sv-price-main {
  font-size: 20px;
  font-weight: 700;
  color: var(--sv-ink);
  line-height: 1.2;
  margin-bottom: 6px;
}
.sv-price-detail { font-size: 13px; color: var(--sv-muted); line-height: 1.6; }
.sv-price-example {
  display: block;
  margin-top: 8px;
  font-size: 12px;
  font-style: italic;
  color: var(--sv-muted);
  padding-top: 8px;
  border-top: 1px solid var(--sv-rule);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   CÓMO FUNCIONA
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sv-how { padding: 96px 0; background: var(--sv-ink); }
.sv-how-header { margin-bottom: 56px; }
.sv-how-header p { font-size: 16px; color: rgba(255,255,255,.55); margin-top: 8px; }
.sv-how-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2px;
}
.sv-how-step {
  background: rgba(255,255,255,.04);
  padding: 32px 24px;
  border-top: 2px solid rgba(255,255,255,.07);
  transition: background .25s, border-color .25s;
}
.sv-how-step:hover {
  background: rgba(255,255,255,.07);
  border-color: var(--sv-red);
}
.sv-step-n {
  font-size: 44px;
  font-weight: 800;
  color: rgba(255,255,255,.08);
  line-height: 1;
  margin-bottom: 14px;
  display: block;
}
.sv-step-title {
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 8px;
}
.sv-step-desc { font-size: 14px; color: rgba(255,255,255,.58); line-height: 1.65; }
.sv-step-price {
  display: inline-block;
  margin-top: 14px;
  font-size: 12px;
  font-weight: 700;
  color: var(--sv-red);
  letter-spacing: .3px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   TABLA COMPARATIVA
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sv-compare { padding: 96px 0; background: var(--sv-warm); }
.sv-compare-header { margin-bottom: 40px; }
.sv-compare-header p { font-size: 16px; color: var(--sv-muted); max-width: 520px; margin-top: 8px; }
.sv-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.sv-table th {
  background: var(--sv-ink);
  color: #fff;
  padding: 13px 16px;
  text-align: left;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}
.sv-table td {
  padding: 15px 16px;
  border-bottom: 1px solid var(--sv-rule);
  background: #fff;
  vertical-align: top;
  line-height: 1.5;
}
.sv-table tr:last-child td { border-bottom: none; }
.sv-table .col-svc { font-weight: 700; }
.sv-table .col-svc.agenda { color: var(--sv-agenda); }
.sv-table .col-svc.filtro { color: var(--sv-filtro); }
.sv-table .col-svc.cita   { color: var(--sv-cita); }
.sv-compare-note {
  margin-top: 18px;
  font-size: 13px;
  color: var(--sv-muted);
  padding-left: 14px;
  border-left: 3px solid var(--sv-rule);
  line-height: 1.7;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   GARANTÍAS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sv-guarantees { padding: 96px 0; background: var(--sv-paper); }
.sv-g-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 3px;
  margin-top: 48px;
}
.sv-g-item {
  padding: 36px 32px;
  background: var(--sv-warm);
  border-top: 3px solid var(--sv-rule);
  transition: border-color .25s;
}
.sv-g-item:hover { border-color: var(--sv-red); }
.sv-g-n {
  font-size: 40px;
  font-weight: 800;
  color: var(--sv-rule);
  line-height: 1;
  margin-bottom: 14px;
}
.sv-g-item h3 {
  font-size: 16px;
  font-weight: 700;
  color: var(--sv-ink);
  margin-bottom: 8px;
}
.sv-g-item p { font-size: 14px; color: var(--sv-muted); line-height: 1.7; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   EQUIPO (nueva sección)
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sv-team { padding: 96px 0; background: var(--sv-ink); }
.sv-team-header { margin-bottom: 56px; }
.sv-team-header p { font-size: 16px; color: rgba(255,255,255,.55); margin-top: 8px; }

.sv-team-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 3px;
  margin-bottom: 3px;
}
.sv-member-card {
  background: rgba(255,255,255,.04);
  overflow: hidden;
  transition: background .25s;
}
.sv-member-card:hover { background: rgba(255,255,255,.08); }
.sv-member-img {
  width: 100%;
  aspect-ratio: 3/4;
  object-fit: cover;
  object-position: top;
  display: block;
  filter: grayscale(15%);
  transition: filter .3s;
}
.sv-member-card:hover .sv-member-img { filter: grayscale(0); }
.sv-member-info { padding: 20px; }
.sv-member-name {
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 4px;
}
.sv-member-role {
  font-size: 12px;
  font-weight: 600;
  color: var(--sv-red);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 8px;
}
.sv-member-bio { font-size: 13px; color: rgba(255,255,255,.55); line-height: 1.6; }

.sv-team-group {
  position: relative;
  overflow: hidden;
  max-height: 420px;
}
.sv-team-group img {
  width: 100%;
  height: 420px;
  object-fit: cover;
  object-position: center 30%;
  display: block;
  filter: grayscale(10%);
}
.sv-team-group-caption {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: linear-gradient(transparent, rgba(52,62,72,.9));
  padding: 48px 32px 24px;
}
.sv-team-group-caption p {
  font-size: 14px;
  color: rgba(255,255,255,.7);
  font-style: italic;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   FAQ — usa <details>/<summary> nativo (sin JS)
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sv-faq { padding: 96px 0; background: var(--sv-warm); }
.sv-faq-header { margin-bottom: 48px; }
.sv-faq-list { display: flex; flex-direction: column; gap: 2px; max-width: 760px; }

.sv-faq-item { background: #fff; }
.sv-faq-item details { }
.sv-faq-item summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 24px;
  cursor: pointer;
  font-size: 15px;
  font-weight: 600;
  color: var(--sv-ink);
  border-top: 1px solid var(--sv-rule);
  user-select: none;
  gap: 16px;
  list-style: none;
}
.sv-faq-item summary::-webkit-details-marker { display: none; }
.sv-faq-item summary::after {
  content: '+';
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1px solid var(--sv-rule);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  color: var(--sv-muted);
  transition: transform .25s, border-color .25s, color .25s;
  text-align: center;
  line-height: 22px;
}
.sv-faq-item details[open] summary::after {
  transform: rotate(45deg);
  border-color: var(--sv-red);
  color: var(--sv-red);
}
.sv-faq-item details[open] summary {
  color: var(--sv-red);
}
.sv-faq-answer {
  padding: 0 24px 20px;
  font-size: 14px;
  color: var(--sv-muted);
  line-height: 1.75;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   CTA FINAL
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sv-cta {
  position: relative;
  overflow: hidden;
}
.sv-cta-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.sv-cta-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(.3) saturate(.8);
}
.sv-cta-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(52,62,72,.92) 0%, rgba(227,63,55,.75) 100%);
  z-index: 1;
}
.sv-cta-content {
  position: relative;
  z-index: 2;
  padding: 100px 0;
}
.sv-cta-grid {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 64px;
  align-items: center;
}
.sv-cta h2 {
  font-size: clamp(26px, 3.5vw, 48px);
  font-weight: 800;
  color: #fff;
  letter-spacing: -1px;
  line-height: 1.08;
  margin-bottom: 14px;
}
.sv-cta p { font-size: 17px; color: rgba(255,255,255,.75); max-width: 500px; line-height: 1.65; }
.sv-cta-side { text-align: right; flex-shrink: 0; }
.sv-cta-note {
  display: block;
  margin-top: 10px;
  font-size: 12px;
  color: rgba(255,255,255,.5);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   FOOTER
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sv-footer {
  background: var(--sv-ink);
  padding: 56px 0 36px;
  border-top: 1px solid rgba(255,255,255,.05);
}
.sv-footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 48px;
  margin-bottom: 44px;
}
.sv-footer-brand .logo {
  font-size: 21px;
  font-weight: 800;
  color: #fff;
  text-decoration: none;
  display: inline-block;
  margin-bottom: 12px;
}
.sv-footer-brand .logo span { color: var(--sv-red); }
.sv-footer-brand p {
  font-size: 13px;
  color: rgba(255,255,255,.42);
  line-height: 1.7;
  max-width: 260px;
}
.sv-footer-col h4 {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,.35);
  margin-bottom: 14px;
}
.sv-footer-col ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 24px;
}
.sv-footer-col ul li a {
  font-size: 13px;
  color: rgba(255,255,255,.52);
  text-decoration: none;
  transition: color .2s;
}
.sv-footer-col ul li a:hover { color: #fff; }
.sv-footer-bottom {
  padding-top: 22px;
  border-top: 1px solid rgba(255,255,255,.07);
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  color: rgba(255,255,255,.28);
  flex-wrap: wrap;
  gap: 8px;
}
.sv-footer-bottom a {
  color: rgba(255,255,255,.38);
  text-decoration: none;
  transition: color .2s;
}
.sv-footer-bottom a:hover { color: rgba(255,255,255,.7); }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SCROLL REVEAL
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
[data-sv-reveal] {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .55s ease, transform .55s ease;
}
[data-sv-reveal].sv-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   RESPONSIVE
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (max-width: 1024px) {
  .sv-hero-grid { grid-template-columns: 1fr; }
  .sv-hero-img { display: none; }
  .sv-team-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
  .sv-narrative-grid { grid-template-columns: 1fr; }
  .sv-service-card { grid-template-columns: 1fr; }
  .sv-service-body { grid-template-columns: 1fr; }
  .sv-how-steps { grid-template-columns: repeat(2, 1fr); }
  .sv-pain-grid { grid-template-columns: repeat(2, 1fr); }
  .sv-g-grid { grid-template-columns: 1fr; }
  .sv-footer-grid { grid-template-columns: 1fr 1fr; }
  .sv-cta-grid { grid-template-columns: 1fr; }
  .sv-cta-side { text-align: left; }
}
@media (max-width: 600px) {
  .sv-wrap { padding: 0 20px; }
  .sv-section, .sv-hero, .sv-narrative, .sv-pain,
  .sv-services, .sv-how, .sv-compare, .sv-guarantees,
  .sv-team, .sv-faq { padding: 64px 0; }
  .sv-pain-grid,
  .sv-how-steps,
  .sv-g-grid,
  .sv-team-grid { grid-template-columns: 1fr; }
  .sv-hero-proof { gap: 24px; }
  .sv-footer-grid { grid-template-columns: 1fr; }
  .sv-nav-links { display: none; }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   EDITOR STYLES — Gutenberg overrides
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.editor-styles-wrapper {
  font-family: var(--sv-font) !important;
  background: var(--sv-paper) !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   NATIVE BLOCK COMPATIBILITY
   Overrides para que los bloques nativos de Gutenberg
   mantengan el diseño de Segundo Verbo
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* Reset margenes/padding de grupos de sección */
.wp-block-group.sv-hero,
.wp-block-group.sv-narrative,
.wp-block-group.sv-pain,
.wp-block-group.sv-services,
.wp-block-group.sv-how,
.wp-block-group.sv-compare,
.wp-block-group.sv-guarantees,
.wp-block-group.sv-team,
.wp-block-group.sv-faq,
.wp-block-group.sv-cta-section {
  padding: 0 !important;
  max-width: none !important;
}

/* Pain grid / How steps / Guarantees — wp:columns como CSS grid */
.wp-block-columns.sv-pain-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 3px !important;
  flex-wrap: unset !important;
  margin-bottom: 0 !important;
}
.wp-block-columns.sv-how-steps {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 2px !important;
  flex-wrap: unset !important;
  margin-bottom: 0 !important;
}
.wp-block-columns.sv-g-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 3px !important;
  flex-wrap: unset !important;
  margin-bottom: 0 !important;
}
.wp-block-columns.sv-team-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 3px !important;
  flex-wrap: unset !important;
  margin-bottom: 0 !important;
}
.wp-block-columns.sv-pain-grid > .wp-block-column,
.wp-block-columns.sv-how-steps > .wp-block-column,
.wp-block-columns.sv-g-grid > .wp-block-column,
.wp-block-columns.sv-team-grid > .wp-block-column {
  flex-basis: unset !important;
  min-width: 0 !important;
  padding: 0 !important;
}

/* Pain items dentro de columns */
.sv-pain-grid .wp-block-group.sv-pain-item { background: #fff; }

/* Service cards como group */
.wp-block-group.sv-service-card {
  display: grid !important;
  grid-template-columns: 280px 1fr !important;
  margin-bottom: 3px;
  border: 1px solid var(--sv-rule);
  overflow: hidden;
}
.wp-block-group.sv-service-card > .wp-block-columns {
  display: contents !important; /* pass-through para que los hijos sean columnas directas */
}

/* Steps: headings y párrafos sin colores de bloque por defecto */
.sv-how-step .wp-block-heading,
.sv-g-item .wp-block-heading {
  margin-bottom: 8px;
}

/* Botón primario con nuestro estilo */
.wp-block-button.sv-btn-primary .wp-block-button__link,
.wp-element-button.sv-btn-primary {
  background: var(--sv-red) !important;
  color: #fff !important;
  border-radius: 3px !important;
  font-weight: 700 !important;
  padding: 14px 32px !important;
  border: none !important;
  transition: background .2s !important;
}
.wp-block-button.sv-btn-primary .wp-block-button__link:hover {
  background: #c03330 !important;
}

/* Ghost button */
.wp-block-button.sv-btn-ghost .wp-block-button__link {
  background: transparent !important;
  color: var(--sv-muted) !important;
  border: none !important;
  border-bottom: 1px solid var(--sv-rule) !important;
  border-radius: 0 !important;
  padding: 0 0 2px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

/* Tabla comparativa */
.sv-table.wp-block-table table { width: 100%; }
.sv-table.wp-block-table td,
.sv-table.wp-block-table th { padding: 13px 16px; }

/* FAQ con wp:details */
.wp-block-details.sv-faq-item { background: #fff; margin-bottom: 2px; }
.wp-block-details.sv-faq-item > summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 24px;
  cursor: pointer;
  font-size: 15px;
  font-weight: 600;
  color: var(--sv-ink);
  border-top: 1px solid var(--sv-rule);
  list-style: none;
}
.wp-block-details.sv-faq-item > summary::-webkit-details-marker { display: none; }
.wp-block-details.sv-faq-item > summary::after {
  content: '+';
  flex-shrink: 0;
  width: 22px; height: 22px;
  border-radius: 50%;
  border: 1px solid var(--sv-rule);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; color: var(--sv-muted);
  transition: transform .25s, border-color .25s, color .25s;
  text-align: center; line-height: 22px;
}
.wp-block-details.sv-faq-item[open] > summary::after {
  transform: rotate(45deg);
  border-color: var(--sv-red);
  color: var(--sv-red);
}
.wp-block-details.sv-faq-item > .wp-block-details__content { padding: 0 24px 20px; }
.wp-block-details.sv-faq-item > .wp-block-details__content p {
  font-size: 14px; color: var(--sv-muted); line-height: 1.75; margin: 0;
}

/* Cover para CTA */
.wp-block-cover.sv-cta-section {
  min-height: 480px !important;
  padding: 0 !important;
}
.wp-block-cover.sv-cta-section .wp-block-cover__inner-container {
  padding: 100px 32px !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
  width: 100% !important;
}

/* Responsive overrides para columns-as-grid */
@media (max-width: 900px) {
  .wp-block-columns.sv-pain-grid   { grid-template-columns: repeat(2, 1fr) !important; }
  .wp-block-columns.sv-how-steps   { grid-template-columns: repeat(2, 1fr) !important; }
  .wp-block-columns.sv-team-grid   { grid-template-columns: repeat(2, 1fr) !important; }
  .wp-block-group.sv-service-card  { grid-template-columns: 1fr !important; }
}
@media (max-width: 600px) {
  .wp-block-columns.sv-pain-grid   { grid-template-columns: 1fr !important; }
  .wp-block-columns.sv-how-steps   { grid-template-columns: 1fr !important; }
  .wp-block-columns.sv-g-grid      { grid-template-columns: 1fr !important; }
  .wp-block-columns.sv-team-grid   { grid-template-columns: 1fr !important; }
}
