/* VERSÃO CORRIGIDA E OTIMIZADA - SCROLL REMOVIDO E PAGINAÇÃO NOVA */

/* --- ANIMAÇÕES E RESET BÁSICO --- */
@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Poppins', sans-serif;
    background-color: #011126;
    color: #ffffff;
    /* CORREÇÃO DO SCROLL HORIZONTAL */
    overflow-x: hidden;
    width: 100%;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* --- HEADER (CABEÇALHO) --- */
.header-wrapper {
    background-color: transparent;
    position: absolute;
    width: 100%;
    z-index: 10;
}

header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0;
}

header .logo {
    margin-top: 12px;
}

header .logo img {
    height: 150px;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.5));
}

header nav ul {
    list-style: none;
    display: flex;
    gap: 35px;
}

header nav ul li a {
    text-decoration: none;
    color: #ffffff;
    font-weight: 600;
    font-size: 0.9rem;
    transition: color 0.3s ease;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

header nav ul li a:hover {
    color: #C4A35A;
}

.header-contact-button {
    background-color: transparent;
    border: 1px solid #ffffff;
    color: #ffffff;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 500;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

.header-contact-button:hover {
    background-image: linear-gradient(45deg, #d4ae5f, #b89543);
    color: #011126;
    border-color: transparent;
}

/* --- MENU HAMBURGER (VISÍVEL APENAS NO MOBILE) --- */
.hamburger-menu {
    display: none;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 10px;
    z-index: 1001;
    position: relative;
}

.hamburger-menu .line {
    display: block;
    width: 25px;
    height: 3px;
    background-color: #ffffff;
    margin: 5px 0;
    transition: all 0.3s ease-in-out;
}

.hamburger-menu.is-active .line:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
}

.hamburger-menu.is-active .line:nth-child(2) {
    opacity: 0;
}

.hamburger-menu.is-active .line:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
}

/* --- MENU MOBILE (NAV LATERAL) --- */
nav#mobile-nav {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    width: 80%;
    max-width: 320px;
    height: 100vh;
    background-color: #0A2B52;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transform: translateX(100%);
    transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    z-index: 1000;
    border-left: 1px solid #103562;
}

nav#mobile-nav.is-active {
    transform: translateX(0);
}

nav#mobile-nav ul {
    list-style: none;
    padding: 0;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

nav#mobile-nav ul li a {
    font-size: 1.2rem;
    text-decoration: none;
    color: #ffffff;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

/* --- HERO SECTION --- */
.hero-section {
    background-image: linear-gradient(rgba(1, 17, 38, 0.815), rgba(1, 17, 38, 0.822)), url('../img/FUNDO_INICIO.png');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding-top: 200px;
    position: relative;
    z-index: 1;
}

.hero-section .container {
    position: relative;
    z-index: 2;
}

.hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 40px 0 80px 0;
    min-height: 70vh;
}

.hero-text {
    max-width: 50%;
    z-index: 2;
}

.hero-text h1 {
    font-size: 3rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 20px;
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
}

.hero-text p {
    font-size: 1.1rem;
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 30px;
    max-width: 90%;
}

.cta-button {
    color: #011126;
    text-decoration: none;
    padding: 15px 30px;
    border-radius: 5px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    border: none;
    background-image: linear-gradient(45deg, #d4ae5f, #C4A35A);
    box-shadow: 0 4px 15px rgba(196, 163, 90, 0.3);
    transition: transform 0.3s ease;
}

.cta-button img {
    filter: brightness(0);
}

.cta-button:hover {
    transform: scale(1.05);
}

.hero-images-container {
    width: 45%;
    height: 400px;
    position: relative;
}

.hero-image-A,
.hero-image-B {
    border-radius: 50%;
    box-shadow: 0 10px 30px rgba(0,0,0,0.4);
    position: absolute;
}

.hero-image-A img,
.hero-image-B img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    display: block;
}

.hero-image-A {
    width: 350px;
    height: 350px;
    top: 0;
    right: 50px;
    z-index: 1;
}

.hero-image-B {
    width: 250px;
    height: 250px;
    bottom: 0;
    right: 0;
    border: 4px solid #011126;
    z-index: 2;
}

.hero-image-A::before, .hero-image-A::after,
.hero-image-B::before, .hero-image-B::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    border: 2px solid;
    box-sizing: border-box;
}

