/* /Components/Auth/OAuthButton.razor.rz.scp.css */
/* === Google (ajustado para igualar tamaño con Discord) === */
.gsi-material-button[b-bcs3ir9h3z] {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    -webkit-appearance: none;
    background-color: #FFFFFF;
    background-image: none;
    border: 1px solid #747775;
    border-radius: 12px; /* antes 20px → igual que rounded-xl */
    box-sizing: border-box;
    color: #1f1f1f;
    cursor: pointer;
    font-family: 'Roboto', arial, sans-serif;
    font-size: 14px;
    height: 48px; /* altura unificada = 3rem (h-12) */
    letter-spacing: 0.25px;
    outline: none;
    overflow: hidden;
    padding: 0 16px; /* ≈ px-4 */
    position: relative;
    text-align: center;
    transition: background-color .218s, border-color .218s, box-shadow .218s, transform .12s ease;
    vertical-align: middle;
    white-space: nowrap;
    width: auto;
    max-width: 400px;
    min-width: 220px; /* ancho mínimo unificado */
    display: inline-flex; /* alinear como Discord */
    align-items: center;
    justify-content: center;
    gap: 12px;
    line-height: 1; /* evita sumar altura por line-height */
}

    .gsi-material-button .gsi-material-button-icon[b-bcs3ir9h3z] {
        height: 20px;
        margin-right: 12px;
        min-width: 20px;
        width: 20px;
    }

    .gsi-material-button .gsi-material-button-content-wrapper[b-bcs3ir9h3z] {
        align-items: center;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        height: 100%;
        justify-content: center; /* centrado como Discord */
        position: relative;
        width: 100%;
        gap: 12px;
    }

    .gsi-material-button .gsi-material-button-contents[b-bcs3ir9h3z] {
        flex-grow: 0; /* no estirar el texto */
        font-family: 'Roboto', arial, sans-serif;
        font-weight: 700; /* igual énfasis que Discord */
        overflow: hidden;
        text-overflow: ellipsis;
        vertical-align: top;
        line-height: 1;
        white-space: nowrap;
    }

    .gsi-material-button .gsi-material-button-state[b-bcs3ir9h3z] {
        transition: opacity .218s;
        bottom: 0;
        left: 0;
        opacity: 0;
        position: absolute;
        right: 0;
        top: 0;
    }

    .gsi-material-button:disabled[b-bcs3ir9h3z] {
        cursor: default;
        background-color: #ffffff61;
        border-color: #1f1f1f1f;
    }

        .gsi-material-button:disabled .gsi-material-button-contents[b-bcs3ir9h3z],
        .gsi-material-button:disabled .gsi-material-button-icon[b-bcs3ir9h3z] {
            opacity: 38%;
        }

    .gsi-material-button:not(:disabled):hover[b-bcs3ir9h3z] {
        box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .30), 0 1px 3px 1px rgba(60, 64, 67, .15); /* sombra hover */
    }

        .gsi-material-button:not(:disabled):hover .gsi-material-button-state[b-bcs3ir9h3z] {
            background-color: #303030;
            opacity: 8%;
        }

    .gsi-material-button:not(:disabled):active .gsi-material-button-state[b-bcs3ir9h3z],
    .gsi-material-button:not(:disabled):focus .gsi-material-button-state[b-bcs3ir9h3z] {
        background-color: #303030;
        opacity: 12%;
    }

/* === Discord clase con tamaño y hover equivalentes a Google === */
/* Botón Discord */
.btn-discord[b-bcs3ir9h3z] {
    background-color: #5865F2;
    border: 1px solid #5865F2;
    color: #FFFFFF;
    border-radius: 12px;
    height: 48px;
    min-width: 220px;
    padding: 0 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    font-weight: 700;
    font-size: 14px;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color .218s, border-color .218s, box-shadow .218s, transform .12s ease;
    text-decoration: none;
}

    /* Hover con misma sombra que Google */
    .btn-discord:hover[b-bcs3ir9h3z] {
        background-color: #4752C4;
        border-color: #4752C4;
        box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .30), 0 1px 3px 1px rgba(60, 64, 67, .15);
    }

    .btn-discord:active[b-bcs3ir9h3z] {
        transform: translateY(1px);
    }

    .btn-discord:focus-visible[b-bcs3ir9h3z] {
        outline: 2px solid rgba(88,101,242,.5);
        outline-offset: 2px;
    }

    /* Icono dentro del botón Discord */
    .btn-discord img[b-bcs3ir9h3z] {
        width: 20px;
        height: 20px;
        margin-right: 12px;
        filter: brightness(0) invert(1); /* <- lo fuerza blanco */
        flex-shrink: 0;
    }

