/* =========================================
   LOADER RESPONSIVE (MÓVIL)
========================================= */
/* =========================
   MOBILE
========================= */

/* =========================================
   HERO RESPONSIVE NUEVO (FIX FINAL)
========================================= */
/* =========================================
   HERO RESPONSIVE NUEVO (FIX FINAL)
========================================= */
/* =========================================
   HERO RESPONSIVE NUEVO (FIX FINAL)
========================================= */
/* =========================================
   HERO RESPONSIVE NUEVO (FIX FINAL)
========================================= */
/* =========================================
   HERO RESPONSIVE REBUILD
   TODO ABSOLUTO EXCEPTO MODELO Y BOTONES
========================================= */
/* =========================================
   HERO RESPONSIVE LIMPIO
   DEJA SOLO ESTE BLOQUE
========================================= */

/* =========================================
   HERO RESPONSIVE LIMPIO
   DEJA SOLO ESTE BLOQUE
========================================= */

/* =========================================
   HERO RESPONSIVE COMPLETO
========================================= */

@media (max-width:1180px){

  html, body{
    overflow-x:hidden;
  }

  .hero-luxury-new{
    min-height:calc(100vh - 78px);
    padding:76px 0 18px;
    overflow:hidden;
  }

  .hero-luxury-new .container{
    position:relative;
  }

  .hero-grid{
    position:relative;
    display:block;
    min-height:760px;
    overflow:hidden;
  }

  .hero-center{
    position:relative;
    min-height:760px;
    z-index:4;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-end;
    padding-top:210px;
    padding-bottom:42px;
  }

  .hero-glow{
    position:absolute;
    inset:0;
    pointer-events:none;
  }

  .hero-particles{
    position:absolute;
    inset:0;
    pointer-events:none;
    z-index:1;
  }

  .hero-particles .particle{
    position:absolute;
  }

  .hero-side{
    display:flex;
    position:absolute;
    top:0;
    bottom:0;
    width:190px;
    justify-content:center;
    pointer-events:none;
    z-index:6;
  }

  .hero-side.left{ left:0; }
  .hero-side.right{ right:0; }

  .hero-side-line{
    position:absolute;
    top:52%;
    width:3px;
    height:320px;
    transform:translateY(-50%);
    opacity:1;
  }

  .hero-side.left .hero-side-line{ right:8px; }
  .hero-side.right .hero-side-line{ left:8px; }

  .side-orbit-scene{
    position:absolute;
    top:110px;
  }

  .hero-side-note{
    position:absolute;
  }

  .hero-title-top{
    position:absolute;
    top:56px;
    left:50%;
    transform:translateX(-50%);
    width:min(100%, 900px);
    padding:0 24px;
    text-align:center;
    z-index:8;
  }

  .hero-title{
    font-size:clamp(2.4rem, 5.5vw, 3.6rem);
    line-height:1.03;
    text-align:center;
    white-space:normal;
    margin:0;
  }

  .hero-model-wrap{
    position:relative;
    top:auto;
    left:auto;
    transform:none;
    width:min(420px,100%);
    margin-top:auto;
    z-index:5;
  }

  .hero-model{
    display:block;
    width:100%;
    height:auto;
  }

  .hero-actions-center{
    position:relative;
    top:auto;
    left:auto;
    bottom:auto;
    transform:none;
    width:auto;
    margin-top:-6px;
    z-index:7;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    flex-wrap:wrap;
  }
}

/* =========================================
   TABLET
========================================= */
@media (max-width:768px){

  .hero-luxury-new{
    padding:56px 0 16px;
  }

  .hero-grid{
    min-height:720px;
  }

  .hero-center{
    min-height:720px;
    padding-top:190px;
    padding-bottom:34px;
  }

  .hero-side{
    width:120px;
  }

  .hero-side-line{
    height:270px;
    width:3px;
  }

  .hero-side.left .hero-side-line{ right:-10px; }
  .hero-side.right .hero-side-line{ left:-10px; }

  .side-orbit-scene{
    top:108px;
  }

  .hero-title-top{
    top:42px;
    padding:0 20px;
  }


/* =========================================
   SUBCATEGORÍAS MOBILE · ESPACIADO CORRECTO
========================================= */
@media (max-width:768px){

  #subGrid .sub-card{
    height:240px !important;
    min-height:240px !important;
    max-height:240px !important;
    padding:8px !important;
    position:relative !important;
    overflow:hidden !important;
  }

  /* caja beige superior */
  #subGrid .sub-card-image{
    height:96px !important;
    margin:18px auto 0 !important;

    display:flex !important;
    align-items:flex-start !important;
    justify-content:center !important;
    padding-top:14px !important;
  }

  /* imagen */
  #subGrid .sub-card-image img{
    max-width:58px !important;
    max-height:58px !important;
    margin-bottom:10px !important;
  }

  /* contenido */
  #subGrid .sub-card-content{
    position:absolute !important;
    left:0 !important;
    bottom:22px !important;
    width:100% !important;
    padding:0 8px !important;
    z-index:20 !important;
  }

  /* título */
  #subGrid .sub-card-title{
    font-size:1.45rem !important;
    line-height:1 !important;
    margin:0 0 20px !important;
  }

  /* botón */
  #subGrid .sub-card-btn{
    height:42px !important;
    min-height:42px !important;
    margin:0 !important;
  }
}
  .hero-title{
    font-size:clamp(2.2rem, 9vw, 3rem);
    line-height:1.03;
    text-align:center;
    white-space:normal;
  }

  .hero-model-wrap{
    width:min(340px,100%);
  }

  .hero-actions-center{
    margin-top:-2px;
    gap:10px;
  }
}

