/* ========================================================================== 
   /assets/css/pages/contacts.css
   Contacts page — Browka / Beauty Dom
   ========================================================================== */

:root {
    --contacts-radius: 18px;
    --contacts-border: rgba(128, 0, 0, 0.12);
    --contacts-shadow: 0 44px 100px -42px rgba(128, 0, 0, 0.32);
}

.contacts-page {
    padding-bottom: clamp(56px, 8vw, 112px);
}

.contacts-hero {
    padding-block: clamp(20px, 3vw, 36px) clamp(36px, 5vw, 64px);
}

.contacts-hero__frame,
.contacts-map__frame {
    max-width: var(--container);
    margin-inline: auto;
}

.contacts-hero__frame {
    background: linear-gradient(180deg, #fffaf8 0%, var(--color-bg-alt) 100%);
    border: 1px solid var(--contacts-border);
    border-radius: calc(var(--contacts-radius) + 10px);
    padding: clamp(12px, 1.6vw, 20px);
    box-shadow: var(--contacts-shadow);
}

.contacts-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(340px, 0.85fr);
    gap: clamp(14px, 1.8vw, 26px);
    align-items: stretch;
}

.contacts-info,
.contacts-form-card {
    border-radius: var(--contacts-radius);
}

.contacts-info {
    padding: clamp(28px, 4vw, 56px);
    background: #ffffff;
    border: 1px solid rgba(128, 0, 0, 0.08);
}

.contacts-info__title {
    max-width: 12ch;
    margin-bottom: 0.45em;
    font-family: "Fraunces", Georgia, serif;
    font-size: clamp(2.3rem, 1.55rem + 3.1vw, 4.6rem);
    font-weight: 500;
    line-height: 1.04;
    letter-spacing: -0.025em;
}

.contacts-info__lead {
    max-width: 58ch;
    color: var(--color-text-muted);
    font-size: clamp(1rem, 0.94rem + 0.25vw, 1.16rem);
}

.contacts-details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    margin-top: clamp(28px, 4vw, 48px);
    background: var(--color-border-light);
    border: 1px solid var(--color-border-light);
}

.contacts-detail {
    min-height: 132px;
    padding: clamp(20px, 2.4vw, 30px);
    background: #ffffff;
    transition: background 0.35s var(--ease-silk), transform 0.35s var(--ease-silk);
}

.contacts-detail:hover {
    position: relative;
    z-index: 1;
    background: #fff8f5;
    transform: translateY(-2px);
}

