:root {
    --bg-color: #f5eedf;
    --accent-dark: #3a2312;
    --accent-red: #822216;
    --text-main: #4a3e35;
    --card-bg: #fbf8f3;
    --gold-border: #dfccaf;
    --gold-accent: #c4a275;
}

@font-face {
    font-family: 'Ma Shan Zheng';
    src: url('/fonts/MaShanZheng/MaShanZheng-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-family: 'Segoe UI', Roboto, Helvetica, sans-serif;
    color: var(--text-main);
    line-height: 1.4;
    background-image: url('/images/adminca/paper-texture.jpg');
    background-repeat: repeat;
    background-attachment: scroll;
    background-position: top center;
    background-size: cover;
}
body::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 100%;
    /*background: url(/images/cabinet.jpg) top center no-repeat;*/
    background-size: 100% auto;
    opacity: .45;
    pointer-events: none;
    z-index: 999999;
}
main {
    overflow-x: auto;
}
a {
    color: inherit;
    text-decoration: none;
    transition:
        color .18s ease,
        background-color .18s ease,
        border-color .18s ease,
        box-shadow .18s ease,
        text-shadow .18s ease,
        opacity .18s ease,
        filter .18s ease,
        transform .18s ease;
}

@media (hover: hover) {
    a[href]:hover {
        color: #8b2a1d;
        text-shadow: 0 1px 0 rgba(255, 245, 222, .38);
    }
}
h1, h2, h3, h4, h5, h6 {
    text-align: center;
    font-weight: 700;
    line-height: 1.18;
}
h1 { font-size: 17px; }
h2 { font-size: 15px; }
h3 { font-size: 13px; }
h4 { font-size: 13px; }
h5 { font-size: 12px; }
h6 { font-size: 11px; }
/* --- HEADER --- */
.main-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 60px;
    background-color: #161616;
    color: #fff;
}

.logo {
    display: flex;
    flex-direction: column;
}

.asian-font {
    font-family: 'Ma Shan Zheng', 'Georgia', serif;
    font-size: 24px;
    letter-spacing: 2px;
    color: var(--gold-accent);
}

.red-seal-box {
    width: min-content;
    font-family: 'Ma Shan Zheng', 'Georgia', serif;
    position: relative;
    border: 2px solid #ad463b;
    border-radius: 3px;
    color: #ad463b;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    padding: 1px 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    letter-spacing: 1px;
    background:
        radial-gradient(circle at 25% 18%, rgba(130, 34, 22, .08), transparent 18%),
        radial-gradient(circle at 78% 70%, rgba(130, 34, 22, .06), transparent 16%),
        rgba(255, 247, 231, .18);
    box-shadow:
        inset 0 0 0 1px rgba(130, 34, 22, .18),
        0 1px 0 rgba(130, 34, 22, .18);
}

.red-seal-box span {
    display: block;
    transform: scaleX(1.3);
    transform-origin: center;
    padding-right: 1px;
    line-height: .6;
    letter-spacing: -1px;
    text-shadow:
        .25px 0 currentColor,
        0 .25px currentColor;
    -webkit-text-stroke: .15px currentColor;
}

.logo-sub {
    font-size: 9px;
    letter-spacing: 3px;
    color: #7c7c7c;
    margin-top: 2px;
}

.top-nav a {
    color: #b0b0b0;
    margin: 0 16px;
    font-size: 10px;
    font-weight: bold;
    letter-spacing: 1px;
}

.top-nav a:hover {
    color: var(--gold-accent);
}

.header-right {
    display: flex;
    align-items: center;
    gap: 20px;
    font-size: 13px;
    color: #b0b0b0;
}

.btn-lk {
    border: 1px solid var(--gold-accent);
    color: var(--gold-accent);
}

/* --- LAYOUT --- */
.dashboard-container {
    display: grid;
    grid-template-columns: 250px 1fr;
    align-items: stretch;
    position: relative;
}

.dashboard-container:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 650px;
    z-index: -1;
    background-image: url('/images/adminca/mountains_bg_2.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: top right;
    background-size: 100% auto;
    -webkit-mask-image:
        linear-gradient(to bottom, rgba(0,0,0,1) 50%, rgba(0,0,0,0) 95%),
        linear-gradient(to left, rgba(0,0,0,1) 50%, rgba(0,0,0,0) 95%),
        linear-gradient(to left bottom, rgba(0,0,0,1) 30%, rgba(0,0,0,0) 90%);
    -webkit-mask-composite: source-in;
    mask-composite: intersect;
    mask-image:
        linear-gradient(to bottom, rgba(0,0,0,1) 50%, rgba(0,0,0,0) 95%),
        linear-gradient(to left, rgba(0,0,0,1) 50%, rgba(0,0,0,0) 95%),
        linear-gradient(to left bottom, rgba(0,0,0,1) 30%, rgba(0,0,0,0) 90%);
    pointer-events: none;
}

