/* ============================================================
   EnergíaAutónoma — tienda solar (Argentina)
   Sistema visual 2026-09-23 · reescrito por Iris
   ============================================================ */
:root{
  --ink:#0d1b2a; --ink-2:#16283c; --ink-3:#20374f;
  --orange:#f97316; --orange-2:#ea580c; --amber:#fbbf24; --amber-2:#f59e0b;
  --blue:#1d4ed8; --blue-2:#1e40af;
  --cream:#fdf9f1; --paper:#ffffff; --line:#e8e1d4; --line-2:#f0e9dc;
  --muted:#64748b; --muted-2:#7c8798;
  --texto-2:#3f4b5b; --nav-text:#33414f; --topbar-text:#dbe3ee;
  --orange-soft:#fff2e6; --surface-warm:#fffdf8; --media-bg:#f6f3ec; --input-bg:#fffdf9;
  --dark-heading:#e8eef7; --dark-lead:#b9c6d6; --image-copy:#e2e8f0; --diag-copy:#dbe4ee;
  --footer-text:#c3d0e0; --footer-soft:#9fb0c4; --footer-dim:#8fa1b6;
  --hero-badge-text:#596979; --product-text:#5b6673;
  --success:#16a34a; --danger:#dc2626;
  --invalid-bg:#fff5f5; --error-bg:#fef2f2; --error-text:#b91c1c; --error-line:#fecaca;
  --pending-bg:#fffbeb; --pending-text:#92400e; --pending-line:#fde68a;
  --ok-bg:#f0fdf4; --ok-text:#15803d; --ok-line:#bbf7d0;
  --wind-sky:#eef6f8; --warning-line:#b45309; --warning-text:#78350f;
  --key-bg:#fff7ed; --key-text:#7c2d12; --table-bg:#f8fafc; --table-alt:#fbfcfd;
  --status-yes-bg:#dcfce7; --status-yes-text:#166534; --status-maybe-bg:#fef3c7;
  --status-no-bg:#fee2e2; --status-no-text:#991b1b;
  --light-fixed:#ffffff; --dark-control:#0d1b2a; --dark-surface:#16283c; --dark-surface-2:#20374f;
  --ink-alpha-05:rgba(13,27,42,.05); --ink-alpha-45:rgba(13,27,42,.45);
  --ink-alpha-55:rgba(13,27,42,.55); --ink-alpha-86:rgba(13,27,42,.86);
  --slate-alpha-10:rgba(15,25,35,.1); --slate-alpha-20:rgba(15,25,35,.2); --slate-alpha-22:rgba(15,25,35,.22);
  --orange-2-alpha-80:rgba(234,88,12,.8); --orange-2-alpha-85:rgba(234,88,12,.85); --orange-2-alpha-90:rgba(234,88,12,.9);
  --orange-alpha-12:rgba(249,115,22,.12); --cream-alpha-88:rgba(253,249,241,.88);
  --paper-alpha-12:rgba(255,255,255,.12); --paper-alpha-14:rgba(255,255,255,.14);
  --paper-alpha-16:rgba(255,255,255,.16); --paper-alpha-94:rgba(255,255,255,.94);
  --radius:20px; --radius-sm:14px;
  --shadow-sm:0 1px 2px rgba(16,24,40,.05), 0 1px 3px rgba(16,24,40,.06);
  --shadow-md:0 10px 24px -12px rgba(16,24,40,.22);
  --shadow-lg:0 30px 60px -30px rgba(13,27,42,.35);
  --maxw:1180px;
  --pad:clamp(18px,5vw,64px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--cream); color:var(--ink);
  font:400 17px/1.65 Inter,-apple-system,'Segoe UI',system-ui,sans-serif;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
h1,h2,h3,h4,.brand-name,.price{font-family:Outfit,-apple-system,'Segoe UI',system-ui,sans-serif;font-weight:800;letter-spacing:-.02em;line-height:1.06;margin:0}
h1{font-size:clamp(36px,5.4vw,68px)}
h2{font-size:clamp(28px,3.6vw,46px)}
h3{font-size:clamp(19px,1.5vw,23px);line-height:1.2}
p{margin:0}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}
.eyebrow{font:600 12.5px/1 Inter;letter-spacing:.18em;text-transform:uppercase;color:var(--orange-2);margin:0 0 14px}
.lead{font-size:clamp(17px,1.4vw,19.5px);color:var(--texto-2);max-width:62ch}
.muted{color:var(--muted)}
.small{font-size:14.5px}
.center{text-align:center}

/* ---------- botones ---------- */
.button{
  display:inline-flex;align-items:center;gap:9px;justify-content:center;
  font:600 16px/1 Inter;padding:15px 24px;border-radius:999px;border:1.5px solid transparent;
  cursor:pointer;transition:transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s;
  white-space:nowrap;
}
.button.primary{background:var(--orange);color:var(--paper);box-shadow:0 10px 22px -12px var(--orange-2-alpha-85)}
.button.primary:hover{background:var(--orange-2);transform:translateY(-2px);box-shadow:0 16px 30px -14px var(--orange-2-alpha-90)}
.button.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.button.ghost:hover{border-color:var(--ink);transform:translateY(-2px)}
.button.light{background:var(--paper);color:var(--ink);box-shadow:var(--shadow-sm)}
.button.light:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.button.small{padding:11px 17px;font-size:15px}
.button.block{width:100%}

