:root{
    --bg: <?= evento_h($corBg) ?>;
    --card: <?= evento_h($corCard) ?>;
    --text: #182230;
    --muted: #667085;
    --line: #e3e8ef;
    --primary: <?= evento_h($corPrimaria) ?>;
    --primary-2: <?= evento_h($corSecundaria) ?>;
    --accent: <?= evento_h($corAccent) ?>;
    --shadow: 0 20px 60px rgba(16, 28, 52, .09);
    --radius: 26px;
    --radius-lg: 34px;
    --max: 1280px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    color:var(--text);
    background:
        radial-gradient(circle at top right, rgba(215,171,79,.08), transparent 24%),
        linear-gradient(180deg, #fcfdff 0%, var(--bg) 100%);
}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
.container{width:min(var(--max), calc(100% - 32px));margin:0 auto}

/* topo */
.site-header{
    position:sticky;
    top:0;
    z-index:60;
    overflow:visible;
    background:
        linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0)),
        #532565;
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    border-bottom:1px solid rgba(255,255,255,.10);
    box-shadow:0 8px 24px rgba(0,0,0,.25);
}

.header-tech-lines{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    pointer-events:none;
    z-index:1;
    opacity:.85;
}

.header-tech-lines::before{
    content:"";
    position:absolute;
    inset:0;
    background:
        repeating-linear-gradient(
            135deg,
            rgba(255,255,255,.05) 0px,
            rgba(255,255,255,.05) 1px,
            transparent 1px,
            transparent 120px
        );
    opacity:.8;
}

.header-tech-lines::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:1px;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.45), transparent);
    opacity:.9;
}
.header-wrap{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:14px 0;
}

.brand{
    display:flex;
    align-items:center;
    gap:14px;
    min-width:0;
    position:relative;
    z-index:3;
}

.brand-logo{
    width:80px;
    height:80px;
    padding:6px;
    object-fit:contain;
    flex:0 0 60px;
}

.brand-kicker{
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.2em;
    color:#ffb3ff;
    font-weight:800;
    margin-bottom:4px;
}

.brand-title{
    font-size:18px;
    font-weight:900;
    line-height:1.12;
    letter-spacing:-.02em;
    color:#fff;
}


/* menu */
.nav{
    display:flex;
    align-items:center;
    gap:14px;
    position:relative;
}

.nav-toggle{
    display:none;
    width:48px;
    height:48px;
    border:0;
    border-radius:14px;
    background:rgba(255,255,255,.12);
    box-shadow:none;
    cursor:pointer;
    font-size:20px;
    color:#fff;
}

.nav-links{
    display:flex;
    align-items:center;
    gap:6px;
    list-style:none;
    margin:0;
    padding:0;
}

.nav-links > li{
    position:relative;
    list-style:none;
}


.nav-links > li > a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:0 14px;
    border-radius:999px;
    color:rgba(255,255,255,.85);
    font-weight:800;
    font-size:14px;
    transition:.2s ease;
    white-space:nowrap;
}

.nav-links > li > a:hover{
    background:rgba(255,255,255,.12);
    color:#fff;
}


.has-submenu > a{
    cursor:pointer;
}

.has-submenu > a::after{
    content:"▾";
    font-size:11px;
    margin-left:8px;
    opacity:.75;
    transition:transform .2s ease;
}

.has-submenu.open > a::after{
    transform:rotate(180deg);
}

.submenu{
    position:absolute;
    top:100%;
    left:0;
    min-width:220px;
    list-style:none;
    margin:0;
    padding:12px 10px 10px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:20px;
    box-shadow:0 20px 50px rgba(17,34,68,.12);
    display:none;
    z-index:70;
}

.submenu li{
    margin:0;
    padding:0;
}

.submenu li a{
    display:block;
    padding:12px 14px;
    border-radius:14px;
    color:var(--muted);
    font-weight:700;
    transition:.2s ease;
}

.submenu li a:hover{
    background:#f6f8fb;
    color:var(--primary);
}

.nav-ticket-desktop{
    margin-left:8px;
}

.nav-cta-mobile{
    display:none;
}

/* botão */
.btn-ticket,
.btn-outline,
.btn-soft{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    padding:14px 22px;
    font-weight:800;
    transition:.2s ease;
}