/* Hace que los OAuthButton ocupen todo el ancho de su contenedor */
.oauth-full[b-bcs3ir9h3z] {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    display: flex !important;  mantiene el contenido centrado 
    justify-content: center !important;
}

     /*Opcional: mismo alto por si alguna variante lo cambia */
    .oauth-full[b-bcs3ir9h3z],
    .oauth-full.gsi-material-button[b-bcs3ir9h3z],
    .oauth-full.btn-discord[b-bcs3ir9h3z] {
        height: 48px !important;
        box-sizing: border-box;
    }
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* /Components/Pages/ComingSoon.razor.rz.scp.css */
/* Pulsación sutil de estrellas */
@keyframes pulse-slow-b-o6yv4avqa8 {
    0%,100% {
        opacity: .06
    }

    50% {
        opacity: .12
    }
}

.animate-pulse-slow[b-o6yv4avqa8] {
    animation: pulse-slow-b-o6yv4avqa8 6s ease-in-out infinite;
}

/* Botones con glow suave */
.btn-glow:hover[b-o6yv4avqa8] {
    box-shadow: 0 0 0 2px rgba(6,182,212,.25), 0 8px 30px rgba(6,182,212,.25);
    transform: translateY(-1px);
}

.btn-glow-outline:hover[b-o6yv4avqa8] {
    box-shadow: 0 0 0 2px rgba(250,204,21,.25), 0 8px 30px rgba(250,204,21,.15);
    transform: translateY(-1px);
}
/* Tamaños fluidos con clamp(min, preferido, max) */
.fluid-h1[b-o6yv4avqa8] {
    font-size: clamp(1.75rem, 1.1rem + 3.2vw, 3.25rem); /* ≈28px → 52px */
    line-height: 1.15;
    letter-spacing: .01em;
    text-wrap: balance; /* distribuye mejor líneas en titulares */
}

.fluid-body[b-o6yv4avqa8] {
    font-size: clamp(1rem, 0.95rem + 0.6vw, 1.125rem); /* ≈16px → 18px */
    line-height: 1.6;
    text-wrap: pretty; /* mejora corte de líneas en párrafos */
}


.discord-btn[b-o6yv4avqa8] {
    background-color: #5865F2 !important; /* Discord blurple */
    color: white !important;
    border-radius: 0.5rem;
    text-transform: none;
    transition: all 0.2s ease-in-out;
    padding-inline: 1rem;
    padding-block: .55rem;
}

    .discord-btn:hover[b-o6yv4avqa8] {
        background-color: #4752C4 !important; /* hover oficial */
        box-shadow: 0 0 12px rgba(88,101,242,0.6);
        transform: translateY(-1px);
    }