.contacts-detail__label {
    display: block;
    margin-bottom: 0.65rem;
    color: var(--color-primary);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.contacts-detail__value {
    display: inline-block;
    font-family: "Fraunces", Georgia, serif;
    font-size: clamp(1.05rem, 0.96rem + 0.35vw, 1.28rem);
    line-height: 1.35;
}

.contacts-detail__value--small {
    font-family: var(--font-main);
    font-size: 0.98rem;
    white-space: pre-line;
}

.contacts-detail a.contacts-detail__value {
    transition: color 0.25s ease;
}

.contacts-detail a.contacts-detail__value:hover {
    color: var(--color-primary);
}

.contacts-socials {
    margin-top: clamp(26px, 3.2vw, 40px);
}

.contacts-socials__label {
    margin-bottom: 12px;
    color: var(--color-text-muted);
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.contacts-socials__list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.contacts-social {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.76rem 1rem;
    border: 1px solid var(--color-border-light);
    background: #ffffff;
    font-size: 0.86rem;
    font-weight: 600;
    transition: color 0.3s ease, border-color 0.3s ease, background 0.3s ease, transform 0.3s var(--ease-silk);
}

.contacts-social:hover {
    color: #ffffff;
    background: var(--color-primary);
    border-color: var(--color-primary);
    transform: translateY(-2px);
}

.contacts-social__arrow {
    font-size: 1rem;
    line-height: 1;
}

.contacts-form-card {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding: clamp(28px, 3.5vw, 46px);
    color: #ffffff;
    background: linear-gradient(145deg, var(--color-primary) 0%, #520000 100%);
    isolation: isolate;
}

.contacts-form-card::before {
    content: "";
    position: absolute;
    right: -18%;
    bottom: -12%;
    width: 340px;
    aspect-ratio: 1;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 50%;
    box-shadow: 0 0 0 54px rgba(255, 255, 255, 0.035), 0 0 0 108px rgba(255, 255, 255, 0.022);
    z-index: -1;
}

.contacts-form-card__eyebrow {
    margin-bottom: 0.75rem;
    color: rgba(255, 255, 255, 0.68);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.contacts-form-card__title {
    margin-bottom: 0.55em;
    font-family: "Fraunces", Georgia, serif;
    font-size: clamp(1.75rem, 1.35rem + 1.45vw, 2.55rem);
    font-weight: 500;
}

.contacts-form-card__text {
    color: rgba(255, 255, 255, 0.72);
    margin-bottom: clamp(22px, 3vw, 32px);
}

.contacts-form .form-field {
    margin-bottom: 14px;
}

.contacts-form label {
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.78rem;
}

.contacts-form input,
.contacts-form textarea {
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.075);
    color: #ffffff;
    backdrop-filter: blur(4px);
}

.contacts-form input::placeholder,
.contacts-form textarea::placeholder {
    color: rgba(255, 255, 255, 0.48);
}

.contacts-form input:focus,
.contacts-form textarea:focus {
    border-color: rgba(255, 255, 255, 0.72);
}

.contacts-form textarea {
    min-height: 118px;
}

.contacts-form__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.contacts-form__submit {
    width: 100%;
    min-height: 54px;
    margin-top: 2px;
    background: #ffffff;
    color: var(--color-primary);
    border: 1px solid #ffffff;
    font-weight: 700;
    transition: background 0.3s ease, color 0.3s ease, transform 0.3s var(--ease-silk);
}

.contacts-form__submit:hover {
    background: transparent;
    color: #ffffff;
    transform: translateY(-2px);
}

.contacts-form__privacy {
    margin-top: 12px;
    color: rgba(255, 255, 255, 0.56);
    font-size: 0.72rem;
}

.contacts-form .form-error {
    display: block;
    margin-top: 5px;
    color: #ffd4d4;
    font-size: 0.74rem;
}

.contacts-form__status {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid rgba(255, 255, 255, 0.24);
    background: rgba(255, 255, 255, 0.09);
    font-size: 0.84rem;
}

.contacts-form__honeypot {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}

.contacts-map {
    padding-inline: 0;
}

.contacts-map__frame {
    position: relative;
    min-height: clamp(420px, 54vw, 650px);
    overflow: hidden;
    border: 1px solid var(--contacts-border);
    border-radius: calc(var(--contacts-radius) + 10px);
    background: #eee7e3;
    box-shadow: var(--contacts-shadow);
}

.contacts-map__frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    filter: grayscale(0.22) saturate(0.78) contrast(1.02);
}

.contacts-map__empty {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 36px;
    text-align: center;
    background: radial-gradient(circle at 70% 30%, #fff 0, transparent 42%), linear-gradient(135deg, #f5efec, #e8ded9);
}

.contacts-map__empty-inner {
    max-width: 520px;
}

.contacts-map__empty-title {
    margin-bottom: 0.45em;
    font-family: "Fraunces", Georgia, serif;
    font-size: clamp(1.6rem, 1.25rem + 1.2vw, 2.3rem);
}

.contacts-map__empty-text {
    color: var(--color-text-muted);
}

.contacts-map__card {
    position: absolute;
    z-index: 2;
    left: clamp(18px, 3vw, 42px);
    bottom: clamp(18px, 3vw, 42px);
    width: min(430px, calc(100% - 36px));
    padding: clamp(22px, 3vw, 34px);
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(128, 0, 0, 0.12);
    backdrop-filter: blur(12px);
    box-shadow: 0 30px 70px -35px rgba(0, 0, 0, 0.35);
}

.contacts-map__card-label {
    color: var(--color-primary);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.contacts-map__card-title {
    margin: 0.55rem 0 0.35rem;
    font-family: "Fraunces", Georgia, serif;
    font-size: clamp(1.35rem, 1.15rem + 0.7vw, 1.85rem);
    font-weight: 500;
}

.contacts-map__card-text {
    color: var(--color-text-muted);
    font-size: 0.9rem;
}

.contacts-map__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

.contacts-map__actions .btn {
    padding: 0.8em 1.1em;
    font-size: 0.82rem;
}

@media (max-width: 900px) {
    .contacts-hero,
    .contacts-map {
        padding-inline: 10px;
    }

    .contacts-hero__grid {
        grid-template-columns: 1fr;
    }

    .contacts-form-card {
        min-height: auto;
    }
}

@media (max-width: 620px) {
    .contacts-info {
        padding-inline: 20px;
    }

    .contacts-details,
    .contacts-form__grid {
        grid-template-columns: 1fr;
    }

    .contacts-detail {
        min-height: auto;
    }

    .contacts-map__frame {
        min-height: 570px;
    }

    .contacts-map__card {
        left: 14px;
        right: 14px;
        bottom: 14px;
        width: auto;
    }
}

@media (prefers-reduced-motion: reduce) {
    .contacts-detail,
    .contacts-social,
    .contacts-form__submit {
        transition: none !important;
    }
}

/* ========================================================================== 
   LUXURY MOTION LAYER v2
   Cinematic, restrained motion for Browka Contacts.
   No markup changes required. JS adds .contacts-lux-ready / .is-lux-visible.
   ========================================================================== */

:root {
    --contacts-gold: #b99655;
    --contacts-gold-soft: #d8bd84;
    --contacts-ivory: #fffaf4;
    --contacts-wine-black: #260707;
    --contacts-lux-shadow: 0 32px 90px -48px rgba(54, 7, 7, 0.48);
    --contacts-lux-ease: cubic-bezier(0.16, 1, 0.3, 1);
    --contacts-lux-ease-inout: cubic-bezier(0.76, 0, 0.24, 1);
}

/* ---------- Page atmosphere ---------- */
.contacts-page {
    position: relative;
    isolation: isolate;
    background:
        radial-gradient(circle at 12% 8%, rgba(185, 150, 85, 0.075), transparent 27rem),
        radial-gradient(circle at 88% 38%, rgba(128, 0, 0, 0.055), transparent 34rem),
        var(--color-bg);
}

.contacts-page::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    opacity: 0.18;
    background-image:
        linear-gradient(rgba(128, 0, 0, 0.018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(128, 0, 0, 0.018) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: linear-gradient(to bottom, black, transparent 82%);
}

/* ---------- Hero frame: light follows cursor ---------- */
.contacts-hero__frame,
.contacts-map__frame {
    --lux-x: 50%;
    --lux-y: 50%;
}

.contacts-hero__frame {
    position: relative;
    overflow: hidden;
    box-shadow:
        0 50px 110px -55px rgba(91, 0, 0, 0.38),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transition: box-shadow 0.9s var(--contacts-lux-ease), border-color 0.9s var(--contacts-lux-ease);
}

.contacts-hero__frame::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: 0;
    background: radial-gradient(
        520px circle at var(--lux-x) var(--lux-y),
        rgba(216, 189, 132, 0.16),
        rgba(255, 255, 255, 0.035) 38%,
        transparent 68%
    );
    transition: opacity 0.55s ease;
}

.contacts-hero__frame:hover::before {
    opacity: 1;
}

.contacts-hero__grid {
    position: relative;
    z-index: 1;
}

/* ---------- Premium title treatment ---------- */
.contacts-info .eyebrow,
.contacts-form-card__eyebrow,
.contacts-map__card-label {
    position: relative;
    padding-left: 2rem;
}

.contacts-info .eyebrow::before,
.contacts-form-card__eyebrow::before,
.contacts-map__card-label::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 1.35rem;
    height: 1px;
    background: currentColor;
    transform: scaleX(0.38) translateY(-50%);
    transform-origin: left;
    opacity: 0.62;
    transition: transform 0.7s var(--contacts-lux-ease), opacity 0.7s ease;
}

.contacts-info:hover .eyebrow::before,
.contacts-form-card:hover .contacts-form-card__eyebrow::before,
.contacts-map__card:hover .contacts-map__card-label::before {
    transform: scaleX(1) translateY(-50%);
    opacity: 1;
}

.contacts-info__title {
    position: relative;
    text-wrap: balance;
    text-shadow: 0 18px 44px rgba(128, 0, 0, 0.055);
}

.contacts-info__title::after {
    content: "";
    display: block;
    width: clamp(48px, 7vw, 90px);
    height: 1px;
    margin-top: 0.55em;
    background: linear-gradient(90deg, var(--contacts-gold), rgba(185, 150, 85, 0));
    transform-origin: left;
}

/* ---------- Detail cards: quiet 3D / metallic edge ---------- */
.contacts-detail {
    --tilt-x: 0deg;
    --tilt-y: 0deg;
    --lift: 0px;
    position: relative;
    overflow: hidden;
    transform: perspective(900px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translate3d(0, var(--lift), 0);
    transform-style: preserve-3d;
    will-change: transform;
    transition:
        transform 0.6s var(--contacts-lux-ease),
        background 0.6s var(--contacts-lux-ease),
        box-shadow 0.6s var(--contacts-lux-ease);
}

.contacts-detail::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0;
    background:
        linear-gradient(120deg, transparent 5%, rgba(216, 189, 132, 0.1) 44%, transparent 58%),
        radial-gradient(320px circle at var(--lux-local-x, 50%) var(--lux-local-y, 50%), rgba(185, 150, 85, 0.1), transparent 62%);
    transform: translateX(-18%);
    transition: opacity 0.5s ease, transform 0.8s var(--contacts-lux-ease);
}

.contacts-detail::after {
    content: "";
    position: absolute;
    left: 0;
    top: 18%;
    bottom: 18%;
    width: 1px;
    background: linear-gradient(to bottom, transparent, var(--contacts-gold-soft), transparent);
    opacity: 0;
    transform: scaleY(0.3);
    transition: opacity 0.55s ease, transform 0.7s var(--contacts-lux-ease);
}

.contacts-detail:hover {
    --lift: -5px;
    background: #fffaf6;
    box-shadow: 0 26px 60px -38px rgba(64, 4, 4, 0.5);
}

.contacts-detail:hover::before {
    opacity: 1;
    transform: translateX(0);
}

.contacts-detail:hover::after {
    opacity: 0.85;
    transform: scaleY(1);
}

.contacts-detail__label,
.contacts-detail__value {
    position: relative;
    z-index: 1;
    transform: translateZ(14px);
}

.contacts-detail__label {
    transition: letter-spacing 0.55s var(--contacts-lux-ease), color 0.35s ease;
}

.contacts-detail:hover .contacts-detail__label {
    letter-spacing: 0.16em;
    color: #6a0000;
}

.contacts-detail a.contacts-detail__value {
    position: relative;
    padding-bottom: 2px;
}

.contacts-detail a.contacts-detail__value::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: linear-gradient(90deg, var(--contacts-gold), var(--color-primary));
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.55s var(--contacts-lux-ease);
}

.contacts-detail a.contacts-detail__value:hover::after {
    transform: scaleX(1);
    transform-origin: left;
}

/* ---------- Social links: jewelry-like chips ---------- */
.contacts-social {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    border-color: rgba(128, 0, 0, 0.13);
    box-shadow: inset 0 0 0 0 rgba(185, 150, 85, 0);
    transform: translate3d(var(--mag-x, 0px), var(--mag-y, 0px), 0);
    transition:
        color 0.45s ease,
        border-color 0.45s ease,
        background 0.55s var(--contacts-lux-ease),
        transform 0.32s var(--contacts-lux-ease),
        box-shadow 0.55s var(--contacts-lux-ease);
}

.contacts-social::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(115deg, #690000 0%, var(--color-primary) 48%, #4b0000 100%);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.58s var(--contacts-lux-ease);
}

.contacts-social::after {
    content: "";
    position: absolute;
    top: -25%;
    left: -55%;
    width: 30%;
    height: 150%;
    pointer-events: none;
    background: linear-gradient(100deg, transparent, rgba(255, 240, 207, 0.55), transparent);
    transform: skewX(-18deg);
    transition: left 0.85s var(--contacts-lux-ease);
}

.contacts-social:hover {
    color: #fff;
    background: transparent;
    border-color: rgba(185, 150, 85, 0.65);
    box-shadow: inset 0 0 0 1px rgba(216, 189, 132, 0.25), 0 14px 34px -24px rgba(80, 0, 0, 0.7);
}

.contacts-social:hover::before {
    transform: scaleX(1);
    transform-origin: left;
}

.contacts-social:hover::after {
    left: 130%;
}

.contacts-social__arrow {
    transition: transform 0.5s var(--contacts-lux-ease);
}

.contacts-social:hover .contacts-social__arrow {
    transform: translate(3px, -3px) rotate(3deg);
}

/* ---------- Form: velvet + champagne light ---------- */
.contacts-form-card {
    --lux-x: 50%;
    --lux-y: 50%;
    border: 1px solid rgba(216, 189, 132, 0.22);
    background:
        radial-gradient(480px circle at var(--lux-x) var(--lux-y), rgba(216, 189, 132, 0.15), transparent 60%),
        linear-gradient(145deg, #850606 0%, #5b0000 43%, #2d0707 100%);
    box-shadow:
        0 38px 95px -50px rgba(61, 0, 0, 0.72),
        inset 0 1px 0 rgba(255, 255, 255, 0.075);
}

.contacts-form-card::before {
    animation: contactsLuxuryOrbit 16s linear infinite;
    border-color: rgba(216, 189, 132, 0.19);
    box-shadow:
        0 0 0 54px rgba(216, 189, 132, 0.034),
        0 0 0 108px rgba(255, 255, 255, 0.019),
        0 0 0 162px rgba(216, 189, 132, 0.014);
}

.contacts-form-card::after {
    content: "";
    position: absolute;
    top: 0;
    left: -70%;
    width: 38%;
    height: 100%;
    z-index: -1;
    pointer-events: none;
    opacity: 0.22;
    background: linear-gradient(110deg, transparent, rgba(255, 237, 203, 0.2), transparent);
    transform: skewX(-18deg);
    animation: contactsLuxurySweep 10s var(--contacts-lux-ease-inout) infinite;
}

@keyframes contactsLuxuryOrbit {
    0% { transform: rotate(0deg) scale(1); }
    50% { transform: rotate(180deg) scale(1.045); }
    100% { transform: rotate(360deg) scale(1); }
}

@keyframes contactsLuxurySweep {
    0%, 66%, 100% { left: -70%; }
    78% { left: 145%; }
}

.contacts-form .form-field {
    position: relative;
}

.contacts-form input,
.contacts-form textarea {
    outline: none;
    border-color: rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.055);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
    transition:
        border-color 0.38s ease,
        background 0.38s ease,
        box-shadow 0.5s var(--contacts-lux-ease),
        transform 0.45s var(--contacts-lux-ease);
}

.contacts-form input:hover,
.contacts-form textarea:hover {
    background: rgba(255, 255, 255, 0.075);
    border-color: rgba(216, 189, 132, 0.36);
}

.contacts-form input:focus,
.contacts-form textarea:focus {
    border-color: rgba(216, 189, 132, 0.78);
    background: rgba(255, 255, 255, 0.095);
    box-shadow:
        0 0 0 1px rgba(216, 189, 132, 0.16),
        0 14px 34px -24px rgba(0, 0, 0, 0.7);
    transform: translateY(-1px);
}

.contacts-form label {
    transition: color 0.35s ease, letter-spacing 0.45s var(--contacts-lux-ease);
}

.contacts-form .form-field:focus-within label {
    color: var(--contacts-gold-soft);
    letter-spacing: 0.035em;
}

/* ---------- Buttons: magnetic movement + couture shine ---------- */
.contacts-page .btn,
.contacts-form__submit {
    --mag-x: 0px;
    --mag-y: 0px;
    transform: translate3d(var(--mag-x), var(--mag-y), 0);
    transition:
        color 0.42s ease,
        background 0.42s ease,
        border-color 0.42s ease,
        box-shadow 0.55s var(--contacts-lux-ease),
        transform 0.3s var(--contacts-lux-ease);
    will-change: transform;
}

.contacts-page .btn::after,
.contacts-form__submit::after {
    content: "";
    position: absolute;
    top: -30%;
    left: -58%;
    width: 34%;
    height: 160%;
    pointer-events: none;
    z-index: 2;
    background: linear-gradient(105deg, transparent, rgba(255, 239, 208, 0.58), transparent);
    transform: skewX(-20deg);
    transition: left 0.86s var(--contacts-lux-ease);
}

.contacts-page .btn:hover::after,
.contacts-form__submit:hover::after {
    left: 135%;
}

.contacts-page .btn:hover,
.contacts-form__submit:hover {
    box-shadow: 0 18px 38px -22px rgba(72, 0, 0, 0.58);
}

.contacts-form__submit {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    border-color: #fff7eb;
    background: linear-gradient(100deg, #fff 0%, #fff8ec 100%);
    color: #700000;
}

.contacts-form__submit:hover {
    border-color: var(--contacts-gold-soft);
    background: transparent;
    color: #fff;
}

/* ---------- Map: cinematic reveal / depth ---------- */
.contacts-map__frame {
    --lux-x: 50%;
    --lux-y: 50%;
    box-shadow: 0 50px 110px -52px rgba(53, 10, 10, 0.45);
    transition: box-shadow 0.85s var(--contacts-lux-ease), transform 0.85s var(--contacts-lux-ease);
}

.contacts-map__frame::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        radial-gradient(460px circle at var(--lux-x) var(--lux-y), transparent 20%, rgba(29, 5, 5, 0.018) 80%),
        linear-gradient(180deg, rgba(33, 5, 5, 0.02), rgba(33, 5, 5, 0.08));
    transition: opacity 0.65s ease;
}

.contacts-map__frame:hover {
    box-shadow: 0 58px 128px -54px rgba(53, 10, 10, 0.54);
}

.contacts-map__frame iframe {
    transform: scale(1.018);
    filter: grayscale(0.34) saturate(0.7) sepia(0.04) contrast(1.03);
    transition: filter 1.1s var(--contacts-lux-ease), transform 1.4s var(--contacts-lux-ease);
}

.contacts-map__frame:hover iframe {
    transform: scale(1.035);
    filter: grayscale(0.08) saturate(0.92) sepia(0) contrast(1.01);
}

.contacts-map__card {
    --card-shift-x: 0px;
    --card-shift-y: 0px;
    border-color: rgba(185, 150, 85, 0.32);
    background: rgba(255, 252, 247, 0.94);
    box-shadow:
        0 35px 80px -38px rgba(39, 0, 0, 0.52),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transform: translate3d(var(--card-shift-x), var(--card-shift-y), 0);
    transition:
        transform 0.7s var(--contacts-lux-ease),
        box-shadow 0.7s var(--contacts-lux-ease),
        border-color 0.7s ease,
        background 0.7s ease;
}

.contacts-map__card::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 46%;
    height: 1px;
    background: linear-gradient(90deg, var(--contacts-gold), transparent);
    opacity: 0.78;
}

.contacts-map__card:hover {
    transform: translate3d(var(--card-shift-x), calc(var(--card-shift-y) - 4px), 0);
    border-color: rgba(185, 150, 85, 0.54);
    box-shadow: 0 44px 92px -38px rgba(39, 0, 0, 0.58);
}

/* ---------- Scroll reveal system ---------- */
.contacts-lux-ready [data-lux-reveal] {
    opacity: 0;
    transform: translate3d(0, 24px, 0) scale(0.992);
    filter: blur(7px);
    transition:
        opacity 0.9s var(--contacts-lux-ease),
        transform 1.05s var(--contacts-lux-ease),
        filter 1s var(--contacts-lux-ease);
    transition-delay: var(--lux-delay, 0ms);
    will-change: opacity, transform, filter;
}

.contacts-lux-ready [data-lux-reveal="left"] {
    transform: translate3d(-28px, 12px, 0) scale(0.992);
}

.contacts-lux-ready [data-lux-reveal="right"] {
    transform: translate3d(28px, 12px, 0) scale(0.992);
}

.contacts-lux-ready [data-lux-reveal="scale"] {
    transform: translate3d(0, 14px, 0) scale(0.965);
}

.contacts-lux-ready [data-lux-reveal].is-lux-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
}

