/*!
=========================================================
 ANDCOMEX - STYLE.CSS
 Versão: 2.0.2
 Base: Consolidação v1.0 + v1.1
 Alterações:
 - Removido arquivo paralelo 'style - Copy.css' do fluxo.
 - Arquivo preparado para consolidação incremental.
=========================================================
*/

*,*::before,*::after{box-sizing:border-box;}
/*=========================================================
    AND COMEX
    STYLE.CSS
    BLOCO 01
=========================================================*/

/*=========================
RESET
=========================*/

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

html{
    scroll-behavior:smooth;
}

body{

    font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif;

    color:#1E293B;

    background:#ffffff;

    line-height:1.6;

    overflow-x:hidden;

    -webkit-font-smoothing:antialiased;

}

img{

    max-width:100%;

    display:block;

}

a{

    text-decoration:none;

    color:inherit;

}

ul{

    list-style:none;

}

/*=========================
ROOT
=========================*/

:root{

    --primary:#0B3C5D;

    --secondary:#1F6FA9;

    --gold:#C89B3C;

    --dark:#0F172A;

    --text:#334155;

    --light:#F8FAFC;

    --white:#FFFFFF;

    --gray:#E5E7EB;

    --radius:12px;

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

    --transition:.35s;

}

/*=========================
CONTAINER
=========================*/

.container{

    width:min(1200px,90%);

    margin:auto;

}

/*=========================
SECTION
=========================*/

section{

    padding:90px 0;

}

/*=========================
SECTION TITLE
=========================*/

.section-title{

    margin-bottom:60px;

}

.section-title.center{

    text-align:center;

}

.section-title span{

    color:var(--gold);

    font-size:.85rem;

    letter-spacing:3px;

    font-weight:700;

}

.section-title h2{

    margin-top:15px;

    font-size:2.4rem;

    color:var(--primary);

    margin-bottom:20px;

}

.section-title p{

    max-width:760px;

    color:var(--text);

}

/*=========================
BUTTONS
=========================*/

.btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:16px 34px;

    background:var(--gold);

    color:#fff;

    font-weight:700;

    border-radius:50px;

    transition:.3s;

    box-shadow:var(--shadow);

}

.btn:hover{

    transform:translateY(-3px);

    background:#b98a26;

}

/*=========================
HEADER
=========================*/

header{

    position:fixed;

    width:100%;

    top:0;

    left:0;

    z-index:999;

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

    backdrop-filter:blur(12px);

    box-shadow:0 2px 10px rgba(0,0,0,.05);

}

header .container{

    display:flex;

    justify-content:space-between;

    align-items:center;

    height:80px;

}

/*=========================
LOGO
=========================*/

.logo{

    font-size:1.7rem;

    font-weight:800;

    color:var(--primary);

    letter-spacing:1px;

}

/*=========================
MENU
=========================*/

nav{

    display:flex;

    gap:35px;

}

nav a{

    font-weight:600;

    color:var(--text);

    transition:.3s;

    position:relative;

}

nav a:hover{

    color:var(--secondary);

}

nav a::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-8px;

    width:0;

    height:2px;

    background:var(--gold);

    transition:.3s;

}

nav a:hover::after{

    width:100%;

}

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

.hero{

    min-height:100vh;

    display:flex;

    align-items:center;

    background:linear-gradient(rgba(11,60,93,.80),rgba(11,60,93,.80)),
    url("../img/hero/world.jpg");

    background-size:cover;

    background-position:center;

    color:#fff;

    padding-top:80px;

}

.hero .container{

    max-width:760px;

}

.tag{

    display:inline-block;

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

    padding:8px 18px;

    border-radius:50px;

    letter-spacing:2px;

    margin-bottom:25px;

    font-size:.82rem;

}

.hero h1{

    font-size:3.6rem;

    line-height:1.15;

    margin-bottom:30px;

    font-weight:800;

}

.hero p{

    font-size:1.15rem;

    margin-bottom:40px;

    color:#e7edf5;

}

