/* ============================================================
   VARIABLES
============================================================= */

.pe-root{

--pe-bg:#FCFAF8;
--pe-white:#FFFFFF;
--pe-dark:#151312;
--pe-dark-2:#211D1C;
--pe-arena:#F3EBE1;

--pe-purple:#7B2783;
--pe-purple-light:#A23AAA;
--pe-purple-soft:rgba(123,39,131,.08);

--pe-gold:#C9A961;

--pe-text:#171413;
--pe-text-light:#5D5753;

--pe-border:#E7E0D8;

--pe-title:'Montserrat',sans-serif;
--pe-body:'DM Sans',sans-serif;

--pe-ease:cubic-bezier(.2,.8,.2,1);
--pe-smooth:cubic-bezier(.77,0,.175,1);
--pe-elastic:cubic-bezier(.34,1.56,.64,1);

--pe-padding:clamp(24px,6vw,90px);
--pe-section:clamp(80px,11vw,150px);

position:relative;
width:100%;
margin:0;
padding:0;

font-family:var(--pe-body);
background:var(--pe-bg);
color:var(--pe-text);
line-height:1.7;

overflow:hidden;
}

.pe-root *,
.pe-root *::before,
.pe-root *::after{
box-sizing:border-box;
}

.pe-root h1,
.pe-root h2,
.pe-root h3,
.pe-root h4,
.pe-root h5,
.pe-root h6,
.pe-root p{
margin:0;
}

.pe-root img{
display:block;
max-width:100%;
height:auto;
}

.pe-root a{
text-decoration:none;
}

.pe-root button,
.pe-root input,
.pe-root select,
.pe-root textarea{
font-family:inherit;
}

.pe-root a,
.pe-root button,
.pe-root input,
.pe-root select,
.pe-root textarea{
-webkit-tap-highlight-color:transparent;
}

.pe-root button:focus,
.pe-root input:focus,
.pe-root select:focus,
.pe-root textarea:focus{
outline:none;
}


/* ============================================================
   ANIMACIONES
============================================================= */

.pe-reveal{
opacity:0;
transform:translateY(45px);
transition:
opacity 1s ease,
transform 1s var(--pe-ease);
}

.pe-reveal.pe-active{
opacity:1;
transform:translateY(0);
}

.pe-delay-1{
transition-delay:.15s;
}

.pe-delay-2{
transition-delay:.3s;
}

.pe-delay-3{
transition-delay:.45s;
}


/* ============================================================
   NAVBAR
============================================================= */

.pe-navbar{
position:fixed;
top:0;
left:0;
right:0;
z-index:9999;

display:flex;
align-items:center;
justify-content:space-between;

padding:22px var(--pe-padding);

background:rgba(252,250,248,.82);

backdrop-filter:blur(20px);
-webkit-backdrop-filter:blur(20px);

border-bottom:1px solid rgba(0,0,0,.05);

transition:
padding .5s var(--pe-ease),
background .5s ease,
box-shadow .5s ease;
}

.pe-navbar.pe-scrolled{
padding-top:14px;
padding-bottom:14px;

background:rgba(255,255,255,.96);

box-shadow:
0 15px 40px rgba(0,0,0,.07);
}


/* LOGO */

.pe-logo{
font-family:var(--pe-title);
font-size:1rem;
font-weight:800;
letter-spacing:5px;
color:var(--pe-dark);
white-space:nowrap;
}

.pe-logo span{
color:var(--pe-purple);
}


/* LINKS */

.pe-nav-links{
display:flex;
align-items:center;
gap:34px;

list-style:none;
padding:0;
margin:0;
}

.pe-nav-links a{
position:relative;

font-size:.68rem;
font-weight:700;
letter-spacing:2px;
text-transform:uppercase;

color:var(--pe-text-light);

padding:5px 0;
}

.pe-nav-links a::after{
content:"";

position:absolute;
left:0;
bottom:-5px;

width:0;
height:2px;

background:var(--pe-purple);

transition:
width .4s var(--pe-ease);
}

.pe-nav-links a:hover{
color:var(--pe-purple);
}

.pe-nav-links a:hover::after{
width:100%;
}


/* ============================================================
   BOTONES
============================================================= */

.pe-btn{
position:relative;

display:inline-flex;
align-items:center;
justify-content:center;
gap:12px;

padding:17px 32px;

background:var(--pe-purple);
color:#fff !important;

font-family:var(--pe-title);
font-size:.68rem;
font-weight:700;
letter-spacing:2px;
text-transform:uppercase;

border:0;
cursor:pointer;
overflow:hidden;

transition:
transform .4s var(--pe-ease),
box-shadow .4s ease,
background .4s ease;

box-shadow:
0 14px 35px rgba(123,39,131,.24);
}

.pe-btn::before{
content:"";

position:absolute;
top:0;
left:-120%;

width:80%;
height:100%;

background:
linear-gradient(
90deg,
transparent,
rgba(255,255,255,.25),
transparent
);

transform:skewX(-20deg);

transition:
left .7s var(--pe-ease);
}

.pe-btn:hover::before{
left:130%;
}

.pe-btn:hover{
background:var(--pe-purple-light);

transform:translateY(-3px);

box-shadow:
0 20px 45px rgba(123,39,131,.34);
}

.pe-btn i{
transition:
transform .4s var(--pe-ease);
}

.pe-btn:hover i{
transform:translateX(5px);
}


/* BOTÓN GALERÍA */

.pe-btn-outline{
display:inline-flex;
align-items:center;
justify-content:center;
gap:10px;

padding:17px 32px;

border:1px solid rgba(255,255,255,.55);

background:rgba(255,255,255,.04);

color:#fff !important;

font-family:var(--pe-title);
font-size:.68rem;
font-weight:700;
letter-spacing:2px;
text-transform:uppercase;

backdrop-filter:blur(10px);

transition:
background .4s ease,
color .4s ease,
transform .4s var(--pe-ease);

visibility:visible !important;
opacity:1 !important;
}

.pe-btn-outline:hover{
background:#fff;
color:var(--pe-dark) !important;
transform:translateY(-3px);
}


/* ============================================================
   MENÚ MÓVIL
============================================================= */

.pe-menu-toggle{
display:none;

width:45px;
height:45px;

padding:0;

border:0;
background:transparent;

cursor:pointer;
}

.pe-menu-toggle span{
display:block;

width:27px;
height:2px;

margin:6px auto;

background:var(--pe-purple);

transition:.4s var(--pe-ease);
}

.pe-root .pe-nav-links.pe-mobile-open{
display:flex !important;

position:absolute;

top:100%;
left:0;
right:0;

flex-direction:column;

gap:0;

padding:15px 25px 25px;

background:rgba(255,255,255,.98);

backdrop-filter:blur(20px);
-webkit-backdrop-filter:blur(20px);

box-shadow:
0 20px 35px rgba(0,0,0,.08);
}

.pe-root .pe-nav-links.pe-mobile-open li{
width:100%;
}

.pe-root .pe-nav-links.pe-mobile-open a{
display:block;
padding:14px 5px;
}


/* ============================================================
   HERO
============================================================= */

.pe-hero{
position:relative;

min-height:100vh;

display:flex;
align-items:center;

padding:
150px
var(--pe-padding)
100px;

overflow:hidden;
}

.pe-hero-bg{
position:absolute;
inset:0;

background-image:
url('../img/imagen-1.jpg');

background-position:center;
background-size:cover;

transform:scale(1.05);

animation:
peHeroZoom 18s ease-in-out infinite alternate;
}

@keyframes peHeroZoom{

0%{
transform:scale(1.03);
}

100%{
transform:scale(1.12);
}

}

.pe-hero-overlay{
position:absolute;
inset:0;

background:
linear-gradient(
105deg,
rgba(12,10,10,.96) 0%,
rgba(15,12,12,.76) 42%,
rgba(15,12,12,.35) 72%,
rgba(15,12,12,.12) 100%
);
}