/* ---------- barra superior + header ---------- */
.topbar{background:var(--ink);color:var(--topbar-text);font-size:13.5px;padding:9px 0}
.topbar .wrap{display:flex;gap:18px;justify-content:space-between;align-items:center;flex-wrap:wrap}
.topbar b{color:var(--paper)}
.site-header{position:sticky;top:0;z-index:40;background:var(--cream-alpha-88);backdrop-filter:blur(12px);border-bottom:1px solid var(--line-2)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:14px;padding-bottom:14px}
.brand{display:flex;align-items:center;gap:11px}
.brand-mark-img{width:40px;height:40px;border-radius:12px;object-fit:cover;flex:none;display:block;box-shadow:0 6px 16px -8px var(--ink-alpha-55)}
.brand-mark{width:40px;height:40px;border-radius:12px;background:linear-gradient(150deg,var(--amber),var(--orange));display:grid;place-items:center;flex:none;box-shadow:0 6px 16px -8px var(--orange-2-alpha-80)}
.brand-mark svg{width:22px;height:22px}
.brand-name{font-size:20px;letter-spacing:-.03em}
.nav{display:flex;gap:26px;font:500 15.5px/1 Inter}
.nav a{color:var(--nav-text);position:relative;padding:6px 0}
.nav a:hover{color:var(--ink)}
.nav a:after{content:'';position:absolute;left:0;right:100%;bottom:0;height:2px;background:var(--orange);transition:right .2s}
.nav a:hover:after{right:0}
.head-cta{display:flex;align-items:center;gap:12px}
.head-cart{position:relative;display:inline-flex;align-items:center;gap:8px;font:600 15px Inter;padding:11px 16px;border:1.5px solid var(--line);border-radius:999px;background:var(--paper);cursor:pointer}
.head-cart:hover{border-color:var(--ink)}
.head-cart .count{background:var(--orange);color:var(--paper);font-size:12.5px;font-weight:700;border-radius:999px;padding:2px 8px;display:none}
.head-cart .count.on{display:inline-block}
.menu-btn{display:none;background:var(--paper);border:1.5px solid var(--line);border-radius:12px;padding:10px 13px;cursor:pointer}

/* ---------- hero ---------- */
.hero{padding:clamp(28px,5vw,60px) 0 clamp(24px,4vw,52px)}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(26px,4vw,58px);align-items:center}
.hero h1 em{font-style:normal;color:var(--orange);display:block}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:28px 0 18px}
.hero-note{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:14.5px}
.hero-media{position:relative}
.hero-media img{border-radius:var(--radius);box-shadow:var(--shadow-lg);aspect-ratio:4/3;object-fit:cover;width:100%}
.hero-float{
  position:absolute;left:-18px;bottom:22px;background:var(--paper);border-radius:var(--radius-sm);
  padding:14px 18px;box-shadow:var(--shadow-md);display:flex;gap:12px;align-items:center;max-width:74%;
}
.hero-float .dot{width:38px;height:38px;border-radius:11px;background:var(--orange-soft);display:grid;place-items:center;flex:none}
.hero-float b{display:block;font:700 15.5px Outfit}
.hero-float span{font-size:13.5px;color:var(--muted)}

/* ---------- tira de confianza ---------- */
.trust{border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);background:var(--surface-warm)}
.trust .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;padding-top:26px;padding-bottom:26px}
.trust-item .ico{width:42px;height:42px;border-radius:13px;background:var(--orange-soft);display:grid;place-items:center;flex:none}
.trust-item .ico svg{width:22px;height:22px;color:var(--orange-2)}
.trust-item{display:flex;gap:12px;align-items:flex-start}
.trust-item svg{width:24px;height:24px;flex:none;color:var(--orange)}
.trust-item b{font:700 15.5px Outfit;display:block;margin-bottom:2px}
.trust-item span{font-size:14px;color:var(--muted);line-height:1.45}

/* ---------- secciones ---------- */
.section{padding:clamp(46px,6vw,86px) 0}
.section.tight{padding:clamp(34px,4vw,56px) 0}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:34px;flex-wrap:wrap}
.section-head .lead{max-width:46ch}
.section.dark{background:var(--ink);color:var(--dark-heading)}
.section.dark .eyebrow{color:var(--amber)}
.section.dark .lead{color:var(--dark-lead)}
.section.alt{background:var(--surface-warm)}
.section.paper{background:var(--paper)}

