/* ============================================
   FOOTER — Chobham Pharmacy
   Two-column card layout with brand + nav
============================================ */

.footer { padding: 60px 24px; overflow: clip; position: relative; }
.footer .container { max-width: none; padding: 0; position: relative; z-index: 1; }

.footer__reviews { width: 100%; margin-bottom: 40px; position: relative; z-index: 1; }
.footer__reviews-header { text-align: center; margin-bottom: 40px; }
.footer__reviews-header .eyebrow { justify-content: center; margin-bottom: 12px; }
.footer__reviews-header h2 {
    font-family: var(--font-display);
    font-size: clamp(2rem, 3.5vw, 2.8rem);
    font-weight: 400;
    color: var(--gray-900);
}

.footer__card {
    display: grid; grid-template-columns: 1fr 1fr;
    background: var(--white); border-radius: var(--radius-xl);
    border: 1px solid rgba(0,0,0,0.06);
    overflow: hidden;
}

/* Left -- brand column */
.footer__brand {
    padding: 30px;
    display: flex; flex-direction: column; justify-content: center;
    border-right: 1px solid rgba(0,0,0,0.06);
    position: relative; overflow: hidden;
}
.footer__brand::before {
    content: ''; position: absolute; top: 50%; left: 50%;
    width: 500px; height: 500px; border-radius: 50%;
    background: radial-gradient(circle, rgba(232,245,238,0.7) 0%, rgba(232,245,238,0.25) 40%, transparent 70%);
    transform: translate(-50%, -50%);
    pointer-events: none; z-index: 0;
}
.footer__brand > * { position: relative; z-index: 1; }
.footer__brand img { height: 180px; width: auto; margin-bottom: 20px; object-fit: contain; align-self: flex-start; }
.footer__brand p {
    font-size: 0.92rem; font-weight: 300; color: rgba(1,61,31,0.5);
    line-height: 1.75; margin-bottom: 32px; max-width: 340px;
}
.footer__social { display: flex; gap: 10px; }
.footer__social a {
    width: 40px; height: 40px; border-radius: 50%;
    border: 1px solid rgba(1,61,31,0.1);
    display: flex; align-items: center; justify-content: center;
    color: var(--green); transition: all 0.3s var(--ease);
}
.footer__social a:hover { border-color: var(--gold); color: var(--gold); background: rgba(197,162,72,0.06); }
.footer__social a svg { width: 16px; height: 16px; }

/* Right -- nav rows */
.footer__nav { display: flex; flex-direction: column; }
.footer__nav-row {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0 56px; flex: 1;
    font-family: var(--font-display); font-size: 1.25rem; font-weight: 400;
    color: var(--green); text-decoration: none;
    border-bottom: 1px solid rgba(0,0,0,0.06);
    transition: all 0.3s var(--ease);
    position: relative; z-index: 1;
}
.footer__nav-row:last-child { border-bottom: none; }
.footer__nav-row svg {
    width: 20px; height: 20px; color: var(--gold);
    transition: transform 0.3s var(--ease);
    flex-shrink: 0;
}
.footer__nav-row:hover { background: rgba(1,61,31,0.02); padding-left: 64px; }
.footer__nav-row:hover svg { transform: translateX(4px); }

/* Bottom bar */
.footer__bottom {
    padding: 28px 0; margin-top: 32px;
    display: flex; justify-content: space-between; align-items: center;
    position: relative; z-index: 1;
}
.footer__copy { font-size: 0.78rem; font-weight: 300; color: rgba(1,61,31,0.35); }
.footer__legal { display: flex; gap: 28px; }
.footer__legal a { font-size: 0.78rem; font-weight: 300; color: rgba(1,61,31,0.35); transition: color 0.3s; text-decoration: none; }
.footer__legal a:hover { color: var(--gold); }

/* ---- Responsive ---- */
@media (max-width: 900px) {
    .footer__card { grid-template-columns: 1fr; }
    .footer__brand { border-right: none; border-bottom: 1px solid rgba(0,0,0,0.06); align-items: center; text-align: center; }
    .footer__brand img { align-self: center; }
    .footer__brand p { max-width: none; }
    .footer__social { justify-content: center; }
    .footer__nav-row { padding: 24px 32px; }
}

@media (max-width: 640px) {
    .footer__bottom { flex-direction: column; gap: 12px; text-align: center; }
}