:root{
  --navy:#305581; --navy-d:#23405F; --navy-x:#15283C;
  --steel:#457CA3; --steel-l:#7FA8C6;
  --red:#FF0000; --red-d:#D10000;
  --grey:#666666; --grey-2:#8C9199;
  --line:#E7E7E3; --line-2:#EFEFEC;
  --bg:#FFFFFF; --bg-2:#F7F7F4;
  --ink:#14191F;
  --sans:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --serif:'Cormorant Garamond',Georgia,serif;
  --sh-s:0 1px 2px rgba(20,25,31,.05), 0 6px 18px -10px rgba(48,85,129,.25);
  --sh-m:0 2px 8px rgba(20,25,31,.05), 0 24px 50px -24px rgba(48,85,129,.3);
  --sh-l:0 40px 90px -40px rgba(21,40,60,.5);
  --pad:clamp(20px,5vw,80px);
  --ease:cubic-bezier(.22,.61,.36,1);
  --out:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.65 var(--sans);overflow-x:hidden}
body.lock{overflow:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
h1,h2,h3,h4{margin:0;letter-spacing:-.025em;line-height:1.05;font-weight:600}
p{margin:0}
::selection{background:var(--navy);color:#fff}

.wrap{max-width:1320px;margin:0 auto;padding:0 var(--pad)}
.eyebrow{font:600 11px/1 var(--sans);letter-spacing:.26em;text-transform:uppercase;color:var(--steel);display:flex;align-items:center;gap:12px}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--red);flex:none}
.serif{font-family:var(--serif);font-weight:300;font-style:italic;letter-spacing:-.005em}
.h-l{font-size:clamp(30px,4.6vw,60px)}
.lead{font-size:clamp(15.5px,1.3vw,18.5px);color:var(--grey);max-width:58ch;font-weight:300}
.sec{padding:clamp(72px,9vw,150px) 0;position:relative}
.tint{background:var(--bg-2)}

.rv{opacity:0;transform:translate3d(0,26px,0);transition:opacity .95s var(--out),transform .95s var(--out)}
.rv.in{opacity:1;transform:none}
.d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}
.d4{transition-delay:.32s}.d5{transition-delay:.4s}
.rvw{display:inline-block;overflow:hidden;vertical-align:bottom}
.rvw>i{display:inline-block;font-style:inherit;transform:translate3d(0,110%,0);transition:transform 1.1s var(--out)}
.rvw.in>i{transform:none}