/* ---------- categorías por necesidad ---------- */
.needs{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.need{position:relative;border-radius:var(--radius);overflow:hidden;min-height:290px;display:flex;flex-direction:column;justify-content:flex-end;padding:22px;color:var(--paper);box-shadow:var(--shadow-md);isolation:isolate}
.need img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .5s ease}
.need:hover img{transform:scale(1.05)}
.need:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,var(--ink-alpha-05) 20%,var(--ink-alpha-86))}
.need h3{color:var(--paper);margin-bottom:6px}
.need p{font-size:14.5px;color:var(--image-copy);line-height:1.45}
.need .go{margin-top:12px;font:600 14.5px Inter;color:var(--paper);display:inline-flex;gap:7px;align-items:center}
.need .go:after{content:'→';transition:transform .2s}
.need:hover .go:after{transform:translateX(4px)}
.need .num{position:absolute;top:18px;left:20px;font:800 13px Outfit;letter-spacing:.14em;background:var(--paper-alpha-16);padding:5px 10px;border-radius:999px;backdrop-filter:blur(6px)}

/* ---------- tarjetas de producto ---------- */
.products{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.card{background:var(--paper);border:1px solid var(--line-2);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;transition:transform .18s ease, box-shadow .18s ease, border-color .18s}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--line)}
.card-media{position:relative;aspect-ratio:1/1;background:var(--media-bg);overflow:hidden}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.card:hover .card-media img{transform:scale(1.04)}
.card-tag{position:absolute;top:12px;left:12px;background:var(--paper-alpha-94);font:700 11.5px Inter;letter-spacing:.08em;text-transform:uppercase;padding:6px 10px;border-radius:999px;color:var(--ink)}
.card-body{padding:18px 18px 8px;display:flex;flex-direction:column;gap:7px;flex:1}
.card-title{font:800 18px Outfit;letter-spacing:-.02em}
.card-desc{font-size:14.5px;color:var(--muted);line-height:1.5}
.card-spec{font-size:13px;color:var(--muted-2);margin-top:2px}
.card-foot{margin-top:auto;padding:14px 18px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line-2)}
.price{font:800 16.5px Outfit;letter-spacing:-.01em}
.price small{display:block;font:500 12.5px Inter;color:var(--muted);letter-spacing:0}
.card .button{padding:11px 15px;font-size:14.5px}
.card-add{background:var(--ink);color:var(--paper);border:0;border-radius:999px;padding:11px 15px;font:600 14.5px Inter;cursor:pointer;transition:background .16s}
.card-add:hover{background:var(--ink-3)}
.card-add.done{background:var(--success)}

/* ---------- grilla de filtros ---------- */
.chips{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:26px}
.chip{background:var(--paper);border:1.5px solid var(--line);border-radius:999px;padding:9px 15px;font:600 14.5px Inter;cursor:pointer;color:var(--nav-text)}
.chip:hover{border-color:var(--ink)}
.chip.active{background:var(--ink);color:var(--paper);border-color:var(--ink)}

/* ---------- diagnóstico ---------- */
.diag .wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,4vw,60px);align-items:center}
.diag-list{display:grid;gap:0;border-top:1px solid var(--paper-alpha-14)}
.diag-item{display:flex;gap:16px;padding:19px 0;border-bottom:1px solid var(--paper-alpha-14);align-items:flex-start}
.diag-item b{font:800 13px Outfit;color:var(--amber);letter-spacing:.1em;flex:none;padding-top:3px}
.diag-item p{color:var(--diag-copy);font-size:16px}

/* ---------- pasos ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.step{background:var(--paper);border:1px solid var(--line-2);border-radius:var(--radius);padding:26px}
.step .n{width:44px;height:44px;border-radius:13px;background:var(--orange-soft);color:var(--orange-2);display:grid;place-items:center;font:800 18px Outfit;margin-bottom:16px}
.step h3{margin-bottom:8px}
.step p{color:var(--muted);font-size:15.5px}
.notice-band{margin-top:24px;background:var(--paper);border:1px dashed var(--line);border-radius:var(--radius-sm);padding:16px 20px;font-size:15px;color:var(--texto-2);display:flex;gap:12px;align-items:flex-start}
.notice-band svg{width:20px;height:20px;color:var(--orange);flex:none;margin-top:3px}

/* ---------- faq ---------- */
.faq{display:grid;gap:12px;max-width:860px}
.faq details{background:var(--paper);border:1px solid var(--line-2);border-radius:var(--radius-sm);padding:0;overflow:hidden;transition:border-color .16s}
.faq details[open]{border-color:var(--line)}
.faq summary{cursor:pointer;padding:20px 24px;font:700 17.5px Outfit;list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:'+';font:400 26px Inter;color:var(--orange);line-height:1}
.faq details[open] summary:after{content:'–'}
.faq .ans{padding:0 24px 22px;color:var(--muted);font-size:15.5px}

/* ---------- banda final ---------- */
.cta-band{background:linear-gradient(140deg,var(--ink) 0%,var(--ink-3) 100%);color:var(--paper);border-radius:26px;padding:clamp(32px,5vw,64px);text-align:center;box-shadow:var(--shadow-lg)}
.cta-band h2{color:var(--paper);max-width:22ch;margin:0 auto 14px}
.cta-band p{color:var(--footer-text);max-width:60ch;margin:0 auto 26px}
.cta-band .actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.cta-note{margin-top:18px;font-size:14px;color:var(--footer-soft)}