/* Degradado del título */
.text-gradient[b-o6yv4avqa8] {
    background: linear-gradient(90deg, rgba(255,255,255,0.98) 0%, rgba(255,170,0,0.95) 90%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

/* Acento naranja coherente */
.icon-accent[b-o6yv4avqa8] {
    color: rgba(255,170,0,.95);
}

/* Chips */
.chip[b-o6yv4avqa8] {
    font-size: 12px;
    line-height: 1;
    padding: .45rem .6rem;
    border-radius: 9999px;
    background: rgba(255,170,0,.12);
    color: rgba(255,170,0,.95);
    border: 1px solid rgba(255,170,0,.35);
}
/* Padding del paper: separación fija respecto al borde dorado */
.ws-pad[b-o6yv4avqa8] {
    --edge: clamp(20px, 2.6vw, 34px);
    padding: var(--edge);
    box-sizing: border-box;
}

    /* El grid de MudBlazor usa márgenes negativos: los anulamos dentro del wrapper */
    .ws-pad .mud-grid[b-o6yv4avqa8] {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Separación entre HERO y la siguiente tarjeta usando el mismo ritmo */
    .ws-pad .ark-hero[b-o6yv4avqa8] {
        margin-bottom: var(--edge);
    }

/* (Opcional) si quieres todavía un pelín más de aire lateral: */
.ws-pad[b-o6yv4avqa8] {
    padding-left: calc(var(--edge) + 4px);
    padding-right: calc(var(--edge) + 4px);
}

/* Mantenemos tus estilos previos tal cual */

/* /Components/Pages/Home.razor.rz.scp.css */
.home-hero[b-r4wbpx4zqj] {
    position: relative;
    min-height: 60vh; /* altura mínima visible del hero */
    background-color: #0A0E14;
    margin: 0 !important;
    padding: 0 !important;
}

.home-hero-bg[b-r4wbpx4zqj] {
    position: absolute;
    inset: 0;
    background: url('/images/hero-hangar.png') center/cover no-repeat;
    filter: brightness(.65) saturate(1.05);
    z-index: 1; /* debajo del contenido */

}

.hero-content[b-r4wbpx4zqj] {
    position: relative;
    z-index: 2; /* encima del fondo */
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}





/* ===== ABOUT: tarjeta de imagen con marco degradado, viñeta y hover ===== */
.home-about-frame[b-r4wbpx4zqj] {
    position: relative;
    width: 100%;
    max-width: 560px;
    aspect-ratio: 16/9;
    border-radius: 18px;
    overflow: hidden;
    background: radial-gradient(120% 140% at 70% -20%, rgba(255,255,255,.06), rgba(255,255,255,0) 60%), linear-gradient(180deg, rgba(122,35,35,.15), rgba(10,10,10,1) 50%);
    box-shadow: 0 10px 30px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.04);
    transform: translateZ(0);
}

    /* Borde degradado por encima de la imagen */
    .home-about-frame[b-r4wbpx4zqj]::before {
        content: "";
        position: absolute;
        inset: 0;
        padding: 2px;
        border-radius: 20px;
        background: linear-gradient(135deg, rgba(255,224,0,.55), rgba(255,160,0,.25), rgba(255,224,0,.15));
        -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
        -webkit-mask-composite: xor;
        mask-composite: exclude;
        pointer-events: none;
        z-index: 2;
        opacity: .85;
    }

    /* Viñeta por encima de la imagen */
    .home-about-frame[b-r4wbpx4zqj]::after {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(120% 120% at 50% 50%, rgba(0,0,0,0) 55%, rgba(0,0,0,.28) 100%);
        pointer-events: none;
        z-index: 3;
    }

    /* La imagen debajo de los overlays */
    .home-about-frame img[b-r4wbpx4zqj] {
        position: relative; /* clave para que z-index funcione */
        z-index: 1;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: 65% 50%;
        transition: transform .45s ease, filter .45s ease;
        filter: saturate(1.02) contrast(1.02);
    }

@media (hover:hover) {
    .home-about-frame:hover img[b-r4wbpx4zqj] {
        transform: scale(1.035) rotate(-0.3deg);
        filter: saturate(1.06) contrast(1.05);
    }
}

.home-review-card[b-r4wbpx4zqj] {
    height: 100%;
    border: 1px solid rgba(248, 216, 115, .22);
    border-radius: 8px;
    background: rgba(10, 17, 29, .78);
}

.home-catalog-explorer[b-r4wbpx4zqj] {
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(255, 255, 255, .10);
    background:
        radial-gradient(820px 460px at 50% 0%, rgba(0, 168, 255, .12), transparent 64%),
        radial-gradient(720px 420px at 75% 30%, rgba(139,28,33,.18), transparent 58%),
        linear-gradient(180deg, #05080e 0%, #07101c 52%, #05080e 100%);
}

.home-catalog-explorer[b-r4wbpx4zqj]::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url('/images/background.webp');
    background-size: cover;
    background-position: center;
    opacity: .24;
    filter: saturate(1.1);
}

.home-catalog-explorer[b-r4wbpx4zqj]::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.28) 42%, rgba(0,0,0,.62)),
        linear-gradient(90deg, rgba(0,0,0,.70), transparent 34%, transparent 66%, rgba(0,0,0,.70));
    pointer-events: none;
}

.home-catalog-explorer__heading[b-r4wbpx4zqj],
.home-catalog-explorer__grid[b-r4wbpx4zqj] {
    position: relative;
    z-index: 1;
}