/*=========================
HIGHLIGHTS
=========================*/

.highlights{

    margin-top:-60px;

    position:relative;

    z-index:5;

}

.highlights .cards{

    display:grid;

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

    gap:30px;

}

.highlights .card{

    background:#fff;

    padding:35px;

    border-radius:var(--radius);

    box-shadow:var(--shadow);

    transition:var(--transition);

}

.highlights .card:hover{

    transform:translateY(-8px);

}

.highlights h3{

    color:var(--primary);

    margin-bottom:15px;

}

.highlights p{

    color:var(--text);

}

/*=========================================================
    AND COMEX
    STYLE.CSS
    BLOCO 02
=========================================================*/

/*=========================================================
QUEM SOMOS
=========================================================*/

#quem{

    padding-top:110px;
    padding-bottom:110px;

}

#quem h2{

    font-size:2.4rem;

    color:var(--primary);

    margin-bottom:30px;

    position:relative;

}

#quem h2::after{

    content:"";

    width:80px;

    height:4px;

    background:var(--gold);

    display:block;

    margin-top:18px;

    border-radius:20px;

}

#quem p{

    max-width:900px;

    font-size:1.1rem;

    color:var(--text);

    line-height:1.9;

}

/*=========================================================
SERVIÇOS
=========================================================*/

#servicos{

    display:grid;

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

    gap:35px;

    padding-top:30px;

    padding-bottom:100px;

}

#servicos .card{

    background:#fff;

    border-radius:18px;

    padding:45px 35px;

    box-shadow:var(--shadow);

    transition:.35s;

    border-top:5px solid transparent;

    position:relative;

    overflow:hidden;

}

#servicos .card:hover{

    transform:translateY(-10px);

    border-top:5px solid var(--gold);

}

#servicos .card::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:6px;

    background:linear-gradient(90deg,var(--gold),var(--secondary));

    transform:scaleX(0);

    transition:.35s;

    transform-origin:left;

}

#servicos .card:hover::before{

    transform:scaleX(1);

}

#servicos h3{

    font-size:1.45rem;

    color:var(--primary);

    margin-bottom:18px;

}

#servicos p{

    color:var(--text);

    line-height:1.8;

}

/*=========================================================
CARDS GENÉRICOS
=========================================================*/

.cards{

    display:grid;

    gap:30px;

}

.card{

    background:#fff;

    border-radius:16px;

    padding:35px;

    box-shadow:var(--shadow);

    transition:var(--transition);

}

.card:hover{

    transform:translateY(-8px);

}

.card h3{

    color:var(--primary);

    margin-bottom:15px;

}

.card p{

    color:var(--text);

}

/*=========================================================
DIFERENCIAIS
=========================================================*/

.diferenciais{

    background:var(--light);

}

.grid-diferenciais{

    display:grid;

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

    gap:35px;

}

.grid-diferenciais .item{

    background:#fff;

    border-radius:18px;

    padding:40px;

    transition:.35s;

    box-shadow:var(--shadow);

    position:relative;

    overflow:hidden;

}

.grid-diferenciais .item:hover{

    transform:translateY(-8px);

}

.grid-diferenciais .item::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:6px;

    height:100%;

    background:var(--gold);

    transform:scaleY(0);

    transition:.35s;

    transform-origin:top;

}

.grid-diferenciais .item:hover::before{

    transform:scaleY(1);

}

.grid-diferenciais .icon{

    width:70px;

    height:70px;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:2rem;

    border-radius:50%;

    background:rgba(31,111,169,.08);

    margin-bottom:25px;

}

.grid-diferenciais h3{

    color:var(--primary);

    margin-bottom:18px;

    font-size:1.35rem;

}

.grid-diferenciais p{

    color:var(--text);

    line-height:1.8;

}

/*=========================================================
UTILIDADES PARA CARDS
=========================================================*/

.card-center{

    text-align:center;

}

.shadow-hover{

    transition:.35s;

}