/* ---------- footer ---------- */
.site-footer{background:var(--ink);color:var(--footer-text);padding:clamp(40px,5vw,64px) 0 26px;margin-top:clamp(40px,5vw,70px)}
.site-footer .cols{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:32px;padding-bottom:34px;border-bottom:1px solid var(--paper-alpha-12)}
.site-footer .brand-name{color:var(--paper)}
.site-footer h4{font:700 14px Outfit;letter-spacing:.06em;text-transform:uppercase;color:var(--paper);margin-bottom:14px}
.site-footer a{display:block;color:var(--footer-text);font-size:15px;padding:5px 0}
.site-footer a:hover{color:var(--paper)}
.site-footer .foot-bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:20px;font-size:14px;color:var(--footer-dim)}
.site-footer .tagline{font-size:14.5px;color:var(--footer-soft);margin-top:14px;max-width:36ch}

/* ---------- páginas internas ---------- */
.page-head{padding:clamp(34px,5vw,62px) 0 10px}
.page-head .lead{margin-top:16px}
.crumbs{font-size:14px;color:var(--muted);margin-bottom:16px}
.crumbs a:hover{color:var(--ink)}
.policy-body{background:var(--paper);border:1px solid var(--line-2);border-radius:var(--radius);padding:clamp(24px,4vw,48px);max-width:900px}
.policy-body h2{font-size:clamp(20px,2vw,25px);margin:34px 0 10px}
.policy-body h2:first-child{margin-top:0}
.policy-body p{color:var(--texto-2);margin-bottom:12px}
.policy-body ul{margin:0 0 14px;padding-left:20px;color:var(--texto-2)}
.policy-body li{margin-bottom:7px}
.policy-body a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.policy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px}
.policy-card{background:var(--paper);border:1px solid var(--line-2);border-radius:var(--radius-sm);padding:24px;display:block;transition:transform .16s,box-shadow .16s}
.policy-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.policy-card h3{margin-bottom:8px}
.policy-card p{color:var(--muted);font-size:15px}
.text-link{color:var(--blue);text-decoration:underline;text-underline-offset:3px}