.btn-ticket{
    background:linear-gradient(135deg, #ff6b00, #ff8c1a);
    color:#fff;
    box-shadow:0 14px 30px rgba(255,107,0,.35);
    font-weight:900;
}
.btn-ticket:hover{
    transform:translateY(-2px);
    box-shadow:0 18px 40px rgba(255,107,0,.45);
}
.btn-ticket.is-disabled{
    opacity:.72;
    pointer-events:none;
}

.btn-outline{
    background:#fff;
    color:var(--primary);
    border:1px solid var(--line);
}

.btn-soft{
    background:rgba(255,255,255,.14);
    color:#fff;
    border:1px solid rgba(255,255,255,.22);
}


/* slideshow topo abaixo do menu */
.top-slideshow{
    position:relative;
    width:100%;
    height:min(72vh, 760px);
    min-height:360px;
    overflow:hidden;
    background:#12081a;
    border-top:1px solid rgba(255,255,255,.08);
}

.top-slideshow-track{
    position:relative;
    width:100%;
    height:100%;
}

.top-slide{
    position:absolute;
    inset:0;
    display:block;
    opacity:0;
    visibility:hidden;
    transition:opacity .9s ease, visibility .9s ease;
    pointer-events:none;
}

.top-slide.is-active{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    z-index:2;
}

.top-slide img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center top;
    transform:scale(1.02);
}

.top-slide-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(180deg, rgba(16,10,22,.18) 0%, rgba(16,10,22,.30) 35%, rgba(16,10,22,.52) 100%);
}

.top-slideshow-dots{
    position:absolute;
    left:50%;
    bottom:22px;
    transform:translateX(-50%);
    z-index:5;
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px 14px;
    border-radius:999px;
    background:rgba(0,0,0,.18);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
}

.top-slideshow-dot{
    width:12px;
    height:12px;
    border:0;
    border-radius:999px;
    padding:0;
    cursor:pointer;
    background:rgba(255,255,255,.42);
    transition:transform .2s ease, background .2s ease, opacity .2s ease;
}

.top-slideshow-dot:hover{
    transform:scale(1.12);
    background:rgba(255,255,255,.72);
}

.top-slideshow-dot.is-active{
    background:#fff;
    opacity:1;
}






/* hero */
.hero{
    padding:36px 0 28px;
}

.hero-grid{
    display:grid;
    grid-template-columns:1.18fr .82fr;
    gap:26px;
    align-items:stretch;
}

.hero-main,
.hero-aside{
    position:relative;
    overflow:hidden;
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow);
}

.hero-main{
    background:
        radial-gradient(circle at top right, rgba(215,171,79,.15), transparent 30%),
        linear-gradient(145deg, #ffffff 0%, #f7f9fc 100%);
    border:1px solid var(--line);
    padding:36px;
}

.hero-topline{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:18px;
}

.hero-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:10px 14px;
    border-radius:999px;
    background:#fff;
    border:1px solid var(--line);
    font-size:12px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:var(--primary);
}

.hero h1{
    margin:0 0 16px;
    font-size:clamp(32px, 4vw, 60px);
    line-height:1.02;
    letter-spacing:-.04em;
}

.hero p{
    margin:0;
    color:var(--muted);
    font-size:17px;
    line-height:1.85;
    max-width:800px;
}

.hero-meta{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:14px;
    margin:26px 0 28px;
}

.hero-meta-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:22px;
    padding:18px;
}

.hero-meta-label{
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.16em;
    color:var(--accent);
    font-weight:800;
    margin-bottom:8px;
}

.hero-meta-value{
    font-size:16px;
    font-weight:800;
    color:var(--primary);
    line-height:1.35;
}

.hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.hero-aside{
    background:linear-gradient(145deg, var(--primary) 0%, var(--primary-2) 100%);
    min-height:100%;
    padding:26px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
}

.hero-cover{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:.22;
    mix-blend-mode:screen;
}

.hero-overlay{
    position:relative;
    z-index:2;

    display:flex;
    flex-direction:column;
    height:100%;
}

.hero-logo-wrap{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:240px;
    padding:12px;
}

.hero-logo-wrap img{
    max-width:100%;
    max-height:220px;
    object-fit:contain;
    filter:drop-shadow(0 18px 40px rgba(0,0,0,.2));
}

.hero-side-box{
    background:rgba(255,255,255,.09);
    border:1px solid rgba(255,255,255,.16);
    border-radius:24px;
    padding:18px;
    color:#fff;
}

