/*
* ===============================================================
* FOOTER PROFESIONAL - EL ESPACIO DEL ASADOR
* Archivo: /css/footer-asador.css
* ===============================================================
*/

 .site-footer-personalizado {
     position: relative;
     margin-top: 0 !important;
     padding: 0;
     color: var(--color-texto-claro);
     background:
         radial-gradient(circle at top left, rgba(216, 67, 21, 0.18) 0%, rgba(216, 67, 21, 0) 30%),
         linear-gradient(180deg, rgba(34, 34, 34, 0.98) 0%, rgba(18, 18, 18, 1) 100%);
     border-top: 1px solid rgba(255, 255, 255, 0.06);
     overflow: hidden;
 }

 .site-footer-personalizado::before {
     content: "";
     position: absolute;
     inset: 0;
     background: linear-gradient(180deg, rgba(255, 255, 255, 0.02) 0%, transparent 22%);
     pointer-events: none;
 }

 .site-footer-personalizado .footer-container,
 .site-footer-personalizado .footer-bottom-container {
     max-width: 1300px;
     margin: 0 auto;
     padding-left: 35px;
     padding-right: 35px;
 }

 .footer-top-accent {
     height: 2px;
     background: linear-gradient(90deg, transparent 0%, var(--color-primario) 20%, rgba(255, 255, 255, 0.25) 50%, var(--color-primario) 80%, transparent 100%);
     opacity: 0.9;
 }

 .footer-main {
     position: relative;
     z-index: 1;
     padding: 56px 0 34px;
 }

 .footer-highlights {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 18px;
     margin-bottom: 46px;
 }

 .footer-highlight-item {
     background: rgba(255, 255, 255, 0.035);
     border: 1px solid rgba(255, 255, 255, 0.07);
     border-radius: 18px;
     padding: 20px 22px;
     box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18);
     backdrop-filter: blur(8px);
     -webkit-backdrop-filter: blur(8px);
     transition: transform 0.3s ease, border-color 0.3s ease, background 0.3s ease;
 }

 .footer-highlight-item:hover {
     transform: translateY(-4px);
     border-color: rgba(216, 67, 21, 0.28);
     background: rgba(255, 255, 255, 0.05);
 }

 .footer-highlight-kicker {
     display: block;
     margin-bottom: 8px;
     font-size: 0.72rem;
     font-weight: 700;
     letter-spacing: 1.8px;
     text-transform: uppercase;
     color: var(--color-primario);
     font-family: var(--font-body);
 }

 .footer-highlight-item strong {
     display: block;
     font-size: 1rem;
     line-height: 1.45;
     color: #ffffff;
     font-weight: 600;
 }

 .footer-grid {
     display: grid;
     grid-template-columns: minmax(320px, 1.35fr) repeat(3, minmax(180px, 1fr));
     gap: 40px 56px;
     align-items: start;
 }

 .footer-brand-card {
     background: linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.025) 100%);
     border: 1px solid rgba(255, 255, 255, 0.08);
     border-radius: 24px;
     padding: 28px;
     box-shadow: 0 18px 40px rgba(0, 0, 0, 0.22);
 }

 .footer-logo-link {
     display: inline-flex;
     align-items: center;
     text-decoration: none;
 }

 .footer-logo {
     display: block;
     max-height: 62px;
     width: auto;
     margin-bottom: 18px;
 }

 .footer-brand-name {
     margin: 0 0 16px 0;
     font-size: 2rem;
     line-height: 1.1;
 }

 .footer-brand-name a {
     color: #ffffff;
     text-decoration: none;
 }

 .footer-brand-text {
     margin: 0;
     color: rgba(224, 224, 224, 0.78);
     line-height: 1.85;
     font-size: 1rem;
 }

 .footer-social {
     display: flex;
     flex-wrap: wrap;
     gap: 12px;
     margin-top: 26px;
 }

 .footer-social a {
     width: 46px;
     height: 46px;
     display: inline-flex;
     align-items: center;
     justify-content: center;
     border-radius: 14px;
     text-decoration: none;
     color: #ffffff;
     background: rgba(255, 255, 255, 0.035);
     border: 1px solid rgba(255, 255, 255, 0.08);
     transition: transform 0.28s ease, background 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease;
 }

 .footer-social a:hover {
     transform: translateY(-4px);
     background: rgba(216, 67, 21, 0.16);
     border-color: rgba(216, 67, 21, 0.42);
     box-shadow: 0 12px 24px rgba(216, 67, 21, 0.16);
     color: #ffffff;
 }

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

 .footer-column {
     min-width: 0;
 }

 .footer-title {
     position: relative;
     margin: 8px 0 22px;
     padding-bottom: 14px;
     font-family: var(--font-headings);
     font-size: 1.35rem;
     line-height: 1.1;
     letter-spacing: 1.8px;
     text-transform: uppercase;
     color: #ffffff;
 }

 .footer-title::after {
     content: "";
     position: absolute;
     left: 0;
     bottom: 0;
     width: 48px;
     height: 3px;
     border-radius: 999px;
     background: linear-gradient(90deg, var(--color-primario) 0%, rgba(216, 67, 21, 0) 100%);
 }

 .footer-links,
 .footer-contact-list {
     list-style: none;
     margin: 0;
     padding: 0;
 }

 .footer-links li,
 .footer-contact-list li {
     margin: 0;
 }

 .footer-links li+li,
 .footer-contact-list li+li {
     margin-top: 10px;
 }

 .footer-links a {
     display: inline-flex;
     align-items: center;
     color: rgba(224, 224, 224, 0.78);
     text-decoration: none;
     line-height: 1.6;
     transition: color 0.25s ease, transform 0.25s ease;
 }

 .footer-links a::before {
     content: "";
     width: 0;
     height: 1px;
     background: var(--color-primario);
     margin-right: 0;
     transition: width 0.25s ease, margin-right 0.25s ease;
 }

 .footer-links a:hover {
     color: #ffffff;
     transform: translateX(4px);
 }

 .footer-links a:hover::before {
     width: 14px;
     margin-right: 10px;
 }

 .footer-column-contact {
     background: rgba(255, 255, 255, 0.025);
     border: 1px solid rgba(255, 255, 255, 0.06);
     border-radius: 22px;
     padding: 24px;
 }

 .footer-contact-list li {
     padding: 12px 0;
     border-bottom: 1px solid rgba(255, 255, 255, 0.06);
 }

 .footer-contact-list li:last-child {
     border-bottom: none;
 }

 .footer-contact-label {
     display: block;
     margin-bottom: 7px;
     font-size: 0.72rem;
     font-weight: 700;
     letter-spacing: 1.6px;
     text-transform: uppercase;
     color: rgba(224, 224, 224, 0.48);
 }

 .footer-contact-list a,
 .footer-contact-list span {
     color: rgba(224, 224, 224, 0.88);
     text-decoration: none;
     line-height: 1.7;
     transition: color 0.25s ease;
 }

 .footer-contact-list a:hover {
     color: #ffffff;
 }

 .footer-cta {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     margin-top: 22px;
     padding: 14px 24px;
     min-height: 50px;
     border-radius: 12px;
     text-decoration: none;
     background: linear-gradient(135deg, var(--color-primario) 0%, var(--color-primario-hover) 100%);
     color: #ffffff !important;
     font-family: var(--font-headings);
     font-size: 0.95rem;
     font-weight: 600;
     letter-spacing: 1.2px;
     text-transform: uppercase;
     box-shadow: 0 16px 30px rgba(216, 67, 21, 0.18);
     transition: transform 0.28s ease, box-shadow 0.28s ease, filter 0.28s ease;
 }

 .footer-cta:hover {
     transform: translateY(-3px);
     box-shadow: 0 22px 34px rgba(216, 67, 21, 0.22);
     filter: brightness(1.04);
     color: #ffffff !important;
 }

 .footer-bottom {
     position: relative;
     z-index: 1;
     border-top: 1px solid rgba(255, 255, 255, 0.06);
     background: rgba(0, 0, 0, 0.16);
     backdrop-filter: blur(10px);
     -webkit-backdrop-filter: blur(10px);
 }

 .footer-bottom-container {
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: 16px 28px;
     padding-top: 20px;
     padding-bottom: 20px;
 }

 .footer-copy {
     margin: 0;
     color: rgba(224, 224, 224, 0.56);
     font-size: 0.92rem;
     line-height: 1.5;
 }

 .footer-bottom-links {
     display: flex;
     align-items: center;
     gap: 20px;
     flex-wrap: wrap;
 }

 .footer-bottom-links a {
     color: rgba(224, 224, 224, 0.68);
     text-decoration: none;
     font-size: 0.92rem;
     transition: color 0.25s ease;
 }

 .footer-bottom-links a:hover {
     color: #ffffff;
 }

 @media (max-width: 1180px) {
     .footer-grid {
         grid-template-columns: repeat(2, minmax(280px, 1fr));
         gap: 34px 36px;
     }
 }

 @media (max-width: 992px) {

     .site-footer-personalizado .footer-container,
     .site-footer-personalizado .footer-bottom-container {
         padding-left: 20px;
         padding-right: 20px;
     }

     .footer-main {
         padding: 48px 0 28px;
     }

     .footer-highlights {
         grid-template-columns: 1fr;
         margin-bottom: 34px;
     }
 }

 @media (max-width: 768px) {
     .footer-grid {
         grid-template-columns: 1fr;
     }

     .footer-brand-card,
     .footer-column-contact {
         padding: 22px;
     }

     .footer-title {
         margin-top: 0;
     }

     .footer-bottom-container {
         flex-direction: column;
         text-align: center;
     }

     .footer-bottom-links {
         justify-content: center;
     }
 }

 @media (max-width: 480px) {
     .footer-logo {
         max-height: 54px;
     }

     .footer-brand-text {
         font-size: 0.96rem;
         line-height: 1.75;
     }

     .footer-social a {
         width: 42px;
         height: 42px;
         border-radius: 12px;
     }

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

     .footer-cta {
         width: 100%;
     }
 }