/* ---------- formulario ---------- */
.form-section .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(24px,4vw,52px);align-items:start}
.form-card{background:var(--paper);border:1px solid var(--line-2);border-radius:var(--radius);padding:clamp(22px,3vw,36px);box-shadow:var(--shadow-sm)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:flex;flex-direction:column;gap:7px}
.field.full{grid-column:1/-1}
.field label{font:600 15px Inter}
.field input,.field select,.field textarea{
  font:400 16px Inter;padding:13px 15px;border:1.5px solid var(--line);border-radius:12px;background:var(--input-bg);color:var(--ink);transition:border-color .15s, box-shadow .15s;
}
.field textarea{min-height:96px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--orange);box-shadow:0 0 0 4px var(--orange-alpha-12)}
.field .hint{font-size:13.5px;color:var(--muted)}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:var(--danger);background:var(--invalid-bg)}
.check-line{display:flex;gap:11px;align-items:flex-start;font-size:15px;color:var(--texto-2)}
.check-line input{width:19px;height:19px;margin-top:2px;accent-color:var(--orange)}
.form-actions{margin-top:22px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.form-hint{font-size:14px;color:var(--muted)}
.form-status{display:none;margin-top:16px;padding:14px 17px;border-radius:12px;font-size:15px}
.form-status.show{display:block}
.form-status.error{background:var(--error-bg);color:var(--error-text);border:1px solid var(--error-line)}
.form-status.pending{background:var(--pending-bg);color:var(--pending-text);border:1px solid var(--pending-line)}
.form-status.ok{background:var(--ok-bg);color:var(--ok-text);border:1px solid var(--ok-line)}
.aso-steps{background:var(--paper);border:1px solid var(--line-2);border-radius:var(--radius);padding:26px}
.aso-steps ol{margin:14px 0 0;padding-left:20px;color:var(--texto-2)}
.aso-steps li{margin-bottom:10px}
.whatsapp-note{background:var(--paper);border:1px dashed var(--line);border-radius:14px;padding:14px 17px;font-size:15px;color:var(--texto-2);margin-top:16px}

/* ---------- barra de la lista de cotización ---------- */
.cart-bar{
  position:fixed;left:50%;transform:translate(-50%,140%);bottom:18px;z-index:60;
  background:var(--ink);color:var(--paper);border-radius:999px;padding:13px 22px;display:flex;gap:16px;align-items:center;
  box-shadow:var(--shadow-lg);transition:transform .3s cubic-bezier(.2,.9,.3,1.2);font:600 15.5px Inter;
}
.cart-bar.on{transform:translate(-50%,0)}
.cart-bar b{color:var(--amber)}
.cart-bar button{background:var(--orange);border:0;color:var(--paper);font:600 15px Inter;padding:10px 16px;border-radius:999px;cursor:pointer}
.cart-bar button:hover{background:var(--orange-2)}
.cart-panel{position:fixed;inset:0;z-index:70;display:none}
.cart-panel.open{display:block}
.cart-panel .ov{position:absolute;inset:0;background:var(--ink-alpha-45)}
.cart-panel .box{position:absolute;right:0;top:0;bottom:0;width:min(430px,100%);background:var(--paper);padding:26px;overflow:auto;box-shadow:var(--shadow-lg)}
.cart-panel h3{margin-bottom:6px}
.cart-list{display:grid;gap:12px;margin:18px 0}
.cart-item{display:flex;gap:12px;align-items:center;border-bottom:1px solid var(--line-2);padding-bottom:12px}
.cart-item img{width:56px;height:56px;border-radius:12px;object-fit:cover;flex:none;background:var(--media-bg)}
.cart-item b{font:700 15.5px Outfit;display:block}
.cart-item span{font-size:13.5px;color:var(--muted)}
.cart-item .rm{margin-left:auto;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:7px 10px;cursor:pointer;color:var(--muted);font-size:13px}
.cart-item .rm:hover{border-color:var(--danger);color:var(--danger)}
.badge{display:inline-flex;align-items:center;gap:6px;font:600 12.5px Inter;color:var(--muted);background:var(--media-bg);border-radius:999px;padding:5px 10px}

/* ---------- avisos ---------- */
.aviso{background:var(--paper);border:1px dashed var(--line);border-radius:var(--radius-sm);padding:16px 20px;font-size:15px;color:var(--texto-2);display:flex;gap:12px;align-items:flex-start}
.aviso svg{width:20px;height:20px;color:var(--orange);flex:none;margin-top:3px}
.cat-block{margin-bottom:44px}
.cat-block h3{margin-bottom:10px}
.cat-note{font-size:14.5px;color:var(--muted);margin-bottom:18px}

/* ---------- responsive ---------- */
@media(max-width:1080px){
  .products{grid-template-columns:repeat(3,1fr)}
  .needs{grid-template-columns:repeat(2,1fr)}
  .trust .wrap{grid-template-columns:repeat(2,1fr)}
  .site-footer .cols{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .nav{display:none}
  .menu-btn{display:block}
  .hero .wrap,.diag .wrap,.form-section .wrap{grid-template-columns:1fr}
  .hero-media{order:-1}
  .hero-float{left:12px;bottom:12px;max-width:88%}
  .steps,.policy-grid{grid-template-columns:1fr}
  .products{grid-template-columns:repeat(2,1fr)}
  .nav.open{display:flex;position:absolute;top:100%;left:0;right:0;background:var(--paper);flex-direction:column;gap:0;padding:10px var(--pad) 18px;border-bottom:1px solid var(--line);box-shadow:var(--shadow-md)}
  .nav.open a{padding:13px 0;border-bottom:1px solid var(--line-2)}
}
@media(max-width:620px){
  body{font-size:16px}
  .products{grid-template-columns:1fr}
  .needs{grid-template-columns:1fr}
  .trust .wrap,.site-footer .cols,.form-grid{grid-template-columns:1fr}
  .head-cta .button{display:none}
  .hero-actions .button{flex:1 1 100%}
  .cart-bar{left:12px;right:12px;transform:translate(0,150%);justify-content:space-between;border-radius:18px}
  .cart-bar.on{transform:translate(0,0)}
}
/* ---------- blindaje anti-desborde (móvil y grillas angostas) ---------- */
.section > .wrap > *, .form-section .wrap > *, .hero .wrap > *, .diag .wrap > *{min-width:0}
.card-foot{flex-wrap:wrap}
.card-body,.form-card,.form-grid,.field,.policy-body{min-width:0}
.field input,.field select,.field textarea{width:100%;min-width:0}
.products,.needs,.steps,.policy-grid,.trust .wrap,.form-grid{min-width:0}
@media(max-width:620px){
  .head-cart{font-size:0;padding:10px 13px;gap:6px}
  .head-cart::before{content:'🛒';font-size:16px;line-height:1}
  .head-cart .count{font-size:12.5px}
  .brand-name{font-size:17.5px}
  .brand-mark-img{width:34px;height:34px}
  .card-foot{flex-direction:column;align-items:stretch;gap:10px}
  .card-add,.card-foot .button{width:100%}
  .site-header .wrap{gap:10px}
}

@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ==== Rediseño visual (Iris, 2026-09-23): hero con foto, productos de entrada ==== */
.hero-photo{gap:40px}
.hero-image img{width:100%;height:100%;object-fit:cover;border-radius:26px;box-shadow:0 26px 60px var(--slate-alpha-22)}
.hero-image{position:relative}
.hero-image .energy-card{box-shadow:0 16px 34px var(--slate-alpha-20)}
.hero-badges{display:flex;flex-wrap:wrap;gap:10px 22px;list-style:none;padding:0;margin:26px 0 0;font-size:13px;color:var(--hero-badge-text)}
.hero-badges li:before{content:"✓";color:var(--orange);font-weight:700;margin-right:7px}
.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.product{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--paper);display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.product:hover{transform:translateY(-3px);box-shadow:0 20px 40px var(--slate-alpha-10)}
.product-img{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--cream)}
.product-img img{width:100%;height:100%;object-fit:cover;display:block}
.product-tag{position:absolute;top:12px;left:12px;background:var(--navy);color:var(--paper);font-size:11px;font-weight:700;padding:6px 11px;border-radius:100px;letter-spacing:.06em}
.product h3{font:700 20px Outfit,sans-serif;margin:18px 20px 8px;letter-spacing:-.02em;line-height:1.2}
.product p{color:var(--product-text);font-size:14.5px;line-height:1.65;margin:0 20px 18px;flex:1}
.product-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 20px 20px;flex-wrap:wrap}
.price{font:700 15px Outfit,sans-serif;color:var(--burnt)}
.button.small{padding:10px 16px;font-size:13px}
@media(max-width:900px){.product-grid{grid-template-columns:1fr 1fr}.hero-photo{gap:24px}}
@media(max-width:760px){.product-grid{grid-template-columns:1fr}.hero-image img{border-radius:20px}}

