/* ==========================================================================
   Site Footer — redesigned: yellow brand panel (right) + cream columns (left)
   ========================================================================== */
.site-footer {
    position: relative;
    margin-top: 0;
    /* top 58px = the page colour (so the panel's curved corner is a clean cut-out over the page),
       cream below — no stripe of a different background */
    background: linear-gradient(180deg, var(--vl-page) 0, var(--vl-page) 119px, var(--vl-cream) 119px);
    color: var(--vl-text);
    font-family: "Estedad", sans-serif;
    direction: rtl;
}
.vl-footer {
    /* Full-bleed: the yellow panel sticks to the right edge of the screen at any width,
       the left column lines up with the page container (1280px). */
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    width: 100%;
}
.site-footer a { color: inherit; text-decoration: none; }
.site-footer ul { list-style: none; margin: 0; padding: 0; }

/* ---------- Brand panel ---------- */
.vl-footer-brand {
    margin-top: 61px;
    width: calc(539px + max(0px, (100vw - 1440px) / 2));
    min-height: 574px;
    box-sizing: border-box;
    padding: 86px 68px 37px 68px; /* tuned to the reference footer */
    border-top-left-radius: 160px;
    background: #E7AE1D;
    color: #2A1D00;
    display: flex; flex-direction: column; gap: 26px;
}
[data-theme="dark"] .vl-footer-brand { background: #B98710; color: #1c1300; }
.vl-footer-brand-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.vl-footer-brand-name { font-size: 23px; font-weight: 900; white-space: nowrap; }
.vl-footer-logo {
    display: inline-flex; align-items: center; justify-content: center; gap: 0;
    width: 171px; min-height: 68px; box-sizing: border-box;
    padding: 6px 20px; border-radius: 999px; background: #C99719;
}
.vl-footer-logo .logo-mark { display: none; }
.vl-footer-logo .logo-word { font-size: 19px; font-weight: 950; color: #2A1D00; letter-spacing: .02em; }
.site-footer .vl-footer-about { font-size: 16px; font-weight: 800; line-height: 2.05; text-align: justify; margin: 0; }
.vl-footer-socials { display: flex; gap: 12px; padding-top: 26px !important; margin-top: auto !important; border-top: 2.5px solid rgba(42,29,0,.72); }
.vl-footer-socials a {
    display: inline-flex; align-items: center; justify-content: center;
    width: 56px; height: 56px; border-radius: 50%;
    background: #232323; color: var(--vl-yellow);
    transition: transform .25s ease, background .25s ease, color .25s ease;
}
.vl-footer-socials a:hover { transform: translateY(-3px); background: #fff; color: #232323; }

/* ---------- Columns ---------- */
.vl-footer-main { display: flex; flex-direction: column; padding: 162px 56px 74px max(24px, calc((100vw - 1280px) / 2)); min-width: 0; }
.vl-footer-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.vl-footer-col { min-width: 0; }
.site-footer .vl-footer-title { margin: 0 0 26px; font-size: 18px; font-weight: 800; color: var(--vl-text); }

.footer-menu { display: flex; flex-direction: column; gap: 12px; }
.footer-menu a, .vl-footer-contact li > a, .vl-footer-contact li > .vl-row-static {
    display: flex; align-items: center; gap: 10px;
    min-height: 50px; padding: 8px 18px; border-radius: 999px;
    background: #ECE7DB; font-size: 16px; font-weight: 900;
    transition: background .25s ease, transform .25s ease;
}
.footer-menu a svg, .vl-footer-contact svg { flex: none; }
.footer-menu a::after {
    content: ""; margin-inline-start: auto; width: 18px; height: 18px; background: currentColor; opacity: .7;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5M11 6l-6 6 6 6'/%3E%3C/svg%3E") center/contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5M11 6l-6 6 6 6'/%3E%3C/svg%3E") center/contain no-repeat;
    transition: transform .25s ease;
}
.footer-menu a:hover { background: var(--vl-yellow); color: #1F1F1F; transform: translateX(-3px); }
.footer-menu a:hover::after { transform: translateX(-3px); }

.vl-footer-cats { display: flex; flex-direction: column; gap: 12px; }
.vl-footer-cats a {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    height: 68px; padding: 0 22px; border-radius: 20px;
    background: linear-gradient(rgba(24,16,8,.74), rgba(24,16,8,.74)), var(--vl-bg) center / cover no-repeat;
    color: #fff !important; font-size: 16px; font-weight: 900;
    transition: transform .25s ease, box-shadow .25s ease;
}
.vl-footer-cats a:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(0,0,0,.2); }
.vl-footer-cats a svg { color: var(--vl-yellow); }

.vl-footer-contact { display: flex; flex-direction: column; gap: 12px; }
.vl-footer-contact li > a:hover { background: var(--vl-cream); box-shadow: inset 0 0 0 1.5px var(--vl-yellow); }
.vl-footer-contact svg { color: var(--vl-gold); }
.vl-footer-contact em { font-style: normal; color: var(--vl-text); }
.vl-footer-contact b { margin-inline-start: auto; font-weight: 800; font-size: 14.5px; direction: ltr; unicode-bidi: plaintext; }
.vl-footer-contact .is-address { padding: 14px 18px; border-radius: 26px; background: #ECE7DB; }
.vl-footer-contact .is-address > span { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 800; margin-bottom: 6px; }
.vl-footer-contact address { font-style: normal; font-size: 14.5px; font-weight: 750; line-height: 2; color: var(--vl-muted); padding-inline-start: 28px; }

.vl-footer-bottom { margin-top: auto; padding-top: 34px; }
.vl-footer-bottom p { margin: 0; padding-top: 22px; border-top: 2.5px solid color-mix(in srgb, var(--vl-text) 72%, transparent); font-size: 15px; font-weight: 850; }
.vl-footer-bottom a { text-decoration: underline; text-underline-offset: 4px; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
    .site-footer { background: linear-gradient(180deg, var(--vl-page) 0, var(--vl-page) 70px, var(--vl-cream) 70px); }
    .vl-footer { grid-template-columns: minmax(0, 1fr); }
    .vl-footer-brand { width: auto; min-height: 0; margin: 0 24px; border-radius: 48px; padding: 44px 28px 40px; }
    .vl-footer-main { padding: 44px 24px 28px; }
    .vl-footer-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 12px; }
    .vl-footer-col:last-child { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
    .vl-footer-brand { padding: 40px 24px 36px; }
    .vl-footer-cols { gap: 28px 10px; }
    .footer-menu a, .vl-footer-contact li > a, .vl-footer-contact li > .vl-row-static { padding-inline: 14px; font-size: 15px; }
    .vl-footer-cats a { padding: 0 16px; height: 68px; }
}


/* Theme-aware footer controls: keep labels readable in both color schemes. */
.footer-menu a,
.vl-footer-contact li > a,
.vl-footer-contact li > .vl-row-static,
.vl-footer-contact .is-address {
    background: var(--vl-soft);
    color: var(--vl-text);
}
.vl-footer-contact em,
.vl-footer-contact b,
.vl-footer-contact .is-address > span {
    color: var(--vl-text);
}
.vl-footer-contact address {
    color: var(--vl-muted);
}
[data-theme="dark"] .footer-menu a,
[data-theme="dark"] .vl-footer-contact li > a,
[data-theme="dark"] .vl-footer-contact li > .vl-row-static,
[data-theme="dark"] .vl-footer-contact .is-address {
    background: var(--vl-soft);
    color: var(--vl-text);
}
[data-theme="dark"] .footer-menu a:hover,
[data-theme="dark"] .vl-footer-contact li > a:hover {
    background: var(--vl-yellow);
    color: #1F1F1F;
}