*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:82px}body{margin:0;font:17px/1.55 Arial,sans-serif;color:#192c35}header,footer{background:#1c303a;color:white}header{display:flex;align-items:stretch;justify-content:space-between;position:sticky;top:0;z-index:2}.brand{display:flex;background:#f0d821;padding:4px 18px;align-items:center}.brand img{width:145px}nav{display:flex;align-items:center;gap:clamp(12px,2.2vw,38px);padding:12px 4vw}nav a{color:white;text-decoration:none;font-size:.88rem}a:hover{text-decoration:underline}.hero{background:linear-gradient(90deg,#112b3ded,transparent),url(img/portada.webp) center/cover;display:flex;align-items:center;min-height:390px;color:white;padding:65px max(6vw,calc((100vw - 1140px)/2))}.hero div{width:min(630px,88vw)}h1,h2,h3,p{margin:0}h1{font-size:clamp(44px,6vw,86px);line-height:1.02;letter-spacing:-.05em}.hero p{margin:18px 0 30px;font-size:22px}.btn{display:inline-block;background:#f1d92f;color:#192d35;padding:10px 22px;text-decoration:none;font-weight:bold}.wrap{width:min(1140px,90%);margin:auto;padding:64px 0}h2{font-size:clamp(30px,4vw,52px);line-height:1.1;letter-spacing:-.045em;margin-bottom:28px}.cards,.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:30px 20px}.cards img,.gallery img{width:100%;height:auto;aspect-ratio:1.6;object-fit:cover}.cards h3{font-size:20px;line-height:1.2;margin:10px 0}.cards p{font-size:15px}.about{background:#eef1f0;display:grid;grid-template-columns:1fr 1fr}.about div{padding:55px 7vw}.about p+p{margin-top:15px}.about img{width:100%;height:100%;object-fit:cover}.gallery img{aspect-ratio:1}.clients{background:#f8f8f6}.clients img{display:block;width:min(740px,100%);margin:auto}.contact{display:flex;gap:12vw}.contact p{margin:8px 0}.contact a{color:#174c65}footer{padding:24px 5%;font-size:14px}@media(max-width:800px){.cards,.gallery{grid-template-columns:repeat(2,1fr)}header{display:block;position:static}.brand{width:max-content}.brand img{width:110px}nav{flex-wrap:wrap;gap:8px 18px}.hero{min-height:330px}.about{grid-template-columns:1fr}.about img{max-height:245px}.contact{flex-wrap:wrap;gap:24px}.wrap{padding:42px 0}}@media(max-width:440px){.cards{grid-template-columns:1fr}.cards img{aspect-ratio:2.2}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.hero{position:relative;isolation:isolate;overflow:hidden;background:#213744 url(img/portada.webp) center/cover;min-height:clamp(430px,55vw,620px)}
.hero video,.hero:after{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero:after{content:"";z-index:-1;background:linear-gradient(90deg,rgba(12,30,44,.9),rgba(12,30,44,.46) 54%,rgba(12,30,44,.07))}
.hero-logo{display:block;width:clamp(185px,22vw,240px);height:auto;max-width:100%;margin-bottom:22px}.hero h1{max-width:9em}.hero p{font-size:clamp(16px,2vw,22px)}
.intro{display:grid;grid-template-columns:1fr 1fr;gap:5%;border-bottom:1px solid #ccd5d7;padding-block:34px}.cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 32px;align-items:start}.cards p,.cards li{font-size:16px;line-height:1.6}.cards p+p{margin-top:12px}.cards ul,.about ul{padding-left:1.25em;margin:10px 0 17px}.cards li+li,.about li+li{margin-top:4px}h4{margin:1rem 0 .35rem}.about{align-items:start;background:#f0f3f3}.about img{height:auto;align-self:start;margin-top:55px}.about div{padding:48px clamp(24px,4vw,74px)}.gallery img{aspect-ratio:366/386}.intro p,.cards article,.about div{min-width:0}
@media(max-width:1000px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){.about img{margin:0}.hero-inner{padding-bottom:25px}}
@media(max-width:640px){.cards,.intro{grid-template-columns:1fr;gap:24px}.cards img{width:100%;height:155px;object-fit:cover}.cards article{border-bottom:1px solid #d6dcdf;padding-bottom:16px}.hero:after{background:linear-gradient(90deg,#112734e8,#11273470)}.hero-inner{max-width:100%}.intro{padding-block:24px}}


body{isolation:isolate}
.obra-fondo{position:fixed;inset:0;z-index:-1;pointer-events:none;background:#213744 url(img/portada.webp) center/cover}
.obra-fondo video{width:100%;height:100%;object-fit:cover}
.hero{background:transparent}
main>.wrap{background:white;box-shadow:0 0 0 100vmax white;clip-path:inset(0 -100vmax)}
#nosotros,#proyectos,#clientes,#contacto{margin-top:clamp(72px,12vh,155px)}