/* DESTELLO */

.pe-hero::after{
content:"";

position:absolute;

top:0;
left:-100%;

width:45%;
height:100%;

background:
linear-gradient(
90deg,
transparent,
rgba(255,255,255,.045),
transparent
);

transform:skewX(-15deg);

animation:
peHeroLight 8s ease-in-out infinite;

pointer-events:none;
}

@keyframes peHeroLight{

0%{
left:-100%;
}

45%{
left:140%;
}

100%{
left:140%;
}

}


/* CONTENIDO */

.pe-hero-content{
position:relative;

z-index:3;

max-width:850px;
}

.pe-hero-content.pe-reveal{
transform:translateY(50px);
}

.pe-hero-content.pe-reveal.pe-active{
transform:translateY(0);
}


/* BADGE */

.pe-badge{
display:inline-flex;
align-items:center;
gap:11px;

padding:10px 20px;
margin-bottom:28px;

border:1px solid rgba(255,255,255,.18);

background:rgba(255,255,255,.07);

backdrop-filter:blur(12px);

border-radius:50px;

font-size:.65rem;
font-weight:700;
letter-spacing:2.5px;
text-transform:uppercase;

color:#fff;

animation:
peBadgeFloat 4s ease-in-out infinite;
}

@keyframes peBadgeFloat{

0%,
100%{
transform:translateY(0);
}

50%{
transform:translateY(-4px);
}

}

.pe-badge i{
color:var(--pe-purple-light);
}


/* TÍTULO */

.pe-hero h1{
font-family:var(--pe-title);

font-size:
clamp(3.3rem,7.5vw,7rem);

font-weight:800;

letter-spacing:-3px;

line-height:.94;

text-transform:uppercase;

color:#fff;

margin-bottom:20px;

animation:
peTitleIn 1.2s var(--pe-ease) both;

animation-delay:.25s;
}

@keyframes peTitleIn{

from{
opacity:0;
transform:translateY(35px);
letter-spacing:8px;
}

to{
opacity:1;
transform:translateY(0);
letter-spacing:-3px;
}

}


/* SUBTÍTULO */

.pe-hero-subtitle{
font-size:
clamp(.85rem,2vw,1.45rem);

font-weight:500;

letter-spacing:6px;

text-transform:uppercase;

color:var(--pe-purple-light);

margin-bottom:22px;

animation:
peFadeUp .9s var(--pe-ease) both;

animation-delay:.55s;
}


/* DESCRIPCIÓN */

.pe-hero-desc{
max-width:650px;

font-size:1.05rem;

line-height:1.85;

color:rgba(255,255,255,.72);

margin-bottom:40px;

animation:
peFadeUp .9s var(--pe-ease) both;

animation-delay:.7s;
}

@keyframes peFadeUp{

from{
opacity:0;
transform:translateY(25px);
}

to{
opacity:1;
transform:translateY(0);
}

}


/* BOTONES HERO */

.pe-hero-buttons{
display:flex;
flex-wrap:wrap;
gap:15px;

animation:
peFadeUp .9s var(--pe-ease) both;

animation-delay:.9s;
}


/* ============================================================
   INFO BAR
============================================================= */

.pe-info-bar{
position:relative;
z-index:10;

display:grid;
grid-template-columns:repeat(4,1fr);

margin:
-60px
var(--pe-padding)
0;

background:#fff;

border:1px solid var(--pe-border);

box-shadow:
0 30px 70px rgba(0,0,0,.08);
}

.pe-info-item{
position:relative;

padding:34px 28px;

border-right:1px solid var(--pe-border);

overflow:hidden;

transition:
background .4s ease,
transform .4s var(--pe-ease);
}

.pe-info-item:last-child{
border-right:0;
}

.pe-info-item::before{
content:"";

position:absolute;

left:0;
bottom:0;

width:100%;
height:3px;

background:var(--pe-purple);

transform:scaleX(0);

transform-origin:left;

transition:
transform .5s var(--pe-ease);
}

.pe-info-item:hover{
background:#FDFBFA;
transform:translateY(-5px);
}

.pe-info-item:hover::before{
transform:scaleX(1);
}

.pe-info-item h4{
display:flex;
align-items:center;
gap:9px;

font-size:.62rem;
font-weight:700;
letter-spacing:2px;
text-transform:uppercase;

margin-bottom:10px;

color:var(--pe-text-light);
}

.pe-info-item h4 i{
color:var(--pe-purple);
}

.pe-info-item p{
font-size:.95rem;
font-weight:700;
line-height:1.45;

color:var(--pe-text);
}


/* ============================================================
   SECCIONES BASE
============================================================= */

.pe-section{
position:relative;

padding:
var(--pe-section)
var(--pe-padding);
}

.pe-section-tag{
display:inline-flex;
align-items:center;
gap:13px;

margin-bottom:20px;

font-family:var(--pe-title);

font-size:.65rem;
font-weight:700;
letter-spacing:4px;

text-transform:uppercase;

color:var(--pe-purple);
}

.pe-section-tag::before{
content:"";

width:38px;
height:1px;

background:var(--pe-purple);
}

.pe-title{
font-family:var(--pe-title);

font-size:
clamp(2.3rem,4vw,4.2rem);

font-weight:800;

letter-spacing:-1.5px;

line-height:1.04;

text-transform:uppercase;

color:var(--pe-text);

margin-bottom:25px;
}

.pe-desc{
font-size:1.04rem;

line-height:1.9;

color:var(--pe-text-light);

max-width:620px;

margin-bottom:20px;
}



/* ============================================================
   COMERCIALIZA - BIEN INMOBILIARIA
============================================================= */

.pe-comercializa{
display:flex;
align-items:center;
gap:14px;
margin-top:32px;
padding-top:24px;
border-top:1px solid var(--pe-border);
}

.pe-comercializa-label{
font-family:var(--pe-title);
font-size:.6rem;
font-weight:700;
letter-spacing:2px;
text-transform:uppercase;
color:var(--pe-text-light);
}

.pe-comercializa img{
height:70px;
width:auto;
object-fit:contain;
}

/* ============================================================
   RESPONSIVE BASE
============================================================= */

@media(max-width:992px){

.pe-nav-links{
display:none;
}

.pe-menu-toggle{
display:block;
}

.pe-navbar > .pe-btn{
display:none;
}

.pe-info-bar{
grid-template-columns:1fr 1fr;
margin:0;
}

.pe-info-item:nth-child(2){
border-right:0;
}

.pe-info-item:nth-child(3){
border-top:1px solid var(--pe-border);
}

.pe-info-item:nth-child(4){
border-top:1px solid var(--pe-border);
border-right:0;
}

}

@media(max-width:600px){

.pe-navbar{
padding-left:20px;
padding-right:20px;
}

.pe-logo{
font-size:.85rem;
letter-spacing:3px;
}

.pe-hero{
padding:
140px
24px
100px;
}

.pe-hero h1{
font-size:clamp(3rem,15vw,5rem);
letter-spacing:-2px;
}

.pe-hero-subtitle{
letter-spacing:3px;
}

.pe-hero-buttons{
flex-direction:column;
align-items:stretch;
}

.pe-btn,
.pe-btn-outline{
width:100%;
}

.pe-info-bar{
grid-template-columns:1fr;
}

.pe-info-item{
border-right:0 !important;
border-top:1px solid var(--pe-border);
}

.pe-info-item:first-child{
border-top:0;
}

}




/* ============================================================
   PLAZA EMILIANI v4.2
   PARTE 2 — SECCIONES + ANIMACIONES + LIGHTBOX
   DISEÑO ORIGINAL CONSERVADO
============================================================= */


/* ============================================================
   COLORES
============================================================= */

.pe-root{

--pe-purple:#7B2783 !important;
--pe-purple-light:#A23AAA !important;
--pe-purple-soft:rgba(123,39,131,.08) !important;

--pe-gold:#C9A961 !important;

--pe-dark:#151312 !important;
--pe-dark-2:#211D1C !important;

--pe-white:#FFFFFF !important;

}


