/* ============================================================
   Public footer — five variants picked via Settings → Footer.
   The Twig partial at templates/partials/landing-footer.twig
   sets `lp-foot-{variant}` so each block below targets its
   own variant scope.
   ============================================================ */

.lp-foot { border-block-start: 1px solid var(--border-subtle); }
.lp-foot a { color: var(--text-secondary); text-decoration: none; transition: color var(--dur-fast); }
.lp-foot a:hover { color: var(--text-primary); }
.lp-foot-copy { color: var(--text-tertiary); font-size: var(--fs-sm); }
.lp-foot-tagline { color: var(--text-secondary); font-size: var(--fs-md); line-height: 1.6; max-inline-size: 380px; margin: 0; }
.lp-foot-brand,
.lp-foot-brand-lg,
.lp-foot-brand-xl { display: inline-flex; align-items: center; gap: var(--s-3); text-decoration: none; color: var(--text-primary); }
.logo-mark-lg { inline-size: 32px; block-size: 32px; font-size: 17px; border-radius: var(--r-md); }
.logo-mark-xl { inline-size: 56px; block-size: 56px; font-size: 28px; border-radius: var(--r-lg); }
.logo-wordmark-lg { font-size: var(--fs-xl); font-weight: var(--fw-semibold); letter-spacing: -0.02em; }