/* ==== Terminación home y accesibilidad (Codex, 2026-09-23) ==== */
.brand img{width:40px;height:40px;object-fit:cover;border-radius:12px;flex:none}
.site-footer .brand img{width:40px;height:40px;object-fit:cover;border-radius:12px;flex:none}
.skip-link{position:fixed;top:10px;left:10px;z-index:100;transform:translateY(-160%);background:var(--paper);color:var(--ink);border:2px solid var(--orange-2);border-radius:10px;padding:10px 14px;font-weight:700}
.skip-link:focus{transform:translateY(0)}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.section.dark :focus-visible,.site-footer :focus-visible{outline-color:var(--amber)}
.notice{background:var(--ink);color:var(--paper);text-align:center;font-size:13.5px;padding:9px var(--pad)}
.card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.section-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.section.dark h2{color:var(--paper)}
.section.dark .button.light{color:var(--ink)}
.trust-item .ico{color:var(--orange-2);font-weight:800}
@media(max-width:1080px){.card-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){.card-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.card-grid{grid-template-columns:1fr}.section-actions .button{width:100%}}
.button.primary,.head-cart .count,.cart-bar button{color:var(--ink)}

/* ---------- diagnóstico eólico ---------- */
.wind-hero{padding:clamp(58px,8vw,108px) 0;background:linear-gradient(145deg,var(--surface-warm) 0%,var(--wind-sky) 100%);border-bottom:1px solid var(--line-2)}
.wind-hero h1{max-width:15ch;margin-bottom:22px}
.wind-hero .lead{max-width:70ch}
.wind-split{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}
.wind-panel{background:var(--paper);border:1px solid var(--line-2);border-radius:var(--radius);padding:clamp(24px,3vw,34px);box-shadow:var(--shadow-sm)}
.wind-panel h3{font-size:clamp(23px,2.4vw,31px);margin-bottom:22px}
.wind-panel ol{margin:0;padding-left:22px;color:var(--texto-2)}
.wind-panel li{margin-bottom:18px;padding-left:4px}
.wind-panel li:last-child{margin-bottom:0}
.wind-no{border-top:5px solid var(--warning-line)}
.wind-yes{border-top:5px solid var(--ok-text)}
.content-prose{max-width:980px}
.content-prose > p{color:var(--texto-2);margin-bottom:22px}
.content-prose > h3{font-size:clamp(20px,2vw,25px);margin:32px 0 10px}
.use-list{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:14px 30px}
.use-list li{background:var(--paper);border:1px solid var(--line-2);border-radius:var(--radius-sm);padding:20px;color:var(--texto-2)}
.wind-warning{margin-top:0;border-style:solid;border-color:var(--amber-2);background:var(--pending-bg);color:var(--warning-text);font-size:clamp(16px,1.6vw,19px)}
@media(min-width:1081px){.needs{grid-template-columns:repeat(5,1fr)}}
@media(max-width:900px){.wind-split,.use-list{grid-template-columns:1fr}}

/* ---------- terminación eólica: lectura y tabla por zona ---------- */
.wind-panel li>strong,.wind-summary{display:block}
.wind-summary{margin-top:4px;color:var(--texto-2);line-height:1.5}
.wind-panel details{margin-top:7px}
.wind-panel summary{width:max-content;max-width:100%;cursor:pointer;color:var(--blue);font-weight:700}
.wind-panel details p{margin-top:7px;color:var(--muted);font-size:14.5px;line-height:1.55}
.wind-key-point{margin-bottom:22px;padding:18px 20px;border-left:5px solid var(--orange);border-radius:0 var(--radius-sm) var(--radius-sm) 0;background:var(--key-bg);color:var(--key-text);font-size:clamp(17px,1.7vw,20px)}
.wind-compare{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.wind-compare article{min-width:0;background:var(--paper);border:1px solid var(--line-2);border-radius:var(--radius);padding:clamp(22px,3vw,32px);box-shadow:var(--shadow-sm)}
.wind-compare h3{margin-bottom:12px}
.wind-compare p{color:var(--texto-2);margin-bottom:14px}
.wind-compare p:last-child{margin-bottom:0}
.wind-zones{background:var(--table-bg)}
.wind-table-wrap{max-width:100%;overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);box-shadow:var(--shadow-sm);-webkit-overflow-scrolling:touch}
.wind-table-wrap:focus-visible{outline-offset:4px}
.wind-table-wrap table{width:100%;min-width:820px;border-collapse:collapse;text-align:left}
.wind-table-wrap th,.wind-table-wrap td{padding:14px 16px;border-bottom:1px solid var(--line-2);vertical-align:top}
.wind-table-wrap thead th{background:var(--ink);color:var(--paper);font:700 14px Outfit;letter-spacing:.02em;white-space:nowrap}
.wind-table-wrap tbody th{width:29%;font:700 15px Outfit;color:var(--ink)}
.wind-table-wrap tbody td{color:var(--texto-2);font-size:14.5px;line-height:1.45}
.wind-table-wrap tbody td:nth-child(2){white-space:nowrap}
.wind-table-wrap tbody tr:last-child>*{border-bottom:0}
.wind-table-wrap tbody tr:nth-child(even){background:var(--table-alt)}
.wind-status{display:inline-flex;align-items:center;border-radius:999px;padding:5px 10px;font-weight:800;font-size:13px;white-space:nowrap}
.wind-status-yes{background:var(--status-yes-bg);color:var(--status-yes-text)}
.wind-status-maybe{background:var(--status-maybe-bg);color:var(--pending-text)}
.wind-status-no{background:var(--status-no-bg);color:var(--status-no-text)}
.wind-source{max-width:100ch;margin-top:14px;color:var(--muted);font-size:13.5px;line-height:1.55}
@media(max-width:900px){.wind-compare{grid-template-columns:1fr}}
@media(max-width:620px){
  .wind-panel{padding:22px 18px}
  .wind-table-wrap table{min-width:760px}
  .wind-table-wrap th,.wind-table-wrap td{padding:12px 13px}
}