.shadow-hover:hover{

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

}

.round{

    border-radius:18px;

}

/*=========================================================
DIVISORES
=========================================================*/

.section-divider{

    width:120px;

    height:4px;

    background:var(--gold);

    margin:25px 0 40px;

    border-radius:30px;

}

.section-divider.center{

    margin:25px auto 40px;

}

/*=========================================================
BACKGROUND AUXILIAR
=========================================================*/

.bg-light{

    background:#F8FAFC;

}

.bg-white{

    background:#fff;

}

.bg-primary{

    background:var(--primary);

    color:#fff;

}

/*=========================================================
ESPAÇAMENTOS
=========================================================*/

.mt-30{

    margin-top:30px;

}

.mt-50{

    margin-top:50px;

}

.mt-80{

    margin-top:80px;

}

.mb-30{

    margin-bottom:30px;

}

.mb-60{

    margin-bottom:60px;

}

.pt-100{

    padding-top:100px;

}

.pb-100{

    padding-bottom:100px;

}

/*=========================================================
    AND COMEX
    STYLE.CSS
    BLOCO 03
=========================================================*/

/*=========================================================
NÚMEROS
=========================================================*/

.numbers{

    background:linear-gradient(135deg,#0B3C5D,#114F79);

    color:#fff;

}

.numbers .section-title h2,
.numbers .section-title p{

    color:#fff;

}

.numbers-grid{

    display:grid;

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

    gap:30px;

    margin-top:60px;

}

.number-box{

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

    backdrop-filter:blur(10px);

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

    border-radius:18px;

    padding:45px 25px;

    text-align:center;

    transition:.35s;

}

.number-box:hover{

    transform:translateY(-8px);

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

}

.number-box h3{

    font-size:3rem;

    color:var(--gold);

    margin-bottom:15px;

    font-weight:800;

}

.number-box p{

    color:#E8EEF5;

    font-size:1rem;

}

/*=========================================================
PROCESSO
=========================================================*/

.processo{

    background:#fff;

}

.timeline{

    display:grid;

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

    gap:25px;

    margin-top:50px;

    position:relative;

}

.timeline::before{

    content:"";

    position:absolute;

    top:42px;

    left:8%;

    width:84%;

    height:3px;

    background:#D9E3EC;

    z-index:0;

}

.step{

    position:relative;

    background:#fff;

    border-radius:18px;

    padding:35px 25px;

    box-shadow:var(--shadow);

    text-align:center;

    transition:.35s;

    z-index:2;

}

.step:hover{

    transform:translateY(-8px);

}

.step span{

    width:70px;

    height:70px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin:0 auto 25px;

    border-radius:50%;

    background:var(--primary);

    color:#fff;

    font-size:1.4rem;

    font-weight:bold;

    border:6px solid #fff;

    box-shadow:0 0 0 5px rgba(31,111,169,.10);

}

.step h3{

    color:var(--primary);

    margin-bottom:15px;

    font-size:1.2rem;

}

.step p{

    color:var(--text);

    font-size:.96rem;

    line-height:1.7;

}

/*=========================================================
SEGMENTOS
=========================================================*/

.segmentos{

    background:var(--light);

}

.segmentos-grid{

    display:grid;

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

    gap:30px;

    margin-top:50px;

}

.segmento{

    background:#fff;

    border-radius:18px;

    padding:35px;

    text-align:center;

    transition:.35s;

    box-shadow:var(--shadow);

    border-bottom:4px solid transparent;

}

.segmento:hover{

    transform:translateY(-8px);

    border-bottom:4px solid var(--gold);

}

.segmento h3{

    color:var(--primary);

    font-size:1.15rem;

    margin-bottom:12px;

}

.segmento p{

    color:var(--text);

    font-size:.95rem;

    line-height:1.7;

}

/*=========================================================
PARCEIRO NA CHINA
=========================================================*/

.china{

    position:relative;

    overflow:hidden;

    background:linear-gradient(rgba(11,60,93,.92),rgba(11,60,93,.92)),
               url("../img/china/shanghai.jpg");

    background-size:cover;

    background-position:center;

    color:#fff;

}

.china::before{

    content:"";

    position:absolute;

    width:420px;

    height:420px;

    border-radius:50%;

    background:rgba(200,155,60,.08);

    right:-120px;

    top:-120px;

}

.china .container{

    position:relative;

    z-index:2;

}

.china h2{

    font-size:2.5rem;

    margin-bottom:30px;

    color:#fff;

}

.china p{

    max-width:760px;

    color:#E7EDF5;

    font-size:1.08rem;

    line-height:1.9;

    margin-bottom:40px;

}

.china-grid{

    display:grid;

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

    gap:30px;

    margin-top:50px;

}

.china-card{

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

    backdrop-filter:blur(12px);

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

    border-radius:18px;

    padding:35px;

    transition:.35s;

}

.china-card:hover{

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

    transform:translateY(-8px);

}

.china-card h3{

    color:#fff;

    margin-bottom:18px;

    font-size:1.2rem;

}

.china-card p{

    color:#E6EEF6;

    margin:0;

    font-size:.96rem;

}

/*=========================================================
LISTAS
=========================================================*/

.check-list{

    display:flex;

    flex-direction:column;

    gap:18px;

    margin-top:25px;

}

.check-list li{

    display:flex;

    align-items:center;

    gap:14px;

    color:#fff;

}

.check-list li::before{

    content:"✓";

    width:28px;

    height:28px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:var(--gold);

    color:#fff;

    font-weight:bold;

    flex-shrink:0;

}

/*=========================================================
TÍTULOS ESCUROS
=========================================================*/

.bg-dark-title h2{

    color:#fff;

}

.bg-dark-title p{

    color:#D8E3ED;

}

/*=========================================================
    AND COMEX
    STYLE.CSS
    BLOCO 04
=========================================================*/

/*=========================================================
MERCADOS
=========================================================*/

#mercados{

    background:#ffffff;

}