.contacts-lux-ready .contacts-info__title::after {
    transform: scaleX(0);
    transition: transform 1.2s var(--contacts-lux-ease) 0.6s;
}

.contacts-lux-ready .contacts-info__title.is-lux-visible::after,
.contacts-lux-ready .contacts-info:has(.contacts-info__title.is-lux-visible) .contacts-info__title::after {
    transform: scaleX(1);
}

/* ---------- Desktop only refinements ---------- */
@media (hover: hover) and (pointer: fine) {
    .contacts-detail,
    .contacts-social,
    .contacts-page .btn,
    .contacts-form__submit,
    .contacts-map__card {
        backface-visibility: hidden;
    }
}

/* ---------- Mobile: premium but calm ---------- */
@media (max-width: 620px) {
    .contacts-page::before {
        opacity: 0.1;
    }

    .contacts-hero__frame::before,
    .contacts-map__frame::after {
        display: none;
    }

    .contacts-detail {
        transform: none !important;
    }

    .contacts-form-card::after {
        opacity: 0.12;
    }
}

/* ---------- Accessibility / performance ---------- */
@media (prefers-reduced-motion: reduce) {
    .contacts-lux-ready [data-lux-reveal],
    .contacts-lux-ready [data-lux-reveal].is-lux-visible {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
        transition: none !important;
    }

    .contacts-form-card::before,
    .contacts-form-card::after {
        animation: none !important;
    }

    .contacts-detail,
    .contacts-social,
    .contacts-page .btn,
    .contacts-form__submit,
    .contacts-map__card,
    .contacts-map__frame iframe {
        transform: none !important;
        transition-duration: 0.01ms !important;
    }
}

