:root {
  --navy: #153a67;
  --navy-deep: #0d244c;
  --navy-darker: #091a39;
  --steel: #2779bc;
  --canvas: #f6f9fe;
  --soft-blue: #e9f2ff;
  --brand-blue: #2874f0;
  --brand-cyan: #00aab9;
  --brand-violet: #7754e9;
  --brand-coral: #ef685d;
  --shadow: 0 24px 58px rgba(27,61,120,.13);
}

::selection { background: #bceeff; color: #102b51; }
:focus-visible { outline: 3px solid #12b9d1; outline-offset: 4px; }
.sr-only { position: absolute!important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.utility-bar { background: linear-gradient(110deg,#112e5f,#234d93 60%,#3863a0); }
.site-header { box-shadow: 0 2px 22px rgba(14,46,100,.055); }
.brand-mark { transition: transform .45s cubic-bezier(.17,.67,.25,1.35); }
.brand:hover .brand-mark { transform: rotate(-10deg) scale(1.09); }
.navigation > a:not(.nav-contact) { position: relative; }
.navigation > a:not(.nav-contact)::after { content:""; position:absolute; height:2px; background: linear-gradient(90deg,var(--brand-blue),var(--brand-cyan)); left:0; bottom:-8px; width:0; transition:width .3s ease; }
.navigation > a:not(.nav-contact):hover::after { width:100%; }
.navigation .nav-contact { background:linear-gradient(110deg,#2478e9,#6550d5); border-radius:10px; box-shadow:0 8px 20px rgba(38,96,201,.18); }
.navigation .nav-contact:hover { background:linear-gradient(110deg,#125ece,#4e38c1); box-shadow:0 12px 25px rgba(38,96,201,.24); transform:translateY(-2px); }

.hero { background: radial-gradient(circle at 5% 85%,rgba(63,187,245,.12),transparent 36%),radial-gradient(circle at 93% 15%,rgba(151,107,255,.13),transparent 32%),linear-gradient(120deg,#fff 15%,#f1f8ff 65%,#f9f4ff); }
.hero::before { content:""; width:300px; height:300px; border-radius:50%; position:absolute; left:-175px; top:-85px; background:radial-gradient(circle,rgba(91,190,239,.23),transparent 70%); pointer-events:none; }
.eyebrow, .section-kicker { color:#1561a5; }
.eyebrow-line, .section-kicker > span { background:linear-gradient(90deg,var(--brand-blue),var(--brand-coral)); }
.hero h1 span { background:linear-gradient(115deg,#167cc8 5%,#6e52df 60%,#e75f84); background-clip:text; -webkit-background-clip:text; color:transparent; }
.hero-description { color:#536780; }
.check-circle { background:#dff5ff; color:#087fa7; }
.hero-points { color:#395e77; }

.button { border-radius:12px; position:relative; overflow:hidden; isolation:isolate; transition: transform .3s cubic-bezier(.21,.8,.2,1),box-shadow .3s ease,border-color .25s, background .3s ease; }
.button::before { content:""; pointer-events:none; position:absolute; top:-100%; bottom:-100%; left:-55%; width:40%; z-index:-1; transform:rotate(21deg); background:linear-gradient(90deg,transparent,rgba(255,255,255,.36),transparent); transition:left .65s ease; }
.button:hover::before,.button:focus-visible::before { left:130%; }
.button:hover { transform:translateY(-4px); box-shadow:0 14px 30px rgba(42,84,163,.2); }
.button:active { transform:translateY(-1px) scale(.98); }
.button-primary { background:linear-gradient(120deg,#2678f0,#6555e4); color:#fff; box-shadow:0 10px 28px rgba(58,101,211,.18); }
.button-primary:hover { background:linear-gradient(120deg,#1163d7,#4b39d7); }
.button-outline { border:1.5px solid #93b6e1; color:#174d86; background:rgba(255,255,255,.65); }
.button-outline:hover { background:#ecf6ff; border-color:var(--brand-blue); }

.hero-visual { isolation:isolate; }
.hero-orbit { border-color:rgba(65,134,216,.14); }
.orbit-one { animation:float-orbit 16s linear infinite; border-style:dashed; }
.orbit-two { animation:float-orbit 20s linear infinite reverse; }
.hero-panel { background:radial-gradient(circle at 75% 26%,rgba(111,90,232,.49),transparent 55%),linear-gradient(140deg,#17468d,#0b1c44 93%); border:1px solid rgba(255,255,255,.18); box-shadow:0 32px 72px rgba(18,57,137,.26); border-radius:23px; }
.hero-panel::before { content:""; position:absolute; inset:0; border-radius:inherit; background:radial-gradient(circle at 10% 100%,rgba(19,216,225,.20),transparent 42%); pointer-events:none; }
.hero-panel::after { border-color:rgba(156,212,255,.2); }
.hero-panel-star { color:#5ef0f0; }
.hero-panel-arrow { background:rgba(255,255,255,.12); }
.floating-note { border-color:#dce9ff; box-shadow:0 22px 46px rgba(27,77,134,.17); border-radius:13px; }
.floating-dot { background:var(--brand-cyan); box-shadow:0 0 0 4px #d7f8f8; }

.interactive-logo { --lens-x:50%; --lens-y:50%; --tilt-x:0deg; --tilt-y:0deg; border:7px solid rgba(255,255,255,.95); background:linear-gradient(145deg,#fff,#e9f4ff); cursor:pointer; isolation:isolate; box-shadow:0 24px 75px rgba(0,0,0,.17),inset 0 0 0 1px rgba(22,126,220,.1); transition:transform .42s cubic-bezier(.16,.84,.3,1),box-shadow .42s; transform:perspective(800px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)); }
.interactive-logo:hover,.interactive-logo:focus-visible { box-shadow:0 25px 90px rgba(0,205,231,.28),0 0 0 7px rgba(133,229,255,.18); }
.interactive-logo .logo-base { position:relative; z-index:1; filter:saturate(.62); transition:filter .35s,transform .4s; }
.interactive-logo:hover .logo-base,.interactive-logo:focus-visible .logo-base { filter:saturate(1.2); transform:scale(1.04); }
.logo-reveal { position:absolute; inset:0; z-index:2; display:grid; place-items:center; border-radius:50%; opacity:0; pointer-events:none; background:radial-gradient(circle at var(--lens-x) var(--lens-y),rgba(79,229,255,.36),rgba(121,115,255,.25) 55%,transparent 72%); -webkit-mask-image:radial-gradient(circle 74px at var(--lens-x) var(--lens-y),#000 38%,transparent 96%); mask-image:radial-gradient(circle 74px at var(--lens-x) var(--lens-y),#000 38%,transparent 96%); transition:opacity .25s; }
.logo-reveal img { width:198px; max-width:85%; height:auto; filter:saturate(1.5) contrast(1.2); }
.logo-glow { position:absolute; z-index:3; inset:0; border-radius:50%; opacity:0; pointer-events:none; background:radial-gradient(circle 55px at var(--lens-x) var(--lens-y),rgba(255,255,255,.82),rgba(165,223,255,.21) 65%,transparent 90%); mix-blend-mode:screen; transition:opacity .25s; }
.interactive-logo:hover .logo-reveal,.interactive-logo:hover .logo-glow,.interactive-logo:focus-visible .logo-reveal,.interactive-logo:focus-visible .logo-glow { opacity:1; }
.logo-hint { position:absolute; z-index:2; bottom:76px; left:50%; transform:translateX(-50%); white-space:nowrap; color:#bde6ff; opacity:.88; font-weight:800; font-size:9px; letter-spacing:.15em; pointer-events:none; }
@keyframes float-orbit { to { transform:rotate(360deg); } }
.focus-strip { background:linear-gradient(110deg,#113b77,#194b9e 60%,#066b98); }
.focus-content>div { color:#d8efff; }
.section-about { background:linear-gradient(180deg,#fff,#fbfcff); }
.about-card { background:linear-gradient(140deg,#15386d,#4254af); }
.about-card-light { background:linear-gradient(135deg,#e9f6ff,#f2ecff); }
.text-link { color:#196ad2; border-bottom-color:#6bbcd5; }
.text-link:hover { color:#7056df; }

/* Galería fotográfica principal */
.showcase-section { background:linear-gradient(180deg,#eff7ff 0%,#f8f5ff 100%); padding-block:91px 83px; }
.showcase-heading { display:flex; align-items:end; justify-content:space-between; gap:36px; margin-bottom:30px; }
.showcase-heading h2 { font-size:clamp(34px,3.6vw,48px); line-height:1.16; letter-spacing:-.045em; max-width:650px; margin:0; }
.showcase-heading h2 em { font-style:normal; color:var(--brand-violet); }
.showcase-heading > p { width:min(320px,34%); font-size:14px; color:#566a84; line-height:1.85; margin:0 0 5px; }
.showcase-gallery { position:relative; overflow:hidden; isolation:isolate; border-radius:25px; height:clamp(400px,44vw,510px); background:linear-gradient(135deg,#17488b,#18204d); box-shadow:0 29px 60px rgba(22,57,123,.24); }
.showcase-track { position:relative; height:100%; }
.showcase-slide { position:absolute; inset:0; display:flex; align-items:end; visibility:hidden; opacity:0; transform:scale(1.035); transition:opacity .85s ease,transform 1.2s cubic-bezier(.16,.79,.29,1),visibility .85s; pointer-events:none; }
.showcase-slide.is-active { visibility:visible; opacity:1; transform:scale(1); z-index:1; pointer-events:auto; }
.showcase-slide > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1.1s cubic-bezier(.15,.79,.32,1),filter .7s; }
.showcase-slide:hover > img { transform:scale(1.08); filter:saturate(1.13); }
.showcase-scrim { position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg,rgba(9,21,50,.85) 0%,rgba(9,28,58,.66) 40%,rgba(16,36,60,.19) 100%),linear-gradient(0deg,rgba(4,18,42,.30),transparent 62%); }
.showcase-slide::before,.showcase-slide::after { content:""; position:absolute; z-index:1; left:0; width:100%; height:50%; background:rgba(11,31,77,.16); transform:scaleX(0); transform-origin:left; transition:transform .48s cubic-bezier(.66,.08,.19,.97); pointer-events:none; }
.showcase-slide::before { top:0; }
.showcase-slide::after { bottom:0; transition-delay:.11s; }
.showcase-slide.is-active:hover::before,.showcase-slide.is-active:hover::after { transform:scaleX(1); }
.showcase-caption { position:relative; z-index:2; color:#fff; margin:0 6.5% 8%; width:min(560px,70%); transform:translateY(25px); opacity:0; transition:transform .65s .17s,opacity .65s .17s; }
.showcase-slide.is-active .showcase-caption { transform:translateY(0); opacity:1; }
.showcase-eyebrow { display:inline-flex; align-items:center; gap:10px; font-weight:800; font-size:11px; letter-spacing:.16em; color:#9ef0fa; margin-bottom:13px; }
.showcase-eyebrow::before { content:""; width:27px; height:2px; background:#55e5ef; }
.showcase-caption h3 { font-size:clamp(32px,3.7vw,49px); line-height:1.15; letter-spacing:-.043em; margin:0 0 14px; }
.showcase-caption p { max-width:450px; margin:0 0 23px; font-size:15px; line-height:1.7; color:#e4f1ff; }
.showcase-cta { display:inline-flex; align-items:center; gap:18px; font-weight:800; font-size:13px; color:#fff; padding-bottom:8px; border-bottom:1px solid #7fe8ff; transition:gap .2s,color .2s; }
.showcase-cta:hover { gap:27px; color:#75effa; }
.showcase-progress { position:absolute; z-index:3; left:0; bottom:0; width:100%; height:4px; background:rgba(255,255,255,.2); }
.showcase-progress span { height:100%; display:block; width:25%; background:linear-gradient(90deg,#18d1e1,#7b61ff,#fa8070); transition:transform .55s ease; transform-origin:left; }
.showcase-controls { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:22px 4px 6px; }
.showcase-pagination { display:flex; align-items:center; gap:15px; font:800 15px 'Manrope',sans-serif; color:#15416b; }
.showcase-pagination > span:last-of-type { color:#95a9bd; }
.showcase-pagination-line { display:block; width:48px; height:2px; background:linear-gradient(90deg,#2874f0,#a8bddd); }
.showcase-dots { display:flex; align-items:center; gap:10px; }
.showcase-dot { border:0; width:10px; height:10px; border-radius:20px; background:#b5c9e6; padding:0; transition:width .3s ease,background .3s ease,transform .2s; }
.showcase-dot:hover { transform:scale(1.25); background:#759cdc; }
.showcase-dot.is-active { width:34px; background:linear-gradient(90deg,#2488de,#7154db); }
.showcase-arrows { display:flex; gap:9px; }
.showcase-arrow { width:43px; height:43px; border-radius:50%; background:#fff; border:1px solid #cbdcf0; color:#19559c; font-size:22px; display:grid; place-items:center; transition:transform .25s,background .25s,color .25s,box-shadow .25s; }
.showcase-arrow:hover { background:linear-gradient(110deg,#2476de,#7756d8); color:white; transform:translateY(-3px); box-shadow:0 10px 22px rgba(37,91,182,.24); }
.showcase-arrow:active { transform:scale(.93); }
.showcase-disclaimer { color:#657c98; font-size:11px; margin:12px 0 0; line-height:1.6; }

/* Tarjetas con revelado lateral similar al ejemplo proporcionado */
.section-services { background:linear-gradient(180deg,#fff,#f3f8ff); }
.service-card { background:linear-gradient(165deg,var(--card-tint,#eaf2ff) 0%,#fff 66%); border:1px solid #e5edfa; border-radius:19px; padding:23px 23px 24px; min-height:0; box-shadow:0 6px 20px rgba(27,66,119,.04); transition:transform .4s cubic-bezier(.16,.8,.31,1),box-shadow .35s,border-color .3s; }
.service-card:hover,.service-card:focus-within { transform:translateY(-10px); box-shadow:0 25px 50px rgba(32,71,135,.18); border-color:rgba(79,115,227,.25); }
.service-index { right:25px; top:21px; z-index:4; color:#60849e; background:#fff; border-radius:50px; padding:5px 9px; font-size:10px; }
.service-media { position:relative; margin:8px 0 18px; background:var(--card-tint); border-radius:13px; overflow:hidden; border:0; }
.service-media img { width:100%; height:174px; object-fit:cover; transition:transform .8s cubic-bezier(.18,.76,.33,1),filter .6s ease; }
.service-media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 62%,rgba(17,51,96,.19)); pointer-events:none; }
.service-card:hover .service-media img,.service-card:focus-within .service-media img { transform:scale(1.12) translateX(2%); filter:saturate(1.12); }
.service-side-label { position:absolute; z-index:3; top:35px; left:-45px; width:36px; height:151px; writing-mode:vertical-rl; transform:rotate(180deg); background:var(--card-accent,#2874f0); color:#fff; border-radius:0 9px 9px 0; display:grid; place-items:center; font-size:10px; font-weight:800; letter-spacing:.16em; transition:left .46s cubic-bezier(.2,.75,.27,1); pointer-events:none; }
.service-card:hover .service-side-label,.service-card:focus-within .service-side-label { left:0; }
.service-icon { background:var(--card-tint); color:var(--card-accent); width:46px; height:46px; border-radius:12px; margin-bottom:15px; }
.service-icon svg { width:25px; height:25px; }
.service-card h3 { font-size:18px; }
.service-card p { font-size:13px; line-height:1.74; color:#53687e; margin-bottom:17px; }
.service-tag { color:var(--card-accent); padding-top:12px; }
.service-action { display:flex; align-items:center; justify-content:space-between; color:#175c9f; padding-top:13px; font-size:12px; font-weight:800; border-bottom:0; transition:color .25s; }
.service-action span { display:grid; place-items:center; width:29px; height:29px; border-radius:50%; background:var(--card-tint); color:var(--card-accent); transition:transform .25s,background .25s,color .25s; font-size:16px; }
.service-action:hover { color:var(--card-accent); }
.service-action:hover span { background:var(--card-accent); color:#fff; transform:rotate(45deg); }
.specialty-panel { background:linear-gradient(125deg,#143a7a,#4b48a4 72%,#0b839f); border-radius:21px; }
.value-item > span { color:var(--brand-blue); }
.section-contact { background:radial-gradient(circle at 100% 20%,rgba(88,83,213,.30),transparent 43%),radial-gradient(circle at 0% 95%,rgba(0,180,199,.19),transparent 50%),#0e2852; }
.contact-form-card { border-radius:20px; }
.form-icon { background:linear-gradient(120deg,#ddf6ff,#e5e8ff); }
#contactForm input:not([type=checkbox]):focus,#contactForm textarea:focus,#contactForm select:focus { border-color:#3666ef; box-shadow:0 0 0 3px rgba(83,116,255,.14); }

@media(max-width:820px) {
  .showcase-heading { align-items:start; flex-direction:column; gap:12px; }
  .showcase-heading > p { width:100%; max-width:570px; }
  .showcase-gallery { height:450px; }
  .showcase-caption { width:80%; margin:0 7% 10%; }
  .navigation > a:not(.nav-contact)::after { display:none; }
}
@media(max-width:560px) {
  .showcase-section { padding-block:65px; }
  .showcase-heading h2 { font-size:32px; }
  .showcase-gallery { height:420px; border-radius:18px; }
  .showcase-caption { margin:0 23px 38px; width:calc(100% - 46px); }
  .showcase-caption h3 { font-size:30px; }
  .showcase-caption p { font-size:13px; }
  .showcase-eyebrow { font-size:9px; }
  .showcase-scrim { background:linear-gradient(0deg,rgba(6,19,49,.95) 0%,rgba(11,33,77,.70) 60%,rgba(8,32,73,.12) 100%); }
  .showcase-arrows { gap:5px; }
  .showcase-arrow { width:39px; height:39px; }
  .showcase-controls { gap:9px; }
  .showcase-pagination { gap:8px; font-size:12px; }
  .showcase-pagination-line { width:23px; }
  .showcase-dots { gap:6px; }
  .showcase-dot { width:8px; height:8px; }
  .showcase-dot.is-active { width:22px; }
  .service-card { padding:23px; }
  .service-media img { height:205px; }
  .logo-hint { display:none; }
}
@media(hover:none) {
  .service-side-label { left:0; }
  .interactive-logo { transform:none!important; }
  .logo-reveal,.logo-glow { display:none; }
}
@media(prefers-reduced-motion:reduce) {
  .hero-orbit { animation:none; }
  .showcase-slide,.showcase-caption,.showcase-slide > img,.showcase-progress span,.interactive-logo,.button,.button::before,.service-card,.service-media img,.service-side-label { animation:none!important; transition:none!important; }
}

.form-error:not([hidden]){padding:14px 16px;border:1px solid #d57d68;border-radius:10px;background:#fff3ee;color:#882f24;font-size:13px;line-height:1.5}