.hero-image-A::before {
    width: calc(100% + 40px);
    height: calc(100% + 40px);
    border-color: rgba(46, 224, 255, 0.6);
    animation: pulse 4s infinite ease-out;
}
.hero-image-A::after {
    width: calc(100% + 80px);
    height: calc(100% + 80px);
    border-color: rgba(4, 217, 255, 0.4);
    animation: pulse 4s infinite ease-out 2s;
}

.hero-image-B::before {
    width: calc(100% + 30px);
    height: calc(100% + 30px);
    border-color: rgba(0, 191, 255, 0.7);
    animation: pulse 5s infinite ease-out 1s;
}
.hero-image-B::after {
    width: calc(100% + 60px);
    height: calc(100% + 60px);
    border-color: rgba(0, 111, 133, 0.5);
    animation: pulse 5s infinite ease-out 3.5s;
}

@keyframes pulse {
    0% { transform: translate(-50%, -50%) scale(0.95); opacity: 0.7; }
    70% { transform: translate(-50%, -50%) scale(1.05); opacity: 0; }
    100% { transform: translate(-50%, -50%) scale(0.95); opacity: 0; }
}

.logos-section{background-color:#1c3e67;padding:10px 0;overflow:hidden;width:100%;border-top:1px solid #103562;position:relative;z-index:2}.logos-carousel{display:flex;width:fit-content;animation:scroll 30s linear infinite}.logos-slide{display:flex;align-items:center;gap:80px;padding:0 40px}.logos-slide img{height:130px;filter:none;opacity:1;transition:transform .3s ease}.logos-slide img:hover{transform:scale(1.1)}@keyframes scroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}.services-section{padding:80px 0;background-color:#011126}.section-header{text-align:left;margin-bottom:50px}.section-header h2{font-size:2.5rem;font-weight:600;line-height:1.2;color:#fff}

.services-viewport{
    overflow: hidden;
    perspective: 1500px;
    cursor: grab;
}

.services-slider{display:flex;gap:30px;transition:transform .6s cubic-bezier(.25,.8,.25,1)}.service-card{min-height:350px;flex:0 0 calc(25% - 22.5px);background-color:transparent;cursor:pointer}.card-inner{position:relative;width:100%;height:100%;transition:transform .6s;transform-style:preserve-3d}.service-card:hover .card-inner{transform:rotateY(180deg)}.card-front,.card-back{position:absolute;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:15px;overflow:hidden;display:flex;align-items:center;justify-content:center}.card-front{border:1px solid #103562;box-shadow:0 0 10px rgba(6,5,109,.5)}.card-front img{width:80px;height:80px;opacity:.8;filter:brightness(0) invert(1)}.service-card:nth-child(odd) .card-front{background-image:linear-gradient(45deg,#e8a857,#a18849)}.service-card:nth-child(even) .card-front{background-image:linear-gradient(90deg,#0052d4,#011126)}.card-back{background-color:#0a2b52;color:#fff;padding:30px;flex-direction:column;align-items:flex-start;justify-content:center;transform:rotateY(180deg);border:1px solid #103562;box-shadow:0 0 10px rgba(6,5,109,.5)}.card-subtitle{font-size:.9rem;color:#c4a35a;font-weight:500}.card-back h3{font-size:1.6rem;font-weight:600;margin:5px 0 15px;color:#fff}.card-back p{font-size:1rem;color:rgba(255,255,255,.9);line-height:1.6}

/* --- NOVA PAGINAÇÃO DOS SERVIÇOS (Moderno & Acessível) --- */
.pagination {
    margin-top: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
}

.pagination-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.3); /* Cor inativa */
    border: none;
    padding: 0;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.pagination-dot:hover {
    background-color: rgba(255, 255, 255, 0.8);
    transform: scale(1.2);
}

/* Estado Ativo: Vira uma "pílula" para indicar posição */
.pagination-dot.active {
    width: 35px;
    border-radius: 20px;
    background-color: #C4A35A; /* Dourado da marca */
    opacity: 1;
}

/* Acessibilidade: Foco visível */
.pagination-dot:focus-visible {
    outline: 2px solid #C4A35A;
    outline-offset: 4px;
}

.tech-stack-section{padding:80px 0;background-color:#011126}.section-title{font-size:2.8rem;font-weight:600;margin-bottom:60px;padding-left:20px;color:#fff}.tech-stack-content{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.tech-accordion{padding:0 20px}.accordion-item{border-bottom:1px solid #103562}.accordion-item:first-child{border-top:1px solid #103562}.accordion-header{display:flex;justify-content:space-between;align-items:center;padding:25px 0;cursor:pointer}.accordion-header h3{font-size:1.5rem;font-weight:500;color:#fff;opacity:.7;transition:opacity .3s ease,color .3s ease}.accordion-item.active .accordion-header h3{opacity:1;color:#c4a35a}.accordion-chevron{width:24px;height:24px;transition:transform .4s cubic-bezier(.25,.8,.25,1);filter:invert(1);opacity:.7}.accordion-item.active .accordion-chevron{transform:rotate(180deg);filter:invert(0) sepia(100%) saturate(500%) hue-rotate(-20deg) brightness(1.2)}.accordion-content{max-height:0;overflow:hidden;transition:max-height .4s cubic-bezier(.25,.8,.25,1),padding .4s ease}.accordion-item.active .accordion-content{max-height:350px;padding-bottom:30px}.accordion-content p{font-size:1rem;line-height:1.6;color:rgba(255,255,255,.8);max-width:90%}.accordion-button{display:inline-block;margin-top:20px;background-image:linear-gradient(45deg,#d4ae5f,#b89543);color:#011126;padding:10px 25px;border-radius:50px;text-decoration:none;font-weight:600;font-size:.9rem;transition:filter .3s ease,transform .3s ease;border:none;margin-left:10px}.accordion-button:hover{filter:brightness(1.1);transform:scale(1.05);transform-origin:bottom}.tech-image-display{text-align:center}.tech-image{max-width:80%;border-radius:15px;display:none;opacity:0;transition:opacity .5s ease-in-out}.tech-image.active{display:block;opacity:1}.numbers-section{padding:60px 0;background-color:#0a2b52}.section-header-alt{display:flex;align-items:center;gap:15px;margin-bottom:40px}.section-header-alt .line{width:40px;height:3px;background-image:linear-gradient(45deg,#d4ae5f,#b89543)}.section-header-alt h2{font-size:1.2rem;font-weight:500;text-transform:lowercase;color:#c4a35a}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:30px;text-align:left}.stat-item .stat-number{font-size:3rem;font-weight:600;color:#fff;display:block}.stat-item .stat-description{font-size:1.1rem;color:rgba(255,255,255,.8)}.timeline-section{padding:80px 0;background-color:#011126}.timeline-section .section-title{text-align:center;color:#fff}.timeline-grid{margin-top:60px;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:25px}.timeline-card{position:relative;min-height:300px;background-color:#0a2b52;border-radius:12px;border:1px solid #103562;overflow:hidden;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color .4s ease,transform .4s ease}.timeline-card:hover{border-color:#c4a35a;transform:translateY(-5px)}.timeline-year{font-size:2.8rem;font-weight:700;color:#103562;transition:color .4s ease}.timeline-card:hover .timeline-year{color:#c4a35a}.timeline-overlay{position:absolute;bottom:0;left:0;width:100%;height:0;background-image:linear-gradient(to top,#b89543,#d4ae5f);color:#011126;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px;transition:height .4s cubic-bezier(.25,.8,.25,1)}.timeline-card:hover .timeline-overlay{height:85%}.timeline-overlay p,.timeline-overlay .timeline-button{opacity:0;transform:translateY(10px);transition:opacity .3s ease .2s,transform .3s ease .2s}.timeline-card:hover .timeline-overlay p,.timeline-card:hover .timeline-overlay .timeline-button{opacity:1;transform:translateY(0)}.timeline-overlay p{font-size:.95rem;font-weight:400;line-height:1.6;margin-bottom:15px;color:#011126}.timeline-button{background-color:#011126;color:#fff;padding:10px 25px;border-radius:50px;text-decoration:none;font-weight:600;font-size:.9rem;transition:background-color .3s ease,transform .3s ease}.timeline-button:hover{background-color:#0a2b52;transform:scale(1.05)}.video-section{padding:80px 0;background-color:#0a2b52}.video-header{text-align:center;max-width:800px;margin:0 auto 50px}.video-header h2{font-size:2.5rem;font-weight:700;color:#fff;margin-bottom:20px}.video-header h2 span{color:#c4a35a}.video-header p{font-size:1.1rem;color:rgba(255,255,255,.8);line-height:1.6}.video-carousel-wrapper{position:relative}.video-carousel-viewport{overflow:hidden;padding:20px 0}.video-carousel-slider{display:flex;align-items:center;transition:transform .6s cubic-bezier(.25,.8,.25,1)}.video-embed-container.video-slide{position:relative;width:100%;flex:0 0 240px;margin:0 30px;padding-top:calc(240px * 1.777);border-radius:20px;overflow:hidden;opacity:.5;transform:scale(.8);transition:opacity .6s ease,transform .6s ease;cursor:pointer;z-index:1}.video-embed-container.video-slide.active{opacity:1;transform:scale(1.1);cursor:default;z-index:10}.video-embed-container iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}.form-section{padding:80px 20px;background-color:#011126}.contact-full-container{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:1100px;margin:0 auto;background:transparent}.contact-details{background:#0a2b52;border-radius:20px;padding:60px;color:#fff;display:flex;flex-direction:column;justify-content:center}.contact-details h3{font-size:1.5rem;font-weight:600;margin-bottom:30px}.contact-details ul{list-style:none;padding:0;margin-bottom:30px}.contact-details li{display:flex;align-items:center;gap:15px;margin-bottom:20px;color:rgba(255,255,255,.8)}.contact-details li img{width:24px;height:24px}.contact-socials h4{font-size:1rem;font-weight:600;margin-bottom:15px}.social-icons{display:flex;gap:15px}.social-icons a{display:flex;align-items:center;justify-content:center}.social-icons img{width:24px;height:24px;transition:transform .3s ease}.social-icons img:hover{transform:scale(1.2)}.contact-form{background-image:linear-gradient(45deg, #FFD98C, #dbb65e);border-radius:20px;padding:40px 70px;color:#011126;display:flex;flex-direction:column;justify-content:center}.contact-form h3{font-size:1.5rem;font-weight:600;margin-bottom:5px}.contact-form .input-group{margin-bottom:10px}.contact-form label{display:block;margin-bottom:5px;font-weight:500}.contact-form input,.contact-form textarea{width:100%;background:rgba(1,17,38,.2);border:1px solid rgba(1,17,38,.2);border-radius:12px;padding:12px 20px;color:#011126;font-family:'Poppins',sans-serif;font-size:1rem;transition:background-color .3s ease,border-color .3s ease}.contact-form input::placeholder,.contact-form textarea::placeholder{color:rgba(1,17,38,.7)}.contact-form input:focus,.contact-form textarea:focus{outline:none;border:1px solid #011126;background-color:rgba(255,255,255,.3)}.contact-form textarea{min-height:120px;resize:vertical}.submit-btn-contact{background-color:#011126;color:#fff;border:none;border-radius:50px;padding:15px 40px;font-weight:600;font-size:1rem;cursor:pointer;transition:background-color .3s ease}.submit-btn-contact:hover{background-color:#0a2b52}.site-footer{background-color:#011126;padding:20px 0;color:#fff}.footer-copyright{text-align:center;font-size:.9rem;color:rgba(255,255,255,.7)}

/* --- Media Queries (Responsividade) --- */

@media (max-width: 1200px) {
    .timeline-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 992px) {
    header nav, .header-contact-button {
        display: none;
    }
    .hamburger-menu {
        display: block;
    }
    nav#mobile-nav {
        display: flex;
    }

    .hero-section { padding-top: 150px; }
    .hero { flex-direction: column; text-align: center; }
    .hero-text { max-width: 100%; order: 2; }
    .hero-images-container { width: 100%; margin-bottom: 40px; order: 1; height: auto; }
    .hero-text h1 { font-size: 2.5rem; }
    
    .section-header h2 { font-size: 2rem; }
    .service-card { flex: 0 0 calc(50% - 15px); }
    
    .tech-stack-content { grid-template-columns: 1fr; }
    .tech-image-display { order: -1; margin-bottom: 40px; }
    .section-title { font-size: 2.2rem; text-align: center; padding-left: 0; }
    
    .contact-full-container { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    .stats-grid { grid-template-columns: repeat(2, 1fr); text-align: center; }
    .section-header-alt { justify-content: center; }
    .timeline-grid { grid-template-columns: repeat(2, 1fr); }
    .contact-details, .contact-form { padding: 40px; }
}

@media (max-width: 576px) {
    header .logo img {
        height: 100px;
    }
    .hero-text h1 { font-size: 2rem; }

    /* --- HERO SECTION MOBILE OTIMIZADO --- */
    .hero-images-container {
        max-width: 350px;
        margin: 0 auto 40px auto;
    }
    .hero-image-A {
        width: 80%;
        height: auto;
        padding-top: 80%; 
        position: relative;
        top: auto; right: auto;
        margin: 0 auto;
    }
    .hero-image-B {
        width: 40%;
        height: auto;
        padding-top: 40%;
        position: absolute;
        bottom: 0;
        right: 10%;
        border-width: 2px;
    }
    .hero-image-A img, .hero-image-B img {
        position: absolute;
        top: 0; left: 0;
        width: 100%; height: 100%;
    }

    .service-card { flex: 0 0 100%; }
    .stats-grid { grid-template-columns: 1fr; }
    .timeline-grid { grid-template-columns: 1fr; }
}

/* ... [CÓDIGO ANTERIOR MANTIDO] ... */

/* --- ESTILOS PARA O NOVO CARROSSEL PDI --- */

.pdi-section {
    padding: 80px 0;
    background-color: #011126;
    position: relative;
}

.pdi-carousel-wrapper {
    position: relative;
    padding: 0 50px; /* Espaço para os botões laterais */
    max-width: 1200px;
    margin: 40px auto 0 auto;
}

.pdi-viewport {
    overflow: hidden; /* Esconde os itens fora da área visível */
    width: 100%;
}

.pdi-slider {
    display: flex; /* Alinha os itens lado a lado */
    gap: 20px;
    transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1); /* Animação suave */
    width: 100%;
}

.pdi-item {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    cursor: pointer;
    border: 1px solid #103562;
    /* 3 itens por vez no Desktop */
    min-width: calc((100% - 40px) / 3); 
    height: 300px; /* Altura fixa para uniformidade */
    flex-shrink: 0;
}

.pdi-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

/* Overlay (Hover) */
.gallery-item-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-end;
    background: linear-gradient(to top, rgba(1, 17, 38, 0.9), transparent);
    padding: 20px;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.pdi-item:hover .gallery-item-overlay {
    opacity: 1;
}

.pdi-item:hover img {
    transform: scale(1.1);
}

.overlay-content h3 {
    font-size: 1.1rem;
    font-weight: 600;
    color: #fff;
    margin-bottom: 5px;
}

.overlay-content p {
    font-size: 0.9rem;
    color: #C4A35A;
}

/* Botões do Carrossel PDI (Estilo igual ao portfólio) */
.pdi-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 45px; 
    height: 45px;
    background: rgba(10, 43, 82, 0.6);
    border: 1px solid rgba(196, 163, 90, 0.4);
    color: #C4A35A;
    border-radius: 50%;
    font-size: 1.2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    z-index: 10;
    backdrop-filter: blur(4px);
    transition: all 0.3s ease;
}

