/*
 * PICKME newd2 — site-wide modern design foundation.
 *
 * This additive layer modernises shared frontend components. Catalogue and
 * profile-specific layers remain separate and load after this file.
 * Rollback: remove the site-modern.css links from layouts/main.php and map.php.
 */

:root {
    --site-bg: #08080b;
    --site-panel: #111117;
    --site-panel-soft: #17171f;
    --site-control: #1c1c24;
    --site-line: rgba(255, 255, 255, 0.09);
    --site-line-strong: rgba(255, 255, 255, 0.15);
    --site-pink: #ff2f92;
    --site-pink-soft: #ff69ad;
    --site-purple: #955cff;
    --site-text: #f8f6f9;
    --site-muted: #afaab5;
    --site-success: #63d47b;
    --site-danger: #ff6b82;
}

html {
    min-width: 320px;
    color-scheme: dark;
    background: var(--site-bg);
}

body {
    min-width: 320px;
    color: var(--site-text);
    background:
        radial-gradient(circle at 12% 7%, rgba(255, 47, 146, 0.085), transparent 28rem),
        radial-gradient(circle at 90% 15%, rgba(149, 92, 255, 0.065), transparent 30rem),
        var(--site-bg);
    font-family:
        Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI",
        sans-serif;
    -webkit-font-smoothing: antialiased;
}

body a {
    color: var(--site-pink-soft);
    transition:
        color 150ms ease,
        background-color 150ms ease,
        border-color 150ms ease,
        opacity 150ms ease;
}

body a:hover,
body a:focus {
    color: #fff;
}

body img {
    max-width: 100%;
}

.main_header {
    position: relative;
    z-index: 120;
    height: auto;
    min-height: 94px;
    padding: 0 !important;
    background: rgba(8, 8, 11, 0.88);
    border-bottom: 1px solid var(--site-line);
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.18);
    backdrop-filter: blur(18px);
}

.main_header > .container,
body > nav > .container,
#main > .container,
footer > .container,
#copyright > .container {
    width: min(1240px, calc(100% - 48px));
    max-width: 1240px;
}

.main_header .row {
    display: flex;
    align-items: center;
    min-height: 94px;
}

.main_header .logo {
    display: flex;
    align-items: center;
    height: auto;
    margin: 0;
}

.main_header .logo img {
    display: block;
    width: 218px;
    max-width: 100%;
    height: auto;
}

.main_header .tags,
.main_header .tag {
    height: auto !important;
    margin: 0 !important;
}

.main_header .desktop_form,
.main_header .search-form,
.main_header #SearchForm {
    width: 100%;
    padding: 0;
    margin: 0;
}

.main_header #search_key {
    width: 100%;
    height: 44px;
    padding: 0 52px 0 17px;
    color: var(--site-text);
    background: rgba(255, 255, 255, 0.055);
    border: 1px solid var(--site-line-strong);
    border-radius: 12px;
    outline: none;
}

.main_header #search_key:focus {
    border-color: rgba(255, 47, 146, 0.7);
    box-shadow: 0 0 0 4px rgba(255, 47, 146, 0.11);
}

.main_header #serch_submit {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 36px;
    height: 36px !important;
    background-color: var(--site-pink);
    border: 0;
    border-radius: 9px;
    opacity: 1;
}

#header_right_menu {
    display: flex;
    gap: 7px;
    align-items: center;
}

#header_right_menu > a,
#header_right_menu > .tag > a {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 0 10px;
    font-size: 13px;
    font-weight: 650;
    color: #d8d4dc;
    text-decoration: none;
    border-radius: 10px;
}

#header_right_menu > a:hover,
#header_right_menu > .tag > a:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.06);
}

#header_right_menu .auth {
    min-width: 0 !important;
    margin-left: 5px;
}

#header_right_menu .auth .orange-btn {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    min-width: 116px;
    height: 42px;
    padding: 0 17px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: #fff;
    text-transform: uppercase;
    background: linear-gradient(135deg, var(--site-pink), #df176f);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 11px;
    box-shadow: 0 9px 24px rgba(255, 47, 146, 0.22);
}