/* ---------- disponibilidad inmediata ---------- */
.card-available{align-self:flex-start;display:inline-flex;background:var(--ink);color:var(--amber);border-radius:999px;padding:5px 10px;font:700 12.5px Inter}

/* ---------- rediseño visual eólica ---------- */
.wind-hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;align-items:center}
.wind-hero-copy{min-width:0}
.wind-hero-image{min-width:0;aspect-ratio:7/4}
.wind-hero-image img{aspect-ratio:7/4}
.wind-support-image{min-width:0;margin:0;overflow:hidden;border-radius:var(--radius);box-shadow:var(--shadow-md)}
.wind-support-image img{width:100%;height:100%;object-fit:cover}
.wind-compare-layout{display:grid;grid-template-columns:minmax(250px,.72fr) minmax(0,2fr);gap:22px;align-items:start}
.wind-hybrid-image{aspect-ratio:3/4}
.wind-hybrid-image img{object-position:center}
.wind-use-layout{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.7fr);gap:24px;align-items:start}
.wind-ranch-image{aspect-ratio:4/5}
.wind-ranch-image img{object-position:center}
.use-list{gap:16px}
.use-list li{box-shadow:var(--shadow-sm);border-radius:var(--radius);transition:transform .18s ease,box-shadow .18s ease,border-color .18s}
.use-list li:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--line)}
.use-list li strong:first-child{display:block;margin-bottom:6px;font-family:Outfit,-apple-system,'Segoe UI',system-ui,sans-serif;font-size:18px;line-height:1.25;color:var(--ink)}
.wind-guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;align-items:start}
.wind-guide-card{min-width:0;overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .18s ease,box-shadow .18s ease,border-color .18s}
.wind-guide-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--line)}
.wind-guide-card .n::before{content:attr(data-number)}
.wind-guide-card h3{margin-bottom:12px}
.wind-guide-card p{color:var(--texto-2);font-size:15.5px}
.wind-guide-card-tower img{width:calc(100% + 52px);max-width:none;height:230px;margin:24px -26px -26px;object-fit:cover}
@media(max-width:900px){
  .wind-hero .wrap,.wind-compare-layout,.wind-use-layout{grid-template-columns:1fr}
  .wind-hero-image{order:-1}
  .wind-hybrid-image{aspect-ratio:16/7}
  .wind-ranch-image{aspect-ratio:16/8}
}
@media(max-width:760px){
  .wind-guide-grid{grid-template-columns:1fr}
  .wind-support-image{border-radius:20px}
}
@media(max-width:620px){
  .wind-hero-image{aspect-ratio:4/3}
  .wind-hero-image img{aspect-ratio:4/3}
  .wind-hybrid-image,.wind-ranch-image{aspect-ratio:4/3}
  .wind-guide-card-tower img{width:calc(100% + 52px)}
}

/* ---------- selector de tema ---------- */
.theme-toggle{width:44px;height:44px;display:inline-grid;place-items:center;flex:none;padding:0;border:1.5px solid var(--line);border-radius:999px;background:var(--paper);color:var(--ink);cursor:pointer}
.theme-toggle:hover{border-color:var(--ink)}
.theme-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.theme-icon-sun{display:none}

