/* Todotuberías — Bizkaia y Burgos · estático 2026 */
:root{
  --steel:#16324a; --steel-2:#1f4666; --blue:#2277b5; --blue-soft:#e7f0f7;
  --orange:#ff7a1a; --orange-dark:#e26404; --ink:#1a2530; --ink-2:#4d5f6e;
  --bg:#f5f7f9; --surface:#ffffff; --line:#dce4ea; --ok:#1a7a3d;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; font-family:-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  color:var(--ink); background:var(--bg); line-height:1.55; padding-bottom:64px;}
img{max-width:100%; height:auto; display:block}
a{color:var(--blue)}
h1,h2,h3{line-height:1.15; text-wrap:balance; color:var(--steel)}
h1{font-size:clamp(1.7rem,5.5vw,2.6rem); font-weight:800; margin:.2em 0}
h2{font-size:clamp(1.3rem,4vw,1.7rem); font-weight:800; margin:1.6em 0 .5em}
h3{font-size:1.08rem; margin:1.1em 0 .35em}
p,li{max-width:70ch}
.wrap{max-width:1060px; margin:0 auto; padding:0 18px}
.topbar{background:var(--steel); color:#fff; position:sticky; top:0; z-index:50; box-shadow:0 2px 8px rgba(22,50,74,.25)}
.topbar .wrap{display:flex; align-items:center; justify-content:space-between; gap:10px; padding-top:10px; padding-bottom:10px}
.brand{color:#fff; text-decoration:none; font-weight:800; font-size:1.05rem; letter-spacing:.02em; line-height:1.1}
.brand small{display:block; font-weight:600; font-size:.66rem; color:#a7c4da; letter-spacing:.08em}
.call-top{background:var(--orange); color:#fff; text-decoration:none; font-weight:800; padding:9px 14px; border-radius:8px; white-space:nowrap; font-size:.95rem}
.call-top:hover{background:var(--orange-dark)}
nav.mainnav{background:var(--steel-2)}
nav.mainnav .wrap{display:flex; gap:2px; overflow-x:auto; padding:0 10px}
nav.mainnav a{color:#d9e6f0; text-decoration:none; padding:9px 12px; font-size:.86rem; white-space:nowrap; border-bottom:3px solid transparent}
nav.mainnav a[aria-current="page"], nav.mainnav a:hover{color:#fff; border-bottom-color:var(--orange)}
.hero{position:relative; color:#fff; background:var(--steel)}
.hero .bg{position:absolute; inset:0; object-fit:cover; width:100%; height:100%; opacity:.30}
.hero .wrap{position:relative; padding-top:52px; padding-bottom:52px}
.hero h1{color:#fff; max-width:24ch}
.hero .sub{font-size:1.08rem; max-width:54ch; color:#e6eef5; margin:.4em 0 1em}
.cta-row{display:flex; flex-wrap:wrap; gap:12px; align-items:center}
.btn-call{background:var(--orange); color:#fff; font-weight:800; font-size:1.25rem; text-decoration:none; padding:14px 22px; border-radius:10px; display:inline-flex; gap:8px; align-items:center; box-shadow:0 4px 14px rgba(0,0,0,.3)}
.btn-call:hover{background:var(--orange-dark)}
.btn-ghost{border:2px solid #7d9cb5; color:#fff; text-decoration:none; padding:12px 18px; border-radius:10px; font-weight:700}
.btn-ghost:hover{border-color:#fff}
.trust{background:var(--surface); border-bottom:1px solid var(--line)}
.trust .wrap{display:flex; flex-wrap:wrap; gap:6px 26px; padding-top:12px; padding-bottom:12px; font-size:.88rem; font-weight:600; color:var(--ink-2)}
.trust b{color:var(--steel)}
.stars{color:#e7a500; letter-spacing:.05em}
section.block{padding:8px 0 20px}
.answer{background:var(--blue-soft); border-left:4px solid var(--blue); padding:14px 18px; border-radius:0 8px 8px 0; margin:22px 0; font-size:1.02rem}
.grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:14px; margin:14px 0}
.card{background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:16px 18px}
.card h3{margin-top:0}
.card p{font-size:.93rem; color:var(--ink-2); margin-bottom:0}
.card .ico{font-size:1.5rem}
.tablewrap{overflow-x:auto; background:var(--surface); border:1px solid var(--line); border-radius:10px; margin:14px 0}
table{border-collapse:collapse; width:100%; font-size:.92rem}
th{background:var(--steel); color:#fff; text-align:left; padding:10px 12px; font-size:.8rem; letter-spacing:.04em; text-transform:uppercase}
td{padding:10px 12px; border-bottom:1px solid var(--line); vertical-align:top}
tr:last-child td{border-bottom:none}
.steps{counter-reset:paso; list-style:none; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px}
.steps li{background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:14px 16px 14px 54px; position:relative; font-size:.93rem}
.steps li::before{counter-increment:paso; content:counter(paso); position:absolute; left:14px; top:12px; width:28px; height:28px; border-radius:50%; background:var(--orange); color:#fff; font-weight:800; display:flex; align-items:center; justify-content:center}
.checklist{list-style:none; padding:0; columns:2 260px; column-gap:30px}
.checklist li{padding-left:1.5em; position:relative; margin:.3em 0; break-inside:avoid}
.checklist li::before{content:"✓"; position:absolute; left:0; color:var(--ok); font-weight:800}
.zone{font-size:.92rem; color:var(--ink-2)}
.group-band{background:var(--surface); border:1px dashed var(--blue); border-radius:12px; padding:16px 20px; margin:22px 0; font-size:.95rem}
details.faq{background:var(--surface); border:1px solid var(--line); border-radius:10px; margin:8px 0; padding:0}
details.faq summary{cursor:pointer; font-weight:700; padding:13px 16px; color:var(--steel); list-style:none; position:relative; padding-right:38px}
details.faq summary::after{content:"+"; position:absolute; right:16px; top:10px; font-size:1.3rem; color:var(--blue)}
details.faq[open] summary::after{content:"–"}
details.faq .faq-a{padding:0 16px 14px; color:var(--ink-2); font-size:.94rem}
.cta-final{background:linear-gradient(135deg,var(--steel),var(--steel-2)); color:#fff; border-radius:14px; text-align:center; padding:34px 20px; margin:30px 0}
.cta-final h2{color:#fff; margin-top:0}
.cta-final p{margin:6px auto 16px; color:#d9e6f0}
footer{background:var(--steel); color:#c2d4e2; margin-top:30px; font-size:.88rem}
footer .wrap{padding:26px 18px; display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:20px}
footer h4{color:#fff; margin:0 0 8px; font-size:.95rem}
footer a{color:#dce8f2}
footer ul{list-style:none; margin:0; padding:0}
footer li{margin:.25em 0}
.legal{border-top:1px solid #2a5375; text-align:center; padding:12px; font-size:.78rem; color:#93b0c6}
.updated{font-size:.8rem; color:var(--ink-2); margin-top:26px}
.callbar{position:fixed; bottom:0; left:0; right:0; z-index:60; background:var(--orange); display:none}
.callbar a{display:flex; align-items:center; justify-content:center; gap:10px; padding:13px; color:#fff; font-weight:800; font-size:1.15rem; text-decoration:none}
@media (max-width:760px){ .callbar{display:block} .call-top{display:none} .checklist{columns:1} }
@media (min-width:761px){ body{padding-bottom:0} }
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }
