/* =====================================================================
   Plaza Residences – side buttons + Reserved Area popup (all pages)
   Coastal Blue & Gold · glass style
   ===================================================================== */
:root { --pz-navy:#2f4b5e; --pz-nav:#8fa8b5; --pz-gold:#b8965a; --pz-gold-d:#9c7c45; --pz-sky:#e3ecf0; --pz-text:#1f2f3a; --pz-muted:#5b6b76;
        --pz-bounce:cubic-bezier(.34,1.56,.64,1); }

/* ---------- side buttons (3D) ---------- */
@property --fy { syntax:'<length>'; inherits:false; initial-value:0px; }
.pz-side { position:fixed; right:0; top:clamp(120px, 20vh, 190px); z-index:900; display:flex; flex-direction:column; align-items:flex-end; gap:18px;
           transition:opacity .45s ease, transform .6s var(--pz-bounce); font-family:Karla,'Open Sans',Arial,sans-serif; perspective:600px; }
.pz-tab { all:unset; box-sizing:border-box; cursor:pointer; position:relative; display:flex; align-items:center; height:76px; padding:0 22px 0 14px;
          border-radius:40px 0 0 40px; color:#fff !important; text-decoration:none !important;
          --tx:120%; --ty:0px; --ry:0deg;
          transform:translateX(var(--tx)) translateY(calc(var(--ty) + var(--fy))) rotateY(var(--ry));
          transition:transform .8s var(--pz-bounce), box-shadow .3s, filter .3s, background .3s;
          backdrop-filter:blur(3px) saturate(130%); -webkit-backdrop-filter:blur(3px) saturate(130%);
          border:1px solid rgba(255,255,255,.55); border-right:0; }
/* colour + 3D depth: light top, dark bottom edge, soft drop shadow */
.pz-tab.pz-reserved { --edge:rgba(26,45,58,.3); background:linear-gradient(180deg, rgba(79,117,144,.3) 0%, rgba(47,75,94,.24) 55%, rgba(37,60,76,.3) 100%); }
.pz-tab.pz-choose   { --edge:rgba(122,95,49,.3); background:linear-gradient(180deg, rgba(216,185,125,.34) 0%, rgba(184,150,90,.26) 55%, rgba(163,131,74,.32) 100%); }
.pz-tab { box-shadow: inset 0 2px 0 rgba(255,255,255,.45), inset 0 -3px 6px rgba(0,0,0,.12),
                      0 6px 0 var(--edge), 0 12px 22px rgba(20,34,44,.12), 0 0 22px 1px var(--halo); }
.pz-tab::before { content:""; position:absolute; left:10px; right:0; top:6px; height:40%; border-radius:30px 0 0 30px;
                  background:linear-gradient(180deg, rgba(255,255,255,.28), rgba(255,255,255,0)); pointer-events:none; }
.pz-side.is-in .pz-tab { --tx:0px; animation:pz-float 3.6s ease-in-out 1.2s infinite; }
.pz-side.is-in .pz-tab:nth-child(2) { animation-duration:4.2s; animation-delay:1.9s; }
@keyframes pz-float { 0%,100% { --fy:0px; } 50% { --fy:-9px; } }

/* pulsing glow ring */
.pz-tab::after { content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
                 box-shadow:0 0 0 0 var(--glow); animation:pz-pulse 2.6s ease-out 1.2s infinite; }
.pz-tab.pz-reserved { --glow:rgba(79,117,144,.5); --halo:rgba(110,160,195,.32); --icoglow:rgba(170,210,240,.9); }
.pz-tab.pz-choose   { --glow:rgba(216,185,125,.6); --halo:rgba(230,190,110,.34); --icoglow:rgba(255,225,160,.95); }

/* breathing glow: a blurred colour cloud behind each button */
.pz-glow { position:absolute; inset:-6px -2px -10px -10px; border-radius:inherit; z-index:-1; pointer-events:none;
           background:var(--halo); filter:blur(18px); opacity:.45; animation:pz-breathe 3s ease-in-out infinite; }