.hero-side-label{
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.16em;
    opacity:.75;
    margin-bottom:8px;
    font-weight:800;
}

.hero-side-value{
    font-size:18px;
    font-weight:800;
    line-height:1.45;
}

/* seções */
.section{
    padding:30px 0;
}

.section-head{
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:18px;
}

.section-head h2{
    margin:0;
    font-size:clamp(24px, 3vw, 40px);
    letter-spacing:-.03em;
}

.section-head p{
    margin:6px 0 0;
    color:var(--muted);
}

.grid-2{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
}

.card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:26px;
    box-shadow:var(--shadow);
}

.about-text{
    color:var(--muted);
    line-height:1.9;
    font-size:16px;
}

.info-list{
    display:grid;
    gap:14px;
}

.info-item{
    padding:14px 0;
    border-bottom:1px solid var(--line);
}

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

.info-label{
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.16em;
    color:var(--accent);
    font-weight:900;
    margin-bottom:6px;
}

.info-value{
    font-size:16px;
    font-weight:800;
    color:var(--primary);
    line-height:1.5;
}

.cta-panel{
    display:grid;
    grid-template-columns:1.2fr .8fr;
    gap:24px;
    background:linear-gradient(145deg, var(--primary) 0%, var(--primary-2) 100%);
    color:#fff;
    border-radius:32px;
    padding:30px;
    box-shadow:var(--shadow);
    overflow:hidden;
    position:relative;
}

.cta-panel::before{
    content:"";
    position:absolute;
    top:-40px;
    right:-40px;
    width:220px;
    height:220px;
    border-radius:50%;
    background:rgba(255,255,255,.08);
}

.cta-panel h3{
    margin:0 0 10px;
    font-size:clamp(24px, 2.5vw, 36px);
    letter-spacing:-.03em;
}

.cta-panel p{
    margin:0;
    color:rgba(255,255,255,.78);
    line-height:1.8;
}

.cta-side{
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    z-index:2;
}

.cta-actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:22px;
}

.notice-post{
    padding:20px 22px;
    border-radius:22px;
    background:linear-gradient(135deg, rgba(21,43,77,.06), rgba(215,171,79,.10));
    border:1px solid rgba(215,171,79,.24);
    color:var(--primary);
    font-weight:700;
    line-height:1.75;
}

/* galeria e vídeos */
.gallery{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:18px;
}

.gallery-card{
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    border:1px solid var(--line);
    box-shadow:var(--shadow);
}

.gallery-card img{
    width:100%;
    height:260px;
    object-fit:cover;
}

.video-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:20px;
}

.video-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:24px;
    overflow:hidden;
    box-shadow:var(--shadow);
}

.video-thumb{
    aspect-ratio:16 / 9;
    background:#edf2f7;
}

.video-thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.video-body{
    padding:20px;
}

.video-title{
    font-size:18px;
    font-weight:900;
    margin:0 0 8px;
    color:var(--primary);
}

.video-provider{
    color:var(--muted);
    font-size:14px;
    margin-bottom:14px;
}

.map-wrap iframe{
    width:100%;
    min-height:380px;
    border:0;
    border-radius:22px;
}

/* rodapé */

.site-footer{
    position:relative;
    overflow:hidden;
    margin-top:64px;
    padding:78px 0 34px;
    border-top:none;
    background:
        radial-gradient(circle at 15% 18%, rgba(255,255,255,.14), transparent 20%),
        radial-gradient(circle at 85% 22%, rgba(255,220,170,.16), transparent 22%),
        radial-gradient(circle at 50% 100%, rgba(0,0,0,.18), transparent 48%),
        linear-gradient(135deg, #ff5a00 0%, #ff7a00 34%, #ff8f1f 65%, #ff6b00 100%);
    color:#fff;
    text-align:center;
}

.footer-top-light{
    position:absolute;
    top:0;
    left:50%;
    transform:translateX(-50%);
    width:min(920px, 90%);
    height:1px;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.92), transparent);
    opacity:.9;
}

.footer-noise{
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:.035;
    background-image:
        radial-gradient(rgba(255,255,255,.95) 0.6px, transparent 0.6px);
    background-size:10px 10px;
    mix-blend-mode:soft-light;
}

.footer-glow{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
    filter:blur(18px);
    opacity:.24;
}

.footer-glow-1{
    top:-70px;
    left:-50px;
    width:260px;
    height:260px;
    background:rgba(255,255,255,.18);
}