#mercados h2{

    font-size:2.5rem;

    color:var(--primary);

    margin-bottom:30px;

    text-align:center;

}

#mercados>p{

    max-width:900px;

    margin:0 auto 60px;

    text-align:center;

    color:var(--text);

    font-size:1.08rem;

}

.mercados-grid{

    display:grid;

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

    gap:25px;

    margin-top:40px;

}

.pais{

    background:#fff;

    border-radius:16px;

    padding:25px;

    text-align:center;

    border:1px solid #ECECEC;

    box-shadow:0 8px 25px rgba(0,0,0,.05);

    transition:.35s;

}

.pais:hover{

    transform:translateY(-6px);

    border-color:var(--gold);

}

.pais img{

    width:55px;

    margin:0 auto 18px;

}

.pais h4{

    color:var(--primary);

    font-size:1rem;

}

/*=========================================================
MAPA
=========================================================*/

.world-map{

    margin-top:70px;

    text-align:center;

}

.world-map img{

    max-width:1000px;

    margin:auto;

    opacity:.95;

}

/*=========================================================
CTA
=========================================================*/

.cta{

    background:linear-gradient(135deg,var(--primary),#134D76);

    color:#fff;

    text-align:center;

    position:relative;

    overflow:hidden;

}

.cta::before{

    content:"";

    position:absolute;

    width:420px;

    height:420px;

    border-radius:50%;

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

    left:-140px;

    bottom:-180px;

}

.cta::after{

    content:"";

    position:absolute;

    width:320px;

    height:320px;

    border-radius:50%;

    background:rgba(200,155,60,.08);

    right:-80px;

    top:-120px;

}

.cta .container{

    position:relative;

    z-index:2;

}

.cta h2{

    font-size:2.7rem;

    margin-bottom:25px;

}

.cta p{

    font-size:1.15rem;

    color:#E7EDF5;

    margin-bottom:40px;

}

.cta .btn{

    font-size:1rem;

}

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

footer{

    background:#081C2C;

    color:#fff;

    padding:70px 0 30px;

}

.footer-grid{

    display:grid;

    grid-template-columns:2fr 1fr 1fr 1.5fr;

    gap:50px;

    margin-bottom:50px;

}

.footer-logo{

    font-size:2rem;

    font-weight:700;

    color:#fff;

    margin-bottom:20px;

}

.footer-about p{

    color:#B8C6D4;

    line-height:1.8;

}

.footer-title{

    color:#fff;

    margin-bottom:20px;

    font-size:1.1rem;

}

.footer-links{

    display:flex;

    flex-direction:column;

    gap:12px;

}

.footer-links a{

    color:#B8C6D4;

    transition:.3s;

}

.footer-links a:hover{

    color:#fff;

    padding-left:6px;

}

.footer-contact{

    display:flex;

    flex-direction:column;

    gap:12px;

    color:#B8C6D4;

}

.footer-contact strong{

    color:#fff;

}

.footer-bottom{

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

    padding-top:25px;

    text-align:center;

    color:#9FB0C1;

    font-size:.92rem;

}

/*=========================================================
SOCIAL
=========================================================*/

.social{

    display:flex;

    gap:15px;

    margin-top:30px;

}

.social a{

    width:44px;

    height:44px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

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

    transition:.35s;

}

.social a:hover{

    background:var(--gold);

    transform:translateY(-5px);

}

/*=========================================================
UTILIDADES
=========================================================*/

.text-center{

    text-align:center;

}

.text-white{

    color:#fff;

}

.w-100{

    width:100%;

}

.flex{

    display:flex;

}

.flex-center{

    display:flex;

    align-items:center;

    justify-content:center;

}

.grid{

    display:grid;

}

.radius{

    border-radius:16px;

}

.shadow{

    box-shadow:var(--shadow);

}

/*=========================================================
SCROLLBAR
=========================================================*/

::-webkit-scrollbar{

    width:12px;

}

::-webkit-scrollbar-track{

    background:#F4F6F8;

}

::-webkit-scrollbar-thumb{

    background:var(--primary);

    border-radius:20px;

}

::-webkit-scrollbar-thumb:hover{

    background:#114E78;

}

/*=========================================================
SELEÇÃO
=========================================================*/

::selection{

    background:var(--gold);

    color:#fff;

}

/*=========================================================
FOCUS
=========================================================*/

button:focus,
a:focus,
input:focus,
textarea:focus{

    outline:2px solid var(--gold);

    outline-offset:3px;

}

/*=========================================================
TRANSIÇÕES GERAIS
=========================================================*/

button,
a,
.card,
.item,
.segmento,
.number-box{

    transition:all .35s ease;

}

/*=========================================================
    AND COMEX
    STYLE.CSS
    BLOCO 05
=========================================================*/

/*=========================================================
ANIMAÇÕES
=========================================================*/

@keyframes fadeUp{

    from{

        opacity:0;
        transform:translateY(40px);

    }

    to{

        opacity:1;
        transform:translateY(0);

    }

}

@keyframes fadeLeft{

    from{

        opacity:0;
        transform:translateX(-40px);

    }

    to{

        opacity:1;
        transform:translateX(0);

    }

}

@keyframes fadeRight{

    from{

        opacity:0;
        transform:translateX(40px);

    }

    to{

        opacity:1;
        transform:translateX(0);

    }

}

@keyframes zoom{

    from{

        opacity:0;
        transform:scale(.9);

    }

    to{

        opacity:1;
        transform:scale(1);

    }

}

.fade-up{

    animation:fadeUp .8s ease forwards;

}

.fade-left{

    animation:fadeLeft .8s ease forwards;

}

.fade-right{

    animation:fadeRight .8s ease forwards;

}

.zoom{

    animation:zoom .6s ease forwards;

}

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

.card,
.number-box,
.segmento,
.step,
.item,
.china-card,
.pais{

    will-change:transform;

}

.card:hover,
.number-box:hover,
.segmento:hover,
.step:hover,
.item:hover,
.china-card:hover,
.pais:hover{

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

}

/*=========================================================
BOTÃO VOLTAR AO TOPO
=========================================================*/

.back-top{

    position:fixed;

    right:30px;

    bottom:30px;

    width:55px;

    height:55px;

    border-radius:50%;

    background:var(--gold);

    color:#fff;

    display:flex;

    justify-content:center;

    align-items:center;

    cursor:pointer;

    box-shadow:var(--shadow);

    opacity:0;

    visibility:hidden;

    transition:.35s;

    z-index:999;

}

.back-top.show{

    opacity:1;

    visibility:visible;

}

.back-top:hover{

    transform:translateY(-6px);

}

/*=========================================================
LOADING
=========================================================*/

.loading{

    position:relative;

    overflow:hidden;

}

.loading::after{

    content:"";

    position:absolute;

    inset:0;

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

    animation:loading 1.6s infinite;

}

@keyframes loading{

    from{

        transform:translateX(-100%);

    }

    to{

        transform:translateX(100%);

    }

}

/*=========================================================
REVEAL
=========================================================*/

.reveal{

    opacity:0;

    transform:translateY(60px);

    transition:1s;

}

.reveal.active{

    opacity:1;

    transform:translateY(0);

}

/*=========================================================
IMAGENS
=========================================================*/

img{

    transition:.35s;

}

.card img:hover{

    transform:scale(1.04);

}

/*=========================================================
BOTÕES
=========================================================*/

.btn{

    position:relative;

    overflow:hidden;

}

.btn::before{

    content:"";

    position:absolute;

    top:0;

    left:-120%;

    width:100%;

    height:100%;

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

    transform:skewX(-25deg);

    transition:.6s;

}

.btn:hover::before{

    left:120%;

}

/*=========================================================
PERFORMANCE
=========================================================*/

section{

    contain:layout;

}

.card,
.item,
.step{

    backface-visibility:hidden;

}

/*=========================================================
RESPONSIVIDADE INICIAL
=========================================================*/

@media(max-width:1200px){

    .numbers-grid,
    .mercados-grid{

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

    }

    .segmentos-grid{

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

    }

    .timeline{

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

    }

}

@media(max-width:992px){

    .grid-diferenciais{

        grid-template-columns:1fr;

    }

    .segmentos-grid{

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

    }

    .timeline{

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

    }

    .china-grid{

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

    }

    .footer-grid{

        grid-template-columns:1fr 1fr;

    }

    .hero h1{

        font-size:2.8rem;

    }

}

@media(max-width:768px){

    nav{

        display:none;

    }

    .highlights .cards,
    #servicos,
    .numbers-grid,
    .segmentos-grid,
    .mercados-grid,
    .timeline,
    .china-grid{

        grid-template-columns:1fr;

    }

    .footer-grid{

        grid-template-columns:1fr;

    }

    .hero{

        text-align:center;

    }

    .hero h1{

        font-size:2.2rem;

    }

    section{

        padding:70px 0;

    }

}

@media(max-width:576px){

    .container{

        width:92%;

    }

    .hero h1{

        font-size:1.9rem;

    }

    .section-title h2{

        font-size:2rem;

    }

    .btn{

        width:100%;

        justify-content:center;

    }

}

/*=========================================================
FIM DO STYLE.CSS
=========================================================*/

/* ==== v1.0 Optimization ==== */
html{scroll-behavior:smooth}
img{max-width:100%;height:auto}
.fade-in{opacity:0;transform:translateY(24px);transition:.6s ease}
.fade-in.visible{opacity:1;transform:none}
header.scrolled{transition:box-shadow .3s ease}
#backToTop.show{opacity:1;visibility:visible}
@media (max-width:768px){
  .container{width:min(92%,1200px)}
}

html{scroll-behavior:smooth;}

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

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