/* ============================================================
   PROYECTO
============================================================= */

.pe-proyecto{

display:grid !important;

grid-template-columns:
minmax(0,1fr)
minmax(0,1fr) !important;

gap:clamp(45px,7vw,100px) !important;

align-items:center !important;
}

.pe-proyecto-texto{
position:relative;
z-index:2;
}

.pe-proyecto-texto .pe-title{
max-width:650px;
}

.pe-proyecto-texto .pe-desc{
max-width:590px;
}


/* ============================================================
   ESTADÍSTICAS
============================================================= */

.pe-proy-stats{

display:flex !important;

gap:55px;

margin-top:42px;

padding-top:30px;

border-top:1px solid var(--pe-border);

position:relative;
}

.pe-proy-stats::before{

content:"";

position:absolute;

left:0;
top:-1px;

width:65px;
height:2px;

background:var(--pe-purple);

transition:
width .8s var(--pe-ease);
}

.pe-proy-stats:hover::before{
width:150px;
}

.pe-proy-stats h4{

font-family:var(--pe-title);

font-size:.63rem;

letter-spacing:2px;

text-transform:uppercase;

color:#5D5753 !important;

margin-bottom:7px;
}

.pe-proy-stats p{

font-family:var(--pe-title);

font-size:2.2rem;

font-weight:800;

line-height:1;

color:#151312 !important;

-webkit-text-fill-color:#151312 !important;
}


/* ============================================================
   IMAGEN PROYECTO
============================================================= */

.pe-proy-img-container{

position:relative !important;

width:100% !important;

min-width:0 !important;

overflow:hidden !important;

border-radius:8px !important;

box-shadow:
0 35px 80px rgba(0,0,0,.14) !important;

transition:
transform 1s var(--pe-ease),
box-shadow .7s ease;
}

.pe-proy-img-container::before{

content:"";

position:absolute;

inset:0;

z-index:2;

background:
linear-gradient(
120deg,
transparent 30%,
rgba(255,255,255,.2) 50%,
transparent 70%
);

transform:translateX(-120%);

transition:
transform 1.3s var(--pe-ease);

pointer-events:none;
}

.pe-proy-img-container:hover::before{
transform:translateX(120%);
}

.pe-proy-img{

display:block !important;

width:100% !important;

height:auto !important;

aspect-ratio:4/5 !important;

object-fit:cover !important;

object-position:center !important;

transition:
transform 1.2s var(--pe-ease),
filter .7s ease !important;
}

.pe-proy-img-container:hover{

transform:translateY(-9px);

box-shadow:
0 50px 100px rgba(0,0,0,.2) !important;
}

.pe-proy-img-container:hover .pe-proy-img{

transform:scale(1.06) !important;

filter:saturate(1.06);
}


/* ============================================================
   ETIQUETA IMAGEN
============================================================= */

.pe-proy-img-label{

position:absolute;

left:24px;
bottom:24px;

z-index:5;

display:flex;
flex-direction:column;
gap:4px;

padding:14px 18px;

background:rgba(18,16,15,.82);

backdrop-filter:blur(14px);
-webkit-backdrop-filter:blur(14px);

border-left:2px solid var(--pe-purple);

color:#fff;

opacity:0;

transform:translateY(18px);

transition:
opacity .5s ease,
transform .6s var(--pe-ease);
}

.pe-proy-img-container:hover .pe-proy-img-label{

opacity:1;

transform:translateY(0);
}

.pe-proy-img-label span{

font-family:var(--pe-title);

font-size:.65rem;

font-weight:700;

letter-spacing:2px;
}

.pe-proy-img-label small{

font-size:.7rem;

color:rgba(255,255,255,.62);
}


/* ============================================================
   ENTRADA PROYECTO
============================================================= */

.pe-proyecto-texto.pe-reveal{
transform:
translateX(-50px)
translateY(25px);
}

.pe-proyecto-texto.pe-reveal.pe-active{
transform:
translateX(0)
translateY(0);
}

.pe-proy-img-container.pe-reveal{
transform:
translateX(50px)
translateY(25px);
}

.pe-proy-img-container.pe-reveal.pe-active{
transform:
translateX(0)
translateY(0);
}


/* ============================================================
   UNIDADES
============================================================= */

.pe-unidades{
background:var(--pe-arena);
}

.pe-grid-unidades{

display:grid;

grid-template-columns:1fr 1fr;

gap:35px;

margin-top:50px;

margin-bottom:50px;
}

.pe-unidad-card{

position:relative;

background:#fff;

padding:40px;

border-radius:8px;

box-shadow:
0 20px 45px rgba(0,0,0,.055);

overflow:hidden;

transition:
transform .6s var(--pe-ease),
box-shadow .6s ease;
}

.pe-unidad-card::before{

content:"";

position:absolute;

top:0;
left:0;

width:4px;
height:0;

background:var(--pe-purple);

transition:
height .7s var(--pe-ease);
}

.pe-unidad-card:hover{

transform:translateY(-10px);

box-shadow:
0 35px 70px rgba(0,0,0,.1);
}

.pe-unidad-card:hover::before{
height:100%;
}

.pe-piso-tag{

display:inline-flex;

align-items:center;

gap:8px;

padding:8px 15px;

background:var(--pe-purple-soft);

border-radius:30px;

font-size:.63rem;

font-weight:700;

letter-spacing:2px;

text-transform:uppercase;

color:var(--pe-purple) !important;

margin-bottom:20px;
}

.pe-piso-tag i{
color:var(--pe-purple) !important;
}

.pe-unidad-card h3{

font-family:var(--pe-title);

font-size:4rem;

font-weight:800;

line-height:1;

margin-bottom:8px;

color:#151312 !important;

-webkit-text-fill-color:#151312 !important;
}

.pe-unidad-card h4{

font-size:1.25rem;

color:var(--pe-purple) !important;

margin-bottom:17px;
}

.pe-unidad-card p{

color:#5D5753 !important;
}

.pe-unidad-img-box{

height:300px;

margin-top:30px;

overflow:hidden;

border-radius:6px;
}

.pe-unidad-img{

width:100% !important;

height:100% !important;

object-fit:cover !important;

transition:
transform 1s var(--pe-ease);
}

.pe-unidad-card:hover .pe-unidad-img{
transform:scale(1.08);
}


/* ============================================================
   FEATURES
============================================================= */

.pe-features{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:20px;
}

.pe-feature{

background:#fff;

padding:34px 28px;

text-align:center;

border-radius:7px;

box-shadow:
0 15px 35px rgba(0,0,0,.045);

transition:
transform .5s var(--pe-ease),
box-shadow .5s ease;
}

.pe-feature:hover{

transform:translateY(-8px);

box-shadow:
0 25px 50px rgba(0,0,0,.08);
}

.pe-feature-icon{

font-size:1.8rem;

color:var(--pe-purple) !important;

margin-bottom:16px;

transition:
transform .5s var(--pe-elastic);
}

.pe-feature:hover .pe-feature-icon{

transform:
scale(1.18)
rotate(-5deg);
}


/* ============================================================
   TEXTOS FEATURES
============================================================= */

.pe-feature h5,
.pe-feature p{

color:#151312 !important;

-webkit-text-fill-color:#151312 !important;
}

.pe-feature h5{

font-family:var(--pe-title);

font-size:.95rem;

font-weight:800;

text-transform:uppercase;

letter-spacing:.5px;

margin-bottom:8px;
}

.pe-feature p{

font-size:.88rem;

line-height:1.65;

color:#5D5753 !important;

-webkit-text-fill-color:#5D5753 !important;
}

.pe-feature-icon i{

color:var(--pe-purple) !important;

-webkit-text-fill-color:var(--pe-purple) !important;
}


/* ============================================================
   GALERÍA
============================================================= */

.pe-grid-galeria{

display:grid;

grid-template-columns:
repeat(3,minmax(0,1fr));

gap:18px;

margin-top:45px;
}


/* TARJETA */

.pe-galeria-item,
.pe-gallery-item{

position:relative;

height:410px;

overflow:hidden;

border-radius:8px;

cursor:pointer;

background:#111;

box-shadow:
0 15px 35px rgba(0,0,0,.08);

transition:
transform .7s var(--pe-ease),
box-shadow .7s ease;
}


/* ANIMACIÓN DE ENTRADA */

.pe-galeria-item.pe-reveal,
.pe-gallery-item.pe-reveal{

transform:
translateY(35px)
scale(.97);

transition:
opacity .9s ease,
transform 1s var(--pe-ease),
box-shadow .7s ease;
}

.pe-galeria-item.pe-reveal.pe-active,
.pe-gallery-item.pe-reveal.pe-active{

transform:
translateY(0)
scale(1);
}


/* HOVER TARJETA */

.pe-galeria-item:hover,
.pe-gallery-item:hover{

transform:
translateY(-10px)
scale(1.012);

box-shadow:
0 30px 65px rgba(0,0,0,.18);
}


/* IMAGEN */

.pe-galeria-item img,
.pe-gallery-item img{

display:block !important;

width:100% !important;

height:100% !important;

max-width:none !important;

object-fit:cover !important;

transition:
transform 1.25s var(--pe-ease),
filter .8s ease !important;

will-change:transform;
}


/* ZOOM SUAVE */

.pe-galeria-item:hover img,
.pe-gallery-item:hover img{

transform:
scale(1.12) !important;

filter:
brightness(.72)
saturate(1.08);
}


/* CAPA OSCURA */

.pe-galeria-item::after,
.pe-gallery-item::after{

content:"";

position:absolute;

inset:0;

background:
linear-gradient(
180deg,
rgba(0,0,0,.02) 20%,
rgba(0,0,0,.82) 100%
);

opacity:0;

transition:
opacity .65s ease;

pointer-events:none;
}

.pe-galeria-item:hover::after,
.pe-gallery-item:hover::after{
opacity:1;
}


/* BRILLO QUE RECORRE LA IMAGEN */

.pe-galeria-item::before,
.pe-gallery-item::before{

content:"";

position:absolute;

top:0;
left:-120%;

z-index:4;

width:65%;
height:100%;

background:
linear-gradient(
90deg,
transparent,
rgba(255,255,255,.16),
transparent
);

transform:skewX(-18deg);

transition:
left 1s var(--pe-ease);

pointer-events:none;
}

.pe-galeria-item:hover::before,
.pe-gallery-item:hover::before{

left:145%;
}


/* TEXTO GALERÍA */

.pe-galeria-hover{

position:absolute;

left:20px;
right:20px;
bottom:25px;

z-index:6;

text-align:center;

opacity:0;

transform:
translateY(30px)
scale(.94);

transition:
opacity .55s ease,
transform .7s var(--pe-ease);

pointer-events:none;
}

.pe-galeria-item:hover .pe-galeria-hover,
.pe-gallery-item:hover .pe-galeria-hover{

opacity:1;

transform:
translateY(0)
scale(1);
}


/* ICONO */

.pe-galeria-hover-icon{

display:inline-flex;

align-items:center;
justify-content:center;

width:58px;
height:58px;

margin-bottom:13px;

border-radius:50%;

background:var(--pe-purple);

color:#fff;

box-shadow:
0 12px 35px rgba(0,0,0,.35);

transition:
transform .5s var(--pe-elastic),
background .4s ease;
}

.pe-galeria-item:hover .pe-galeria-hover-icon,
.pe-gallery-item:hover .pe-galeria-hover-icon{

transform:
scale(1.12);

background:var(--pe-purple-light);
}

.pe-galeria-hover p{

font-family:var(--pe-title);

font-size:.7rem;

font-weight:700;

letter-spacing:3px;

text-transform:uppercase;

color:#fff !important;
}


/* ============================================================
   UBICACIÓN ESTRATÉGICA
============================================================= */

.pe-entorno{

position:relative;

display:grid;

grid-template-columns:
minmax(0,1.05fr)
minmax(0,.95fr);

gap:clamp(45px,8vw,110px);

align-items:center;

background:
radial-gradient(
circle at 85% 20%,
rgba(123,39,131,.22),
transparent 35%
),
linear-gradient(
135deg,
#11100F 0%,
#191615 55%,
#100F0E 100%
);

overflow:hidden;
}


/* DECORACIÓN */

.pe-entorno::before{

content:"";

position:absolute;

width:420px;
height:420px;

right:-180px;
top:-180px;

border:
1px solid rgba(201,169,97,.18);

border-radius:50%;
}

.pe-entorno::after{

content:"";

position:absolute;

width:620px;
height:620px;

right:-280px;
top:-280px;

border:
1px solid rgba(255,255,255,.04);

border-radius:50%;
}

.pe-entorno > div{

position:relative;
z-index:2;
}


/* TAG */

.pe-entorno .pe-section-tag{

color:var(--pe-gold) !important;
}

.pe-entorno .pe-section-tag::before{

background:var(--pe-gold) !important;
}


/* TÍTULO */

.pe-entorno .pe-title{

max-width:700px;

margin-bottom:22px;

color:#fff !important;

-webkit-text-fill-color:#fff !important;
}

.pe-entorno .pe-desc{

color:rgba(255,255,255,.7) !important;
}


/* ============================================================
   LISTA
============================================================= */

.pe-entorno-list{

display:grid !important;

grid-template-columns:1fr 1fr;

gap:14px 28px;

margin-top:32px !important;

padding:0 !important;

list-style:none !important;
}

.pe-entorno-list li{

position:relative;

display:flex !important;

align-items:flex-start;

gap:12px !important;

margin:0 !important;

padding:15px 0;

border-bottom:
1px solid rgba(255,255,255,.08);

font-size:.92rem;

line-height:1.5;

color:rgba(255,255,255,.78) !important;

transition:
transform .4s var(--pe-ease),
color .4s ease;
}

.pe-entorno-list li:hover{

transform:translateX(6px);

color:#fff !important;
}

.pe-entorno-list li i{

color:var(--pe-gold) !important;

-webkit-text-fill-color:var(--pe-gold) !important;

font-size:.7rem;

margin-top:5px !important;
}


/* ============================================================
   TARJETAS CERCANÍA
============================================================= */

.pe-entorno-grid{

display:grid !important;

grid-template-columns:1fr 1fr;

gap:16px;

position:relative;

z-index:3;
}

.pe-entorno-card{

position:relative;

min-height:170px;

display:flex;

flex-direction:column;

justify-content:center;

padding:30px;

background:
linear-gradient(
145deg,
rgba(255,255,255,.08),
rgba(255,255,255,.025)
);

border:
1px solid rgba(255,255,255,.10);

overflow:hidden;

transition:
transform .6s var(--pe-ease),
border-color .5s ease,
background .5s ease,
box-shadow .6s ease;
}

.pe-entorno-card::before{

content:"";

position:absolute;

left:0;
bottom:0;

width:45px;
height:3px;

background:var(--pe-purple);

transition:
width .6s var(--pe-ease);
}

.pe-entorno-card::after{

content:"";

position:absolute;

top:18px;
right:18px;

width:7px;
height:7px;

border-radius:50%;

background:var(--pe-gold);

box-shadow:
0 0 0 5px rgba(201,169,97,.08);

transition:
box-shadow .5s ease,
transform .5s var(--pe-elastic);
}

.pe-entorno-card:hover{

transform:
translateY(-8px)
scale(1.015);

border-color:
rgba(162,58,170,.55);

background:
linear-gradient(
145deg,
rgba(123,39,131,.20),
rgba(255,255,255,.035)
);

box-shadow:
0 25px 55px rgba(0,0,0,.25);
}

.pe-entorno-card:hover::before{
width:100%;
}

.pe-entorno-card:hover::after{

transform:scale(1.35);

box-shadow:
0 0 0 7px rgba(201,169,97,.10);
}


/* NÚMERO / ENTREGA */

.pe-entorno-card h3{

font-family:var(--pe-title);

font-size:
clamp(1.35rem,2.2vw,2rem);

font-weight:800;

color:#fff !important;

-webkit-text-fill-color:#fff !important;

line-height:1.15;

margin-bottom:10px;
}

.pe-entorno-card p{

font-size:.67rem;

font-weight:700;

letter-spacing:2px;

text-transform:uppercase;

color:rgba(255,255,255,.5) !important;

-webkit-text-fill-color:rgba(255,255,255,.5) !important;
}


/* ============================================================
   LIGHTBOX — ZOOM DE GALERÍA
============================================================= */

.pe-lightbox{

position:fixed !important;

inset:0 !important;

z-index:999999 !important;

display:flex !important;

align-items:center !important;

justify-content:center !important;

padding:35px !important;

background:
rgba(8,7,7,.94) !important;

backdrop-filter:blur(18px) !important;

-webkit-backdrop-filter:blur(18px) !important;

opacity:0 !important;

visibility:hidden !important;

pointer-events:none !important;

transition:
opacity .45s ease,
visibility .45s ease !important;
}


/* ABIERTO */

.pe-lightbox.pe-open{

opacity:1 !important;

visibility:visible !important;

pointer-events:auto !important;
}


/* CONTENEDOR */

.pe-lightbox-content{

position:relative !important;

width:min(1180px,94vw) !important;

height:min(86vh,850px) !important;

display:flex !important;

align-items:center !important;

justify-content:center !important;

transform:
scale(.90)
translateY(20px) !important;

opacity:0 !important;

transition:
transform .65s var(--pe-ease),
opacity .45s ease !important;
}


/* ENTRADA DEL CONTENIDO */

.pe-lightbox.pe-open .pe-lightbox-content{

transform:
scale(1)
translateY(0) !important;

opacity:1 !important;
}


/* IMAGEN */

.pe-lightbox img,
#pe-lightbox-image{

display:block !important;

width:auto !important;

height:auto !important;

max-width:92vw !important;

max-height:82vh !important;

object-fit:contain !important;

margin:0 auto !important;

opacity:0 !important;

transform:
scale(.82)
translateY(15px) !important;

filter:
brightness(.82)
saturate(.9) !important;

border-radius:4px !important;

box-shadow:
0 35px 100px rgba(0,0,0,.65) !important;

transition:
opacity .45s ease,
transform .75s var(--pe-elastic),
filter .6s ease !important;
}


/* IMAGEN CARGADA */

.pe-lightbox.pe-image-loaded img,
.pe-lightbox.pe-image-loaded #pe-lightbox-image{

opacity:1 !important;

transform:
scale(1)
translateY(0) !important;

filter:
brightness(1)
saturate(1) !important;
}


/* ============================================================
   CONTADOR
============================================================= */

.pe-lightbox-counter{

position:absolute !important;

top:5px !important;

left:50% !important;

transform:translateX(-50%) !important;

z-index:20 !important;

font-family:var(--pe-title) !important;

font-size:.65rem !important;

font-weight:700 !important;

letter-spacing:3px !important;

color:rgba(255,255,255,.65) !important;

white-space:nowrap !important;
}


/* ============================================================
   BOTÓN CERRAR
============================================================= */

.pe-lightbox-close{

position:absolute !important;

top:-5px !important;

right:0 !important;

z-index:30 !important;

width:50px !important;

height:50px !important;

display:flex !important;

align-items:center !important;

justify-content:center !important;

border:
1px solid rgba(255,255,255,.18) !important;

border-radius:50% !important;

background:
rgba(255,255,255,.07) !important;

color:#fff !important;

font-size:1rem !important;

cursor:pointer !important;

backdrop-filter:blur(12px) !important;

-webkit-backdrop-filter:blur(12px) !important;

transition:
transform .45s var(--pe-elastic),
background .35s ease,
border-color .35s ease !important;
}

.pe-lightbox-close:hover{

transform:
rotate(90deg)
scale(1.08) !important;

background:
var(--pe-purple) !important;

border-color:
var(--pe-purple-light) !important;
}


/* ============================================================
   FLECHAS
============================================================= */

.pe-lightbox-nav{

position:absolute !important;

top:50% !important;

z-index:30 !important;

width:58px !important;

height:58px !important;

display:flex !important;

align-items:center !important;

justify-content:center !important;

border:
1px solid rgba(255,255,255,.16) !important;

border-radius:50% !important;

background:
rgba(255,255,255,.07) !important;

color:#fff !important;

font-size:1rem !important;

cursor:pointer !important;

backdrop-filter:blur(12px) !important;

-webkit-backdrop-filter:blur(12px) !important;

transition:
transform .45s var(--pe-elastic),
background .35s ease,
border-color .35s ease !important;
}

.pe-lightbox-prev{

left:0 !important;

transform:
translateY(-50%) !important;
}

.pe-lightbox-next{

right:0 !important;

transform:
translateY(-50%) !important;
}

.pe-lightbox-prev:hover{

transform:
translateY(-50%)
translateX(-4px)
scale(1.08) !important;

background:var(--pe-purple) !important;

border-color:var(--pe-purple-light) !important;
}

.pe-lightbox-next:hover{

transform:
translateY(-50%)
translateX(4px)
scale(1.08) !important;

background:var(--pe-purple) !important;

border-color:var(--pe-purple-light) !important;
}


/* ============================================================
   CONTACTO
============================================================= */

.pe-contacto{

display:grid;

grid-template-columns:
minmax(0,.85fr)
minmax(0,1.15fr);

gap:clamp(50px,8vw,110px);

align-items:start;

background:#F7F3EF;
}

.pe-contacto > div:first-child{
padding-top:15px;
}

.pe-contact-info{

margin-top:35px;

display:flex;

flex-direction:column;

gap:16px;
}

.pe-contact-info p{

display:flex;

align-items:center;

gap:14px;

font-size:.9rem;

font-weight:500;

color:var(--pe-text-light);
}

.pe-contact-info i{

width:40px;
height:40px;

display:flex;

align-items:center;
justify-content:center;

border-radius:50%;

background:var(--pe-purple-soft);

color:var(--pe-purple) !important;
}


/* ============================================================
   FORMULARIO
============================================================= */

.pe-form{

position:relative;

display:grid;

grid-template-columns:1fr 1fr;

gap:22px;

padding:42px;

background:#fff;

border:
1px solid var(--pe-border);

border-radius:10px;

box-shadow:
0 30px 70px rgba(0,0,0,.08);

overflow:hidden;
}

.pe-form::before{

content:"";

position:absolute;

left:0;
top:0;

width:100%;
height:4px;

background:
linear-gradient(
90deg,
var(--pe-purple),
var(--pe-purple-light),
var(--pe-gold)
);
}

.pe-form::after{

content:"";

position:absolute;

width:220px;
height:220px;

right:-130px;
bottom:-130px;

border:
1px solid rgba(123,39,131,.08);

border-radius:50%;

pointer-events:none;
}


/* CAMPOS */

.pe-form-group{

position:relative;

z-index:2;
}

.pe-form-group.full{

grid-column:1 / -1;
}

.pe-form-group label{

display:block;

margin-bottom:8px;

font-family:var(--pe-title);

font-size:.63rem;

font-weight:700;

letter-spacing:1.8px;

text-transform:uppercase;

color:#171413 !important;
}