.footer-glow-2{
    right:-60px;
    bottom:-90px;
    width:280px;
    height:280px;
    background:rgba(255,221,177,.22);
}

.footer-premium{
    position:relative;
    z-index:2;
    max-width:860px;
    margin:0 auto;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:18px;
}

.footer-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:10px 18px;
    border-radius:999px;
    background:rgba(255,255,255,.14);
    border:1px solid rgba(255,255,255,.24);
    color:#fff;
    font-size:11px;
    font-weight:900;
    letter-spacing:.22em;
    text-transform:uppercase;
    box-shadow:0 12px 28px rgba(0,0,0,.10);
    backdrop-filter:blur(10px);
}

.footer-logo-wrap{
    display:flex;
    align-items:center;
    justify-content:center;
    margin-top:4px;
    padding:10px 18px;
    backdrop-filter:blur(8px);
}

.footer-logo{
    max-width:200px;
    max-height:126px;
    object-fit:contain;
    filter:drop-shadow(0 16px 34px rgba(0,0,0,.22));
}

.footer-title{
    margin:0;
    font-size:clamp(30px, 3vw, 42px);
    line-height:1.02;
    font-weight:900;
    color:#fff;
    letter-spacing:-.04em;
    text-shadow:0 8px 22px rgba(0,0,0,.14);
}

.footer-copy{
    max-width:700px;
    margin:0;
    font-size:15px;
    line-height:1.9;
    color:rgba(255,255,255,.94);
}

.footer-mini-nav{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px 14px;
    margin-top:2px;
}

.footer-mini-nav a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:40px;
    padding:0 16px;
    border-radius:999px;
    color:#fff;
    font-size:13px;
    font-weight:800;
    letter-spacing:.02em;
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.14);
    transition:transform .22s ease, background .22s ease, border-color .22s ease;
}

.footer-mini-nav a:hover{
    transform:translateY(-2px);
    background:rgba(255,255,255,.18);
    border-color:rgba(255,255,255,.24);
}

.footer-social{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:16px;
    margin-top:6px;
}

.footer-social-link{
    width:54px;
    height:54px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.08));
    border:1px solid rgba(255,255,255,.22);
    color:#fff;
    backdrop-filter:blur(10px);
    box-shadow:0 14px 28px rgba(0,0,0,.14);
    transition:transform .22s ease, background .22s ease, box-shadow .22s ease;
}

.footer-social-link:hover{
    transform:translateY(-4px) scale(1.05);
    background:linear-gradient(180deg, rgba(255,255,255,.24), rgba(255,255,255,.12));
    box-shadow:0 18px 32px rgba(0,0,0,.18);
}

.footer-social-link svg{
    width:22px;
    height:22px;
    display:block;
}

.footer-divider{
    width:min(520px, 100%);
    height:1px;
    margin:10px auto 0;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.72), transparent);
}

.footer-bottom{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px;
    color:rgba(255,255,255,.90);
    font-size:13px;
    font-weight:700;
    letter-spacing:.02em;
}

.footer-dot{
    opacity:.72;
}


/* desktop submenu */
@media (min-width: 1181px){
    .has-submenu:hover > .submenu{
        display:block;
    }
}

/* responsivo geral */
@media (max-width: 1080px){
    .hero-grid,
    .cta-panel,
    .grid-2,
    .footer-grid,
    .video-grid{
        grid-template-columns:1fr;
    }

    .hero-meta{
        grid-template-columns:1fr;
    }

    .gallery{
        grid-template-columns:repeat(2, 1fr);
    }
}