body > nav {
    position: relative;
    z-index: 110;
    height: auto;
    padding: 13px 0;
    background: rgba(11, 11, 15, 0.88);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(14px);
}

body > nav .url ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0;
    margin: 0;
}

body > nav .url li {
    float: none;
    width: auto;
    margin: 0;
    list-style: none;
}

body > nav .url a {
    display: inline-flex;
    gap: 5px;
    align-items: center;
    min-height: 38px;
    padding: 0 16px;
    font-size: 13px;
    font-weight: 650;
    color: #bbb6c1;
    text-decoration: none;
    background: rgba(255, 255, 255, 0.035);
    border: 1px solid rgba(255, 255, 255, 0.065);
    border-radius: 999px;
}

body > nav .url a:hover {
    color: #fff;
    background: rgba(255, 47, 146, 0.1);
    border-color: rgba(255, 47, 146, 0.34);
}

body > nav .url span {
    color: #7d7883;
}

#mobile_menu {
    color: var(--site-text);
    background: rgba(12, 12, 17, 0.98);
}

#mobile_menu .mobile_menu_block {
    background: transparent;
}

#mobile_menu a {
    color: #ddd9e1;
}

#mobile_menu .mobile_menu_block_search_field_block input {
    color: var(--site-text);
    background: var(--site-control);
    border: 1px solid var(--site-line-strong);
    border-radius: 10px;
}

#main {
    position: relative;
    min-height: 70vh;
    padding: 0 0 76px;
    color: var(--site-text);
    background:
        radial-gradient(circle at 15% 2%, rgba(255, 47, 146, 0.07), transparent 27rem),
        radial-gradient(circle at 90% 11%, rgba(112, 75, 255, 0.055), transparent 29rem);
}

#main > .container {
    position: relative;
    padding-top: 42px;
}

#main .crubms,
#main .crubms .page {
    padding: 0;
    margin: 0;
}

#main .crubms h1,
#main > .container > .h1,
#main > .container > .h2 .page,
#main > .container > .h2 h1 {
    display: block;
    max-width: 900px;
    padding: 0;
    margin: 0 !important;
    font-family: inherit;
    font-size: clamp(31px, 3vw, 46px);
    font-weight: 800;
    line-height: 1.06;
    letter-spacing: -0.035em;
    color: #fff;
    text-transform: none;
}

#main .crubms h1::after,
#main > .container > .h1::after,
#main > .container > .h2 .page::after,
#main > .container > .h2 h1::after {
    display: block;
    width: 62px;
    height: 4px;
    margin-top: 16px;
    content: "";
    background: linear-gradient(90deg, var(--site-pink), var(--site-purple));
    border-radius: 999px;
}

#main .content,
#main .articlebox {
    padding: 30px 32px;
    margin: 0 0 24px;
    color: #d4d0d8;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.022), transparent 44%),
        var(--site-panel);
    border: 1px solid var(--site-line);
    border-radius: 18px;
    box-shadow: 0 16px 42px rgba(0, 0, 0, 0.28);
}

#main .content > .head,
#main .articlebox > .head {
    padding: 0 0 15px;
    font-family: inherit;
    font-size: 24px;
    font-weight: 800 !important;
    line-height: 1.2;
    color: var(--site-text);
    border-bottom: 1px solid var(--site-line);
}

#main .content .desc,
#main .articlebox .desc {
    font-size: 14px;
    line-height: 1.7;
    color: #ccc8d1;
}

#main .content h1,
#main .articlebox h1,
#main .content h2,
#main .articlebox h2,
#main .content h3,
#main .articlebox h3,
#main .content h4,
#main .articlebox h4 {
    font-family: inherit;
    font-weight: 800;
    line-height: 1.2;
    color: var(--site-text);
}

#main .content h1,
#main .articlebox h1 {
    margin: 0 0 24px;
    font-size: clamp(27px, 3vw, 39px);
    letter-spacing: -0.025em;
}