.home-catalog-explorer__heading[b-r4wbpx4zqj] {
    max-width: 820px;
    margin: 0 auto 2rem;
    text-align: center;
}

.home-catalog-explorer__title[b-r4wbpx4zqj] {
    color: rgba(255,255,255,.96);
    font-weight: 950;
    letter-spacing: .01em;
}

.home-catalog-explorer__subtitle[b-r4wbpx4zqj] {
    max-width: 680px;
    margin: .65rem auto 0;
    color: rgba(255,255,255,.70);
    line-height: 1.6;
}

.home-catalog-explorer__grid[b-r4wbpx4zqj] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.home-catalog-tile[b-r4wbpx4zqj] {
    position: relative;
    min-height: 190px;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    color: white;
    text-decoration: none;
    border: 1px solid rgba(0, 194, 255, .26);
    border-radius: 14px;
    background-color: #0b1422;
    background-size: cover;
    background-position: center;
    box-shadow: 0 18px 46px rgba(0,0,0,.38);
    transform: translateZ(0);
}

.home-catalog-tile[b-r4wbpx4zqj]::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(520px 230px at 72% 0%, rgba(255,255,255,.12), transparent 55%),
        linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.78));
    z-index: 1;
    transition: opacity .25s ease;
}

.home-catalog-tile[b-r4wbpx4zqj]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(0, 194, 255, .30), transparent 34%, rgba(248,216,115,.14));
    opacity: 0;
    z-index: 2;
    transition: opacity .25s ease;
}

.home-catalog-tile:hover[b-r4wbpx4zqj] {
    color: white;
    border-color: rgba(248,216,115,.66);
}

.home-catalog-tile:hover[b-r4wbpx4zqj]::after {
    opacity: 1;
}

.home-catalog-tile__shade[b-r4wbpx4zqj] {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(5,10,18,.92), rgba(5,10,18,.30) 56%, rgba(5,10,18,.05));
    z-index: 1;
}

.home-catalog-tile__content[b-r4wbpx4zqj] {
    position: relative;
    z-index: 3;
    width: 100%;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 1rem;
    align-items: center;
    padding: 1.35rem;
}

.home-catalog-tile__icon[b-r4wbpx4zqj] {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    color: #f8d873;
    border: 1px solid rgba(248,216,115,.26);
    border-radius: 12px;
    background: rgba(2, 12, 20, .72);
    box-shadow: 0 10px 28px rgba(0,0,0,.30);
}

.home-catalog-tile__icon .mud-icon-root[b-r4wbpx4zqj],
.home-catalog-tile__arrow .mud-icon-root[b-r4wbpx4zqj] {
    width: 30px;
    height: 30px;
}

.home-catalog-tile__copy[b-r4wbpx4zqj] {
    min-width: 0;
    display: grid;
    gap: .35rem;
}

.home-catalog-tile__copy strong[b-r4wbpx4zqj] {
    color: rgba(255,255,255,.96);
    font-size: 1.28rem;
    font-weight: 950;
    line-height: 1.15;
}

.home-catalog-tile__copy span[b-r4wbpx4zqj] {
    color: rgba(255,255,255,.72);
    font-size: .94rem;
    line-height: 1.35;
}

.home-catalog-tile__arrow[b-r4wbpx4zqj] {
    color: rgba(248,216,115,.95);
    opacity: .86;
    transition: transform .25s ease, opacity .25s ease;
}

.home-catalog-tile:hover .home-catalog-tile__arrow[b-r4wbpx4zqj] {
    opacity: 1;
    transform: translateX(4px);
}

.home-catalog-tile--ships[b-r4wbpx4zqj] { background-image: url('/images/temp/perseus.jpg'); }
.home-catalog-tile--vehicles[b-r4wbpx4zqj] { background-image: url('/images/Products/fondo2.webp'); }
.home-catalog-tile--ccu[b-r4wbpx4zqj] { background-image: url('/images/temp/ironclad.jpg'); }
.home-catalog-tile--paints[b-r4wbpx4zqj] { background-image: url('/images/Products/798798.webp'); }
.home-catalog-tile--equipment[b-r4wbpx4zqj] { background-image: url('/images/Products/f.webp'); }
.home-catalog-tile--store-credit[b-r4wbpx4zqj] { background-image: url('/images/about-us.png'); }
.home-catalog-tile--ingame[b-r4wbpx4zqj] { background-image: url('/images/naveFondo.png'); }
.home-catalog-tile--packs[b-r4wbpx4zqj] { background-image: url('/images/Products/FondoHeaderProductos.webp'); }
.home-catalog-tile--referral[b-r4wbpx4zqj] { background-image: url('/images/hero-hangar.png'); }

