/* Zángano Pictures 360 · V4. 
   Se añade DESPUÉS de cinema-v3.css. Sin cambios de datos, textos gestionados o CRUD.
   La identidad cromática procede del logotipo original: azul petróleo + turquesa.
*/
:root{
 --paper:#f5f5f1;--ink:#0b2325;--forest:#10383a;--accent:#82cbd3;
 --text-muted:#5d7274;--edge:#dce5e2;
 --shadow:0 25px 75px rgba(6,33,37,.13)
}
body.zp-redesign{background:var(--paper);color:var(--ink)}
.top-header{background:rgba(7,28,30,.95)}.top-header-solid{background:rgba(7,28,30,.98)}
.nav-dropdown .dropdown-menu{background:rgba(7,31,33,.99)}
.nav-contact:hover{color:#0a2c30!important}
.zp-redesign a:focus-visible,.zp-redesign button:focus-visible{outline-color:#45a9b5}
.pill.light:hover{background:#d5eff0;border-color:#d5eff0}

/* Hero editorial: solo titular original primero; el párrafo original aparece al ampliar. */
.motion-ready .opening{height:182svh}
.opening-copy{max-width:min(940px,88%);opacity:var(--intro-opacity,1);pointer-events:auto}
.opening-copy.inactive{pointer-events:none}
.opening h1{font-size:clamp(56px,7.5vw,124px);line-height:1.01;font-weight:550;max-width:880px}
.opening-tagline{font-size:clamp(23px,3.3vw,45px);line-height:1.2;letter-spacing:-.047em;color:#d2eef0;max-width:770px;margin:21px 0 33px}
.opening-picture img{transform:scale(var(--hero-scale,1));transform-origin:center 55%}
.opening-shade{background:linear-gradient(90deg,rgba(5,21,23,.92) 0%,rgba(5,21,23,.64) 38%,rgba(7,28,30,.15) 85%),linear-gradient(0deg,rgba(7,21,24,.48),transparent 53%)}
.opening-after{position:absolute;left:7%;bottom:clamp(65px,13svh,150px);max-width:min(690px,75vw);opacity:var(--after-opacity,0);transform:translateY(var(--after-shift,26px));pointer-events:none;will-change:opacity,transform}
.opening-after p{font-size:clamp(16px,1.7vw,23px);line-height:1.68;color:#edf8f5;text-wrap:pretty;text-shadow:0 2px 22px #071e24}
/* El logotipo abstracto ahora tiene la diagonal completa. */
.brand-orbit{color:#46949d}

/* Panorama: más espacio y mayor nitidez, sin convertir la imagen 360° en fondo plano. */
.panorama-story{padding:87px 0 81px;background:#071f21}
.panorama-story .immersive-copy{padding-bottom:34px}
.panorama-story #panorama-shell{
 width:min(1560px,95%);height:clamp(500px,71svh,800px);min-height:500px;
 border-radius:28px;isolation:isolate;overflow:hidden;box-shadow:0 32px 75px rgba(0,0,0,.28)
}
.panorama-story #panorama-shell:fullscreen{width:100%;height:100%;border-radius:0}
#empresa360,.panorama-story .pnlm-container,.panorama-story .pnlm-render-container{border-radius:inherit}
.panorama-story .pnlm-render-container{overflow:hidden}
.panorama-story .pnlm-container{touch-action:none}
#empresa360{cursor:grab}#empresa360:active{cursor:grabbing}
/* Ayuda de arrastre: no intercepta ratón ni dedos, se oculta tras el primer gesto. */
.panorama-gesture{position:absolute;z-index:6;left:50%;top:51%;transform:translate(-50%,-50%);padding:16px 24px 13px;display:flex;flex-direction:column;align-items:center;gap:9px;background:rgba(7,32,35,.71);border:1px solid #ffffff65;box-shadow:0 20px 55px #061d1ea9;backdrop-filter:blur(11px);border-radius:21px;pointer-events:none;color:white;font-size:13px;letter-spacing:.01em;text-align:center;transition:opacity .5s,visibility .5s}
.panorama-gesture .gesture-icon{width:100px;height:100px;animation:gesture-sway 2.7s ease-in-out infinite}
.panorama-gesture .gesture-swipe{animation:gesture-glow 2.7s ease-in-out infinite}
.panorama-gesture.is-hidden{opacity:0;visibility:hidden}
@keyframes gesture-sway{0%,100%{transform:translateX(-8px)}50%{transform:translateX(8px)}}
@keyframes gesture-glow{0%,100%{opacity:.5}50%{opacity:1}}
.panorama-next{box-shadow:0 10px 25px #05161680}
.panorama-fullscreen{z-index:7}

/* Índice de servicios. Conservamos los logotipos originales, pero como marcas
   nítidas sobre una fotografía contextual, no estirados a pantalla completa. */
.experience-visual{background:#071f21;border:0;border-radius:25px;overflow:hidden;box-shadow:0 26px 65px #071e2226}
.experience-scene{padding:0!important;display:grid;place-items:center;mix-blend-mode:normal!important;transform:scale(1.065)}
.experience-scene.is-active{transform:scale(1)}
.experience-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% center;filter:saturate(.9);padding:0!important;mix-blend-mode:normal!important}
.experience-scene::after{content:'';position:absolute;inset:0;background:linear-gradient(145deg,rgba(4,24,27,.18),rgba(4,24,27,.56) 70%,rgba(4,24,27,.84));pointer-events:none}
.experience-brand-panel{position:relative;z-index:2;width:min(80%,470px);min-height:174px;padding:28px 32px;background:rgba(255,255,255,.96);border:1px solid #ffffffaa;box-shadow:0 20px 70px #071f2470;display:flex;align-items:center;justify-content:center;border-radius:21px;transform:translateY(-8px)}
.experience-brand-panel img{display:block;width:100%;max-height:145px;object-fit:contain;filter:none;mix-blend-mode:normal}
.experience-visual .visual-label{z-index:3;color:#e0f6f5;text-shadow:0 1px 8px #0028}
.experience-story{min-height:62svh}
.experience-section .story-cta{background:#0d3033;border:1px solid #0d3033;border-radius:100px;color:#fff;padding:13px 25px;font-weight:600;gap:20px;box-shadow:0 10px 25px rgba(5,36,38,.12);font-size:13px;min-height:50px}
.experience-section .story-cta:hover{background:#19555c;color:#fff;border-color:#19555c;transform:translateY(-3px);box-shadow:0 15px 28px rgba(6,36,40,.23)}
.experience-section .story-cta span{font-size:20px;transition:transform .25s}
.experience-section .story-cta:hover span{transform:translate(3px,-3px)}
.story-mobile-image{background:#eaf0ee}

/* Protagonismo a las fotografías en cada portada interior, sin tocar logos en el índice. */
.interior-hero-scroll{height:112svh;background:var(--paper);padding-top:76px}
.interior-hero,.page-hero.interior-hero,.service-hero-clean.interior-hero{
 top:76px;height:76svh;min-height:490px;max-height:790px;
 width:min(1660px,96%);border-radius:24px;margin-inline:auto;
 padding:70px 0 60px;background:#0a292d!important;overflow:hidden
}
.interior-hero::before{
 background-image:linear-gradient(90deg,rgba(4,22,26,.88),rgba(4,22,26,.55) 45%,rgba(4,22,26,.06) 100%),var(--interior-bg);
 background-position:center;background-size:cover
}
.interior-hero::after{background:linear-gradient(0deg,rgba(6,24,29,.30),transparent 45%)}
.interior-hero h1{font-size:clamp(51px,7.1vw,101px);max-width:850px;letter-spacing:-.052em}
.interior-hero p{font-size:clamp(15px,1.35vw,19px);max-width:670px}
.interior-hero .container{opacity:var(--interior-fade,1)}

/* Paleta: blanco cálido para descanso visual, azul petróleo para inmersión,
   turquesa del logotipo para acentos. Evitamos una web enteramente negra. */
.zp-redesign .section-title{color:#102d30}
.zp-redesign .services.section,.zp-redesign .service-media-section,.zp-redesign .service-tour-examples-section{background:var(--paper)}
.zp-redesign .closing{background:#123b40;padding:61px 0 70px}
.zp-redesign .closing h2{font-size:clamp(35px,4.7vw,65px);max-width:880px}
.zp-redesign .closing p:not(.kicker){font-size:15px;max-width:620px;margin-top:16px}
.zp-redesign .closing-actions{margin-top:22px}
.zp-redesign .footer-clean{background:#071f21}
.zp-redesign .footer-foundation-strip{background:#103136;padding:5px 0!important}
.zp-redesign .footer-foundation-container{min-height:54px}
.zp-redesign .footer-foundation-container p{font-size:clamp(12px,1.3vw,16px)!important}

/* Página todos los servicios: 3 + 2 equilibrados al centro, sin casilla vacía. */
#servicios .services-grid{display:flex;flex-wrap:wrap;align-items:stretch;justify-content:center;gap:25px}
#servicios .home-service-card{flex:0 1 calc((100% - 50px)/3);min-width:0;max-width:calc((100% - 50px)/3)}
#servicios .home-service-card .home-service-media{aspect-ratio:1.75;background:#eaf0ee}
#servicios .home-service-card .home-service-media img{width:100%;height:100%;object-fit:contain;object-position:center;padding:11%}

@media(max-width:1000px){
 .experience-brand-panel{min-height:145px;padding:23px}
 #servicios .home-service-card{flex-basis:calc((100% - 25px)/2);max-width:calc((100% - 25px)/2)}
 .interior-hero h1{font-size:clamp(43px,7vw,76px)}
}
@media(max-width:700px){
 .motion-ready .opening{height:155svh}
 .opening,.opening-stage{min-height:570px}
 .opening-copy{top:48%;transform:translateY(calc(-40% - var(--hero-shift,0px)));max-width:88%}
 .opening h1{font-size:clamp(42px,9.6vw,65px)}
 .opening-tagline{font-size:clamp(21px,5.45vw,31px);margin:15px 0 24px}
 .opening-after{bottom:clamp(80px,14svh,130px);left:7%;max-width:86%}
 .opening-after p{font-size:14px;line-height:1.68}
 .panorama-story{padding:66px 0 46px}
 .panorama-story #panorama-shell{width:94%;height:clamp(400px,62svh,580px);min-height:400px;border-radius:18px}
 .panorama-gesture{padding:12px 16px 11px;font-size:11px;width:170px;border-radius:15px}
 .panorama-gesture .gesture-icon{width:72px;height:72px}
 .experience-section .story-cta{font-size:12px;min-height:44px;padding:10px 21px}
 .interior-hero-scroll{height:94svh;padding-top:70px}
 .interior-hero,.page-hero.interior-hero,.service-hero-clean.interior-hero{top:70px;height:68svh;min-height:420px;max-height:none;width:94%;border-radius:17px;padding:40px 0}
 .interior-hero h1{font-size:clamp(43px,10vw,65px)}
 .interior-hero p{font-size:14px;max-width:520px}
 .interior-hero::before{background-position:62% center;background-image:linear-gradient(90deg,rgba(6,24,27,.90),rgba(6,24,27,.58) 77%,rgba(6,24,27,.3)),var(--interior-bg)}
 #servicios .home-service-card{flex-basis:100%;max-width:480px}
 .zp-redesign .closing{padding:49px 0 55px}
 .zp-redesign .closing h2{font-size:clamp(35px,9vw,49px)}
 .zp-redesign .footer-foundation-strip{padding:5px 0!important}
 .zp-redesign .footer-foundation-container{min-height:48px}
}
@media(prefers-reduced-motion:reduce){
 .opening-copy{opacity:1!important}.opening-after{position:static;opacity:1!important;transform:none!important;margin:0 auto;padding:20px 0;max-width:86%}
 .opening-stage{height:auto;min-height:700px;padding-bottom:20px}
 .motion-ready .opening{height:auto!important}
 .opening-copy{position:relative;top:auto;left:auto;right:auto;transform:none!important;margin:180px 7% 45px}
 .panorama-gesture .gesture-icon,.panorama-gesture .gesture-swipe{animation:none!important}
 .interior-hero-scroll{height:auto!important;padding-top:76px}
 .interior-hero,.page-hero.interior-hero,.service-hero-clean.interior-hero{position:relative;top:auto}
}

/* Formulario en consonancia con el azul del logo. */
.zp-redesign .contact-preview{background:linear-gradient(136deg,#f5f5f1,#eaf3f2)}
.zp-redesign .contact-form{border-color:#d7e6e5;box-shadow:0 18px 55px rgba(11,46,49,.10)}
.zp-redesign .contact-form input:not([type=checkbox]),.zp-redesign .contact-form select,.zp-redesign .contact-form textarea{background:#f8fbfb;border-color:#c9dadb;color:#113135}
.zp-redesign .contact-form input:not([type=checkbox]):focus,.zp-redesign .contact-form select:focus,.zp-redesign .contact-form textarea:focus{border-color:#3e9daa;box-shadow:0 0 0 3px #82cbd33d}
.zp-redesign .contact-form .btn,.zp-redesign .contact-form .btn-primary{background:#103e43;border-color:#103e43}
.zp-redesign .contact-form .btn:hover{background:#185e66;border-color:#185e66}
.zp-redesign .contact-form .checkbox-line input{accent-color:#297c89}
.zp-redesign .tour-feature{background:#ebf1ee}
.zp-redesign .tour-window{border-color:#cee0dc}