@media(prefers-color-scheme:dark){
  :root:not([data-tema="claro"]){
    --ink:#e7eef8; --ink-2:#d8e2ed; --ink-3:#c5d1df;
    --orange:#fbbf24; --orange-2:#f59e0b; --amber:#fbbf24; --amber-2:#f59e0b;
    --blue:#93c5fd; --blue-2:#bfdbfe;
    --cream:#0b1118; --paper:#151f2b; --line:#475569; --line-2:#263548;
    --muted:#b6c3d1; --muted-2:#a5b4c5; --texto-2:#cbd5e1; --nav-text:#d7e2ed;
    --orange-soft:#3b2a18; --surface-warm:#101923; --media-bg:#1d2a38; --input-bg:#111c27;
    --hero-badge-text:#b9c7d6; --product-text:#c3ceda; --wind-sky:#132536;
    --invalid-bg:#381d24; --error-bg:#351b20; --error-text:#fecaca; --error-line:#7f1d1d;
    --pending-bg:#352814; --pending-text:#fde68a; --pending-line:#854d0e;
    --ok-bg:#142d21; --ok-text:#bbf7d0; --ok-line:#166534;
    --warning-text:#fde68a; --key-bg:#3a2118; --key-text:#fed7aa;
    --table-bg:#101923; --table-alt:#182432;
    --status-yes-bg:#143324; --status-yes-text:#bbf7d0; --status-maybe-bg:#3a2b12;
    --status-no-bg:#3b1c22; --status-no-text:#fecaca;
    --cream-alpha-88:rgba(11,17,24,.9); --paper-alpha-94:rgba(21,31,43,.94);
  }
  :root:not([data-tema="claro"]) .topbar,:root:not([data-tema="claro"]) .notice,:root:not([data-tema="claro"]) .section.dark,:root:not([data-tema="claro"]) .cta-band,:root:not([data-tema="claro"]) .site-footer,:root:not([data-tema="claro"]) .cart-bar,:root:not([data-tema="claro"]) .wind-table-wrap thead th{--ink:var(--dark-surface);--ink-3:var(--dark-surface-2);--paper:var(--light-fixed)}
  :root:not([data-tema="claro"]) .button.primary,:root:not([data-tema="claro"]) .head-cart .count,:root:not([data-tema="claro"]) .cart-bar button,:root:not([data-tema="claro"]) .card-add,:root:not([data-tema="claro"]) .chip.active,:root:not([data-tema="claro"]) .card-available{--ink:var(--dark-control);--ink-3:var(--dark-surface-2);--paper:var(--light-fixed)}
  :root:not([data-tema="claro"]) .need,:root:not([data-tema="claro"]) .product-tag{--paper:var(--light-fixed)}
  :root:not([data-tema="claro"]) .theme-icon-moon{display:none}
  :root:not([data-tema="claro"]) .theme-icon-sun{display:inline}
}

:root[data-tema="oscuro"]{
  --ink:#e7eef8; --ink-2:#d8e2ed; --ink-3:#c5d1df;
  --orange:#fbbf24; --orange-2:#f59e0b; --amber:#fbbf24; --amber-2:#f59e0b;
  --blue:#93c5fd; --blue-2:#bfdbfe;
  --cream:#0b1118; --paper:#151f2b; --line:#475569; --line-2:#263548;
  --muted:#b6c3d1; --muted-2:#a5b4c5; --texto-2:#cbd5e1; --nav-text:#d7e2ed;
  --orange-soft:#3b2a18; --surface-warm:#101923; --media-bg:#1d2a38; --input-bg:#111c27;
  --hero-badge-text:#b9c7d6; --product-text:#c3ceda; --wind-sky:#132536;
  --invalid-bg:#381d24; --error-bg:#351b20; --error-text:#fecaca; --error-line:#7f1d1d;
  --pending-bg:#352814; --pending-text:#fde68a; --pending-line:#854d0e;
  --ok-bg:#142d21; --ok-text:#bbf7d0; --ok-line:#166534;
  --warning-text:#fde68a; --key-bg:#3a2118; --key-text:#fed7aa;
  --table-bg:#101923; --table-alt:#182432;
  --status-yes-bg:#143324; --status-yes-text:#bbf7d0; --status-maybe-bg:#3a2b12;
  --status-no-bg:#3b1c22; --status-no-text:#fecaca;
  --cream-alpha-88:rgba(11,17,24,.9); --paper-alpha-94:rgba(21,31,43,.94);
}
:root[data-tema="oscuro"] .topbar,:root[data-tema="oscuro"] .notice,:root[data-tema="oscuro"] .section.dark,:root[data-tema="oscuro"] .cta-band,:root[data-tema="oscuro"] .site-footer,:root[data-tema="oscuro"] .cart-bar,:root[data-tema="oscuro"] .wind-table-wrap thead th{--ink:var(--dark-surface);--ink-3:var(--dark-surface-2);--paper:var(--light-fixed)}
:root[data-tema="oscuro"] .button.primary,:root[data-tema="oscuro"] .head-cart .count,:root[data-tema="oscuro"] .cart-bar button,:root[data-tema="oscuro"] .card-add,:root[data-tema="oscuro"] .chip.active,:root[data-tema="oscuro"] .card-available{--ink:var(--dark-control);--ink-3:var(--dark-surface-2);--paper:var(--light-fixed)}
:root[data-tema="oscuro"] .need,:root[data-tema="oscuro"] .product-tag{--paper:var(--light-fixed)}
:root[data-tema="oscuro"] .theme-icon-moon{display:none}
:root[data-tema="oscuro"] .theme-icon-sun{display:inline}