/* =========================================
   MOBILE FINAL FORZADO
========================================= */
/* =========================================
   MOBILE FINAL CORREGIDO
========================================= */
/* =========================================
   MOBILE FINAL AJUSTADO
========================================= */
/* =========================================
   MOBILE FINAL AJUSTE FINO
========================================= */
/* =========================================
   MOBILE FINAL AJUSTE DEFINITIVO
========================================= */
@media (max-width:480px){

  html, body{
    overflow-x:hidden !important;
  }

  .hero-luxury-new{
    min-height:calc(100vh - 74px) !important;
    padding:26px 0 0 !important;
    overflow:hidden !important;
  }

  .hero-luxury-new .container{
    position:relative !important;
  }

  .hero-grid{
    position:relative !important;
    display:block !important;
    min-height:680px !important;
    height:calc(100vh - 74px) !important;
    overflow:hidden !important;
  }

  .hero-center{
    position:relative !important;
    min-height:680px !important;
    height:100% !important;
    display:block !important;
    z-index:4 !important;
  }

  /* =========================================
     TÍTULO
  ========================================= */
  .hero-title-top{
    position:absolute !important;
    top:102px !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    width:100% !important;
    padding:0 16px !important;
    text-align:center !important;
    z-index:12 !important;
  }

  .hero-title-top::before{
    content:"";
    position:absolute !important;
    top:-6px !important;
    left:50% !important;
    width:min(145px, 40vw) !important;
    height:2px !important;
    transform:translateX(-50%) !important;
  }

  .hero-title{
    margin:0 !important;
    font-size:clamp(2.72rem, 11.8vw, 3.24rem) !important;
    line-height:.96 !important;
    letter-spacing:.02em !important;
    text-align:center !important;
    white-space:normal !important;
  }

  .hero-title .gold-char::after{
    content:"\A";
    white-space:pre;
  }

  /* =========================================
     MODELO
  ========================================= */
.hero-model-wrap{
  position:absolute !important;
  left:50% !important;
  top:150px !important; /* antes 208px */
  transform:translateX(-50%) !important;
  width:min(298px, 84vw) !important;
  z-index:6 !important;
}

  .hero-model{
    display:block !important;
    width:100% !important;
    height:auto !important;
    transform:translateY(-14px) !important;
  }

  /* =========================================
     BOTONES
  ========================================= */
  .hero-actions-center{
    position:absolute !important;
    left:50% !important;
    bottom:88px !important;
    transform:translateX(-50%) !important;
    width:min(100%, 282px) !important;
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;
    z-index:20 !important;
  }

  .hero-actions-center .hero-btn{
    width:100% !important;
    min-height:45px !important;
  }

  /* =========================================
     LATERALES
  ========================================= */
  .hero-side{
    position:absolute !important;
    top:0 !important;
    bottom:0 !important;
    width:96px !important;
    pointer-events:none !important;
    z-index:8 !important;
  }

  .hero-side.left{
    left:-14px !important;
  }

  .hero-side.right{
    right:-14px !important;
  }

  /* =========================================
     ESFERAS (SIN CAMBIOS)
  ========================================= */
  .side-orbit-scene{
    position:absolute !important;
    top:232px !important;
    width:82px !important;
    height:82px !important;
    transform:none !important;
  }

  .hero-side.left .side-orbit-scene{
    left:10px !important;
    right:auto !important;
  }

  .hero-side.right .side-orbit-scene{
    right:10px !important;
    left:auto !important;
  }

  .side-orbit-scene::before,
  .side-orbit-scene::after{
    width:66px !important;
    height:66px !important;
  }

  .side-orbit-card{
    width:36px !important;
    height:36px !important;
    margin-left:-18px !important;
    margin-top:-18px !important;

    transform:
      rotateY(calc((var(--i) - 1) * 90deg))
      translateZ(36px) !important;
  }

/* =========================================
   LÍNEAS VERTICALES 🔥 MÁS AFUERA + MÁS ARRIBA
========================================= */
/* =========================================
   LÍNEAS VERTICALES
========================================= */
/* =========================================
   LÍNEAS VERTICALES 🔥 MÁS AFUERA + MÁS ARRIBA
========================================= */
/* =========================================
   LÍNEAS VERTICALES 🔥 UN POCO MÁS AFUERA
========================================= */
/* =========================================
   LÍNEAS VERTICALES 🔥 UN POQUITO MÁS AFUERA
========================================= */
/* =========================================
   LÍNEAS VERTICALES 🔥 MÁS AFUERA
========================================= */
/* =========================================
   LÍNEAS VERTICALES 🔥 FIX DEFINITIVO
========================================= */
.hero-side-line{
  position:absolute !important;
  top:315px !important;
  width:2px !important;
  height:175px !important;
  transform:none !important;
}

.hero-side.left .hero-side-line{
  right:30px !important;
}

.hero-side.right .hero-side-line{
  left:30px !important;
}
/* =========================================
   TEXTO VERTICAL 🔥 UN POQUITO MÁS AFUERA
========================================= */
.hero-side-note{
  position:absolute !important;
  top:380px !important;
  font-size:.64rem !important;
  opacity:.9 !important;
}

.hero-side.left .hero-side-note{
  right:0 !important;
  transform:translateX(260%) rotate(-90deg) !important; /* 🔥 antes 240% */
}

.hero-side.right .hero-side-note{
  left:0 !important;
  transform:translateX(-260%) rotate(90deg) !important;
}


/* =========================================
  navbar 
========================================= */
/* =========================================
  navbar 
========================================= */
/* =========================================
  navbar 
========================================= */
@media (max-width: 991px){

  .site-header{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:1000;
  }

  .navbar-shell{
    display:grid;
    grid-template-columns:56px 1fr 56px;
    align-items:center;
    padding:14px 12px;
    min-height:84px;
    position:relative;
    z-index:1002;
  }

  /* HAMBURGUESA */
  .nav-toggle{
    display:flex;
    align-items:center;
    justify-content:center;
    width:56px;
    height:56px;
    border-radius:14px;
    border:1px solid rgba(220,171,94,.2);
    background:rgba(0,0,0,.4);
    backdrop-filter:blur(8px);
    cursor:pointer;
    position:relative;
    z-index:1004;
  }

  .nav-toggle span{
    position:absolute;
    width:24px;
    height:2px;
    background:#fff;
    border-radius:999px;
    transition:.3s;
  }

  .nav-toggle span:nth-child(1){ transform:translateY(-7px); }
  .nav-toggle span:nth-child(3){ transform:translateY(7px); }

  .nav-toggle.active span:nth-child(1){
    transform:rotate(45deg);
  }

  .nav-toggle.active span:nth-child(2){
    opacity:0;
  }

  .nav-toggle.active span:nth-child(3){
    transform:rotate(-45deg);
  }

  /* LOGO */
  .logo{
    justify-self:center;
    z-index:1004;
  }

  .logo img{
    height:46px;
    max-width:140px;
  }

  /* IDIOMA */
  .nav-cta{
    justify-self:end;
    z-index:1004;
  }

  .lang-switch{
    height:42px;
    padding:0 8px;
  }

  .flag-icon{
    width:24px;
    height:24px;
  }

  .lang-switch span{
    display:none;
  }

  /* MENU DESLIZANTE SUAVE */
  .nav-center{
    display:flex !important;
    justify-content:flex-start;
    align-items:flex-start;
    flex-direction:column;

    position:fixed;
    top:84px;
    left:0;

    width:74%;
    max-width:270px;

    height:auto;
    max-height:calc(100vh - 84px);
    overflow-y:auto;

    background:rgba(0,0,0,.96);
    backdrop-filter:blur(10px);

    padding:16px 20px 18px;

    transform:translateX(-110%);
    transition:
      transform .8s cubic-bezier(.22,.61,.36,1),
      box-shadow .45s ease;

    z-index:1003;
  }

  .nav-center.active{
    transform:translateX(0);
    box-shadow:12px 0 40px rgba(0,0,0,.6);
  }

  .nav-links{
    display:flex;
    flex-direction:column;
    gap:0;
    margin:0;
    padding:0;
    width:100%;
  }

  /* LINKS MEJORADOS */
  .nav-links a{
    display:block;
    width:100%;
    padding:14px 0;
    margin-bottom:10px;
    font-size:.98rem;
    color:rgba(255,255,255,.82);
    text-decoration:none;
    position:relative;
    border-bottom:1px solid rgba(255,255,255,.08);
    transition:.25s ease;
  }

  .nav-links a::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-2px;
    width:0;
    height:1px;
    background:#dcab5e;
    transition:.25s ease;
  }

  .nav-links a:hover{
    color:#dcab5e;
  }

  .nav-links a:hover::after{
    width:100%;
  }

  /* OVERLAY */
  .nav-overlay{
    display:block;
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.32);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .45s ease, visibility .45s ease;
    z-index:1001;
  }

  .nav-overlay.active{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
  }
}

