/* HagoElTrabajo v1832 — Módulo 1 · Página principal: diseño limpio
 *
 * Este archivo decide el ESPACIO de la página principal: un solo ancho de contenido, el mismo borde izquierdo
 * para todas las secciones, el mismo tamaño de títulos y el mismo ritmo vertical. Se carga al final de index.html.
 * (Antes, cada sección tenía su propio ancho y margen: 26, 30, 40, 43, 55, 64 o 99 px desde el borde.)
 * Las tarjetas de resultados son de search-results.css. Colores de marca: brand.css.
 */
body.het-home{
  --hl-max:1180px;
  --hl-gutter:clamp(16px,4vw,32px);
  --hl-pad:max(var(--hl-gutter),calc((100% - var(--hl-max)) / 2));
  --hl-block:clamp(40px,6vw,72px);
  --hl-ink:#131C24;--hl-muted:#4D565E;--hl-green:#0C4A7D;--hl-forest:#093960;--hl-line:#DDE1E5;--hl-soft:#F4F7F3;
  background:#fff;
}

/* ---------- un solo contenedor para todas las secciones ---------- */
body.het-home main>section{
  max-width:none!important;margin:0!important;box-sizing:border-box;
  padding-left:var(--hl-pad)!important;padding-right:var(--hl-pad)!important;
}
body.het-home main>section[hidden]{display:none!important}
body.het-home .hx-inner,body.het-home .het-why-in{max-width:none!important;margin:0!important;padding:0!important}

/* ---------- títulos: una sola escala ---------- */
body.het-home main h2{font-size:clamp(1.45rem,2.3vw,1.9rem)!important;font-weight:750!important;letter-spacing:-.02em;line-height:1.2;color:var(--hl-ink);margin:0 0 20px!important}
body.het-home .het-section-kicker,body.het-home .eyebrow{display:none!important}

/* ---------- encabezado: menos enlaces ---------- */
body.het-home .l2-nav a[href="#servicios"],body.het-home .l2-nav a[href="#como-funciona"]{display:none!important}

/* ---------- portada ---------- */
body.het-home #inicio{background:#fff!important;padding-top:clamp(24px,4vw,48px)!important;padding-bottom:clamp(28px,4vw,48px)!important;column-gap:clamp(24px,4vw,56px)}
body.het-home #inicio h1{font-size:clamp(2rem,4.4vw,3.2rem)!important;line-height:1.05!important;letter-spacing:-.03em;margin:0 0 14px!important;color:var(--hl-ink)}
body.het-home #inicio .hx-lede{font-size:clamp(1rem,1.3vw,1.125rem)!important;line-height:1.5;color:var(--hl-muted);max-width:56ch;margin:0 0 24px!important}
body.het-home #inicio .hx-search{box-shadow:0 1px 2px rgba(19,28,36,.06),0 8px 24px rgba(19,28,36,.08)!important;border:1px solid var(--hl-line)!important}
body.het-home #inicio .hx-hero-photo{border-radius:20px!important;box-shadow:none!important}
body.het-home #inicio .het-photo-sticker{display:none!important}

/* ---------- categorías ---------- */
body.het-home #servicios{padding-top:var(--hl-block)!important;padding-bottom:clamp(24px,3vw,40px)!important;background:#fff!important}
body.het-home #servicios .hx-section-head{margin:0 0 18px!important;padding:0!important;align-items:end}
body.het-home #servicios .hx-section-head h2{margin:0 0 12px!important}

/* ---------- resultados ---------- */
body.het-home #resultSection{background:var(--hl-soft)!important;padding-top:clamp(28px,4vw,48px)!important;padding-bottom:clamp(28px,4vw,48px)!important;border-radius:0!important;box-shadow:none!important}
body.het-home #resultSection .section-head{margin:0 0 18px!important;padding:0!important;align-items:center}
body.het-home #resultSection .section-head h2{margin:0!important}
body.het-home .featured-banner-slot,body.het-home .commercial-ad-slot{padding-top:16px!important}

