.product-detail-page .e1c-site-container{width:min(var(--container-content),calc(100% - 48px))}
@media (min-width:1024px){.product-detail-page .e1c-site-container{width:min(var(--container-content),calc(100% - 64px))}}
.product-value-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.product-detail-hero-title span,.products-index-card-title span{display:inline-flex;align-items:center;border-radius:999px;background:var(--color-brand-teal-soft);padding:4px 10px;color:var(--color-brand-teal-contrast);font-size:.72rem;font-weight:800;line-height:1;text-transform:uppercase}
.product-detail-hero-title{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:16px}
.product-detail-hero-title h1{margin:0;max-width:1024px;color:var(--color-brand-navy-deep);font-size:clamp(2.25rem,5vw,3.75rem);font-weight:700;line-height:.95}
.product-detail-hero-copy>p:not(.redesign-eyebrow){margin-top:18px;max-width:768px;font-size:clamp(1.125rem,2vw,1.25rem)}
.product-detail-hero-copy>p:not(.redesign-eyebrow)+p:not(.redesign-eyebrow){margin-top:14px}
.product-detail-hero-actions .redesign-btn{min-width:164px;min-height:52px;gap:10px;padding:0 28px;font-size:1rem;line-height:1}
.product-detail-hero-actions .redesign-btn .ui-icon{width:13px;height:13px;margin-top:1px}
.product-detail-page .redesign-section-heading h2{font-size:clamp(1.875rem,3vw,2.25rem);font-weight:700;line-height:1.15}
.product-detail-page .redesign-section-heading p:not(.redesign-eyebrow){max-width:768px;font-size:1.125rem;line-height:1.55}
.product-detail-page .product-differential-card h3,.product-detail-page .redesign-card h3,.product-detail-page .redesign-step h3{font-size:1.125rem;font-weight:700}
.product-detail-page .product-differential-card p,.product-detail-page .redesign-card p,.product-detail-page .redesign-step p{font-size:1rem}
.product-detail-tinted-section{background:var(--color-brand-teal-soft)}
.product-detail-body{padding:56px 0}
.product-detail-prose{max-width:70ch}
.product-detail-prose p{color:var(--color-text-slate);font-size:1.15rem;line-height:1.75}
.product-detail-prose p+p{margin-top:32px}
.product-card-token{margin:0 0 10px;color:var(--color-brand-teal-contrast);font-size:.8rem;font-weight:800}
.product-differential-grid,.product-tier-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.product-differential-card{border:1px solid rgba(71,175,180,.24);border-radius:var(--radius-card);background:rgba(216,243,243,.28);padding:20px}
.product-differential-card h3{margin:0;color:var(--color-brand-navy-deep);font-size:1rem;font-weight:800;line-height:1.25}
.product-differential-card p,.product-differential-card small{display:block;margin-top:10px;color:var(--color-text-slate);line-height:1.5}
.product-differential-card small{color:var(--color-text-muted);font-size:.82rem}
.product-code-sample{overflow-x:auto;border-radius:var(--radius-card);background:var(--color-brand-navy-deep);padding:24px;color:var(--color-brand-teal-soft);font-size:.95rem;line-height:1.6}
.product-code-sample code{font-family:Outfit,ui-sans-serif,system-ui,sans-serif}
.product-gpu-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.product-gpu-grid h3{margin:0 0 14px;color:var(--color-brand-teal-contrast);font-size:.9rem;font-weight:800;text-transform:uppercase}
.product-gpu-grid article{display:grid;gap:4px;border:1px solid rgba(160,160,160,.3);border-radius:var(--radius-card);background:var(--color-surface-card);padding:16px}
.product-gpu-grid article+article{margin-top:12px}
.product-gpu-grid strong{color:var(--color-brand-navy-deep)}
.product-gpu-grid span{color:var(--color-text-muted);font-size:.9rem}
.product-pricing-starting{margin:24px 0 0;color:var(--color-brand-navy-deep);font-size:1.5rem;line-height:1.2}
.product-pricing-starting span{color:var(--color-brand-teal-contrast);font-weight:700}
.product-pricing-note{margin-top:18px;color:var(--color-text-muted);font-size:.95rem;line-height:1.6}
@media (max-width:1024px){.product-differential-grid,.product-tier-grid,.product-value-grid,.products-index-grid,.redesign-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767.98px){.product-differential-grid,.product-gpu-grid,.product-tier-grid,.product-value-grid,.products-index-grid,.redesign-card-grid,.redesign-proof-grid,.redesign-step-grid,.e1c-site-nav-products-grid{grid-template-columns:1fr}}
.product-detail-page .product-detail-hero-title h1{font-size:2.25rem}
@media (min-width:640px){.product-detail-page .product-detail-hero-title h1{font-size:3rem}}
@media (min-width:768px){.product-detail-page .product-detail-hero-title h1{font-size:3.75rem}}
/* ============ Company section hero =====================================
   The pages under Company opened with Kadence's "Hero Products" pattern,
   which carried its illustration as a row background image rather than as
   content. Rebuilding those heroes as the product-page hero would have thrown
   the artwork away, so it rides along on its own layer here and each page
   keeps its identity. Decorative only — it is aria-hidden in the markup. */