/* =========================================
   MOBILE SMALL
========================================= */
@media (max-width: 575px){

  .navbar-shell{
    grid-template-columns:52px 1fr 52px;
    min-height:78px;
  }

  .nav-toggle{
    width:52px;
    height:52px;
  }

  .logo img{
    max-width:130px;
  }

  .nav-center{
    top:78px;
    max-height:calc(100vh - 78px);
  }
}




/* =========================
   BANNER
========================= */
@media (max-width: 1120px){
  .material-banner-inner{
    grid-template-columns:220px 1fr;
    gap:22px;
  }

  .material-main{
    padding-right:0;
  }

  .material-prices{
    grid-column:1 / -1;
    padding-left:0;
    padding-top:8px;
  }

  .material-prices::before{
    display:none;
  }
}

@media (max-width: 820px){
  .material-banner-inner{
    grid-template-columns:1fr;
    text-align:center;
    gap:16px;
    padding:26px 20px;
    min-height:auto;
  }

  .material-main,
  .material-prices{
    display:flex;
    flex-direction:column;
    align-items:center;
  }

  .material-prices{
    width:100%;
    max-width:560px;
  }

  .prices-mini-columns{
    grid-template-columns:1fr;
    width:100%;
  }

  .material-description{
    max-width:680px;
  }

  .material-image{
    transform:translateY(-12px);
  }

  .material-title{
    justify-content:center;
  }
}

@media (max-width: 560px){

  /* 🔥 18K 750 más grueso */
  .material-title{
    font-size:clamp(1.95rem, 9vw, 2.45rem);
    font-weight:600; /* antes 400 */
  }

  .material-title .light{
    font-weight:500; /* antes 300 */
  }

  /* descripción */
  .material-description{
    font-size:.82rem;
  }

  /* contenedor precios */
  .prices-mini{
    padding:12px 12px;
  }

  /* 🔥 título precios más grande */
  .prices-mini-title{
    font-size:.86rem; /* antes .8 */
    letter-spacing:.12em;
  }

  /* 🔥 items más grandes */
  .prices-mini-item{
    font-size:.76rem; /* antes .73 */
  }

  /* 🔥 valores más visibles */
  .prices-mini-item strong{
    font-size:.85rem; /* antes .79 */
    font-weight:700;
  }

  /* visual */
  .material-frame{
    width:180px;
    height:140px;
  }

  .material-image{
    width:165px;
  }

  .material-visual{
    height:145px;
  }
}
/* =========================
   ABOUT
========================================= */
@media (max-width:1100px){
  .about-monarca-grid{
    grid-template-columns:1fr;
  }

  .about-monarca-content{
    padding:0 40px;
    max-width:100%;
  }

  .about-monarca-text{
    max-width:100%;
  }

  .about-monarca-visual{
    min-height:650px;
    height:650px;
    padding:10px 18px 0;
  }

  .about-columns{
    max-width:100%;
    width:100%;
  }
}

