/* =========================================================
   FOOTER — Naccato (WoodMart child)
   ---------------------------------------------------------
   Footer oscuro azul de marca (#38627A). WoodMart aplica el
   esquema "color-scheme-dark" (texto claro) via footer-style,
   pero NO fija el color de fondo de la widget area: ese color
   exacto de marca lo ponemos aca. Tambien estiliza la columna
   de marca (logo + tagline + contacto) del HTML block y afina
   contraste/espaciado de titulos y links sobre el azul.

   Targets el markup de woodmart/footer.php + sidebar-footer.php:
     <footer class="wd-footer footer-container color-scheme-dark">
       .main-footer .footer-sidebar .footer-column ...
       .wd-copyrights.copyrights-wrapper ...
   ========================================================= */

/* ---- Fondo de marca de toda la zona del footer ---- */
.wd-footer.footer-container {
    background-color: var(--color-brand-primary, #38627A);
}

/* La zona de widgets y la barra de copyright comparten el azul.
   La barra de copyright ya recibe su color desde footer-bar-bg
   (#38627A) por el CSS dinamico de WoodMart; reforzamos por las
   dudas y le damos una separacion sutil. */
.wd-footer .wd-copyrights.copyrights-wrapper {
    background-color: var(--color-brand-primary, #38627A);
    border-top: 1px solid rgba(255, 255, 255, .16);
}

/* ---- Espaciado general de la widget area ---- */
.wd-footer .main-footer {
    padding-top: var(--space-2xl, 3rem);
    padding-bottom: var(--space-xl, 2rem);
}

/* ---- Titulos de columna (widget titles) ----
   Oswald, uppercase, fuerte: jerarquia de marca. Contraste alto
   sobre el azul (texto blanco). */
.wd-footer .footer-column .widgettitle,
.wd-footer .footer-column .widget-title,
.wd-footer .footer-column .widget > h3,
.wd-footer .footer-column .widget > h4 {
    font-family: var(--font-heading, 'Oswald', sans-serif);
    text-transform: none;   /* demo Vegetables: titulos sin mayusculas (#1) */
    letter-spacing: 0;
    font-weight: 700;
    font-size: var(--text-base, 1rem);
    color: #ffffff;
    margin-bottom: var(--space-md, 1rem);
    padding-bottom: var(--space-sm, .5rem);
    position: relative;
}

/* Subrayado de acento bajo el titulo */
.wd-footer .footer-column .widgettitle::after,
.wd-footer .footer-column .widget-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 36px;
    height: 2px;
    background-color: rgba(255, 255, 255, .55);
}

/* ---- Texto y links de columnas: contraste AA sobre #38627A ----
   Blanco 88% para cuerpo, blanco pleno en hover. */
.wd-footer .footer-column,
.wd-footer .footer-column p,
.wd-footer .footer-column li,
.wd-footer .footer-column a {
    color: rgba(255, 255, 255, .88);
    font-family: var(--font-body, 'Roboto', sans-serif);
}

.wd-footer .footer-column a {
    transition: color var(--transition, 180ms ease);
}

.wd-footer .footer-column a:hover,
.wd-footer .footer-column a:focus {
    color: #ffffff;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Listas de menu del footer: limpias, sin bullets, con aire */
.wd-footer .footer-column .menu,
.wd-footer .footer-column ul.menu,
.wd-footer .footer-column .wd-nav {
    list-style: none;
    margin: 0;
    padding: 0;
}

.wd-footer .footer-column .menu li {
    margin-bottom: var(--space-sm, .5rem);
}

/* =========================================================
   COLUMNA 1 — Marca + contacto (HTML block)
   ========================================================= */
.naccato-footer-brand {
    display: flex;
    flex-direction: column;
    gap: var(--space-md, 1rem);
}

.naccato-footer-logo-wrap {
    line-height: 0;
}

.naccato-footer-logo {
    display: inline-block;
    line-height: 0;
}

.naccato-footer-logo img {
    width: 200px;
    max-width: 100%;
    height: auto;
}

.naccato-footer-tagline {
    margin: 0;
    font-size: var(--text-sm, .875rem);
    line-height: 1.6;
    color: rgba(255, 255, 255, .82);
    max-width: 32ch;
}

.naccato-footer-contact {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-sm, .5rem);
}

.naccato-footer-contact__item {
    display: flex;
    align-items: flex-start;
    gap: var(--space-sm, .5rem);
    font-size: var(--text-sm, .875rem);
    line-height: 1.5;
    color: rgba(255, 255, 255, .88);
}

.naccato-footer-contact__item svg {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin-top: 2px;
    color: rgba(255, 255, 255, .7);
}

.naccato-footer-contact__item a {
    color: rgba(255, 255, 255, .88);
}

.naccato-footer-contact__item a:hover,
.naccato-footer-contact__item a:focus {
    color: #ffffff;
}

/* =========================================================
   BARRA DE COPYRIGHT
   ========================================================= */
.wd-footer .wd-copyrights .reset-last-child,
.wd-footer .wd-copyrights p,
.wd-footer .wd-copyrights a {
    color: rgba(255, 255, 255, .8);
    font-family: var(--font-body, 'Roboto', sans-serif);
    font-size: var(--text-sm, .875rem);
}

/* Link de credito (AutopymeAI) y cualquier link de la barra:
   subrayado sutil persistente = afordancia de link sin depender
   solo del color; contraste AA pleno (blanco) en hover/focus. */
.wd-footer .wd-copyrights a {
    color: rgba(255, 255, 255, .9);
    text-decoration: underline;
    text-decoration-color: rgba(255, 255, 255, .45);
    text-underline-offset: 3px;
    transition: color var(--transition, 180ms ease),
                text-decoration-color var(--transition, 180ms ease);
}

.wd-footer .wd-copyrights a:hover,
.wd-footer .wd-copyrights a:focus {
    color: #ffffff;
    text-decoration-color: #ffffff;
}

/* =========================================================
   REDES SOCIALES (col 1, bajo los datos de contacto)
   ========================================================= */
.naccato-footer-social {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 12px;
}

.naccato-footer-social__item {
    line-height: 0;
}

.naccato-footer-social__item a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    min-height: 40px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, .1);
    color: rgba(255, 255, 255, .75);
    transition: background-color var(--transition, 180ms ease),
                color var(--transition, 180ms ease);
    text-decoration: none;
}

.naccato-footer-social__item a:hover,
.naccato-footer-social__item a:focus {
    background-color: rgba(255, 255, 255, .2);
    color: #ffffff;
    text-decoration: none;
}

.naccato-footer-social__item svg {
    width: 20px;
    height: 20px;
    display: block;
    flex: 0 0 auto;
}