/* .redesign-hero > div:not(.redesign-hero-bg) forces position:relative on every
   layer, which collapsed this one to zero height. Outspecify it rather than
   loosen that rule, which the product heroes rely on. */
.redesign-hero.company-hero > .company-hero-art {
  position: absolute;
  inset: 0 0 0 auto;
  z-index: 0;
  width: min(44%, 600px);
  background-repeat: no-repeat;
  background-position: right center;
  background-size: contain;
  pointer-events: none;
}

.company-hero--art .product-detail-hero-copy { max-width: 60ch; }

/* Under the artwork the copy would sit on top of it, so it drops back to a
   faint wash instead of competing with the heading. */
@media (max-width: 900px) {
  .company-hero-art { width: 78%; opacity: .16; }
  .company-hero--art .product-detail-hero-copy { max-width: none; }
}

/* Photographs (About Us, Ecuador) need a soft edge; flat SVG illustrations
   already have transparent margins. */
.company-hero-art--photo {
  -webkit-mask-image: linear-gradient(to left, #000 62%, transparent);
  mask-image: linear-gradient(to left, #000 62%, transparent);
}

/* Unboxed content is what makes the hero span the window, but it also removes
   the container from any block that was not wrapped in a Kadence row — on
   CSIRT the whole "CSIRT Services" section is a bare column, and it went
   edge-to-edge. Rows cap themselves; everything else gets the same width back.
   Anchored on the hero so it applies to exactly the pages that received it. */
.single-content > .company-hero ~ *:not(.kb-row-layout-wrap):not(.wp-block-kadence-rowlayout):not(style):not(script) {
  max-width: min(var(--company-measure), 100% - 40px);
  margin-inline: auto;
}

/* Three different left edges met on these pages: the hero container is wider
   than the Kadence rows (1280 vs 1140), and an uncapped block is wider still.
   1092px is the boxed content width these pages had before, so every section
   lands back on the same margin the body copy already used. */
.single-content:has(.company-hero) { --company-measure: 1092px; }

.single-content > .company-hero > .e1c-site-container {
  max-width: min(var(--company-measure), 100% - 40px);
  padding-inline: 0;
}

/* /map/ is the one page whose content *is* the map, so the cap above works
   against it: every pixel of width is more network visible without zooming.
   The :has() carries an ID's specificity, which is what lets it beat the
   generic rule; matching on the map container rather than on child order means
   the heading rows around it keep the page measure. Same 1680px ceiling used
   for the country list on /locations/. */
.page-id-2543 .single-content > .wp-block-kadence-column:has(#AppContainer) {
  max-width: min(1680px, 100% - 48px);
}

/* Hero subhead measured 4.30:1 against the hero's gradient at 1440 (the token
   grey is fine on flat #f7f7f7, but the gradient lifts the background). Slate
   instead of grey clears 4.5:1 across the gradient without changing the
   type's weight or feel. */
.redesign-hero .redesign-hero-copy > p:not(.redesign-eyebrow) {
  color: var(--color-text-slate);
}

/* ---------------------------------------------------------------------------
   CTA previo al footer (12 paginas de producto y soluciones)
   Defectos corregidos:
   - blog-bridge trae `.single-content h2,h3,h4{color:var(--color-brand-navy-deep)}`
     y carga despues, asi que el titulo quedaba navy sobre banda navy: invisible.
   - la misma regla forzaba `font-size:1.75rem`, anulando el clamp del componente.
   - `.single-content p{margin:0 0 1.15em}` mataba los margenes `auto` del parrafo,
     que quedaba como bloque de 760px pegado a la izquierda de un contenedor de 1152px.
   - el boton seguia en la medida vieja (44px / .95rem) mientras los del hero de
     producto ya usan 52px / 1rem, y `--color-brand-teal-contrast` sobre navy da
     2.2:1, practicamente sin separacion del fondo (y el hover era navy sobre navy).
   La doble clase `.redesign-cta.redesign-cta` sube la especificidad a (0,2,1) para
   ganarle a blog-bridge por peso y no por orden de carga.
   --------------------------------------------------------------------------- */
.redesign-cta.redesign-cta{padding:96px 0;background:radial-gradient(ellipse 900px 380px at 50% 0,rgba(71,175,180,.16),rgba(71,175,180,0) 70%),var(--color-brand-navy-deep)}
.redesign-cta.redesign-cta>.e1c-site-container{display:flex;max-width:860px;flex-direction:column;align-items:center;text-align:center}
.redesign-cta.redesign-cta h2{max-width:780px;margin:0;color:#ffffff;font-size:clamp(2rem,3.4vw,3rem);font-weight:800;line-height:1.08;letter-spacing:-.01em}
.redesign-cta.redesign-cta p{max-width:620px;margin:20px 0 0;color:rgba(255,255,255,.75);font-size:1.125rem;line-height:1.6}
.redesign-cta.redesign-cta .redesign-cta-actions{margin:36px 0 0;justify-content:center;gap:16px}
.redesign-cta .redesign-btn{min-width:176px;min-height:52px;padding:0 30px;font-size:1rem;line-height:1}
.redesign-cta .redesign-btn-primary{background:var(--color-brand-teal);color:var(--color-brand-navy-deep)}
.redesign-cta .redesign-btn-primary:focus-visible,.redesign-cta .redesign-btn-primary:hover{background:var(--color-brand-teal-soft);color:var(--color-brand-navy-deep);box-shadow:0 15px 25px -7px rgba(0,0,0,.35)}
.redesign-cta .redesign-btn-secondary{border-color:rgba(255,255,255,.35);background:transparent;color:#ffffff}
.redesign-cta .redesign-btn-secondary:focus-visible,.redesign-cta .redesign-btn-secondary:hover{border-color:var(--color-brand-teal-soft);background:rgba(255,255,255,.08);color:var(--color-brand-teal-soft)}
@media (max-width:1023px){.redesign-cta.redesign-cta{padding:80px 0}}
@media (max-width:767px){.redesign-cta.redesign-cta{padding:64px 0}.redesign-cta.redesign-cta h2{font-size:clamp(1.75rem,6.4vw,2.25rem)}.redesign-cta.redesign-cta p{margin-top:16px;font-size:1.0625rem}.redesign-cta.redesign-cta .redesign-cta-actions{width:100%;margin-top:28px}.redesign-cta.redesign-cta .redesign-cta-actions .redesign-btn{width:100%}}