/* ---------- cómo funciona: 3 pasos, sin cajas ---------- */
body.het-home #como-funciona{background:#fff!important;color:var(--hl-ink)!important;padding-top:var(--hl-block)!important;padding-bottom:var(--hl-block)!important}
body.het-home #como-funciona h2{color:var(--hl-ink)!important}
body.het-home #como-funciona ol{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,40px)!important;margin:0!important;padding:0!important;list-style:none}
body.het-home #como-funciona li{display:block!important;background:none!important;border:0!important;box-shadow:none!important;padding:0!important;color:var(--hl-ink)!important}
body.het-home #como-funciona .hx-num{display:inline-grid!important;place-items:center;width:36px!important;height:36px!important;border-radius:50%!important;background:var(--hl-green)!important;color:#fff!important;font-size:16px!important;font-weight:750;margin:0 0 12px!important}
body.het-home #como-funciona li strong{display:block;font-size:1.1rem;margin:0 0 6px;color:var(--hl-ink)!important}
body.het-home #como-funciona li p{margin:0!important;color:var(--hl-muted)!important;line-height:1.5}

/* ---------- por qué HagoElTrabajo: 3 × 2, ícono de línea ---------- */
body.het-home #porque{background:var(--hl-soft);padding-top:var(--hl-block)!important;padding-bottom:var(--hl-block)!important}
body.het-home .het-why-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px clamp(20px,3vw,40px)}
body.het-home .het-why-grid>div{background:none;border:0;padding:0}
body.het-home .het-why-ico{width:28px;height:28px;color:var(--hl-green);display:block;margin:0 0 10px}
body.het-home .het-why-grid strong{display:block;margin:0 0 4px;color:var(--hl-ink);font-size:1.05rem;font-weight:700}
body.het-home .het-why-grid p{margin:0;color:var(--hl-muted);line-height:1.5}