/* imagen con fundido al cargar */
.im{position:relative;overflow:hidden;background:linear-gradient(135deg,#E9EDF1,#DCE3EA)}
.im img{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .9s var(--ease),transform 1.6s var(--ease)}
.im img.ld{opacity:1}

.btn{--c:var(--navy);position:relative;display:inline-flex;align-items:center;gap:12px;padding:16px 28px;
  border-radius:999px;overflow:hidden;isolation:isolate;font-weight:600;font-size:14.5px;background:var(--c);color:#fff;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease);box-shadow:0 10px 24px -12px rgba(48,85,129,.6)}
.btn::after{content:"";position:absolute;inset:0;z-index:-1;background:var(--red);transform:translateY(101%);transition:transform .55s var(--out)}
.btn:hover{transform:translateY(-3px);box-shadow:0 18px 34px -14px rgba(255,0,0,.4)}
.btn:hover::after{transform:none}
.btn .ar{transition:transform .45s var(--ease)}
.btn:hover .ar{transform:translateX(5px)}
.btn.lite{background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.lnk{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:14px;color:var(--navy);padding-bottom:5px;position:relative}
.lnk::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--line)}
.lnk::before{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--out);z-index:1}
.lnk:hover::before{transform:none}


#load{position:fixed;inset:0;z-index:9500;background:#fff;display:grid;place-items:center;transition:opacity .8s var(--ease),visibility .8s}
#load.off{opacity:0;visibility:hidden}
#load .nm{font:700 13px/1 var(--sans);letter-spacing:.44em;text-transform:uppercase;color:var(--navy);text-align:center}
#load .bar{width:190px;height:2px;background:var(--line);overflow:hidden;margin-top:22px}
#load .bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--navy),var(--red));animation:ld 1.2s var(--out) forwards}
@keyframes ld{to{width:100%}}
#prog{position:fixed;top:0;left:0;height:2px;width:0;background:var(--red);z-index:8000}

/* ---------- header ---------- */
header{position:fixed;top:0;left:0;right:0;z-index:7000;padding:max(16px,env(safe-area-inset-top)) 0 16px;
  transition:background .5s var(--ease),box-shadow .5s var(--ease),padding .5s var(--ease)}
header.stick{background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(16px) saturate(1.6);backdrop-filter:blur(16px) saturate(1.6);
  box-shadow:0 1px 0 var(--line),0 12px 34px -26px rgba(21,40,60,.5);padding-top:11px;padding-bottom:11px}
.hd{display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;flex:none}
.mk{height:48px;box-sizing:border-box;display:flex;align-items:center;flex:none;border-radius:11px;
  transition:height .5s var(--ease),padding .5s var(--ease),background .5s var(--ease)}
.mk img{height:100%;width:auto;display:block}
.brand .tx b{display:block;font:700 15px/1.1 var(--sans);letter-spacing:.1em;color:var(--navy);text-transform:uppercase}
.brand .tx span{display:block;margin-top:3px;font:600 8.5px/1 var(--sans);letter-spacing:.32em;color:var(--red);text-transform:uppercase}
header.stick .mk{height:40px}
.wh header .brand .tx b,.wh .brand .tx b{color:#fff}
nav{display:flex;align-items:center;gap:4px}
nav a{position:relative;padding:10px 14px;font-size:14px;font-weight:500;color:var(--ink);transition:color .35s var(--ease)}
nav a::after{content:"";position:absolute;left:50%;bottom:4px;width:4px;height:4px;border-radius:50%;background:var(--red);transform:translate(-50%,6px) scale(0);transition:transform .4s var(--out)}
nav a:hover,nav a.on{color:var(--navy)}
nav a:hover::after,nav a.on::after{transform:translate(-50%,0) scale(1)}
.hd .cta{display:flex;align-items:center;gap:10px;flex:none}
.hd .btn{padding:13px 22px;font-size:13.5px}
.burger{display:none;width:46px;height:46px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line);place-items:center;gap:5px;flex-direction:column}
.burger i{width:17px;height:1.5px;background:var(--navy);display:block;transition:transform .4s var(--ease),opacity .3s}
body.menu .burger i:nth-child(1){transform:translateY(3.25px) rotate(45deg)}
body.menu .burger i:nth-child(2){opacity:0}
body.menu .burger i:nth-child(3){transform:translateY(-3.25px) rotate(-45deg)}
@media(max-width:1080px){nav,.hd .cta .btn{display:none}.burger{display:flex}}
/* header sobre el hero */
header:not(.stick) nav a{color:rgba(255,255,255,.88)}
header:not(.stick) nav a:hover,header:not(.stick) nav a.on{color:#fff}
header:not(.stick) .brand .tx b{color:#fff}
header:not(.stick) .brand .tx span{color:rgba(255,255,255,.62)}
header:not(.stick) .mk{background:rgba(255,255,255,.95);padding:5px 9px;height:50px;box-shadow:0 6px 18px -10px rgba(0,0,0,.5)}
header:not(.stick) .burger{box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
header:not(.stick) .burger i{background:#fff}

#mob{position:fixed;inset:0;z-index:6900;background:var(--navy-x);color:#fff;padding:110px var(--pad) 40px;
  display:flex;flex-direction:column;justify-content:space-between;clip-path:circle(0% at calc(100% - 46px) 46px);transition:clip-path .85s var(--out)}
body.menu #mob{clip-path:circle(160% at calc(100% - 46px) 46px)}
#mob ul{list-style:none;margin:0;padding:0}
#mob li{overflow:hidden;border-bottom:1px solid rgba(255,255,255,.13)}
#mob li a{display:block;padding:17px 0;font-size:clamp(26px,7vw,40px);font-weight:300;font-family:var(--serif);font-style:italic;
  transform:translateY(105%);transition:transform .8s var(--out)}
body.menu #mob li a{transform:none}
body.menu #mob li:nth-child(2) a{transition-delay:.06s}body.menu #mob li:nth-child(3) a{transition-delay:.12s}
body.menu #mob li:nth-child(4) a{transition-delay:.18s}body.menu #mob li:nth-child(5) a{transition-delay:.24s}
body.menu #mob li:nth-child(6) a{transition-delay:.3s}
#mob .foot{font-size:14px;color:rgba(255,255,255,.65);display:grid;gap:6px}
#mob .foot a{color:#fff;font-weight:600}

/* ---------- hero ---------- */
#hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;background:var(--navy-x)}
.slides{position:absolute;inset:0;z-index:0}
.sl{position:absolute;inset:0;opacity:0;transition:opacity 1.6s var(--ease)}
.sl.on{opacity:1}
.sl img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 9s linear}
.sl.on img{transform:scale(1.14)}
#hero .veil{position:absolute;inset:0;z-index:1;background:
  linear-gradient(100deg,rgba(21,40,60,.88) 0%,rgba(21,40,60,.6) 42%,rgba(21,40,60,.25) 78%,rgba(21,40,60,.35) 100%),
  linear-gradient(180deg,rgba(21,40,60,.55) 0%,rgba(21,40,60,.2) 36%,rgba(21,40,60,.88) 100%),
  radial-gradient(75% 60% at 0% 100%,rgba(48,85,129,.5),transparent 62%)}
#hero .grid{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.35;
  background-image:linear-gradient(to right,rgba(255,255,255,.1) 1px,transparent 1px);background-size:calc(100%/6) 100%}
