:root{
    --navy:#0E2238;
    --navy-soft:#173A5C;
    --paper:#FFFFFF;
    --cloud:#F4F5F7;          /* neutral más limpio y premium (menos azulado) */
    --flame:#FF6B35;
    --flame-deep:#E2501C;
    --ice:#3AA6D9;
    --gold:#FFB930;
    --text:#111C27;           /* cuerpo un punto más profundo (mejor jerarquía) */
    --muted:#5D6B7A;
    --line:#E8EBEF;           /* hairline más sutil */
    --radius:16px;
    --shadow:0 22px 54px rgba(14,34,56,0.09);   /* sombra más grande y suave = profundidad premium */
    --ease:cubic-bezier(.22,1,.36,1);
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Inter',sans-serif;
    color:var(--text);
    background:var(--paper);
    line-height:1.6;
    overflow-x:hidden;
  }
  img{max-width:100%; display:block;}
  a{color:inherit; text-decoration:none;}
  ul{list-style:none;}
  button{font-family:inherit; cursor:pointer;}
  .mono{font-family:'IBM Plex Mono',monospace;}
  h1,h2,h3,h4{
    font-family:'Fraunces',serif;
    font-weight:600;
    line-height:1.05;
    color:var(--navy);
    letter-spacing:-0.02em;
    text-wrap:balance;
  }
  .eyebrow{
    font-family:'IBM Plex Mono',monospace;
    font-size:12.5px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
    color:var(--flame-deep);
    display:inline-flex; align-items:center; gap:8px;
    margin-bottom:14px;
  }
  .eyebrow::before{ content:""; width:22px; height:2px; background:var(--flame); }
  .wrap{ max-width:1180px; margin:0 auto; padding:0 28px; }
  section{ padding:100px 0; }
  @media(max-width:720px){ section{ padding:64px 0; } .wrap{ padding:0 20px; } }

  /* reveal-on-scroll (cinematográfico: entra difuminado y desde abajo) */
  .reveal{ opacity:0; transform:translateY(34px); filter:blur(6px); transition:opacity 1s var(--ease), transform 1s var(--ease), filter 1s var(--ease); }
  .reveal.in{ opacity:1; transform:translateY(0); filter:blur(0); }
  .reveal-stagger > *{ opacity:0; transform:translateY(28px); filter:blur(5px); transition:opacity .85s var(--ease), transform .85s var(--ease), filter .85s var(--ease); }
  .reveal-stagger.in > *{ opacity:1; transform:translateY(0); filter:blur(0); }
  .reveal-stagger.in > *:nth-child(1){ transition-delay:.04s; }
  .reveal-stagger.in > *:nth-child(2){ transition-delay:.11s; }
  .reveal-stagger.in > *:nth-child(3){ transition-delay:.18s; }
  .reveal-stagger.in > *:nth-child(4){ transition-delay:.25s; }
  .reveal-stagger.in > *:nth-child(5){ transition-delay:.32s; }
  .reveal-stagger.in > *:nth-child(6){ transition-delay:.39s; }
  .reveal-stagger.in > *:nth-child(7){ transition-delay:.46s; }
  .reveal-stagger.in > *:nth-child(8){ transition-delay:.53s; }
  /* Las tarjetas de producto de la home comparten hover con el catálogo:
     el transition-delay del stagger no debe quedarse pegado o el hover responde tarde. */
  .product-grid3.reveal-stagger.in > .p-card{ transition-delay:0s; }
  @media (prefers-reduced-motion: reduce){
    .reveal, .reveal-stagger > *{ opacity:1; transform:none; filter:none; transition:none; }
  }

  /* buttons */
  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:9px;
    padding:15px 28px; border-radius:999px; font-weight:600; font-size:15px;
    border:1.5px solid transparent; transition:transform .2s var(--ease), box-shadow .2s var(--ease), background .2s;
    white-space:nowrap;
  }
  .btn-flame{ background:var(--flame); color:#fff; box-shadow:0 8px 20px rgba(14,34,56,.16), inset 0 1px 0 rgba(255,255,255,.22); }
  .btn-flame:hover{ background:var(--flame-deep); transform:translateY(-2px); box-shadow:0 16px 34px rgba(14,34,56,.22), inset 0 1px 0 rgba(255,255,255,.22); }
  .btn-ghost{ border-color:rgba(255,255,255,.35); color:#fff; }
  .btn-ghost:hover{ background:rgba(255,255,255,.1); transform:translateY(-2px); }
  .btn-navy{ border-color:var(--navy); color:var(--navy); }
  .btn-navy:hover{ background:var(--navy); color:#fff; transform:translateY(-2px); }
  .btn-white{ background:#fff; color:var(--flame-deep); font-weight:700; }
  .btn-white:hover{ transform:translateY(-2px); box-shadow:0 12px 26px rgba(0,0,0,.18); }
  /* Feedback de pulsado (Emil): el boton se hunde al presionar */
  .btn:active{ transform:translateY(0) scale(.97); }

  /* header */
  header{
    position:fixed; top:0; left:0; right:0; z-index:100;
    padding:20px 0;
    transition:background .3s var(--ease), padding .3s var(--ease), box-shadow .3s var(--ease);
  }
  header.scrolled{
    background:rgba(11,22,36,0.72);
    -webkit-backdrop-filter:blur(18px) saturate(1.4); backdrop-filter:blur(18px) saturate(1.4);
    padding:12px 0; box-shadow:0 1px 0 rgba(255,255,255,.06), 0 8px 30px rgba(0,0,0,.18);
  }
  .header-inner{ display:flex; align-items:center; justify-content:space-between; }
  /* El logo trae debajo la línea "AIRE ACONDICIONADO & CALDERAS" en gris;
     recortamos el ~32% inferior (overflow) para dejar solo el logotipo. */
  .logo{ display:flex; align-items:flex-start; height:31px; overflow:hidden; }
  .logo img{ height:44px; width:auto; display:block; }
  header.scrolled .logo{ height:28px; transition:height .3s var(--ease); }
  header.scrolled .logo img{ height:40px; transition:height .3s var(--ease); }
  nav.main-nav{ display:flex; gap:17px; }
  nav.main-nav a{ color:rgba(255,255,255,.82); font-size:14px; font-weight:500; transition:color .15s; position:relative; white-space:nowrap; }
  nav.main-nav a:hover{ color:#fff; }
  .header-actions{ display:flex; align-items:center; gap:16px; }
  .phone-pill{ display:flex; align-items:center; gap:7px; color:#fff; font-family:'IBM Plex Mono'; font-size:13.5px; font-weight:600; }
  .phone-pill svg{ width:15px; height:15px; stroke:var(--flame); }
  .nav-toggle{ display:none; background:none; border:none; color:#fff; padding:6px; }
  .nav-toggle svg{ width:26px; height:26px; stroke:#fff; }
  @media(max-width:1040px){
    nav.main-nav{ display:none; }
    .phone-pill{ display:none; }
    .nav-toggle{ display:block; flex:none; }
    .header-actions{ gap:10px; }
    .header-actions .btn-flame{ display:none; }
    .logo{ height:26px; }
    .logo img{ height:37px; }
    .header-inner{ gap:10px; }
  }
  .mobile-nav{
    position:fixed; inset:0; background:var(--navy); z-index:250;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:28px;
    transform:translateY(-100%); transition:transform .4s var(--ease);
  }
  .mobile-nav.open{ transform:translateY(0); }
  .mobile-nav a{ color:#fff; font-family:'Fraunces'; font-size:28px; }
  .mobile-nav .close-btn{ position:absolute; top:24px; right:28px; background:none; border:none; }
  .mobile-nav .close-btn svg{ width:28px; height:28px; stroke:#fff; }

  /* hero */
  .hero{
    position:relative; overflow:hidden;
    background:
      linear-gradient(178deg, rgba(9,20,34,.46) 0%, rgba(9,19,32,.82) 58%, rgba(7,16,28,.97) 100%),
      radial-gradient(80% 80% at 78% -10%, rgba(255,107,53,.14), transparent 55%),
      image-set(url("hero-bg.webp") type("image/webp"), url("hero-bg.jpg") type("image/jpeg"));
    background-size: cover, cover, cover;
    background-position: center, center, 50% 30%;
    background-repeat: no-repeat, no-repeat, no-repeat;
    color:#fff;
    padding:210px 0 96px;
    min-height:780px;
    display:flex;
    align-items:center;
  }
  .hero .wrap{ display:grid; grid-template-columns:1.2fr .8fr; gap:64px; align-items:center; width:100%; }
  @media(max-width:960px){ .hero .wrap{ grid-template-columns:1fr; } .hero{ padding-top:140px; min-height:560px; } }
  @media(max-width:600px){ .hero{ min-height:480px; } }
  /* Heros de páginas interiores (breadcrumb+título): sin el hueco grande de la home */
  .hero:has(.page-hero){ min-height:0; padding:118px 0 58px; align-items:flex-start; }
  @media(max-width:960px){ .hero:has(.page-hero){ padding-top:104px; } }
  .hero h1{ color:#fff; font-size:clamp(42px,6.4vw,84px); line-height:1.02; letter-spacing:-.025em; font-weight:600; margin-bottom:24px; text-wrap:balance; }
  .hero h1 .accent{ color:var(--flame); font-style:italic; }
  .hero p.lead{ color:rgba(255,255,255,.82); font-size:19px; line-height:1.7; max-width:544px; margin-bottom:40px; }
  .hero-ctas{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:54px; }
  .hero-stats{ display:flex; gap:22px 46px; flex-wrap:wrap; }
  .hero-stats .stat{ min-width:88px; }
  .hero-stats .num{ font-family:'Fraunces'; font-weight:700; font-size:38px; color:#fff; letter-spacing:-.01em; }
  .hero-stats .num .suffix{ color:var(--flame); }
  .hero-stats .lbl{ font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:rgba(255,255,255,.55); margin-top:6px; }

  /* google rating card */
  .rating-card{
    background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14);
    border-radius:20px; padding:30px; backdrop-filter:blur(6px);
  }
  .rating-top{ display:flex; align-items:center; gap:14px; margin-bottom:18px; }
  .g-icon{ width:34px; height:34px; flex:none; }
  .rating-top .name{ font-family:'IBM Plex Mono'; font-size:12px; color:rgba(255,255,255,.6); text-transform:uppercase; letter-spacing:.08em; }
  .rating-score{ display:flex; align-items:baseline; gap:12px; margin-bottom:10px; }
  .rating-score .big{ font-family:'Fraunces'; font-weight:700; font-size:52px; color:#fff; }
  .stars{ display:flex; gap:3px; }
  .stars svg{ width:19px; height:19px; }
  .rating-sub{ font-size:13.5px; color:rgba(255,255,255,.6); margin-bottom:22px; }
  .review-line{
    display:flex; gap:12px; padding:14px 0; border-top:1px solid rgba(255,255,255,.1);
  }
  .review-line .avatar-sm{
    width:32px; height:32px; border-radius:50%; flex:none;
    background:var(--flame);
    display:flex; align-items:center; justify-content:center;
    font-family:'Fraunces'; font-size:13px; font-weight:700; color:#fff;
  }
  .review-line p{ font-size:13px; color:rgba(255,255,255,.72); }
  .review-line .stars svg{ width:12px; height:12px; }
  .rating-card .cta-link{
    margin-top:20px; display:flex; align-items:center; justify-content:center; gap:8px;
    width:100%; padding:13px; border-radius:10px; background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.18); color:#fff; font-size:14px; font-weight:600;
    transition:background .2s;
  }
  .rating-card .cta-link:hover{ background:rgba(255,255,255,.15); }

  /* trust strip */
  .trust-strip{ background:var(--cloud); border-bottom:1px solid var(--line); }
  .trust-strip .wrap{ display:grid; grid-template-columns:repeat(4,1fr); }
  .trust-item{ display:flex; gap:14px; align-items:flex-start; padding:32px 22px; border-right:1px solid var(--line); }
  .trust-item:last-child{ border-right:none; }
  @media(max-width:900px){ .trust-strip .wrap{ grid-template-columns:repeat(2,1fr);} .trust-item{ border-right:none; border-bottom:1px solid var(--line);} }
  .trust-item .icon{ width:40px; height:40px; flex:none; border-radius:10px; background:var(--navy); display:flex; align-items:center; justify-content:center;}
  .trust-item .icon svg{ width:19px; height:19px; stroke:#fff; }
  .trust-item h4{ font-family:'Inter'; font-weight:700; font-size:15.5px; color:var(--navy); margin-bottom:3px; }
  .trust-item p{ font-size:13px; color:var(--muted); }

  /* section head */
  .section-head{ max-width:700px; margin-bottom:72px; }
  .section-head h2{ font-size:clamp(32px,4.6vw,56px); margin-bottom:16px; letter-spacing:-0.03em; }
  .section-head p{ color:var(--muted); font-size:17px; line-height:1.65; max-width:600px; }
  @media(max-width:720px){ .section-head{ margin-bottom:48px; } }
  .section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }

  /* story / timeline */
  .story{ display:grid; grid-template-columns:.85fr 1.15fr; gap:60px; align-items:start; }
  @media(max-width:960px){ .story{ grid-template-columns:1fr; gap:30px; } }
  .story-copy p{ color:var(--muted); font-size:16px; margin-bottom:16px; }
  .story-copy strong{ color:var(--navy); }
  .founder-card{
    margin-top:26px; display:flex; gap:14px; align-items:center; padding:16px;
    background:var(--cloud); border-radius:14px; border:1px solid var(--line);
  }
  .founder-avatar{
    width:56px; height:56px; border-radius:50%; flex:none;
    /* Foto real de Eva recortada a la cara desde la miniatura de reseña
       (la cara está en la mitad izquierda de la imagen original). */
    background:#C9403A url("eva-querencia.jpg?v=2") center / cover no-repeat;
    box-shadow:inset 0 0 0 2px rgba(255,255,255,.55);
    font-size:0;
  }
  .founder-card h5{ font-family:'Inter'; font-size:14.5px; font-weight:700; color:var(--navy); }
  .founder-card span{ font-size:12.5px; color:var(--muted); }

  .timeline{ position:relative; padding-left:32px; }
  .timeline::before{ content:""; position:absolute; left:6px; top:6px; bottom:6px; width:2px; background:var(--line); }
  .t-item{ position:relative; padding-bottom:34px; }
  .t-item:last-child{ padding-bottom:0; }
  .t-item::before{
    content:""; position:absolute; left:-32px; top:2px; width:14px; height:14px; border-radius:50%;
    background:#fff; border:3px solid var(--flame);
  }
  .t-item .yr{ font-family:'IBM Plex Mono'; font-size:12.5px; color:var(--flame-deep); font-weight:600; margin-bottom:5px; display:block;}
  .t-item h4{ font-family:'Inter'; font-weight:700; font-size:17px; color:var(--navy); margin-bottom:5px; }
  .t-item p{ font-size:14px; color:var(--muted); }

  /* values */
  .values-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
  @media(max-width:980px){ .values-grid{ grid-template-columns:repeat(2,1fr);} }
  @media(max-width:560px){ .values-grid{ grid-template-columns:1fr;} }
  .value-card{ padding:30px 24px; border-radius:var(--radius); background:#fff; border:1px solid var(--line); transition:transform .25s var(--ease), box-shadow .25s var(--ease); }
  .value-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow); }
  .value-card .icon{ width:46px; height:46px; border-radius:12px; background:var(--flame); display:flex; align-items:center; justify-content:center; margin-bottom:18px;}
  .value-card .icon svg{ width:22px; height:22px; stroke:#fff; }
  .value-card h3{ font-family:'Inter'; font-weight:700; font-size:18px; margin-bottom:8px; color:var(--navy);}
  .value-card p{ font-size:13.8px; color:var(--muted); }

  /* reviews */
  .reviews{
    background:
      radial-gradient(60% 80% at 15% -10%, rgba(255,107,53,.12), transparent 55%),
      radial-gradient(50% 70% at 100% 110%, rgba(255,255,255,.05), transparent 60%),
      linear-gradient(180deg,#0E2238 0%, #0A1A2C 100%);
    color:#fff; position:relative; overflow:hidden;
  }
  .reviews .section-head p{ color:rgba(255,255,255,.65); }
  .reviews .section-head h2{ color:#fff; }
  .reviews-summary{
    display:flex; align-items:center; gap:26px; flex-wrap:wrap; margin-bottom:46px;
    padding:26px 30px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); border-radius:18px;
  }
  .reviews-summary .score{ font-family:'Fraunces'; font-weight:700; font-size:56px; }
  .reviews-summary .stars svg{ width:22px; height:22px; }
  .reviews-summary .meta{ font-size:13.5px; color:rgba(255,255,255,.6); }
  .reviews-summary .spacer{ flex:1; }
  .review-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
  @media(max-width:960px){ .review-grid{ grid-template-columns:1fr 1fr; } }
  @media(max-width:640px){ .review-grid{ grid-template-columns:1fr; } }
  .review-card{
    background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12);
    border-radius:16px; padding:24px; display:flex; flex-direction:column; gap:14px;
    transition:transform .25s var(--ease), background .25s;
  }
  .review-card:hover{ transform:translateY(-3px); background:rgba(255,255,255,.08); }
  .review-card .stars svg{ width:15px; height:15px; }
  .review-card p{ font-size:14.5px; color:rgba(255,255,255,.82); flex:1; }
  .review-card .who{ display:flex; align-items:center; gap:10px; }
  .review-card .avatar-sm{ width:34px; height:34px; border-radius:50%; background:var(--flame); display:flex; align-items:center; justify-content:center; font-family:'Fraunces'; font-weight:700; color:#fff; font-size:13px;}
  .review-card .who h5{ font-family:'Inter'; font-size:13.5px; font-weight:700; color:#fff; }
  .review-card .who span{ font-size:11.5px; color:rgba(255,255,255,.5); }
  .reviews-more{ margin-top:36px; text-align:center; }

  /* coverage */
  .coverage{ display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:center; }
  @media(max-width:900px){ .coverage{ grid-template-columns:1fr; gap:30px; } }
  .map-visual{
    aspect-ratio:4/3.4; border-radius:20px; position:relative; overflow:hidden;
    background:var(--cloud); border:1px solid var(--line);
  }
  .map-visual svg{ width:100%; height:100%; }
  .map-pin{ transform-origin:center bottom; animation:bounce 2.4s ease-in-out infinite; }
  @keyframes bounce{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-8px);} }
  @media (prefers-reduced-motion: reduce){ .map-pin{ animation:none; } }
  .areas-col ul{ display:flex; flex-wrap:wrap; gap:10px; margin-top:16px;}
  .areas-col li a{ display:inline-block; padding:9px 15px; border-radius:999px; border:1px solid var(--line); font-size:13.5px; color:var(--navy); transition:color .15s, background-color .15s, border-color .15s, transform .15s, box-shadow .15s;}
  .areas-col li a:hover{ background:var(--navy); color:#fff; border-color:var(--navy); }

  /* form */
  .contact{ background:var(--cloud); }
  .contact-grid{ display:grid; grid-template-columns:.85fr 1.15fr; gap:50px; }
  @media(max-width:960px){ .contact-grid{ grid-template-columns:1fr; gap:34px; } }
  .contact-info h2{ margin-bottom:14px; }
  .contact-info p{ color:var(--muted); font-size:16px; margin-bottom:26px; }
  .info-row{ display:flex; gap:14px; align-items:flex-start; margin-bottom:20px; }
  .info-row .icon{ width:38px; height:38px; flex:none; border-radius:10px; background:var(--navy); display:flex; align-items:center; justify-content:center;}
  .info-row .icon svg{ width:18px; height:18px; stroke:#fff; }
  .info-row h5{ font-size:14.5px; font-weight:700; color:var(--navy); margin-bottom:2px;}
  .info-row p{ font-size:13.8px; color:var(--muted); margin:0; }

  .form-card{
    background:#fff; border-radius:22px; border:1px solid var(--line); box-shadow:var(--shadow);
    padding:36px; position:relative; overflow:hidden;
  }
  .form-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
  @media(max-width:520px){ .form-row{ grid-template-columns:1fr; } }
  .field{ margin-bottom:18px; }
  .field label{ display:block; font-size:13px; font-weight:600; color:var(--navy); margin-bottom:7px; }
  .field input, .field select, .field textarea{
    width:100%; padding:13px 15px; border-radius:10px; border:1.5px solid var(--line);
    font-family:'Inter'; font-size:14.5px; color:var(--text); background:#fbfcfd;
    transition:border-color .2s, box-shadow .2s;
  }
  .field input:focus, .field select:focus, .field textarea:focus{
    outline:none; border-color:var(--flame); box-shadow:0 0 0 4px rgba(255,107,53,.14);
  }
  .field textarea{ resize:vertical; min-height:96px; }
  .field.error input, .field.error select, .field.error textarea{ border-color:var(--flame-deep); box-shadow:0 0 0 4px rgba(226,80,28,.1); }
  .field .err-msg{ font-size:12px; color:var(--flame-deep); margin-top:5px; display:none; }
  .field.error .err-msg{ display:block; }
  .radio-group{ display:flex; gap:10px; flex-wrap:wrap; }
  .radio-chip{
    padding:9px 16px; border-radius:999px; border:1.5px solid var(--line); font-size:13.5px; cursor:pointer;
    transition:color .15s, background-color .15s, border-color .15s, transform .15s, box-shadow .15s; user-select:none;
  }
  .radio-chip input{ display:none; }
  .radio-chip.active{ background:var(--navy); color:#fff; border-color:var(--navy); }
  .submit-btn{
    width:100%; padding:16px; border-radius:12px; border:none; background:var(--flame); color:#fff;
    font-weight:700; font-size:15.5px; display:flex; align-items:center; justify-content:center; gap:10px;
    transition:background .2s, transform .2s;
  }
  .submit-btn:hover{ background:var(--flame-deep); transform:translateY(-2px); }
  .submit-btn .spinner{
    width:16px; height:16px; border-radius:50%; border:2.5px solid rgba(255,255,255,.4); border-top-color:#fff;
    display:none; animation:spin .7s linear infinite;
  }
  .submit-btn.loading .spinner{ display:inline-block; }
  .submit-btn.loading .btn-text{ opacity:.7; }
  @keyframes spin{ to{ transform:rotate(360deg);} }
  .form-note{ font-size:12px; color:var(--muted); text-align:center; margin-top:14px; }

  .success-overlay{
    position:absolute; inset:0; background:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center;
    text-align:center; padding:40px; opacity:0; pointer-events:none; transform:scale(.96);
    transition:opacity .35s var(--ease), transform .35s var(--ease);
  }
  .success-overlay.show{ opacity:1; pointer-events:auto; transform:scale(1); }
  .success-check{
    width:64px; height:64px; border-radius:50%; background:var(--cloud); display:flex; align-items:center; justify-content:center; margin-bottom:20px;
  }
  .success-check svg{ width:30px; height:30px; stroke:var(--flame); stroke-width:2.6; }
  .success-overlay h3{ margin-bottom:8px; }
  .success-overlay p{ color:var(--muted); font-size:14.5px; max-width:320px; }

  /* final CTA — cierre oscuro dramático (naranja solo como glow, no como fondo) */
  .final-cta{
    background:
      radial-gradient(70% 120% at 50% 0%, rgba(255,107,53,.22), transparent 60%),
      linear-gradient(180deg,#0E1C2C 0%, #081422 100%);
    color:#fff; text-align:center;
  }
  .final-cta h2{ color:#fff; font-size:clamp(30px,4.4vw,52px); margin-bottom:14px; }
  .final-cta p{ color:rgba(255,255,255,.72); max-width:540px; margin:0 auto 30px; font-size:16.5px; }
  .final-cta .ctas{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

  /* footer */
  footer{ background:#081729; color:rgba(255,255,255,.65); padding:64px 0 30px; }
  .footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; margin-bottom:50px; }
  @media(max-width:820px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
  @media(max-width:560px){ .footer-grid{ grid-template-columns:1fr; } }
  .footer-grid h5{ color:#fff; font-family:'IBM Plex Mono'; font-size:12px; text-transform:uppercase; letter-spacing:.08em; margin-bottom:18px;}
  .footer-grid li{ margin-bottom:10px; font-size:14px; }
  .footer-grid li a:hover{ color:#fff; }
  .footer-logo{ margin-bottom:14px; height:35px; overflow:hidden; }
  .footer-logo img{ height:50px; width:auto; display:block; }
  .footer-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:14px; padding-top:26px; border-top:1px solid rgba(255,255,255,.1); font-size:12.5px; }
  .social-row{ display:flex; gap:10px; margin-top:16px; }
  .social-row a{ width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; transition:background .2s;}
  .social-row a:hover{ background:var(--flame); }
  .social-row a svg{ width:16px; height:16px; stroke:#fff; }

  /* whatsapp float */
  .wa-float{
    position:fixed; bottom:24px; right:24px; z-index:60; width:58px; height:58px; border-radius:50%;
    background:#25D366; display:flex; align-items:center; justify-content:center; box-shadow:0 10px 26px rgba(0,0,0,.28);
    transition:transform .2s; animation:pulse 2.6s ease-in-out infinite;
  }
  .wa-float:hover{ transform:scale(1.08); }
  .wa-float svg{ width:28px; height:28px; fill:#fff; }
  @keyframes pulse{ 0%,100%{ box-shadow:0 10px 26px rgba(0,0,0,.28), 0 0 0 0 rgba(37,211,102,.4);} 50%{ box-shadow:0 10px 26px rgba(0,0,0,.28), 0 0 0 10px rgba(37,211,102,0);} }
  @media (prefers-reduced-motion: reduce){ .wa-float{ animation:none; } }

  /* ---------- floating hero orbs (retirados: look premium sobrio, sin gradientes de colores flotando) ---------- */
  .hero-orb{ display:none; }
  .hero-orb-x{ position:absolute; border-radius:50%; filter:blur(50px); opacity:.55; pointer-events:none; z-index:0; }
  .orb-1{ width:340px; height:340px; background:radial-gradient(circle, rgba(58,166,217,.55), transparent 70%); top:-80px; right:-60px; animation:float1 13s ease-in-out infinite; }
  .orb-2{ width:260px; height:260px; background:radial-gradient(circle, rgba(255,107,53,.5), transparent 70%); bottom:-60px; left:10%; animation:float2 16s ease-in-out infinite; }
  .orb-3{ width:180px; height:180px; background:radial-gradient(circle, rgba(255,185,48,.4), transparent 70%); top:40%; left:60%; animation:float3 11s ease-in-out infinite; }
  @keyframes float1{ 0%,100%{ transform:translate(0,0) scale(1);} 50%{ transform:translate(-40px,30px) scale(1.1);} }
  @keyframes float2{ 0%,100%{ transform:translate(0,0) scale(1);} 50%{ transform:translate(30px,-25px) scale(1.15);} }
  @keyframes float3{ 0%,100%{ transform:translate(0,0);} 50%{ transform:translate(-25px,-20px);} }
  @media (prefers-reduced-motion: reduce){ .hero-orb{ animation:none; } }
  .hero .wrap{ position:relative; z-index:1; }

  /* ---------- marquee ticker ---------- */
  .marquee{
    background:var(--navy); overflow:hidden; white-space:nowrap; padding:16px 0;
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .marquee-track{ display:inline-flex; gap:0; animation:marquee 26s linear infinite; }
  .marquee:hover .marquee-track{ animation-play-state:paused; }
  .marquee-item{
    display:inline-flex; align-items:center; gap:12px; padding:0 34px;
    font-family:'IBM Plex Mono'; font-size:13.5px; letter-spacing:.05em; text-transform:uppercase;
    color:rgba(255,255,255,.75);
  }
  .marquee-item svg{ width:15px; height:15px; stroke:var(--flame); flex:none; }
  .marquee-item b{ color:#fff; }
  @keyframes marquee{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }
  @media (prefers-reduced-motion: reduce){ .marquee-track{ animation:none; } }

  /* ---------- productos destacados ---------- */
  .products-section{ position:relative; background:linear-gradient(180deg,#fff 0%, var(--cloud) 100%); }
  .product-grid3{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
  @media(max-width:980px){ .product-grid3{ grid-template-columns:1fr 1fr; } }
  @media(max-width:640px){ .product-grid3{ grid-template-columns:1fr; } }
  /* ============ Tarjeta de producto (glassmorphism, compacta, uniforme) ============ */
  .product-grid3{ align-items:stretch; }
  .p-card{
    position:relative; display:flex; flex-direction:column; overflow:hidden;
    background:rgba(255,255,255,.66);
    -webkit-backdrop-filter:blur(18px) saturate(1.5); backdrop-filter:blur(18px) saturate(1.5);
    border:1px solid rgba(255,255,255,.7); border-radius:20px;
    box-shadow:0 10px 34px rgba(14,34,56,.09), inset 0 1px 0 rgba(255,255,255,.6);
    transition:transform .3s var(--ease), box-shadow .3s var(--ease);
  }
  .p-card:hover{ transform:translateY(-3px); box-shadow:0 24px 54px rgba(14,34,56,.18), inset 0 1px 0 rgba(255,255,255,.75); }
  .p-card.best::before{ content:"M\00E1s vendido"; position:absolute; top:14px; left:14px; z-index:3;
    background:var(--flame); color:#fff; font-family:'IBM Plex Mono'; font-size:10.5px; font-weight:600;
    padding:5px 12px; border-radius:999px; letter-spacing:.04em; }

  /* Marco de imagen HOMOGENEO: misma altura, fondo blanco, foto contenida y centrada */
  .p-visual{
    display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;
    height:200px; background:#fff; border-bottom:1px solid rgba(14,34,56,.06); text-decoration:none;
  }
  .p-visual .shine{ position:absolute; top:0; left:-60%; width:40%; height:100%;
    background:linear-gradient(100deg, transparent, rgba(255,255,255,.6), transparent);
    transform:skewX(-18deg); animation:shineSweep 5s ease-in-out infinite; z-index:2; pointer-events:none; }
  @keyframes shineSweep{ 0%{ left:-60%; } 45%{ left:120%; } 100%{ left:120%; } }
  .p-visual svg{ width:60%; max-width:190px; position:relative; z-index:1; }
  .p-photo{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:22px; background:#fff; z-index:1; animation:photoIn .5s ease; }
  .breeze-line{ stroke-dasharray:6 10; animation:breeze 1.6s linear infinite; }
  .breeze-line.d2{ animation-delay:.25s; } .breeze-line.d3{ animation-delay:.5s; }
  @keyframes breeze{ to{ stroke-dashoffset:-32; } }
  @media (prefers-reduced-motion: reduce){ .breeze-line{ animation:none; } .p-visual .shine{ animation:none; } .p-photo{ animation:none; } }

  .p-body{ display:flex; flex-direction:column; flex:1; padding:16px 18px 18px; }
  .p-brand{ font-family:'IBM Plex Mono'; font-size:10.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.08em; font-weight:600; }
  .p-name{ display:block; font-family:'Inter'; font-weight:700; font-size:16px; color:var(--navy); margin:5px 0 9px; line-height:1.3; text-decoration:none; overflow-wrap:anywhere; }
  .p-name:hover{ color:var(--flame-deep); }
  .p-specs{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:10px; }
  .p-specs span{ font-size:11px; padding:4px 9px; border-radius:999px; background:rgba(14,34,56,.05); color:var(--muted); border:1px solid rgba(14,34,56,.06); }
  .p-specs .p-eff{ background:#EAF6EC; color:#1C7C3C; border-color:#CFE9D5; font-weight:600; }
  .p-ideal{ display:flex; gap:7px; align-items:flex-start; font-size:12px; color:var(--navy); line-height:1.4; margin-bottom:12px; }
  .p-ideal svg{ width:14px; height:14px; stroke:var(--flame-deep); flex:none; margin-top:1px; }

  .p-foot{ margin-top:auto; }
  .p-price-row{ display:flex; align-items:baseline; justify-content:space-between; gap:8px; padding-top:12px; border-top:1px dashed var(--line); }
  .p-price{ font-family:'Fraunces'; font-weight:700; font-size:23px; color:var(--flame-deep); }
  .p-iva{ font-family:'Inter'; font-weight:500; font-size:11px; color:var(--muted); }
  /* Píldora de financiación (tarjetas de la PORTADA: icono + texto) */
  .p-financing{ display:inline-flex; align-items:center; gap:6px; margin-top:10px; padding:6px 11px; background:var(--cloud); border-radius:999px; width:fit-content; font-size:11.5px; font-weight:600; color:var(--navy); }
  .p-financing svg{ width:13px; height:13px; stroke:var(--flame-deep); flex:none; }
  .p-financing strong{ color:var(--navy); font-family:'IBM Plex Mono'; white-space:nowrap; }
  /* Catálogo: financiación compacta dentro de la fila de precio (sin píldora) */
  .p-price-row .p-financing{ display:block; margin:0; padding:0; background:none; border-radius:0; width:auto; font-size:11px; font-weight:400; color:var(--muted); text-align:right; line-height:1.3; }
  .p-price-row .p-financing strong{ color:var(--navy); }
  .p-ficha-btn{ display:flex; align-items:center; justify-content:center; gap:7px; margin-top:12px; padding:11px; border-radius:11px;
    background:var(--navy); color:#fff; font-weight:600; font-size:13.5px; text-decoration:none; transition:background .2s, transform .15s; }
  .p-ficha-btn svg{ width:15px; height:15px; transition:transform .2s; }
  .p-ficha-btn:hover{ background:var(--navy-soft); }
  .p-ficha-btn:hover svg{ transform:translateX(3px); }
  .p-ficha-btn:active{ transform:scale(.98); }
  .p-actions{ display:flex; gap:8px; margin-top:8px; }
  .p-actions .p-wa{ flex:1; display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:9px; border-radius:10px;
    background:#25D366; color:#fff; font-weight:600; font-size:12.5px; text-decoration:none; transition:filter .2s, transform .15s; }
  .p-actions .p-wa svg{ width:15px; height:15px; fill:#fff; }
  .p-actions .p-wa:hover{ filter:brightness(.94); }
  .p-actions .p-compare{ flex:1; display:inline-flex; align-items:center; justify-content:center; gap:5px; padding:9px; border-radius:10px;
    border:1.3px solid var(--line); background:transparent; color:var(--navy); font-family:'Inter'; font-weight:600; font-size:12.5px; text-decoration:none; transition:border-color .2s, background .2s; }
  .p-actions .p-compare:hover{ border-color:var(--navy); }
  .p-actions .p-compare.active{ background:var(--navy); color:#fff; border-color:var(--navy); }
  .p-actions .p-wa:active, .p-actions .p-compare:active{ transform:scale(.97); }

  /* ---------- Tarjetas destacadas de la PORTADA (usan p-cta / p-rate) ---------- */
  .p-rate{ display:flex; align-items:center; gap:4px; font-size:12px; color:var(--muted); }
  .p-rate svg{ width:13px; height:13px; }
  .p-cta{ margin-top:auto; padding-top:14px; display:flex; gap:8px; }
  .p-cta a{ flex:1; text-align:center; padding:11px; border-radius:10px; font-size:13.5px; font-weight:600; text-decoration:none; transition:background .2s, border-color .2s, color .2s, transform .15s; }
  .p-cta .p-primary{ background:var(--navy); color:#fff; }
  .p-cta .p-primary:hover{ background:var(--navy-soft); transform:translateY(-2px); }
  .p-cta .p-secondary{ border:1.3px solid var(--line); color:var(--navy); }
  .p-cta .p-secondary:hover{ border-color:var(--navy); transform:translateY(-2px); }
  .p-cta a:active{ transform:scale(.97); }

  /* ---------- Conmutador de vista (filas / cuadr\00EDcula / cuadr\00EDcula x4) ---------- */
  .view-toggle{ display:flex; align-items:center; gap:5px; justify-content:flex-end; margin-bottom:16px; }
  .view-toggle .vt-label{ font-size:12px; color:var(--muted); margin-right:3px; font-weight:600; }
  .vt-btn{ display:inline-flex; align-items:center; justify-content:center; width:36px; height:32px; border-radius:9px;
    border:1.3px solid var(--line); background:#fff; color:var(--muted); cursor:pointer; transition:color .18s, background .18s, border-color .18s, transform .12s; }
  .vt-btn svg{ width:17px; height:17px; fill:currentColor; }
  .vt-btn:hover{ color:var(--navy); border-color:var(--navy-soft); }
  .vt-btn.active{ background:var(--navy); color:#fff; border-color:var(--navy); }
  .vt-btn:active{ transform:scale(.94); }

  /* ---------- Vistas ---------- */
  #catalogRoot.view-grid4 .product-grid3{ grid-template-columns:repeat(4, 1fr); gap:18px; }
  @media(max-width:1100px){ #catalogRoot.view-grid4 .product-grid3{ grid-template-columns:repeat(3,1fr); } }
  @media(max-width:820px){ #catalogRoot.view-grid4 .product-grid3{ grid-template-columns:repeat(2,1fr); } }
  #catalogRoot.view-grid4 .p-visual{ height:150px; }
  #catalogRoot.view-grid4 .p-name{ font-size:14.5px; }
  #catalogRoot.view-grid4 .p-price{ font-size:20px; }
  #catalogRoot.view-grid4 .p-body{ padding:13px 14px 15px; }
  #catalogRoot.view-grid4 .p-photo{ padding:16px; }

  #catalogRoot.view-rows .product-grid3{ grid-template-columns:1fr; gap:14px; }
  #catalogRoot.view-rows .p-card{ flex-direction:row; }
  #catalogRoot.view-rows .p-visual{ width:230px; height:auto; min-height:190px; flex:none; border-bottom:none; border-right:1px solid rgba(14,34,56,.06); }
  #catalogRoot.view-rows .p-body{ flex:1; }
  @media(max-width:640px){
    #catalogRoot.view-rows .p-card{ flex-direction:column; }
    #catalogRoot.view-rows .p-visual{ width:auto; border-right:none; border-bottom:1px solid rgba(14,34,56,.06); }
  }

    .products-note{ margin-top:26px; font-size:12.5px; color:var(--muted); text-align:center; }

  /* ---------- magnetic buttons ---------- */
  .magnetic{ position:relative; }

  /* ---------- success sparkles ---------- */
  .sparkle{
    position:absolute; width:8px; height:8px; border-radius:50%; background:var(--flame); pointer-events:none;
    animation:sparkleFly .9s ease-out forwards;
  }
  @keyframes sparkleFly{
    to{ transform:translate(var(--sx), var(--sy)) scale(0); opacity:0; }
  }

  /* ---------- breadcrumb + page hero tweaks ---------- */
  .breadcrumb{ font-family:'IBM Plex Mono'; font-size:12px; color:rgba(255,255,255,.55); margin-bottom:10px; }
  .breadcrumb a:hover{ color:#fff; }
  .page-hero p.lead{ margin-bottom:0; }

  /* ---------- install info banner ---------- */
  .install-banner{ background:var(--cloud); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .install-banner .wrap{ display:flex; gap:18px; align-items:flex-start; padding:28px; }
  .install-banner .icon{ width:44px; height:44px; flex:none; border-radius:12px; background:var(--navy); display:flex; align-items:center; justify-content:center; }
  .install-banner .icon svg{ width:20px; height:20px; stroke:#fff; }
  .install-banner h4{ font-family:'Inter'; font-weight:700; font-size:16px; color:var(--navy); margin-bottom:4px; }
  .install-banner p{ font-size:14px; color:var(--muted); margin:0; }

  /* ---------- filter bar ---------- */
  .filter-bar{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:40px; }
  .filter-btn{
    padding:11px 20px; border-radius:999px; border:1.5px solid var(--line); background:#fff;
    font-family:'Inter'; font-weight:600; font-size:13.8px; color:var(--muted); cursor:pointer;
    display:inline-flex; align-items:center; gap:7px; transition:color .18s, background-color .18s, border-color .18s, transform .18s, box-shadow .18s;
  }
  .filter-btn svg{ width:15px; height:15px; stroke:currentColor; }
  .filter-btn:hover{ border-color:var(--navy); color:var(--navy); }
  .filter-btn.active{ background:var(--navy); border-color:var(--navy); color:#fff; }

  /* ---------- catalog root + brand groups ---------- */
  #catalogRoot{ transition:opacity .22s ease, transform .22s ease; }
  #catalogRoot.fade-out{ opacity:0; transform:translateY(10px); }
  .brand-group{ margin-bottom:52px; }
  .brand-group:last-child{ margin-bottom:0; }
  .brand-title{
    display:flex; align-items:center; gap:12px; font-family:'Fraunces'; font-weight:600; font-size:25px;
    color:var(--navy); margin-bottom:22px; padding-bottom:14px; border-bottom:2px solid var(--line);
  }
  .brand-title .count{
    font-family:'IBM Plex Mono'; font-size:11.5px; color:var(--muted); font-weight:500;
    background:var(--cloud); padding:4px 11px; border-radius:999px; border:1px solid var(--line);
  }

  /* ---------- extra costs box ---------- */
  .extra-costs .box{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:32px; display:flex; gap:22px; align-items:flex-start; }
  .extra-costs .icon{ width:48px; height:48px; flex:none; border-radius:12px; background:var(--flame); display:flex; align-items:center; justify-content:center; }
  .extra-costs .icon svg{ width:23px; height:23px; stroke:#fff; }
  .extra-costs h3{ font-size:22px; margin-bottom:8px; }
  .extra-costs p{ font-size:14.5px; color:var(--muted); margin-bottom:6px; }
  .extra-costs .price-tag{ font-family:'IBM Plex Mono'; color:var(--flame-deep); font-weight:600; }

/* ============================================================
   BUSCADOR GLOBAL + BÚSQUEDA EN CATÁLOGO + CALCULADORA
   ============================================================ */
.search-btn, .theme-btn{
  width:40px; height:40px; padding:0; border-radius:10px; border:1.5px solid var(--line); background:#fff;
  display:inline-flex; align-items:center; justify-content:center; cursor:pointer; color:var(--navy);
  transition:color .2s, background-color .2s, border-color .2s, transform .2s, box-shadow .2s; flex:none;
}
#siteHeader:not(.scrolled) .search-btn, #siteHeader:not(.scrolled) .theme-btn{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.25); color:#fff; }
.search-btn:hover, .theme-btn:hover{ transform:translateY(-1px); border-color:var(--flame); color:var(--flame); }
.search-btn svg{ width:17px; height:17px; stroke:currentColor; fill:none; stroke-width:2.2; stroke-linecap:round; }
/* El botón de tema enseña la luna en modo claro y el sol en modo oscuro */
.theme-btn .ico-sun{ display:none; }
[data-theme="dark"] .theme-btn .ico-sun{ display:block; }
[data-theme="dark"] .theme-btn .ico-moon{ display:none; }

.search-overlay{
  position:fixed; top:0; left:0; right:0; z-index:300; background:#fff; box-shadow:0 24px 60px rgba(14,34,56,.25);
  transform:translateY(-110%); transition:transform .35s cubic-bezier(.4,0,.2,1); padding:18px 0 8px;
}
.search-overlay.open{ transform:translateY(0); }
.search-box{ display:flex; align-items:center; gap:12px; border:2px solid var(--line); border-radius:13px; padding:0 16px; transition:border-color .25s; }
.search-box:focus-within{ border-color:var(--flame); }
.search-box svg{ width:19px; height:19px; stroke:var(--muted); fill:none; stroke-width:2.2; stroke-linecap:round; flex:none; }
.search-box input{ flex:1; border:none; outline:none; padding:15px 0; font-family:'Inter'; font-size:16px; color:var(--navy); background:transparent; }
.search-close{ background:none; border:none; cursor:pointer; color:var(--muted); font-size:13px; font-family:'IBM Plex Mono'; padding:6px; }
.search-close:hover{ color:var(--navy); }
.search-results{ max-height:min(52vh, 420px); overflow-y:auto; margin-top:6px; }
.search-result{
  display:flex; align-items:center; gap:14px; width:100%; text-align:left; background:none; border:none;
  padding:13px 10px; border-radius:11px; cursor:pointer; transition:background .15s; text-decoration:none;
}
.search-result:hover{ background:var(--cloud); }
.search-result .sr-icon{
  width:38px; height:38px; border-radius:10px; background:var(--cloud); display:flex; align-items:center;
  justify-content:center; flex:none;
}
.search-result .sr-icon svg{ width:18px; height:18px; stroke:var(--flame-deep); fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.search-result .sr-info{ flex:1; min-width:0; }
.search-result .sr-name{ font-weight:600; font-size:14.5px; color:var(--navy); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.search-result .sr-meta{ font-family:'IBM Plex Mono'; font-size:11px; color:var(--muted); margin-top:2px; }
.search-result .sr-price{ font-family:'IBM Plex Mono'; font-weight:600; font-size:14px; color:var(--navy); white-space:nowrap; }
.search-empty{ padding:18px 10px; font-size:14px; color:var(--muted); text-align:center; }
.search-backdrop{ position:fixed; inset:0; background:rgba(14,34,56,.4); z-index:290; opacity:0; visibility:hidden; transition:opacity .3s, visibility .3s; }
.search-backdrop.open{ opacity:1; visibility:visible; }

.catalog-search{
  display:flex; align-items:center; gap:12px; background:#fff; border:2px solid var(--line); border-radius:13px;
  padding:0 16px; margin-bottom:18px; transition:border-color .25s;
}
.catalog-search:focus-within{ border-color:var(--flame); }
.catalog-search svg{ width:18px; height:18px; stroke:var(--muted); fill:none; stroke-width:2.2; stroke-linecap:round; flex:none; }
.catalog-search input{ flex:1; border:none; outline:none; padding:14px 0; font-family:'Inter'; font-size:15px; color:var(--navy); background:transparent; }
.no-results{ text-align:center; padding:44px 20px; color:var(--muted); font-size:15px; }

.p-card.highlight{ animation:cardHighlight 2.2s ease; }
@keyframes cardHighlight{
  0%, 60%{ box-shadow:0 0 0 3px var(--flame), 0 18px 44px rgba(255,107,53,.3); }
  100%{ box-shadow:none; }
}

/* --------------------- Calculadora --------------------- */
.calc-tabs{ display:flex; gap:10px; margin-bottom:26px; flex-wrap:wrap; }
.calc-tab{
  display:inline-flex; align-items:center; gap:9px; padding:13px 26px; border-radius:999px; cursor:pointer;
  border:1.5px solid var(--line); background:#fff; font-family:'Inter'; font-weight:600; font-size:15px;
  color:var(--muted); transition:color .25s, background-color .25s, border-color .25s, transform .25s, box-shadow .25s;
}
.calc-tab svg{ width:17px; height:17px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.calc-tab:hover{ border-color:var(--flame); color:var(--flame-deep); transform:translateY(-1px); }
.calc-tab.active{ background:var(--navy); border-color:var(--navy); color:#fff; }
.calc-panel{ display:none; }
.calc-panel.active{ display:block; animation:fadeUp .45s ease both; }
@keyframes fadeUp{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }
.calc-grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:28px; align-items:start; }
@media(max-width:860px){ .calc-grid{ grid-template-columns:1fr; } }
.calc-card{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:28px; box-shadow:0 10px 30px rgba(14,34,56,.06); }
.calc-card h3{ font-size:19px; margin-bottom:18px; }
.calc-field{ margin-bottom:20px; }
.calc-field label{ display:block; font-weight:600; font-size:14px; margin-bottom:8px; }
.calc-field .value-badge{ font-family:'IBM Plex Mono'; font-weight:600; color:var(--flame-deep); }
.calc-field input[type="range"]{ width:100%; accent-color:var(--flame); height:6px; cursor:pointer; }
.calc-choices{ display:flex; gap:9px; flex-wrap:wrap; }
.calc-choice{
  padding:11px 20px; border-radius:11px; border:1.5px solid var(--line); background:#fff; cursor:pointer;
  font-family:'Inter'; font-weight:600; font-size:14px; color:var(--muted); transition:color .2s, background-color .2s, border-color .2s, transform .2s, box-shadow .2s;
}
.calc-choice:hover{ border-color:var(--flame); color:var(--flame-deep); }
.calc-choice.active{ background:var(--flame); border-color:var(--flame); color:#fff; box-shadow:0 6px 16px rgba(255,107,53,.3); }
.calc-result{ opacity:0; transform:translateY(16px); transition:opacity .5s ease, transform .5s ease; }
.calc-result.show{ opacity:1; transform:none; }
.power-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:18px; }
.power-box{ background:var(--cloud); border-radius:13px; padding:18px; text-align:center; }
.power-box .pw-label{ font-family:'IBM Plex Mono'; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.power-box .pw-value{ font-family:'Fraunces',serif; font-size:30px; font-weight:700; color:var(--navy); margin-top:6px; }
.power-box .pw-value small{ font-size:15px; font-family:'IBM Plex Mono'; font-weight:600; }
.power-box.rec{ background:linear-gradient(135deg, #FFF3EB, #FFE9DC); border:1px solid #FFD9C2; }
.power-box.rec .pw-value{ color:var(--flame-deep); }
.reco-card{
  border:2px solid var(--flame); border-radius:15px; padding:20px; position:relative; background:#fff;
  box-shadow:0 14px 34px rgba(255,107,53,.15); margin-bottom:12px;
}
.reco-card .reco-tag{
  position:absolute; top:-11px; left:18px; background:var(--flame); color:#fff; font-family:'IBM Plex Mono';
  font-size:10px; font-weight:600; letter-spacing:.08em; padding:4px 12px; border-radius:999px;
}
.reco-card .reco-name{ font-weight:700; font-size:16.5px; margin:6px 0 2px; }
.reco-card .reco-brand{ font-family:'IBM Plex Mono'; font-size:11px; color:var(--muted); }
.reco-card .reco-price{ font-family:'IBM Plex Mono'; font-weight:600; font-size:19px; margin-top:10px; }
.reco-card .reco-why{ font-size:13px; color:var(--muted); margin-top:8px; line-height:1.55; }
.reco-actions{ display:flex; gap:10px; margin-top:14px; flex-wrap:wrap; }
.alt-row{
  display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 16px;
  border:1px solid var(--line); border-radius:12px; margin-bottom:9px; background:#fff; text-decoration:none;
  transition:border-color .2s, transform .2s;
}
.alt-row:hover{ border-color:var(--navy); transform:translateX(3px); }
.alt-row .alt-name{ font-weight:600; font-size:13.5px; color:var(--navy); }
.alt-row .alt-price{ font-family:'IBM Plex Mono'; font-weight:600; font-size:14px; color:var(--navy); white-space:nowrap; }
.calc-note{ font-size:12.5px; color:var(--muted); line-height:1.6; margin-top:16px; padding-top:14px; border-top:1px dashed var(--line); }

/* Subfiltros desplegables (Tipo / Baños) */
.sub-filter-bar{
  display:flex; gap:9px; flex-wrap:wrap; overflow:hidden; max-height:0; opacity:0;
  transition:max-height .4s cubic-bezier(.4,0,.2,1), opacity .3s, margin .3s; margin-bottom:0;
}
.sub-filter-bar.open{ max-height:120px; opacity:1; margin-bottom:18px; }
.sub-chip{
  padding:9px 18px; border-radius:999px; border:1.5px solid var(--line); background:#fff; cursor:pointer;
  font-family:'Inter'; font-weight:600; font-size:13px; color:var(--muted); transition:color .2s, background-color .2s, border-color .2s, transform .2s, box-shadow .2s;
}
.sub-chip:hover{ border-color:var(--navy); color:var(--navy); }
.sub-chip.active{ background:var(--navy); border-color:var(--navy); color:#fff; box-shadow:0 5px 14px rgba(14,34,56,.22); }

/* Botón WhatsApp por producto */
.p-wa{
  display:flex; align-items:center; justify-content:center; gap:8px; width:100%; margin-top:12px;
  padding:12px; border-radius:11px; border:none; cursor:pointer; text-decoration:none;
  background:#25D366; color:#fff; font-family:'Inter'; font-weight:600; font-size:14px;
  transition:transform .2s, box-shadow .2s, background .2s; box-shadow:0 6px 16px rgba(37,211,102,.3);
}
.p-wa:hover{ background:#1EBE5A; transform:translateY(-2px); box-shadow:0 10px 22px rgba(37,211,102,.35); }
.p-wa svg{ width:17px; height:17px; fill:#fff; flex:none; }

/* Selector de comparación en tarjeta */
.p-compare{
  display:flex; align-items:center; justify-content:center; gap:7px; width:100%; margin-top:8px;
  padding:10px; border-radius:10px; cursor:pointer; background:#fff; color:var(--muted);
  border:1.5px dashed var(--line); font-family:'Inter'; font-weight:600; font-size:13px; transition:color .2s, background-color .2s, border-color .2s, transform .2s, box-shadow .2s;
}
.p-compare:hover{ border-color:var(--ice); color:var(--navy); }
.p-compare.selected{ border-style:solid; border-color:var(--ice); background:#EAF5FB; color:#1E7FAE; }
.p-card.comparing{ outline:2.5px solid var(--ice); outline-offset:-2.5px; }

/* Barra flotante de comparación */
.compare-bar{
  position:fixed; bottom:24px; left:50%; transform:translate(-50%, 90px); z-index:80;
  display:flex; align-items:center; gap:12px; background:var(--navy); color:#fff;
  padding:11px 14px 11px 22px; border-radius:999px; box-shadow:0 16px 40px rgba(14,34,56,.4);
  transition:transform .4s cubic-bezier(.22,1,.36,1);
}
.compare-bar.show{ transform:translate(-50%, 0); }
.compare-bar .cb-label{ font-size:14px; font-weight:600; }
.compare-bar .cb-clear{ background:none; border:none; color:rgba(255,255,255,.65); font-size:12.5px; cursor:pointer; font-family:'Inter'; }
.compare-bar .cb-clear:hover{ color:#fff; }

/* Modal comparador */
.compare-modal{
  position:fixed; inset:0; z-index:400; display:none; align-items:flex-start; justify-content:center;
  background:rgba(14,34,56,.55); padding:4vh 16px; overflow-y:auto;
}
.compare-modal.open{ display:flex; }
.compare-sheet{
  background:#fff; border-radius:18px; max-width:960px; width:100%; padding:28px;
  animation:cardIn .4s cubic-bezier(.22,1,.36,1) both; position:relative;
}
@keyframes cardIn{ from{ opacity:0; transform:translateY(24px) scale(.98); } to{ opacity:1; transform:none; } }
.compare-close{
  position:absolute; top:16px; right:16px; width:36px; height:36px; border-radius:10px; border:1.5px solid var(--line);
  background:#fff; cursor:pointer; color:var(--muted); font-size:17px; line-height:1;
}
.compare-close:hover{ color:var(--navy); border-color:var(--muted); }
.compare-grid{ display:grid; gap:16px; margin-top:18px; }
.compare-grid.cols-2{ grid-template-columns:repeat(2, 1fr); }
.compare-grid.cols-3{ grid-template-columns:repeat(3, 1fr); }
@media(max-width:760px){ .compare-grid.cols-2, .compare-grid.cols-3{ grid-template-columns:1fr; } }
.cmp-col{ border:1px solid var(--line); border-radius:14px; padding:18px; }
.cmp-col.best-cmp{ border-color:var(--flame); box-shadow:0 10px 26px rgba(255,107,53,.14); }
.cmp-brand{ font-family:'IBM Plex Mono'; font-size:11px; color:var(--muted); }
.cmp-name{ font-weight:700; font-size:15.5px; margin:4px 0 8px; min-height:44px; }
.cmp-price{ font-family:'IBM Plex Mono'; font-weight:600; font-size:20px; color:var(--navy); }
.cmp-block{ margin-top:14px; padding-top:12px; border-top:1px dashed var(--line); }
.cmp-block h6{ font-family:'IBM Plex Mono'; font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-bottom:7px; }
.cmp-block p{ font-size:13px; color:var(--muted); line-height:1.55; }
.cmp-block ul{ list-style:none; padding:0; }
.cmp-block li{ font-size:12.5px; color:var(--muted); padding:3px 0 3px 20px; position:relative; }
.cmp-block li::before{ content:"✓"; position:absolute; left:2px; color:var(--flame-deep); font-weight:700; }
.cmp-actions{ display:flex; flex-direction:column; gap:8px; margin-top:14px; }

/* Sección subvenciones (index) */
.subv-cards{ display:grid; grid-template-columns:repeat(3, 1fr); gap:18px; margin-top:30px; }
@media(max-width:820px){ .subv-cards{ grid-template-columns:1fr; } }
.subv-card{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:24px; transition:transform .25s, box-shadow .25s; }
.subv-card:hover{ transform:translateY(-3px); box-shadow:0 14px 32px rgba(14,34,56,.09); }
.subv-card .num{ font-family:'Fraunces',serif; font-size:26px; font-weight:700; color:var(--flame); }
.subv-card h4{ font-family:'Inter'; font-weight:700; font-size:15.5px; margin:8px 0 6px; }
.subv-card p{ font-size:13.5px; color:var(--muted); line-height:1.6; }

/* Eficiencia energética + aviso instalación de equipo propio */
.p-eff{
  background:#E7F7EE !important; color:#1E9E5A !important; border:1px solid #BFE8D0;
  font-weight:700 !important;
}
.owner-note{
  display:flex; align-items:center; gap:14px; background:linear-gradient(135deg, #FFF3EB, #FFE9DC);
  border:1px solid #FFD9C2; border-radius:13px; padding:16px 18px; margin-bottom:18px;
  font-size:14px; color:var(--navy); line-height:1.55;
}
.owner-note svg{ flex:none; color:var(--flame-deep); }

/* Tarjetas de guías (blog propio) */
.guide-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:22px; }
@media(max-width:960px){ .guide-grid{ grid-template-columns:repeat(2, 1fr); } }
@media(max-width:620px){ .guide-grid{ grid-template-columns:1fr; } }
.guide-card{
  display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:15px;
  overflow:hidden; text-decoration:none; color:var(--navy); transition:transform .25s, box-shadow .25s;
}
.guide-card:hover{ transform:translateY(-3px); box-shadow:0 16px 38px rgba(14,34,56,.12); }
.guide-img{ aspect-ratio:16/9; width:100%; object-fit:cover; background:var(--cloud); }
.guide-body{ padding:16px 18px 18px; display:flex; flex-direction:column; gap:9px; flex:1; }
.guide-meta{ display:flex; align-items:center; gap:10px; }
.guide-tag{ font-family:'IBM Plex Mono'; font-size:10px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; padding:4px 10px; border-radius:999px; }
.guide-tag.caldera{ background:#FFF3E8; color:var(--flame-deep); }
.guide-tag.aire{ background:#EAF5FB; color:#1E7FAE; }
.guide-tag.aerotermia{ background:#E7F7EE; color:#1E9E5A; }
.guide-min{ font-family:'IBM Plex Mono'; font-size:10.5px; color:var(--muted); }
.guide-title{ font-weight:700; font-size:15px; line-height:1.4; flex:1; }
.guide-link{ font-size:13px; font-weight:600; color:var(--flame-deep); }

/* Página legal */
.legal-toc{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:34px; }
.legal-toc a{
  padding:10px 20px; border-radius:999px; border:1.5px solid var(--line); background:#fff;
  font-weight:600; font-size:13.5px; color:var(--muted); text-decoration:none; transition:color .2s, background-color .2s, border-color .2s, transform .2s, box-shadow .2s;
}
.legal-toc a:hover{ border-color:var(--flame); color:var(--flame-deep); }
.legal-prose{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:34px 32px; margin-bottom:24px; scroll-margin-top:110px; }
.legal-prose h2{ font-size:24px; margin-bottom:16px; }
.legal-prose h3{ font-family:'Inter'; font-weight:700; font-size:15.5px; margin:22px 0 8px; }
.legal-prose p{ font-size:14.5px; color:var(--muted); line-height:1.75; margin-bottom:10px; }
.legal-prose ul{ margin:10px 0 10px 20px; }
.legal-prose li{ font-size:14.5px; color:var(--muted); line-height:1.75; margin-bottom:5px; }
.legal-prose a{ color:var(--flame-deep); font-weight:600; }
.consent-row{ display:flex; align-items:flex-start; gap:10px; margin:16px 0 4px; font-size:13px; color:var(--muted); line-height:1.5; }
.consent-row input{ width:17px; height:17px; margin-top:1px; accent-color:var(--flame); flex:none; }
.consent-row.error{ color:var(--err); }
.consent-row a{ color:var(--flame-deep); font-weight:600; }

.consent-row.shake, .shake{ animation:consentShake .5s ease; }
@keyframes consentShake{
  0%,100%{ transform:translateX(0); }
  20%,60%{ transform:translateX(-6px); }
  40%,80%{ transform:translateX(6px); }
}

/* Foto real de producto (sobre la ilustración de respaldo) */
.p-visual{ position:relative; }
.p-photo{
  position:absolute; inset:0; width:100%; height:100%; object-fit:contain;
  background:#fff; padding:14px; border-radius:inherit;
  z-index:2; /* por encima de la ilustración SVG (que tiene z-index:1) */
}

/* ============ Presupuesto instantáneo ============ */
.budget-modal{
  position:fixed; inset:0; z-index:400; display:none; align-items:flex-start; justify-content:center;
  background:rgba(14,34,56,.55); padding:4vh 16px; overflow-y:auto;
}
.budget-modal.open{ display:flex; }
.budget-sheet{
  background:#fff; border-radius:18px; max-width:640px; width:100%; padding:32px 30px;
  animation:cardIn .4s cubic-bezier(.22,1,.36,1) both; position:relative;
}
.budget-close{
  position:absolute; top:16px; right:16px; width:36px; height:36px; border-radius:10px;
  border:1.5px solid var(--line); background:#fff; cursor:pointer; color:var(--muted); font-size:17px;
}
.budget-close:hover{ color:var(--navy); border-color:var(--muted); }
.budget-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:6px; }
.budget-head h3{ font-size:23px; }
.budget-ref{ font-family:'IBM Plex Mono'; font-size:11px; color:var(--muted); text-align:right; line-height:1.6; }
.budget-name-field{ margin:14px 0 4px; }
.budget-name-field input{
  width:100%; padding:11px 14px; border:1.5px dashed var(--line); border-radius:10px;
  font-family:'Inter'; font-size:14px; color:var(--navy);
}
.budget-name-field input:focus{ outline:none; border-color:var(--flame); border-style:solid; }
.budget-lines{ margin:16px 0; }
.budget-line{
  display:flex; justify-content:space-between; gap:14px; padding:11px 2px; font-size:14px;
  border-bottom:1px dashed var(--line); color:var(--muted);
}
.budget-line strong{ color:var(--navy); }
.budget-line .amt{ font-family:'IBM Plex Mono'; font-weight:600; color:var(--navy); white-space:nowrap; }
.budget-line.total{ border-bottom:2px solid var(--navy); }
.budget-line.total .amt{ font-size:19px; color:var(--flame-deep); }
.budget-extras{
  background:#FFF8F0; border:1.5px solid #FFD9A8; border-radius:12px; padding:14px 16px;
  font-size:13px; color:#8A5A16; line-height:1.6; margin:14px 0;
}
.budget-extras strong{ color:#6E4408; }
.budget-fin{ background:var(--cloud); border-radius:12px; padding:14px 16px; margin-bottom:14px; }
.budget-fin h6{ font-family:'IBM Plex Mono'; font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-bottom:10px; }
.budget-fin-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.budget-fin-box{ background:#fff; border:1px solid var(--line); border-radius:10px; padding:10px; text-align:center; }
.budget-fin-box .cuota{ font-family:'Fraunces',serif; font-weight:700; font-size:18px; color:var(--navy); }
.budget-fin-box .meses{ font-family:'IBM Plex Mono'; font-size:10px; color:var(--muted); }
.budget-foot{ font-size:11.5px; color:var(--muted); line-height:1.6; margin:12px 0 16px; }
.budget-actions{ display:flex; gap:10px; flex-wrap:wrap; }
.budget-actions .btn{ flex:1; min-width:150px; }
/* El modal es blanco: el btn-ghost (blanco sobre oscuro) era invisible aquí */
.budget-actions .btn-ghost{ border-color:var(--navy); color:var(--navy); }
.budget-actions .btn-ghost:hover{ background:rgba(14,34,56,.07); }
@media(max-width:520px){ .budget-fin-row{ grid-template-columns:1fr; } }

@media print{
  body > *{ display:none !important; }
  .budget-modal{ display:block !important; position:static; background:#fff; padding:0; }
  .budget-sheet{ box-shadow:none; border-radius:0; max-width:100%; animation:none; }
  .budget-close, .budget-actions, .budget-name-field p{ display:none !important; }
  .budget-name-field input{ border:none; padding:0; font-weight:700; }
}

/* ============ Artículos del blog (migrados) ============ */
.article-hero{
  background:linear-gradient(160deg, #0E2238 0%, #12293F 100%); color:#fff;
  padding:150px 0 54px; position:relative; overflow:hidden;
}
.article-hero .breadcrumb{ font-family:'IBM Plex Mono'; font-size:11px; color:rgba(255,255,255,.55); }
.article-hero .breadcrumb a{ color:rgba(255,255,255,.75); text-decoration:none; }
.article-hero .breadcrumb a:hover{ color:#fff; }
.article-hero h1{ font-size:clamp(26px, 4vw, 40px); line-height:1.2; max-width:820px; margin-top:4px; }
.article-hero .wrap{ max-width:900px; }
.article-meta{ margin-top:14px; font-family:'IBM Plex Mono'; font-size:11.5px; color:rgba(255,255,255,.6); }

.article-prose{ padding:50px 0 30px; }
.article-prose .wrap{ max-width:760px; }
.article-prose h2{ font-size:25px; margin:36px 0 14px; }
.article-prose h3{ font-size:19px; margin:28px 0 10px; }
.article-prose h4{ font-family:'Inter'; font-weight:700; font-size:16px; margin:22px 0 8px; }
.article-prose p{ font-size:16px; color:#3D4C5C; line-height:1.85; margin-bottom:16px; }
.article-prose a{ color:#C2410C; font-weight:600; }
.article-prose ul, .article-prose ol{ margin:14px 0 18px 24px; }
.article-prose li{ font-size:15.5px; color:#3D4C5C; line-height:1.8; margin-bottom:7px; }
.article-prose img{
  max-width:100%; height:auto; border-radius:14px; margin:22px auto; display:block;
  box-shadow:0 14px 34px rgba(14,34,56,.12);
}
.article-prose figure{ margin:22px 0; }
.article-prose figcaption{ text-align:center; font-size:12.5px; color:var(--muted); margin-top:8px; }
.article-prose blockquote{
  border-left:4px solid var(--flame); background:var(--cloud); padding:16px 20px;
  border-radius:0 12px 12px 0; margin:20px 0; font-style:italic; color:#3D4C5C;
}
.article-prose table{ width:100%; border-collapse:collapse; margin:20px 0; font-size:14px; }
.article-prose th{ background:var(--navy); color:#fff; padding:10px 12px; text-align:left; font-size:12.5px; }
.article-prose td{ padding:10px 12px; border-bottom:1px solid var(--line); color:#3D4C5C; }
.article-prose iframe{ max-width:100%; border-radius:14px; }

/* Trampa anti-bots: invisible para personas, rellenable por robots */
.hp-field{
  position:absolute !important; left:-9999px !important; top:auto !important;
  width:1px !important; height:1px !important; overflow:hidden !important;
}

/* ---- Menú: página activa (aria-current lo pone Base.astro) ---- */
.main-nav a[aria-current="page"] { color: var(--flame); font-weight: 700; }
.mobile-nav a[aria-current="page"] { color: var(--flame); }

/* ---- Honeypot anti-spam del formulario: invisible para humanos ---- */
.hp-field { position: absolute !important; left: -9999px !important; top: -9999px !important; height: 0; overflow: hidden; }

/* ================================================================
   Retoques estéticos (v24): foto de producto animada, subrayado
   del menú, selección de texto y foco visible de marca
   ================================================================ */

/* La foto real aparece con un fundido y hace un zoom sutil al pasar */
.p-photo{ animation:photoIn .55s ease; transition:transform .4s cubic-bezier(.2,.7,.3,1); }
@keyframes photoIn{ from{ opacity:0; transform:scale(.97); } }
.p-card:hover .p-photo{ transform:scale(1.05); }

/* Subrayado animado del menú de escritorio (y fijo en la página activa) */
nav.main-nav a::after{
  content:""; position:absolute; left:0; right:100%; bottom:-5px; height:2px;
  background:var(--flame); border-radius:2px; transition:right .25s ease;
}
nav.main-nav a:hover::after,
nav.main-nav a[aria-current="page"]::after{ right:0; }

/* Selección de texto y foco de teclado con el color de marca */
::selection{ background:var(--flame); color:#fff; }
:focus-visible{ outline:2px solid var(--flame); outline-offset:2px; border-radius:3px; }

@media (prefers-reduced-motion: reduce){
  .p-photo{ animation:none; }
  .p-card:hover .p-photo{ transform:none; }
  nav.main-nav a::after{ transition:none; }
}

/* ================================================================
   v26 — Fichas de producto, comparador de ahorro, FAQ y mini-CRM
   ================================================================ */

/* ---- Ficha individual de producto (producto/<slug>.html) ---- */
.prod-layout{ display:grid; grid-template-columns:minmax(280px,460px) 1fr; gap:44px; align-items:start; }
@media (max-width: 860px){ .prod-layout{ grid-template-columns:1fr; } }
.prod-media{ position:relative; background:#fff; border:1px solid var(--line); border-radius:18px; padding:26px; }
.prod-media img{ width:100%; height:auto; max-height:420px; object-fit:contain; display:block; }
.prod-noimg{ height:280px; display:flex; align-items:center; justify-content:center; color:var(--muted); font-size:14px; }
.prod-best{ position:absolute; top:16px; left:16px; background:var(--flame); color:#fff; font-family:'IBM Plex Mono'; font-size:11px; font-weight:600; padding:6px 13px; border-radius:999px; letter-spacing:.04em; }
.prod-title{ font-size:clamp(26px,3.4vw,38px); line-height:1.15; margin:6px 0 14px; }
.prod-specs{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:18px; }
.prod-spec{ font-size:12.5px; background:var(--cloud); border:1px solid var(--line); border-radius:999px; padding:5px 12px; color:var(--navy); }
.prod-price-box{ background:var(--cloud); border:1px solid var(--line); border-radius:14px; padding:16px 18px; margin-bottom:18px; }
.prod-price{ font-size:15px; }
.prod-price strong{ font-family:'Fraunces'; font-size:32px; color:var(--navy); margin-right:8px; }
.prod-price span{ font-size:12.5px; color:var(--muted); }
.prod-fin{ font-size:13px; color:var(--muted); margin-top:8px; }
.prod-fin strong{ color:var(--navy); }
.prod-ctas{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:18px; }
.prod-ctas .btn-ghost{ border-color:var(--navy); color:var(--navy); }
.prod-ctas .btn-ghost:hover{ background:rgba(14,34,56,.06); }
.prod-meta{ font-size:14px; color:var(--muted); display:grid; gap:6px; }
.prod-meta strong{ color:var(--navy); }
.prod-eff{ display:inline-block; background:#E8F6EC; color:#1C7C3C; border-radius:6px; padding:2px 8px; font-weight:700; font-size:12.5px; }
.prod-detail{ display:grid; grid-template-columns:1.4fr 1fr; gap:44px; margin-top:44px; }
@media (max-width: 860px){ .prod-detail{ grid-template-columns:1fr; } }
.prod-h2{ font-size:20px; margin-bottom:10px; }
.prod-desc{ font-size:15px; color:var(--muted); line-height:1.65; }
.prod-feats{ list-style:none; display:grid; gap:8px; }
.prod-feats li{ font-size:14px; padding-left:22px; position:relative; }
.prod-feats li::before{ content:"✓"; position:absolute; left:0; color:var(--flame); font-weight:700; }
.prod-back{ margin-top:44px; }
.p-ficha-link{ display:inline-block; margin-top:12px; font-size:13.5px; font-weight:700; color:var(--flame-deep); }
.p-ficha-link:hover{ text-decoration:underline; }

/* ---- Comparador de ahorro (ahorro.html) ---- */
.ahorro-grid{ display:grid; grid-template-columns:1fr 1fr; gap:34px; align-items:start; }
@media (max-width: 820px){ .ahorro-grid{ grid-template-columns:1fr; } }
.ahorro-form, .ahorro-result{ background:#fff; border:1px solid var(--line); border-radius:18px; padding:26px; }
.ahorro-result{ background:var(--navy); color:#fff; border-color:transparent; }
.ahorro-h3{ font-size:18px; margin-bottom:16px; }
.ahorro-label{ display:block; font-size:13px; font-weight:700; margin:16px 0 8px; }
.ahorro-input-row{ display:flex; align-items:center; gap:10px; }
.ahorro-input-row input{ width:140px; font-size:20px; font-weight:700; padding:10px 14px; border:1px solid var(--line); border-radius:10px; color:var(--navy); }
.ahorro-hint{ font-size:12.5px; color:var(--muted); margin-top:8px; }
.ahorro-opts{ display:grid; gap:10px; }
.ahorro-opt{ display:flex; gap:10px; align-items:flex-start; border:1px solid var(--line); border-radius:12px; padding:12px 14px; cursor:pointer; font-size:13.5px; line-height:1.45; }
.ahorro-opt:has(input:checked){ border-color:var(--flame); background:#FFF6F1; }
.ahorro-opt input{ margin-top:3px; accent-color:var(--flame); }
.ahorro-big{ font-family:'Fraunces'; font-size:clamp(30px,4vw,44px); color:var(--flame); line-height:1.1; }
.ahorro-sub{ font-size:13px; color:rgba(255,255,255,.75); margin-bottom:16px; }
.ahorro-lines{ list-style:none; display:grid; gap:8px; font-size:14px; color:rgba(255,255,255,.85); margin-bottom:14px; }
.ahorro-lines strong{ color:#fff; }
.ahorro-note{ font-size:13px; color:rgba(255,255,255,.75); border-top:1px solid rgba(255,255,255,.15); padding-top:12px; margin-bottom:16px; }
.ahorro-ctas{ display:flex; flex-wrap:wrap; gap:10px; }
.ahorro-legal{ font-size:12.5px; color:var(--muted); margin-top:26px; line-height:1.6; }

/* ---- Preguntas frecuentes (faq.html) ---- */
.faq-search{ display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--line); border-radius:14px; padding:14px 18px; margin-bottom:26px; }
.faq-search input{ flex:1; border:none; outline:none; font-size:15px; color:var(--navy); background:transparent; }
.faq-empty{ font-size:14px; color:var(--muted); background:var(--cloud); border-radius:12px; padding:16px 18px; margin-bottom:20px; }
.faq-cat{ font-size:20px; margin:30px 0 12px; }
.faq-item{ background:#fff; border:1px solid var(--line); border-radius:12px; margin-bottom:10px; overflow:hidden; }
.faq-item summary{ cursor:pointer; list-style:none; padding:15px 44px 15px 18px; font-weight:700; font-size:14.5px; color:var(--navy); position:relative; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{ content:"+"; position:absolute; right:18px; top:50%; transform:translateY(-50%); font-size:20px; color:var(--flame); transition:transform .2s ease; }
.faq-item[open] summary::after{ transform:translateY(-50%) rotate(45deg); }
.faq-item[open] summary{ border-bottom:1px dashed var(--line); }
.faq-a{ padding:14px 18px 16px; font-size:14px; color:var(--muted); line-height:1.6; }
.faq-more{ display:inline-block; margin-top:8px; font-size:13px; font-weight:700; color:var(--flame-deep); }
.faq-more:hover{ text-decoration:underline; }
.faq-cta{ text-align:center; margin-top:36px; display:grid; gap:12px; justify-items:center; }
.faq-cta .btn{ margin:0 5px; }

/* ---- Panel de clientes: estados (mini-CRM) y estadísticas ---- */
.lead-estado{ font-size:12px; font-weight:700; border-radius:999px; padding:5px 10px; border:1px solid var(--line); cursor:pointer; background:#fff; color:var(--navy); }
.lead-estado.est-pendiente{ background:#FFF3D6; border-color:#F2D48A; color:#8A6100; }
.lead-estado.est-llamado{ background:#E3F2FB; border-color:#A9D7F2; color:#0F5E8C; }
.lead-estado.est-presupuestado{ background:#E8EAF6; border-color:#B9C0E8; color:#2E3A8C; }
.lead-estado.est-cerrado{ background:#E8F6EC; border-color:#A9DFBB; color:#1C7C3C; }
.stats-pro{ display:grid; grid-template-columns:1.5fr 1fr; gap:20px; background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px 20px; margin-bottom:18px; }
@media (max-width: 720px){ .stats-pro{ grid-template-columns:1fr; } }
.stats-pro h4{ font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin-bottom:10px; }
.sp-bars{ display:flex; align-items:flex-end; gap:8px; height:110px; }
.sp-col{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; gap:4px; }
.sp-n{ font-size:11px; font-weight:700; color:var(--navy); }
.sp-bar{ width:100%; max-width:34px; background:var(--flame); border-radius:6px 6px 2px 2px; min-height:3px; transition:height .3s ease; }
.sp-lbl{ font-size:10px; color:var(--muted); white-space:nowrap; }
.sp-tags{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.sp-tag{ font-size:12px; border:1px solid var(--line); border-radius:999px; padding:5px 11px; color:var(--navy); background:var(--cloud); }
.sp-tag.est-pendiente{ background:#FFF3D6; border-color:#F2D48A; color:#8A6100; }
.sp-tag.est-llamado{ background:#E3F2FB; border-color:#A9D7F2; color:#0F5E8C; }
.sp-tag.est-presupuestado{ background:#E8EAF6; border-color:#B9C0E8; color:#2E3A8C; }
.sp-tag.est-cerrado{ background:#E8F6EC; border-color:#A9DFBB; color:#1C7C3C; }

/* ================================================================
   v27 — Páginas de marcas, sello Mundial Hisense y MODO OSCURO
   ================================================================ */

/* ---- Índice de marcas (marcas.html) ---- */
.marcas-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:16px; }
.marcas-item{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:22px; display:flex; flex-direction:column; gap:6px; transition:box-shadow .25s ease, transform .25s ease; }
.marcas-item:hover{ box-shadow:var(--shadow); transform:translateY(-3px); }
.marcas-nombre{ font-family:'Fraunces'; font-size:17px; font-weight:600; color:var(--navy); margin-top:2px; }
.marcas-num{ font-family:'IBM Plex Mono'; font-size:12px; color:var(--flame-deep); font-weight:600; }
.marcas-detalle{ font-size:13px; color:var(--muted); }
.marca-more{ font-size:13px; font-weight:700; color:var(--flame-deep); margin-top:6px; }

/* ---- Página de una marca (marcas/<marca>.html) ---- */
.marca-bloque{ margin-bottom:44px; }
.marca-cat{ font-size:22px; margin-bottom:16px; }
.marca-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:16px; }
.marca-card{ background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; display:flex; flex-direction:column; transition:box-shadow .25s ease, transform .25s ease; }
.marca-card:hover{ box-shadow:var(--shadow); transform:translateY(-3px); }
.marca-visual{ position:relative; height:170px; background:#fff; border-bottom:1px solid var(--line); }
.marca-visual img{ width:100%; height:100%; object-fit:contain; padding:14px; }
.marca-noimg{ display:flex; align-items:center; justify-content:center; height:100%; color:var(--muted); font-size:13px; }
.marca-best{ position:absolute; top:12px; left:12px; background:var(--flame); color:#fff; font-family:'IBM Plex Mono'; font-size:10px; font-weight:600; padding:5px 10px; border-radius:999px; }
.marca-body{ padding:16px 18px 18px; display:flex; flex-direction:column; gap:6px; flex:1; }
.marca-name{ font-weight:700; font-size:14.5px; color:var(--navy); line-height:1.35; }
.marca-specs{ font-size:12.5px; color:var(--muted); }
.marca-price{ margin-top:auto; font-size:13px; color:var(--muted); }
.marca-price strong{ font-family:'Fraunces'; font-size:20px; color:var(--navy); margin-right:6px; }

/* ---- Sello "patrocinador del Mundial" (Hisense) ---- */
.sponsor-badge{ display:inline-flex; align-items:center; gap:9px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.25); border-radius:999px; padding:8px 16px; font-size:13px; color:#fff; margin-top:14px; }
.sponsor-badge svg{ width:16px; height:16px; flex:none; }

/* ================================================================
   MODO OSCURO — se activa con data-theme="dark" en <html>
   (theme.js decide el inicial; el botón de la cabecera lo cambia)

   Estrategia: --navy pasa a ser CLARO (arregla de golpe todos los
   títulos, nombres, precios y etiquetas que usan var(--navy) como
   color de texto), y los sitios que usaban navy como FONDO se fijan
   a mano con azules oscuros literales.
   ================================================================ */
[data-theme="dark"]{
  --paper:#0C141D;
  --cloud:#121D29;
  --text:#D6E0EA;
  --muted:#93A5B6;
  --line:#25384C;
  --navy:#DCE7F1;       /* antes texto azul oscuro → ahora claro */
  --navy-soft:#B9CBDC;
  --aero-card-bg:#141F2C; /* tarjetas de aerotermia con fondo fijo en claro */
  --shadow:0 14px 40px rgba(0,0,0,.5);
}

/* --- Sitios que usaban var(--navy) como FONDO: azul oscuro fijo --- */
[data-theme="dark"] .mobile-nav{ background:#0E2238; }
[data-theme="dark"] .reviews{ background:radial-gradient(60% 80% at 15% -10%, rgba(255,107,53,.12), transparent 55%), linear-gradient(180deg,#0B1725 0%, #081420 100%); }
[data-theme="dark"] .trust-item .icon,
[data-theme="dark"] .info-row .icon,
[data-theme="dark"] .install-banner .icon{ background:#173A5C; }
[data-theme="dark"] .areas-col li a:hover{ background:#173A5C; color:#fff; border-color:#173A5C; }
[data-theme="dark"] .radio-chip.active,
[data-theme="dark"] .p-cta .p-primary,
[data-theme="dark"] .p-card.open .p-toggle,
[data-theme="dark"] .filter-btn.active,
[data-theme="dark"] .calc-tab.active{ background:#173A5C; color:#fff; border-color:#173A5C; }
[data-theme="dark"] .compare-bar{ background:#173A5C; }
[data-theme="dark"] .article-prose th{ background:#173A5C; color:#fff; }
/* Cuerpo del artículo: en claro va #3D4C5C fijo; en oscuro hay que aclararlo
   o el texto queda oscuro sobre fondo oscuro (bug de contraste real). */
[data-theme="dark"] .article-prose p,
[data-theme="dark"] .article-prose li,
[data-theme="dark"] .article-prose td{ color:#C3D0DC; }
[data-theme="dark"] .article-prose a{ color:#FF8A5B; }
[data-theme="dark"] .article-prose blockquote{ background:#152230; color:#C3D0DC; }
[data-theme="dark"] .article-prose h2,
[data-theme="dark"] .article-prose h3,
[data-theme="dark"] .article-prose h4{ color:#EAF2F8; }
[data-theme="dark"] .ahorro-result{ background:#101B27; border:1px solid var(--line); }
[data-theme="dark"] .btn-navy:hover{ background:#173A5C; color:#fff; }
[data-theme="dark"] .marquee, [data-theme="dark"] .marquee-band{ background:#0E2238; }

/* --- Superficies que en claro son blanco fijo --- */
[data-theme="dark"] .p-card,
[data-theme="dark"] .value-card,
[data-theme="dark"] .form-card,
[data-theme="dark"] .p-toggle,
[data-theme="dark"] .filter-btn,
[data-theme="dark"] .extra-costs .box,
[data-theme="dark"] .catalog-search,
[data-theme="dark"] .calc-tab,
[data-theme="dark"] .calc-card,
[data-theme="dark"] .calc-choice,
[data-theme="dark"] .reco-card,
[data-theme="dark"] .alt-row,
[data-theme="dark"] .sub-chip,
[data-theme="dark"] .p-compare,
[data-theme="dark"] .compare-sheet,
[data-theme="dark"] .compare-close,
[data-theme="dark"] .subv-card,
[data-theme="dark"] .guide-card,
[data-theme="dark"] .legal-toc a,
[data-theme="dark"] .legal-prose,
[data-theme="dark"] .budget-sheet,
[data-theme="dark"] .budget-close,
[data-theme="dark"] .budget-fin-box,
[data-theme="dark"] .search-box,
[data-theme="dark"] #leadsList .lead,
[data-theme="dark"] .lead-estado,
[data-theme="dark"] .marcas-item,
[data-theme="dark"] .marca-card,
[data-theme="dark"] .marca-body,
[data-theme="dark"] .ahorro-form,
[data-theme="dark"] .faq-item,
[data-theme="dark"] .faq-search,
[data-theme="dark"] .stats-pro,
[data-theme="dark"] .recientes,
[data-theme="dark"] .reciente,
[data-theme="dark"] .search-btn,
[data-theme="dark"] .theme-btn{ background:#152230; border-color:var(--line); }

/* Paneles a pantalla completa */
[data-theme="dark"] .search-overlay,
[data-theme="dark"] .success-overlay{ background:#0F1B28; }

/* --- Zonas de FOTO: claras a propósito (las fotos tienen fondo blanco) --- */
[data-theme="dark"] .p-visual{ background:radial-gradient(120% 100% at 50% 0%, #E7EEF4 0%, #DDE6EE 60%, #E9EFF4 100%); }
[data-theme="dark"] .prod-media{ background:#F2F5F8; }
[data-theme="dark"] .marca-visual{ background:#F2F5F8; }
[data-theme="dark"] .p-photo, [data-theme="dark"] .reciente img, [data-theme="dark"] .reciente-noimg{ background:#fff; }

/* --- Degradados y cajas claras fijas --- */
[data-theme="dark"] .products-section{ background:linear-gradient(180deg, var(--paper) 0%, var(--cloud) 100%); }
[data-theme="dark"] .power-box.rec{ background:#22303F; border-color:#3A4C60; }
[data-theme="dark"] .prod-price-box{ background:var(--cloud); }
[data-theme="dark"] .sp-tag{ background:#1B2A3A; border-color:var(--line); color:var(--text); }
[data-theme="dark"] .faq-empty{ background:var(--cloud); }

/* Botones fantasma sobre fondo oscuro */
[data-theme="dark"] .prod-ctas .btn-ghost,
[data-theme="dark"] .budget-actions .btn-ghost{ border-color:#B9CBDC; color:#D6E0EA; }
[data-theme="dark"] .prod-ctas .btn-ghost:hover,
[data-theme="dark"] .budget-actions .btn-ghost:hover{ background:rgba(255,255,255,.08); }

/* Campos de formulario */
[data-theme="dark"] input, [data-theme="dark"] select, [data-theme="dark"] textarea{
  background:#152230; color:var(--text); border-color:var(--line);
}
[data-theme="dark"] input::placeholder, [data-theme="dark"] textarea::placeholder{ color:#5F7488; }
[data-theme="dark"] .ahorro-opt{ border-color:var(--line); }
[data-theme="dark"] .ahorro-opt:has(input:checked){ background:#2A2018; border-color:var(--flame); }

/* Los chips de estado del panel conservan sus colores claros (legibles) */
[data-theme="dark"] .lead-estado.est-pendiente{ background:#FFF3D6; color:#8A6100; }
[data-theme="dark"] .lead-estado.est-llamado{ background:#E3F2FB; color:#0F5E8C; }
[data-theme="dark"] .lead-estado.est-presupuestado{ background:#E8EAF6; color:#2E3A8C; }
[data-theme="dark"] .lead-estado.est-cerrado{ background:#E8F6EC; color:#1C7C3C; }

/* ---- Tira "vistos recientemente" del catálogo ---- */
.recientes{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:16px 18px; margin-bottom:22px; }
.recientes-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.recientes-head h4{ font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); }
.recientes-clear{ background:none; border:none; font-size:12px; color:var(--muted); text-decoration:underline; }
.recientes-clear:hover{ color:var(--flame-deep); }
.recientes-row{ display:flex; gap:12px; overflow-x:auto; padding-bottom:4px; }
.reciente{ display:flex; align-items:center; gap:10px; border:1px solid var(--line); border-radius:12px; padding:8px 12px 8px 8px; flex:none; max-width:250px; transition:border-color .2s ease; }
.reciente:hover{ border-color:var(--flame); }
.reciente img, .reciente-noimg{ width:44px; height:44px; object-fit:contain; background:#fff; border-radius:8px; flex:none; }
.reciente-info{ display:flex; flex-direction:column; min-width:0; }
.reciente-name{ font-size:12.5px; font-weight:700; color:var(--navy); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
[data-theme="dark"] .reciente-name{ color:#EAF2F8; }
.reciente-price{ font-family:'IBM Plex Mono'; font-size:11.5px; color:var(--flame-deep); }

/* ---- España campeona del Mundial 2026: texto gigante + confeti (caduca 26/07) ---- */
.confeti{ position:fixed; inset:0; width:100vw; height:100vh; pointer-events:none; z-index:360; }
/* Modal de "España campeona": caja oscura sólida = contraste garantizado */
.mundial-hero{
  position:fixed; inset:0; z-index:355; pointer-events:none;
  display:flex; align-items:center; justify-content:center; text-align:center; padding:20px;
  background:rgba(6,13,22,.74);
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
  animation:mhIn .5s var(--ease); transition:opacity .9s ease;
}
.mundial-hero.out{ opacity:0; }
.mh-box{
  position:relative; overflow:hidden;
  display:flex; flex-direction:column; align-items:center; gap:10px;
  padding:clamp(40px,6vw,60px) clamp(30px,6vw,64px) clamp(34px,5vw,48px);
  border-radius:28px; max-width:600px;
  background:
    radial-gradient(120% 80% at 50% -10%, rgba(255,196,0,.16), transparent 60%),
    linear-gradient(180deg, #16375A 0%, #0A1B2E 55%, #07131F 100%);
  border:1px solid rgba(255,196,0,.4);
  box-shadow:0 40px 120px rgba(0,0,0,.65), 0 0 0 6px rgba(255,196,0,.06), inset 0 1px 0 rgba(255,255,255,.1);
  animation:mhPop .7s var(--ease);
}
/* Franja de la bandera de España arriba */
.mh-box::before{
  content:""; position:absolute; top:0; left:0; right:0; height:6px;
  background:linear-gradient(90deg, #C60B1E 0 28%, #FFC400 28% 72%, #C60B1E 72% 100%);
}
.mh-glow{ position:absolute; top:-40%; left:50%; width:140%; height:140%; transform:translateX(-50%);
  background:radial-gradient(closest-side, rgba(255,196,0,.14), transparent 70%); pointer-events:none;
  animation:mhShine 4s ease-in-out infinite; }
@keyframes mhShine{ 0%,100%{ opacity:.5; } 50%{ opacity:1; } }
.mh-trophy{ font-size:clamp(48px,8vw,76px); line-height:1; filter:drop-shadow(0 8px 20px rgba(255,196,0,.4)); animation:mhBob 2.4s ease-in-out infinite; position:relative; }
@keyframes mhBob{ 0%,100%{ transform:translateY(0) rotate(-3deg); } 50%{ transform:translateY(-8px) rotate(3deg); } }
.mh-eyebrow{
  font-family:'IBM Plex Mono'; letter-spacing:.2em; text-transform:uppercase;
  font-size:clamp(10px,1.3vw,13px); font-weight:600; color:#FFD54A; position:relative;
}
.mh-title{
  font-family:'Fraunces'; font-weight:700; letter-spacing:-.02em;
  font-size:clamp(38px,6.5vw,68px); line-height:1.02; position:relative;
  background:linear-gradient(180deg, #FFFFFF 0%, #FFE9A8 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:#fff;
}
.mh-sub{ font-family:'Inter'; font-weight:600; font-size:clamp(15px,2vw,19px); color:rgba(255,255,255,.85); position:relative; }
.mh-flag{ font-size:1.1em; }
.mh-stars{ color:#FFC400; letter-spacing:.18em; font-size:clamp(13px,1.6vw,16px); margin-top:2px; position:relative; text-shadow:0 2px 10px rgba(255,196,0,.5); }
@media (prefers-reduced-motion: reduce){ .mh-glow, .mh-trophy{ animation:none; } }
@keyframes mhIn{ from{ opacity:0; } }
@keyframes mhPop{ from{ opacity:0; transform:scale(.82) translateY(20px); } }
@media (prefers-reduced-motion: reduce){ .mundial-hero, .mh-box{ animation:none; } }

/* ================================================================
   v31 — Pulido de interacción (revisión Emil Kowalski)
   Feedback de pulsado en todo lo presionable + hover solo en ratón
   ================================================================ */

/* Feedback tactil: el elemento se hunde al presionar (scale 0.97) */
.submit-btn:active, .search-btn:active, .theme-btn:active,
.p-wa:active, .p-toggle:active, .p-compare:active, .filter-btn:active,
.calc-tab:active, .sub-chip:active, .nav-toggle:active, .mb-cerrar:active,
.lead-del:active, .chip:active, .p-cta a:active, .areas-col li a:active,
.marcas-item:active, .marca-card:active, .reciente:active{
  transform:scale(.97);
}

/* Los efectos de "levantar" al pasar el raton solo deben ocurrir con raton
   real; en tactil se disparan al tocar y se quedan pegados. En pantallas
   sin hover, anulamos el desplazamiento (el color/sombra si se mantienen). */
@media (hover: none){
  .btn-flame:hover, .btn-ghost:hover, .btn-navy:hover, .btn-white:hover,
  .value-card:hover, .review-card:hover, .submit-btn:hover, .wa-float:hover,
  .p-cta .p-primary:hover, .p-cta .p-secondary:hover,
  .search-btn:hover, .theme-btn:hover, .calc-tab:hover, .alt-row:hover,
  .p-wa:hover, .subv-card:hover, .guide-card:hover,
  .marcas-item:hover, .marca-card:hover, .p-card:hover, .reciente:hover{
    transform:none;
  }
}

/* ============ v33: fondo tras el catálogo (para que el cristal difumine) + glass oscuro ============ */
#catalogRoot{
  background:
    radial-gradient(55% 45% at 12% 0%, rgba(58,166,217,.12), transparent 60%),
    radial-gradient(45% 45% at 92% 22%, rgba(255,107,53,.09), transparent 60%);
  border-radius:24px;
}
[data-theme="dark"] .p-card{
  background:rgba(21,34,48,.58); border-color:rgba(255,255,255,.08);
  box-shadow:0 12px 36px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06);
}
[data-theme="dark"] .p-name{ color:#EAF2F8; }
[data-theme="dark"] .p-ideal{ color:#C3D0DC; }
[data-theme="dark"] .p-specs span{ background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.08); }
[data-theme="dark"] .p-actions .p-compare{ color:#D6E0EA; border-color:rgba(255,255,255,.15); }
[data-theme="dark"] .vt-btn{ background:#152230; }

/* ============ v33b: enriquecimiento de la ficha de producto ============ */
.prod-extra{ display:grid; grid-template-columns:1.5fr 1fr; gap:30px; margin-top:44px; align-items:start; }
@media(max-width:820px){ .prod-extra{ grid-template-columns:1fr; gap:24px; } }
.prod-inc-grid{ list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:10px 20px; }
@media(max-width:560px){ .prod-inc-grid{ grid-template-columns:1fr; } }
.prod-inc-grid li{ position:relative; padding-left:26px; font-size:14px; color:var(--muted); line-height:1.45; }
.prod-inc-grid li::before{ content:"✓"; position:absolute; left:0; top:0; color:#fff; background:var(--flame); width:18px; height:18px; border-radius:50%; font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.prod-fin-card{ background:var(--cloud); border:1px solid var(--line); border-radius:16px; padding:22px; }
.prod-fin-table{ width:100%; border-collapse:collapse; margin:6px 0 12px; }
.prod-fin-table td{ padding:10px 0; border-bottom:1px solid var(--line); font-size:14px; color:var(--muted); }
.prod-fin-table td:last-child{ text-align:right; }
.prod-fin-table strong{ font-family:'Fraunces'; font-size:19px; color:var(--flame-deep); }
.prod-fin-table tr:last-child td{ border-bottom:none; }
.prod-fin-note{ font-size:12px; color:var(--muted); line-height:1.5; margin-bottom:14px; }
.prod-trust{ display:flex; flex-wrap:wrap; gap:14px 30px; justify-content:center; margin-top:40px; padding:22px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.prod-trust div{ font-size:14px; color:var(--muted); }
.prod-trust strong{ color:var(--navy); font-family:'Fraunces'; font-size:18px; margin-right:4px; }
[data-theme="dark"] .prod-fin-card{ background:#152230; }
[data-theme="dark"] .prod-trust strong{ color:#EAF2F8; }

/* ============ v35: modo oscuro — botones navy nuevos + modales (auditoría completa) ============ */
/* Botones que usan background:var(--navy) (que en dark se vuelve claro) -> fijar navy real */
[data-theme="dark"] .p-ficha-btn,
[data-theme="dark"] .p-ficha-btn:hover,
[data-theme="dark"] .vt-btn.active,
[data-theme="dark"] .p-actions .p-compare.active,
[data-theme="dark"] .p-cta .p-primary,
[data-theme="dark"] .p-cta .p-primary:hover{ background:#1C3B58; color:#fff; border-color:#1C3B58; }
[data-theme="dark"] .p-cta .p-secondary{ color:#D6E0EA; border-color:rgba(255,255,255,.18); }
[data-theme="dark"] .p-rate{ color:#93A5B6; }
/* v52: chip de subvención activo (background:var(--navy) se volvía claro → texto blanco invisible) */
[data-theme="dark"] .sub-chip.active{ background:#1C3B58; border-color:#1C3B58; color:#fff; }
/* v52: badges de clase energética coherentes en oscuro (antes verde clarito chillón) */
[data-theme="dark"] .p-specs .p-eff,
[data-theme="dark"] .prod-eff{ background:#12301F !important; color:#5FD98A !important; border-color:#265F42 !important; }

/* Modales: comparador de productos y presupuesto de la calculadora */
[data-theme="dark"] .compare-sheet,
[data-theme="dark"] .budget-sheet{ background:#152230; color:#D6E0EA; }
[data-theme="dark"] .compare-sheet h1, [data-theme="dark"] .compare-sheet h2, [data-theme="dark"] .compare-sheet h3, [data-theme="dark"] .compare-sheet h4, [data-theme="dark"] .compare-sheet h5,
[data-theme="dark"] .budget-sheet h1, [data-theme="dark"] .budget-sheet h2, [data-theme="dark"] .budget-sheet h3, [data-theme="dark"] .budget-sheet h4, [data-theme="dark"] .budget-sheet strong{ color:#EAF2F8; }
[data-theme="dark"] .compare-sheet td, [data-theme="dark"] .compare-sheet th,
[data-theme="dark"] .budget-sheet td, [data-theme="dark"] .budget-sheet p{ color:#C3D0DC; border-color:rgba(255,255,255,.1); }
[data-theme="dark"] .compare-close,
[data-theme="dark"] .budget-close{ background:#1B2A3A; color:#D6E0EA; border-color:rgba(255,255,255,.15); }
[data-theme="dark"] .budget-fin-box{ background:#1B2A3A; }

/* ============ v38: owner-note en oscuro (fondo peach fijo + var(--navy) se rompia) ============ */
[data-theme="dark"] .owner-note{
  background:linear-gradient(135deg, #2A1E14, #241A12);
  border-color:#5A3D28; color:#F0DCC8;
}

/* ============ v39: logos de marca en la pagina de marcas ============ */
.marcas-logo{ display:flex; align-items:center; justify-content:center; height:66px; background:#fff; border:1px solid var(--line); border-radius:12px; padding:12px 16px; margin-bottom:6px; }
.marcas-logo img{ max-height:100%; max-width:100%; width:auto; object-fit:contain; }
.marcas-logo-txt{ font-family:'Fraunces'; font-weight:700; font-size:20px; color:#0E2238; }
.marca-hero-logo{ display:inline-flex; align-items:center; justify-content:center; height:72px; background:#fff; border-radius:14px; padding:12px 22px; margin-bottom:16px; box-shadow:0 8px 24px rgba(0,0,0,.18); }
.marca-hero-logo img{ max-height:48px; max-width:230px; width:auto; object-fit:contain; }

/* ============ v48: artículos relacionados en el blog ============ */
.related-h2{ font-size:22px; margin-bottom:18px; }
.related-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
@media(max-width:720px){ .related-grid{ grid-template-columns:1fr; } }
.related-card{ display:flex; flex-direction:column; gap:9px; background:#fff; border:1px solid var(--line); border-radius:16px; padding:18px; text-decoration:none; transition:transform .3s var(--ease), box-shadow .3s var(--ease); }
.related-card:hover{ transform:translateY(-3px); box-shadow:0 16px 38px rgba(14,34,56,.10); }
.related-title{ font-family:'Fraunces'; font-weight:600; font-size:15.5px; color:var(--navy); line-height:1.3; }
.related-more{ font-size:12.5px; font-weight:700; color:var(--flame-deep); margin-top:auto; }
[data-theme="dark"] .related-card{ background:#152230; border-color:var(--line); }
[data-theme="dark"] .related-title{ color:#EAF2F8; }

/* ============ v49: tablas del blog con scroll horizontal en móvil ============ */
.article-prose .table-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; margin:20px 0; }
.article-prose .table-scroll table{ margin:0; min-width:440px; }

/* ============ v50: animaciones premium extra ============ */
/* 1) Brillo que barre el botón principal al pasar el ratón (toque "producto caro") */
.btn-flame{ position:relative; overflow:hidden; }
.btn-flame > *{ position:relative; z-index:1; }
.btn-flame::after{
  content:""; position:absolute; top:0; left:-120%; width:55%; height:100%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.38), transparent);
  transform:skewX(-18deg); pointer-events:none; transition:left .6s var(--ease);
}
@media (hover:hover){ .btn-flame:hover::after{ left:135%; } }

/* 2) Anillo de pulso en el botón flotante de WhatsApp (atrae la mirada sin molestar) */
.wa-float::before{
  content:""; position:absolute; inset:0; border-radius:50%; background:#25D366;
  z-index:-1; animation:waPulse 2.6s ease-out infinite;
}
@keyframes waPulse{ 0%{ transform:scale(1); opacity:.55; } 70%,100%{ transform:scale(1.75); opacity:0; } }

/* 3) Subrayado que crece bajo los enlaces del footer (microdetalle) */
footer .footer-grid a{ position:relative; }
footer .footer-grid a::after{
  content:""; position:absolute; left:0; right:100%; bottom:-2px; height:1px;
  background:var(--flame); transition:right .3s var(--ease);
}
footer .footer-grid a:hover::after{ right:0; }

@media (prefers-reduced-motion: reduce){
  .btn-flame::after{ display:none; }
  .wa-float::before{ animation:none; }
  footer .footer-grid a::after{ transition:none; }
}