.dashboard-container:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 400px;
    height: 260px;
    z-index: -1;
    background-image: url('/images/adminca/footer_bg_0.png');
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: 100% auto;
    -webkit-mask-image:
        linear-gradient(to top, rgba(0,0,0,1) 50%, rgba(0,0,0,0) 95%),
        linear-gradient(to left, rgba(0,0,0,1) 50%, rgba(0,0,0,0) 95%),
        linear-gradient(to left top, rgba(0,0,0,1) 30%, rgba(0,0,0,0) 90%);
    -webkit-mask-composite: source-in;
    mask-composite: intersect;
    mask-image:
        linear-gradient(to top, rgba(0,0,0,1) 50%, rgba(0,0,0,0) 95%),
        linear-gradient(to left, rgba(0,0,0,1) 50%, rgba(0,0,0,0) 95%),
        linear-gradient(to left top, rgba(0,0,0,1) 30%, rgba(0,0,0,0) 90%);
    pointer-events: none;
}

/* --- SIDEBAR --- */
.sidebar {
    border: 1px solid var(--gold-border);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    margin-left: 35px;
    margin-top: 18px;
}

.sidebar-top-content {
    flex-shrink: 0;
}

.sidebar-title {
    font-size: 12px;
    font-weight: bold;
    letter-spacing: 1px;
    color: var(--accent-dark);
    padding: 14px 20px 10px;
    text-transform: uppercase;
}

.side-nav {
    display: flex;
    flex-direction: column;
    padding: 6px 12px;
}

.side-nav a {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 4px 12px;
    font-size: 13px;
    color: #5c4f45;
    text-decoration: none;
    transition: all 0.2s;
}

.side-icon {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    background-color: #9b7a45;
    -webkit-mask: var(--icon) center / contain no-repeat;
    mask: var(--icon) center / contain no-repeat;
    transition: background-color .2s;
}