/* menu mobile */
@media (max-width: 1180px){
    .nav-toggle{
        display:inline-flex;
        align-items:center;
        justify-content:center;
    }

    .nav-ticket-desktop{
        display:none;
    }

    .nav-cta-mobile .btn-ticket{
    background:linear-gradient(135deg, #ff6b00, #ff8c1a) !important;
    color:#fff !important;
    box-shadow:0 14px 30px rgba(255,107,0,.35);
}
   .nav-cta-mobile .btn-ticket:active{
    transform:scale(.98);
} 
    
.nav-links{
    display:none;
    position:absolute;
    top:62px;
    right:0;
    width:min(380px, calc(100vw - 24px));
    flex-direction:column;
    align-items:stretch;
    gap:8px;
    background:#532565;
    border:1px solid rgba(255,255,255,.15);
    border-radius:20px;
    box-shadow:0 20px 50px rgba(0,0,0,.4);
    padding:14px;
    max-height:calc(100vh - 100px);
    overflow:auto;
}

    .nav-links.show{
        display:flex;
    }

    .nav-links > li{
        width:100%;
    }

.nav-links > li > a{
    width:100%;
    justify-content:space-between;
    border-radius:16px;
    padding:14px 16px;
    background:rgba(255,255,255,.08);
    color:#fff;
}
.nav-links > li > a:hover{
    background:rgba(255,255,255,.15);
    color:#fff;
}
    .submenu{
        position:static;
        top:auto;
        left:auto;
        min-width:unset;
        margin-top:8px;
        padding:8px;
        border-radius:16px;
        box-shadow:none;
    background:#6a2c80;
        display:none;
    }

    .has-submenu:hover > .submenu{
        display:none;
    }

    .has-submenu.open > .submenu{
        display:block;
    }

    .nav-cta-mobile{
        display:block;
        margin-top:8px;
    }

    .nav-cta-mobile .btn-ticket{
        width:100%;
    }

       .top-slideshow{
        height:48vh;
        min-height:280px;
    }
}

@media (max-width: 640px){
    .container{
        width:min(var(--max), calc(100% - 20px));
    }

    .hero-main,
    .hero-aside,
    .card,
    .cta-panel{
        padding:22px;
    }

    .gallery{
        grid-template-columns:1fr;
    }

    .gallery-card img{
        height:220px;
    }

    .brand-title{
        font-size:16px;
    }

    .brand-logo{
        width:52px;
        height:52px;
        flex-basis:52px;
    }

    .top-slideshow{
        height:34vh;
        min-height:220px;
    }

    .top-slideshow-dots{
        bottom:14px;
        gap:8px;
        padding:8px 12px;
    }

    .top-slideshow-dot{
        width:10px;
        height:10px;
    }
}
@media (max-width: 640px){
    .site-footer{
        margin-top:50px;
        padding:56px 0 28px;
    }

    .footer-badge{
        padding:9px 14px;
        font-size:10px;
        letter-spacing:.15em;
    }

    .footer-logo-wrap{
    }

    .footer-logo{
        max-width:150px;
        max-height:94px;
    }

    .footer-title{
        font-size:25px;
    }

    .footer-copy{
        font-size:14px;
        line-height:1.78;
        max-width:100%;
    }

    .footer-mini-nav{
        gap:10px;
    }

    .footer-mini-nav a{
        min-height:38px;
        padding:0 14px;
        font-size:12px;
    }

    .footer-social{
        gap:12px;
    }

    .footer-social-link{
        width:46px;
        height:46px;
    }

    .footer-social-link svg{
        width:20px;
        height:20px;
    }

    .footer-bottom{
        font-size:12px;
        gap:8px;
    }
}

/* camada tech AAA */
.footer-tech-lines{
    position:absolute;
    inset:0;
    pointer-events:none;
    z-index:1;
    opacity:.95;
    overflow:hidden;

    background:
        repeating-linear-gradient(
            90deg,
            rgba(255,255,255,.18) 0px,
            rgba(255,255,255,.14) 1px,
            transparent 1px,
            transparent 64px
        ),
        repeating-linear-gradient(
            180deg,
            rgba(255,255,255,.14) 0px,
            rgba(255,255,255,.14) 1px,
            transparent 1px,
            transparent 64px
        );

    background-position:center;
    background-size:64px 64px, 64px 64px;

    -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.9), rgba(0,0,0,.72));
    mask-image: linear-gradient(to bottom, rgba(0,0,0,.9), rgba(0,0,0,.72));

    animation: footerGridMove 18s linear infinite;
}

.footer-tech-lines::before{
    content:"";
    position:absolute;
    inset:-20%;

    background:
        repeating-linear-gradient(
            135deg,
            rgba(255,255,255,.07) 0px,
            rgba(255,255,255,.07) 1px,
            transparent 1px,
            transparent 110px
        );

    opacity:.9;
    transform:rotate(0deg);
    animation: footerDiagMove 22s linear infinite;
}

.footer-tech-lines::after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(255,255,255,.00) 35%,
            rgba(255,255,255,.16) 50%,
            rgba(255,255,255,.00) 65%,
            transparent 100%
        );
    opacity:.55;
    transform:translateX(-100%);
    animation: footerScan 7s ease-in-out infinite;
}

