/* ==========================================================================
   Offers page (/{locale}/offers)
   Legacy "glass card" look rebuilt on the site's root.css tokens.
   All selectors are prefixed .offers- so nothing leaks into other pages.
   ========================================================================== */

.offers-page {
    --of-red: var(--main-600);
    --of-pink: var(--main-two-600);
    --of-grad: linear-gradient(90deg, var(--main-600), var(--main-two-600));
    --of-surface: rgba(255, 255, 255, .04);
    --of-surface-2: rgba(255, 255, 255, .07);
    --of-border: rgba(255, 255, 255, .08);
    --of-border-2: rgba(255, 255, 255, .15);
    --of-text: #fff;
    --of-muted: var(--neutral-100);
    --of-dim: var(--neutral-90);
    --of-radius: 1rem;
    --of-radius-lg: 1.5rem;
    color: var(--of-text);
}

.offers-page [hidden],
.offers-modal [hidden],
.offers-drawer [hidden] { display: none !important; }

.offers-muted { color: var(--of-muted); }
.offers-small { font-size: .8125rem; line-height: 1.6; }
.offers-text-purple { color: #c084fc; }
.offers-flip-rtl { display: inline-block; }
[dir="rtl"] .offers-flip-rtl { transform: scaleX(-1); }
.offers-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--of-red); flex-shrink: 0; }

/* ---- Header + partner picker ------------------------------------------ */
.offers-head { margin-bottom: 2rem; }
.offers-eyebrow {
    color: var(--of-red);
    font-size: .875rem;
    font-weight: 700;
    letter-spacing: .35em;
    text-transform: uppercase;
    margin-bottom: 1rem;
}
.offers-head__title { font-size: clamp(1.75rem, 4vw, 2.5rem); font-weight: 900; color: #fff; margin-bottom: 1rem; }
.offers-head__intro { color: var(--of-muted); max-width: 42rem; margin: 0 auto; }

.offers-partners { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-bottom: 2.5rem; }
.offers-partner {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem;
    overflow: hidden;
    color: #fff;
    text-align: center;
    background: var(--of-surface);
    border: 1px solid var(--of-border);
    border-radius: var(--of-radius);
    transition: transform .3s cubic-bezier(.34, 1.56, .64, 1), border-color .3s, background-color .3s, box-shadow .3s;
}
.offers-partner:hover { transform: translateY(-3px); border-color: var(--of-border-2); background: var(--of-surface-2); }
.offers-partner:focus-visible { outline: 2px solid var(--of-red); outline-offset: 2px; }
.offers-partner.is-active {
    transform: translateY(-8px) scale(1.03);
    border-color: var(--of-red);
    background: rgba(255, 255, 255, .08);
    box-shadow: 0 24px 70px -34px rgba(236, 72, 153, .55);
}
.offers-partner__bar { position: absolute; inset: 0 0 auto; height: 4px; background: var(--of-grad); opacity: .3; transition: opacity .3s; }
.offers-partner:hover .offers-partner__bar { opacity: .6; }
.offers-partner.is-active .offers-partner__bar { opacity: 1; }
.offers-partner__logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 4rem;
    padding: .75rem;
    background: #000;
    border-radius: .75rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .2);
}
.offers-partner__logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.offers-partner__title { margin-top: .75rem; font-weight: 700; font-size: 1rem; }
.offers-partner__sub { margin-top: .125rem; font-size: .75rem; color: var(--of-muted); }
.offers-partner__state {
    margin-top: .75rem;
    padding: .25rem 1rem;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--neutral-200);
    background: var(--of-surface);
    border: 1px solid var(--of-border);
    border-radius: 999px;
}
.offers-partner.is-active .offers-partner__state { color: var(--main-300); background: rgba(220, 38, 38, .15); border-color: rgba(239, 68, 68, .5); }

/* Panels fade (opacity only: transforms on ancestors would trap fixed modals) */
.offers-panel { animation: offers-fade .3s ease-out; }
.offers-fade { animation: offers-fade .35s ease-out; }
@keyframes offers-fade { from { opacity: 0; } to { opacity: 1; } }