#main .content h2,
#main .articlebox h2 {
    margin: 26px 0 16px;
    font-size: 22px;
}

#main .content p,
#main .articlebox p,
#main .content li,
#main .articlebox li {
    color: #c8c4cd;
}

#main .content .header {
    padding: 16px 0 7px;
    font-size: 18px;
    font-weight: 750;
    line-height: 1.35;
    color: var(--site-text);
    border-top: 1px solid var(--site-line);
}

#main .content .header:first-child {
    padding-top: 0;
    border-top: 0;
}

#main .content .header a {
    color: var(--site-text);
    text-decoration: none;
}

#main .content .header a:hover {
    color: var(--site-pink-soft);
}

#main .moreandmore,
#main .registrbuttona {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 13px !important;
    color: #fff;
    text-decoration: none;
    background: rgba(255, 47, 146, 0.12);
    border: 1px solid rgba(255, 47, 146, 0.36);
    border-radius: 10px !important;
}

#main .moreandmore a {
    color: #fff;
    text-decoration: none;
}

#LoginForm,
#FeedbackForm,
#main .password_recovery {
    width: 100%;
    max-width: 560px;
}

#main .password_recovery > .col-md-6 {
    float: none;
    width: 100%;
    padding: 0;
}

#RegistrationForm {
    width: 100%;
}

#main form .control-group {
    margin-bottom: 18px;
}

#main form .controls {
    position: relative;
}

#main form label {
    display: inline-block;
    margin: 0 0 7px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
    color: #c9c5ce;
}

#main form label .required,
#main form span.required {
    color: var(--site-pink-soft);
}

#main form input[type="text"],
#main form input[type="password"],
#main form input[type="email"],
#main form input[type="tel"],
#main form input[type="url"],
#main form input[type="number"],
#main form input[type="search"],
#main form select,
#main form textarea,
#main .input_form {
    width: 100%;
    max-width: 560px;
    min-height: 44px;
    padding: 10px 13px;
    box-sizing: border-box;
    font-family: inherit;
    font-size: 14px;
    line-height: 1.4;
    color: var(--site-text);
    background: var(--site-control);
    border: 1px solid var(--site-line-strong);
    border-radius: 11px;
    outline: none;
    box-shadow: none;
}

#RegistrationForm input[type="text"],
#RegistrationForm input[type="password"],
#RegistrationForm input[type="email"],
#RegistrationForm input[type="tel"],
#RegistrationForm select,
#RegistrationForm textarea {
    max-width: 100%;
}

#main form textarea {
    min-height: 120px;
    resize: vertical;
}

#FeedbackForm textarea {
    width: 100% !important;
    background: var(--site-control) !important;
}

#main form input:focus,
#main form select:focus,
#main form textarea:focus {
    border-color: rgba(255, 47, 146, 0.68);
    box-shadow: 0 0 0 4px rgba(255, 47, 146, 0.1);
}

#main form input::placeholder,
#main form textarea::placeholder {
    color: #78737e;
}

#main form select option {
    color: var(--site-text);
    background: var(--site-panel-soft);
}

#main form input[type="checkbox"],
#main form input[type="radio"] {
    accent-color: var(--site-pink);
}

#main .inputShowPwd .showEle {
    filter: invert(1);
    opacity: 0.64;
}

#main .form-actions {
    padding: 20px 0 0;
    margin: 8px 0 0;
    background: transparent;
    border: 0;
}

#main input[type="submit"],
#main button[type="submit"],
#main .form-actions button,
#main .orange-btn,
#main .green-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 150px;
    height: 44px;
    padding: 0 18px !important;
    box-sizing: border-box;
    font-family: inherit;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.035em;
    color: #fff !important;
    text-decoration: none;
    text-transform: uppercase;
    cursor: pointer;
    background: linear-gradient(135deg, var(--site-pink), #df176f) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 11px !important;
    box-shadow: 0 10px 25px rgba(255, 47, 146, 0.2);
}