/* =========================
   MOBILE
========================= */
@media (max-width:768px){
  .about-monarca-full{
    padding:50px 0;
  }

  .about-monarca-content{
    padding:0 20px;
  }

  .about-monarca-kicker{
    margin-bottom:6px;
    transform:translateY(4px);
    font-size:.72rem;
    letter-spacing:.24em;
  }

.about-monarca-title{
  font-size:clamp(2.4rem,9.5vw,3.6rem);
}

  .about-monarca-line{
    margin:10px 0 16px;
  }

  /* 🔥 CONTADORES EN UNA SOLA LINEA */
  .about-monarca-stats{
    grid-template-columns:repeat(3,1fr);
    gap:10px;
    margin-top:24px;
    max-width:100%;
  }

  .about-monarca-stats article{
    padding:14px 8px;
    border-radius:14px;
  }

.about-monarca-stats strong{
  font-size:1.38rem; /* antes 1.3 */
}

.about-monarca-stats span{
  font-size:.74rem; /* antes .7 */
}
  /* VISUAL */
  .about-monarca-visual{
    min-height:560px;
    height:560px;
    padding:0 10px;
  }

  .about-columns{
    gap:10px;
    width:100%;
    max-width:100%;
  }

  .about-column{
    height:660px;
    width:100%;
  }

  .about-track{
    gap:10px;
    width:100%;
  }

  /* 🔥 IMAGENES CUBRIENDO COMPLETO LA FIGURA */
  .about-card{
    position:relative;
    width:100%;
    overflow:hidden;
    padding:0 !important;
    background:none;
  }

  .about-card img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    display:block;
  }

  .size-xl{ height:250px; }
  .size-lg{ height:210px; }
  .size-md{ height:175px; }
  .size-sm{ height:140px; }

  .radius-arch{
    border-radius:120px 120px 22px 22px;
  }

  .radius-soft{
    border-radius:22px;
  }

  .radius-cut{
    border-radius:20px 20px 56px 20px;
  }
}

/* =========================
  Categorias 
========================= */
@media (max-width:1300px){

  .catalog-editorial-wrap{
    grid-template-columns: 35% 65%;
    min-height: 620px;
    height: 620px;
  }

  .catalog-editorial-left,
  .catalog-editorial-right{
    height: 620px;
  }

  .editorial-cards{
    margin-left: -95px;
  }

  .editorial-card{
    width: 280px;
    min-height: 335px;
  }

  .editorial-card-image{
    width: 155px;
    height: 155px;
  }
}

@media (max-width:1100px){

  .catalog-editorial-wrap{
    grid-template-columns: 1fr;
    min-height: auto;
    height: auto;
  }

  .catalog-editorial-left{
    min-height: 520px;
    height: 520px;
  }

  .catalog-editorial-right{
    height: auto;
    padding: 50px 24px 40px;
  }

  .editorial-cards{
    margin-left: 0;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 60px;
  }

  .editorial-left-overlay{
    padding: 90px 40px 70px 55px;
  }
}

@media (max-width:768px){

  .catalog-editorial-left{
    min-height: 460px;
    height: 460px;
  }

  .editorial-left-overlay{
    inset: 0;
    padding: 40px 22px 40px;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    text-align: left;
  }

  .editorial-signature,
  .editorial-flower{
    display: none !important;
  }

  /* 🔥 ELEGANCIA MÁS SUTIL */
  .editorial-left-title{
    font-size: clamp(2.6rem, 11vw, 4rem); /* más pequeña */
    transform: translate(55px, 155px); /* un poco más abajo */
    letter-spacing: .05em;
  }

  .catalog-editorial-right{
    padding: 40px 18px 30px;
  }

  .editorial-kicker{
    display: block;
    text-align: left;
    margin-bottom: 10px;
    font-size: .75rem;
    letter-spacing: .18em;
  }

  /* 🔥 TAMAÑO ORIGINAL RESTAURADO */
  .editorial-main-title{
    margin: 0 0 24px;
    text-align: left;
    font-size: clamp(2.9rem, 11vw, 4.2rem);
    line-height: .92;
  }

  .editorial-cards{
    gap: 14px;
    margin-top: 16px;
    justify-content: center;
  }

  .editorial-card{
    width: 100%;
    max-width: 280px;
    min-height: 300px;
    padding: 18px 14px 20px;
  }

  .editorial-card-image{
    width: 170px;
    height: 170px;
    margin: 0 auto 20px;
    border-radius: 50%;
    overflow: hidden;
  }

  .editorial-card-image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  .editorial-line{
    margin: 0 auto 14px;
  }

  .editorial-card h4{
    margin: 0 0 8px;
    font-size: 1.7rem;
  }

  .editorial-card span{
    font-size: .72rem;
    letter-spacing: .11em;
  }
}



/* =========================
   SERVICIOS
========================= */

@media (max-width: 980px){
  .services-a-item{
    grid-template-columns: 110px 1fr 220px;
  }

  .services-a-tag{
    justify-self: end;
  }
}

@media (max-width: 760px){
  .services-premium-section.services-variant-a{
    padding: 80px 20px;
  }

  .services-a-item{
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 24px 0;
    transform: none !important;
  }

  /* 🔥 KICKER MÁS PEQUEÑO REAL */
  .services-kicker{
    font-size: .66rem;
    letter-spacing: .28em;
    margin-bottom: 16px;
  }

  /* 🔥 TITULO MÁS GRANDE */
  .services-title{
    font-size: clamp(2.5rem, 9.5vw, 3.9rem);
    line-height: .94;
  }

  .services-a-content h3{
    font-size: 1.8rem;
  }

  .services-subtitle{
    font-size: .96rem;
    line-height: 1.8;
  }

  .services-a-tag{
    justify-self: start;
    justify-content: flex-start;
    text-align: left;
    width: auto;
    gap: 10px;
    margin-top: 4px;
  }

  .services-a-tag i{
    opacity: .9;
    transform: none;
  }

  .services-a-item:hover .services-a-tag i{
    transform: none;
  }
}

@media (max-width: 520px){
  .services-a-content h3{
    font-size: 1.55rem;
    line-height: 1.08;
  }

  .services-a-content p{
    font-size: .93rem;
    line-height: 1.72;
  }

  /* 🔥 AÚN MÁS FINO EN PANTALLAS PEQUEÑAS */
  .services-kicker{
    font-size: .62rem;
    letter-spacing: .26em;
    margin-bottom: 14px;
  }
}



/* =========================
   CONTACTO
========================= */

@media (max-width: 980px){

  .contact-luxury-wrap{
    grid-template-columns: 1fr;
  }

  .contact-luxury-info-side{
    border-left: none;
    border-top: 1px solid rgba(255,255,255,.05);
  }

}

