/* =========================================================================
   Baker (Astra Child) — global.css
   1) Full-width real en todo el sitio (mata el "boxed")
   2) Hueco para el header fijo (72px)
   3) Blog "Learn the Law" (hero + filtros + featured + grid + CTA)
   4) Entrada individual (single)
   Paleta del mockup. Todo el CSS del blog/single va namespaced bajo
   .blg-blog / .blg-single para no chocar con Astra/Elementor.
   ========================================================================= */

:root{
  --navy:#0F3E5E; --charcoal:#141414; --off-white:#FAFAF7; --steel:#2A6F97;
  --cream:#EDE8E0; --muted:#E8E4DD; --muted-fg:#6B6560; --border:#D6D0C8;
  --card:#FFFFFF; --radius:.375rem;
}

/* -------------------------------------------------------------------------
   1) FULL-WIDTH  ->  fin del boxed
   Astra en layout "page-builder" ya quita el contenedor; estas reglas son
   el cinturón de seguridad por si alguna versión reinyecta max-width/padding.
   ---------------------------------------------------------------------- */
.baker-fullwidth .site-content .ast-container,
.baker-fullwidth .ast-container,
.baker-fullwidth #primary,
.baker-fullwidth #main,
.baker-fullwidth .site-content,
.baker-fullwidth .entry-content{
  max-width:100% !important;
  width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
  padding-left:0 !important;
  padding-right:0 !important;
}
.baker-fullwidth .site-content{ overflow-x:hidden; }
/* Astra a veces mete padding al article del contenido */
.baker-fullwidth .ast-article-single,
.baker-fullwidth .ast-article-post{ padding:0 !important; }

/* -------------------------------------------------------------------------
   2) HUECO PARA EL HEADER FIJO (.blg-global-header es position:fixed; 72px)
   En las páginas de Elementor el propio <style> ya pone padding-top:72px;
   aquí lo garantizamos también en blog, single, búsqueda y 404.
   ---------------------------------------------------------------------- */
body{ padding-top:72px; }

/* =========================================================================
   3) BLOG  "Learn the Law"
   ========================================================================= */
.blg-blog{
  font-family:'Lato',sans-serif; color:var(--charcoal);
  background:var(--off-white); line-height:1.6;
}
.blg-blog *,
.blg-blog *::before,
.blg-blog *::after{ box-sizing:border-box; }
.blg-blog h1,.blg-blog h2,.blg-blog h3{ font-family:'Playfair Display',serif; }
.blg-blog a{ text-decoration:none; color:inherit; }
.blg-wrap{ max-width:1200px; margin:0 auto; padding:0 24px; }

/* --- Hero --- */
.blg-blog-hero{
  position:relative; padding:96px 24px; text-align:center; color:#fff;
  background:var(--navy) center/cover no-repeat;
}
.blg-blog-hero::before{
  content:""; position:absolute; inset:0;
  background:transparent;
}
.blg-blog-hero > *{ position:relative; z-index:1; }
.blg-blog-hero h1{ font-size:clamp(34px,5vw,52px); margin:0 0 14px; color:#fff; }
.blg-blog-hero p{
  max-width:720px; margin:0 auto; font-size:18px; color:rgba(255,255,255,.85);
}

/* --- Filtros (pills) --- */
.blg-filters{
  display:flex; flex-wrap:wrap; gap:10px; justify-content:center;
  padding:32px 24px 8px;
}
.blg-filter{
  border:1px solid var(--border); background:#fff; color:var(--charcoal);
  font-size:14px; font-weight:600; padding:9px 18px; border-radius:999px;
  cursor:pointer; transition:all .15s; font-family:'Lato',sans-serif;
}
.blg-filter:hover{ border-color:var(--steel); color:var(--steel); }
.blg-filter.is-active{ background:var(--navy); border-color:var(--navy); color:#fff; }

/* --- Featured --- */
.blg-featured-wrap{ padding:24px 0 8px; }
.blg-featured{
  display:grid; grid-template-columns:1.1fr 1fr; gap:0;
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); overflow:hidden;
}
.blg-featured-media{ position:relative; min-height:320px; background:var(--cream); }
.blg-featured-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.blg-featured-badge{
  position:absolute; top:16px; left:16px; background:var(--steel); color:#fff;
  font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  padding:6px 12px; border-radius:4px;
}
.blg-featured-body{ padding:40px; display:flex; flex-direction:column; justify-content:center; }
.blg-featured-cat{ color:var(--steel); font-weight:700; font-size:13px; text-transform:uppercase; letter-spacing:.04em; }
.blg-featured-body h2{ font-size:28px; margin:10px 0 14px; line-height:1.25; }
.blg-featured-body p{ color:var(--muted-fg); font-size:16px; margin-bottom:20px; }
.blg-meta{ display:flex; gap:16px; color:var(--muted-fg); font-size:13px; margin-bottom:18px; }
.blg-readmore{ color:var(--navy); font-weight:700; font-size:14px; display:inline-flex; align-items:center; gap:6px; }
.blg-readmore::after{ content:"→"; }

/* --- Grid de recientes --- */
.blg-section-title{ font-size:26px; margin:48px 0 24px; }
.blg-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:28px; padding-bottom:8px;
}
.blg-card{
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column;
  transition:transform .15s, box-shadow .15s;
}
.blg-card:hover{ transform:translateY(-4px); box-shadow:0 12px 28px rgba(20,20,20,.12); }
.blg-card-media{ height:188px; background:var(--cream); }
.blg-card-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.blg-card-body{ padding:22px; display:flex; flex-direction:column; flex:1; }
.blg-card-cat{ color:var(--steel); font-weight:700; font-size:12px; text-transform:uppercase; letter-spacing:.04em; }
.blg-card-body h3{ font-size:19px; line-height:1.3; margin:8px 0 10px; }
.blg-card-body p{ color:var(--muted-fg); font-size:14px; flex:1; }
.blg-card .blg-meta{ margin:14px 0 0; }