#main input[type="submit"]:hover,
#main button[type="submit"]:hover,
#main .form-actions button:hover,
#main .orange-btn:hover,
#main .green-btn:hover {
    filter: brightness(1.08);
    transform: translateY(-1px);
}

#RegistrationForm .form-check-inline {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px;
    margin: 0 0 20px;
}

#RegistrationForm .customradio {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 48px;
    padding: 0 13px;
    margin: 0;
    color: #d7d3db;
    background: rgba(255, 255, 255, 0.035);
    border: 1px solid var(--site-line);
    border-radius: 11px;
    cursor: pointer;
}

#RegistrationForm .customradio:has(input:checked) {
    color: #fff;
    background: rgba(255, 47, 146, 0.13);
    border-color: rgba(255, 47, 146, 0.5);
}

#RegistrationForm .customradio .checkmark {
    position: relative;
    top: auto;
    left: auto;
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin-left: auto;
    background: transparent;
    border-color: rgba(255, 255, 255, 0.34);
}

#RegistrationForm .customradio input:checked ~ .checkmark {
    background: transparent;
    border-color: var(--site-pink);
}

#RegistrationForm .customradio .checkmark::after {
    width: 8px;
    height: 8px;
    margin-top: -4px;
    margin-left: -4px;
    background: var(--site-pink);
}

#RegistrationForm .radiotextsty {
    font-size: 13px;
    line-height: 1.25;
}

#RegistrationForm .row {
    margin-right: -8px;
    margin-left: -8px;
}

#RegistrationForm .row > [class*="col-"] {
    padding-right: 8px;
    padding-left: 8px;
}

#main .alert,
#main .errorSummary,
#main .custom-error,
#main .subscribe_notice {
    padding: 13px 15px;
    margin: 0 0 18px;
    font-family: inherit;
    font-size: 13px;
    line-height: 1.55;
    color: #ffd4db;
    background: rgba(255, 77, 107, 0.1);
    border: 1px solid rgba(255, 107, 130, 0.34);
    border-radius: 11px;
}

#main .alert-success,
#main .success {
    color: #d9ffe2;
    background: rgba(99, 212, 123, 0.1);
    border-color: rgba(99, 212, 123, 0.32);
}

#main .help-block,
#main .errorMessage {
    padding-top: 5px;
    font-size: 11px;
    color: var(--site-danger);
}

#main table {
    width: 100%;
    color: #d7d3db;
    background: rgba(255, 255, 255, 0.02);
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid var(--site-line);
    border-radius: 12px;
    overflow: hidden;
}

#main table th,
#main table td {
    padding: 11px 13px;
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

#main table th {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.045em;
    color: #f0edf2;
    text-transform: uppercase;
    background: rgba(255, 255, 255, 0.045);
}

#main table tr:last-child td {
    border-bottom: 0;
}

#main table tr:hover td {
    background: rgba(255, 255, 255, 0.025);
}

#main .pagination,
#main .pagination.cpagination {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    justify-content: center;
    padding: 10px;
    margin: 26px auto 0;
    background: var(--site-panel);
    border: 1px solid var(--site-line);
    border-radius: 14px;
}

#main .pagination a,
#main .pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    color: #c6c1ca;
    text-decoration: none;
    background: rgba(255, 255, 255, 0.035);
    border: 1px solid transparent;
    border-radius: 9px;
}

#main .pagination a:hover,
#main .pagination .current,
#main .pagination .active a {
    color: #fff;
    background: rgba(255, 47, 146, 0.14);
    border-color: rgba(255, 47, 146, 0.42);
}

#main .nav-tabs {
    border-bottom-color: var(--site-line);
}

#main .nav-tabs > li > a {
    color: var(--site-muted);
    background: rgba(255, 255, 255, 0.035);
    border-color: var(--site-line);
    border-radius: 9px 9px 0 0;
}