#hero .inner{position:relative;z-index:3;width:100%;padding-bottom:clamp(40px,7vh,80px);padding-top:160px;color:#fff}
#hero .eyebrow{color:rgba(255,255,255,.72)}
#hero h1{margin:26px 0 0;font-weight:300;font-size:clamp(40px,7.4vw,92px);letter-spacing:-.04em;max-width:16ch}
#hero h1 b{font-weight:600}
#hero h1 .serif{color:var(--steel-l)}
#hero .sub{margin-top:26px;max-width:46ch;color:rgba(255,255,255,.78);font-weight:300;font-size:clamp(15.5px,1.3vw,18.5px)}
#hero .acts{display:flex;flex-wrap:wrap;gap:14px;margin-top:38px}
#hero .bar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:clamp(40px,6vh,64px);
  padding-top:22px;border-top:1px solid rgba(255,255,255,.18);flex-wrap:wrap}
#hero .facts{display:flex;gap:clamp(20px,4vw,54px);flex-wrap:wrap}
#hero .facts div b{display:block;font-family:var(--serif);font-style:italic;font-size:clamp(26px,3vw,38px);line-height:1;color:#fff}
#hero .facts div span{display:block;margin-top:6px;font:600 10.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.dots{display:flex;gap:8px;align-items:center}
.dots button{width:34px;height:28px;background:none;position:relative;display:flex;align-items:center}
.dots button::before,.dots button i{content:"";position:absolute;left:0;right:0;top:50%;height:3px;margin-top:-1.5px;border-radius:2px}
.dots button::before{background:rgba(255,255,255,.28)}
.dots button i{background:var(--red);transform:scaleX(0);transform-origin:left}
.dots button.on i{animation:fill 6s linear forwards}
@keyframes fill{to{transform:scaleX(1)}}
@media(max-width:760px){#hero .grid{background-size:50% 100%}}

/* ---------- marquesina ---------- */
.mq{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:21px 0;overflow:hidden;background:#fff}
.mq .tr{display:flex;width:max-content;animation:mq 38s linear infinite}
.mq:hover .tr{animation-play-state:paused}
.mq span{display:flex;align-items:center;gap:52px;padding-right:52px;font:600 12.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--grey);white-space:nowrap}
.mq span::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--red);flex:none}
@keyframes mq{to{transform:translateX(-50%)}}