.pe-form-group input,
.pe-form-group select,
.pe-form-group textarea{

display:block;

width:100% !important;

margin:0 !important;

padding:16px 17px !important;

background:#FBF9F7 !important;

border:
1px solid #E3DCD4 !important;

border-radius:5px !important;

outline:none !important;

font-family:var(--pe-body) !important;

font-size:.92rem !important;

line-height:1.5 !important;

color:#171413 !important;

-webkit-text-fill-color:#171413 !important;

box-shadow:none !important;

transition:
border-color .35s ease,
background .35s ease,
box-shadow .35s ease,
transform .35s var(--pe-ease);
}

.pe-form-group textarea{

min-height:125px !important;

resize:vertical;
}

.pe-form-group select{

cursor:pointer;

appearance:auto;

-webkit-appearance:auto;
}


/* PLACEHOLDER */

.pe-form-group input::placeholder,
.pe-form-group textarea::placeholder{

color:#9A928C !important;

-webkit-text-fill-color:#9A928C !important;

opacity:1 !important;
}


/* FOCUS */

.pe-form-group input:focus,
.pe-form-group select:focus,
.pe-form-group textarea:focus{

border-color:
var(--pe-purple) !important;

background:#fff !important;

box-shadow:
0 0 0 3px rgba(123,39,131,.08) !important;

transform:translateY(-1px);
}


/* AUTOFILL */

.pe-form-group input:-webkit-autofill{

-webkit-text-fill-color:#171413 !important;

-webkit-box-shadow:
0 0 0 1000px #FBF9F7 inset !important;
}


/* BOTÓN */

.pe-form-submit{

grid-column:1 / -1;

display:flex;

justify-content:flex-start;

padding-top:5px;

position:relative;

z-index:3;
}

.pe-form-submit .pe-btn{

min-width:220px;
}


/* MENSAJE */

.pe-form-message{

grid-column:1 / -1;

min-height:0;

font-size:.85rem;

font-weight:600;

position:relative;

z-index:3;
}

.pe-form-message.success{

padding:15px 18px;

background:rgba(123,39,131,.07);

border-left:
3px solid var(--pe-purple);

color:var(--pe-purple) !important;

animation:
peFormMessage .5s var(--pe-ease) both;
}

@keyframes peFormMessage{

from{
opacity:0;
transform:translateY(10px);
}

to{
opacity:1;
transform:translateY(0);
}

}


/* ============================================================
   FOOTER
============================================================= */

.pe-footer{

display:flex;

align-items:center;

justify-content:space-between;

gap:20px;

padding:
35px
var(--pe-padding);

background:#11100F;

border-top:
1px solid rgba(255,255,255,.07);
}

.pe-footer-logo{

font-family:var(--pe-title);

font-size:.85rem;

font-weight:800;

letter-spacing:4px;

color:#fff;
}

.pe-footer p{

font-size:.7rem;

letter-spacing:1px;

color:rgba(255,255,255,.45);
}



/* ============================================================
   COMERCIALIZA - BIEN INMOBILIARIA
============================================================= */

.pe-comercializa{
display:flex;
align-items:center;
gap:14px;
margin-top:32px;
padding-top:24px;
border-top:1px solid var(--pe-border);
}

.pe-comercializa-label{
font-family:var(--pe-title);
font-size:.6rem;
font-weight:700;
letter-spacing:2px;
text-transform:uppercase;
color:var(--pe-text-light);
}

.pe-comercializa img{
height:70px;
width:auto;
object-fit:contain;
}

/* ============================================================
   RESPONSIVE
============================================================= */

@media(max-width:992px){

.pe-proyecto{

grid-template-columns:
minmax(0,1fr)
minmax(0,1fr) !important;

gap:35px !important;
}

.pe-grid-galeria{
grid-template-columns:1fr 1fr;
}

.pe-features{
grid-template-columns:1fr 1fr;
}

.pe-entorno{
grid-template-columns:1fr;
}

.pe-contacto{
grid-template-columns:1fr;
}


/* LIGHTBOX TABLET */

.pe-lightbox{

padding:25px !important;
}

.pe-lightbox-content{

width:94vw !important;

height:84vh !important;
}

.pe-lightbox img,
#pe-lightbox-image{

max-width:88vw !important;

max-height:78vh !important;
}

.pe-lightbox-prev{
left:-5px !important;
}

.pe-lightbox-next{
right:-5px !important;
}

}


@media (max-width:700px){

    /* ===========================
       PROYECTO
    =========================== */
    .pe-proyecto{
        grid-template-columns:1fr !important;
        gap:45px !important;
    }

    .pe-proyecto-texto.pe-reveal,
    .pe-proy-img-container.pe-reveal{
        transform:translateY(35px);
    }

    .pe-proyecto-texto.pe-reveal.pe-active,
    .pe-proy-img-container.pe-reveal.pe-active{
        transform:translateY(0);
    }

    /* ===========================
       GALERÍA Y FEATURES
    =========================== */
    .pe-grid-galeria,
    .pe-features{
        grid-template-columns:1fr;
    }

    .pe-galeria-item,
    .pe-gallery-item{
        height:390px;
    }

    /* ===========================
       UNIDADES (CORREGIDO)
    =========================== */
    .pe-grid-unidades{
        grid-template-columns:1fr !important;
        gap:22px;
    }

    .pe-unidad-card{
        padding:28px 22px;
        border-radius:8px;
    }

    .pe-piso-tag{
        writing-mode:horizontal-tb !important;
        transform:none !important;
        flex-direction:row;
        justify-content:center;
        align-items:center;
        width:max-content;
        margin:0 auto 18px;
        gap:8px;
    }

    .pe-piso-tag i{
        margin:0;
        font-size:.8rem;
    }

    .pe-unidad-card h3{
        font-size:4rem;
        line-height:.9;
        text-align:center;
        margin-bottom:12px;
    }

    .pe-unidad-card h4{
        font-size:1.35rem;
        text-align:center;
        line-height:1.25;
        margin-bottom:14px;
        word-break:normal;
        overflow-wrap:normal;
    }

    .pe-unidad-card p{
        text-align:center;
        font-size:.96rem;
        line-height:1.75;
        word-break:normal !important;
        overflow-wrap:break-word;
        hyphens:none;
        max-width:100%;
    }

    .pe-unidad-img-box{
        height:230px;
        margin-top:22px;
        border-radius:6px;
        overflow:hidden;
    }

    .pe-unidad-img{
        width:100%;
        height:100%;
        object-fit:cover;
    }

    /* ===========================
       ENTORNO
    =========================== */
    .pe-entorno-list{
        grid-template-columns:1fr !important;
    }

    .pe-entorno-grid{
        grid-template-columns:1fr 1fr !important;
        gap:14px;
    }

    .pe-entorno-card{
        min-height:145px;
        padding:23px;
    }

    /* ===========================
       FORMULARIO
    =========================== */
    .pe-form{
        grid-template-columns:1fr;
        padding:28px 22px;
    }

    .pe-form-group,
    .pe-form-group.full,
    .pe-form-message,
    .pe-form-submit{
        grid-column:1 / -1;
    }

    .pe-form-submit .pe-btn{
        width:100%;
    }

    /* ===========================
       FOOTER
    =========================== */
    .pe-footer{
        flex-direction:column;
        text-align:center;
        gap:12px;
    }

}

/* ============================================================
   LIGHTBOX MÓVIL
============================================================= */

.pe-lightbox{

padding:15px !important;
}

.pe-lightbox-content{

width:100% !important;

height:88vh !important;
}

.pe-lightbox img,
#pe-lightbox-image{

max-width:94vw !important;

max-height:76vh !important;

border-radius:3px !important;
}


/* BOTÓN CERRAR */

.pe-lightbox-close{

top:4px !important;

right:2px !important;

width:44px !important;

height:44px !important;
}


/* FLECHAS */

.pe-lightbox-nav{

width:46px !important;

height:46px !important;

font-size:.85rem !important;

background:
rgba(21,19,18,.72) !important;
}

.pe-lightbox-prev{

left:3px !important;
}

.pe-lightbox-next{

right:3px !important;
}


/* CONTADOR */