.icon-home { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M3 10.5 12 3l9 7.5v2h-2V21H5v-8.5H3v-2Zm5 8.5h3v-5h2v5h3v-8.7l-4-3.3-4 3.3V19Z'/%3E%3Cpath fill='%23000' d='M7 9h10v2H7z'/%3E%3C/svg%3E"); }
.icon-learning { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 3 2 8l10 5 8-4v6h2V8L12 3Zm0 12L5 11.5V16c0 2.2 3.1 4 7 4s7-1.8 7-4v-4.5L12 15Z'/%3E%3C/svg%3E"); }
.icon-practice { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 4a3 3 0 1 1 0 6 3 3 0 0 1 0-6Zm-4 8h8l1.8 7H20v2h-6v-4h-4v4H4v-2h2.2L8 12Zm1.6 2-.8 3h6.4l-.8-3H9.6Z'/%3E%3C/svg%3E"); }
.icon-calendar { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M7 2h2v3h6V2h2v3h3v17H4V5h3V2Zm11 8H6v10h12V10ZM6 7v2h12V7H6Zm2 5h2v2H8v-2Zm4 0h2v2h-2v-2Zm4 0h2v2h-2v-2ZM8 16h2v2H8v-2Zm4 0h2v2h-2v-2Z'/%3E%3C/svg%3E"); }
.icon-progress { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M4 19h16v2H2V3h2v16Zm2-2 4-6 4 3 5-8 1.7 1-6.1 9.8-4-3-3 4.2H6Z'/%3E%3C/svg%3E"); }
.icon-library { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M4 4h7a3 3 0 0 1 3 3v13a3 3 0 0 0-3-3H4V4Zm16 0v13h-7a3 3 0 0 0-3 3V7a3 3 0 0 1 3-3h7Z'/%3E%3C/svg%3E"); }
.icon-archive { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M4 4h16v5H4V4Zm2 7h12v9H6v-9Zm3 2v2h6v-2H9ZM6 6v1h12V6H6Z'/%3E%3C/svg%3E"); }
.icon-club { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2.5 8.2 5.2h7.6L12 2.5ZM5.5 6l1.2 1.7h10.6L18.5 6h-13Zm3 2.6h7v2.5h-7V8.6ZM4.5 12l1.4 1.8h12.2l1.4-1.8h-15Zm3.3 2.7h8.4v3.1H7.8v-3.1ZM3.5 18.7l1.6 1.8h13.8l1.6-1.8h-17ZM9.2 15.6h1.7v2.2H9.2v-2.2Zm3.9 0h1.7v2.2h-1.7v-2.2Z'/%3E%3C/svg%3E"); }
.icon-community { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M8 11a3 3 0 1 1 0-6 3 3 0 0 1 0 6Zm8 0a3 3 0 1 1 0-6 3 3 0 0 1 0 6ZM3 20c.3-3.4 2.4-6 5-6s4.7 2.6 5 6H3Zm8 0c.2-2.1 1.1-4 2.4-5.2A4 4 0 0 1 16 14c2.6 0 4.7 2.6 5 6H11Z'/%3E%3C/svg%3E"); }
.icon-messages { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M3 5h18v13H8l-5 4V5Zm3 3 6 4 6-4v2l-6 4-6-4V8Z'/%3E%3C/svg%3E"); }
.icon-requests { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M7 2h10l4 4v16H3V2h4Zm8 2H5v16h14V8h-4V4Zm1 1.4V7h1.6L16 5.4ZM7 9h10v2H7V9Zm0 4h10v2H7v-2Zm0 4h6v2H7v-2Z'/%3E%3C/svg%3E"); }
.icon-favorite { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m12 2.8 2.7 5.6 6.1.9-4.4 4.3 1 6.1-5.4-2.9-5.4 2.9 1-6.1-4.4-4.3 6.1-.9L12 2.8Zm0 4.5-1.4 2.9-3.2.5 2.3 2.3-.5 3.2 2.8-1.5 2.8 1.5-.5-3.2 2.3-2.3-3.2-.5L12 7.3Z'/%3E%3C/svg%3E"); }
.icon-downloads { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M11 3h2v10l3-3 1.4 1.4L12 16.8l-5.4-5.4L8 10l3 3V3ZM5 19h14v2H5v-2Z'/%3E%3C/svg%3E"); }
.icon-settings { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m19.4 13.5 1.6 1-2 3.5-1.8-.7a7 7 0 0 1-1.7 1l-.3 1.9h-4l-.3-1.9a7 7 0 0 1-1.7-1l-1.8.7-2-3.5 1.6-1a7 7 0 0 1 0-2l-1.6-1 2-3.5 1.8.7a7 7 0 0 1 1.7-1l.3-1.9h4l.3 1.9a7 7 0 0 1 1.7 1l1.8-.7 2 3.5-1.6 1a7 7 0 0 1 0 2ZM13 15.5a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3C/svg%3E"); }
.icon-profile { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 12a4 4 0 1 1 0-8 4 4 0 0 1 0 8Zm-8 9c.5-4.4 3.7-7 8-7s7.5 2.6 8 7H4Z'/%3E%3C/svg%3E"); }
.icon-logout { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M4 3h10v4h-2V5H6v14h6v-2h2v4H4V3Zm12.6 4.6L21 12l-4.4 4.4-1.4-1.4 2-2H10v-2h7.2l-2-2 1.4-1.4Z'/%3E%3C/svg%3E"); }

.side-nav a.active,
.side-nav a:hover {
    color: var(--accent-red);
    background-color: #f1e9da;
    font-weight: bold;
}

.side-nav a.active .side-icon,
.side-nav a:hover .side-icon {
    background-color: var(--accent-red);
}
.sidebar-decor {
    position: relative;
    flex: 1;
    display: flex;
    align-items: flex-start;
    line-height: 0;
    margin-bottom: 20px;
    padding: 20px 6px;
}

.sidebar-art {
    position: sticky;
    top: 10%;
    width: 100%;
    line-height: 0;
}

.warrior-img {
    position: relative;
    width: 100%;
    height: auto;
    display: block;
    -webkit-mask-image:
        linear-gradient(to right, transparent 0, #000 3%, #000 97%, transparent 100%),
        linear-gradient(to bottom, transparent 0, #000 8%, #000 78%, transparent 100%);
    -webkit-mask-composite: source-in;
    mask-image:
        linear-gradient(to right, transparent 0, #000 3%, #000 97%, transparent 100%),
        linear-gradient(to bottom, transparent 0, #000 8%, #000 78%, transparent 100%);
    mask-composite: intersect;
}

.sidebar-inscription {
    position: absolute;
    top: 4px;
    right: 9px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    pointer-events: none;
}

.sidebar-calligraphy {
    color: #322b20;
    font-family: 'Ma Shan Zheng', 'Georgia', serif;
    font-size: 24px;
    line-height: 1.08;
    text-align: center;
    text-shadow: 0 1px 0 rgba(255, 245, 222, .45);
}

.lang-cn {
    font-family: 'Ma Shan Zheng', 'Georgia', serif;
}

.page_content .border_section.card {
    max-width: 800px;
    margin: auto;
    margin-bottom: 20px;
}
.page_content .border_section {
    padding: 40px;
}

.page_content ul {
    padding-left: 40px;
    margin: 10px auto;
}

.page_content .header {
    margin: 30px auto;
}

.page_content h2 {
    margin: 20px auto;
    padding-top: 20px;
    border-top: 1px solid;
}
.page_content strong {
    color: #8b1f14;
}
.page_content p {
    margin-bottom: 20px;
}
.doctrine-article .header h1 {
    font-size: 24px;
    color: #8b1f14;
}

.page_content p.subtitle {
    text-align: right;
    margin-right: 9%;
    margin-top: 20px;
}

.page_content blockquote {
    margin: 20px auto;
    font-weight: 600;
    color: #8b1f14;
    font-style: italic;
}

/* --- MAIN CONTENT --- */
.main-content {
    margin: 20px 30px;
    box-sizing: border-box;
}

.main-content > section {
    margin: 14px 0;
    background: rgba(239, 219, 184, .34);
    box-shadow: 0 10px 30px rgba(64, 39, 18, .08);
}
.main-content > section:first-child {
    margin-top: 0;
    padding-left: 10px;
    background: none;
    box-shadow: none;
}
.card {
    background: rgba(239, 219, 184, .34);
    box-shadow: 0 10px 30px rgba(64, 39, 18, .08);
}
.border_section, .card.border_section {
    border-image-source: url(/images/dao/borders/gold-border.png);
    border-image-slice: 75 fill;
    border-image-width: 30px;
    border-image-repeat: stretch;
}
button,
.button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    padding: 7px 20px;
    font-size: 10px;
    letter-spacing: 1px;
    cursor: pointer;
    border-radius: 5px;
    transition:
        background-color .18s ease,
        border-color .18s ease,
        color .18s ease,
        box-shadow .18s ease,
        transform .18s ease,
        filter .18s ease;
    overflow: hidden;
    text-decoration: none;
}
button.btn-lk:before,
.button.btn-lk:before {
    display: none;
}
button.btn-sm-primary:before,
button.btn-primary:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: '';
    border-image-source: url(/images/dao/borders/gold-border.png);
    border-image-slice: 68 fill;
    border-image-width: 6px;
    border-image-repeat: stretch;
}

.btn-lk {
    transition:
        background-color .18s ease,
        border-color .18s ease,
        color .18s ease,
        box-shadow .18s ease,
        transform .18s ease;
}

@media (hover: hover) {
    button:not(:disabled):hover,
    .button:hover,
    .btn-lk:hover {
        transform: translateY(-1px);
        border-color: rgba(216, 176, 110, .86);
        color: var(--gold-accent);
        background-color: rgba(216, 176, 110, .08);
        box-shadow:
            0 5px 14px rgba(58, 35, 16, .12),
            inset 0 0 0 1px rgba(255, 244, 214, .16);
        filter: saturate(1.04);
        text-shadow: none;
    }

    button:not(:disabled):active,
    .button:active,
    .btn-lk:active {
        transform: translateY(0);
        box-shadow: 0 2px 8px rgba(58, 35, 16, .1);
    }

    a.button.btn-lk[href]:hover {
        color: var(--gold-accent);
        text-shadow: none;
    }
}

/* --- FOOTER --- */
.main-footer {
    display: grid;
    grid-template-columns: auto minmax(560px, 1fr) auto;
    align-items: center;
    gap: 40px;
    background: linear-gradient(180deg, #101111 0%, #0d0e0e 100%);
    color: #9a9184;
    padding: 12px 20px;
    font-size: 12px;
    border-top: 1px solid rgba(196, 162, 117, .18);
}

.main-footer .logo {
    align-items: flex-start;
}

.main-footer .asian-font {
    font-size: 24px;
    line-height: .9;
    color: #d8b06e;
}

.main-footer .logo-sub {
    color: #b9aa93;
    font-size: 10px;
    letter-spacing: 3px;
    margin-top: 7px;
}

.footer-brand {
    display: flex;
    justify-content: flex-start;
}

.footer-center {
    display: flex;
    flex-direction: column;
    gap: 9px;
    min-width: 0;
}

.footer-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
}

.footer-nav a {
    position: relative;
    color: #c7b89d;
    margin-left: 0;
    padding: 0 12px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .5px;
    white-space: nowrap;
}

.footer-nav a:hover {
    color: var(--gold-accent);
}

.footer-nav a:not(:last-child)::after {
    content: '/';
    position: absolute;
    right: -7px;
    top: 0;
    color: rgba(199, 184, 157, .42);
}

.footer-links {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 26px;
}

.footer-links a {
    color: #a89983;
    margin-right: 0;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

.footer-links a:hover {
    color: var(--gold-accent);
}

.social-icons {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 26px;
}

.social-icons a {
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #d8b06e;
}

.social-icons a:hover {
    color: #f1d19b;
    transform: translateY(-1px);
    filter: drop-shadow(0 2px 5px rgba(216, 176, 110, .22));
}

.footer-social-icon {
    width: 20px;
    height: 20px;
    display: block;
    background-color: currentColor;
    -webkit-mask: var(--footer-social-icon) center / contain no-repeat;
    mask: var(--footer-social-icon) center / contain no-repeat;
}

.footer-icon-youtube {
    --footer-social-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M21.6 7.2a3 3 0 0 0-2.1-2.1C17.6 4.6 12 4.6 12 4.6s-5.6 0-7.5.5a3 3 0 0 0-2.1 2.1A31 31 0 0 0 1.9 12c0 1.6.1 3.2.5 4.8a3 3 0 0 0 2.1 2.1c1.9.5 7.5.5 7.5.5s5.6 0 7.5-.5a3 3 0 0 0 2.1-2.1c.4-1.6.5-3.2.5-4.8s-.1-3.2-.5-4.8ZM10 15.6V8.4l6 3.6-6 3.6Z'/%3E%3C/svg%3E");
}

.footer-icon-telegram {
    --footer-social-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M21.7 3.4 18.4 20c-.2.9-.8 1.1-1.6.7l-5-3.7-2.4 2.3c-.3.3-.5.5-1 .5l.4-5.1 9.3-8.4c.4-.4-.1-.6-.6-.3L6 13.2 1.1 11.7c-.9-.3-.9-.9.2-1.3L20.1 3c.8-.3 1.7.2 1.6.4Z'/%3E%3C/svg%3E");
}

.footer-icon-instagram {
    --footer-social-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M7.4 2h9.2A5.4 5.4 0 0 1 22 7.4v9.2a5.4 5.4 0 0 1-5.4 5.4H7.4A5.4 5.4 0 0 1 2 16.6V7.4A5.4 5.4 0 0 1 7.4 2Zm0 2A3.4 3.4 0 0 0 4 7.4v9.2A3.4 3.4 0 0 0 7.4 20h9.2a3.4 3.4 0 0 0 3.4-3.4V7.4A3.4 3.4 0 0 0 16.6 4H7.4ZM12 7.3a4.7 4.7 0 1 1 0 9.4 4.7 4.7 0 0 1 0-9.4Zm0 2a2.7 2.7 0 1 0 0 5.4 2.7 2.7 0 0 0 0-5.4Zm5-2.8a1.1 1.1 0 1 1 0 2.2 1.1 1.1 0 0 1 0-2.2Z'/%3E%3C/svg%3E");
}

@media (max-width: 960px) {
    .footer-links {
        gap: 10px;
    }
}

@media (max-width: 860px) {
    .footer-links {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .footer-links a {
        text-align: center;
    }
    .main-footer {
        gap: 5px;
    }
}
@media (max-width: 760px) {
    .footer-links {
        width: 100%;
        max-width: 100%;
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 18px;
        padding: 26px 18px 28px;
        text-align: center;
        overflow: hidden;
    }

    .footer-brand,
    .social-icons {
        justify-content: center;
    }

    .footer-center {
        width: 100%;
        align-items: center;
        gap: 14px;
    }

    .footer-nav,
    .footer-links {
        width: 100%;
        justify-content: center;
        flex-wrap: wrap;
        gap: 10px 14px;
    }

    .footer-nav a,
    .footer-links a {
        white-space: normal;
        padding: 0;
        margin: 0;
        line-height: 1.45;
    }

    .footer-nav a:not(:last-child)::after {
        display: none;
    }

    .social-icons {
        gap: 18px;
    }
}

@media (max-width: 420px) {
    .main-footer {
        padding-left: 14px;
        padding-right: 14px;
    }

    .footer-links {
        flex-direction: column;
        gap: 8px;
    }
}