@keyframes footerGridMove{
    0%{
        background-position:0 0, 0 0;
    }
    100%{
        background-position:64px 0, 0 64px;
    }
}

@keyframes footerDiagMove{
    0%{
        transform:translate3d(0,0,0);
    }
    100%{
        transform:translate3d(80px, 40px, 0);
    }
}

@keyframes footerScan{
    0%{
        transform:translateX(-120%);
        opacity:0;
    }
    18%{
        opacity:.18;
    }
    50%{
        opacity:.55;
    }
    82%{
        opacity:.18;
    }
    100%{
        transform:translateX(120%);
        opacity:0;
    }
}
.top-slide-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(180deg, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.35) 100%),
        linear-gradient(90deg, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.0) 60%);
}
/* slideshow topo V2 */
.top-slideshow{
    position:relative;
    width:100%;
    height:min(76vh, 820px);
    min-height:400px;
    overflow:hidden;
    background:#12081a;
    border-top:1px solid rgba(255,255,255,.08);
}

.top-slideshow-track{
    position:relative;
    width:100%;
    height:100%;
}

.top-slide{
    position:absolute;
    inset:0;
    display:block;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity 1.15s ease-in-out, visibility 1.15s ease-in-out;
    overflow:hidden;
}

.top-slide.is-active{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    z-index:2;
}

.top-slide-blur{
    position:absolute;
    inset:-20px;
    background-size:cover;
    background-position:center top;
    filter:blur(24px);
    transform:scale(1.08);
    opacity:.32;
}

.top-slide img{
    position:relative;
    z-index:1;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center top;
    transform:scale(1.02);
    transition:transform 6.2s ease;
    filter:saturate(1.02) contrast(1.02);
}

.top-slide.is-active img{
    transform:scale(1.08);
}

.top-slide-overlay{
    position:absolute;
    inset:0;
    z-index:2;
    background:
        linear-gradient(180deg, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.38) 100%),
        linear-gradient(90deg, rgba(0,0,0,0.34) 0%, rgba(0,0,0,0.0) 58%);
}

.top-slide-caption{
    position:absolute;
    left:28px;
    bottom:90px;
    z-index:4;
    display:flex;
    flex-direction:column;
    gap:8px;
    max-width:min(760px, calc(100% - 56px));
    color:#fff;
    opacity:0;
    transform:translateY(18px);
    transition:opacity .65s ease .18s, transform .65s ease .18s;
}

.top-slide.is-active .top-slide-caption{
    opacity:1;
    transform:translateY(0);
}

.top-slide-kicker{
    display:inline-flex;
    width:max-content;
    padding:8px 12px;
    border-radius:999px;
    background:rgba(255,255,255,.14);
    border:1px solid rgba(255,255,255,.18);
    font-size:11px;
    letter-spacing:.16em;
    text-transform:uppercase;
    font-weight:900;
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
}

.top-slide-caption strong{
    font-size:clamp(24px, 3.4vw, 54px);
    line-height:1.02;
    letter-spacing:-.04em;
    text-shadow:0 10px 24px rgba(0,0,0,.24);
}

.top-slideshow-ui{
    position:absolute;
    left:24px;
    right:24px;
    bottom:22px;
    z-index:6;
    display:flex;
    flex-direction:column;
    gap:14px;
}

.top-slideshow-progress{
    width:min(420px, calc(100% - 12px));
    height:4px;
    border-radius:999px;
    overflow:hidden;
    background:rgba(255,255,255,.16);
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}

.top-slideshow-progress-bar{
    display:block;
    width:0%;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg, #ff6b00, #ffb366);
}

.top-slideshow-progress-bar.is-animating{
    animation:topSlideshowProgress 5.5s linear forwards;
}

@keyframes topSlideshowProgress{
    from{ width:0%; }
    to{ width:100%; }
}

.top-slideshow-thumbs{
    display:flex;
    gap:10px;
    overflow:auto;
    scrollbar-width:none;
    -ms-overflow-style:none;
    padding-bottom:2px;
}

.top-slideshow-thumbs::-webkit-scrollbar{
    display:none;
}

.top-slideshow-thumb{
    position:relative;
    display:flex;
    align-items:center;
    gap:10px;
    min-width:220px;
    max-width:260px;
    padding:8px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:18px;
    background:rgba(10,10,16,.30);
    color:#fff;
    cursor:pointer;
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    transition:transform .22s ease, border-color .22s ease, background .22s ease, opacity .22s ease;
    opacity:.78;
}