.pe-lightbox-counter{

top:8px !important;

font-size:.58rem !important;

letter-spacing:2px !important;
}


/* GALERÍA MÓVIL */

.pe-galeria-item:hover,
.pe-gallery-item:hover{

transform:
translateY(-5px)
scale(1.005);
}

}


/* ============================================================
   REDUCIR ANIMACIONES SI EL USUARIO LO PREFIERE
============================================================= */

@media(prefers-reduced-motion:reduce){

.pe-galeria-item,
.pe-gallery-item,
.pe-galeria-item img,
.pe-gallery-item img,
.pe-lightbox,
.pe-lightbox-content,
.pe-lightbox img,
.pe-lightbox-close,
.pe-lightbox-nav{

transition:none !important;

animation:none !important;
}

}



/* ============================================================
   PLAZA EMILIANI
   BOTÓN FLOTANTE — VOLVER AL INICIO
   PALETA ORIGINAL DEL SITIO
============================================================= */

.btn-flotante-inicio{

    position:fixed;

    right:0;
    bottom:40px;

    z-index:99999;

    width:58px;
    min-height:205px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    padding:18px 0;

    /* PALETA PLAZA EMILIANI */
    background:
    linear-gradient(
        145deg,
        #7B2783 0%,
        #A23AAA 52%,
        #7B2783 100%
    );

    color:#fff !important;

    text-decoration:none !important;

    border-radius:
    28px 0 0 28px;

    border:
    1px solid rgba(201,169,97,.45);

    border-right:none;

    box-shadow:
    -8px 12px 30px rgba(123,39,131,.35),
    inset 1px 0 0 rgba(255,255,255,.16);

    overflow:hidden;

    font-family:'Manrope',sans-serif;

    transition:
    width .55s cubic-bezier(.22,1,.36,1),
    transform .45s cubic-bezier(.22,1,.36,1),
    box-shadow .45s ease,
    background .45s ease;

}


/* ============================================================
   BRILLO DORADO
============================================================= */

.btn-flotante-inicio::before{

    content:"";

    position:absolute;

    top:-120%;
    left:-90%;

    width:55%;
    height:340%;

    background:
    linear-gradient(
        90deg,
        transparent,
        rgba(201,169,97,.42),
        transparent
    );

    transform:rotate(18deg);

    transition:
    left 1s cubic-bezier(.22,1,.36,1);

    pointer-events:none;

}


.btn-flotante-inicio:hover::before{

    left:145%;

}


/* ============================================================
   BORDE INTERIOR
============================================================= */

.btn-flotante-inicio::after{

    content:"";

    position:absolute;

    inset:6px 0 6px 6px;

    border-left:
    1px solid rgba(255,255,255,.14);

    border-top:
    1px solid rgba(255,255,255,.08);

    border-bottom:
    1px solid rgba(255,255,255,.08);

    border-radius:
    22px 0 0 22px;

    pointer-events:none;

}


/* ============================================================
   HOVER
============================================================= */

.btn-flotante-inicio:hover{

    width:72px;

    transform:
    translateX(-4px);

    background:
    linear-gradient(
        145deg,
        #A23AAA 0%,
        #7B2783 55%,
        #A23AAA 100%
    );

    box-shadow:
    -12px 18px 40px rgba(123,39,131,.50),
    inset 1px 0 0 rgba(255,255,255,.20);

}


/* ============================================================
   ICONO
============================================================= */

.btn-flotante-inicio i{

    position:relative;

    z-index:2;

    display:flex;

    align-items:center;
    justify-content:center;

    width:39px;
    height:39px;

    margin-bottom:18px;

    border-radius:50%;

    background:
    rgba(255,255,255,.10);

    border:
    1px solid rgba(201,169,97,.65);

    color:#C9A961 !important;

    font-size:1.15rem;

    filter:
    drop-shadow(
        0 3px 7px rgba(0,0,0,.25)
    );

    animation:
    peCasaFlotante 3s ease-in-out infinite;

    transition:
    transform .5s cubic-bezier(.22,1,.36,1),
    background .35s ease,
    box-shadow .35s ease,
    color .35s ease;

}


/* ICONO HOVER */

.btn-flotante-inicio:hover i{

    transform:
    scale(1.12)
    translateY(-2px);

    background:
    rgba(201,169,97,.16);

    color:#fff !important;

    box-shadow:
    0 8px 22px rgba(0,0,0,.18);

}


/* ============================================================
   PULSO DORADO
============================================================= */

.btn-flotante-inicio i::after{

    content:"";

    position:absolute;

    inset:-5px;

    border:
    1px solid rgba(201,169,97,.55);

    border-radius:50%;

    opacity:0;

    animation:
    peCasaPulso 3s ease-out infinite;

}


@keyframes peCasaPulso{

    0%{

        transform:scale(.8);

        opacity:0;

    }

    20%{

        opacity:.7;

    }

    60%,
    100%{

        transform:scale(1.4);

        opacity:0;

    }

}


/* ============================================================
   ANIMACIÓN CASA
============================================================= */

@keyframes peCasaFlotante{

    0%,
    100%{

        transform:
        translateY(0);

    }

    50%{

        transform:
        translateY(-4px);

    }

}


/* ============================================================
   TEXTO
============================================================= */

.btn-flotante-inicio span{

    position:relative;

    z-index:2;

    writing-mode:
    vertical-rl;

    transform:
    rotate(180deg);

    letter-spacing:
    2.5px;

    font-size:
    .68rem;

    line-height:1;

    font-weight:
    800;

    text-transform:
    uppercase;

    color:#fff !important;

    text-shadow:
    0 2px 5px rgba(0,0,0,.25);

    transition:
    letter-spacing .4s ease;

}


.btn-flotante-inicio:hover span{

    letter-spacing:
    3px;

}


/* ============================================================
   LÍNEA DORADA DECORATIVA
============================================================= */

.btn-flotante-inicio span::after{

    content:"";

    display:block;

    width:2px;
    height:22px;

    margin:
    12px auto 0;

    background:
    linear-gradient(
        to bottom,
        #C9A961,
        transparent
    );

    opacity:.8;

}


/* ============================================================
   ENTRADA
============================================================= */

.btn-flotante-inicio{

    animation:
    peEntradaBoton .9s cubic-bezier(.22,1,.36,1) .5s both;

}


@keyframes peEntradaBoton{

    from{

        opacity:0;

        transform:
        translateX(80px);

    }

    to{

        opacity:1;

        transform:
        translateX(0);

    }

}


/* ============================================================
   TABLET
============================================================= */

@media(max-width:768px){

    .btn-flotante-inicio{

        bottom:28px;

        width:52px;

        min-height:180px;

        padding:15px 0;

        border-radius:
        24px 0 0 24px;

    }

    .btn-flotante-inicio:hover{

        width:62px;

    }

    .btn-flotante-inicio i{

        width:34px;
        height:34px;

        margin-bottom:15px;

        font-size:1rem;

    }

    .btn-flotante-inicio span{

        font-size:.62rem;

        letter-spacing:2px;

    }

}


/* ============================================================
   MÓVIL
============================================================= */

@media(max-width:480px){

    .btn-flotante-inicio{

        bottom:22px;

        width:47px;

        min-height:155px;

        padding:13px 0;

        border-radius:
        21px 0 0 21px;

    }

    .btn-flotante-inicio:hover{

        width:54px;

        transform:
        translateX(-2px);

    }

    .btn-flotante-inicio i{

        width:30px;
        height:30px;

        margin-bottom:12px;

        font-size:.9rem;

    }

    .btn-flotante-inicio span{

        font-size:.55rem;

        letter-spacing:1.7px;

    }

    .btn-flotante-inicio span::after{

        height:16px;

        margin-top:9px;

    }

}


/* ============================================================
   REDUCIR ANIMACIONES
============================================================= */

@media(prefers-reduced-motion:reduce){

    .btn-flotante-inicio,
    .btn-flotante-inicio i,
    .btn-flotante-inicio i::after{

        animation:none !important;

        transition:none !important;

    }

}