#main .nav-tabs > li.active > a,
#main .nav-tabs > li > a:hover {
    color: #fff;
    background: rgba(255, 47, 146, 0.12);
    border-color: rgba(255, 47, 146, 0.35);
}

.md-modal .md-content,
.modal-content,
.jquery-confirm .jconfirm-box {
    color: var(--site-text);
    background: var(--site-panel-soft);
    border: 1px solid var(--site-line-strong);
    border-radius: 16px;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.58);
}

.md-overlay,
.modal-backdrop,
.jquery-confirm .jconfirm-bg {
    background: rgba(0, 0, 0, 0.72);
    backdrop-filter: blur(5px);
}

footer {
    position: relative;
    padding: 42px 0 0;
    color: var(--site-muted);
    background:
        radial-gradient(circle at 15% 0, rgba(255, 47, 146, 0.075), transparent 24rem),
        #0c0c11;
    border-top: 1px solid var(--site-line);
}

footer > .container {
    display: flex;
    gap: 32px;
    align-items: center;
    min-height: 84px;
    padding-bottom: 35px;
}

footer .logo img {
    width: 180px;
    max-width: 180px !important;
    opacity: 0.8;
}

footer .link ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0;
    margin: 0;
}

footer .link li {
    list-style: none;
}

footer .link a {
    display: inline-flex;
    align-items: center;
    height: 38px;
    padding: 0 14px;
    font-size: 12px;
    font-weight: 650;
    color: #aaa5af;
    text-decoration: none;
    background: rgba(255, 255, 255, 0.035);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 10px;
}

footer .link a:hover {
    color: #fff;
    border-color: rgba(255, 47, 146, 0.3);
}

footer .pull-right {
    display: flex;
    gap: 20px;
    align-items: center;
    margin-left: auto;
}

footer .admin {
    font-size: 11px;
    color: #77727d;
}

footer .admin a {
    color: #c9c4cd;
}

footer #copyright,
body > #copyright {
    padding: 15px 0;
    font-size: 11px;
    color: #696570;
    background: rgba(0, 0, 0, 0.2);
    border-top: 1px solid rgba(255, 255, 255, 0.045);
}

/* Full-screen map layout */
body:has(.map-box__area) {
    overflow: hidden;
    background: var(--site-bg);
}

body:has(.map-box__area) .map-box__header {
    height: 72px;
    background: rgba(8, 8, 11, 0.94);
    border-bottom: 1px solid var(--site-line);
}

body:has(.map-box__area) .map-box__header-container,
body:has(.map-box__area) .map-box__top > .container {
    width: min(1240px, calc(100% - 32px));
    max-width: 1240px;
}

body:has(.map-box__area) .map-box__header-link {
    gap: 8px;
    font-size: 13px;
    color: #d8d4dc;
}

body:has(.map-box__area) .map-box__header-logo img {
    width: 170px;
    max-height: 48px;
    object-fit: contain;
}

body:has(.map-box__area) .map-box__top {
    background: rgba(13, 13, 18, 0.94);
    border-bottom: 1px solid var(--site-line);
    box-shadow: 0 12px 34px rgba(0, 0, 0, 0.32);
    backdrop-filter: blur(14px);
}

body:has(.map-box__area) .map-box__top-inner {
    min-height: 68px;
}

body:has(.map-box__area) .map-box__select {
    margin-right: 24px;
}

body:has(.map-box__area) .map-box__select-item {
    height: 42px;
    color: var(--site-text);
    background-color: var(--site-control);
    border: 1px solid var(--site-line-strong);
    border-radius: 10px;
}

body:has(.map-box__area) .map-box__checkbox {
    margin-right: 14px;
}

body:has(.map-box__area) .map-box__checkbox-label {
    font-size: 12px;
    color: #d4d0d8;
}

body:has(.map-box__area) .map-box__checkbox-checkmark::before {
    border-radius: 5px;
}

body:has(.map-box__area) .map-box__filter-burger,
body:has(.map-box__area) .map-box__location-btn {
    border: 1px solid var(--site-line-strong);
    border-radius: 10px;
    background-color: var(--site-control);
}

