@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;900&display=swap');

:root{
--txt_pink: #eb3b8a;
--txt_orange: #ff6a33;
--txt_blue: #0fb2c2;
--txt_black: #50565b;
--txt_placeholder: #333132;
--bg_white: #000000;
}

/* =========================
   SECTION GENERAL
========================= */
body {font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;color: var(--txt_black) !important;background: var(--bg_white);}

/* =========================
   WA
========================= */
.whatsappFloat {position: fixed;bottom: 25px;right: 18px;width: 54px;height: 54px;background: #25D366;color: #fff;border-radius: 50%;display: flex;align-items: center;justify-content: center;font-size: 26px;text-decoration: none;z-index: 1000;box-shadow: 0 8px 20px rgba(0,0,0,.25);}
.whatsappFloat:hover {transform: scale(1.05);}

/* =========================
   LOADING
========================= */
main {transition: opacity 0.4s ease-in-out, filter 0.4s ease-in-out;will-change: opacity, 0.4s;min-height: 470px;}
main.content-exit {opacity: 0;filter: blur(8px);transform: none;}
main.content-enter-start {opacity: 0;filter: blur(8px);transform: none;}
main.content-enter-active {opacity: 1;filter: blur(0);}
main {transition: opacity 0.4s ease-in-out, filter 0.4s ease-in-out;min-height: 420px;}
.centered-message-container {display: flex;justify-content: center;align-items: center;text-align: center;width: 100%;min-height: inherit;padding: 20px;}
.centered-message-container p {color: red;font-size: 1.1em;}
.spinner-container {display: flex;justify-content: center;align-items: center;min-height: 200px;}

/* =========================
   MODAL
========================= */
.modal-img {display: none;position: fixed;z-index: 9999;inset: 0;background: rgba(0,0,0,0.9);justify-content: center;align-items: center;}
.modal-img.fade-in {animation: fadeIn 0.3s forwards;}
.modal-img.fade-out {animation: fadeOut 0.3s forwards;}
.modal-content {max-width: 95%;max-height: 90vh;object-fit: contain;}
/* Close */
.close {position: fixed;top: 25px;right: 35px;font-size: 40px;color: #fff;cursor: pointer;z-index: 10000;}
/* Arrows */
.prev,
.next { position: fixed;top: 50%;transform: translateY(-50%);font-size: 42px;color: #fff;cursor: pointer;padding: 16px;user-select: none;z-index: 10000;text-decoration: none;}
.prev { left: 25px; }
.next { right: 25px; }

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

@media (max-width: 992px) {
    .sectionGallery .gallery-grid {grid-template-columns: repeat(2, 1fr);}
}
@media (max-width: 480px) {
    .sectionGallery .gallery-grid {grid-template-columns: 1fr;}
}

/* =========================
   ANIMATIONS
========================= */

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fadeOut {
    from { opacity: 1; }
    to { opacity: 0; }
}