.pdi-btn:hover {
    background: #C4A35A;
    color: #011126;
    transform: translateY(-50%) scale(1.1);
    box-shadow: 0 0 15px rgba(196, 163, 90, 0.5);
}

.prev-btn { left: 0; }
.next-btn { right: 0; }

/* RESPONSIVIDADE DO PDI */
@media (max-width: 992px) {
    /* Tablet: 2 itens */
    .pdi-item {
        min-width: calc((100% - 20px) / 2);
    }
}

@media (max-width: 576px) {
    /* Mobile: 1 item */
    .pdi-item {
        min-width: 100%;
    }
    .pdi-carousel-wrapper {
        padding: 0 30px;
    }
}

/* --- ESTILOS DO LIGHTBOX (MANTIDOS) --- */
.pdi-lightbox {
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.pdi-lightbox.show {
    opacity: 1;
    visibility: visible;
}

.lightbox-container {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lightbox-content-wrapper {
    animation: lightboxFadeIn 0.5s ease;
}

.lightbox-content img {
    max-width: 90vw;
    max-height: 80vh;
    border-radius: 5px;
    box-shadow: 0 0 20px rgba(0,0,0,0.5);
}

.lightbox-close {
    position: absolute;
    top: 20px;
    right: 30px;
    color: #fff;
    font-size: 40px;
    cursor: pointer;
    z-index: 10001;
}

.lightbox-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    color: #fff;
    font-size: 40px;
    cursor: pointer;
    padding: 20px;
    z-index: 10000;
}
.lightbox-prev { left: 10px; }
.lightbox-next { right: 10px; }

@keyframes lightboxFadeIn {
    from { opacity: 0; transform: scale(0.9); }
    to { opacity: 1; transform: scale(1); }
}