@media (max-width: 1100px) {
    .home-catalog-explorer__grid[b-r4wbpx4zqj] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .home-catalog-explorer__grid[b-r4wbpx4zqj] {
        grid-template-columns: 1fr;
    }

    .home-catalog-tile[b-r4wbpx4zqj] {
        min-height: 165px;
    }

    .home-catalog-tile__content[b-r4wbpx4zqj] {
        grid-template-columns: auto 1fr;
    }

    .home-catalog-tile__arrow[b-r4wbpx4zqj] {
        display: none;
    }
}

.home-buyer-flow[b-r4wbpx4zqj] {
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(255, 255, 255, .10);
    border-bottom: 1px solid rgba(255, 255, 255, .10);
    background:
        radial-gradient(900px 520px at 50% 0%, rgba(248, 216, 115, .09), transparent 62%),
        radial-gradient(760px 420px at 82% 45%, rgba(155, 36, 42, .14), transparent 58%),
        linear-gradient(180deg, #050910 0%, #080d16 48%, #05080e 100%);
}

.home-buyer-flow[b-r4wbpx4zqj]::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255,255,255,.02) 1px, transparent 1px);
    background-size: 72px 72px;
    mask-image: radial-gradient(circle at center, rgba(0,0,0,.72), transparent 72%);
    pointer-events: none;
}

.home-buyer-flow__heading[b-r4wbpx4zqj] {
    position: relative;
    z-index: 1;
    max-width: 920px;
    margin: 0 auto 2.35rem;
    text-align: center;
}

.home-buyer-flow__eyebrow[b-r4wbpx4zqj] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .75rem;
    color: #f8d873;
    font-size: .84rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.home-buyer-flow__title[b-r4wbpx4zqj] {
    color: rgba(255,255,255,.95);
    font-weight: 900;
    letter-spacing: .01em;
}

.home-buyer-flow__subtitle[b-r4wbpx4zqj] {
    max-width: 760px;
    margin: .75rem auto 0;
    color: rgba(255,255,255,.76);
    font-size: 1.02rem;
    line-height: 1.65;
}

.home-buyer-flow__timeline[b-r4wbpx4zqj] {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.35rem;
}

.home-buyer-step[b-r4wbpx4zqj] {
    position: relative;
    display: grid;
    grid-template-rows: auto 1fr auto;
    min-height: 315px;
    padding: 1.45rem;
    color: white;
    border: 1px solid rgba(248,216,115,.28);
    border-radius: 14px;
    background:
        radial-gradient(420px 210px at 18% 0%, rgba(248,216,115,.16), transparent 55%),
        radial-gradient(360px 180px at 90% 20%, rgba(139,28,33,.28), transparent 60%),
        linear-gradient(180deg, rgba(18, 27, 43, .97), rgba(8, 13, 23, .99));
    box-shadow: 0 24px 58px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.04);
    isolation: isolate;
}

.home-buyer-step[b-r4wbpx4zqj]::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(135deg, rgba(255,255,255,.08), transparent 38%, rgba(248,216,115,.08));
    opacity: .75;
    pointer-events: none;
    z-index: -1;
}