.pz-tab.pz-choose .pz-glow { animation-delay:1.4s; }
@keyframes pz-breathe { 0%,100% { opacity:.15; transform:scale(.96); } 50% { opacity:.45; transform:scale(1.06); } }

/* glowing icon badge + luminous icon */
.pz-side.is-in .pz-ico { animation:pz-icoglow 3s ease-in-out infinite; }
.pz-side.is-in .pz-tab:nth-child(2) .pz-ico { animation-delay:1.4s; }
@keyframes pz-icoglow { 0%,100% { box-shadow:inset 0 1px 1px rgba(255,255,255,.5), inset 0 -2px 4px rgba(0,0,0,.2), 0 0 6px var(--icoglow); }
                        50%     { box-shadow:inset 0 1px 1px rgba(255,255,255,.6), inset 0 -2px 4px rgba(0,0,0,.2), 0 0 20px 3px var(--icoglow); } }
.pz-ico svg { filter:drop-shadow(0 0 4px var(--icoglow)) drop-shadow(0 2px 2px rgba(0,0,0,.25)) !important; }
.pz-tab.pz-choose::after { animation-delay:2.5s; }
@keyframes pz-pulse { 0% { box-shadow:0 0 0 0 var(--glow); opacity:1; } 70% { box-shadow:0 0 0 16px transparent; opacity:0; } 100% { box-shadow:0 0 0 0 transparent; opacity:0; } }

/* icon turns slowly in 3D inside its badge */
.pz-ico { perspective:120px; }
.pz-side.is-in .pz-ico svg { animation:pz-turn 5s ease-in-out 1.5s infinite; }
.pz-side.is-in .pz-tab:nth-child(2) .pz-ico svg { animation-delay:3.2s; }
@keyframes pz-turn { 0%,70%,100% { transform:rotateY(0deg); } 80% { transform:rotateY(180deg) scale(1.08); } 90% { transform:rotateY(360deg); } }

/* hover: stop floating so the button stays still under the pointer */
.pz-side .pz-tab:hover, .pz-side .pz-tab:focus-visible { animation-play-state:paused; }
.pz-tab:hover::after { animation:none; }
.pz-tab:hover .pz-ico svg { animation:none; }
.pz-side.is-in .pz-tab:nth-child(2) { transition-delay:.12s, 0s, 0s; }
.pz-tab.pz-reserved:hover { background:linear-gradient(180deg, rgba(79,117,144,.8), rgba(47,75,94,.78) 55%, rgba(37,60,76,.82)); }
.pz-tab.pz-choose:hover   { background:linear-gradient(180deg, rgba(216,185,125,.85), rgba(184,150,90,.8) 55%, rgba(163,131,74,.85)); }
.pz-tab:hover { --ty:-4px; --ry:-8deg; box-shadow: inset 0 2px 0 rgba(255,255,255,.4), inset 0 -3px 6px rgba(0,0,0,.18),
                                                   0 10px 0 var(--edge), 0 24px 36px rgba(20,34,44,.4), 0 0 36px 6px var(--halo); transition-delay:0s; }
.pz-tab:active { --ty:4px; box-shadow: inset 0 2px 0 rgba(255,255,255,.3), inset 0 -2px 4px rgba(0,0,0,.2),
                                       0 2px 0 var(--edge), 0 8px 14px rgba(20,34,44,.3); transition-duration:.12s; }
.pz-ico { flex:none; width:50px; height:50px; border-radius:50%; display:grid; place-items:center;
          background:radial-gradient(circle at 35% 30%, rgba(255,255,255,.3), rgba(255,255,255,.03) 60%); border:1px solid rgba(255,255,255,.45);
          box-shadow:inset 0 1px 1px rgba(255,255,255,.5), inset 0 -2px 4px rgba(0,0,0,.2), 0 3px 8px rgba(0,0,0,.18); }