@media (max-width: 768px){

  .contact-luxury-form-side,
  .contact-luxury-info-side{
    padding: 42px 24px;
  }

  .contact-row.two-cols,
  .contact-row.three-cols{
    grid-template-columns: 1fr;
  }

  /* 🔥 TITULOS MÁS GRANDES Y UNIFICADOS */
.contact-luxury-title,
.contact-side-title{
  font-size: clamp(2.8rem, 10.5vw, 4rem);
  line-height: .95;
}
  /* 🔥 KICKERS MÁS PEQUEÑOS */
  .contact-kicker,
  .contact-side-kicker{
    font-size: .64rem;
    letter-spacing: .28em;
    margin-bottom: 12px;
  }

  /* 🔥 BOTON MÁS FINO */
  .contact-luxury-btn{
    letter-spacing: .14em;
    font-size: .88rem;
    font-weight: 500;
  }
  .contact-luxury-section{
    padding-bottom: 200px; /* 🔥 espacio para el floating */
  }

}

.contact-floating-inner::after{
  content:"";
  position:absolute;
  top:0;
  left:20%;
  width:60%;
  height:1px;
  background: linear-gradient(90deg, transparent, #dcab5e, transparent);
  opacity:.6;
}

/* =========================
   CAREERS SIDE (RIGHT)
========================= */

/* =========================
   FLOATING CAREERS (CENTER)
========================= */

.contact-luxury-section{
  position: relative;
  overflow: visible;
}

/* CONTENEDOR GENERAL */
.contact-floating-careers{
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -30px;

  width: min(700px, 92%);
  z-index: 5;
}

/* CARD */
.contact-floating-inner{
  padding: 30px 26px;
  text-align: center;

  background: linear-gradient(180deg, #0d0d0d, #070707);
  border: 1px solid rgba(216,188,134,.35);

  box-shadow: 
    0 20px 60px rgba(0,0,0,.6),
    0 0 40px rgba(216,188,134,.08);
    
  position: relative;
  overflow: hidden;
}

/* glow top */
.contact-floating-inner::before{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(circle at top, rgba(216,188,134,.18), transparent 60%);
  pointer-events:none;
}

/* TITULO */
.contact-floating-inner h3{
  margin: 0 0 10px;
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.8rem;
  color: #f5f1e8;
}

/* TEXTO */
.contact-floating-inner p{
  margin: 0 0 18px;
  font-size: .95rem;
  color: #c7c0b3;
  line-height: 1.6;
}

/* BOTON */
.contact-floating-inner a{
  display: inline-block;
  padding: 12px 26px;

  border: 1px solid #dcab5e;
  color:#dcab5e;
  text-decoration: none;

  font-size: .75rem;
  letter-spacing: .25em;
  text-transform: uppercase;

  transition: .3s ease;
}

.contact-floating-inner a:hover{
  background: #dcab5e;
  color: #111;
  transform: translateY(-2px);
  box-shadow: 0 10px 25px rgba(216,188,134,.25);
}


/* =========================
   FOOTER LUXURY · RESPONSIVE
========================= */
/* =========================
   FOOTER LUXURY · RESPONSIVE
========================= */
@media (max-width:980px){

  .footer-luxury{
    padding:56px 0 30px;
  }

  .footer-luxury::before,
  .footer-luxury::after{
    width:100%;
    height:50%;
  }

  .footer-luxury::before{
    top:0;
    left:0;
    right:auto;
  }

  .footer-luxury::after{
    top:auto;
    bottom:0;
    right:0;
    left:auto;
  }

  .footer-luxury-top{
    grid-template-columns:1fr;
    gap:34px;
    min-height:auto;
  }

  .footer-luxury-top::before{
    display:none;
  }

  .footer-luxury-center{
    transform:none !important;
    order:-1;
  }

  .footer-luxury-nav,
  .footer-luxury-social{
    text-align:center;
  }

  .footer-brand-logo{
    max-width:560px;
    padding:34px 28px;
  }

  .footer-brand-logo img{
    height:130px;
    margin-left:0;
    margin-bottom:18px;
    transform: translateX(0); /* 🔥 sin desplazamiento */
  }

  .footer-brand-text{
    max-width:460px;
    font-size:.98rem;
    line-height:1.85;
  }

  .footer-luxury-side h4{
    margin-bottom:18px;
  }

  .footer-luxury-divider{
    margin:34px 0 14px;
  }
}

@media (max-width:768px){

  .footer-luxury{
    padding:48px 0 26px;
  }

  .footer-luxury::before,
  .footer-luxury::after{
    width:100%;
    height:50%;
    background-position:center center;
  }

  .footer-luxury .container{
    padding-left:18px;
    padding-right:18px;
  }

  .footer-luxury-top{
    gap:28px;
  }

  .footer-luxury-center{
    width:100%;
  }

  .footer-brand-logo{
    max-width:100%;
    padding:28px 20px;
    border-radius:22px;
  }

  .footer-brand-logo img{
    height:108px;
    margin-bottom:16px;
    transform: translateX(0);
  }

  .footer-brand-text{
    max-width:100%;
    font-size:.92rem;
    line-height:1.75;
  }

  .footer-luxury-side h4{
    font-size:1.55rem;
    margin:0 0 16px;
  }

  .footer-luxury-side h4::after{
    width:44px;
    margin-top:10px;
  }

  .footer-luxury-nav ul,
  .footer-social-links{
    gap:10px;
  }

  .footer-luxury-nav a,
  .footer-social-links a{
    font-size:.95rem;
    line-height:1.5;
  }

  .footer-social-links a{
    gap:7px;
  }

  .footer-social-links a i{
    font-size:.92rem;
  }

  .footer-luxury-divider{
    gap:12px;
    margin:28px 0 12px;
  }

  .footer-luxury-divider span{
    width:min(100%,120px);
  }

  .footer-luxury-bottom{
    margin-top:12px;
    padding-top:10px;
  }

  .footer-luxury-bottom p{
    font-size:.84rem;
    line-height:1.6;
    padding:0 8px;
  }

  .footer-brand-logo{
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
  }

  .footer-brand-logo img{
    margin-left:0;
    margin-right:0;
    display:block;
  }
}

@media (max-width:520px){

  .footer-luxury{
    padding:42px 0 22px;
  }

  .footer-luxury .container{
    padding-left:14px;
    padding-right:14px;
  }

  .footer-luxury-top{
    gap:24px;
  }

  .footer-brand-logo{
    padding:24px 16px;
    border-radius:20px;
  }

  .footer-brand-logo img{
    height:92px;
    transform: translateX(0);
  }

  .footer-brand-text{
    font-size:.88rem;
    line-height:1.68;
  }

  .footer-luxury-side h4{
    font-size:1.38rem;
    letter-spacing:.06em;
  }

  .footer-luxury-nav a,
  .footer-social-links a{
    font-size:.9rem;
  }

  .footer-luxury-divider span{
    width:min(100%,82px);
  }

  .footer-luxury-bottom p{
    font-size:.8rem;
  }
}
/* =========================
  Categorias 
========================= */

/* =========================
  Categorias 
========================= */
/* =========================
  Categorias 
========================= */
/* =========================
  Categorias 
========================= */
/* =========================
  Categorias 
========================= */
/* =========================
  Categorias 
========================= */
/* =========================
  Categorias 
========================= */
/* =========================
  Categorias 
========================= */
/* =========================
   CATEGORÍAS · RESPONSIVE NUEVO
========================= */
@media (max-width:980px){

  /* separación del navbar */
  .catalog-section{
    padding:112px 0 40px;
  }

  /* 🔥 layout ajustado */
  .catalog-grid{
    display:grid;
    grid-template-columns:1fr 1.12fr 1fr;
    grid-template-rows:185px 185px 185px;
    gap:12px;
    width:100%;
  }

  .left{
    grid-column:1;
    grid-row:1 / span 3;
  }

  .top{
    grid-column:2;
    grid-row:1;
    margin-bottom:10px;
  }

  .bottom{
    grid-column:2;
    grid-row:2;
    margin-bottom:10px;
  }

  .full{
    grid-column:2;
    grid-row:3;
    overflow:hidden;
  }

  .right{
    grid-column:3;
    grid-row:1 / span 3;
  }

  /* imagen */
  .card img{
    width:100%;
    height:100%;
    object-fit:cover;
  }

  .top img,
  .bottom img,
  .full img{
    object-position:center center;
    transform:scale(1.03);
  }

  .top:hover img,
  .bottom:hover img,
  .full:hover img{
    transform:scale(1.06);
  }

  .full img{
    object-position:center 42%;
    transform:scale(1.02);
  }

  .full:hover img{
    transform:scale(1.05);
  }

  /* overlay general más limpio */
  .top::before,
  .bottom::before,
  .full::before{
    background:linear-gradient(to bottom, rgba(0,0,0,.02) 18%, rgba(0,0,0,.34) 100%);
  }

  .card-content{
    left:16px;
    right:16px;
    z-index:4;
  }

  /* laterales abajo */
  .left .card-content,
  .right .card-content{
    bottom:14px;
  }

  /* centro arriba */
  .top .card-content,
  .bottom .card-content,
  .full .card-content{
    top:14px;
    bottom:auto;
    left:12px;
    right:12px;
    transform:none;
    width:auto;
    text-align:left;
    background:transparent !important;
    box-shadow:none !important;
    filter:none !important;
  }

  /* 🔥 BOTONES LIMPIOS SIN GLASS OSCURO */
  .card-label,
  .top .card-label,
  .bottom .card-label,
  .full .card-label{
    display:inline-flex;
    align-items:center;
    width:auto !important;
    max-width:max-content;
    gap:6px;
    margin-bottom:6px;
    padding:6px 10px;
    border-radius:999px;
    font-size:.60rem;
    line-height:1;

    background:rgba(20,20,20,.55) !important; /* 🔥 fondo simple */
    border:1px solid rgba(255,255,255,.16) !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    box-shadow:none !important;
    filter:none !important;
    overflow:hidden;
    position:relative;
    z-index:5;
  }

  .card-label i{
    font-size:.60rem;
  }

  .card-title{
    font-size:clamp(1.28rem, 3.2vw, 1.6rem);
    line-height:.94;
  }

  .card-title.small{
    font-size:clamp(.92rem, 2vw, 1.02rem);
    line-height:1.04;
    max-width:100%;
  }

  .card-sub{
    margin-top:5px;
    font-size:.70rem;
    line-height:1.22;
    max-width:100%;
  }

  .left .card-sub,
  .right .card-sub{
    display:none;
  }

  .full .card-title{
    font-size:clamp(.90rem, 2vw, .98rem);
  }

  .top,
  .bottom,
  .full{
    isolation:isolate;
  }
  
 .top,
.bottom,
.full{
  align-self:start;
  height:calc(100% - 16px);
}

.full{
  height:calc(100% - 8px);
}
}


@media (max-width:575px){

  .catalog-section{
    padding:108px 0 34px;
  }

  .catalog-grid{
    grid-template-columns:1fr 1.14fr 1fr;
    grid-template-rows:165px 165px 165px;
    gap:10px;
  }

  .card-content{
    left:10px;
    right:10px;
  }

  .left .card-content,
  .right .card-content{
    bottom:12px;
  }

  .top .card-content,
  .bottom .card-content,
  .full .card-content{
    top:10px;
    bottom:auto;
    left:8px;
    right:8px;
    background:transparent !important;
    box-shadow:none !important;
    filter:none !important;
  }

  .card-label,
  .top .card-label,
  .bottom .card-label,
  .full .card-label{
    gap:5px;
    padding:5px 8px;
    font-size:.52rem;
    margin-bottom:5px;

    background:rgba(20,20,20,.52) !important;
    border:1px solid rgba(255,255,255,.14) !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    box-shadow:none !important;
    filter:none !important;
  }

  .card-label i{
    font-size:.52rem;
  }

  .card-title{
    font-size:clamp(1.02rem, 3vw, 1.18rem);
    line-height:.95;
  }

  .card-title.small{
    font-size:clamp(.78rem, 1.9vw, .88rem);
    line-height:1.02;
  }

  .card-sub{
    font-size:.58rem;
    line-height:1.1;
  }

  .top img,
  .bottom img,
  .full img{
    transform:scale(1.01);
  }

  .top:hover img,
  .bottom:hover img,
  .full:hover img{
    transform:scale(1.04);
  }

  .full img{
    object-position:center 40%;
  }

  .full .card-title{
    font-size:clamp(.76rem, 1.8vw, .84rem);
  }

  .top::before,
  .bottom::before,
  .full::before{
    background:linear-gradient(to bottom, rgba(0,0,0,.02) 16%, rgba(0,0,0,.30) 100%);
  }
}


/* =========================================
   RESPONSIVE DEL MODAL
========================================= */
@media (max-width:900px){
  .product-modal{
    padding:16px;
    align-items:flex-start;
    overflow-y:auto;
  }

  .product-modal-dialog{
    width:min(100%, 760px);
    max-height:none;
    overflow:visible;
    margin:20px auto;
  }

  .product-modal-body{
    grid-template-columns:1fr;
    min-height:auto;
  }

  .product-modal-gallery{
    grid-template-columns:1fr;
    gap:14px;
    padding:20px;
    border-right:none;
    border-bottom:1px solid rgba(220,171,94,.08);
  }

  .product-modal-thumbs{
    flex-direction:row;
    overflow-x:auto;
    overflow-y:hidden;
    padding-right:0;
    padding-bottom:4px;
    gap:10px;
    order:1;
  }

  .product-modal-thumb{
    min-width:78px;
    width:78px;
    aspect-ratio:1/1;
    flex:0 0 auto;
  }

  .product-modal-main{
    min-height:340px;
    max-height:52vh;
    order:2;
  }

  .product-modal-main img{
    object-fit:contain;
  }

  .product-modal-info{
    padding:24px 20px 24px;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
  }

  .product-modal-title{
    font-size:clamp(1.9rem, 6vw, 2.5rem);
    margin-bottom:12px;
  }

  .product-modal-desc{
    font-size:.95rem;
    line-height:1.65;
    margin-bottom:20px;
    max-width:100%;
  }

  .product-specs{
    gap:10px;
    margin-bottom:22px;
  }

  .product-spec{
    padding:12px 14px;
  }

  .product-spec-label,
  .product-spec-value{
    font-size:.9rem;
  }

  .product-modal-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
    margin-top:8px;
  }

  .product-modal-btn{
    width:100%;
    min-height:48px;
  }

  .product-modal-close{
    top:14px;
    right:14px;
    width:42px;
    height:42px;
  }
}

@media (max-width:560px){
  .product-modal{
    padding:10px;
    align-items:flex-start;
    overflow-y:auto;
  }

  .product-modal-dialog{
    width:100%;
    margin:10px auto 18px;
    border-radius:14px;
    overflow:hidden;
  }

  .product-modal-body{
    grid-template-columns:1fr;
    min-height:auto;
  }

  .product-modal-gallery{
    padding:14px;
    gap:12px;
  }

  .product-modal-thumbs{
    gap:8px;
    padding-bottom:2px;
  }

  .product-modal-thumb{
    min-width:64px;
    width:64px;
  }

  .product-modal-main{
    min-height:220px;
    max-height:42vh;
  }

  .product-modal-info{
    padding:18px 14px 16px;
  }

  .product-modal-kicker{
    font-size:.68rem;
    letter-spacing:.22em;
    margin-bottom:8px;
  }

  .product-modal-title{
    font-size:1.6rem;
    line-height:.96;
    margin-bottom:10px;
    padding-right:44px;
  }

  .product-modal-desc{
    font-size:.88rem;
    line-height:1.55;
    margin-bottom:16px;
  }

  .product-specs{
    gap:8px;
    margin-bottom:18px;
  }

  .product-spec{
    padding:10px 12px;
    gap:12px;
  }

  .product-spec-label,
  .product-spec-value{
    font-size:.84rem;
  }

  .product-modal-actions{
    gap:10px;
  }

  .product-modal-btn{
    width:100%;
    min-height:46px;
    padding:0 14px;
    font-size:.76rem;
    letter-spacing:.05em;
  }

  .product-modal-close{
    top:10px;
    right:10px;
    width:40px;
    height:40px;
    font-size:.95rem;
  }
}



/* =========================================
   BOTONES FLOTANTES DE VOLVER
========================================= */

/* =========================================
   RESPONSIVE BOTÓN FLOTANTE
========================================= */
@media (max-width:991px){
  .floating-back-btn{
    left:14px !important;
    bottom:20px !important;
    top:auto !important;

    padding:10px 14px;
    font-size:.84rem;
    gap:8px;
  }
}

@media (max-width:640px){
  .floating-back-btn{
    left:12px !important;
    bottom:18px !important;
    top:auto !important;

    padding:9px 12px;
    font-size:.78rem;
    border-radius:16px;
  }
}

/* móvil/tablet: títulos más grandes (con prioridad real) */
/* =========================================
   TÍTULOS MÓVIL (AJUSTE FINO)
========================================= */
@media (max-width: 980px){

  .catalog-grid .card-title{
    font-size: clamp(1.55rem, 4.2vw, 2rem);
  }

  .catalog-grid .card-title.small{
    font-size: clamp(1.15rem, 3vw, 1.4rem);
    line-height: 1.05;
  }
}

/* móvil pequeño */
@media (max-width: 700px){

  .catalog-grid .card-title{
    font-size: clamp(1.45rem, 4.8vw, 1.85rem);
  }

  .catalog-grid .card-title.small{
    font-size: clamp(1.05rem, 3.2vw, 1.3rem);
  }
}

/* =========================================================
   SUBCATEGORÍAS · BLOQUE ÚNICO FINAL
   Desktop: 3 columnas + kicker + descripción
   Mobile: 2 columnas + sin kicker/desc + imagen grande
========================================================= */

/* =========================
   DESKTOP
========================= */
@media (min-width: 769px){

  #subGrid{
    display:grid !important;
    grid-template-columns:repeat(3, 1fr) !important;
    gap:20px !important;
  }

  #subGrid .sub-card{
    min-height:235px !important;
    padding:34px 30px !important;

    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:24px !important;

    position:relative !important;
    overflow:hidden !important;
  }

  #subGrid .sub-card-image{
    width:118px !important;
    height:118px !important;
    min-width:118px !important;
    flex:0 0 118px !important;

    margin:0 !important;
    padding:14px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }

  #subGrid .sub-card-image img{
    width:auto !important;
    height:auto !important;
    max-width:90px !important;
    max-height:90px !important;
    object-fit:contain !important;
  }

  #subGrid .sub-card-content{
    position:relative !important;
    left:auto !important;
    bottom:auto !important;
    width:auto !important;
    padding:0 !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    text-align:left !important;
    z-index:10 !important;
  }

  #subGrid .sub-card-kicker{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    opacity:1 !important;
    visibility:visible !important;

    color:#111 !important;
    background:#dcab5e !important;
    border:1px solid rgba(0,0,0,.18) !important;

    padding:5px 10px !important;
    border-radius:999px !important;

    font-size:.62rem !important;
    line-height:1 !important;
    font-weight:900 !important;
    letter-spacing:.16em !important;
    text-transform:uppercase !important;

    margin:0 0 9px !important;
  }

  #subGrid .sub-card-title{
    font-size:2rem !important;
    line-height:.95 !important;
    margin:0 0 8px !important;
    color:#050505 !important;
    text-align:left !important;
  }

  #subGrid .sub-card-desc{
    display:block !important;
    opacity:1 !important;
    visibility:visible !important;

    color:rgba(20,20,20,.74) !important;
    font-size:.92rem !important;
    line-height:1.4 !important;

    max-width:260px !important;
    margin:0 0 16px !important;
  }

  #subGrid .sub-card-btn{
    width:auto !important;
    min-width:158px !important;
    height:42px !important;
    min-height:42px !important;
    padding:0 26px !important;
    margin:0 !important;
  }
}