.lp-foot-social { display: inline-flex; align-items: center; gap: var(--s-3); }
.lp-foot-social a {
    inline-size: 32px; block-size: 32px; border-radius: var(--r-md);
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--bg-elevated); border: 1px solid var(--border-subtle);
    color: var(--text-secondary); transition: all var(--dur-fast);
}
.lp-foot-social a:hover { color: var(--text-primary); border-color: var(--border-strong); transform: translateY(-1px); }
.lp-foot-social-icon {
    inline-size: 14px; block-size: 14px; display: inline-block;
    background-color: currentColor;
    mask: var(--mask) center / contain no-repeat;
    -webkit-mask: var(--mask) center / contain no-repeat;
}
.lp-foot-social-icon[data-icon="globe"]    { --mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><line x1='2' y1='12' x2='22' y2='12'/><path d='M12 2a15 15 0 014 10 15 15 0 01-4 10 15 15 0 01-4-10 15 15 0 014-10z'/></svg>"); }
.lp-foot-social-icon[data-icon="twitter"]  { --mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'><path d='M18 2h3l-7 8 8 12h-6l-5-7-6 7H2l8-9L2 2h6l4 6z'/></svg>"); }
.lp-foot-social-icon[data-icon="github"]   { --mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'><path d='M12 .5C5.7.5.5 5.7.5 12c0 5 3.3 9.3 7.8 10.8.6.1.8-.3.8-.6v-2c-3.2.7-3.9-1.5-3.9-1.5-.5-1.3-1.3-1.7-1.3-1.7-1-.7.1-.7.1-.7 1.2.1 1.8 1.2 1.8 1.2 1 1.8 2.8 1.3 3.5 1 .1-.8.4-1.3.7-1.6-2.6-.3-5.3-1.3-5.3-5.7 0-1.3.4-2.3 1.2-3.1-.1-.3-.5-1.5.1-3.1 0 0 1-.3 3.2 1.2.9-.3 1.9-.4 2.9-.4s2 .1 2.9.4c2.2-1.5 3.2-1.2 3.2-1.2.6 1.6.2 2.8.1 3.1.7.8 1.2 1.8 1.2 3.1 0 4.4-2.7 5.4-5.3 5.7.4.4.8 1.1.8 2.2v3.3c0 .3.2.7.8.6 4.6-1.5 7.8-5.8 7.8-10.8C23.5 5.7 18.3.5 12 .5z'/></svg>"); }
.lp-foot-social-icon[data-icon="linkedin"] { --mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'><path d='M4 4h4v4H4zm0 6h4v10H4zm6 0h4v1.5c.6-1 1.8-1.8 3.4-1.8 3.2 0 4.6 2.1 4.6 5.4V20h-4v-4.4c0-1.4-.6-2.4-1.8-2.4-1.4 0-2.2 1-2.2 2.4V20h-4z'/></svg>"); }
.lp-foot-social-icon[data-icon="youtube"]  { --mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'><path d='M23 6.4a3 3 0 00-2-2C19 4 12 4 12 4s-7 0-9 .4a3 3 0 00-2 2C.6 8.5.6 12 .6 12s0 3.5.4 5.6a3 3 0 002 2c2 .4 9 .4 9 .4s7 0 9-.4a3 3 0 002-2c.4-2.1.4-5.6.4-5.6s0-3.5-.4-5.6zM10 16V8l6 4z'/></svg>"); }
.lp-foot-social-icon[data-icon="instagram"]{ --mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2'><rect x='3' y='3' width='18' height='18' rx='5'/><circle cx='12' cy='12' r='4'/><circle cx='17.5' cy='6.5' r='1' fill='black'/></svg>"); }
.lp-foot-social-icon[data-icon="discord"]  { --mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'><path d='M20.3 4.4A19 19 0 0015.7 3l-.2.5c1.7.4 2.5.9 3.4 1.5C17 4.2 15.5 3.7 12 3.7s-5 .5-7 1.3c.9-.6 1.7-1.1 3.4-1.5L8.3 3a19 19 0 00-4.6 1.4C1.4 7.7.7 11 1 14.2c1.8 1.4 3.6 2.2 5.4 2.7l.6-1c-1-.4-2-.9-2.9-1.6.2.2.5.3.7.5 3.4 1.6 7.5 1.6 11 0 .2-.1.5-.3.7-.5-.9.7-1.9 1.2-2.9 1.6l.6 1c1.8-.5 3.6-1.3 5.4-2.7.4-3.6-.6-7-2.3-9.8zM8.5 12.5c-.8 0-1.5-.8-1.5-1.7s.7-1.7 1.5-1.7 1.5.8 1.5 1.7-.7 1.7-1.5 1.7zm7 0c-.8 0-1.5-.8-1.5-1.7s.7-1.7 1.5-1.7 1.5.8 1.5 1.7-.7 1.7-1.5 1.7z'/></svg>"); }

/* ── Minimal — single row, brand left, links centre, copyright right ── */
.lp-foot-minimal .lp-foot-bar {
    display: flex; align-items: center; gap: var(--s-6);
    padding-block: var(--s-6); flex-wrap: wrap;
}
.lp-foot-minimal .lp-foot-links {
    display: flex; flex: 1; gap: var(--s-6); flex-wrap: wrap; font-size: var(--fs-md);
}
.lp-foot-minimal .lp-foot-copy { margin-inline-start: auto; }

/* ── Centered — stacked, generous breathing room ── */
.lp-foot-centered .lp-foot-center {
    padding-block: var(--s-12);
    display: flex; flex-direction: column; align-items: center; gap: var(--s-5);
    text-align: center;
}
.lp-foot-centered .lp-foot-tagline { text-align: center; }
.lp-foot-links-center { display: flex; gap: var(--s-6); flex-wrap: wrap; justify-content: center; font-size: var(--fs-md); }
.lp-foot-social-center { margin-block-start: var(--s-3); }
.lp-foot-divider { inline-size: 64px; block-size: 1px; background: var(--border-subtle); margin: var(--s-3) 0; }

/* ── Columns — brand left, multi-column links right, © at bottom ── */
.lp-foot-columns .lp-foot-cols {
    padding-block: var(--s-12);
    display: grid; grid-template-columns: minmax(220px, 320px) 1fr;
    gap: var(--s-12); align-items: flex-start;
}
.lp-foot-columns .lp-foot-col-brand { display: flex; flex-direction: column; gap: var(--s-4); }
.lp-foot-col-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: var(--s-8) var(--s-6);
}
.lp-foot-col-title {
    font-size: var(--fs-sm); font-weight: var(--fw-semibold); color: var(--text-primary);
    margin-block-end: var(--s-4); letter-spacing: 0.02em;
}
.lp-foot-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--s-3); }
.lp-foot-col a { font-size: var(--fs-md); }
.lp-foot-row-end {
    grid-column: 1 / -1; padding-block-start: var(--s-7);
    border-block-start: 1px solid var(--border-subtle); margin-block-start: var(--s-4);
}

/* ── Mega — newsletter + columns + social ── */
.lp-foot-mega .lp-foot-mega-top {
    padding-block: var(--s-12); display: grid;
    grid-template-columns: minmax(280px, 380px) 1fr; gap: var(--s-12);
}
.lp-foot-mega .lp-foot-mega-brand { display: flex; flex-direction: column; gap: var(--s-5); }
.lp-foot-news { display: flex; flex-direction: column; gap: var(--s-3); }
.lp-foot-news-label { font-size: var(--fs-sm); color: var(--text-secondary); }
.lp-foot-news-row { display: flex; gap: var(--s-3); }
.lp-foot-news-input {
    flex: 1; padding: var(--s-3) var(--s-4); background: var(--bg-elevated);
    border: 1px solid var(--border-subtle); border-radius: var(--r-md);
    color: var(--text-primary); font-size: var(--fs-md); transition: border-color var(--dur-fast);
}
.lp-foot-news-input:focus { outline: none; border-color: var(--brand-500, #4F46E5); }
.lp-foot-news-btn {
    padding: var(--s-3) var(--s-5);
    background: var(--brand-500, #4F46E5); color: #fff;
    border: 0; border-radius: var(--r-md); font-weight: var(--fw-medium);
    cursor: pointer; transition: filter var(--dur-fast); font-size: var(--fs-md);
}
.lp-foot-news-btn:hover { filter: brightness(1.08); }
.lp-foot-col-grid-mega { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
.lp-foot-mega .lp-foot-mega-bottom {
    padding-block: var(--s-5);
    border-block-start: 1px solid var(--border-subtle);
    display: flex; align-items: center; gap: var(--s-6); flex-wrap: wrap;
}
.lp-foot-mega .lp-foot-mega-bottom .lp-foot-social { margin-inline-start: auto; }

/* ── Branded — gradient bg, oversized brand, no shy energy ── */
.lp-foot-branded { position: relative; overflow: hidden; padding-block: var(--s-16); border: 0; margin-block-start: var(--s-16); }
.lp-foot-branded-bg {
    position: absolute; inset: 0;
    background:
        radial-gradient(ellipse at top left, rgba(79,70,229,0.18), transparent 60%),
        radial-gradient(ellipse at bottom right, rgba(139,92,246,0.18), transparent 60%),
        linear-gradient(180deg, var(--bg-base), var(--bg-sunken, var(--bg-base)));
    pointer-events: none;
}
[data-theme="light"] .lp-foot-branded-bg {
    background:
        radial-gradient(ellipse at top left, rgba(79,70,229,0.10), transparent 60%),
        radial-gradient(ellipse at bottom right, rgba(139,92,246,0.08), transparent 60%),
        linear-gradient(180deg, var(--bg-raised), var(--bg-inset));
}
.lp-foot-branded-inner {
    position: relative;
    display: flex; flex-direction: column; align-items: center; gap: var(--s-6);
    text-align: center;
}
.lp-foot-branded-tagline {
    font-size: clamp(28px, 4vw, 48px); font-weight: 600;
    letter-spacing: -0.02em; line-height: 1.1; max-inline-size: 720px;
    background: linear-gradient(135deg, var(--brand-400, #6366f1), var(--violet-500, #8B5CF6));
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent;
    margin: var(--s-4) 0 var(--s-2);
}
.lp-foot-links-branded { display: flex; gap: var(--s-7); flex-wrap: wrap; justify-content: center; font-size: var(--fs-md); }
.lp-foot-social-branded { margin-block-start: var(--s-3); }
.lp-foot-copy-branded { margin-block-start: var(--s-7); }

/* Responsive collapse — every multi-column variant stacks under 720px. */
@media (max-width: 720px) {
    .lp-foot-columns .lp-foot-cols,
    .lp-foot-mega .lp-foot-mega-top { grid-template-columns: 1fr; gap: var(--s-8); }
}