/* ---------- estudio ---------- */
.ab{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,90px);align-items:center}
@media(max-width:960px){.ab{grid-template-columns:1fr}}
.ab .vis{position:relative}
.ab .im{aspect-ratio:4/5;border-radius:3px;box-shadow:var(--sh-l)}
.ab .im:hover img{transform:scale(1.05)}
.ab .badge{position:absolute;right:-20px;bottom:30px;background:#fff;padding:22px 26px;box-shadow:var(--sh-m);max-width:238px}
.ab .badge b{display:block;font-family:var(--serif);font-style:italic;font-size:40px;line-height:1;color:var(--navy)}
.ab .badge span{display:block;margin-top:6px;font:600 11px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}
.ab .badge::before{content:"";position:absolute;left:-13px;top:22px;bottom:22px;width:2px;background:var(--red)}
@media(max-width:960px){.ab .badge{right:16px}}
.ab h2{margin:22px 0 0}
.ab p{margin-top:20px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:46px;background:var(--line)}
.stats div{background:#fff;padding:24px 16px}
.stats b{display:block;font-size:clamp(28px,3.4vw,42px);font-weight:300;letter-spacing:-.04em;color:var(--navy);font-family:var(--serif)}
.stats span{display:block;margin-top:4px;font:600 10.5px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--grey-2)}
@media(max-width:700px){.stats{grid-template-columns:repeat(2,1fr)}}

/* ---------- servicios ---------- */
.sv-hd{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;flex-wrap:wrap;margin-bottom:clamp(36px,5vw,64px)}
.sv{display:grid;grid-template-columns:.88fr 1.12fr;gap:clamp(28px,4vw,72px);align-items:start}
@media(max-width:960px){.sv{grid-template-columns:1fr}}
.sv-list{border-top:1px solid var(--line)}
.sv-it{width:100%;display:flex;align-items:center;gap:18px;padding:20px 6px;text-align:left;border-bottom:1px solid var(--line);
  position:relative;transition:padding-left .45s var(--ease)}
.sv-it .no{font:600 11px/1 var(--sans);color:var(--grey-2);letter-spacing:.1em;flex:none;width:26px;transition:color .4s}
.sv-it .nm{flex:1;font-size:clamp(17px,1.9vw,23px);font-weight:500;letter-spacing:-.02em;transition:color .4s var(--ease)}
.sv-it .pl{flex:none;width:22px;height:22px;position:relative;opacity:.3;transition:opacity .4s}
.sv-it .pl::before,.sv-it .pl::after{content:"";position:absolute;background:var(--navy);transition:transform .45s var(--out)}
.sv-it .pl::before{left:0;right:0;top:50%;height:1px;margin-top:-.5px}
.sv-it .pl::after{top:0;bottom:0;left:50%;width:1px;margin-left:-.5px}
.sv-it::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--red);transform:scaleY(0);transition:transform .5s var(--out)}
.sv-it:hover{padding-left:18px}
.sv-it:hover .nm{color:var(--navy)}
.sv-it.on{padding-left:18px}
.sv-it.on::before{transform:none}
.sv-it.on .nm{color:var(--navy);font-weight:600}
.sv-it.on .no{color:var(--red)}
.sv-it.on .pl{opacity:1}
.sv-it.on .pl::after{transform:rotate(90deg)}
.sv-panel{position:sticky;top:116px}
.sv-card{background:#fff;box-shadow:var(--sh-m);overflow:hidden}
.sv-card .im{aspect-ratio:16/10}
.sv-card .im.none{background:linear-gradient(135deg,var(--navy) 0%,var(--steel) 100%);display:grid;place-items:center}
.sv-card .im.none b{font-family:var(--serif);font-style:italic;font-size:clamp(40px,6vw,78px);color:rgba(255,255,255,.3);line-height:1}
.sv-card .bd{padding:clamp(24px,3vw,40px)}
.sv-card .no{font:600 11px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--red)}
.sv-card h3{margin:14px 0;font-size:clamp(21px,2.4vw,31px);color:var(--navy)}
.sv-card p{color:var(--grey);font-weight:300;font-size:15.5px}
.sv-card ul{margin:18px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.sv-card li{font-size:12.5px;color:var(--navy);background:var(--bg-2);padding:7px 13px;border-radius:999px}
.fade{animation:fade .6s var(--out)}
@keyframes fade{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(max-width:960px){.sv-panel{position:static;margin-top:10px}}

/* ---------- acabado (mosaico) ---------- */
.mos{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(12px,1.6vw,22px);align-items:end}
.mos .a{grid-column:1/6}.mos .b{grid-column:6/10}.mos .c{grid-column:10/13}
.mos .im{border-radius:3px;box-shadow:var(--sh-s)}
.mos .a .im{aspect-ratio:3/4}.mos .b .im{aspect-ratio:4/5}.mos .c .im{aspect-ratio:3/4}
.mos cap,.mos .cap{display:block;margin-top:12px;font:600 10.5px/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--grey-2)}
@media(max-width:860px){.mos{grid-template-columns:1fr 1fr}.mos .a{grid-column:1/2}.mos .b{grid-column:2/3}.mos .c{grid-column:1/3}.mos .c .im{aspect-ratio:16/9}}

/* ---------- proyectos ---------- */
.pj-hd{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;flex-wrap:wrap;margin-bottom:clamp(30px,4vw,52px)}
.rail{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--pad) 26px;cursor:grab;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.rail.drag{cursor:grabbing;scroll-snap-type:none}
.rail.drag *{pointer-events:none}
.card{flex:0 0 clamp(250px,30vw,400px);scroll-snap-align:center;position:relative;overflow:hidden;background:var(--navy-d);
  aspect-ratio:3/4;box-shadow:var(--sh-s);transition:transform .7s var(--ease),box-shadow .7s var(--ease)}
.card .im{position:absolute;inset:0}
.card::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(21,40,60,.88) 0%,rgba(21,40,60,.08) 48%,transparent 72%);transition:opacity .6s}
.card .cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:26px;color:#fff}
.card .cap b{display:block;font-size:18.5px;font-weight:600;letter-spacing:-.02em}
.card .cap span{display:block;margin-top:5px;font:600 11px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.card .zoom{position:absolute;right:18px;top:18px;z-index:2;width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:grid;place-items:center;color:#fff;opacity:0;transform:scale(.8);transition:.45s var(--ease)}
.card:hover{transform:translateY(-8px);box-shadow:var(--sh-l)}
.card:hover .im img{transform:scale(1.07)}
.card:hover .zoom{opacity:1;transform:none}
.rail-nav{display:flex;align-items:center;gap:10px}
.rbtn{width:48px;height:48px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line);display:grid;place-items:center;color:var(--navy);transition:.4s var(--ease)}
.rbtn:hover{background:var(--navy);color:#fff;box-shadow:none}
.rline{height:2px;background:var(--line);margin:0 var(--pad);position:relative;overflow:hidden}
.rline i{position:absolute;top:0;bottom:0;left:0;width:18%;background:var(--red);transition:left .12s linear,width .25s var(--ease)}

/* ---------- proceso ---------- */
.pr{position:relative;margin-top:clamp(36px,5vw,60px)}
.pr .track{position:absolute;left:26px;top:14px;bottom:14px;width:1px;background:var(--line)}
.pr .track i{position:absolute;left:0;top:0;width:100%;height:0;background:var(--red)}
.step{display:grid;grid-template-columns:54px 1fr;gap:clamp(18px,3vw,40px);padding:clamp(20px,3vw,34px) 0;align-items:start;position:relative}
.step+.step{border-top:1px solid var(--line)}
.step .dot{width:54px;height:54px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px var(--line);display:grid;place-items:center;
  font:600 13px/1 var(--sans);color:var(--grey-2);z-index:2;transition:.6s var(--ease)}
.tint .step .dot{background:var(--bg-2)}
.step.in .dot{background:var(--navy);color:#fff;box-shadow:0 10px 24px -12px rgba(48,85,129,.7)}
.step .bd{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(16px,3vw,44px);align-items:baseline}
@media(max-width:820px){.step .bd{grid-template-columns:1fr;gap:8px}}
.step h3{font-size:clamp(19px,2.1vw,27px);font-weight:500}
.step p{color:var(--grey);font-weight:300;font-size:15.5px}

/* ---------- valores ---------- */
.vals{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);margin-top:clamp(30px,4vw,50px)}
@media(max-width:880px){.vals{grid-template-columns:1fr}}
.val{background:#fff;padding:clamp(28px,3.4vw,48px);position:relative;overflow:hidden}
.val::before{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--out)}
.val:hover::before{transform:none}
.val .ic{width:42px;height:42px;color:var(--steel);margin-bottom:22px}
.val h3{font-size:19px;font-weight:600;color:var(--navy)}
.val p{margin-top:10px;color:var(--grey);font-size:15px;font-weight:300}

/* ---------- luxury ---------- */
.lux{position:relative;overflow:hidden;color:#fff;background:var(--navy-x);padding:clamp(40px,6vw,90px);
  display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center}
@media(max-width:880px){.lux{grid-template-columns:1fr}}
.lux::before{content:"";position:absolute;inset:0;background:radial-gradient(80% 110% at 88% 8%,rgba(69,124,163,.5),transparent 62%),radial-gradient(60% 80% at 0% 100%,rgba(255,0,0,.12),transparent 60%)}
.lux>*{position:relative;z-index:1}
.lux h2{font-weight:300;font-size:clamp(26px,3.4vw,46px)}
.lux p{margin-top:18px;color:rgba(255,255,255,.72);font-weight:300;max-width:46ch}
.lux .mark{font-family:var(--serif);font-style:italic;font-size:clamp(54px,9vw,124px);line-height:.85;color:rgba(255,255,255,.13);text-align:right}

/* ---------- contacto ---------- */
.ct{display:grid;grid-template-columns:1fr 1.12fr;gap:clamp(34px,5vw,84px);align-items:start}
@media(max-width:960px){.ct{grid-template-columns:1fr}}
.ct-row{display:flex;gap:16px;align-items:center;padding:20px 0;border-bottom:1px solid var(--line)}
.ct-row:first-of-type{border-top:1px solid var(--line)}
.ct-row .ic{width:42px;height:42px;border-radius:50%;background:#fff;display:grid;place-items:center;color:var(--navy);flex:none;transition:.45s var(--ease)}
.ct-row:hover .ic{background:var(--navy);color:#fff}
.ct-row .tx small{display:block;font:600 10.5px/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--grey-2)}
.ct-row .tx b{font-size:17px;font-weight:600;letter-spacing:-.01em}
form{display:grid;gap:14px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:600px){.f2{grid-template-columns:1fr}}
.fld{position:relative}
.fld input,.fld textarea,.fld select{width:100%;padding:26px 18px 12px;border:0;border-radius:3px;background-color:#fff;
  font:400 15.5px/1.4 var(--sans);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line);transition:box-shadow .4s var(--ease);-webkit-appearance:none;appearance:none}
.fld textarea{min-height:126px;resize:vertical}
.fld select{padding-right:44px;cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23305581' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 18px center;background-size:12px 8px}
.fld label{position:absolute;left:18px;top:19px;font-size:15px;color:var(--grey-2);pointer-events:none;transition:.32s var(--ease)}
.fld input:focus,.fld textarea:focus,.fld select:focus{outline:0;box-shadow:inset 0 0 0 1.5px var(--navy)}
.fld input:focus+label,.fld textarea:focus+label,.fld input.has+label,.fld textarea.has+label,.fld select.has+label,.fld select:focus+label{
  top:9px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--navy);font-weight:600}
.fld.err input,.fld.err textarea,.fld.err select{box-shadow:inset 0 0 0 1.5px var(--red)}
.fld .msg{display:none;margin-top:6px;font-size:12px;color:var(--red);font-weight:600}
.fld.err .msg{display:block}
.chk{display:flex;gap:12px;align-items:flex-start;font-size:13px;color:var(--grey);line-height:1.5}
.chk input{margin-top:3px;accent-color:var(--navy);width:16px;height:16px;flex:none}
.sent{display:none;background:var(--navy);color:#fff;padding:34px;text-align:center;animation:fade .6s var(--out)}
.sent.show{display:block}
.sent b{display:block;font-size:21px;font-weight:600;margin-bottom:8px}
.sent span{color:rgba(255,255,255,.75);font-size:14.5px;font-weight:300}

/* ---------- footer ---------- */
footer{background:var(--navy-x);color:#fff;padding:clamp(50px,6vw,92px) 0 30px}
.ft{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:40px}
@media(max-width:880px){.ft{grid-template-columns:1fr}}
footer .brand .tx b{color:#fff}
footer .brand .tx span{color:#FF5A5A}
footer .mk{background:#fff;padding:7px 11px;height:58px}
footer h4{font:600 11px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:18px}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
footer a:hover{color:var(--steel-l)}
footer .cl{color:rgba(255,255,255,.7);font-size:14.5px;font-weight:300;max-width:42ch;margin-top:22px}
.ft-b{margin-top:clamp(36px,5vw,64px);padding-top:22px;border-top:1px solid rgba(255,255,255,.12);
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12.5px;color:rgba(255,255,255,.5)}

.wa{position:fixed;right:clamp(16px,2.4vw,28px);bottom:clamp(16px,2.4vw,28px);z-index:6000;width:58px;height:58px;border-radius:50%;
  background:#25D366;color:#fff;display:grid;place-items:center;box-shadow:0 14px 30px -12px rgba(37,211,102,.85);
  transform:translateY(120px);transition:transform .55s var(--ease)}
.wa.in{transform:none}
.wa:hover{transform:scale(1.08)}

#lb{position:fixed;inset:0;z-index:9200;background:rgba(9,16,24,.95);display:none;place-items:center;padding:clamp(16px,4vw,60px)}
#lb.on{display:grid;animation:fade .4s var(--out)}
#lb img{max-width:100%;max-height:80vh;object-fit:contain;box-shadow:var(--sh-l)}
#lb .x{position:absolute;top:22px;right:22px;width:48px;height:48px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.25);color:#fff;display:grid;place-items:center}
#lb .nv{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.1);color:#fff;display:grid;place-items:center}
#lb .nv.p{left:18px}#lb .nv.n{right:18px}
#lb .ct2{position:absolute;bottom:26px;left:0;right:0;text-align:center;color:rgba(255,255,255,.72);font:600 11px/1.5 var(--sans);letter-spacing:.16em;text-transform:uppercase}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .rv{opacity:1;transform:none}.rvw>i{transform:none}.im img{opacity:1}html{scroll-behavior:auto}
}

/* ======================================================
   PÁGINAS INTERNAS
   ====================================================== */
.phd{position:relative;min-height:clamp(380px,56vh,560px);display:flex;align-items:flex-end;overflow:hidden;background:var(--navy-x)}
.phd .bg{position:absolute;inset:0;z-index:0}
.phd .bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.04)}
.phd .veil{position:absolute;inset:0;z-index:1;background:
  linear-gradient(100deg,rgba(21,40,60,.86) 0%,rgba(21,40,60,.55) 48%,rgba(21,40,60,.25) 100%),
  linear-gradient(180deg,rgba(21,40,60,.5) 0%,rgba(21,40,60,.25) 40%,rgba(21,40,60,.85) 100%)}
.phd .inner{position:relative;z-index:2;width:100%;color:#fff;padding-top:150px;padding-bottom:clamp(36px,6vh,66px)}
.phd .eyebrow{color:rgba(255,255,255,.7)}
.phd h1{margin:22px 0 0;font-weight:300;font-size:clamp(36px,6vw,74px);letter-spacing:-.04em;max-width:15ch}
.phd h1 b{font-weight:600}
.phd h1 .serif{color:var(--steel-l)}
.phd p{margin-top:20px;max-width:48ch;color:rgba(255,255,255,.76);font-weight:300;font-size:clamp(15.5px,1.3vw,18px)}
.phd .crumb{display:flex;gap:10px;align-items:center;font:600 10.5px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-top:26px}
.phd .crumb a:hover{color:#fff}

/* fichas de servicio en página */
.sgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(18px,2.4vw,34px)}
@media(max-width:860px){.sgrid{grid-template-columns:1fr}}
.scard{background:#fff;box-shadow:var(--sh-s);display:flex;flex-direction:column;transition:transform .6s var(--ease),box-shadow .6s var(--ease)}
.tint .scard{background:#fff}
.scard:hover{transform:translateY(-6px);box-shadow:var(--sh-m)}
.scard .im{aspect-ratio:16/10}
.scard:hover .im img{transform:scale(1.05)}
.scard .im.none{background:linear-gradient(135deg,var(--navy) 0%,var(--steel) 100%);display:grid;place-items:center}
.scard .im.none b{font-family:var(--serif);font-style:italic;font-size:clamp(38px,5vw,66px);color:rgba(255,255,255,.3);line-height:1}
.scard .bd{padding:clamp(22px,2.6vw,34px);flex:1;display:flex;flex-direction:column}
.scard .no{font:600 10.5px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--red)}
.scard h3{margin:12px 0 12px;font-size:clamp(20px,2.1vw,26px);color:var(--navy)}
.scard p{color:var(--grey);font-weight:300;font-size:15px}
.scard ul{margin:18px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:7px}
.scard li{font-size:12px;color:var(--navy);background:var(--bg-2);padding:6px 12px;border-radius:999px}

/* diferenciadores */
.dif{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);margin-top:clamp(30px,4vw,48px)}
@media(max-width:780px){.dif{grid-template-columns:1fr}}
.dif .it{background:#fff;padding:clamp(26px,3vw,42px);display:grid;grid-template-columns:52px 1fr;gap:22px;align-items:start}
.tint .dif .it{background:var(--bg-2)}
.dif .n{font-family:var(--serif);font-style:italic;font-size:34px;line-height:1;color:var(--steel)}
.dif h3{font-size:18.5px;font-weight:600;color:var(--navy)}
.dif p{margin-top:9px;color:var(--grey);font-size:15px;font-weight:300}

/* galería completa */
.gal{columns:3;column-gap:clamp(12px,1.6vw,22px)}
@media(max-width:960px){.gal{columns:2}}
@media(max-width:560px){.gal{columns:1}}
.gal .it.v .im{aspect-ratio:3/4}
.gal .it.h .im{aspect-ratio:4/3}
.gal .it{break-inside:avoid;margin-bottom:clamp(12px,1.6vw,22px);position:relative;cursor:pointer}
.gal .im{box-shadow:var(--sh-s)}
.gal .it:hover .im img{transform:scale(1.05)}
.gal .cp{position:absolute;left:0;right:0;bottom:0;padding:20px;z-index:2;color:#fff;opacity:0;transform:translateY(8px);transition:.5s var(--ease);
  background:linear-gradient(to top,rgba(21,40,60,.85),transparent)}
.gal .it:hover .cp{opacity:1;transform:none}
.gal .cp b{display:block;font-size:16.5px;font-weight:600}
.gal .cp span{display:block;margin-top:3px;font:600 10.5px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.65)}
@media(hover:none){.gal .cp{opacity:1;transform:none}}

/* banda CTA */
.cta-band{position:relative;overflow:hidden;background:var(--navy);color:#fff;padding:clamp(40px,6vw,80px);
  display:grid;grid-template-columns:1.2fr auto;gap:34px;align-items:center}
@media(max-width:820px){.cta-band{grid-template-columns:1fr}}
.cta-band::before{content:"";position:absolute;inset:0;background:radial-gradient(70% 120% at 90% 0%,rgba(69,124,163,.55),transparent 60%)}
.cta-band>*{position:relative;z-index:1}
.cta-band h2{font-weight:300;font-size:clamp(25px,3.2vw,42px)}
.cta-band h2 .serif{color:var(--steel-l)}
.cta-band p{margin-top:14px;color:rgba(255,255,255,.72);font-weight:300;max-width:44ch}
.cta-band .acts{display:flex;gap:12px;flex-wrap:wrap}

/* nosotros */
.tl{display:grid;gap:0;margin-top:clamp(30px,4vw,48px);border-top:1px solid var(--line)}
.tl .r{display:grid;grid-template-columns:200px 1fr;gap:clamp(16px,3vw,40px);padding:clamp(20px,2.6vw,30px) 0;border-bottom:1px solid var(--line)}
@media(max-width:700px){.tl .r{grid-template-columns:1fr;gap:6px}}
.tl .r h3{font-size:18px;font-weight:600;color:var(--navy)}
.tl .r p{color:var(--grey);font-weight:300;font-size:15.5px}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,26px);margin-top:clamp(28px,4vw,44px)}
@media(max-width:700px){.duo{grid-template-columns:1fr}}
.duo .im{aspect-ratio:4/5;box-shadow:var(--sh-s)}
.duo .im:nth-child(2){margin-top:clamp(20px,5vw,60px)}

/* contacto */
.cbox{background:#fff;padding:clamp(26px,3.4vw,44px);box-shadow:var(--sh-s)}
.tint .cbox{background:#fff}
.cmeta{display:grid;gap:0;margin-top:6px}
.chip-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.chip-row a{display:inline-flex;align-items:center;gap:9px;padding:13px 20px;border-radius:999px;font-size:14px;font-weight:600;
  color:var(--navy);box-shadow:inset 0 0 0 1px var(--line);transition:.4s var(--ease);background:#fff}
.chip-row a:hover{box-shadow:inset 0 0 0 1px var(--navy);transform:translateY(-2px)}

/* ======================================================
   AJUSTES DE MÓVIL
   ====================================================== */
@media (max-width:760px){
  /* iOS hace zoom al enfocar un campo con letra menor de 16px */
  .fld input,.fld textarea,.fld select{font-size:16px}
  .fld label{font-size:15.5px}

  /* zonas de toque cómodas */
  footer ul{gap:2px}
  footer ul a{display:inline-block;padding:10px 0}
  #mob .foot a{display:inline-block;padding:8px 0}
  .phd .crumb a{display:inline-block;padding:13px 12px 13px 0;margin:-13px 0}
  .lnk{padding-top:8px;padding-bottom:10px}
  .chk input{width:21px;height:21px;margin-top:1px}
  .ct-row{padding:22px 0}
  .rbtn{width:52px;height:52px}

  /* microtipografía: 10.5px se queda corto en pantalla pequeña */
  .eyebrow,.stats span,.card .cap span,.gal .cp span,.mos .cap,
  .ct-row .tx small,footer h4,.phd .crumb{font-size:11.5px}
  .mq span{font-size:12px}

  /* respiro para que el botón de WhatsApp no tape el final */
  .ft-b a{display:inline-block;padding:10px 0}
  footer .ft-b{padding-bottom:40px}
}

/* el resalte azul de iOS al tocar, en color de marca */
a,button,.card,.gal .it,.sv-it{-webkit-tap-highlight-color:rgba(48,85,129,.16)}

/* en pantallas táctiles no hay hover: que las cosas se vean sin pasar el dedo */
@media (hover:none){
  .card .zoom{opacity:1;transform:none}
  .scard:hover{transform:none}
}