.pz-ico svg { width:30px; height:30px; filter:drop-shadow(0 2px 2px rgba(0,0,0,.25)); transition:transform .55s var(--pz-bounce); }
.pz-tab:hover .pz-ico svg { transform:scale(1.14) rotate(-6deg); }
.pz-label { max-width:0; opacity:0; white-space:nowrap; font-size:14px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
            text-shadow:0 1px 2px rgba(0,0,0,.25);
            transition:max-width .55s var(--pz-bounce), opacity .3s, margin .55s var(--pz-bounce); }
.pz-tab:hover .pz-label, .pz-tab:focus-visible .pz-label { max-width:240px; opacity:1; margin-left:14px; }
.pz-tab:focus-visible { outline:3px solid #fff; outline-offset:-6px; }

@media (max-width:767px) {
  .pz-side { top:auto; bottom:22px; right:14px; transform:none; gap:16px; perspective:none; }
  .pz-side.is-away { opacity:0; transform:translateY(40px) scale(.8); pointer-events:none; }
  .pz-tab { width:64px; height:64px; padding:0; justify-content:center; border-radius:50%; --tx:0px; border-right:1px solid rgba(255,255,255,.45);
            transform:translateY(calc(var(--ty) + var(--fy))) scale(var(--s,0)); }
  .pz-tab::before { left:8px; right:8px; border-radius:50%; height:45%; }
  .pz-side.is-in .pz-tab { --s:1; }
  .pz-tab:hover { --ry:0deg; }
  .pz-ico { width:48px; height:48px; background:none; box-shadow:none; }
  .pz-label, .pz-tab:hover .pz-label { max-width:0; opacity:0; margin:0; }
}

/* ---------- popup ---------- */
.pz-modal { position:fixed; inset:0; z-index:10000; display:grid; place-items:center; padding:20px;
            font-family:Karla,'Open Sans',Arial,sans-serif; color:var(--pz-text); }
.pz-modal[hidden] { display:none; }
.pz-overlay { position:absolute; inset:0; background:rgba(31,47,58,.45); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
              opacity:0; transition:opacity .35s; }
.pz-dialog { position:relative; width:100%; max-width:540px; max-height:calc(100vh - 40px); overflow:auto; border-radius:22px;
             padding:40px 40px 32px; text-align:center;
             background:linear-gradient(160deg, rgba(255,255,255,.9), rgba(227,236,240,.78));
             backdrop-filter:blur(22px) saturate(150%); -webkit-backdrop-filter:blur(22px) saturate(150%);
             border:1px solid rgba(255,255,255,.8); box-shadow:0 30px 80px rgba(20,34,44,.35), inset 0 1px 0 #fff;
             opacity:0; transform:translateY(30px) scale(.92); }
.pz-modal.is-open .pz-overlay { opacity:1; }
.pz-modal.is-open .pz-dialog { animation:pz-pop .65s var(--pz-bounce) forwards; }
.pz-modal.is-closing .pz-overlay { opacity:0; }
.pz-modal.is-closing .pz-dialog { animation:pz-out .28s ease forwards; }
@keyframes pz-pop { 0% { opacity:0; transform:translateY(30px) scale(.92); } 100% { opacity:1; transform:none; } }
@keyframes pz-out { to { opacity:0; transform:translateY(16px) scale(.96); } }
.pz-dialog::before { content:""; position:absolute; width:260px; height:260px; border-radius:50%; top:-120px; right:-90px; z-index:-1;
                     background:radial-gradient(circle, rgba(184,150,90,.35), transparent 70%); }

.pz-close { all:unset; position:absolute; top:16px; right:16px; width:40px; height:40px; border-radius:50%; cursor:pointer;
            display:grid; place-items:center; color:var(--pz-navy); background:rgba(255,255,255,.6); border:1px solid rgba(47,75,94,.12);
            transition:transform .45s var(--pz-bounce), background .2s; }
.pz-close:hover { transform:rotate(90deg); background:#fff; }
.pz-close:focus-visible { outline:2px solid var(--pz-gold); }
.pz-logo { height:46px; width:auto; display:block; margin:0 auto 18px; }
.pz-kicker { font-size:12px; letter-spacing:.22em; text-transform:uppercase; color:var(--pz-gold); font-weight:700; margin:0 0 8px; }
.pz-title { font-family:Cormorant,Georgia,serif; font-weight:600; font-size:clamp(26px,4vw,34px); line-height:1.1; color:var(--pz-navy); margin:0 0 10px; }
.pz-lead { font-size:15px; line-height:1.6; color:var(--pz-muted); margin:0 auto 24px; max-width:420px; }
.pz-perks { display:grid; gap:12px; text-align:left; margin:0 0 26px; }
.pz-perk { display:flex; gap:14px; align-items:flex-start; padding:14px 16px; border-radius:14px; background:rgba(255,255,255,.62);
           border:1px solid rgba(255,255,255,.9); box-shadow:0 6px 16px rgba(31,47,58,.06);
           opacity:0; transform:translateY(14px); }
.pz-modal.is-open .pz-perk { animation:pz-rise .6s var(--pz-bounce) forwards; }
.pz-modal.is-open .pz-perk:nth-child(1) { animation-delay:.15s; }
.pz-modal.is-open .pz-perk:nth-child(2) { animation-delay:.25s; }
@keyframes pz-rise { to { opacity:1; transform:none; } }
.pz-perk-ico { flex:none; width:44px; height:44px; border-radius:12px; display:grid; place-items:center; color:#fff;
               background:linear-gradient(145deg, var(--pz-navy), #456a82); box-shadow:0 6px 14px rgba(47,75,94,.3); }
.pz-perk-ico.gold { background:linear-gradient(145deg, var(--pz-gold), var(--pz-gold-d)); box-shadow:0 6px 14px rgba(184,150,90,.35); }
.pz-perk-ico svg { width:22px; height:22px; }
.pz-perk b { display:block; font-size:15px; color:var(--pz-navy); margin-bottom:2px; }
.pz-perk span { font-size:14px; line-height:1.5; color:var(--pz-muted); }
.pz-actions { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.pz-btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-width:180px; padding:14px 24px; border-radius:40px;
          font-size:13px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; text-decoration:none !important;
          transition:transform .45s var(--pz-bounce), box-shadow .3s, background .3s; }
.pz-btn svg { width:18px; height:18px; }
.pz-btn:hover { transform:translateY(-3px); }
.pz-btn:focus-visible { outline:2px solid var(--pz-gold); outline-offset:3px; }
.pz-btn-primary { background:var(--pz-navy); color:#fff !important; box-shadow:0 10px 24px rgba(47,75,94,.3); }
.pz-btn-primary:hover { background:#24394a; box-shadow:0 16px 30px rgba(47,75,94,.38); }
.pz-btn-ghost { background:rgba(255,255,255,.7); color:var(--pz-navy) !important; border:1px solid rgba(47,75,94,.2); }
.pz-btn-ghost:hover { background:#fff; }
.pz-note { margin:20px 0 0; font-size:13px; color:var(--pz-muted); }

@media (max-width:560px) {
  .pz-dialog { padding:34px 20px 24px; border-radius:18px; }
  .pz-btn { flex:1 1 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .pz-tab, .pz-label, .pz-tab svg, .pz-overlay, .pz-close, .pz-btn { transition:none !important; }
  .pz-dialog, .pz-perk { animation:none !important; opacity:1 !important; transform:none !important; }
  .pz-side .pz-tab { transform:none !important; animation:none !important; }
  .pz-tab::after, .pz-ico svg, .pz-ico, .pz-glow { animation:none !important; }
}

/* ---------- footer / contacts: bigger stacked Plaza emblem ---------- */
.contact-logo .logo-bianco-contatti { width:150px; min-width:150px; height:auto; max-width:none;
                                      filter:drop-shadow(0 4px 10px rgba(20,34,44,.18)); }
.contact-logo { display:flex; align-items:center; }
@media (max-width:991px) { .contact-logo { justify-content:center; } .contact-logo .logo-bianco-contatti { width:180px; min-width:180px; } }
@media (max-width:479px) { .contact-logo .logo-bianco-contatti { width:200px; min-width:200px; } }
