/* -------------------------------------------------
   14. FOOTER
------------------------------------------------- */
.site-footer{
    background:var(--color-dark);
    color:rgba(255,255,255,.65);
    padding-top:70px;
}
.footer-top{
    display:grid;
    grid-template-columns:1.3fr 1fr 1fr 1fr 1.1fr;
    gap:32px;
    padding-bottom:56px;
    border-bottom:1px solid var(--color-line-dark);
}
.footer-brand .logo-main {
    display: block;
    margin-top: 1.67em;
    margin-bottom: 1.67rem;
}

.footer-brand p{ font-size:var(--fs-base); line-height:1.7; max-width:220px; margin-bottom:22px; font-weight: 400;}
.footer-social{ display:flex; gap:14px; }
.footer-social a{
    width:32px; height:32px;
    border:1px solid rgba(255,255,255,.25);
    border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    transition:background .2s ease, border-color .2s ease;
}
.footer-social a:hover{ background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.5); }
.footer-social svg{ width:14px; height:14px; color:var(--color-white); }

.footer-col h5{
    color:var(--color-white);
    font-family:var(--font-body);
    font-weight:500;
    font-size:var(--fs-sm);
    letter-spacing:.1em;
    text-transform:uppercase;
    margin-bottom:20px;
}
.footer-col ul li{ margin-bottom:12px; }
.footer-col ul li a{ font-size:var(--fs-base); transition:color .2s ease; font-weight: 400;}
.footer-col ul li a:hover{ color:var(--color-white); }
.footer-col .footer-contact-item{ font-size:var(--fs-base); margin-bottom:12px; }
.footer-col .btn{ margin-top:var(--btn-spacing-top); padding:var(--btn-padding-sm); }

.footer-bottom{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:24px 0;
    font-size:var(--fs-sm);
    color:rgba(255,255,255,.4);
}

/* -------------------------------------------------
   15. RESPONSIVE
------------------------------------------------- */
@media (max-width: 1080px){
    .footer-top{ grid-template-columns:1fr 1fr 1fr; }
    .footer-brand{ grid-column:1/-1; }
}
@media (max-width: 900px){
    .features-strip ul{ grid-template-columns:repeat(2,1fr); }
    .features-strip li{ border-bottom:1px solid var(--color-line); padding: 17px 2px; font-weight: 400; }
    .category-grid{ grid-template-columns:1fr; grid-template-rows:none; }
    .category-card.tall{ grid-row:auto; min-height:300px; }
    .category-grid-right .row-split{ grid-template-columns:1fr; }
    .inspiration{ grid-template-columns:1fr; }
    .inspiration-image{ min-height:300px; }
    .why-grid{ grid-template-columns:1fr 1fr; row-gap:32px; }
    .footer-top{ grid-template-columns:1fr 1fr; }
    .hero .container{ justify-content: center; }
    .btn { padding: var(--btn-padding-sm);}
}