:root {
    --cream: #f8f0e5;
    --paper: #fffaf2;
    --surface: #fffaf2;
    --ink: #06495a;
    --ink-soft: #285968;
    --teal: #06495a;
    --teal-dark: #053b49;
    --gold: #d4a05c;
    --gold-light: #f1d39b;
    --turquoise: #0d7480;
    --text: #123f4e;
    --muted: #718086;
    --border: #e5ceb0;
    --card: #fffaf2;
    --page-shell: 1500px;
    --wide-shell: 1440px;
    --radius-control: 10px;
    --radius-card: 18px;
    --radius-panel: 30px;
    --shadow-panel: 0 14px 36px rgba(101, 67, 29, .12);
    --shadow-card: 0 8px 22px rgba(91, 62, 30, .09);
    --cultural-sidebar-width: clamp(145px, 10.9vw, 173px);
    --cultural-sidebar-gap: 60px;
}

* { box-sizing: border-box; }
html { min-height: 100%; scroll-behavior: smooth; font-size: 16px; }
body {
    min-height: 100%;
    min-width: 320px;
    margin: 0;
    overflow-x: hidden;
    color: var(--text);
    background: var(--cream);
    font-family: 'Manrope', Arial, sans-serif;
}

button,
input,
select { font: inherit; }
a { color: inherit; text-decoration: none; }

.public-page {
    position: relative;
    min-height: 0;
    overflow: clip;
    display: block;
}

.public-main { position: relative; z-index: 2; min-height: 0; }

.shell,
.footer-inner {
    width: min(82vw, var(--page-shell));
    max-width: var(--page-shell);
    margin-inline: auto;
}

.site-header.shell {
    width: min(var(--wide-shell), calc(100% - 32px));
    max-width: var(--wide-shell);
    margin-inline: auto;
}

.page-pattern {
    position: fixed;
    inset: 0;
    z-index: -2;
    pointer-events: none;
    opacity: .34;
    background:
        radial-gradient(circle at 70% 12%, rgba(255,255,255,.9), transparent 31%),
        radial-gradient(rgba(176, 126, 64, .14) .7px, transparent .8px),
        var(--cream);
    background-size: auto, 6px 6px, auto;
}

.decorative-layer {
    position: absolute;
    z-index: 0;
    pointer-events: none;
}

.decorative-layer { inset: 0; overflow: hidden; }

.cultural-sidebar {
    position: absolute;
    inset: 0 auto 0 0;
    width: calc(var(--cultural-sidebar-width) + var(--cultural-sidebar-gap) - 16px);
    min-height: 100vh;
    overflow: hidden;
    isolation: isolate;
    border: 0;
    outline: 0;
}

.cultural-sidebar__top-glow {
    position: absolute;
    z-index: 1;
    top: -38px;
    left: -60px;
    width: 248px;
    height: 248px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 250, 242, .92), rgba(248, 240, 229, .34) 55%, transparent 76%);
}

.cultural-sidebar__emblem,
.cultural-sidebar__ornament,
.cultural-sidebar__building {
    display: block;
    pointer-events: none;
    user-select: none;
}

.cultural-sidebar__emblem {
    position: absolute;
    z-index: 5;
    top: 8px;
    left: 50%;
    width: 78%;
    max-width: 138px;
    height: auto;
    transform: translateX(-50%);
    object-fit: contain;
    filter: drop-shadow(0 8px 15px rgba(5, 59, 73, .13));
}

.cultural-sidebar__ornament {
    position: absolute;
    z-index: 6;
    top: 160px;
    left: 50%;
    width: 60%;
    max-width: 105px;
    height: auto;
    transform: translateX(-50%);
    object-fit: contain;
    filter: drop-shadow(0 8px 14px rgba(5, 59, 73, .12));
}

.cultural-sidebar__architecture {
    position: absolute;
    z-index: 2;
    top: 330px;
    bottom: auto;
    left: 0;
    width: 100%;
    height: min(1260px, calc(100% - 330px));
    overflow: hidden;
}

.cultural-sidebar__building {
    width: 112%;
    max-width: none;
    height: auto;
    margin-left: -6%;
    object-fit: contain;
    object-position: 44% top;
    transform: scaleY(1.4);
    transform-origin: top center;
    filter: sepia(.1) saturate(.85) contrast(.95);
}