/* Browka Luxury System v6 — alignment layer */
.contacts-page{padding-bottom:var(--bx-section)}
.contacts-hero,.contacts-map{padding-inline:var(--bx-pad)}
.contacts-hero{padding-top:clamp(10px,1.5vw,22px);padding-bottom:0}
.contacts-hero__frame{max-width:var(--bx-container);padding:12px;border-color:var(--bx-line-wine);border-radius:38px;background:linear-gradient(145deg,#fffefd,#fff8f4);box-shadow:var(--bx-shadow-soft)}
.contacts-info{border-radius:29px;border-color:rgba(128,0,0,.08);background:#fffdfb}
.contacts-info__title{font-size:clamp(50px,5.6vw,82px);font-weight:420;line-height:.92;letter-spacing:-.05em}
.contacts-details{gap:8px;background:transparent;border:0}
.contacts-detail{border:1px solid rgba(128,0,0,.1);border-radius:16px;background:#fffaf7}
.contacts-form-card{border-radius:29px;background:radial-gradient(420px circle at 95% 5%,rgba(217,143,103,.22),transparent 55%),linear-gradient(145deg,#320504,#7d0806 70%,#940b08)}
.contacts-social{border-radius:999px;border-color:rgba(128,0,0,.14);background:#fffaf7}
.contacts-map{padding-top:var(--bx-section)}
.contacts-map__frame{max-width:var(--bx-container);border-color:var(--bx-line-wine);border-radius:38px;box-shadow:var(--bx-shadow-soft)}
.contacts-map__card{border-radius:22px!important}
@media(max-width:640px){.contacts-hero,.contacts-map{padding-inline:10px}.contacts-hero__frame{padding:7px;border-radius:27px}.contacts-info,.contacts-form-card{border-radius:21px}.contacts-info{padding:30px 20px}.contacts-info__title{font-size:clamp(46px,14vw,62px)}.contacts-details{grid-template-columns:1fr}.contacts-map__frame{border-radius:27px}}
