/* ================================================================
   Multionic Child — footer.css
   Fiel ao Footer.tsx do React — pixel a pixel
   bg-[#3B529B] text-white pt-16 pb-12
   ================================================================ */

.mto-footer {
    background-color: #3B529B;
    color:            #fff;
    padding-top:      80px;  /* pt-20 */
    padding-bottom:   40px;  /* pb-10 */
}

/* container-custom = max-w-[1200px] mx-auto px-4 */

/* ----------------------------------------------------------------
   TOPO — flex flex-col md:flex-row justify-between items-center
   gap-12 mb-16 pb-12 border-b border-white/10
   ---------------------------------------------------------------- */
.mto-footer-top {
    display:         flex;
    flex-direction:  column;
    justify-content: space-between;
    align-items:     center;
    gap:             48px;        /* gap-12 */
    margin-bottom:   64px;        /* mb-16 */
    padding-bottom:  48px;        /* pb-12 */
    border-bottom:   1px solid rgba(255,255,255,0.10);
}
@media (min-width: 768px) {
    .mto-footer-top {
        flex-direction: row;
        align-items:    center;
    }
}

/* Logo: flex-shrink-0 */
.mto-footer-brand { flex-shrink: 0; }

.mto-footer-logo {
    /* header: h-10 brightness-0 invert object-contain */
    height:     40px;
    width:      auto;
    object-fit: contain;
    filter:     brightness(0) invert(1); /* logo branca */
    display:    block;
}
.mto-footer-logo-text {
    font-size:   22px;
    font-weight: 900;
    color:       #fff;
}

/* Descrição: flex-grow max-w-2xl text-center md:text-left */
.mto-footer-desc {
    flex:       1;
    max-width:  672px; /* max-w-2xl */
    text-align: center;
}
@media (min-width: 768px) { .mto-footer-desc { text-align: left; } }

/* text-white/60 text-base font-normal leading-relaxed */
.mto-footer-desc p {
    color:       rgba(255,255,255,0.60);
    font-size:   16px;
    font-weight: 400;
    line-height: 1.65;
    margin:      0;
}

/* Social: flex space-x-4 flex-shrink-0 */
.mto-footer-social {
    display:    flex;
    gap:        16px; /* space-x-4 */
    flex-shrink: 0;
}

/* w-10 h-10 rounded-none border border-white/10
   flex items-center justify-center
   hover:bg-brand-secondary hover:border-brand-secondary */
.mto-footer-social-link {
    width:           40px;
    height:          40px;
    border:          1px solid rgba(255,255,255,0.10);
    display:         flex;
    align-items:     center;
    justify-content: center;
    color:           #fff;
    text-decoration: none;
    transition:      background 0.3s ease, border-color 0.3s ease;
    flex-shrink:     0;
}
.mto-footer-social-link svg { width: 18px; height: 18px; }
.mto-footer-social-link:hover {
    background-color: var(--mto-secondary); /* brand-secondary = #6DB0DF */
    border-color:     var(--mto-secondary);
    color:            #fff;
}

/* ----------------------------------------------------------------
   COLUNAS DE LINKS
   grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-8 mb-16
   ---------------------------------------------------------------- */
.mto-footer-cols {
    display:               grid;
    grid-template-columns: repeat(2, 1fr);
    gap:                   32px; /* gap-8 */
    margin-bottom:         64px; /* mb-16 */
}
@media (min-width: 768px) {
    .mto-footer-cols { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 1024px) {
    .mto-footer-cols { grid-template-columns: repeat(6, 1fr); }
}

/* Título da coluna:
   text-white font-bold text-xs uppercase tracking-widest
   mb-6 border-b border-white/10 pb-2 */
.mto-footer-col-title {
    color:          #fff;
    font-size:      12px;
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: 0.1em; /* tracking-widest */
    margin-bottom:  24px;  /* mb-6 */
    padding-bottom: 8px;   /* pb-2 */
    border-bottom:  1px solid rgba(255,255,255,0.10);
}

/* Lista: space-y-3 */
.mto-footer-col-list {
    display:        flex;
    flex-direction: column;
    gap:            12px; /* space-y-3 */
    list-style:     none;
    margin:         0;
    padding:        0;
}

/* Links: text-white/60 hover:text-white transition-colors text-xs */
.mto-footer-col-link {
    color:           rgba(255,255,255,0.60);
    font-size:       12px;
    font-weight:     400;
    line-height:     1.4;
    text-decoration: none;
    transition:      color 0.2s ease;
    display:         block;
}
.mto-footer-col-link:hover { color: #fff; }

/* ----------------------------------------------------------------
   RODAPÉ INFERIOR
   pt-10 border-t border-white/5
   flex flex-col md:flex-row justify-between items-center gap-6
   ---------------------------------------------------------------- */
.mto-footer-bottom {
    padding-top:     40px; /* pt-10 */
    border-top:      1px solid rgba(255,255,255,0.05);
    display:         flex;
    flex-direction:  column;
    justify-content: space-between;
    align-items:     center;
    gap:             24px; /* gap-6 */
}
@media (min-width: 768px) {
    .mto-footer-bottom { flex-direction: row; }
}

/* © text-white/40 text-xs font-normal */
.mto-footer-copy {
    color:       rgba(255,255,255,0.40);
    font-size:   12px;
    font-weight: 400;
    margin:      0;
}

/* Links legais: flex space-x-8 */
.mto-footer-legal {
    display: flex;
    gap:     32px; /* space-x-8 */
}

/* text-white/40 hover:text-white text-[10px] uppercase font-bold tracking-widest */
.mto-footer-legal-link {
    color:           rgba(255,255,255,0.40);
    font-size:       10px;
    font-weight:     700;
    text-transform:  uppercase;
    letter-spacing:  0.1em;
    text-decoration: none;
    transition:      color 0.2s ease;
}
.mto-footer-legal-link:hover { color: #fff; }