body:has(.map-box__area) .map-box__filter-burger:hover,
body:has(.map-box__area) .map-box__location-btn:hover {
    border-color: rgba(255, 47, 146, 0.52);
    background-color: rgba(255, 47, 146, 0.12);
}

body:has(.map-box__area) .map-box__marker-image,
body:has(.map-box__area) .map-box__agency-image {
    border: 2px solid rgba(255, 255, 255, 0.8);
    border-radius: 13px;
    box-shadow: 0 9px 24px rgba(0, 0, 0, 0.38);
}

body:has(.map-box__area) .map-box__marker-count {
    background: var(--site-pink);
    box-shadow: 0 5px 14px rgba(255, 47, 146, 0.34);
}

body:has(.map-box__area) .map-box__zoom-text {
    color: var(--site-text);
    background: rgba(17, 17, 23, 0.92);
    border: 1px solid var(--site-line-strong);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.38);
}

@media (max-width: 991px) {
    .main_header {
        min-height: 70px;
    }

    .main_header > .container,
    #main > .container,
    footer > .container,
    #copyright > .container {
        width: 100%;
        padding-right: 16px;
        padding-left: 16px;
    }

    .main_header .row {
        position: relative;
        min-height: 70px;
    }

    .main_header .row > div:first-child {
        width: 100%;
    }

    .main_header .logo {
        justify-content: center;
    }

    .main_header .logo img {
        width: 142px;
    }

    #nav-icon1 {
        top: 25px;
        left: 16px;
        margin: 0;
    }

    .mobile_top_heart {
        top: 18px;
        right: 10px;
    }

    #main {
        padding-bottom: 54px;
    }

    #main > .container {
        padding-top: 104px;
    }

    #main > .container > .h1,
    #main > .container > .h2 .page,
    #main > .container > .h2 h1 {
        font-size: clamp(27px, 8vw, 38px);
    }

    #main .content,
    #main .articlebox {
        padding: 25px 22px;
        border-radius: 16px;
    }

    #RegistrationForm .form-check-inline {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    footer {
        padding-top: 30px;
    }

    footer > .container {
        flex-wrap: wrap;
        justify-content: center;
        padding-bottom: 26px;
        text-align: center;
    }

    footer .pull-right {
        justify-content: center;
        width: 100%;
        margin-left: 0;
    }

    body:has(.map-box__area) .map-box__header-container,
    body:has(.map-box__area) .map-box__top > .container {
        width: 100%;
        padding-right: 12px;
        padding-left: 12px;
    }

    body:has(.map-box__area) .map-box__select {
        margin-right: 10px;
    }
}

@media (max-width: 767px) {
    #main .content,
    #main .articlebox {
        padding: 21px 16px;
        margin-bottom: 17px;
        border-radius: 14px;
    }

    #main .content h1,
    #main .articlebox h1 {
        font-size: 27px;
    }

    #main form input[type="text"],
    #main form input[type="password"],
    #main form input[type="email"],
    #main form input[type="tel"],
    #main form input[type="url"],
    #main form input[type="number"],
    #main form input[type="search"],
    #main form select,
    #main form textarea,
    #main .input_form {
        max-width: 100%;
    }

    #RegistrationForm .form-check-inline {
        grid-template-columns: minmax(0, 1fr);
    }

    #main table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    footer > .container {
        flex-direction: column;
        gap: 19px;
    }

    footer .link ul {
        justify-content: center;
    }

    body:has(.map-box__area) .map-box__header {
        height: 60px;
    }

    body:has(.map-box__area) .map-box__header-logo img {
        width: 135px;
    }

    body:has(.map-box__area) .map-box__top-inner {
        min-height: 60px;
    }

    body:has(.map-box__area) .map-box__select-item {
        height: 40px;
        font-size: 12px;
        border-radius: 9px;
    }

    body:has(.map-box__area) #mapbox,
    body:has(.map-box__area) .map-box__area {
        height: calc(100vh - 120px);
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}