.altavista-tour-hero {
    align-items: flex-end;
    background:
        linear-gradient(90deg, rgba(18, 18, 17, 0.82) 0%, rgba(18, 18, 17, 0.48) 48%, rgba(18, 18, 17, 0.18) 100%),
        linear-gradient(0deg, rgba(18, 18, 17, 0.58), rgba(18, 18, 17, 0.12)),
        url('../uploads/images/sala.webp') center center / cover no-repeat;
    color: #fff;
    display: flex;
    min-height: 620px;
    padding: 170px 30px 78px;
    position: relative;
}

.altavista-tour-hero__inner {
    margin: 0 auto;
    max-width: 1320px;
    width: 100%;
}

.altavista-tour-hero__content {
    border-top: 1px solid rgba(255, 255, 255, 0.42);
    padding-top: 36px;
}

.altavista-tour-hero__breadcrumb {
    align-items: center;
    display: flex;
    gap: 18px;
    margin-bottom: 32px;
}

.altavista-tour-hero__breadcrumb a,
.altavista-tour-hero__breadcrumb span {
    color: rgba(255, 255, 255, 0.9);
    font-family: "Vend Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    text-transform: uppercase;
}

.altavista-tour-hero__breadcrumb span::before {
    content: "\00b7";
    margin-right: 18px;
}

.altavista-tour-hero h1 {
    color: #fff;
    font-family: "Space Grotesk", sans-serif;
    font-size: clamp(54px, 8vw, 118px);
    font-weight: 400;
    letter-spacing: 0;
    line-height: 0.92;
    margin: 0;
    text-transform: uppercase;
}

.altavista-tour-frame {
    background: #f7f0e7;
    padding: 70px 30px;
}

.altavista-tour-frame iframe {
    border: 0;
    border-radius: 12px;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.16);
    display: block;
    height: min(820px, 82vh);
    margin: 0 auto;
    max-width: 1320px;
    width: 100%;
}

.altavista-tour-hero--building {
    background:
        linear-gradient(90deg, rgba(18, 18, 17, 0.78) 0%, rgba(18, 18, 17, 0.48) 50%, rgba(18, 18, 17, 0.16) 100%),
        linear-gradient(0deg, rgba(18, 18, 17, 0.56), rgba(18, 18, 17, 0.08)),
        url('../uploads/images/torre-optimizada.webp') center center / cover no-repeat;
}

.altavista-building-selector {
    background: #f7f0e7;
    padding: 76px 30px 90px;
}

.altavista-building-selector__inner {
    align-items: center;
    display: grid;
    gap: 56px;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
    margin: 0 auto;
    max-width: 1320px;
}

.altavista-building-map {
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.14);
    overflow: hidden;
}

.altavista-building-map svg {
    display: block;
    height: auto;
    width: 100%;
}

.altavista-level-link {
    outline: none;
}

.altavista-level {
    cursor: pointer;
    opacity: 0.42;
    stroke: rgba(255, 255, 255, 0.72);
    stroke-width: 1;
    transition: opacity 0.18s ease, stroke-opacity 0.18s ease;
}

.altavista-level--available {
    fill: #2f7d3c;
}

.altavista-level--sold {
    fill: #c53b31;
}

.altavista-level.is-active {
    opacity: 0.62;
}

.altavista-level.is-muted {
    opacity: 0.18;
}

.altavista-level--ground {
    stroke-dasharray: 8 6;
}

.altavista-level-link:hover .altavista-level,
.altavista-level-link:focus .altavista-level {
    opacity: 0.68;
    stroke-opacity: 1;
}

.altavista-level-label {
    fill: #fff;
    font-family: "Vend Sans", sans-serif;
    font-size: 18px;
    font-weight: 700;
    pointer-events: none;
    text-anchor: middle;
    user-select: none;
}

.altavista-tower-label {
    fill: #fff;
    font-family: "Vend Sans", sans-serif;
    font-size: 22px;
    font-weight: 800;
    paint-order: stroke;
    pointer-events: none;
    stroke: rgba(18, 18, 17, 0.44);
    stroke-width: 5px;
    text-anchor: middle;
    text-transform: uppercase;
    user-select: none;
}

