/* Alzar Luck — home banner (v8.0). Loaded after wheel.css; the wheel, CTA, gate,
   trust chips and modal chrome come from wheel.css so the banner and the game
   page are visibly the same game. Only the banner's own layout lives here. */
.alzb{
        --b-navy:var(--az-navy,#222D65);--b-navy-deep:var(--az-navy-deep,#161D47);--b-green:var(--az-green,#1A994A);--b-green-deep:var(--az-green-deep,#137A3A);--b-gold:var(--az-gold,#F2B33D);--b-mint:var(--az-mint,#E6F4EB);
        --alzw-size:min(310px,74vw);
        position:relative;display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "stage" "actions";gap:.25rem 2rem;padding:clamp(1.4rem,4.5vw,2.75rem);border-radius:var(--az-r-xl,32px);overflow:hidden;isolation:isolate;
        background:linear-gradient(130deg,var(--b-navy) 0%,color-mix(in srgb,var(--b-navy) 68%,var(--b-green-deep)) 100%);color:#fff;
        font-family:var(--wp--preset--font-family--body,"DIN Next LT Arabic",system-ui,sans-serif);
}
.alzb *,.alzb-modal *{box-sizing:border-box}
.alzb__glow{position:absolute;z-index:-1;inset-block-start:-35%;inset-inline-start:-12%;width:62%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--b-green) 50%,transparent),transparent 72%);pointer-events:none}
.alzb::after{content:"";position:absolute;z-index:-1;inset-block-end:-40%;inset-inline-end:-8%;width:50%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--b-gold) 30%,transparent),transparent 72%);pointer-events:none}
.alzb__head{grid-area:head;display:grid;justify-items:start;gap:.55rem;align-content:end}
.alzb__stage{grid-area:stage;justify-self:center;align-self:center}
.alzb__actions{grid-area:actions;display:grid;gap:.9rem;justify-items:start;align-content:start;min-width:0}
.alzb__ctas{display:grid;gap:.5rem;justify-items:start}
.alzb__ctas[hidden]{display:none!important}
.alzb__badge{display:inline-block;margin:0;padding:.34rem .9rem;border-radius:999px;background:color-mix(in srgb,var(--b-gold) 90%,transparent);color:var(--b-navy-deep);font-weight:800;font-size:.86rem}
.alzb__title{margin:0;font-size:clamp(1.55rem,4vw,2.3rem);line-height:1.25;font-weight:800;color:#fff;text-wrap:balance}
.alzb__lead{margin:0;max-width:46ch;font-size:clamp(.96rem,1.9vw,1.06rem);line-height:1.8;color:color-mix(in srgb,#fff 88%,transparent)}
.alzb__note{margin:0;font-size:.84rem;color:color-mix(in srgb,#fff 74%,transparent)}
.alzb .alzw{--alzw-gold:var(--b-gold)}
.alzb .alzw__snd{inset-inline-end:-.2rem}

/* The wheel on the right (RTL) at ≥820px, text + actions on the left. */
@media (min-width:820px){
        .alzb{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);grid-template-areas:"head stage" "actions stage";align-items:start;--alzw-size:min(340px,34vw)}
        .alzb__head{align-content:end}
}
@media (max-width:480px){
        .alzb{border-radius:24px;padding:1.25rem 1rem 1.5rem}
        .alzb__actions{justify-items:stretch}
        .alzb__ctas{justify-items:stretch}
        .alzb .alzw-cta{width:100%}
}

/* A soft halo behind the wheel while it is showcasing. */
.alzb[data-state="auto-spin"] .alzb__stage,.alzb[data-state="spin"] .alzb__stage{position:relative}
.alzb[data-state="auto-spin"] .alzb__stage::before,.alzb[data-state="spin"] .alzb__stage::before{content:"";position:absolute;inset:8% 8%;border-radius:50%;box-shadow:0 0 0 0 color-mix(in srgb,var(--b-gold) 55%,transparent);animation:alzb-pulse 1.6s ease-out infinite;pointer-events:none;z-index:-1}
@keyframes alzb-pulse{to{box-shadow:0 0 0 26px transparent}}

/* ---------- The registration overlay (shell = .alzw-modal in wheel.css) ---------- */
.alzb-modal__h{margin:0 0 .9rem;font-size:1.28rem;font-weight:800;color:var(--b-navy,var(--az-navy,#222D65));padding-inline:2.6rem}
.alzb-modal__p{margin:0 0 .8rem;color:var(--az-muted,#5A6187);line-height:1.75;font-size:.95rem}
.alzb-modal__label{display:block;font-weight:700;margin-bottom:.3rem;color:var(--az-navy,#222D65);text-align:start}
.alzb-modal__input{width:100%;min-height:54px;border:1.5px solid var(--az-line,#E3E6F0);border-radius:16px;padding:0 14px;font-size:1.15rem;text-align:center;direction:ltr;font-family:inherit;background:#fff;color:var(--az-ink,#141A3D)}
.alzb-modal__input:focus{outline:3px solid var(--az-navy,#222D65);outline-offset:2px}
.alzb-modal__btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:54px;width:100%;border:0;border-radius:999px;background:var(--az-green,#1A994A);color:#fff;font-weight:800;font-size:1.05rem;font-family:inherit;cursor:pointer;margin-top:.7rem;text-decoration:none;transition:background .2s,transform .15s}
.alzb-modal__btn:hover{background:var(--az-green-deep,#137A3A);color:#fff}
.alzb-modal__btn:active{transform:scale(.98)}
.alzb-modal__btn.is-wa{background:#1FA855}
.alzb-modal__btn:disabled{opacity:.55;cursor:default}
.alzb-modal__err{margin:.5rem 0 0;color:var(--az-sale,#D93A3A);font-weight:700}
.alzb-modal__fine{margin:.9rem 0 0;color:var(--az-muted,#5A6187);font-size:.8rem;line-height:1.7}
.alzb-modal__fine a{color:var(--az-navy,#222D65);font-weight:700}
.alzb-modal__code{font:800 1.6rem/1 ui-monospace,monospace;letter-spacing:.12em;background:var(--az-mint,#E6F4EB);border-radius:16px;padding:12px;margin:.4rem 0;text-align:center;direction:ltr;color:var(--az-navy,#222D65)}
.alzb-modal__cats{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.alzb-modal__cat{display:flex;align-items:center;gap:8px;border:1.5px solid var(--az-line,#E3E6F0);border-radius:16px;padding:11px;font-weight:700;cursor:pointer;justify-content:center}
.alzb-modal__cat input{accent-color:var(--az-green,#1A994A);width:18px;height:18px}
.alzb-modal__cat:has(input:checked){border-color:var(--az-green,#1A994A);background:var(--az-mint,#E6F4EB)}
.alzb-modal__stage{padding-top:3.2rem}
.alzb-modal__win{background:var(--az-mint,#E6F4EB);border-radius:20px;padding:14px;display:grid;gap:4px;justify-items:center;text-align:center;margin-top:.8rem;animation:alzw-gate .5s cubic-bezier(.34,1.56,.64,1)}
.alzb-modal__win[hidden]{display:none!important}
.alzb-modal__win svg{filter:drop-shadow(0 8px 12px rgba(20,26,61,.25));animation:alzw-bounce .8s cubic-bezier(.34,1.56,.64,1) both}
.alzb-modal__win strong{font-size:1.12rem;color:var(--az-navy,#222D65)}
.alzb-modal__win p{margin:0;color:var(--az-ink,#141A3D)}
.alzb-modal__loading{text-align:center;color:var(--az-muted,#5A6187);font-weight:700;padding:.4rem 0}
.alzb-modal__step[hidden]{display:none!important}
.alzb-modal__link{background:none;border:0;color:var(--az-navy,#222D65);font-family:inherit;font-weight:700;font-size:.95rem;text-decoration:underline;cursor:pointer;padding:.4rem;margin-top:.3rem}
.alzb-modal__err[hidden],.alzb-modal__fine[hidden]{display:none!important}

@media (prefers-reduced-motion:reduce){
        .alzb *,.alzb::before,.alzb::after,.alzb-modal *{animation:none!important;transition:none!important}
}