.cultural-sidebar__architecture::after {
    content: '';
    position: absolute;
    z-index: 3;
    inset: 0;
    background: linear-gradient(to bottom, rgba(247, 240, 226, .08) 0%, transparent 24%, transparent 72%, rgba(247, 240, 226, .76) 100%);
}

.cultural-sidebar__bottom-fade {
    position: absolute;
    z-index: 7;
    right: 0;
    bottom: 0;
    left: 0;
    height: 120px;
    background: linear-gradient(to bottom, transparent, rgba(247, 240, 226, .78) 72%, #f7f0e2);
}

.site-header {
    position: relative;
    z-index: 4;
    min-height: 92px;
    padding: 10px 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 24px;
}

.site-header .brand {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 14px;
    justify-self: start;
}

.site-header .brand-mark,
.site-header .brand-mark img {
    display: block;
    width: clamp(64px, 6vw, 90px);
    height: clamp(72px, 6.7vw, 98px);
}

.site-header .brand-mark { filter: drop-shadow(0 6px 8px rgba(6, 73, 90, .14)); }
.brand-copy { display: grid; gap: 4px; color: var(--teal); white-space: nowrap; }
.brand-copy strong { font: 700 22px/1 'Cormorant Garamond', Georgia, serif; letter-spacing: .045em; }
.brand-copy small { font-size: 9px; font-weight: 600; }

.site-header .portal-nav {
    justify-self: center;
    margin: 0;
    height: 64px;
    display: flex;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 0 0 22px 22px;
    background: rgba(255, 250, 242, .88);
    box-shadow: 0 7px 20px rgba(88, 60, 27, .07);
}

.portal-nav__item {
    width: 122px;
    min-width: 0;
    display: grid;
    place-content: center;
    gap: 4px;
    text-align: center;
    color: var(--text);
    border-left: 1px solid var(--border);
}

.portal-nav__item:first-child { border-left: 0; }
.portal-nav__item small { font-size: 9px; font-weight: 800; }
.portal-nav__item b { font-size: 11px; }
.portal-nav__item:hover,
.portal-nav__item--active { color: #fff9ee; background: var(--teal); }

.site-header .header-actions {
    justify-self: end;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
}

.social-link,
.login-link {
    min-height: 40px;
    padding: 0 13px;
    border: 1px solid var(--border);
    border-radius: 22px;
    background: rgba(255,250,242,.9);
    color: var(--text);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 10px;
    font-weight: 800;
}

.social-link { padding-inline: 11px; }
.social-link span { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #279de2; }
.social-link span svg { width: 14px; height: 14px; display: block; fill: currentColor; }
.social-link--instagram span { background: linear-gradient(135deg, #853bce, #e94376 52%, #f4a33b); }
.social-link--instagram span svg { fill: none; stroke: currentColor; stroke-width: 2; }
.social-link--instagram span .instagram-dot { fill: currentColor; stroke: none; }
.social-link em { font-style: normal; }
.login-link { color: #fffaf2; background: var(--teal-dark); border-color: var(--teal-dark); padding-inline: 16px; }
.login-link span { color: var(--gold-light); }
.social-link:focus-visible,
.login-link:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

.hero-section {
    position: relative;
    z-index: 1;
    min-height: 310px;
    overflow: visible;
}

.hero-section > .hero {
    position: relative;
    min-height: 310px;
    margin: 0 auto;
    align-items: flex-start;
}

.hero-copy {
    position: relative;
    z-index: 3;
    width: 48%;
    padding: 12px 0 0;
}

.hero-title {
    max-width: 620px;
    margin: 0;
    color: var(--teal);
    font: 700 clamp(34px, 2.6vw, 44px)/1 'Cormorant Garamond', Georgia, serif;
    letter-spacing: .006em;
}

.hero-title__line {
    display: block;
    white-space: nowrap;
}

.hero-description {
    max-width: 520px;
    margin: 14px 0 23px;
    color: var(--ink-soft);
    font-size: 13px;
    line-height: 1.58;
    font-weight: 600;
}

.hero-visual {
    position: absolute;
    right: -20px;
    top: auto;
}

.hero-visual {
    z-index: 2;
    bottom: -6px;
    width: min(56vw, 850px);
    height: 320px;
    overflow: visible;
    opacity: 1;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.hero-visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: right bottom;
    opacity: 1;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    filter: saturate(1.03) contrast(1.01);
}

.advantages {
    width: 650px;
    max-width: 100%;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.advantage { min-width: 0; display: flex; align-items: center; gap: 9px; color: var(--text); }
.advantage__icon {
    flex: 0 0 auto;
    width: 54px;
    height: 56px;
    padding: 11px;
    display: grid;
    place-items: center;
    color: var(--gold-light);
    background: linear-gradient(145deg, #07586a, #053b49);
    border: 1px solid var(--gold);
    clip-path: polygon(50% 0, 82% 12%, 100% 43%, 88% 78%, 50% 100%, 12% 78%, 0 43%, 18% 12%);
    box-shadow: 0 5px 12px rgba(6, 73, 90, .15);
}
.advantage__icon svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.advantage__icon .icon-accent { stroke: #f6d78f; stroke-width: 2; }
.advantage b,
.advantage small { display: block; }
.advantage b { margin-bottom: 3px; font-size: 9px; line-height: 1.2; white-space: nowrap; }
.advantage small { color: var(--muted); font-size: 7px; line-height: 1.55; }

.catalog-shell {
    position: relative;
    z-index: 5;
    isolation: isolate;
    width: min(82vw, var(--page-shell));
    max-width: var(--page-shell);
    margin: -2px auto 0;
}

.catalog-shell > .search-panel {
    position: relative;
    z-index: 2;
    width: 100%;
    min-height: 112px;
    margin-inline: auto;
    padding: 10px 28px 10px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.17fr);
    align-items: center;
    column-gap: 16px;
    row-gap: 8px;
    border: 1px solid var(--border);
    border-radius: var(--radius-panel);
    background: rgba(255, 250, 242, .98);
    box-shadow: var(--shadow-panel), inset 0 1px 0 rgba(255,255,255,.92);
}

.filter-wing {
    position: absolute;
    z-index: -1;
    top: 8px;
    width: 105px;
    height: 104px;
    pointer-events: none;
    opacity: .98;
    background-image: url('/assets/turar-joy/generated/filter-arch-clean.png');
    background-repeat: no-repeat;
    background-position: -61px -16px;
    background-size: 181px 136px;
}

.filter-wing--left { left: -45px; }
.filter-wing--right { right: -45px; transform: scaleX(-1); }

.search-field { min-width: 0; display: grid; gap: 3px; }
.search-field label { padding-left: 40px; color: var(--text); font-size: 8px; font-weight: 800; }
.field-control,
.search-input {
    height: 43px;
    display: flex;
    align-items: center;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: var(--radius-control);
    background: #fffdf8;
}

.field-icon {
    align-self: stretch;
    flex: 0 0 38px;
    display: grid;
    place-items: center;
    color: var(--teal);
    border-right: 1px solid var(--border);
}
.field-icon svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.field-control select {
    width: 100%;
    min-width: 0;
    height: 100%;
    padding: 0 12px;
    border: 0;
    outline: 0;
    color: var(--text);
    background: transparent;
    font-size: 11px;
    font-weight: 800;
}

.search-input { position: relative; }
.search-input > span { position: absolute; left: 0; padding-left: 13px; color: var(--muted); font-size: 9px; pointer-events: none; }
.search-input:focus-within > span { opacity: 0; }
.search-input input { flex: 1; min-width: 0; height: 100%; padding: 0 12px; border: 0; outline: 0; color: var(--text); background: transparent; }
.search-input button { flex: 0 0 46px; width: 46px; height: 100%; padding: 0; display: grid; place-items: center; border: 0; color: var(--gold-light); background: var(--teal); cursor: pointer; }
.search-input button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; }

.available-check {
    grid-column: 1 / 4;
    width: max-content;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--text);
    font-size: 10px;
    font-weight: 800;
    cursor: pointer;
}
.available-check input { position: absolute; opacity: 0; }
.available-check > span { width: 15px; height: 15px; display: grid; place-items: center; border: 1px solid var(--gold); border-radius: 4px; background: var(--surface); }
.available-check input:checked + span { background: var(--teal); border-color: var(--teal); }
.available-check input:checked + span::after { content: '✓'; color: #fff; font-size: 10px; }

.filter-submit {
    grid-column: 4;
    grid-row: 2;
    justify-self: end;
    align-self: start;
    min-width: 107px;
    height: 34px;
    padding: 0 16px;
    border: 0;
    border-radius: 10px;
    color: var(--text);
    background: linear-gradient(135deg, #f3d69e, #dfa954);
    box-shadow: 0 5px 12px rgba(176, 118, 48, .17);
    font-size: 10px;
    font-weight: 800;
    cursor: pointer;
}
.filter-submit svg { width: 16px; height: 16px; margin-left: 7px; vertical-align: middle; fill: none; stroke: currentColor; stroke-width: 1.8; }

.catalog.shell {
    position: relative;
    z-index: 2;
    width: min(82vw, var(--page-shell));
    max-width: var(--page-shell);
    min-height: 0;
    margin: 12px auto 0;
    padding: 0 0 12px;
}

.cards-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.housing-card {
    --card-gold: #c9954f;
    --card-gold-light: #ead2a6;
    --card-teal: #064d59;
    min-width: 0;
    min-height: 0;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--card-gold-light);
    border-radius: 24px;
    background: #fffcf5;
    box-shadow: 0 12px 28px rgba(70, 46, 20, .12), inset 0 0 0 3px rgba(255, 255, 255, .72);
    transition: transform .22s ease, box-shadow .22s ease;
}
.housing-card::after {
    content: '';
    position: absolute;
    z-index: 2;
    inset: 0;
    pointer-events: none;
    background: url('../../turar-joy/cards/ramka.png') center / 118% 112% no-repeat;
    mix-blend-mode: multiply;
}
.housing-card:hover { transform: translateY(-5px); box-shadow: 0 18px 38px rgba(70, 46, 20, .18), inset 0 0 0 3px rgba(255, 255, 255, .78); }
.housing-card[hidden] { display: none; }
.card-image {
    position: relative;
    width: calc(100% - 14px);
    margin: 7px 7px 0;
    aspect-ratio: 1.56 / 1;
    overflow: hidden;
    border: 0;
    border-radius: 18px 18px 15px 15px;
    background: #d8c5a6;
}
.card-image::before {
    content: '';
    position: absolute;
    z-index: 1;
    inset: 0;
    pointer-events: none;
    border-radius: inherit;
    box-shadow: inset 0 -30px 40px rgba(1, 33, 39, .1);
}
.gallery-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .3s ease, transform .5s ease; }
.gallery-image.is-active { opacity: 1; border-radius: inherit; }
.housing-card:hover .gallery-image.is-active { transform: scale(1.035); }
.image-placeholder { height: 100%; display: grid; place-items: center; border-radius: inherit; color: var(--text); background: linear-gradient(135deg, #ead8ba, #b8dbd8); font: 700 21px 'Cormorant Garamond', serif; }
.card-badges { position: absolute; z-index: 3; top: 9px; left: 9px; right: 9px; display: flex; align-items: center; gap: 7px; }
.availability-badge,
.gender-badge,
.image-counter { display: inline-flex; align-items: center; color: #fff5d9; border: 1px solid rgba(238, 200, 131, .78); box-shadow: 0 4px 10px rgba(4, 42, 48, .17); }
.availability-badge,
.gender-badge { min-height: 30px; padding: 5px 10px; gap: 6px; border-radius: 18px; font: 700 10px/1 'Cormorant Garamond', Georgia, serif; white-space: nowrap; }
.availability-badge { background: linear-gradient(145deg, #075a66, #03424e); }
.availability-badge.is-full { background: linear-gradient(145deg, #8a4237, #662e28); }
.gender-badge { color: #704719; background: linear-gradient(145deg, #fff0d1, #ebc488); }
.availability-badge svg,
.gender-badge svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.gender-badge--image { min-width: 0; min-height: 0; padding: 0; flex: 0 1 clamp(82px, 7vw, 124px); overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.gender-badge--image img { display: block; width: 100%; max-width: 100%; height: auto; object-fit: contain; }
.image-counter { position: absolute; z-index: 3; left: 10px; bottom: 11px; min-height: 27px; padding: 4px 9px; gap: 4px; border-radius: 14px; background: rgba(3, 47, 55, .88); font: 700 10px/1 'Manrope', sans-serif; }
.image-counter svg { width: 14px; height: 14px; margin-right: 1px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.gallery-button { position: absolute; z-index: 3; top: 53%; width: 31px; height: 31px; padding: 0; display: grid; place-items: center; transform: translateY(-50%); border: 1px solid rgba(235,201,139,.55); border-radius: 50%; color: #fff9e8; background: rgba(2,46,53,.74); cursor: pointer; opacity: .95; }
.gallery-button svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.gallery-button--prev { left: 10px; }
.gallery-button--next { right: 10px; }
.gallery-button.is-static { opacity: .35; cursor: default; }
.card-content { position: relative; z-index: 1; flex: 1; padding: 38px 13px 12px; display: flex; flex-direction: column; }
.card-heading { min-height: 55px; }
.card-content h2 { margin: 0; overflow: hidden; color: var(--card-teal); font: 700 clamp(19px, 1.55vw, 25px)/1.05 'Cormorant Garamond', Georgia, serif; text-overflow: ellipsis; white-space: nowrap; }
.card-location { margin: 5px 0 0; display: flex; align-items: center; gap: 5px; color: #b8782d; font: 700 10px/1.25 'Cormorant Garamond', Georgia, serif; }
.card-location svg { flex: 0 0 14px; width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.card-divider { height: 10px; margin: 1px 4px 7px; display: flex; align-items: center; }
.card-divider::before,
.card-divider::after { content: ''; width: 5px; height: 5px; flex: 0 0 5px; transform: rotate(45deg); background: var(--card-gold); }
.card-divider span { height: 1px; flex: 1; background: linear-gradient(90deg, var(--card-gold-light), var(--card-gold), var(--card-gold-light)); }
.card-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.card-stats > span { min-width: 0; min-height: 56px; padding: 5px 4px; display: flex; align-items: center; justify-content: center; gap: 4px; border: 1px solid #e6cda5; border-radius: 11px; background: rgba(255, 253, 247, .74); }
.card-stats i { flex: 0 0 28px; width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid #ead8b8; border-radius: 50%; color: #9e6423; background: #fffaf0; }
.card-stats i svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
.card-stats em { min-width: 0; display: grid; gap: 2px; font-style: normal; }
.card-stats small { overflow: hidden; color: #4e6870; font: 600 6px/1.1 'Manrope', sans-serif; text-overflow: ellipsis; white-space: nowrap; }
.card-stats b { color: var(--card-teal); font: 700 8px/1.1 'Manrope', sans-serif; white-space: nowrap; }
.card-bottom { min-height: 53px; margin-top: 10px; display: grid; grid-template-columns: minmax(0, .85fr) 12px minmax(112px, 1.15fr); align-items: center; gap: 7px; overflow: hidden; border: 1px solid #e3c59a; border-radius: 12px; background: rgba(255,252,245,.82); }
.card-bottom > .card-price { padding-left: 9px; color: var(--card-teal); font: 800 clamp(13px, 1vw, 17px)/1.08 'Manrope', Arial, sans-serif; letter-spacing: -.045em; white-space: normal; }
.card-bottom > .card-price small { color: #9b682d; font: 800 8px/1 'Manrope', Arial, sans-serif; letter-spacing: -.02em; white-space: nowrap; }
.price-separator { position: relative; width: 1px; height: 32px; justify-self: center; background: var(--card-gold); }
.price-separator::after { content: ''; position: absolute; top: 50%; left: 50%; width: 6px; height: 6px; transform: translate(-50%, -50%) rotate(45deg); background: var(--card-gold); }
.detail-button { position: relative; align-self: stretch; min-width: 0; margin: 3px 3px 3px 0; padding: 0 9px; display: inline-flex; align-items: center; justify-content: space-between; gap: 6px; overflow: hidden; border: 1px solid var(--card-gold); border-radius: 10px; color: #fff0cf; background: linear-gradient(145deg, #075966, #033f4b); font: 700 9px/1 'Cormorant Garamond', Georgia, serif; box-shadow: inset 0 0 0 1px rgba(255,248,225,.28); }
.detail-button::after { content: ''; position: absolute; width: 32px; height: 32px; right: -18px; border: 1px solid rgba(232,195,124,.58); transform: rotate(45deg); }
.detail-button span,
.detail-button svg { position: relative; z-index: 1; }
.detail-button svg { flex: 0 0 18px; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.detail-button--image { align-self: center; justify-self: stretch; width: calc(100% - 3px); min-width: 0; display: block; margin: 3px 3px 3px 0; padding: 0; overflow: visible; border: 0; border-radius: 0; background: none; box-shadow: none; line-height: 0; }
.detail-button--image::after { display: none; }
.detail-button--image img { position: static; display: block; width: 100%; max-width: 100%; height: auto; object-fit: contain; transition: filter .2s ease; }
.detail-button--image:hover img { filter: brightness(1.06); }

.results-note,
.empty-state,
.error-state {
    min-height: 132px;
    margin: 0;
    padding: 28px;
    display: grid;
    place-content: center;
    text-align: center;
    border: 1px solid var(--border);
    border-radius: var(--radius-card);
    background: var(--surface);
    color: var(--text);
    box-shadow: var(--shadow-card);
}
.results-note[hidden],
.catalog-loading[hidden],
.error-state[hidden] { display: none; }
.empty-state h2,
.error-state h2 { margin: 0 0 6px; font: 700 28px/1 'Cormorant Garamond', serif; }
.empty-state p,
.error-state p { margin: 0; font-size: 11px; }
.catalog-loading { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.skeleton-card { min-height: 220px; border: 1px solid var(--border); border-radius: var(--radius-card); background: linear-gradient(100deg, #f2e5d2 20%, #fffaf2 40%, #f2e5d2 60%); background-size: 220% 100%; animation: catalogue-shimmer 1.25s linear infinite; }
@keyframes catalogue-shimmer { to { background-position-x: -220%; } }
.pagination { margin: 18px 0 12px; display: flex; justify-content: center; gap: 8px; }
.page-control { min-width: 31px; height: 30px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 8px; color: var(--text); background: var(--surface); font-size: 10px; font-weight: 800; }
.page-control.is-current { color: #fff; background: var(--teal); border-color: var(--teal); }
.page-control.is-disabled { opacity: .42; cursor: default; }

.site-footer {
    position: relative;
    width: 100%;
    min-height: 150px;
    margin: 0;
    padding: 22px 0;
    overflow: hidden;
    color: #fff8ec;
    background: var(--teal-dark);
}
.site-footer::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 5% 0, rgba(15,123,135,.42), transparent 27%), linear-gradient(105deg, #06495a, #053b49); }
.footer-content {
    position: relative;
    z-index: 3;
    width: calc(100% - 190px);
    max-width: none;
    margin-left: 160px;
    margin-right: 30px;
    min-height: 106px;
    padding-left: 20px;
    padding-right: 210px;
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1.25fr;
    gap: 28px;
    align-items: center;
}
.footer-column + .footer-column { border-left: 1px solid rgba(221, 178, 105, .45); padding-left: 28px; }
.footer-brand { min-width: 0; display: flex; align-items: center; gap: 12px; }
.footer-logo {
    flex: 0 0 auto;
    width: 62px;
    height: 62px;
    padding: 5px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(241, 211, 155, .72);
    border-radius: 50%;
    background: rgba(255, 250, 242, .96);
    box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .66);
}
.footer-logo img { width: 42px; height: 50px; display: block; object-fit: contain; }
.footer-brand > span:last-child { display: grid; gap: 4px; }
.footer-brand strong { color: var(--gold-light); font-size: 17px; }
.footer-brand small { font-size: 10px; }
.footer-socials { display: flex; gap: 6px; }
.footer-socials a { width: 19px; height: 19px; display: grid; place-items: center; border: 1px solid rgba(241,211,155,.5); border-radius: 50%; color: var(--gold-light); font-size: 10px; }
.footer-contact { min-height: 76px; display: grid; align-content: center; gap: 8px; font-size: 12px; }
.footer-contact b { color: var(--gold-light); font-size: 11px; letter-spacing: .12em; }
.footer-contact--address { padding-right: 0; }
.footer-corner-left { position: absolute; z-index: 1; left: -12px; bottom: -8px; width: 190px; opacity: .92; pointer-events: none; }
.footer-skyline { position: absolute; z-index: 1; right: 20px; bottom: 0; width: 310px; opacity: .85; pointer-events: none; }

@media (min-width: 1280px) {
    .cards-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .site-header.shell {
        width: 100%;
        max-width: none;
        padding: 10px 16px 0 145px;
    }
    .site-header { display: flex; align-items: center; }
    .site-header .brand { flex: 0 0 230px; padding-left: 0; }
    .site-header .brand-mark { display: none; }
    .site-header .portal-nav { margin-left: 28px; }
    .site-header .header-actions { margin-left: auto; }
    .hero-title { white-space: normal; }
    .hero-copy { margin-left: 15px; }
}

@media (min-width: 1280px) and (max-width: 1399px) {
    .decorative-layer { display: none; }
}

@media (min-width: 1400px) {
    .shell,
    .hero-section > .hero,
    .catalog-shell,
    .catalog.shell {
        width: calc(100% - var(--cultural-sidebar-width) - var(--cultural-sidebar-gap) - 16px);
        max-width: none;
        margin-left: calc(var(--cultural-sidebar-width) + var(--cultural-sidebar-gap));
        margin-right: 16px;
    }
    .hero-section > .hero { margin-top: 0; }
    .hero-visual {
        right: -50px;
        bottom: -12px;
        width: min(60vw, 920px);
        height: 345px;
    }
    .catalog-shell { margin-top: -2px; }
    .catalog-shell > .search-panel { width: calc(100% - 90px); }
    .catalog.shell { margin-top: 12px; }
    .site-header.shell {
        width: calc(100% - var(--cultural-sidebar-width) - var(--cultural-sidebar-gap) - 16px);
        margin-left: calc(var(--cultural-sidebar-width) + var(--cultural-sidebar-gap));
        margin-right: 16px;
        padding: 10px 0 0;
    }
    .hero-title { font-size: clamp(34px, 2.6vw, 44px); }
}

@media (min-width: 901px) and (max-width: 1279px) {
    .shell,
    .footer-inner { width: min(1040px, calc(100% - 40px)); max-width: 1040px; }
    .site-header.shell { width: calc(100% - 32px); max-width: none; }
    .site-header { grid-template-columns: 1fr auto; }
    .portal-nav { grid-column: 1 / 3; grid-row: 2; justify-self: stretch; width: 100%; }
    .portal-nav__item { flex: 1; width: auto; }
    .header-actions { grid-column: 2; grid-row: 1; }
    .decorative-layer { display: none; }
    .hero-section,
    .hero-section > .hero { min-height: 300px; }
    .hero-copy { width: 56%; padding-left: 0; }
    .hero-visual { width: 62%; height: 310px; right: -3%; }
    .advantages { grid-template-columns: repeat(2, minmax(0, 1fr)); width: 380px; }
    .catalog-shell { width: calc(100% - 40px); }
    .catalog-shell > .search-panel { width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 18px; }
    .search-input { grid-column: 2; grid-row: 2; }
    .available-check { grid-column: 1; grid-row: 3; }
    .filter-submit { grid-column: 2; grid-row: 3; }
    .filter-wing { display: none; }
    .catalog.shell { width: min(1040px, calc(100% - 40px)); max-width: 1040px; }
    .cards-grid,
    .catalog-loading { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .footer-content {
        width: min(1040px, calc(100% - 40px));
        margin-inline: auto;
        padding-left: 145px;
        padding-right: 0;
        grid-template-columns: 1.2fr 1fr 1fr;
        gap: 18px;
    }
    .footer-contact--address { grid-column: 2 / 4; }
}

@media (max-width: 900px) {
    .shell,
    .footer-inner { width: min(690px, calc(100% - 28px)); max-width: 690px; }
    .site-header.shell { width: calc(100% - 28px); max-width: none; }
    .decorative-layer { display: none; }
    .site-header { grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
    .site-header .brand-mark,
    .site-header .brand-mark img { width: 58px; height: 64px; }
    .brand-copy strong { font-size: 19px; }
    .header-actions { grid-column: 2; grid-row: 1; }
    .social-link em { display: none; }
    .social-link { width: 39px; padding: 0; }
    .portal-nav { grid-column: 1 / 3; grid-row: 2; width: 100%; min-width: 0; height: 56px; }
    .portal-nav__item { flex: 1; width: auto; }
    .hero-section,
    .hero-section > .hero { min-height: 430px; }
    .hero-copy { width: 100%; padding: 18px 0 0; }
    .hero-title { font-size: clamp(38px, 8vw, 50px); }
    .hero-title__line { white-space: normal; }
    .hero-break { display: none; }
    .hero-description { max-width: 560px; }
    .hero-visual { top: 176px; right: -5%; bottom: auto; width: 108%; height: 245px; opacity: 1; }
    .advantages { position: absolute; top: 330px; left: 0; right: 0; width: 100%; grid-template-columns: repeat(4, minmax(145px, 1fr)); overflow-x: auto; padding-bottom: 5px; }
    .catalog-shell { width: min(690px, calc(100% - 28px)); }
    .catalog-shell > .search-panel { width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 18px; }
    .search-input { grid-column: 1 / 3; grid-row: 3; }
    .available-check { grid-column: 1; grid-row: 4; }
    .filter-submit { grid-column: 2; grid-row: 4; }
    .filter-wing { display: none; }
    .catalog.shell { width: min(690px, calc(100% - 28px)); }
    .cards-grid,
    .catalog-loading { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .footer-content {
        width: min(690px, calc(100% - 28px));
        margin-inline: auto;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 14px;
        padding-left: 28px;
        padding-right: 28px;
    }
    .footer-brand { grid-column: 1 / 3; }
    .footer-contact--address { grid-column: 1 / 3; }
    .footer-corner-left { opacity: .2; }
    .footer-skyline { opacity: .2; }
}

@media (max-width: 560px) {
    .shell,
    .footer-inner,
    .site-header.shell,
    .catalog-shell,
    .catalog.shell { width: calc(100% - 20px); max-width: none; }
    .site-header.shell { width: calc(100vw - 20px); max-width: calc(100vw - 20px); }
    .site-header { min-height: 0; padding-top: 10px; overflow: hidden; }
    .site-header .brand { min-width: 0; }
    .site-header .brand-copy { min-width: 0; }
    .brand-copy strong { font-size: 17px; }
    .brand-copy small { font-size: 7px; }
    .social-link--instagram { display: none; }
    .login-link { width: 39px; padding: 0; font-size: 0; }
    .login-link span { font-size: 13px; }
    .site-header .portal-nav { width: 100%; max-width: 100%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: hidden; }
    .site-header .portal-nav__item { width: auto; min-width: 0; }
    .hero-section,
    .hero-section > .hero { min-height: 520px; }
    .hero-copy { padding-top: 19px; }
    .hero-title { max-width: calc(100vw - 40px); font-size: 31px; }
    .hero-description { max-width: calc(100vw - 40px); font-size: 9.5px; }
    .hero-visual { top: 168px; height: 225px; }
    .hero-visual img { object-position: center bottom; }
    .advantages {
        top: 390px;
        margin: 0;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px 12px;
        overflow: visible;
        padding-bottom: 0;
    }
    .advantage { min-width: 0; }
    .advantage__icon { width: 45px; height: 47px; padding: 10px; }
    .catalog-shell > .search-panel { grid-template-columns: 1fr; padding: 16px; gap: 10px; border-radius: 24px; }
    .search-field,
    .search-input,
    .available-check,
    .filter-submit { grid-column: 1; grid-row: auto; }
    .filter-submit { justify-self: stretch; }
    .cards-grid,
    .catalog-loading { grid-template-columns: 1fr; }
    .card-image { aspect-ratio: 1.85 / 1; }
    .footer-inner { grid-template-columns: 1fr; }
    .footer-brand,
    .footer-contact,
    .footer-contact--address { grid-column: 1; border-left: 0; padding-left: 0; }
    .footer-content .footer-column { border-left: 0; padding-left: 0; padding-right: 0; }
    .footer-corner-left,
    .footer-skyline { display: none; }
}