.altavista-tower-label.is-active {
    fill: #c6b57a;
}

.altavista-level-label.is-muted {
    opacity: 0.38;
}

.altavista-building-content {
    color: #2b2b2b;
}

.altavista-building-kicker {
    color: #a65133;
    display: block;
    font-family: "Vend Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0;
    margin-bottom: 18px;
    text-transform: uppercase;
}

.altavista-building-content h2 {
    color: #1d2d3b;
    font-family: "Space Grotesk", sans-serif;
    font-size: clamp(46px, 5vw, 78px);
    font-weight: 400;
    letter-spacing: 0;
    line-height: 0.98;
    margin: 0 0 28px;
}

.altavista-building-content p {
    color: #3f3f3f;
    font-family: "Vend Sans", sans-serif;
    font-size: 20px;
    line-height: 1.72;
    margin: 0 0 28px;
}

.altavista-building-legend {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 18px 28px;
    margin: 10px 0 34px;
}

.altavista-building-legend span {
    align-items: center;
    color: #333;
    display: inline-flex;
    font-family: "Vend Sans", sans-serif;
    font-size: 17px;
    gap: 10px;
}

.altavista-building-swatch {
    border-radius: 5px;
    display: inline-block;
    height: 16px;
    width: 30px;
}

.altavista-building-swatch--available {
    background: #2f7d3c;
}

.altavista-building-swatch--sold {
    background: #c53b31;
}

.altavista-tower-control {
    display: grid;
    gap: 8px;
    margin: 0 0 22px;
}

.altavista-tower-control label {
    color: #a65133;
    font-family: "Vend Sans", sans-serif;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
}