/* ---- Shared shells / cards -------------------------------------------- */
.offers-shell {
    position: relative;
    padding: 2rem;
    background: var(--of-surface);
    border: 1px solid var(--of-border);
    border-radius: 2rem;
    box-shadow: 0 30px 80px -40px rgba(236, 72, 153, .45);
}
.offers-card {
    position: relative;
    margin-bottom: 1.25rem;
    padding: 2rem;
    background: var(--of-surface);
    border: 1px solid var(--of-border);
    border-radius: var(--of-radius);
}
.offers-box { margin-bottom: 1.5rem; padding: 1.5rem; background: rgba(255, 255, 255, .03); border: 1px solid var(--of-border); border-radius: var(--of-radius); }
.offers-box__title { font-size: 1.125rem; font-weight: 700; color: #fff; margin-bottom: .5rem; }
.offers-section-title { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 900; color: #fff; margin-bottom: .25rem; }
.offers-label { margin-bottom: 1rem; font-size: .75rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--of-dim); }

.offers-pill {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    padding: .25rem .75rem;
    font-size: .75rem;
    font-weight: 700;
    border-radius: 999px;
    border: 1px solid;
}
.offers-pill--green { color: #4ade80; background: rgba(34, 197, 94, .15); border-color: rgba(34, 197, 94, .25); }
.offers-pill--purple { color: #c084fc; background: rgba(168, 85, 247, .15); border-color: rgba(168, 85, 247, .25); }

.offers-level, .offers-tag {
    display: inline-block;
    padding: .125rem .5rem;
    font-size: .6875rem;
    font-weight: 600;
    border: 1px solid;
    border-radius: 999px;
}
.offers-level--beginner { color: #4ade80; background: rgba(34, 197, 94, .2); border-color: rgba(34, 197, 94, .3); }
.offers-level--intermediate { color: #60a5fa; background: rgba(59, 130, 246, .2); border-color: rgba(59, 130, 246, .3); }
.offers-level--advanced { color: #fb923c; background: rgba(249, 115, 22, .2); border-color: rgba(249, 115, 22, .3); }
.offers-level--professional { color: #c084fc; background: rgba(168, 85, 247, .2); border-color: rgba(168, 85, 247, .3); }
.offers-level--expert { color: #f87171; background: rgba(239, 68, 68, .2); border-color: rgba(239, 68, 68, .3); }
.offers-comptia .offers-level--intermediate { color: #fbbf24; background: rgba(245, 158, 11, .15); border-color: rgba(245, 158, 11, .25); }
.offers-comptia .offers-level--advanced { color: #f87171; background: rgba(239, 68, 68, .15); border-color: rgba(239, 68, 68, .25); }
.offers-tag { color: var(--neutral-200); background: rgba(255, 255, 255, .05); border-color: rgba(255, 255, 255, .1); border-radius: .375rem; }

.offers-alert {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    padding: .75rem;
    font-size: .8125rem;
    border: 1px solid;
    border-radius: .75rem;
}
.offers-alert i { margin-top: .15rem; flex-shrink: 0; }
.offers-alert--yellow { color: rgba(253, 224, 71, .85); background: rgba(113, 63, 18, .15); border-color: rgba(234, 179, 8, .2); }
.offers-alert--yellow i { color: #facc15; }
.offers-alert--red { color: rgba(252, 165, 165, .85); background: rgba(127, 29, 29, .15); border-color: rgba(239, 68, 68, .2); }
.offers-disclaimer {
    padding: 1rem;
    font-size: .75rem;
    text-align: center;
    color: rgba(252, 165, 165, .75);
    background: rgba(127, 29, 29, .1);
    border: 1px solid rgba(239, 68, 68, .15);
    border-radius: .75rem;
}

.offers-price-big { font-size: clamp(2.75rem, 6vw, 3.75rem); font-weight: 900; color: #fff; line-height: 1; }
.offers-price-old { font-size: 1.25rem; color: var(--of-dim); text-decoration: line-through; }
.offers-price-stack { display: inline-flex; flex-direction: column; align-items: flex-start; gap: .25rem; }
.offers-price-stack--center { align-items: center; }
.offers-price-stack--end { align-items: flex-end; }
.offers-price-egp { font-size: .9375rem; font-weight: 700; line-height: 1.2; color: #86efac; }
.offers-price-egp--sm { margin-top: .125rem; font-size: .8125rem; }
.offers-price-egp--inline { margin-inline-start: .375rem; }

.offers-cta { padding-block: 1rem; font-weight: 700; }
.offers-cta.disabled, .offers-cta[aria-disabled="true"] { opacity: .5; pointer-events: none; }
.offers-cta--purple { color: #fff; background: #9333ea; border-color: #9333ea; }
.offers-cta--purple:hover { color: #fff; background: #a855f7; }
.offers-cta--purple.disabled { color: var(--of-dim); background: rgba(255, 255, 255, .08); border-color: transparent; }
.offers-btn-sm { padding: .625rem 1.25rem; font-size: .875rem; font-weight: 700; }
.offers-btn-ghost {
    flex: 1;
    padding: .625rem 1rem;
    font-size: .875rem;
    font-weight: 600;
    color: var(--neutral-200);
    background: var(--of-surface);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 999px;
}
.offers-btn-ghost:hover { background: rgba(255, 255, 255, .08); }
.offers-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    flex-shrink: 0;
    color: var(--neutral-200);
    background: var(--of-surface);
    border: 1px solid var(--of-border);
    border-radius: .75rem;
}
.offers-icon-btn:hover { color: #fff; background: rgba(255, 255, 255, .08); }
.offers-icon-tile {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    flex-shrink: 0;
    font-size: 1.75rem;
    color: #fff;
    background: linear-gradient(135deg, var(--main-500), var(--main-two-500));
    border-radius: 1.5rem;
    box-shadow: 0 10px 15px -3px rgba(220, 38, 38, .2);
}
.offers-icon-tile--sm { width: 2.5rem; height: 2.5rem; font-size: 1.25rem; border-radius: 1rem; color: var(--main-300); background: rgba(220, 38, 38, .15); border: 1px solid rgba(239, 68, 68, .2); box-shadow: none; }

/* ---- Accordion (native <details>) ------------------------------------- */
.offers-accordion { margin-bottom: 1.25rem; overflow: hidden; background: rgba(255, 255, 255, .03); border: 1px solid rgba(255, 255, 255, .1); border-radius: var(--of-radius); }
.offers-accordion__head { display: flex; align-items: center; gap: .75rem; padding: 1.25rem; cursor: pointer; list-style: none; transition: background-color .2s; }
.offers-accordion__head::-webkit-details-marker { display: none; }
.offers-accordion__head:hover { background: rgba(255, 255, 255, .04); }
.offers-accordion__icon { display: flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; flex-shrink: 0; background: rgba(255, 255, 255, .08); border-radius: .75rem; }
.offers-accordion__titles { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.offers-accordion__title { font-size: .875rem; font-weight: 700; color: #fff; }
.offers-accordion__sub { margin-top: .125rem; font-size: .75rem; color: var(--of-dim); }
.offers-accordion__caret { color: var(--of-dim); transition: transform .2s; }
.offers-accordion[open] .offers-accordion__caret { transform: rotate(180deg); }
.offers-accordion__body { padding: .25rem 1.25rem 1.25rem; animation: offers-fade .28s ease-out; }

.offers-regions { display: grid; gap: .5rem; margin-bottom: 1rem; }
@media (min-width: 576px) { .offers-regions { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.offers-region { display: flex; align-items: flex-start; gap: .75rem; padding: .75rem; font-size: .875rem; background: var(--of-surface); border-radius: .75rem; }
.offers-region__flag { font-size: 1.125rem; line-height: 1.3; }
.offers-region__name { font-weight: 600; color: #fff; }
.offers-region__desc { margin-top: .125rem; font-size: .75rem; color: var(--of-muted); }
.offers-methods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; margin-bottom: 1rem; }
@media (min-width: 400px) { .offers-methods { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.offers-method { display: flex; align-items: center; justify-content: center; height: 3.5rem; padding: .75rem; background: #fff; border-radius: .75rem; }
.offers-method img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }

/* ---- INE -------------------------------------------------------------- */
.offers-ine { overflow: hidden; background: #070a0f; border-color: rgba(255, 255, 255, .1); }
.offers-ine::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .028;
    background-image: linear-gradient(rgba(255, 255, 255, .18) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .18) 1px, transparent 1px);
    background-size: 44px 44px;
}
.offers-ine::after {
    content: "";
    position: absolute;
    top: -8%;
    inset-inline-start: 15%;
    width: 700px;
    height: 700px;
    pointer-events: none;
    border-radius: 50%;
    background: rgba(185, 28, 28, .09);
    filter: blur(130px);
}
.offers-ine > * { position: relative; z-index: 1; }
.offers-ine__header { margin-bottom: 2.5rem; }
.offers-ine__logos { display: flex; align-items: center; justify-content: center; gap: 1.25rem; margin-bottom: 1.5rem; }
.offers-ine__logo-rn { height: 4rem; width: auto; }
.offers-ine__logo-ine { height: 3rem; width: auto; }
.offers-ine__x { font-size: 1.5rem; font-weight: 900; color: var(--of-red); opacity: .6; }
.offers-ine__title { font-size: clamp(1.875rem, 5vw, 3rem); font-weight: 900; color: #fff; margin-bottom: .5rem; }
.offers-ine__title span { color: var(--of-red); }

.offers-tabs-wrap { display: flex; justify-content: center; margin-bottom: 2.5rem; }
.offers-tabs { display: inline-flex; flex-wrap: wrap; justify-content: center; gap: .25rem; padding: .375rem; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1); border-radius: var(--of-radius); }
.offers-tab {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .625rem 1rem;
    font-size: .875rem;
    font-weight: 600;
    color: var(--neutral-100);
    background: transparent;
    border: 0;
    border-radius: .75rem;
    transition: background-color .2s, color .2s;
}
.offers-tab:hover { color: #fff; background: rgba(255, 255, 255, .08); }
.offers-tab.is-active { color: #fff; background: var(--of-red); box-shadow: 0 10px 15px -3px rgba(185, 28, 28, .3); }

.offers-segment-wrap { display: flex; justify-content: center; margin-bottom: 1.5rem; transition: opacity .3s; }
.offers-segment-wrap.is-disabled { opacity: .5; pointer-events: none; }
.offers-segment { display: inline-flex; gap: .25rem; padding: .25rem; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1); border-radius: .75rem; }
.offers-segment__btn {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .625rem 1.25rem;
    font-size: .875rem;
    font-weight: 600;
    color: var(--neutral-100);
    background: transparent;
    border: 0;
    border-radius: .5rem;
    transition: background-color .2s, color .2s;
}
.offers-segment__btn:hover { color: #fff; }
.offers-segment__btn.is-active { color: #fff; background: var(--of-red); box-shadow: 0 4px 6px -1px rgba(185, 28, 28, .3); }

.offers-ine__plan.is-out { opacity: .6; }
.offers-ine__plan.is-out::after { content: ""; position: absolute; inset: 0; z-index: 2; cursor: not-allowed; }
.offers-badge-out {
    position: absolute;
    top: .5rem;
    inset-inline-end: .5rem;
    z-index: 3;
    padding: .25rem .5rem;
    font-size: .625rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
    background: #dc2626;
    border-radius: 999px;
}
.offers-badge-out--corner { top: 1rem; inset-inline-end: 1rem; padding: .375rem .75rem; font-size: .75rem; }

.offers-ine__price { min-height: 120px; margin: .75rem 0 1.25rem; }
.offers-ine__price-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: .75rem; }
.offers-ine__price-row .offers-price-big { transition: opacity .2s; }
.offers-ine__breakdown { height: 1.2em; margin: .25rem 0 0; font-size: .75rem; color: #60a5fa; opacity: 0; transition: opacity .2s; }
.offers-ine__breakdown.is-visible { opacity: 1; }

.offers-checklist { margin: 0 0 1.5rem; padding: 0; list-style: none; }
.offers-checklist li { display: flex; align-items: flex-start; gap: .75rem; margin-bottom: .75rem; font-size: .875rem; color: var(--neutral-200); }
.offers-checklist i { margin-top: .125rem; color: #f87171; }

.offers-addon {
    position: relative;
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-bottom: 1rem;
    padding: .875rem;
    cursor: pointer;
    background: rgba(30, 58, 138, .15);
    border: 1px solid rgba(59, 130, 246, .2);
    border-radius: .75rem;
    transition: background-color .2s;
}
.offers-addon:hover { background: rgba(30, 58, 138, .25); }
.offers-addon.is-disabled { cursor: not-allowed; opacity: .6; background: rgba(31, 41, 55, .4); border-color: #374151; }
.offers-addon input { width: 1rem; height: 1rem; flex-shrink: 0; accent-color: #3b82f6; }
.offers-addon__text { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.offers-addon__title { font-size: .875rem; font-weight: 600; color: #93c5fd; }
.offers-addon__hint { margin-top: .125rem; font-size: .75rem; color: var(--of-dim); }
.offers-addon__logo { display: flex; align-items: center; justify-content: center; width: 8rem; height: 4rem; flex-shrink: 0; padding: .75rem; background: #fff; border-radius: 1rem; }
.offers-addon__logo img { max-width: 100%; max-height: 100%; object-fit: contain; }

.offers-stepper { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; padding: .875rem; background: var(--of-surface); border: 1px solid var(--of-border); border-radius: .75rem; }
.offers-stepper__label { display: block; font-size: .875rem; font-weight: 600; color: var(--neutral-200); }
.offers-stepper__hint { display: block; margin-top: .125rem; font-size: .75rem; color: var(--of-dim); }
.offers-stepper__controls { display: flex; align-items: center; gap: .75rem; }
.offers-stepper__controls button { width: 2rem; height: 2rem; font-size: 1.125rem; font-weight: 700; color: #fff; background: rgba(255, 255, 255, .08); border: 0; border-radius: .5rem; }
.offers-stepper__controls button:hover { background: rgba(255, 255, 255, .14); }
.offers-stepper__controls span { width: 1.5rem; text-align: center; font-weight: 700; }

.offers-features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; margin-bottom: 1rem; }
.offers-feature { display: flex; align-items: center; gap: .5rem; padding: .75rem; font-size: .875rem; color: var(--neutral-200); background: var(--of-surface); border-radius: .75rem; }

.offers-install { margin-top: .75rem; padding: 1rem; border: 1px solid; border-radius: .75rem; }
.offers-install__title { display: flex; align-items: center; gap: .5rem; margin-bottom: .625rem; font-size: .875rem; font-weight: 700; }
.offers-install ul { margin: 0; padding-inline-start: 1.1rem; }
.offers-install li { margin-bottom: .375rem; font-size: .875rem; color: var(--neutral-200); }
.offers-install--good { background: var(--of-surface); border-color: var(--of-border); }
.offers-install--good .offers-install__title { color: #4ade80; }
.offers-install--good li::marker { color: var(--of-dim); }
.offers-install--currency { background: rgba(30, 58, 138, .18); border-color: rgba(59, 130, 246, .2); }
.offers-install--currency .offers-install__title, .offers-install--currency li::marker { color: #60a5fa; }
.offers-install--warn { background: rgba(113, 63, 18, .18); border-color: rgba(234, 179, 8, .25); }
.offers-install--warn .offers-install__title, .offers-install--warn li::marker { color: #facc15; }

.offers-ine__certs { margin: 2rem 0; }
.offers-ine__choose { margin-bottom: 1.25rem; font-size: .875rem; font-weight: 600; color: #f87171; }
.offers-cert-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; }
.offers-cert {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 150px;
    padding: .75rem;
    color: #fff;
    text-align: center;
    background: var(--of-surface);
    border: 1px solid var(--of-border);
    border-radius: var(--of-radius);
}
.offers-cert img { width: 3.5rem; height: 3.5rem; margin-bottom: .5rem; object-fit: contain; }
.offers-cert__name { font-size: .75rem; font-weight: 700; line-height: 1.2; }
.offers-cert .offers-level { margin-top: .375rem; font-size: .625rem; }
.offers-cert--pick { width: 140px; transition: transform .15s, background-color .2s, border-color .2s; }
.offers-cert--pick:hover { transform: translateY(-3px); border-color: var(--of-border-2); background: rgba(255, 255, 255, .08); }
.offers-cert--pick[aria-pressed="true"] { border-color: #ef4444; background: rgba(220, 38, 38, .2); box-shadow: 0 4px 6px -1px rgba(220, 38, 38, .15); }
.offers-cert__check { margin-top: .25rem; font-size: .875rem; opacity: 0; transform: scale(0); transition: opacity .2s, transform .2s; }
.offers-cert--pick[aria-pressed="true"] .offers-cert__check { opacity: 1; transform: scale(1); }

.offers-ine__vhead { margin-bottom: 2rem; }
.offers-ine__vdesc { max-width: 32rem; }
.offers-info { display: flex; align-items: center; gap: .75rem; height: 100%; padding: 1rem; font-size: .875rem; background: var(--of-surface); border: 1px solid var(--of-border); border-radius: .75rem; }
.offers-info i { font-size: 1.25rem; flex-shrink: 0; }
.offers-info p { margin: 0; color: var(--neutral-200); }
.offers-mail { display: block; font-family: monospace; font-size: .75rem; color: #f87171; text-decoration: underline; }
.offers-mail:hover { color: #fca5a5; }
.offers-vprice { display: flex; flex-direction: column; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; padding: 1.25rem; background: rgba(88, 28, 135, .15); border: 1px solid rgba(168, 85, 247, .2); border-radius: var(--of-radius); }
@media (min-width: 576px) { .offers-vprice { flex-direction: row; } }
.offers-vprice__amount { display: flex; align-items: center; gap: .75rem; }
.offers-vprice__amount .offers-price-big { font-size: 3rem; }
.offers-vprice__pills { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; }
.offers-selected { display: flex; align-items: center; gap: .75rem; margin-bottom: 1.25rem; padding: 1rem; background: rgba(127, 29, 29, .15); border: 1px solid rgba(239, 68, 68, .25); border-radius: var(--of-radius); animation: offers-fade .2s; }
.offers-selected img { width: 2.5rem; height: 2.5rem; flex-shrink: 0; object-fit: contain; }
.offers-ine [data-ine-buy] { margin-bottom: 2rem; }

.offers-ine__footer { display: flex; flex-direction: column; align-items: center; gap: 1rem; margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--of-border); text-align: center; }
.offers-ine__footer p { max-width: 28rem; margin: 0; font-size: .75rem; color: var(--of-dim); }
.offers-ine__footer-logos { display: flex; align-items: center; gap: 1.5rem; opacity: .25; }
.offers-ine__footer-logos img:first-child { height: 2rem; }
.offers-ine__footer-logos img:last-child { height: 1.5rem; }
.offers-ine__footer a { display: inline-flex; align-items: center; gap: .375rem; font-size: .75rem; color: var(--neutral-80); }
.offers-ine__footer a:hover { color: var(--neutral-100); }

/* ---- CompTIA ---------------------------------------------------------- */
.offers-panel-head { display: flex; flex-direction: column; gap: 1rem; margin-bottom: 1.5rem; }
@media (min-width: 576px) { .offers-panel-head { flex-direction: row; align-items: center; justify-content: space-between; } }
.offers-panel-head__main { display: flex; align-items: center; gap: 1rem; }
.offers-panel-head__title { font-size: 1.5rem; font-weight: 700; color: #fff; margin-bottom: .125rem; }
.offers-activation { display: flex; align-items: center; gap: .5rem; padding: .625rem 1rem; background: rgba(127, 29, 29, .15); border: 1px solid rgba(239, 68, 68, .25); border-radius: var(--of-radius); }
.offers-activation i { font-size: 1.25rem; color: #f87171; }
.offers-activation__title { margin: 0; font-size: .875rem; font-weight: 600; color: #fca5a5; }
.offers-activation__sub { margin: 0; font-size: .6875rem; color: rgba(248, 113, 113, .7); }

.offers-benefits { display: grid; gap: .75rem; margin-top: 1.25rem; }
@media (min-width: 576px) { .offers-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 992px) { .offers-benefits { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.offers-benefit { display: flex; gap: .75rem; padding: .75rem; background: rgba(255, 255, 255, .03); border: 1px solid rgba(255, 255, 255, .06); border-radius: .75rem; }
.offers-benefit i { font-size: 1.25rem; color: #f87171; flex-shrink: 0; }
.offers-benefit__title { margin: 0; font-size: .875rem; font-weight: 600; color: #fff; }
.offers-benefit__desc { margin: .125rem 0 0; font-size: .75rem; color: var(--of-muted); }

.offers-region-bar { display: flex; flex-direction: column; gap: .75rem; margin-bottom: 1.5rem; padding: 1rem; background: rgba(255, 255, 255, .03); border: 1px solid var(--of-border); border-radius: var(--of-radius); }
@media (min-width: 576px) { .offers-region-bar { flex-direction: row; align-items: center; justify-content: space-between; } }
.offers-region-bar__text { display: flex; align-items: center; gap: .75rem; }
.offers-region-bar__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.offers-market { padding: .25rem .75rem; font-size: .75rem; font-weight: 600; color: var(--neutral-200); background: var(--of-surface); border: 1px solid rgba(255, 255, 255, .1); border-radius: 999px; }
.offers-market.is-special { color: #6ee7b7; background: rgba(16, 185, 129, .1); border-color: rgba(16, 185, 129, .3); }

.offers-comptia__grid-wrap { position: relative; }
.offers-comptia__grid { display: grid; gap: 1rem; }
@media (min-width: 480px) { .offers-comptia__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 992px) { .offers-comptia__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.offers-comptia.is-gated .offers-comptia__grid-wrap { max-height: 85vh; overflow: hidden; }
.offers-comptia.is-gated .offers-comptia__grid { pointer-events: none; user-select: none; }
.offers-gate { display: none; }
.offers-comptia.is-gated .offers-gate {
    position: absolute;
    inset: 0;
    z-index: 5;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 1.5rem 1rem;
    background: linear-gradient(to bottom, transparent, rgba(2, 6, 23, .8) 50%, #020617);
}
.offers-gate__card { width: 100%; max-width: 28rem; padding: 1.5rem; text-align: center; background: rgba(15, 23, 42, .95); border: 1px solid var(--of-border); border-radius: var(--of-radius); box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .5); animation: offers-fade .35s ease-out; }
.offers-gate__title { margin: 1rem 0 .5rem; font-size: 1.125rem; font-weight: 700; color: #fff; }

.offers-vcard {
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--of-surface);
    border: 1px solid var(--of-border);
    border-radius: var(--of-radius);
    transition: transform .25s, border-color .25s;
}
.offers-vcard:hover { transform: translateY(-4px); border-color: rgba(239, 68, 68, .4); }
.offers-vcard__popular { position: absolute; top: .75rem; inset-inline-end: .75rem; z-index: 2; padding: .125rem .625rem; font-size: .625rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #fff; background: rgba(220, 38, 38, .9); border: 1px solid rgba(239, 68, 68, .4); border-radius: 999px; }
.offers-vcard__discount { position: absolute; top: .75rem; inset-inline-start: .75rem; z-index: 2; display: inline-flex; align-items: center; gap: .25rem; padding: .25rem .625rem; font-size: .6875rem; font-weight: 900; color: #fff; background: var(--of-grad); border-radius: 999px; box-shadow: 0 10px 15px -3px rgba(220, 38, 38, .3); }
.offers-vcard__hero { position: relative; display: flex; align-items: center; justify-content: center; height: 13rem; padding: 1rem; background: rgba(2, 6, 23, .2); border-radius: 1.5rem; transition: transform .3s; }
.offers-vcard__hero:hover { transform: scale(1.05); }
.offers-vcard__hero img { max-width: 100%; max-height: 100%; object-fit: contain; filter: drop-shadow(0 20px 13px rgba(0, 0, 0, .1)); }
.offers-vcard__fallback { font-size: 8rem; color: #ef4444; }
.offers-ribbon {
    position: absolute;
    bottom: .25rem;
    left: 50%;
    padding: .35em .9em;
    font-size: .85rem;
    font-weight: 900;
    letter-spacing: .15em;
    white-space: nowrap;
    color: #fff;
    background: linear-gradient(135deg, #06b6d4, #3b82f6);
    box-shadow: 0 4px 15px rgba(6, 182, 212, .35);
    transform: translateX(-50%);
    transition: transform .4s cubic-bezier(.34, 1.56, .64, 1);
}
.offers-vcard:hover .offers-ribbon { transform: translateX(-50%) rotate(-20deg) skew(-20deg, 10deg); }
.offers-vcard__body { display: flex; flex-direction: column; flex: 1; padding: .75rem; text-align: center; }
.offers-vcard__name { margin: 0; font-size: 1rem; font-weight: 900; color: #fff; }
.offers-vcard__version { padding: .125rem .375rem; font-size: .5625rem; font-weight: 600; vertical-align: middle; color: #22d3ee; background: rgba(6, 182, 212, .08); border: 1px solid rgba(6, 182, 212, .2); border-radius: .25rem; }
.offers-vcard__code { margin: .125rem 0 0; font-family: monospace; font-size: .625rem; letter-spacing: .03em; color: var(--of-dim); }
.offers-vcard__tags { display: flex; flex-wrap: wrap; justify-content: center; gap: .375rem; margin-top: .375rem; }
.offers-vcard__desc { margin: .375rem 0 0; font-size: .75rem; line-height: 1.65; color: var(--of-muted); }
.offers-vcard__foot { margin-top: auto; padding-top: 1rem; }
.offers-vcard__from { margin: 0; font-size: .6875rem; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: var(--of-dim); }
.offers-vcard__prices { display: flex; align-items: center; justify-content: center; gap: .5rem; margin-top: .25rem; }
.offers-vcard__prices .offers-price-old { font-size: .875rem; }
.offers-vcard__price { font-size: 1.875rem; font-weight: 900; color: #fff; }
.offers-vcard__labs { margin-top: .5rem; padding: .5rem .75rem; font-size: .75rem; color: var(--neutral-200); background: rgba(255, 255, 255, .03); border: 1px solid var(--of-border); border-radius: .75rem; }
.offers-comptia__notice { margin: 1rem 0 0; font-size: .875rem; font-weight: 600; text-align: center; color: #fff; }

/* Modal / drawer / toast are moved to <body> by offers.js, so they are
   styled without the .offers-page scope. */
.offers-modal .modal-content { color: #fff; background: #0f172a; border: 1px solid rgba(255, 255, 255, .08); border-radius: var(--of-radius, 1rem); box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .6); }
.offers-modal .modal-body { padding: 1.5rem; }
.offers-modal__title { margin: 0 0 .25rem; font-size: 1.25rem; font-weight: 700; color: #fff; }
.offers-modal .offers-small { font-size: .8125rem; line-height: 1.6; }
.offers-modal .offers-muted, .offers-drawer .offers-muted { color: var(--neutral-100); }
.offers-search { position: relative; margin-top: 1rem; }
.offers-search i { position: absolute; top: 50%; inset-inline-start: .75rem; color: var(--neutral-80); transform: translateY(-50%); }
.offers-search__input { width: 100%; padding: .625rem 1rem; padding-inline-start: 2.5rem; font-size: .875rem; color: #fff; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .08); border-radius: .75rem; outline: none; }
.offers-search__input:focus { border-color: rgba(239, 68, 68, .5); }
.offers-search__input::placeholder { color: var(--neutral-80); }
.offers-country-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; max-height: 18rem; margin-top: 1rem; padding: .5rem; overflow-y: auto; background: rgba(0, 0, 0, .2); border: 1px solid rgba(255, 255, 255, .05); border-radius: .75rem; scrollbar-width: thin; scrollbar-color: #334155 transparent; }
.offers-country-list:empty { display: none; }
.offers-country { overflow: hidden; padding: .5rem .75rem; font-size: .875rem; text-align: start; text-overflow: ellipsis; white-space: nowrap; color: var(--neutral-200); background: rgba(255, 255, 255, .03); border: 0; border-radius: .5rem; transition: background-color .15s, color .15s; }
.offers-country:hover { color: #fff; background: rgba(220, 38, 38, .2); }
.offers-country.is-selected { color: #fff; background: var(--main-600); box-shadow: 0 4px 6px -1px rgba(220, 38, 38, .2); }
.offers-country-empty { margin: 1rem 0 0; padding: 1.5rem 0; font-size: .875rem; text-align: center; color: var(--neutral-80); }
.offers-modal__actions { display: flex; gap: .75rem; margin-top: 1.5rem; }
.offers-modal__actions .btn { flex: 1; }
.offers-modal__actions .btn:disabled { opacity: .5; }

.offers-drawer.offcanvas { --bs-offcanvas-width: 28rem; --bs-offcanvas-height: 92vh; color: #fff; background: #0f172a; border-color: rgba(255, 255, 255, .1); }
.offers-drawer.offcanvas-bottom { border-radius: 1.5rem 1.5rem 0 0; }
.offers-drawer__head { display: flex; align-items: flex-start; gap: .75rem; padding: 1.25rem; border-bottom: 1px solid rgba(255, 255, 255, .08); }
.offers-drawer__title { margin: 0; overflow: hidden; font-size: 1.125rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; color: #fff; }
.offers-drawer .offers-small { font-size: .8125rem; }
.offers-drawer__list { flex: 1; padding: 1.25rem; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #334155 transparent; }
.offers-pkg { margin-bottom: .75rem; overflow: hidden; background: rgba(255, 255, 255, .03); border: 1px solid rgba(255, 255, 255, .08); border-radius: 1rem; transition: border-color .2s, background-color .2s; }
.offers-pkg:hover { border-color: rgba(239, 68, 68, .3); background: rgba(255, 255, 255, .05); }
.offers-pkg.is-selected { border-color: rgba(239, 68, 68, .6); background: rgba(220, 38, 38, .1); box-shadow: 0 10px 15px -3px rgba(220, 38, 38, .1); }
.offers-pkg__row { display: flex; align-items: center; gap: .75rem; width: 100%; padding: 1rem; color: #fff; text-align: start; background: transparent; border: 0; }
.offers-pkg__check { display: flex; align-items: center; justify-content: center; width: 1.25rem; height: 1.25rem; flex-shrink: 0; font-size: .75rem; color: transparent; background: rgba(255, 255, 255, .03); border: 1px solid rgba(255, 255, 255, .2); border-radius: 50%; }
.offers-pkg.is-selected .offers-pkg__check { color: #fff; background: var(--main-600); border-color: #f87171; }
.offers-pkg__text { flex: 1; min-width: 0; }
.offers-pkg__label { display: block; font-size: .875rem; font-weight: 700; }
.offers-pkg__desc { display: block; margin-top: .25rem; font-size: .75rem; line-height: 1.5; color: var(--neutral-100); }
.offers-pkg__prices { display: flex; flex-direction: column; align-items: flex-end; flex-shrink: 0; gap: .25rem; }
.offers-pkg__off { display: inline-flex; align-items: center; gap: .25rem; padding: .125rem .5rem; font-size: .625rem; font-weight: 900; color: #fff; background: linear-gradient(90deg, var(--main-600), var(--main-two-600)); border-radius: 999px; }
.offers-pkg__price { display: flex; flex-direction: column; align-items: flex-end; font-size: 1.125rem; font-weight: 900; }
.offers-pkg__price-usd { line-height: 1.2; }
.offers-pkg__old { margin-inline-end: .5rem; font-size: .75rem; font-weight: 400; color: var(--neutral-80); text-decoration: line-through; }
.offers-pkg__more { display: flex; align-items: center; gap: .375rem; width: 100%; padding: .5rem 1rem; font-size: .75rem; color: var(--neutral-100); background: rgba(0, 0, 0, .15); border: 0; border-top: 1px solid rgba(255, 255, 255, .05); }
.offers-pkg__more:hover { color: #fff; }
.offers-pkg__more i { transition: transform .2s; }
.offers-pkg__more[aria-expanded="true"] i { transform: rotate(180deg); }
.offers-pkg__details { padding: .75rem 1rem 1rem; font-size: .75rem; line-height: 1.7; white-space: pre-line; color: var(--neutral-200); }
.offers-drawer__foot { padding: 1.25rem; border-top: 1px solid rgba(255, 255, 255, .08); }
.offers-drawer__sum { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.offers-drawer__total { margin: 0; font-size: 1.125rem; font-weight: 900; color: #fff; }
.offers-drawer .btn:disabled { opacity: .5; }

.offers-toast {
    position: fixed;
    bottom: 1.25rem;
    left: 50%;
    z-index: 1090;
    display: flex;
    align-items: center;
    gap: .75rem;
    width: max-content;
    max-width: calc(100% - 2rem);
    padding: .75rem 1rem;
    font-size: .875rem;
    font-weight: 600;
    color: #fff;
    background: rgba(15, 23, 42, .95);
    border: 1px solid rgba(16, 185, 129, .3);
    border-radius: 1rem;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .5);
    transform: translateX(-50%);
    animation: offers-fade .25s;
}
.offers-toast[hidden] { display: none; }
.offers-toast i { font-size: 1.25rem; color: #34d399; flex-shrink: 0; }

/* ---- Altered Security ------------------------------------------------- */
.offers-coupon { position: relative; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 1rem; overflow: hidden; padding: 1.5rem; background: linear-gradient(135deg, rgba(220, 38, 38, .12), rgba(236, 72, 153, .05)); border: 1px solid rgba(239, 68, 68, .3); border-radius: var(--of-radius); }
@media (min-width: 576px) { .offers-coupon { flex-direction: row; align-items: center; } }
.offers-coupon::before { content: ""; position: absolute; top: -1.5rem; inset-inline-end: -1.5rem; width: 6rem; height: 6rem; border-radius: 50%; background: rgba(239, 68, 68, .2); filter: blur(40px); }
.offers-coupon__main { position: relative; display: flex; align-items: center; gap: .75rem; }
.offers-coupon__main > i { font-size: 1.5rem; color: #f87171; }
.offers-coupon__label { margin: 0; font-size: .75rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: rgba(252, 165, 165, .8); }
.offers-coupon__code { margin: 0; font-family: monospace; font-size: 1.5rem; font-weight: 900; letter-spacing: .1em; color: #fff; }
.offers-coupon .btn { position: relative; }
.offers-coupon .btn.is-copied { background: #16a34a; border-color: #16a34a; }
.offers-coupon__inline { font-family: monospace; font-weight: 700; color: #fca5a5; }
.offers-steps { margin: 0; padding: 0; list-style: none; }
.offers-step { display: flex; gap: 1rem; margin-bottom: .75rem; padding: 1rem; background: var(--of-surface); border: 1px solid var(--of-border); border-radius: var(--of-radius); }
.offers-step__num { display: flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; flex-shrink: 0; font-size: .875rem; font-weight: 700; color: #fff; background: linear-gradient(135deg, var(--main-500), var(--main-two-500)); border-radius: 50%; }

/* ---- Small screens ---------------------------------------------------- */
@media (max-width: 575.98px) {
    .offers-shell { padding: .75rem; border-radius: 1rem; }
    .offers-ine.offers-shell { padding: 1.5rem .75rem; }
    .offers-card { padding: 1.25rem; }
    .offers-box { padding: 1rem; }
    .offers-partners { gap: .5rem; }
    .offers-partner { padding: .625rem; }
    .offers-partner.is-active { transform: translateY(-6px) scale(1.02); }
    .offers-partner__logo { height: 3rem; padding: .5rem; }
    .offers-partner__title { margin-top: .5rem; font-size: .75rem; }
    .offers-partner__sub { display: none; }
    .offers-partner__state { margin-top: .5rem; padding: .125rem .5rem; font-size: .5625rem; letter-spacing: .14em; }
    .offers-ine__logo-rn { height: 3rem; }
    .offers-ine__logo-ine { height: 2.5rem; }
    .offers-ine__logos { gap: .75rem; }
    .offers-icon-tile { width: 2.75rem; height: 2.75rem; font-size: 1.25rem; border-radius: 1rem; }
    .offers-panel-head__title { font-size: 1.25rem; }
    .offers-addon__logo { width: 6rem; height: 3rem; }
    .offers-vcard__hero { height: 9rem; }
    .offers-region-bar__actions .btn { width: 100%; }
    .offers-comptia.is-gated .offers-comptia__grid-wrap { max-height: 70vh; }
    .offers-coupon__code { font-size: 1.25rem; }
}