/* =========================
   MOBILE
========================= */
@media (max-width: 768px){

  #subGrid{
    display:grid !important;
    grid-template-columns:repeat(2, 1fr) !important;
    gap:12px !important;
  }

  #subGrid .sub-card{
    height:250px !important;
    min-height:250px !important;
    max-height:250px !important;

    padding:12px 8px 10px !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;

    position:relative !important;
    overflow:hidden !important;

    transform:none !important;
    transition:none !important;
    animation:none !important;
  }

  #subGrid .sub-card-image{
    width:100% !important;
    height:125px !important;
    min-height:125px !important;
    max-height:125px !important;

    margin:0 auto 10px !important;
    padding:8px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    overflow:visible !important;
  }

  #subGrid .sub-card-image img{
    width:auto !important;
    height:auto !important;
    max-width:105px !important;
    max-height:105px !important;
    object-fit:contain !important;
    transform:none !important;
  }

  #subGrid .sub-card-content{
    position:absolute !important;
    left:0 !important;
    bottom:14px !important;
    width:100% !important;
    padding:0 8px !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    text-align:center !important;
    z-index:20 !important;
  }

  #subGrid .sub-card-kicker,
  #subGrid .sub-card-desc,
  #subGrid .sub-card-offer{
    display:none !important;
  }

  #subGrid .sub-card-title{
    font-size:1.7rem !important;
    line-height:.95 !important;
    margin:0 0 14px !important;
    text-align:center !important;
  }

  #subGrid .sub-card-btn{
    width:100% !important;
    height:42px !important;
    min-height:42px !important;
    margin:0 !important;
    padding:0 8px !important;
    font-size:.86rem !important;
  }

  #subGrid .sub-card:hover,
  #subGrid .sub-card:hover *,
  #subGrid .sub-card:active,
  #subGrid .sub-card:active *{
    transform:none !important;
    filter:none !important;
    box-shadow:none !important;
    transition:none !important;
    animation:none !important;
  }
}

