@import url(../generic/_reset.css);
@import url(../generic/_animations.css);
@import url(../settings/_colors.css);
@import url(../settings/_fonts.css);
@import url(../components/_navbar.css);
@import url(../components/_icon__navbar--link-page.css);

:root {
    --offer-border: 1px solid var(--alabaster-gray);
    --offer-shadow: 0 20px 38px rgba(0, 0, 0, 0.12);
}

body {
    font-family: var(--montserrat);
    color: var(--black);
    min-height: 100vh;
    background:
        radial-gradient(circle at 82% 12%, rgba(111, 0, 255, 0.08), transparent 28%),
        radial-gradient(circle at 12% 30%, rgba(111, 0, 255, 0.12), transparent 30%),
        var(--lavender-mist);
}

.navbar__link-page--active {
    background: var(--eletric-indigo);
    color: var(--white);
    border-color: transparent;
}

.navbar__link-page--active .img-link-special-navbar {
    filter: grayscale(100%) brightness(0) invert(100%);
}

.offer-main {
    width: min(1120px, 92vw);
    margin: 3.2rem auto 4rem;
}

.offer-status {
    border: var(--offer-border);
    border-radius: 1rem;
    background: var(--white);
    box-shadow: var(--offer-shadow);
    text-align: center;
    padding: 0.9rem;
    font-size: 0.98rem;
    opacity: 0.84;
}

.offer-card {
    display: grid;
    grid-template-columns: 0.94fr 1.06fr;
    gap: 1.5rem;
    border: var(--offer-border);
    border-radius: 1.2rem;
    background: var(--white);
    box-shadow: var(--offer-shadow);
    padding: 1.2rem;
}

.offer-image-wrap {
    position: relative;
    min-height: 350px;
    border-radius: 0.95rem;
    overflow: hidden;
    border: var(--offer-border);
    background: linear-gradient(135deg, rgba(111, 0, 255, 0.22), rgba(195, 150, 255, 0.28));
}

.offer-image-wrap::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.42));
    pointer-events: none;
}

.offer-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.offer-market {
    position: absolute;
    left: 0.8rem;
    bottom: 0.8rem;
    z-index: 1;
    background: rgba(0, 0, 0, 0.62);
    color: #fff;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 700;
    padding: 0.3rem 0.7rem;
}

.offer-type {
    position: absolute;
    right: 0.8rem;
    bottom: 0.8rem;
    z-index: 1;
    background: rgba(111, 0, 255, 0.72);
    color: #fff;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 700;
    padding: 0.3rem 0.7rem;
}

.offer-type--digital {
    background: rgba(111, 0, 255, 0.72);
}

.offer-type--physical {
    background: rgba(28, 117, 188, 0.76);
}

.offer-content {
    display: flex;
    flex-direction: column;
    gap: 0.95rem;
}

.offer-content h1 {
    font-family: var(--poppins);
    font-size: clamp(1.7rem, 2.4vw, 2.4rem);
    line-height: 1.1;
}

.offer-content p {
    font-size: 1rem;
    opacity: 0.82;
}

.offer-price-rating {
    display: grid;
    gap: 0.2rem;
}

.offer-price {
    font-family: var(--poppins);
    font-size: clamp(1.5rem, 2.4vw, 2rem);
    font-weight: 700;
    color: var(--eletric-indigo);
    opacity: 1;
}

.offer-rating {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.offer-stars {
    letter-spacing: 0.12em;
    font-size: 1rem;
}

.offer-stars .star-filled {
    color: #f5b301;
}

.offer-stars .star-empty {
    color: #c8c8c8;
}

.offer-rating-value {
    font-weight: 700;
    font-size: 0.95rem;
}

.offer-reviews {
    opacity: 0.72;
    font-size: 0.9rem;
}

.offer-description-block,
.offer-extra-details,
.offer-program {
    display: grid;
    gap: 0.45rem;
}

.offer-description-block h2,
.offer-extra-details h2,
.offer-program h2 {
    font-family: var(--poppins);
    font-size: 1.05rem;
}

.offer-features {
    display: grid;
    gap: 0.45rem;
    padding-left: 1rem;
}

.offer-features li {
    line-height: 1.3;
    opacity: 0.9;
}

.offer-program-list {
    display: grid;
    gap: 0.35rem;
}

.offer-program-list li {
    line-height: 1.35;
    opacity: 0.92;
}

.offer-program-list strong {
    font-weight: 700;
}

.offer-details {
    display: grid;
    gap: 0.65rem;
    border-top: var(--offer-border);
    border-bottom: var(--offer-border);
    padding: 0.9rem 0;
}

.offer-detail-item {
    display: grid;
    gap: 0.2rem;
}

.offer-detail-item dt {
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--gray);
    font-weight: 700;
}

.offer-detail-item dd {
    margin: 0;
    font-weight: 600;
    word-break: break-all;
}

.offer-actions {
    display: flex;
    gap: 0.7rem;
    flex-wrap: wrap;
    margin-top: 0.2rem;
}

.offer-cta,
.offer-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    border-radius: 0.8rem;
    padding: 0.72rem 1rem;
    font-weight: 700;
}

.offer-cta {
    background: var(--eletric-indigo);
    color: var(--white);
}

.offer-cta[aria-disabled="true"] {
    pointer-events: none;
    opacity: 0.66;
}

.offer-secondary {
    background: transparent;
    color: var(--black);
    border: var(--offer-border);
}

.hidden {
    display: none;
}

@media (max-width: 1000px) {
    .offer-main {
        width: 92vw;
        margin-top: 1.6rem;
    }

    .offer-card {
        grid-template-columns: 1fr;
    }

    .offer-image-wrap {
        min-height: 240px;
    }

    .offer-actions a {
        width: 100%;
    }
}
