/* PHES · estilos de las páginas internas
   Mismos tokens, tipografías y componentes que la portada (index.html). */
:root{
  --bg:#F3F7FC; --bg2:#FFFFFF; --panel:#F8FBFE;
  --ink:#0B2143; --body:#475a72; --muted:#5F7189; --line:#E1E9F2;
  --hvac:#1F5FC0; --ctrl:#C9262C; --gas:#0E9C4A; --elec:#E0631F;
  --navy:#0A1B36;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%}
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--body);
  background:#EFF4FB; -webkit-font-smoothing:antialiased; overflow-x:hidden}
img{max-width:100%}
a{color:var(--hvac)}

/* ===== top bar (idéntica a la portada) ===== */
header{position:fixed; top:0; left:0; right:0; z-index:40; pointer-events:none}
.topbar{pointer-events:auto; margin:14px auto 0; max-width:1240px; width:calc(100% - 36px);
  display:flex; align-items:center; justify-content:space-between; gap:18px; padding:12px 18px; border-radius:14px;
  background:rgba(255,255,255,.72); border:1px solid var(--line); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  transition:box-shadow .3s, background .3s}
.topbar.scrolled{background:rgba(255,255,255,.95); box-shadow:0 10px 34px rgba(11,33,67,.10)}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none}
.brand img{height:52px; width:auto; display:block}
.top-actions{display:flex; gap:6px; align-items:center; font-family:'Oswald'; font-size:13px; letter-spacing:.1em; text-transform:uppercase}
.top-actions a{color:var(--body); text-decoration:none; transition:color .2s; padding:9px 12px; border-radius:8px}
.top-actions a:hover,.top-actions a[aria-current="page"]{color:var(--ink); background:rgba(31,95,192,.06)}
.top-actions .btn{background:var(--hvac); color:#fff; padding:10px 18px}
.top-actions .btn:hover,.top-actions .btn[aria-current="page"]{background:#1a51a6; color:#fff}
.nav-toggle{display:none; width:38px; height:38px; align-items:center; justify-content:center; padding:0;
  background:#fff; border:1px solid var(--line); border-radius:8px; cursor:pointer}
.nav-toggle span{position:relative; display:block; width:16px; height:2px; background:var(--ink); border-radius:2px}
.nav-toggle span::before,.nav-toggle span::after{content:""; position:absolute; left:0; width:16px; height:2px; background:var(--ink); border-radius:2px}
.nav-toggle span::before{top:-5px} .nav-toggle span::after{top:5px}
.mobile-menu{display:none; flex-direction:column; gap:2px; position:absolute; top:calc(100% + 8px); left:0; right:0;
  margin:0 auto; max-width:1240px; width:calc(100% - 36px); padding:8px; border-radius:14px;
  background:rgba(255,255,255,.97); border:1px solid var(--line); box-shadow:0 20px 40px -20px rgba(11,33,67,.35); pointer-events:auto}
.mobile-menu.open{display:flex}
.mobile-menu a{font-family:'Oswald'; font-size:14px; letter-spacing:.06em; text-transform:uppercase; color:var(--body);
  text-decoration:none; padding:12px 14px; border-radius:8px}
.mobile-menu a:hover{color:var(--ink); background:rgba(31,95,192,.06)}

/* ===== cabecera de página (plano técnico, como el hero) ===== */
.page-hero{position:relative; overflow:hidden; padding:168px 7vw 72px;
  background:radial-gradient(125% 95% at 28% 4%, #ffffff 0%, #f4f9fe 26%, #e8eff8 58%, #dde7f3 82%, #d4e0ee 100%)}
.page-hero::before{content:""; position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(rgba(31,95,192,.10) 1px,transparent 1px),linear-gradient(90deg,rgba(31,95,192,.10) 1px,transparent 1px),
    linear-gradient(rgba(31,95,192,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(31,95,192,.16) 1px,transparent 1px);
  background-size:40px 40px,40px 40px,200px 200px,200px 200px;
  -webkit-mask-image:linear-gradient(101deg, transparent 18%, #000 70%); mask-image:linear-gradient(101deg, transparent 18%, #000 70%)}
.page-hero .inner{position:relative; max-width:1240px; margin:0 auto}
.crumbs{display:flex; flex-wrap:wrap; gap:6px 10px; font-family:'Oswald'; font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
.crumbs a{color:var(--muted); text-decoration:none} .crumbs a:hover{color:var(--hvac)}
.crumbs span[aria-hidden]{opacity:.5}
.page-hero .kicker{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:26px; font-size:11.5px; letter-spacing:.24em; font-weight:600; color:var(--body); text-transform:uppercase}
.page-hero .kicker .tick{display:inline-block; width:30px; height:2px; background:var(--ac, linear-gradient(90deg,var(--hvac),var(--gas),var(--elec),var(--ctrl)))}
.page-hero h1{font-family:'Oswald'; font-weight:700; text-transform:uppercase; font-size:clamp(34px,6vw,76px); line-height:.98; color:var(--navy); margin-top:14px; max-width:20ch}
.page-hero h1 .a{color:var(--ac, var(--hvac))}
.page-hero .lead{margin-top:20px; max-width:62ch; font-size:17px; line-height:1.7; color:var(--body)}
.page-hero .cta-row2{display:flex; gap:13px; flex-wrap:wrap; margin-top:30px}
.cta-row2 a{font-family:'Oswald',sans-serif; font-weight:600; letter-spacing:.08em; text-transform:uppercase; font-size:13px; text-decoration:none; padding:13px 24px; border-radius:8px; transition:all .2s}
.cta-row2 .solid{background:var(--hvac); color:#fff}
.cta-row2 .solid:hover{background:#1a51a6; transform:translateY(-2px)}
.cta-row2 .out{border:1px solid rgba(10,27,54,.22); color:var(--navy); background:rgba(255,255,255,.55)}
.cta-row2 .out:hover{border-color:var(--hvac); color:var(--hvac)}

/* ===== secciones ===== */
.content{position:relative; z-index:5; background:#EFF4FB}
.sec-head{max-width:1240px; margin:80px auto 8px; padding:0 7vw}
.sec-head .ey{font-family:'Oswald'; letter-spacing:.26em; text-transform:uppercase; font-size:12px; color:var(--hvac)}
.sec-head h2{font-family:'Oswald'; font-weight:700; text-transform:uppercase; font-size:clamp(28px,4.6vw,50px); line-height:1; color:var(--ink); margin-top:10px}
.sec-head p{color:var(--body); margin-top:12px; max-width:600px; line-height:1.6}

.layout{max-width:1240px; margin:0 auto; padding:56px 7vw 0; display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:40px; align-items:start}
.card{background:var(--bg2); border:1px solid var(--line); border-radius:22px; padding:46px; box-shadow:0 30px 60px -40px rgba(11,33,67,.4)}
.prose h2{font-family:'Oswald'; font-weight:700; text-transform:uppercase; font-size:clamp(22px,2.6vw,30px); line-height:1.08; color:var(--ink); margin:38px 0 12px}
.prose h2:first-child{margin-top:0}
.prose h3{font-family:'Oswald'; font-weight:600; text-transform:uppercase; font-size:17px; letter-spacing:.02em; color:var(--ink); margin:24px 0 8px}
.prose p{line-height:1.75; font-size:15.5px; margin-bottom:14px; max-width:70ch}
.prose ul{list-style:none; margin:6px 0 18px; display:grid; gap:10px}
.prose li{position:relative; padding-left:24px; line-height:1.65; font-size:15px}
.prose li::before{content:""; position:absolute; left:0; top:.72em; width:12px; height:2px; background:var(--ac, var(--hvac))}
.prose li b{color:var(--ink); font-weight:600}
.prose a{color:var(--hvac); text-decoration:none; border-bottom:1px solid rgba(31,95,192,.3)}
.prose a:hover{border-color:var(--hvac)}

.steps{counter-reset:step; display:grid; gap:0; margin:10px 0 20px; border-top:1px solid var(--line)}
.step{counter-increment:step; display:grid; grid-template-columns:56px 1fr; gap:4px 18px; padding:18px 0; border-bottom:1px solid var(--line)}
.step::before{content:"0" counter(step); grid-row:1 / span 2; font-family:'Oswald'; font-weight:700; font-size:30px; line-height:1; color:color-mix(in srgb, var(--ac, var(--hvac)) 30%, #c7d4e4)}
.step b{font-family:'Oswald'; font-weight:600; text-transform:uppercase; font-size:16px; letter-spacing:.02em; color:var(--ink)}
.step span{font-size:14.5px; line-height:1.6}

.chips{display:flex; flex-wrap:wrap; gap:8px; margin:8px 0 18px}
.chips span{font-family:'Inter'; font-weight:600; font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--ink);
  background:color-mix(in srgb, var(--ac, var(--hvac)) 8%, #fff); border:1px solid var(--line); padding:7px 11px; border-radius:99px}

/* ===== aside ===== */
.aside{position:sticky; top:110px; display:flex; flex-direction:column; gap:18px}
.aside-card{background:var(--bg2); border:1px solid var(--line); border-radius:18px; padding:26px; box-shadow:0 20px 40px -32px rgba(11,33,67,.45)}
.aside-card.accent{background:linear-gradient(140deg,var(--hvac),#0c3f8f 70%,#0a2a63); border:0; color:#d6e4f7}
.aside-card .ey{font-family:'Oswald'; letter-spacing:.22em; text-transform:uppercase; font-size:11px; color:var(--muted)}
.aside-card.accent .ey{color:#bcd3f2}
.aside-card h3{font-family:'Oswald'; font-weight:700; text-transform:uppercase; font-size:24px; line-height:1.05; color:var(--ink); margin:8px 0 10px}
.aside-card.accent h3{color:#fff}
.aside-card p{font-size:14px; line-height:1.6}
.aside-card .btns{display:flex; flex-direction:column; gap:9px; margin-top:18px}
.aside-card .btns a{font-family:'Oswald'; letter-spacing:.08em; text-transform:uppercase; font-size:13px; text-decoration:none; text-align:center; padding:12px 16px; border-radius:9px; transition:all .2s}
.aside-card .btns .primary{background:#fff; color:var(--hvac); font-weight:600}
.aside-card .btns .primary:hover{transform:translateY(-2px)}
.aside-card .btns .ghost{border:1px solid rgba(255,255,255,.45); color:#fff}
.aside-card .btns .ghost:hover{background:rgba(255,255,255,.12)}
.link-list{list-style:none; margin-top:10px}
.link-list li{border-top:1px solid var(--line)}
.link-list li:first-child{border-top:0}
.link-list a{display:flex; align-items:center; gap:10px; padding:11px 2px; text-decoration:none; font-family:'Oswald'; font-size:14px; letter-spacing:.03em; text-transform:uppercase; color:var(--ink); transition:color .2s}
.link-list a::before{content:""; width:8px; height:8px; border-radius:50%; background:var(--c, var(--hvac)); flex:none}
.link-list a:hover,.link-list a[aria-current="page"]{color:var(--hvac)}

/* ===== tarjetas de servicio (índice) ===== */
.svc-grid{max-width:1240px; margin:0 auto; padding:34px 7vw 0; display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:18px}
.svc{position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:16px; padding:26px 24px;
  text-decoration:none; color:var(--body); box-shadow:0 14px 34px -24px rgba(11,33,67,.45); transition:transform .25s ease, box-shadow .25s ease}
.svc:hover{transform:translateY(-4px); box-shadow:0 24px 46px -26px rgba(11,33,67,.5)}
.svc .bar{width:44px; height:4px; border-radius:2px; background:var(--ac); margin-bottom:18px}
.svc h3{font-family:'Oswald'; font-weight:600; font-size:20px; text-transform:uppercase; letter-spacing:.02em; color:var(--ink); margin-bottom:9px}
.svc p{font-size:14px; line-height:1.6; flex:1}
.svc .more{margin-top:16px; font-family:'Oswald'; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--ac)}

/* ===== proyectos (mismo componente de la portada) ===== */
.projects{max-width:1240px; margin:0 auto; padding:34px 7vw 20px}
.proj{display:grid; grid-template-columns:1.02fr .98fr; gap:50px; align-items:center; padding:52px 0; border-top:1px solid var(--line); position:relative}
.proj:first-child{border-top:none}
.proj:nth-child(even){grid-template-columns:.98fr 1.02fr}
.proj:nth-child(even) .proj-media{order:2}
.proj[data-cat="hvac"]{--ac:var(--hvac)}
.proj[data-cat="inst"]{--ac:var(--ctrl)}
.proj-media{position:relative; border-radius:16px; overflow:hidden; aspect-ratio:4/3; background:#dfe8f3;
  box-shadow:0 22px 50px -26px rgba(11,33,67,.4), 0 0 0 1px var(--line); border-top:4px solid var(--ac)}
.proj-media img{width:100%; height:100%; object-fit:cover; display:block}
.proj-media .tint{position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,var(--ac)); opacity:.22; mix-blend-mode:multiply}
.proj-body{position:relative}
.proj-num{position:absolute; right:0; top:-70px; font-family:'Oswald'; font-weight:700; font-size:120px; line-height:1; color:rgba(31,95,192,.06); z-index:-1}
.proj-disc{display:inline-flex; align-items:center; gap:8px; font-family:'Oswald'; letter-spacing:.1em; text-transform:uppercase; font-size:12px;
  color:#fff; background:var(--ac); padding:6px 13px; border-radius:99px; margin-bottom:18px}
.proj h2,.proj h3{font-family:'Oswald'; font-weight:600; text-transform:uppercase; font-size:clamp(23px,2.9vw,36px); line-height:1.06; color:var(--ink); margin-bottom:14px}
.proj p{color:var(--body); line-height:1.7; font-size:15.5px; max-width:48ch}
.proj-meta{display:flex; flex-wrap:wrap; gap:16px 32px; margin-top:24px}
.proj-meta .m .k{font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-bottom:4px}
.proj-meta .m .v{font-family:'Oswald'; font-size:15px; color:var(--ink)}
.proj-high{margin-top:24px; padding:13px 18px; border-left:4px solid var(--ac); background:#fff; border-radius:0 8px 8px 0;
  box-shadow:0 6px 20px -10px rgba(11,33,67,.18); font-size:14.5px; color:var(--body)}
.proj-high b{font-family:'Oswald'; letter-spacing:.03em; color:var(--ink)}

.mini-projects{max-width:1240px; margin:0 auto; padding:30px 7vw 0; display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:18px}
.mp{background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; text-decoration:none; color:var(--body);
  box-shadow:0 14px 34px -24px rgba(11,33,67,.45); transition:transform .25s ease; border-top:4px solid var(--ac, var(--hvac))}
.mp:hover{transform:translateY(-4px)}
.mp img{display:block; width:100%; aspect-ratio:16/10; object-fit:cover; background:#dfe8f3}
.mp div{padding:18px 20px 20px}
.mp .t{font-family:'Oswald'; letter-spacing:.1em; text-transform:uppercase; font-size:11px; color:var(--ac, var(--hvac))}
.mp h3{font-family:'Oswald'; font-weight:600; text-transform:uppercase; font-size:18px; line-height:1.1; color:var(--ink); margin:6px 0 6px}
.mp p{font-size:13.5px; color:var(--muted)}

/* ===== preguntas frecuentes ===== */
.faq{max-width:1240px; margin:0 auto; padding:24px 7vw 0}
.faq details{background:#fff; border:1px solid var(--line); border-radius:14px; margin-top:12px; transition:border-color .2s}
.faq details[open]{border-color:#c3d3e6}
.faq summary{cursor:pointer; list-style:none; padding:20px 54px 20px 24px; position:relative; font-family:'Oswald'; font-weight:600; font-size:17px; letter-spacing:.02em; text-transform:uppercase; color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; position:absolute; right:22px; top:50%; transform:translateY(-50%); font-family:'Inter'; font-weight:500; font-size:24px; color:var(--hvac); transition:transform .2s}
.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq details p{padding:0 24px 22px; line-height:1.7; font-size:15px; max-width:80ch}

/* ===== clientes ===== */
.clients-grid{max-width:1100px; margin:34px auto 0; display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:16px; padding:0 7vw}
.client-logo{height:84px; display:flex; align-items:center; justify-content:center; background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:0 10px 26px -18px rgba(11,33,67,.4)}
.client-logo img{max-height:44px; max-width:120px; width:auto; object-fit:contain}

/* ===== nosotros: línea de tiempo y destacados ===== */
.sub-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin-top:8px}
.sub-card{padding:18px 18px 20px; border-right:1px solid var(--line)}
.sub-card:last-child{border-right:0}
.sub-card h3{font-family:'Oswald'; font-weight:600; font-size:15px; text-transform:uppercase; letter-spacing:.02em; color:var(--ink); margin:0 0 6px}
.sub-card p{font-size:13.5px; line-height:1.55; margin:0}
.tl-steps{display:grid; grid-template-columns:repeat(3,1fr); position:relative; margin-top:16px}
.tl-steps::before{content:""; position:absolute; left:5px; right:33.33%; top:5px; height:1px; background:var(--line)}
.tl-step{position:relative; padding-right:24px}
.tl-step .tl-dot{width:11px; height:11px; border-radius:50%; background:var(--navy); border:2px solid #fff; box-shadow:0 0 0 1px var(--line); margin-bottom:12px}
.tl-step.current .tl-dot{background:var(--hvac)}
.tl-step .tl-year{font-family:'Oswald'; font-weight:600; font-size:20px; color:var(--ink); line-height:1}
.tl-step .tl-name{font-family:'Oswald'; font-weight:600; font-size:13.5px; letter-spacing:.02em; text-transform:uppercase; color:var(--ink); margin-top:6px}
.tl-step .tl-label{font-size:12.5px; color:var(--muted); margin-top:3px}
.stats{display:grid; grid-template-columns:repeat(4,1fr); gap:24px; margin:6px 0 10px}
.stat .n{font-family:'Oswald'; font-weight:700; font-size:clamp(32px,4vw,48px); line-height:1}
.stat .n span{font-size:.5em; vertical-align:super}
.stats .stat:nth-child(1) .n{color:var(--hvac)} .stats .stat:nth-child(2) .n{color:var(--ctrl)}
.stats .stat:nth-child(3) .n{color:var(--gas)} .stats .stat:nth-child(4) .n{color:var(--elec)}
.stat .l{margin-top:8px; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}

/* ===== CTA (bloque de color, igual a la portada) ===== */
.cta{position:relative; z-index:5; max-width:1240px; margin:80px auto 0; padding:0 7vw}
.cta-inner{background:linear-gradient(120deg,var(--hvac),#0c3f8f 60%,#0a2a63); border-radius:24px; padding:74px 8%; text-align:center; position:relative; overflow:hidden}
.cta-inner::before{content:""; position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px); background-size:46px 46px}
.cta .ey{position:relative; font-family:'Oswald'; letter-spacing:.26em; text-transform:uppercase; font-size:12px; color:#bcd3f2}
.cta h2{position:relative; font-family:'Oswald'; font-weight:700; text-transform:uppercase; font-size:clamp(30px,5vw,66px); line-height:.98; color:#fff; margin:12px 0 10px}
.cta p{position:relative; color:#d6e4f7; max-width:520px; margin:0 auto 30px; line-height:1.6}
.cta-row{position:relative; display:flex; gap:14px; justify-content:center; flex-wrap:wrap}
.cta-row a{font-family:'Oswald'; letter-spacing:.08em; text-transform:uppercase; font-size:14px; text-decoration:none; padding:15px 30px; border-radius:9px; transition:all .2s}
.cta-row .primary{background:#fff; color:var(--hvac); font-weight:600} .cta-row .primary:hover{transform:translateY(-2px)}
.cta-row .ghost{border:1px solid rgba(255,255,255,.45); color:#fff} .cta-row .ghost:hover{background:rgba(255,255,255,.12)}

/* ===== contacto (igual a la portada) ===== */
.contact{position:relative; z-index:5; max-width:1240px; margin:0 auto; padding:56px 7vw 0}
.contact-grid{display:grid; grid-template-columns:1fr 1.05fr; gap:48px; align-items:start}
.contact-info .ey{font-family:'Oswald'; letter-spacing:.26em; text-transform:uppercase; font-size:12px; color:var(--hvac)}
.contact-info h2{font-family:'Oswald'; font-weight:700; text-transform:uppercase; font-size:clamp(28px,4.4vw,50px); line-height:1; color:var(--ink); margin:10px 0 14px}
.contact-info > p{color:var(--body); line-height:1.7; max-width:44ch}
.contact-items{margin-top:26px; display:grid; grid-template-columns:1fr 1fr; gap:13px}
.ci{display:flex; flex-direction:column; gap:3px; padding:14px 16px; background:#fff; border:1px solid var(--line); border-radius:12px; text-decoration:none; transition:transform .2s, border-color .2s}
a.ci:hover{border-color:var(--hvac); transform:translateY(-2px)}
.ci-k{font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted)}
.ci-v{font-family:'Oswald'; font-size:15px; color:var(--ink)}
.contact-form{position:relative; display:flex; flex-direction:column; gap:14px; background:#fff; border:1px solid var(--line); border-radius:20px; padding:30px; box-shadow:0 30px 60px -42px rgba(11,33,67,.45)}
.contact-form label{display:flex; flex-direction:column; gap:7px; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); font-weight:600}
.contact-form input,.contact-form textarea{font-family:'Inter',sans-serif; font-size:15px; color:var(--ink); padding:12px 14px; border:1px solid var(--line); border-radius:10px; background:#f7fbfe; resize:vertical; transition:border-color .2s, box-shadow .2s}
.contact-form input:focus,.contact-form textarea:focus{outline:none; border-color:var(--hvac); box-shadow:0 0 0 3px rgba(31,95,192,.12)}
.contact-form button{font-family:'Oswald',sans-serif; letter-spacing:.08em; text-transform:uppercase; font-size:14px; background:var(--hvac); color:#fff; border:none; border-radius:10px; padding:14px; cursor:pointer; transition:background .2s, transform .2s}
.contact-form button:hover{background:#1a51a6; transform:translateY(-1px)}
.contact-form button:disabled{opacity:.7; cursor:wait; transform:none}
.form-note{font-size:11px; color:var(--muted); text-align:center}
.form-note.ok{color:var(--gas); font-size:13px; font-weight:600}
.form-note.err{color:var(--ctrl); font-size:12.5px; font-weight:600}
.hp{position:absolute !important; left:-10000px !important; width:1px; height:1px; overflow:hidden}
.contact-form label.consent{flex-direction:row; align-items:flex-start; gap:10px; font-size:13px; font-weight:400; letter-spacing:0; text-transform:none; line-height:1.5; color:var(--body); cursor:pointer}
.contact-form label.consent input{width:18px; height:18px; margin-top:1px; flex:none; accent-color:var(--hvac); padding:0}
.contact-form label.consent a{color:var(--hvac)}

/* ===== footer (igual a la portada) ===== */
footer{position:relative; z-index:5; margin-top:80px; padding:34px 7vw; border-top:1px solid var(--line); text-align:center; color:var(--muted); font-size:12.5px; background:rgba(255,255,255,.5)}
footer img{height:30px; margin-bottom:12px}
footer .footer-nav{display:flex; flex-wrap:wrap; justify-content:center; gap:8px 20px; margin-bottom:14px; font-family:'Oswald'; font-size:11.5px; letter-spacing:.1em; text-transform:uppercase}
footer .footer-nav a{color:var(--muted); text-decoration:none; transition:color .2s}
footer .footer-nav a:hover{color:var(--hvac)}
footer .footer-nav.sm{font-size:10.5px; gap:6px 16px; opacity:.9}

/* ===== aparición al hacer scroll ===== */
.reveal{opacity:0; transform:translateY(14px); transition:opacity .45s cubic-bezier(.16,1,.3,1), transform .45s cubic-bezier(.16,1,.3,1)}
.reveal.show{opacity:1; transform:none}
html.no-js .reveal{opacity:1; transform:none}
@media (prefers-reduced-motion: reduce){ .reveal{opacity:1; transform:none; transition:none} }

/* ===== legal ===== */
.prose .summary{background:#F3F7FC; border:1px solid var(--line); border-left:4px solid var(--hvac); border-radius:0 12px 12px 0; padding:20px 24px 8px; margin-bottom:30px}
.prose .summary h2{margin-top:0; font-size:20px}
.legal .prose p,.legal .prose li{font-size:15px}

/* ===== responsive ===== */
@media (max-width:1020px){
  .layout{grid-template-columns:1fr}
  .aside{position:static}
}
@media (max-width:860px){
  .nav-toggle{display:inline-flex}
  .brand img{height:44px}
  .top-actions a.hide-sm{display:none}
  .page-hero{padding:140px 6vw 56px}
  .proj, .proj:nth-child(even){grid-template-columns:1fr; gap:24px}
  .proj:nth-child(even) .proj-media{order:0}
  .proj-num{display:none}
  .contact-grid{grid-template-columns:1fr; gap:28px}
  .card{padding:28px}
  .sub-grid{grid-template-columns:1fr}
  .sub-card{border-right:0; border-bottom:1px solid var(--line)}
  .sub-card:last-child{border-bottom:0}
  .tl-steps{grid-template-columns:1fr; gap:22px}
  .tl-steps::before{left:5px; right:auto; top:5px; bottom:5px; width:1px; height:auto}
  .tl-step{padding-right:0; padding-left:26px}
  .tl-step .tl-dot{position:absolute; left:0; top:5px; margin-bottom:0}
  .stats{grid-template-columns:repeat(2,1fr); gap:26px 18px}
}
@media (max-width:640px){
  .page-hero .lead{font-size:15.5px}
  .page-hero .cta-row2{flex-direction:column; align-items:stretch; gap:10px}
  .page-hero .cta-row2 a{text-align:center; min-height:44px; display:flex; align-items:center; justify-content:center}
  .layout{padding:36px 6vw 0}
  .card{padding:22px}
  .contact{padding:40px 6vw 0}
  .contact-items{grid-template-columns:1fr; gap:10px}
  .contact-form{padding:22px}
  .contact-form input,.contact-form textarea{font-size:16px}
  .clients-grid{grid-template-columns:repeat(2,1fr)}
  .client-logo{height:64px; border-radius:10px}
  .client-logo img{max-height:32px; max-width:92px}
  .cta-inner{padding:48px 7%}
  .cta-row{flex-direction:column; align-items:stretch}
  .cta-row a{text-align:center; min-height:44px; display:flex; align-items:center; justify-content:center}
  .faq summary{font-size:15px; padding:18px 48px 18px 18px}
  .faq details p{padding:0 18px 18px}
  footer{padding:26px 6vw}
}
@media (max-width:430px){
  .topbar{padding:10px 14px; gap:10px}
  .top-actions{gap:4px}
  .top-actions .btn{padding:9px 14px; font-size:12px}
}