/* =====================================================================
   boiler.css — Componentes específicos de la plantilla "Calderas {Marca}"
   Hereda variables del :root (--color-primary, --color-brand, etc.)
   ===================================================================== */

/* ── Topbar ───────────────────────────────────────────────────────── */
.topbar{
  background:linear-gradient(90deg,var(--color-dark),#13283f);
  color:#cbd5e1;font-size:.8rem;padding:.4rem 0;
}
.topbar .container{gap:1rem}
.topbar-phone{color:#fff;font-weight:700;text-decoration:none}
.topbar-phone:hover{color:#fdba74}

/* ── Marca en header ──────────────────────────────────────────────── */
.brand-badge{
  display:flex;align-items:center;justify-content:center;
  width:42px;height:42px;border-radius:12px;flex:0 0 auto;
  background:linear-gradient(135deg,var(--color-brand),color-mix(in srgb,var(--color-brand) 70%, #000));
  box-shadow:0 4px 12px color-mix(in srgb,var(--color-brand) 35%, transparent);
}
.brand-text{display:flex;flex-direction:column;line-height:1.05}
.brand-text__main{font-size:1rem;font-weight:800;color:var(--color-dark)}
.brand-text__sub{font-size:.72rem;font-weight:600;color:var(--color-brand);text-transform:uppercase;letter-spacing:.04em}

/* ── Hero ─────────────────────────────────────────────────────────── */
.hero-boiler{
  background:
    radial-gradient(1200px 400px at 85% -10%, color-mix(in srgb,var(--color-brand) 12%, transparent), transparent 60%),
    linear-gradient(180deg, var(--color-hero-bg), #fff);
  padding:2.5rem 0 3rem;
}
.hero-boiler.hero-compact{padding:2rem 0 2rem}
.hero-eyebrow{
  display:inline-block;margin-bottom:.6rem;padding:.3rem .8rem;border-radius:999px;
  background:color-mix(in srgb,var(--color-brand) 8%, #fff);
  color:color-mix(in srgb,var(--color-brand) 76%, #000);font-weight:700;font-size:.78rem;letter-spacing:.02em;
  border:1px solid color-mix(in srgb,var(--color-brand) 25%, transparent);
}
.hero-boiler h1{font-weight:800;letter-spacing:-.02em;line-height:1.12;color:var(--color-dark)}
.hero-usps{display:flex;flex-wrap:wrap;gap:.4rem .9rem;margin:.9rem 0 .2rem;font-weight:600;font-size:.9rem;color:#334155}
.hero-usps span{white-space:nowrap}

.error-hero-head{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.error-hero-code{
  display:flex;align-items:center;justify-content:center;flex:0 0 auto;
  min-width:96px;height:96px;padding:0 .6rem;border-radius:18px;
  background:linear-gradient(135deg,#0f172a,#1e293b);color:#fff;
  font-weight:800;font-size:1.8rem;box-shadow:var(--shadow-card);
}

/* ── Answer box (TL;DR / AEO) ─────────────────────────────────────── */
.answer-box{
  background:#fff;border:1px solid #e2e8f0;border-left:5px solid var(--color-brand);
  border-radius:var(--border-radius);padding:1.1rem 1.3rem;margin:1.5rem 0;
  box-shadow:var(--shadow-card);
}
.answer-box--legal{border-left-color:var(--color-secondary)}
.answer-box__label{
  display:flex;align-items:center;gap:.5rem;font-weight:800;color:var(--color-dark);
  margin-bottom:.5rem;font-size:1.02rem;
}
.answer-box__label svg{color:var(--color-brand)}
.answer-box__body{color:#334155;margin:0;line-height:1.6}
.answer-box__list{margin:.4rem 0 0;padding-left:1.1rem;color:#334155}
.answer-box__list li{margin-bottom:.25rem}

/* ── Service cards ────────────────────────────────────────────────── */
.service-card{
  display:flex;flex-direction:column;height:100%;text-decoration:none;color:inherit;
  background:#fff;border:1px solid #e9eef5;border-radius:var(--border-radius);
  padding:1.3rem;transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.service-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px -12px rgba(2,32,71,.25);border-color:color-mix(in srgb,var(--color-brand) 40%, #e9eef5)}
.service-card__icon{
  display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:14px;
  background:color-mix(in srgb,var(--color-brand) 12%, #fff);color:var(--color-brand);margin-bottom:.9rem;
}
.service-card__title{color:var(--color-dark);margin-bottom:.4rem}
.service-card__cta{margin-top:auto;color:var(--color-brand);font-weight:700;font-size:.9rem}

/* ── Brand trust (entidad) ────────────────────────────────────────── */
.brand-trust{
  display:grid;grid-template-columns:240px 1fr;gap:1.8rem;align-items:center;
  background:linear-gradient(180deg,#fff,var(--color-section-alt));
  border:1px solid #e9eef5;border-radius:18px;padding:1.6rem;box-shadow:var(--shadow-card);
}
.brand-trust__media{text-align:center}
.brand-trust__media img{max-width:200px;height:auto}
.brand-trust__tagline{margin-top:.7rem;font-size:.84rem;color:#64748b;font-style:italic}
.brand-trust__facts{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem;margin:0 0 1rem}
.brand-trust__facts>div{background:#fff;border:1px solid #eef2f7;border-radius:10px;padding:.5rem .7rem}
.brand-trust__facts dt{font-size:.7rem;text-transform:uppercase;letter-spacing:.04em;color:#94a3b8;font-weight:700}
.brand-trust__facts dd{margin:0;font-weight:700;color:var(--color-dark);font-size:.92rem}
.brand-trust__chips,.model-specs{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.4rem}
.chip,.spec-chip{
  display:inline-block;padding:.3rem .7rem;border-radius:999px;font-size:.8rem;font-weight:600;
  background:color-mix(in srgb,var(--color-primary) 8%, #fff);color:var(--color-primary);
  border:1px solid color-mix(in srgb,var(--color-primary) 18%, transparent);
}
.spec-chip strong{font-weight:800}

/* ── Tablas: errores y precios ────────────────────────────────────── */
.error-table-wrap,.pricing-table-wrap{
  background:#fff;border:1px solid #e9eef5;border-radius:14px;overflow:hidden;box-shadow:var(--shadow-card);
}
.error-table,.pricing-table{margin:0}
.error-table thead th,.pricing-table thead th{
  background:var(--color-dark);color:#fff;font-weight:700;font-size:.82rem;border:0;padding:.8rem 1rem;
  text-transform:uppercase;letter-spacing:.02em;
}
.error-table tbody td,.error-table tbody th,
.pricing-table tbody td,.pricing-table tbody th{padding:.7rem 1rem;vertical-align:middle;border-color:#eef2f7}
.error-table tbody tr:hover,.pricing-table tbody tr:hover{background:var(--color-section-alt)}
.error-code-chip{
  display:inline-block;font-weight:800;color:#fff;text-decoration:none;
  background:linear-gradient(135deg,var(--color-primary),#0a3a66);
  padding:.25rem .6rem;border-radius:8px;font-size:.85rem;min-width:62px;text-align:center;
}
.error-code-chip:hover{filter:brightness(1.12)}
.urg-badge{display:inline-block;color:#fff;font-weight:700;font-size:.72rem;padding:.2rem .55rem;border-radius:999px;white-space:nowrap}
.urg-badge--lg{font-size:.85rem;padding:.35rem .9rem}
.price-cell{color:var(--color-brand);white-space:nowrap}
.link-arrow{color:var(--color-brand);font-weight:700;text-decoration:none;font-size:.85rem;white-space:nowrap}
.link-arrow:hover{text-decoration:underline}
.pricing-notes{padding-left:1.1rem}
.pricing-notes li{margin-bottom:.2rem}

/* ── Error cards ──────────────────────────────────────────────────── */
.error-card{
  display:flex;flex-direction:column;height:100%;text-decoration:none;color:inherit;
  background:#fff;border:1px solid #e9eef5;border-top:3px solid var(--color-secondary);
  border-radius:14px;padding:1.1rem;transition:transform .2s ease,box-shadow .2s ease;
}
.error-card:hover{transform:translateY(-3px);box-shadow:0 12px 26px -12px rgba(2,32,71,.25)}
.error-card__code{display:inline-block;font-weight:800;color:var(--color-secondary);font-size:1.1rem;margin-bottom:.3rem}
.error-card__title{color:var(--color-dark);margin-bottom:.3rem}
.error-card__cta{margin-top:auto;color:var(--color-brand);font-weight:700;font-size:.85rem}
.error-chip-card{
  display:flex;align-items:center;justify-content:center;gap:.4rem;position:relative;
  background:#fff;border:1px solid #e9eef5;border-radius:10px;padding:.7rem .4rem;
  text-decoration:none;font-weight:800;color:var(--color-dark);transition:.2s;
}
.error-chip-card:hover{border-color:var(--color-brand);color:var(--color-brand)}
.error-chip-card__dot{width:8px;height:8px;border-radius:50%}

/* ── Listas paso a paso / check ───────────────────────────────────── */
.steps-list{list-style:none;padding:0;margin:0}
.steps-list li{display:flex;gap:.9rem;padding:.7rem 0;border-bottom:1px dashed #e2e8f0}
.steps-list li:last-child{border-bottom:0}
.steps-list__num{
  flex:0 0 auto;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--color-brand);color:#fff;font-weight:800;font-size:.9rem;
}
.check-list{list-style:none;padding:0;margin:0}
.check-list li{position:relative;padding:.35rem 0 .35rem 1.8rem;color:#334155}
.check-list li::before{content:"✓";position:absolute;left:0;top:.35rem;color:#16a34a;font-weight:800}

/* ── Info / value cards ───────────────────────────────────────────── */
.info-card{background:#fff;border:1px solid #e9eef5;border-radius:14px;padding:1.3rem;box-shadow:var(--shadow-card)}
.info-card--tip{border-left:4px solid var(--color-secondary);background:#fffdf8}
.value-card{background:#fff;border:1px solid #e9eef5;border-radius:14px;padding:1.3rem;height:100%;text-align:center}
.value-card>span{font-size:1.8rem;display:block;margin-bottom:.5rem}

/* ── Modelos ──────────────────────────────────────────────────────── */
.model-card{
  display:flex;gap:1rem;align-items:center;height:100%;text-decoration:none;color:inherit;
  background:#fff;border:1px solid #e9eef5;border-radius:14px;padding:1rem;transition:transform .2s,box-shadow .2s;
}
.model-card:hover{transform:translateY(-3px);box-shadow:0 12px 26px -12px rgba(2,32,71,.25)}
.model-card__img{flex:0 0 auto;width:74px;height:74px;display:flex;align-items:center;justify-content:center;background:var(--color-section-alt);border-radius:12px}
.model-card__img img{width:64px;height:64px;object-fit:contain}
.model-card__title{color:var(--color-dark)}
.model-card__cta{color:var(--color-brand);font-weight:700;font-size:.82rem}
.model-hero-img{background:radial-gradient(circle at 50% 40%, color-mix(in srgb,var(--color-brand) 14%, #fff), transparent 70%);border-radius:24px;padding:1.2rem}
.issue-row{display:flex;gap:.7rem;align-items:flex-start;background:#fff;border:1px solid #eef2f7;border-radius:10px;padding:.7rem .9rem}
.issue-row__icon{flex:0 0 auto}

/* ── Reviews ──────────────────────────────────────────────────────── */
.reviews-rating{display:flex;align-items:center;justify-content:center;gap:.5rem;flex-wrap:wrap}
.reviews-rating__stars{color:#f59e0b;font-size:1.3rem;letter-spacing:2px}
.reviews-rating__value{font-weight:800;font-size:1.5rem;color:var(--color-dark)}
.review-card{
  background:#fff;border:1px solid #e9eef5;border-radius:14px;padding:1.2rem;height:100%;
  margin:0;box-shadow:var(--shadow-card);display:flex;flex-direction:column;
}
.review-card__stars{color:#f59e0b;letter-spacing:2px;margin-bottom:.4rem}
.review-card__title{color:var(--color-dark);margin-bottom:.3rem}
.review-card__text{flex:1;font-style:italic}
.review-card__author{margin-top:auto}

/* ── Footer link helper (por si custom.css no lo trae) ────────────── */
.footer-link{color:rgba(255,255,255,.5)!important;text-decoration:none;transition:color .15s}
.footer-link:hover{color:#fff!important}

/* ── Legal / sitemap ──────────────────────────────────────────────── */
.legal-page h2{color:var(--color-dark)}
.sitemap-cols a{color:var(--color-primary);text-decoration:none;display:inline-block;padding:.2rem 0}
.sitemap-cols a:hover{text-decoration:underline}
.sitemap-codes{column-count:2;column-gap:1.2rem}

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width:991.98px){
  .brand-trust{grid-template-columns:1fr;text-align:center}
  .brand-trust__facts{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:575.98px){
  .hero-boiler h1{font-size:1.6rem}
  .error-hero-code{min-width:72px;height:72px;font-size:1.3rem}
  .brand-trust__facts{grid-template-columns:1fr}
  .sitemap-codes{column-count:1}
}

/* ── Hero visual (ilustración de caldera) ─────────────────────────── */
.hero-visual{position:relative;max-width:380px;margin:0 auto;padding:1rem}
.hero-visual__glow{
  position:absolute;inset:6% 10%;border-radius:50%;
  background:radial-gradient(circle, color-mix(in srgb,var(--color-brand) 26%, transparent), transparent 70%);
  filter:blur(8px);z-index:0;
}
.hero-visual__frame{
  position:relative;z-index:1;background:#fff;border:1px solid #eef2f7;border-radius:22px;
  padding:1rem;box-shadow:0 24px 48px -20px rgba(2,32,71,.35);
  border-top:5px solid var(--color-brand);
}
.hero-visual__img{display:block;width:100%;height:auto;border-radius:12px;object-fit:contain}
.hero-visual__badge{
  position:absolute;z-index:2;background:#fff;border-radius:12px;padding:.45rem .7rem;
  font-weight:800;font-size:.85rem;color:var(--color-dark);box-shadow:0 8px 20px -6px rgba(2,32,71,.3);
  display:flex;align-items:center;gap:.3rem;
}
.hero-visual__badge--rating{top:8%;left:-4%;color:#b45309}
.hero-visual__badge--rating span{color:#f59e0b}
.hero-visual__badge--warranty{bottom:20%;right:-6%}
.hero-visual__badge--24h{bottom:6%;left:2%;background:#c2410c;color:#fff}

/* ── Foto destacada (técnico) ─────────────────────────────────────── */
.feature-photo{margin:0}
.feature-photo img{width:100%;height:auto;border-radius:18px;box-shadow:0 16px 36px -18px rgba(2,32,71,.4);object-fit:cover}
.feature-photo figcaption{margin-top:.6rem;font-size:.82rem;color:#94a3b8;text-align:center}