/* ============================================================
   CONTACTO: TARJETA Y POP UP «AGENDA TU VISITA»
============================================================= */

.pe-contacto{
align-items:center;
}

.pe-contacto-cta{
margin-top:34px;
}

.pe-contact-card{
position:relative;
padding:42px;
background:#fff;
border:1px solid var(--pe-border);
border-radius:10px;
box-shadow:0 30px 70px rgba(0,0,0,.08);
overflow:hidden;
}

.pe-contact-card::before,
.pe-modal-caja::before{
content:"";
position:absolute;
left:0;
top:0;
width:100%;
height:4px;
background:linear-gradient(90deg,var(--pe-purple),var(--pe-purple-light),var(--pe-gold));
z-index:1;
}

.pe-contact-card .pe-contact-info{
margin-top:0;
}

.pe-contact-info a{
display:inline-flex;
align-items:center;
gap:14px;
color:inherit;
text-decoration:none;
transition:color .3s var(--pe-ease);
}

.pe-contact-info a:hover{
color:var(--pe-purple);
}

.pe-modal{
position:fixed;
inset:0;
z-index:100000;
display:flex;
align-items:center;
justify-content:center;
padding:24px;
opacity:0;
visibility:hidden;
transition:opacity .35s var(--pe-ease),visibility .35s var(--pe-ease);
}

.pe-modal.pe-open{
opacity:1;
visibility:visible;
}

.pe-modal-fondo{
position:absolute;
inset:0;
background:rgba(8,7,7,.72);
backdrop-filter:blur(6px);
-webkit-backdrop-filter:blur(6px);
}

.pe-modal-caja{
position:relative;
width:min(640px,100%);
max-height:calc(100vh - 48px);
max-height:calc(100dvh - 48px);
overflow-y:auto;
background:#fff;
border-radius:10px;
box-shadow:0 30px 80px rgba(0,0,0,.35);
transform:translateY(24px) scale(.98);
transition:transform .45s var(--pe-ease);
}

.pe-modal.pe-open .pe-modal-caja{
transform:none;
}

.pe-modal-cerrar{
position:absolute;
top:16px;
right:16px;
z-index:2;
width:40px;
height:40px;
display:flex;
align-items:center;
justify-content:center;
border:0;
border-radius:50%;
background:var(--pe-purple-soft);
color:var(--pe-purple);
font-size:1.1rem;
cursor:pointer;
transition:background .3s var(--pe-ease),color .3s var(--pe-ease);
}

.pe-modal-cerrar:hover{
background:var(--pe-purple);
color:#fff;
}

.pe-modal-cabecera{
padding:42px 42px 0;
}

.pe-modal-titulo{
margin:14px 0 8px;
font-family:var(--pe-title);
font-size:clamp(1.5rem,3vw,2.1rem);
font-weight:800;
line-height:1.05;
text-transform:uppercase;
color:var(--pe-dark);
}

.pe-modal-cabecera p{
font-size:.95rem;
color:var(--pe-text-light);
}

.pe-modal .pe-form{
padding:28px 42px 42px;
border:0;
border-radius:0;
box-shadow:none;
}

.pe-modal .pe-form::before{
display:none;
}

body.pe-modal-abierto{
overflow:hidden;
}

@media(max-width:600px){

.pe-modal{
padding:0;
align-items:flex-end;
}

.pe-modal-caja{
width:100%;
max-height:92vh;
max-height:92dvh;
border-radius:14px 14px 0 0;
}

.pe-modal-cabecera{
padding:34px 22px 0;
}

.pe-modal .pe-form{
padding:22px 22px 28px;
}

.pe-contact-card{
padding:28px 22px;
}

.pe-contacto-cta .pe-btn{
width:100%;
justify-content:center;
}
}



/* ============================================================
   ICONO FLOTANTE DEL FORMULARIO (hoja de papel)
   Va encima del botón «Volver al inicio», con su mismo estilo.
============================================================= */

.pe-flotante-agenda{
    position:fixed;
    right:0;
    bottom:295px;
    z-index:99999;
    width:58px;
    height:66px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0;
    background:linear-gradient(145deg,#7B2783 0%,#A23AAA 52%,#7B2783 100%);
    border:1px solid rgba(201,169,97,.45);
    border-right:none;
    border-radius:28px 0 0 28px;
    box-shadow:
    -8px 12px 30px rgba(123,39,131,.35),
    inset 1px 0 0 rgba(255,255,255,.16);
    cursor:pointer;
    transition:
    width .55s cubic-bezier(.22,1,.36,1),
    box-shadow .45s ease,
    background .45s ease;
    animation:peEntradaBoton .9s cubic-bezier(.22,1,.36,1) .65s both;
}

.pe-flotante-agenda:hover,
.pe-flotante-agenda:focus-visible{
    width:72px;
    background:linear-gradient(145deg,#A23AAA 0%,#7B2783 55%,#A23AAA 100%);
    box-shadow:
    -12px 18px 40px rgba(123,39,131,.50),
    inset 1px 0 0 rgba(255,255,255,.20);
    outline:none;
}

.pe-flotante-agenda i{
    display:flex;
    align-items:center;
    justify-content:center;
    width:39px;
    height:39px;
    border-radius:50%;
    background:rgba(255,255,255,.10);
    border:1px solid rgba(201,169,97,.65);
    color:#C9A961 !important;
    font-size:1.05rem;
    filter:drop-shadow(0 3px 7px rgba(0,0,0,.25));
    transition:
    transform .5s cubic-bezier(.22,1,.36,1),
    background .35s ease,
    color .35s ease;
}

.pe-flotante-agenda:hover i,
.pe-flotante-agenda:focus-visible i{
    transform:scale(1.12);
    background:rgba(201,169,97,.16);
    color:#fff !important;
}

@media(max-width:768px){
    .pe-flotante-agenda{
        bottom:250px;
        width:52px;
        height:58px;
        border-radius:24px 0 0 24px;
    }
    .pe-flotante-agenda:hover{
        width:62px;
    }
    .pe-flotante-agenda i{
        width:34px;
        height:34px;
        font-size:.95rem;
    }
}

@media(max-width:480px){
    .pe-flotante-agenda{
        bottom:215px;
        width:47px;
        height:52px;
        border-radius:21px 0 0 21px;
    }
    .pe-flotante-agenda:hover{
        width:54px;
    }
    .pe-flotante-agenda i{
        width:30px;
        height:30px;
        font-size:.85rem;
    }
}

@media(prefers-reduced-motion:reduce){
    .pe-flotante-agenda,
    .pe-flotante-agenda i{
        animation:none !important;
        transition:none !important;
    }
}

/* Pop up abierto desde el icono: al lado, sin oscurecer la página */

@media(hover:hover) and (pointer:fine){

    .pe-modal.pe-modal-flotante{
        pointer-events:none;
        justify-content:flex-end;
        align-items:flex-end;
        padding:24px 96px 40px 24px;
    }

    .pe-modal.pe-modal-flotante .pe-modal-fondo{
        display:none;
    }

    .pe-modal.pe-modal-flotante.pe-open .pe-modal-caja{
        pointer-events:auto;
    }

    .pe-modal.pe-modal-flotante .pe-modal-caja{
        width:min(540px,100%);
        max-height:calc(100vh - 64px);
        max-height:calc(100dvh - 64px);
        box-shadow:0 24px 70px rgba(0,0,0,.30);
        transform:translateX(18px);
    }

    .pe-modal.pe-modal-flotante.pe-open .pe-modal-caja{
        transform:none;
    }
}



/* ============================================================
   PORTADA: más aire entre el texto y el botón «Ver galería»
============================================================= */

.pe-root .pe-hero-buttons{
margin-top:36px;
}

@media(max-width:600px){
.pe-root .pe-hero-buttons{
margin-top:28px;
}
}