/* =====================================================
   SUBCATEGORÍAS · FIX AISLADO FINAL
===================================================== */

/* DESKTOP */
@media screen and (min-width:769px){

  #subGrid{
    display:grid !important;
    grid-template-columns:repeat(3, 1fr) !important;
    gap:20px !important;
  }

  #subGrid .sub-card{
    min-height:235px !important;
    padding:34px 30px !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    gap:24px !important;
  }

  #subGrid .sub-card-image{
    width:118px !important;
    height:118px !important;
    flex:0 0 118px !important;
    margin:0 !important;
    padding:14px !important;
  }

  #subGrid .sub-card-image img{
    max-width:95px !important;
    max-height:95px !important;
    object-fit:contain !important;
  }

  #subGrid .sub-card-content{
    position:relative !important;
    width:auto !important;
    padding:0 !important;
    text-align:left !important;
    align-items:flex-start !important;
  }

  #subGrid .sub-card-kicker,
  #subGrid .sub-card-content > span:first-child{
    display:inline-flex !important;
    opacity:1 !important;
    visibility:visible !important;

    color:#ffffff !important;
    background:#111111 !important;

    padding:6px 11px !important;
    border-radius:999px !important;

    font-size:.62rem !important;
    font-weight:900 !important;
    letter-spacing:.16em !important;
    line-height:1 !important;
    text-transform:uppercase !important;

    margin:0 0 9px !important;
  }

  #subGrid .sub-card-desc{
    display:block !important;
    color:rgba(20,20,20,.74) !important;
    font-size:.92rem !important;
    line-height:1.4 !important;
    margin:0 0 16px !important;
  }
}


/* MOBILE */
@media screen and (max-width:768px){

  #subGrid{
    display:grid !important;
    grid-template-columns:repeat(2, 1fr) !important;
    gap:12px !important;
  }

  #subGrid .sub-card{
    height:250px !important;
    padding:12px 8px 10px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    overflow:hidden !important;
  }

  #subGrid .sub-card-kicker,
  #subGrid .sub-card-desc{
    display:none !important;
  }

  #subGrid .sub-card-image{
    width:100% !important;
    height:125px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }

  #subGrid .sub-card-image img{
    max-width:110px !important;
    max-height:110px !important;
    object-fit:contain !important;
  }

  #subGrid .sub-card-content{
    position:absolute !important;
    left:0 !important;
    bottom:14px !important;
    width:100% !important;
    text-align:center !important;
    padding:0 8px !important;
  }

  #subGrid .sub-card-title{
    font-size:1.7rem !important;
    margin:0 0 14px !important;
  }

  #subGrid .sub-card-btn{
    width:100% !important;
    height:42px !important;
  }
}