.home-buyer-step__header[b-r4wbpx4zqj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.home-buyer-step__index[b-r4wbpx4zqj] {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    color: #1b0f05;
    background: linear-gradient(180deg, #fff1a8, #e0ad22);
    border: 2px solid rgba(255,255,255,.22);
    border-radius: 999px;
    font-size: 1.65rem;
    font-weight: 950;
    line-height: 1;
    box-shadow: 0 12px 26px rgba(0,0,0,.40), 0 0 24px rgba(248,216,115,.20);
}

.home-buyer-step__icon[b-r4wbpx4zqj] {
    width: 56px;
    height: 56px;
    display: grid;
    place-items: center;
    color: #f8d873;
    background: rgba(248,216,115,.08);
    border: 1px solid rgba(248,216,115,.24);
    border-radius: 12px;
}

.home-buyer-step__icon .mud-icon-root[b-r4wbpx4zqj] {
    width: 32px;
    height: 32px;
}

.home-buyer-step__content[b-r4wbpx4zqj] {
    text-align: left;
}

.home-buyer-step__content .mud-typography-h6[b-r4wbpx4zqj] {
    color: rgba(255,255,255,.94);
    font-weight: 900;
    font-size: 1.28rem;
    line-height: 1.22;
}

.home-buyer-step__content .mud-typography-body2[b-r4wbpx4zqj] {
    margin-top: .75rem;
    color: rgba(255,255,255,.76);
    font-size: .98rem;
    line-height: 1.62;
}

.home-buyer-step__cta[b-r4wbpx4zqj] {
    justify-self: start;
    margin-top: 1.35rem;
    color: #f8d873 !important;
    border-color: rgba(248,216,115,.34) !important;
    background: rgba(248,216,115,.04) !important;
    font-weight: 900 !important;
}

.home-buyer-step__cta:hover[b-r4wbpx4zqj] {
    background: rgba(139,28,33,.72) !important;
    border-color: rgba(248,216,115,.58) !important;
    color: white !important;
}

@media (max-width: 900px) {
    .home-buyer-flow__timeline[b-r4wbpx4zqj] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .home-buyer-flow__timeline[b-r4wbpx4zqj]::before {
        display: none;
    }

    .home-buyer-step[b-r4wbpx4zqj] {
        min-height: auto;
    }
}

/* ===== FOOTER look & feel ===== */
FOOTER
.home-footer-list[b-r4wbpx4zqj] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.home-footer .mud-link.home-footer-link[b-r4wbpx4zqj] {
    color: rgba(255,255,255,.80) !important;
    display: inline-block;
    padding: .25rem 0;
    text-decoration: none;
}

    .home-footer .mud-link.home-footer-link:hover[b-r4wbpx4zqj] {
        color: #fff !important;
        text-decoration: none;
    }

.home-footer[b-r4wbpx4zqj] {
    /* Fondo con contraste: base oscura + leve degradado superior y acentos cálidos */
    background: radial-gradient(80% 120% at 50% -10%, rgb(80, 3, 3,.45), rgb(185, 30, 30,.88)), linear-gradient(180deg, rgba(44,35,35,.98), rgba(13,0,0,1) 50%, rgba(7,7,7,1) 100%);
    border-top: 1px solid rgba(255,170,0,0.75);
    position: relative;
    overflow: hidden;
}

    /* Línea dorada sutil en el borde superior */
    .home-footer[b-r4wbpx4zqj]::before {
        content: "";
        position: absolute;
        inset: 0 0 auto 0;
        height: 3px;
        background: linear-gradient(90deg, rgba(255,170,0,.20), rgba(255,170,0,1), rgba(255,170,0,.20));
        opacity: .65;
    }

    /* Tipografía y espaciado */
    .home-footer .mud-typography[b-r4wbpx4zqj] {
        font-weight: 600;
        letter-spacing: .2px;
    }

.home-footer-list[b-r4wbpx4zqj] {
    list-style: none;
    margin: 0;
    padding: 0;
}

home-footer .mud-typography.home-footer-list-title[b-r4wbpx4zqj] {
    color: rgba(255,170,0,1) !important;
}

.home-footer-link[b-r4wbpx4zqj] {
    color: rgba(255,255,255,.80);
    display: inline-block;
    padding: .32rem 0;
    line-height: 1.35;
    transition: color .18s ease, transform .18s ease;
    text-decoration: none;
}

    .home-footer-link:hover[b-r4wbpx4zqj] {
        color: #fff;
        transform: translateX(2px);
    }

/* ===== MÉTODOS DE PAGO ===== */
.home-footer-pay-grid[b-r4wbpx4zqj]{
  display: flex;
  gap: .75rem;
  flex-wrap: wrap;             /* móvil/tablet: puede saltar de línea */
  align-items: center;
}

/* Tarjeta blanca con borde/sombra gris y esquinas redondeadas */
.pay-card[b-r4wbpx4zqj] {
    background: #fff;
    border: 2px solid #322c2cba;
    box-shadow: 0 2px 10px rgba(0,0,0,.08);
    border-radius: 12px;
    padding: .5rem .75rem; /* antes .65rem .75rem */
    max-height: 45px; /* asegura altura mínima */
    max-width:65px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

    .pay-card:hover[b-r4wbpx4zqj] {
        transform: translateY(-2px);
        box-shadow: 0 6px 18px rgba(0,0,0,.12);
        border-color: #d1d5db; /* gris-300 */
    }

    /* Imagen centrada y contenida */
    .pay-card img[b-r4wbpx4zqj] {
        height: 38px; /* Fija altura visual consistente */
        max-height: 44px; /* techo en pantallas grandes */
        width: auto; /* mantiene proporción */
        max-width: 50px; /* permite logos apaisados (Visa/PayPal) */
        display: block;
    }

/* ===== Ajustes responsivos ===== */
@media (min-width: 900px) {
    .pay-card img[b-r4wbpx4zqj] {
        height: 42px; /* un poco más grande en desktop */
        max-width: 160px;
    }
}



 ProductCard 
.product-card .mud-chip[b-r4wbpx4zqj] {
    backdrop-filter: blur(4px);
}
/* /Components/Pages/User/Profile.razor.rz.scp.css */
.ws-profile-page[b-26c0963639] {
    min-height: 100%;
    background:
        radial-gradient(1200px 600px at 15% 0%, rgba(180, 83, 9, .16), transparent 55%),
        radial-gradient(1000px 500px at 100% 10%, rgba(29, 78, 216, .12), transparent 55%),
        linear-gradient(180deg, #0c1320 0%, #0a101a 100%);
}

.profile-hero[b-26c0963639],
.profile-card[b-26c0963639],
.provider-card[b-26c0963639] {
    background: linear-gradient(180deg, rgba(18, 24, 34, .96), rgba(10, 14, 22, .98));
    border: 1px solid rgba(212, 175, 55, .18);
    color: white;
}

.profile-avatar[b-26c0963639] {
    border: 1px solid rgba(212, 175, 55, .28);
}

.provider-card[b-26c0963639] {
    border-radius: 12px;
}

.profile-order-card[b-26c0963639] {
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 10px;
    background: rgba(255, 255, 255, .04);
}

.profile-orders-list[b-26c0963639] {
    min-width: 0;
}

.profile-order-row[b-26c0963639] {
    display: grid;
    grid-template-columns: minmax(150px, 1fr) auto 40px auto auto;
    gap: .75rem;
    align-items: center;
}

.profile-order-main[b-26c0963639],
.profile-order-reference[b-26c0963639] {
    min-width: 0;
}

.profile-order-reference[b-26c0963639] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.profile-order-status[b-26c0963639] {
    justify-self: start;
}

.profile-payment-icon[b-26c0963639] {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(130, 150, 184, .22);
    border-radius: 8px;
    background: rgba(255,255,255,.045);
}

.profile-payment-icon img[b-26c0963639] {
    width: 26px;
    max-height: 18px;
    display: block;
}

.profile-order-total[b-26c0963639] {
    color: #f8d873;
    font-weight: 800;
    white-space: nowrap;
}

.profile-order-actions[b-26c0963639] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: .25rem;
    white-space: nowrap;
}

@media (max-width: 720px) {
    .profile-order-row[b-26c0963639] {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "main actions"
            "status payment"
            "total total";
    }

    .profile-order-main[b-26c0963639] {
        grid-area: main;
    }

    .profile-order-status[b-26c0963639] {
        grid-area: status;
    }

    .profile-payment-icon[b-26c0963639] {
        grid-area: payment;
        justify-self: end;
    }

    .profile-order-total[b-26c0963639] {
        grid-area: total;
    }

    .profile-order-actions[b-26c0963639] {
        grid-area: actions;
    }
}
/* /Components/Products/ProductCarousel.razor.rz.scp.css */
.product-carousel__header[b-s4mig8vsko] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.product-carousel[b-s4mig8vsko] {
    position: relative;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    align-items: center;
    gap: 1rem;
    padding-bottom: 3rem;
}

.product-carousel__viewport[b-s4mig8vsko] {
    min-width: 0;
    overflow: hidden;
}

.product-carousel__page[b-s4mig8vsko] {
    display: flex;
    gap: 1.5rem;
    width: 100%;
    animation: product-carousel-page-in-b-s4mig8vsko .22s ease-out;
}

@keyframes product-carousel-page-in-b-s4mig8vsko {
    from {
        opacity: .35;
        transform: translateX(12px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.product-carousel__page--cols-1[b-s4mig8vsko] {
    --product-carousel-cols: 1;
}

.product-carousel__page--cols-2[b-s4mig8vsko] {
    --product-carousel-cols: 2;
}

.product-carousel__page--cols-3[b-s4mig8vsko] {
    --product-carousel-cols: 3;
}

.product-carousel__page--cols-4[b-s4mig8vsko] {
    --product-carousel-cols: 4;
}

.product-carousel__item[b-s4mig8vsko] {
    flex: 0 0 calc((100% - (1.5rem * (var(--product-carousel-cols) - 1))) / var(--product-carousel-cols));
    min-width: 0;
    min-height: 560px;
}

[b-s4mig8vsko] .product-carousel__item .product-card {
    height: 100%;
}

[b-s4mig8vsko] .product-carousel__item .product-card__footer {
    gap: 14px;
}

[b-s4mig8vsko] .product-carousel__item .product-card__prices {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 5px;
    padding: .72rem .6rem .58rem;
    text-align: center;
    border-radius: 12px;
    background:
        radial-gradient(circle at 50% 0%, rgba(248, 216, 115, .16), transparent 68%),
        linear-gradient(180deg, rgba(248, 216, 115, .04), rgba(0, 0, 0, 0));
}

[b-s4mig8vsko] .product-carousel__item .product-card__price-group {
    justify-items: center;
    text-align: center;
}

[b-s4mig8vsko] .product-carousel__item .product-card__price-group--walkshop {
    justify-items: center;
    text-align: center;
}

[b-s4mig8vsko] .product-carousel__item .product-card__price-label {
    color: rgba(255, 255, 255, .62);
    font-size: .76rem;
}

[b-s4mig8vsko] .product-carousel__item .product-card__price {
    color: #f8d873;
    font-size: clamp(2.05rem, 2.2vw, 2.65rem);
    font-weight: 950;
    line-height: 1;
    letter-spacing: .01em;
    text-shadow:
        0 0 18px rgba(248, 216, 115, .30),
        0 10px 24px rgba(0, 0, 0, .42);
}

[b-s4mig8vsko] .product-carousel__item .product-card__rsi {
    font-size: .95rem;
}

[b-s4mig8vsko] .product-carousel__item .product-card__actions {
    justify-content: center;
}

[b-s4mig8vsko] .product-carousel__nav {
    width: 44px;
    height: 44px;
    align-self: center;
    border: 1px solid rgba(248, 216, 115, .36) !important;
    background: rgba(9, 14, 23, .86) !important;
    color: #f8d873 !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .35);
}

[b-s4mig8vsko] .product-carousel__nav--previous {
    justify-self: start;
}

[b-s4mig8vsko] .product-carousel__nav--next {
    justify-self: end;
}

[b-s4mig8vsko] .product-carousel__nav:hover {
    background: rgba(139, 28, 33, .9) !important;
    color: #fff !important;
}

.product-carousel__bullets[b-s4mig8vsko] {
    position: absolute;
    left: 50%;
    bottom: .25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .8rem;
    transform: translateX(-50%);
}

.product-carousel__bullet[b-s4mig8vsko] {
    width: 14px;
    height: 14px;
    border: 2px solid rgba(248, 216, 115, .72);
    border-radius: 999px;
    background: transparent;
    cursor: pointer;
    transition: background .18s ease, border-color .18s ease, transform .18s ease;
}

.product-carousel__bullet:hover[b-s4mig8vsko],
.product-carousel__bullet--active[b-s4mig8vsko] {
    background: #f8d873;
    border-color: #f8d873;
    transform: scale(1.08);
}

@media (max-width: 640px) {
    .product-carousel[b-s4mig8vsko] {
        grid-template-columns: 1fr;
        gap: .75rem;
    }

    .product-carousel__item[b-s4mig8vsko] {
        min-height: 560px;
    }

    [b-s4mig8vsko] .product-carousel__nav {
        position: absolute;
        top: 45%;
        z-index: 2;
    }

    [b-s4mig8vsko] .product-carousel__nav--previous {
        left: .35rem;
    }

    [b-s4mig8vsko] .product-carousel__nav--next {
        right: .35rem;
    }
}