.altavista-tower-control select {
    appearance: none;
    background:
        linear-gradient(45deg, transparent 50%, #a65133 50%) calc(100% - 22px) 50% / 8px 8px no-repeat,
        linear-gradient(135deg, #a65133 50%, transparent 50%) calc(100% - 16px) 50% / 8px 8px no-repeat,
        #fff;
    border: 1px solid rgba(166, 81, 51, 0.32);
    border-radius: 12px;
    color: #1d2d3b;
    font-family: "Vend Sans", sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    min-height: 52px;
    padding: 0 46px 0 16px;
    width: 100%;
}

.altavista-tower-levels {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0 0 28px;
}

.altavista-tower-level-card {
    border-radius: 10px;
    display: grid;
    gap: 4px;
    min-height: 82px;
    padding: 14px 14px 13px;
    text-decoration: none;
}

.altavista-tower-level-card span {
    color: #fff;
    font-family: "Vend Sans", sans-serif;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.1;
}

.altavista-tower-level-card small {
    color: rgba(255, 255, 255, 0.86);
    font-family: "Vend Sans", sans-serif;
    font-size: 12px;
    line-height: 1.25;
}

.altavista-tower-level-card.is-available {
    background: #2f7d3c;
}

.altavista-tower-level-card.is-available:hover,
.altavista-tower-level-card.is-available:focus {
    background: #245f2f;
}

.altavista-tower-level-card.is-sold {
    background: #c53b31;
    cursor: not-allowed;
    opacity: 0.72;
}

.altavista-tower-level-card.is-ground-level {
    border: 2px solid rgba(198, 181, 122, 0.9);
}

.altavista-tower-levels__empty {
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(166, 81, 51, 0.18);
    border-radius: 12px;
    color: #5c5650;
    font-family: "Vend Sans", sans-serif;
    font-size: 16px !important;
    grid-column: 1 / -1;
    line-height: 1.45 !important;
    margin: 0 !important;
    padding: 18px;
}

.altavista-building-noscript {
    background: #f7f0e7;
    padding: 0 30px 60px;
    text-align: center;
}

.altavista-building-noscript a {
    background: #a65133;
    border-radius: 8px;
    color: #fff;
    display: inline-flex;
    font-family: "Vend Sans", sans-serif;
    font-weight: 700;
    min-height: 48px;
    padding: 0 28px;
    place-items: center;
    text-decoration: none;
}

.altavista-floor-selector__inner {
    align-items: start;
}

.altavista-floor-map svg {
    background: #fff;
}

.altavista-floor-placeholder {
    fill: #f4eadc;
}

.altavista-floor-grid line {
    stroke: rgba(166, 81, 51, 0.16);
    stroke-width: 2;
}

.altavista-floor-placeholder__title,
.altavista-floor-placeholder__copy {
    fill: rgba(29, 45, 59, 0.42);
    font-family: "Vend Sans", sans-serif;
    pointer-events: none;
    text-anchor: middle;
    user-select: none;
}

.altavista-floor-placeholder__title {
    font-size: 58px;
    font-weight: 800;
    text-transform: uppercase;
}

.altavista-floor-placeholder__copy {
    font-size: 28px;
    font-weight: 600;
}

.altavista-apartment-link {
    outline: none;
}

.altavista-apartment-shape {
    cursor: pointer;
    opacity: 0.36;
    stroke: rgba(255, 255, 255, 0.9);
    stroke-width: 3;
    transition: opacity 0.18s ease, stroke-opacity 0.18s ease;
}

.altavista-apartment-shape--available {
    fill: #2f7d3c;
}

.altavista-apartment-shape--sold {
    fill: #c53b31;
}

.altavista-apartment-link:hover .altavista-apartment-shape,
.altavista-apartment-link:focus .altavista-apartment-shape {
    opacity: 0.74;
    stroke-opacity: 1;
}

.altavista-apartment-label {
    fill: #fff;
    font-family: "Vend Sans", sans-serif;
    font-size: 38px;
    font-weight: 800;
    paint-order: stroke;
    pointer-events: none;
    stroke: rgba(18, 18, 17, 0.28);
    stroke-width: 5px;
    text-anchor: middle;
    user-select: none;
}

.altavista-floor-summary {
    background: #fff;
    border: 1px solid rgba(166, 81, 51, 0.16);
    border-radius: 12px;
    display: grid;
    gap: 2px;
    margin: -8px 0 22px;
    padding: 16px 18px;
}

.altavista-floor-summary span {
    color: #1d2d3b;
    font-family: "Vend Sans", sans-serif;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.15;
}

.altavista-floor-summary small {
    color: #6b6259;
    font-family: "Vend Sans", sans-serif;
    font-size: 14px;
    line-height: 1.3;
}

.altavista-apartment-list {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0 0 24px;
}

.altavista-apartment-card {
    border-radius: 10px;
    display: grid;
    gap: 4px;
    min-height: 76px;
    padding: 14px;
    text-decoration: none;
}

.altavista-apartment-card span {
    color: #fff;
    font-family: "Vend Sans", sans-serif;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.18;
}

.altavista-apartment-card small {
    color: rgba(255, 255, 255, 0.86);
    font-family: "Vend Sans", sans-serif;
    font-size: 12px;
    line-height: 1.25;
}

.altavista-apartment-card.is-available {
    background: #2f7d3c;
}

.altavista-apartment-card.is-available:hover,
.altavista-apartment-card.is-available:focus {
    background: #245f2f;
}

.altavista-apartment-card.is-sold {
    background: #c53b31;
    cursor: not-allowed;
    opacity: 0.72;
}

.altavista-floor-back {
    align-items: center;
    border: 1px solid rgba(166, 81, 51, 0.32);
    border-radius: 8px;
    color: #a65133;
    display: inline-flex;
    font-family: "Vend Sans", sans-serif;
    font-size: 15px;
    font-weight: 800;
    min-height: 46px;
    padding: 0 20px;
    text-decoration: none;
    text-transform: uppercase;
}

.altavista-floor-back:hover,
.altavista-floor-back:focus {
    background: #a65133;
    color: #fff;
}

.altavista-booking-plan img {
    display: block;
    height: auto;
    width: 100%;
}

.altavista-booking-form {
    display: grid;
    gap: 18px;
    margin-top: 30px;
}

.altavista-booking-form__row {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.altavista-booking-form .altavista-tower-control {
    margin: 0;
}

.altavista-booking-form input {
    background: #fff;
    border: 1px solid rgba(166, 81, 51, 0.32);
    border-radius: 12px;
    color: #1d2d3b;
    font-family: "Vend Sans", sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    min-height: 52px;
    outline: none;
    padding: 0 16px;
    width: 100%;
}

.altavista-booking-form input:focus {
    border-color: rgba(166, 81, 51, 0.74);
    box-shadow: 0 0 0 4px rgba(166, 81, 51, 0.12);
}

.altavista-booking-submit {
    align-items: center;
    background: #a65133;
    border: 0;
    border-radius: 8px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-family: "Vend Sans", sans-serif;
    font-size: 15px;
    font-weight: 800;
    justify-content: center;
    min-height: 46px;
    padding: 0 24px;
    text-transform: uppercase;
    width: fit-content;
}

.altavista-booking-submit:hover,
.altavista-booking-submit:focus {
    background: #824028;
}

.altavista-booking-submit:disabled {
    cursor: wait;
    opacity: 0.7;
}

.altavista-booking-form__message {
    border-radius: 10px;
    font-family: "Vend Sans", sans-serif;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.45;
    margin: 0;
    padding: 14px 16px;
}

.altavista-booking-form__message.is-success {
    background: rgba(47, 125, 60, 0.12);
    color: #245f2f;
}

.altavista-booking-form__message.is-error {
    background: rgba(197, 59, 49, 0.12);
    color: #9c2f27;
}

@media (max-width: 820px) {
    .altavista-tour-hero {
        min-height: 520px;
        padding: 140px 18px 52px;
    }

    .altavista-tour-frame {
        padding: 36px 18px;
    }

    .altavista-tour-frame iframe {
        height: 680px;
    }

    .altavista-building-selector {
        padding: 42px 18px 58px;
    }

    .altavista-building-selector__inner {
        gap: 34px;
        grid-template-columns: 1fr;
    }

    .altavista-building-content {
        order: -1;
    }

    .altavista-building-content h2 {
        font-size: clamp(42px, 12vw, 62px);
    }

    .altavista-building-content p {
        font-size: 17px;
        line-height: 1.58;
    }

    .altavista-building-map {
        border-radius: 12px;
    }

    .altavista-tower-control select {
        min-height: 50px;
    }

    .altavista-tower-levels {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .altavista-apartment-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .altavista-tower-level-card {
        min-height: 74px;
        padding: 12px;
    }

    .altavista-tower-level-card span {
        font-size: 16px;
    }

    .altavista-tower-level-card small {
        font-size: 11px;
    }

    .altavista-level-label {
        font-size: 24px;
    }

    .altavista-tower-label {
        font-size: 28px;
    }

    .altavista-floor-placeholder__title {
        font-size: 76px;
    }

    .altavista-floor-placeholder__copy {
        font-size: 34px;
    }

    .altavista-apartment-label {
        font-size: 48px;
    }

    .altavista-booking-form,
    .altavista-booking-form__row {
        gap: 18px;
    }
}

@media (max-width: 480px) {
    .altavista-building-selector {
        padding: 34px 14px 48px;
    }

    .altavista-building-content h2 {
        font-size: clamp(34px, 11vw, 48px);
    }

    .altavista-building-legend {
        gap: 12px 18px;
    }

    .altavista-building-legend span {
        font-size: 15px;
    }

    .altavista-tower-levels {
        gap: 8px;
        grid-template-columns: 1fr;
    }

    .altavista-apartment-list {
        gap: 8px;
        grid-template-columns: 1fr;
    }

    .altavista-building-map {
        margin-left: -4px;
        margin-right: -4px;
    }

    .altavista-booking-form__row {
        grid-template-columns: 1fr;
    }

    .altavista-booking-submit {
        width: 100%;
    }
}