.hero{position:relative;overflow:hidden;padding:54px 0 0;background:radial-gradient(circle at 78% 34%,rgba(0,180,216,.2),transparent 30%),linear-gradient(180deg,var(--navy-900),var(--navy-950))}.hero-grid{position:relative;z-index:2;min-height:570px;display:grid;grid-template-columns:.92fr 1.08fr;align-items:center;gap:55px}.hero-content{padding-bottom:38px}.hero h1{max-width:720px;margin-top:13px;font-size:clamp(3.3rem,5.4vw,6.2rem);line-height:.98;letter-spacing:-.055em;text-transform:uppercase}.hero h1 span{display:block;margin-top:7px;color:var(--cyan-light)}.hero-description{max-width:650px;margin-top:22px;color:var(--gray-300)}.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}.hero-mini-benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-top:34px}.hero-mini-benefits article{display:flex;align-items:center;gap:9px}.mini-icon{width:34px;height:34px;display:grid;place-items:center;border:1px solid rgba(0,180,216,.45);border-radius:10px;color:var(--cyan-light);background:rgba(0,180,216,.08);font-size:.68rem;font-weight:900}.hero-mini-benefits strong,.hero-mini-benefits small{display:block}.hero-mini-benefits strong{font-size:.68rem;text-transform:uppercase}.hero-mini-benefits small{color:var(--gray-500);font-size:.62rem}.hero-visual{position:relative;min-height:520px;display:grid;place-items:end center}.hydrix-stage{width:min(100%,660px);height:500px;display:grid;place-items:center}.hydrix-placeholder{width:430px;height:430px;display:grid;place-items:center;align-content:center;border:1px solid rgba(0,180,216,.42);border-radius:50%;background:radial-gradient(circle,rgba(0,180,216,.28),transparent 66%);box-shadow:0 0 90px rgba(0,180,216,.22);animation:hydrixFloat 4s ease-in-out infinite}.hydrix-placeholder strong{font-size:4rem;font-weight:900}.hydrix-placeholder span{margin-top:8px;color:var(--gray-300);font-size:.72rem}.floating-card{position:absolute;z-index:4;width:120px;height:165px;display:grid;place-items:center;border:4px solid var(--gold);border-radius:13px;background:linear-gradient(145deg,#0c3a5e,#07192d);box-shadow:var(--shadow-deep);font-weight:900}.floating-card-one{left:2%;top:16%;transform:rotate(-11deg)}.floating-card-two{right:2%;top:24%;transform:rotate(9deg)}.trust-bar{position:relative;z-index:3;display:grid;grid-template-columns:repeat(4,1fr);border:var(--border-soft);border-radius:var(--radius-md) var(--radius-md) 0 0;background:rgba(8,26,48,.82)}.trust-bar article{display:flex;align-items:center;gap:12px;padding:20px 24px;border-right:1px solid rgba(0,180,216,.14)}.trust-bar article:last-child{border-right:none}.trust-icon{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--cyan);border-radius:12px;color:var(--cyan-light);font-size:.72rem;font-weight:900}.trust-bar strong,.trust-bar small{display:block}.trust-bar strong{font-size:.75rem;text-transform:uppercase}.trust-bar small{color:var(--gray-500);font-size:.66rem}@keyframes hydrixFloat{50%{transform:translateY(-10px)}}


/* Hydrix oficial dentro del círculo principal */
.hydrix-placeholder{overflow:hidden}
.hero-hydrix-bust{width:108%;height:108%;object-fit:contain;object-position:center bottom;display:block;position:relative;z-index:2;filter:drop-shadow(0 15px 22px rgba(0,0,0,.30)) drop-shadow(0 0 18px rgba(0,180,216,.20));transition:transform .35s ease,filter .35s ease}
.hydrix-placeholder:hover .hero-hydrix-bust{transform:scale(1.04);filter:drop-shadow(0 18px 26px rgba(0,0,0,.34)) drop-shadow(0 0 24px rgba(0,180,216,.32))}
@media(max-width:768px){.hydrix-placeholder{width:290px;height:290px}.hero-hydrix-bust{width:110%;height:110%}}


/* =========================================
   IMÁGENES REALES - TARJETAS FLOTANTES HERO
   ========================================= */
.hero-floating-card__image {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    border-radius: inherit;
}

/* Evita que la imagen altere la inclinación/posición
   del contenedor flotante existente. */


/* =========================================
   PSA 10 - AJUSTE DEFINITIVO AL MARCO
   ========================================= */

/* Hacemos más alto y ancho SOLO el marco PSA 10 */
.floating-card.floating-card-two {
    width: 145px !important;
    height: 215px !important;
    padding: 7px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

/* La PSA completa queda dentro del borde amarillo */
.floating-card.floating-card-two .hero-floating-card__image {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
    border-radius: 7px !important;
    display: block !important;
}

/* Mantener tamaño más controlado en pantallas pequeñas */
@media (max-width: 768px) {
    .floating-card.floating-card-two {
        width: 112px !important;
        height: 166px !important;
        padding: 5px !important;
    }
}