.top-slideshow-thumb:hover{
    transform:translateY(-2px);
    opacity:1;
}

.top-slideshow-thumb.is-active{
    border-color:rgba(255,255,255,.36);
    background:rgba(255,255,255,.16);
    opacity:1;
}

.top-slideshow-thumb img{
    width:74px;
    height:54px;
    border-radius:12px;
    object-fit:cover;
    flex:0 0 74px;
}

.top-slideshow-thumb span{
    font-size:13px;
    font-weight:800;
    line-height:1.25;
    text-align:left;
}

.top-slideshow-dots{
    display:flex;
    align-items:center;
    gap:10px;
}

.top-slideshow-dot{
    width:12px;
    height:12px;
    border:0;
    border-radius:999px;
    padding:0;
    cursor:pointer;
    background:rgba(255,255,255,.42);
    transition:transform .2s ease, background .2s ease, opacity .2s ease;
}

.top-slideshow-dot:hover{
    transform:scale(1.12);
    background:rgba(255,255,255,.72);
}

.top-slideshow-dot.is-active{
    background:#fff;
    opacity:1;
}

@media (max-width: 1180px){
    .top-slideshow{
        height:54vh;
        min-height:300px;
    }

    .top-slide-caption{
        left:20px;
        bottom:82px;
        max-width:calc(100% - 40px);
    }

    .top-slideshow-ui{
        left:18px;
        right:18px;
        bottom:16px;
    }

    .top-slideshow-thumb{
        min-width:190px;
    }
}

@media (max-width: 640px){
    .top-slideshow{
        height:42vh;
        min-height:240px;
    }

    .top-slide-caption{
        left:14px;
        right:14px;
        bottom:70px;
        max-width:none;
        gap:6px;
    }

    .top-slide-kicker{
        padding:7px 10px;
        font-size:10px;
    }

    .top-slide-caption strong{
        font-size:24px;
    }

    .top-slideshow-ui{
        left:12px;
        right:12px;
        bottom:10px;
        gap:10px;
    }

    .top-slideshow-progress{
        width:100%;
        height:3px;
    }

    .top-slideshow-thumb{
        min-width:170px;
        max-width:190px;
        padding:6px;
        border-radius:14px;
    }

    .top-slideshow-thumb img{
        width:60px;
        height:44px;
        border-radius:10px;
        flex-basis:60px;
    }

    .top-slideshow-thumb span{
        font-size:12px;
    }

    .top-slideshow-dots{
        gap:8px;
    }

    .top-slideshow-dot{
        width:10px;
        height:10px;
    }
}
.top-slideshow-arrow{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    z-index:7;
    width:58px;
    height:58px;
    border:1px solid rgba(255,255,255,.18);
    border-radius:999px;
    background:rgba(10,10,16,.24);
    color:#fff;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    box-shadow:0 16px 40px rgba(0,0,0,.18);
    transition:transform .22s ease, background .22s ease, border-color .22s ease, opacity .22s ease;
}

.top-slideshow-arrow:hover{
    transform:translateY(-50%) scale(1.04);
    background:rgba(255,255,255,.16);
    border-color:rgba(255,255,255,.32);
}

.top-slideshow-arrow:active{
    transform:translateY(-50%) scale(.98);
}

.top-slideshow-arrow--prev{
    left:22px;
}

.top-slideshow-arrow--next{
    right:22px;
}

.top-slideshow-arrow svg{
    width:24px;
    height:24px;
    display:block;
}

@media (max-width: 900px){
    .top-slideshow-arrow{
        width:50px;
        height:50px;
    }

    .top-slideshow-arrow--prev{
        left:14px;
    }

    .top-slideshow-arrow--next{
        right:14px;
    }

    .top-slideshow-arrow svg{
        width:22px;
        height:22px;
    }
}

@media (max-width: 640px){
    .top-slideshow-arrow{
        width:44px;
        height:44px;
        top:auto;
        bottom:74px;
        transform:none;
        background:rgba(10,10,16,.34);
    }

    .top-slideshow-arrow:hover,
    .top-slideshow-arrow:active{
        transform:none;
    }

    .top-slideshow-arrow--prev{
        left:12px;
    }

    .top-slideshow-arrow--next{
        right:12px;
    }

    .top-slideshow-arrow svg{
        width:20px;
        height:20px;
    }
}