/* ---------- para proveedores y negocios ---------- */
body.het-home #providerOpportunity{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px!important;padding-top:var(--hl-block)!important;padding-bottom:var(--hl-block)!important}
body.het-home .hx-path{background:#fff!important;border:1px solid var(--hl-line)!important;border-radius:16px!important;box-shadow:none!important;padding:clamp(22px,3vw,36px)!important;margin:0!important}
body.het-home .hx-path h2{margin:0 0 10px!important;font-size:1.4rem!important}
body.het-home .hx-path p{color:var(--hl-muted);line-height:1.55;margin:0 0 20px}
body.het-home .hx-path .hx-btn{box-shadow:none!important}
body.het-home .het-manual-link{display:inline-block;margin-top:14px;font-weight:600}

/* ---------- pie ---------- */
body.het-home footer{padding-left:var(--hl-pad)!important;padding-right:var(--hl-pad)!important}
body.het-home footer>*{max-width:none!important;margin-left:0!important;margin-right:0!important;padding-left:0!important;padding-right:0!important}

/* ---------- tableta y celular ---------- */
@media (max-width:900px){
  body.het-home .het-why-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.het-home #providerOpportunity{grid-template-columns:1fr}
}
@media (max-width:640px){
  body.het-home #como-funciona ol{grid-template-columns:1fr;gap:22px!important}
  body.het-home #como-funciona li{display:grid!important;grid-template-columns:36px 1fr;column-gap:14px}
  body.het-home #como-funciona .hx-num{grid-row:span 2;margin:0!important}
  body.het-home .het-why-grid{grid-template-columns:1fr;gap:20px}
  body.het-home .het-why-grid>div{display:grid;grid-template-columns:28px 1fr;column-gap:14px}
  body.het-home .het-why-ico{grid-row:span 2;margin:0}
}

/* ---------- mismo borde que el contenido ---------- */
body.het-home .l2-header{padding-left:var(--hl-pad)!important;padding-right:var(--hl-pad)!important}
body.het-home #categories{padding-left:0!important;padding-right:0!important;max-width:none!important;margin-left:0!important;margin-right:0!important}
body.het-home main h2{text-align:left!important}
body.het-home .hx-section-head,body.het-home #resultSection .section-head{text-align:left!important}
@media (max-width:640px){
  body.het-home .hx-section-head,body.het-home #resultSection .section-head{display:block!important}
  body.het-home .hx-section-head>div,body.het-home #resultSection .section-head>div{width:100%;text-align:left!important;align-items:flex-start!important;justify-content:flex-start!important}
}

/* v1963 — Homepage typography and compact section rhythm only. */
body.het-home{--hl-block:clamp(20px,3vw,36px)}
body.het-home #inicio{padding-top:clamp(14px,2vw,24px)!important;padding-bottom:clamp(14px,2vw,24px)!important}
body.het-home #inicio h1{font-size:clamp(1.5rem,2.6vw,2rem)!important;line-height:1.15!important;margin-bottom:10px!important}
body.het-home #inicio .hx-lede{font-size:clamp(.9375rem,1.1vw,1rem)!important;line-height:1.45!important;margin-bottom:14px!important}
body.het-home #inicio .hx-hero-copy{gap:12px!important}
body.het-home main h2{font-size:clamp(1.25rem,1.9vw,1.5rem)!important;margin-bottom:12px!important}
body.het-home #servicios{padding-top:clamp(20px,3vw,36px)!important;padding-bottom:clamp(12px,1.5vw,20px)!important}
body.het-home #servicios .hx-section-head{margin-bottom:12px!important}
body.het-home #servicios .hx-section-head h2{margin-bottom:6px!important}
body.het-home #resultSection{padding-top:clamp(14px,2vw,24px)!important;padding-bottom:clamp(14px,2vw,24px)!important}
body.het-home #resultSection .section-head{margin-bottom:12px!important}
body.het-home .featured-banner-slot,body.het-home .commercial-ad-slot{padding-top:8px!important}
@media(max-width:640px){
 body.het-home #inicio h1{font-size:1.5rem!important}
 body.het-home main h2{font-size:1.25rem!important}
 body.het-home #inicio .hx-lede{font-size:.9375rem!important}
}

/* v1964 Hero Premium: replaces nonfunctional stock photograph. */
body.het-home #inicio .het-hero-premium{display:flex;min-width:0;min-height:210px;align-self:stretch;border:1px solid #d7e4ee;border-radius:20px;background:linear-gradient(135deg,#edf5fb,#fff);padding:18px;box-shadow:0 6px 20px #092a5912;box-sizing:border-box}
.het-hero-premium .het-hero-fallback,.het-hero-premium .het-hero-ad{display:flex;flex-direction:column;gap:9px;justify-content:center;width:100%;min-width:0}
.het-hero-premium .het-hero-label{font-size:11px;font-weight:800;letter-spacing:.09em;color:#1769ac}
.het-hero-premium h2{font-size:clamp(18px,1.6vw,23px)!important;line-height:1.18;margin:0;color:#092a59}
.het-hero-premium p{font-size:14px;line-height:1.45;margin:0;color:#344b5e}
.het-hero-premium .het-hero-cta{display:inline-flex;align-items:center;justify-content:center;min-height:44px;max-width:100%;box-sizing:border-box;border-radius:9px;background:#092a59;color:#fff;text-decoration:none;font-size:14px;font-weight:700;padding:9px 13px;align-self:flex-start}
.het-hero-premium .het-hero-image{width:100%;max-height:115px;object-fit:cover;border-radius:10px}
@media(max-width:900px){body.het-home #inicio .het-hero-premium{min-height:0;order:2}}
@media(max-width:620px){body.het-home #inicio .het-hero-premium{display:flex!important;padding:10px 12px;margin-top:10px;min-height:0;border-radius:12px}body.het-home #inicio .het-hero-premium .het-hero-fallback{gap:5px}body.het-home #inicio .het-hero-premium h2{font-size:17px!important}body.het-home #inicio .het-hero-premium p{font-size:13px}body.het-home #inicio .het-hero-premium .het-hero-image{max-height:65px;max-width:82px}body.het-home #inicio .het-hero-premium .het-hero-ad{display:grid;grid-template-columns:82px minmax(0,1fr);align-items:center;gap:5px 10px}body.het-home #inicio .het-hero-premium .het-hero-ad .het-hero-label{grid-column:1/-1}body.het-home #inicio .het-hero-premium .het-hero-ad .het-hero-cta{grid-column:2}body.het-home #inicio .het-hero-premium .het-hero-ad h2{grid-column:2;grid-row:2}body.het-home #inicio .het-hero-premium .het-hero-ad p{display:none}}