/* Filtro: ocultar tarjetas que no coinciden */
.blg-card.is-hidden,
.blg-featured.is-hidden{ display:none; }

.blg-empty{ text-align:center; color:var(--muted-fg); padding:40px 0; display:none; }
.blg-empty.is-visible{ display:block; }

/* --- CTA --- */
.blg-cta{ background:var(--navy); color:#fff; text-align:center; padding:64px 24px; margin-top:56px; }
.blg-cta h2{ font-family:'Playfair Display',serif; font-size:30px; margin:0 0 12px; }
.blg-cta p{ color:rgba(255,255,255,.85); max-width:620px; margin:0 auto 24px; }
.blg-cta-actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.blg-btn{
  display:inline-block; padding:13px 26px; border-radius:6px; font-weight:700; font-size:15px;
}
.blg-btn-gold{ background:#C9A24B; color:#1a1a1a; }
.blg-btn-ghost{ border:1px solid rgba(255,255,255,.55); color:#fff; }

@media(max-width:980px){
  .blg-featured{ grid-template-columns:1fr; }
  .blg-grid{ grid-template-columns:repeat(2,1fr); }
}
@media(max-width:640px){
  .blg-grid{ grid-template-columns:1fr; }
  .blg-featured-body{ padding:28px; }
}

/* =========================================================================
   4) SINGLE (entrada individual)
   ========================================================================= */
.blg-single{ font-family:'Lato',sans-serif; color:var(--charcoal); background:var(--off-white); line-height:1.75; }
.blg-single h1,.blg-single h2,.blg-single h3{ font-family:'Playfair Display',serif; }
.blg-single a{ color:var(--steel); }
.blg-single-hero{ background:var(--navy); color:#fff; padding:72px 24px 56px; }
.blg-single-hero .blg-wrap{ max-width:820px; }
.blg-single-cat{ color:#9fc6e0; font-weight:700; font-size:13px; text-transform:uppercase; letter-spacing:.04em; }
.blg-single-hero h1{ font-size:clamp(30px,4.5vw,44px); margin:12px 0 16px; line-height:1.2; }
.blg-single-hero .blg-meta{ color:rgba(255,255,255,.75); }
.blg-single-figure{ max-width:920px; margin:-32px auto 0; padding:0 24px; }
.blg-single-figure img{ width:100%; border-radius:var(--radius); display:block; box-shadow:0 16px 40px rgba(20,20,20,.18); }
.blg-single-body{ max-width:760px; margin:0 auto; padding:48px 24px 8px; font-size:17px; }
.blg-single-body p{ margin:0 0 20px; }
.blg-single-body h2{ font-size:26px; margin:36px 0 14px; }
.blg-single-body h3{ font-size:21px; margin:28px 0 12px; }
.blg-single-body ul,.blg-single-body ol{ margin:0 0 20px 22px; }
.blg-single-body img{ max-width:100%; height:auto; border-radius:var(--radius); }
.blg-back{ display:block; max-width:760px; margin:8px auto 0; padding:0 24px 48px; }
.blg-back a{ color:var(--navy); font-weight:700; }

/* --- Blog "Learn the Law" a ANCHO COMPLETO sin sidebar (Astra Free) ---
   Aplica al LISTADO (.blog) y a la ENTRADA INDIVIDUAL (.single / .single-post).
   La entrada individual no llevaba estas reglas, por eso Astra le metía
   columna estrecha + hueco de sidebar (la franja vacía a la derecha). */
.blog #primary,
.blog #content > .ast-container,
.single #primary,
.single #content > .ast-container,
.single-post #primary,
.single-post #content > .ast-container{ max-width:100%; padding-left:0; padding-right:0; }
.blog #content > .ast-container,
.single #content > .ast-container,
.single-post #content > .ast-container{ display:block; }
.blog #secondary,
.blog .widget-area,
.single #secondary,
.single .widget-area,
.single-post #secondary,
.single-post .widget-area{ display:none; }
.blog #primary,
.single #primary,
.single-post #primary{ width:100%; flex:0 0 100%; max-width:100%; margin:0; }
.blog .site-content .ast-container,
.single .site-content .ast-container,
.single-post .site-content .ast-container{ width:100%; max-width:100%; }
/* el artículo de Astra sin padding propio que descuadre */
.single .ast-article-single,
.single-post .ast-article-single,
.single .ast-article-post,
.single-post .ast-article-post{ padding:0 !important; margin:0 !important; max-width:100%; }

/* === "Other Areas Served": CSS de secciones (clavado al mockup) === */
.oa-h2{font-family:'Playfair Display',serif;color:#0F3E5E;font-size:33px;font-weight:700;line-height:1.2;margin:0 0 22px;}
.oa-intro p{color:#3a3a3a;font-size:17px;line-height:1.75;max-width:1000px;margin:0;}
.oa-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin:6px 0 0;}
.oa-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:32px 16px;min-height:116px;background:#EDE8E0;border:0;border-radius:6px;color:#141414;font-weight:600;font-size:17px;text-decoration:none;text-align:center;transition:background .2s,transform .2s,box-shadow .2s;}
.oa-card:hover{background:#E5DFD4;transform:translateY(-2px);box-shadow:0 8px 20px rgba(15,62,94,.10);}
.oa-card .icon{width:28px;height:28px;flex:0 0 28px;color:#0F3E5E;}
.oa-card span{line-height:1.2;}
.po-box{background:#EDE8E0;border-radius:6px;padding:42px 46px;}
.po-box h2{font-family:'Playfair Display',serif;color:#0F3E5E;font-size:29px;font-weight:700;margin:0 0 14px;}
.po-box>p{color:#6B6560;font-size:16px;line-height:1.6;margin:0 0 28px;}
.po-grid{display:grid;grid-template-columns:1fr 1fr;gap:34px;}
.po-grid h3{color:#141414;font-size:18px;font-weight:700;margin:0 0 8px;}
.po-grid p{color:#6B6560;font-size:15px;line-height:1.6;margin:0 0 6px;}
.po-grid a{color:#2A6F97;text-decoration:none;font-size:15px;font-weight:600;}
.po-grid a:hover{text-decoration:underline;}
.isec:has(.oa-state){display:none;}
@media(max-width:980px){.oa-grid{grid-template-columns:repeat(2,1fr);}.po-grid{grid-template-columns:1fr;gap:24px;}.po-box{padding:32px 26px;}}

/* =========================================================================
   v4 — Ajustes globales de PÁGINAS (hero, botones, imágenes, fichas)
   Estas clases viven en el HTML Elementor de las páginas. Se cargan aquí
   para aplicarse de forma centralizada en todo el sitio.
   ========================================================================= */

/* (5) Contraste hero: overline blanco + más grande */
.hero-overline span{color:#fff !important;font-size:12px !important;}
.hero-overline .line{background:rgba(255,255,255,.6) !important;}

/* (5) Estrellas de rating en testimonials -> dorado */
.pg-hero .extra .stars{color:#FACC15 !important;}
.rev-rating .stars{color:#FACC15 !important;}

/* (7) Encuadre uniforme de imágenes de hero (menos cielo, misma altura) */
.pg-hero,.hero{height:420px !important;}
.pg-hero img,.hero img{width:100% !important;height:100% !important;object-fit:cover !important;object-position:center 60% !important;}

/* (9) Hover de botones del hero: el texto SIEMPRE blanco (evita azul invisible) */
.btn-steel:hover,.btn-lg:hover,.btn-steel:hover .icon,.btn-lg:hover .icon{color:#fff !important;}
.btn-outline-w:hover{color:#fff !important;}

/* (20) Fichas de abogado: bloque .hours-box -> textos en blanco */
.hours-box h3{color:#fff !important;}
.hours-box p{color:#fff !important;}

/* =========================================================================
   v4 — WPForms (form 13718): se apunta DIRECTO al form por ID, sin depender
   del div .form-largo/.form-lateral (Elementor a veces lo elimina al render).
   Doble selector: por ID y por clase envoltorio, para cubrir ambos casos.
   ========================================================================= */
#wpforms-13718 .wpforms-form,
.form-largo .wpforms-form,.form-lateral .wpforms-form{font-family:'Lato',sans-serif !important;}
div.wpforms-container-full{margin:0 !important;}

/* contenedor de cada campo */
#wpforms-13718 div.wpforms-field,
.form-largo div.wpforms-field,.form-lateral div.wpforms-field{
  padding:0 0 16px !important;margin:0 !important;border:0 !important;}

/* LABEL principal: pequeño, mayúsculas (el problema era el tamaño enorme) */
#wpforms-13718 .wpforms-field-label,
.form-largo .wpforms-field-label,.form-lateral .wpforms-field-label{
  font-size:11px !important;font-weight:700 !important;text-transform:uppercase !important;
  letter-spacing:.15em !important;color:var(--muted-fg) !important;
  margin:0 0 6px !important;line-height:1.3 !important;display:block !important;
  font-family:'Lato',sans-serif !important;}
/* algunos temas meten el texto del label en un <span>: forzar tamaño tambien */
#wpforms-13718 .wpforms-field-label *{font-size:inherit !important;}

#wpforms-13718 .wpforms-required-label,
.form-largo .wpforms-required-label,.form-lateral .wpforms-required-label{color:#b91c1c !important;}

/* sublabels "First / Last" */
#wpforms-13718 .wpforms-field-sublabel,
.form-largo .wpforms-field-sublabel,.form-lateral .wpforms-field-sublabel{
  font-size:11px !important;color:var(--muted-fg) !important;text-transform:none !important;
  letter-spacing:0 !important;font-weight:400 !important;margin-top:4px !important;line-height:1.3 !important;}

/* INPUTS / SELECT / TEXTAREA */
#wpforms-13718 .wpforms-field input[type=text],
#wpforms-13718 .wpforms-field input[type=email],
#wpforms-13718 .wpforms-field input[type=tel],
#wpforms-13718 .wpforms-field select,
#wpforms-13718 .wpforms-field textarea,
.form-largo .wpforms-field input,.form-largo .wpforms-field select,.form-largo .wpforms-field textarea,
.form-lateral .wpforms-field input,.form-lateral .wpforms-field select,.form-lateral .wpforms-field textarea{
  width:100% !important;max-width:100% !important;padding:12px 14px !important;
  border:1px solid var(--border) !important;border-radius:var(--radius) !important;
  font-family:'Lato',sans-serif !important;font-size:14px !important;line-height:1.4 !important;
  background:#fff !important;color:var(--charcoal) !important;box-sizing:border-box !important;
  box-shadow:none !important;height:auto !important;margin:0 !important;}
#wpforms-13718 .wpforms-field textarea{resize:none !important;min-height:120px !important;}

/* ocultar descripciones largas */
#wpforms-13718 .wpforms-field-description,
.form-largo .wpforms-field-description,.form-lateral .wpforms-field-description{display:none !important;}

/* BOTÓN enviar: navy, ancho completo */
#wpforms-13718 button.wpforms-submit,
.form-largo button.wpforms-submit,.form-lateral button.wpforms-submit{
  width:100% !important;background:var(--navy) !important;color:#fff !important;border:0 !important;
  border-radius:var(--radius) !important;font-family:'Lato',sans-serif !important;font-weight:700 !important;
  padding:15px !important;font-size:14px !important;text-transform:uppercase !important;letter-spacing:.08em !important;
  cursor:pointer !important;transition:background .2s !important;}
#wpforms-13718 button.wpforms-submit:hover,
.form-largo button.wpforms-submit:hover,.form-lateral button.wpforms-submit:hover{background:#0c3350 !important;}

/* LATERAL: tarjeta compacta (cuando el div SÍ existe) */
.form-lateral{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:24px;}
.form-lateral div.wpforms-field{padding:0 0 12px !important;}
.form-lateral button.wpforms-submit{padding:11px !important;}

/* (11) Badges de la home: 7 en una sola fila, altura uniforme y gap reducido */
.badges-inner{gap:28px !important;flex-wrap:nowrap !important;}
.badges-inner img{max-height:52px !important;width:auto !important;object-fit:contain !important;flex:0 1 auto;}
@media(max-width:980px){.badges-inner{flex-wrap:wrap !important;gap:24px !important;}.badges-inner img{max-height:46px !important;}}

/* --- Ficha de abogado (CPT attorney) a ANCHO COMPLETO sin sidebar --- */
.single-attorney #primary,
.single-attorney #content > .ast-container{ max-width:100%; padding-left:0; padding-right:0; }
.single-attorney #content > .ast-container{ display:block; }
.single-attorney #secondary,
.single-attorney .widget-area{ display:none; }
.single-attorney #primary{ width:100%; flex:0 0 100%; max-width:100%; margin:0; }
.single-attorney .site-content .ast-container{ width:100%; max-width:100%; }
.single-attorney .ast-article-single,
.single-attorney .ast-article-post{ padding:0 !important; margin:0 !important; max-width:100%; }