/* UNI_CATALOGO_ESCOLAR_RESPONSIVE_V3
   Catálogo escolar alineado al nuevo front Unimagen.
   No toca lógica Paso1/Paso2/carrito escolar. */

body.uni-school-catalog-page{
  background:
    radial-gradient(circle at top left, rgba(124,58,237,.10), transparent 26%),
    radial-gradient(circle at top right, rgba(14,165,233,.10), transparent 28%),
    linear-gradient(180deg,#fffaf2,#ffffff 48%,#f8f4ff) !important;
  color:#21163d !important;
  font-family:'Nunito', Arial, Helvetica, sans-serif !important;
  padding-bottom:110px !important;
}

/* Header igual al proyecto nuevo */
.uni-school-header.site-header{
  background:#fff !important;
  border-bottom:4px solid #0ea5e9 !important;
  box-shadow:0 8px 24px rgba(46,30,74,.10) !important;
  position:sticky !important;
  top:0 !important;
  z-index:100 !important;
}

.uni-school-header .navbar{
  min-height:82px !important;
  height:auto !important;
  gap:14px !important;
}

.uni-school-header .brand-avatar{
  background:transparent !important;
  width:54px !important;
  height:54px !important;
  box-shadow:none !important;
  border:0 !important;
  transform:none !important;
}

.uni-school-header .brand-avatar img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  display:block !important;
}

.uni-school-header .brand-text{
  color:#21163d !important;
  font-weight:950 !important;
  letter-spacing:.02em !important;
}

.uni-school-header .brand-subtitle{
  color:#ff6f61 !important;
  font-weight:950 !important;
  letter-spacing:.08em !important;
}

.uni-school-header .nav-links a{
  color:#21163d !important;
  font-weight:950 !important;
  border-radius:999px !important;
  padding:9px 14px !important;
}

.uni-school-header .nav-links a:hover,
.uni-school-header .nav-links a.active{
  background:#7c3aed !important;
  color:#fff !important;
  box-shadow:0 4px 0 #5b21b6 !important;
}

.uni-school-header .btn{
  border-radius:999px !important;
  font-weight:950 !important;
}

.uni-school-header .btn-primary,
.uni-school-header .cart-btn{
  background:linear-gradient(135deg,#7c3aed,#0ea5e9) !important;
  color:#fff !important;
  border:0 !important;
  border-bottom:5px solid #5b21b6 !important;
}

.uni-school-header .btn-secondary{
  background:#fff !important;
  color:#6d28d9 !important;
  border:1px solid #ddd6fe !important;
  border-bottom:4px solid #c4b5fd !important;
}

.cart-count-pill{
  display:inline-grid;
  place-items:center;
  min-width:24px;
  height:24px;
  padding:0 7px;
  border-radius:999px;
  background:#fff;
  color:#047857;
  font-size:.78rem;
  font-weight:950;
  margin-left:4px;
}

/* Barra móvil inferior del proyecto */
.uni-school-mobile-nav{
  display:none;
}

/* Hero escolar: menos circo, más pro */
.uni-school-catalog-page .hero-fun-wrapper{
  padding:22px 0 8px !important;
}

.uni-school-catalog-page .hero-fun-card,
.uni-school-catalog-page .hero{
  max-width:1060px !important;
  margin:0 auto !important;
  background:
    radial-gradient(circle at 12% 12%,rgba(255,255,255,.55),transparent 20%),
    linear-gradient(135deg,#f3e8ff,#e0f7ff 58%,#fff7cc) !important;
  color:#21163d !important;
  border:1px solid rgba(124,58,237,.16) !important;
  border-radius:30px !important;
  box-shadow:0 18px 44px rgba(124,58,237,.12) !important;
  padding:28px 24px !important;
  text-align:center !important;
}

.uni-school-catalog-page .hero-fun-card::before{
  opacity:.16 !important;
}

.uni-school-catalog-page .text-gradient-title,
.uni-school-catalog-page .hero h1{
  color:#21163d !important;
  text-shadow:none !important;
  transform:none !important;
  letter-spacing:-.045em !important;
  line-height:1.04 !important;
  font-size:clamp(2rem,4.2vw,3.2rem) !important;
}

.uni-school-catalog-page .text-gradient-subtitle,
.uni-school-catalog-page .hero p{
  color:#5f5376 !important;
  text-shadow:none !important;
  font-weight:850 !important;
  max-width:820px !important;
}

.uni-school-catalog-page .btn-fun,
.uni-school-catalog-page .btn-primary{
  background:linear-gradient(135deg,#7c3aed,#0ea5e9) !important;
  color:#fff !important;
  border:0 !important;
  border-bottom:5px solid #5b21b6 !important;
  border-radius:999px !important;
  box-shadow:0 14px 28px rgba(124,58,237,.20) !important;
}

.uni-school-catalog-page .btn-fun-secondary,
.uni-school-catalog-page .btn-secondary{
  background:#fff !important;
  color:#6d28d9 !important;
  border:1px solid #ddd6fe !important;
  border-bottom:4px solid #c4b5fd !important;
  border-radius:999px !important;
}

/* Sección */
.uni-school-catalog-page .section{
  padding-top:22px !important;
}

.uni-school-catalog-page .section-head{
  max-width:900px !important;
  margin:0 auto 22px !important;
  text-align:center !important;
}

.uni-school-catalog-page .eyebrow{
  background:#fff !important;
  color:#6d28d9 !important;
  border:1px solid #e9d5ff !important;
  box-shadow:0 8px 20px rgba(124,58,237,.10) !important;
}

.uni-school-catalog-page .section-head h2{
  color:#21163d !important;
  font-weight:950 !important;
  letter-spacing:-.04em !important;
}

.uni-school-catalog-page .section-head p{
  color:#64748b !important;
  font-weight:850 !important;
}

/* Cards escolares */
.uni-school-catalog-page .catalog-grid{
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:14px !important;
}

.uni-school-catalog-page .catalog-card{
  border-radius:24px !important;
  border:1px solid #eadcff !important;
  background:#fff !important;
  box-shadow:0 14px 32px rgba(124,58,237,.10) !important;
  overflow:hidden !important;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease !important;
}

.uni-school-catalog-page .catalog-card:hover{
  transform:translateY(-3px);
  box-shadow:0 20px 42px rgba(124,58,237,.16) !important;
  border-color:#c4b5fd !important;
}

.uni-school-catalog-page .card-top{
  aspect-ratio:1/1 !important;
  padding:14px !important;
  background:linear-gradient(180deg,#fff,#f8fafc) !important;
}

.uni-school-catalog-page .card-top img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
}

.uni-school-catalog-page .select-badge{
  background:rgba(33,22,61,.78) !important;
  color:#fff !important;
  font-weight:950 !important;
}

.uni-school-catalog-page .zoom-btn{
  background:#fff !important;
  color:#7c3aed !important;
  box-shadow:0 8px 18px rgba(124,58,237,.10) !important;
}

.uni-school-catalog-page .card-body{
  padding:12px !important;
}

.uni-school-catalog-page .card-copy{
  color:#64748b !important;
  font-weight:800 !important;
  font-size:.86rem !important;
}

.uni-school-catalog-page .card-check{
  border:1px solid #eadcff !important;
  background:#fff !important;
  color:#21163d !important;
  border-radius:16px !important;
  font-weight:950 !important;
}

.uni-school-catalog-page .card-check:has(input:checked){
  background:#f3e8ff !important;
  border-color:#8b5cf6 !important;
  color:#6d28d9 !important;
  box-shadow:0 0 0 4px rgba(124,58,237,.10) !important;
}

/* Barra selección */
.uni-school-catalog-page .selection-bar{
  width:min(920px,calc(100% - 24px)) !important;
  background:rgba(255,255,255,.96) !important;
  border:1px solid #bae6fd !important;
  border-radius:24px !important;
  box-shadow:0 18px 42px rgba(14,165,233,.18) !important;
  backdrop-filter:blur(12px) !important;
}

/* Paso 2 */
.uni-school-catalog-page .config-list{
  display:grid !important;
  gap:18px !important;
}

.uni-school-catalog-page .config-card{
  border:1px solid #eadcff !important;
  border-radius:28px !important;
  background:#fff !important;
  box-shadow:0 16px 38px rgba(124,58,237,.10) !important;
  overflow:hidden !important;
}

.uni-school-catalog-page .design-preview{
  border-radius:22px !important;
  border:1px solid #e9d5ff !important;
  background:linear-gradient(180deg,#fff,#f8fafc) !important;
}

.uni-school-catalog-page .options-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:12px !important;
  overflow:visible !important;
}

.uni-school-catalog-page .radio-card{
  flex:unset !important;
  min-width:0 !important;
}

.uni-school-catalog-page .option-ui{
  min-height:0 !important;
  height:100% !important;
  border:1px solid #e9d5ff !important;
  border-radius:22px !important;
  background:#fff !important;
  box-shadow:0 10px 24px rgba(124,58,237,.07) !important;
}

.uni-school-catalog-page .radio-card input:checked + .option-ui{
  border-color:#8b5cf6 !important;
  box-shadow:0 0 0 4px rgba(124,58,237,.13),0 18px 34px rgba(124,58,237,.16) !important;
  transform:translateY(-2px) !important;
}

.uni-school-catalog-page .option-thumb{
  height:86px !important;
  border-radius:16px !important;
  border:1px solid #e2e8f0 !important;
  background:#f8fafc !important;
}

.uni-school-catalog-page .option-thumb img{
  object-fit:contain !important;
}

.uni-school-catalog-page .footer-bar{
  background:rgba(255,255,255,.96) !important;
  border:1px solid #bae6fd !important;
  border-radius:24px !important;
  box-shadow:0 16px 42px rgba(15,23,42,.16) !important;
  backdrop-filter:blur(12px) !important;
}

/* Móvil */
@media(max-width:900px){
  .uni-school-header .nav-links,
  .uni-school-header .nav-actions .badge-pill,
  .uni-school-header .nav-actions .btn-secondary{
    display:none !important;
  }

  .uni-school-header .navbar{
    min-height:68px !important;
    display:flex !important;
    justify-content:space-between !important;
    padding:8px 0 !important;
  }

  .uni-school-header .brand{
    gap:8px !important;
  }

  .uni-school-header .brand-avatar{
    width:42px !important;
    height:42px !important;
  }

  .uni-school-header .brand-text{
    font-size:1.02rem !important;
  }

  .uni-school-header .brand-subtitle{
    display:none !important;
  }

  .uni-school-header .cart-btn{
    min-height:42px !important;
    padding:9px 14px !important;
    font-size:.92rem !important;
  }

  .uni-school-mobile-nav{
    position:fixed !important;
    left:10px !important;
    right:10px !important;
    bottom:10px !important;
    z-index:1000 !important;
    display:grid !important;
    grid-template-columns:repeat(4,1fr) !important;
    gap:6px !important;
    background:rgba(255,255,255,.96) !important;
    border:1px solid #d8b4fe !important;
    border-radius:22px !important;
    box-shadow:0 18px 42px rgba(15,23,42,.18) !important;
    backdrop-filter:blur(12px) !important;
    padding:7px !important;
  }

  .uni-school-mobile-nav a{
    display:grid !important;
    place-items:center !important;
    gap:2px !important;
    min-height:48px !important;
    border-radius:16px !important;
    text-decoration:none !important;
    color:#21163d !important;
    font-weight:950 !important;
    font-size:.72rem !important;
  }

  .uni-school-mobile-nav a.active{
    background:#eef2ff !important;
    color:#4f46e5 !important;
    box-shadow:inset 0 0 0 1px #c7d2fe !important;
  }

  .uni-school-catalog-page .hero-fun-card,
  .uni-school-catalog-page .hero{
    width:calc(100% - 20px) !important;
    padding:22px 16px !important;
    border-radius:24px !important;
  }

  .uni-school-catalog-page .text-gradient-title,
  .uni-school-catalog-page .hero h1{
    font-size:1.9rem !important;
  }

  .uni-school-catalog-page .text-gradient-subtitle,
  .uni-school-catalog-page .hero p{
    font-size:.96rem !important;
  }

  .uni-school-catalog-page .catalog-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }

  .uni-school-catalog-page .card-copy{
    display:none !important;
  }

  .uni-school-catalog-page .card-body{
    padding:10px !important;
  }

  .uni-school-catalog-page .card-check{
    padding:10px !important;
    font-size:.86rem !important;
  }

  .uni-school-catalog-page .selection-bar{
    bottom:82px !important;
    padding:12px !important;
    border-radius:20px !important;
    display:grid !important;
    gap:8px !important;
  }

  .uni-school-catalog-page .selection-bar form{
    width:100% !important;
  }

  .uni-school-catalog-page .selection-bar .btn{
    width:100% !important;
  }

  .uni-school-catalog-page .config-card{
    display:block !important;
    padding:12px !important;
    border-radius:22px !important;
  }

  .uni-school-catalog-page .options-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }

  .uni-school-catalog-page .option-thumb{
    height:70px !important;
  }

  .uni-school-catalog-page .option-name{
    font-size:.82rem !important;
  }

  .uni-school-catalog-page .footer-bar{
    bottom:82px !important;
    display:grid !important;
    gap:10px !important;
  }

  .uni-school-catalog-page .footer-bar > div:last-child{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
  }
}

@media(max-width:430px){
  .uni-school-catalog-page .text-gradient-title,
  .uni-school-catalog-page .hero h1{
    font-size:1.65rem !important;
  }

  .uni-school-catalog-page .options-grid{
    grid-template-columns:1fr !important;
  }
}

/* UNI_CATALOGO_ESCOLAR_COMPACT_GRID_V6
   Más diseños por página sin tocar lógica.
   El zoom sigue disponible para ver grande. */

.uni-school-catalog-page .section{
  padding-top:14px !important;
}

.uni-school-catalog-page .hero-fun-wrapper{
  padding:14px 0 6px !important;
}

.uni-school-catalog-page .hero-fun-card,
.uni-school-catalog-page .hero{
  padding:20px 20px !important;
  border-radius:24px !important;
}

.uni-school-catalog-page .text-gradient-title,
.uni-school-catalog-page .hero h1{
  font-size:clamp(1.65rem,3vw,2.35rem) !important;
}

.uni-school-catalog-page .text-gradient-subtitle,
.uni-school-catalog-page .hero p{
  font-size:.96rem !important;
  margin-bottom:10px !important;
}

.uni-school-catalog-page .section-head{
  margin-bottom:14px !important;
}

.uni-school-catalog-page .section-head h2{
  font-size:clamp(1.35rem,2.2vw,1.95rem) !important;
}

.uni-school-catalog-page .section-head p{
  font-size:.92rem !important;
}

.uni-school-catalog-page .catalog-grid{
  grid-template-columns:repeat(8,minmax(0,1fr)) !important;
  gap:10px !important;
}

.uni-school-catalog-page .catalog-card{
  border-radius:18px !important;
  box-shadow:0 8px 20px rgba(124,58,237,.09) !important;
}

.uni-school-catalog-page .catalog-card:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 14px 28px rgba(124,58,237,.14) !important;
}

.uni-school-catalog-page .card-top{
  padding:8px !important;
  aspect-ratio:1/1 !important;
}

.uni-school-catalog-page .card-body{
  padding:8px !important;
}

.uni-school-catalog-page .card-copy{
  display:none !important;
}

.uni-school-catalog-page .card-check{
  padding:8px 8px !important;
  border-radius:13px !important;
  font-size:.78rem !important;
  line-height:1.1 !important;
}

.uni-school-catalog-page .select-badge{
  top:6px !important;
  left:6px !important;
  padding:4px 7px !important;
  font-size:.68rem !important;
}

.uni-school-catalog-page .zoom-btn{
  top:6px !important;
  right:6px !important;
  width:30px !important;
  height:30px !important;
  border-radius:11px !important;
}

.uni-school-catalog-page .pagination,
.uni-school-catalog-page .pager{
  margin-top:14px !important;
  gap:6px !important;
}

.uni-school-catalog-page .pagination a,
.uni-school-catalog-page .pager a{
  min-width:34px !important;
  height:34px !important;
  padding:7px 10px !important;
  border-radius:12px !important;
  font-size:.84rem !important;
}

.uni-school-catalog-page .selection-bar{
  padding:10px 12px !important;
  border-radius:18px !important;
}

.uni-school-catalog-page .selection-bar .btn{
  min-height:42px !important;
  padding:10px 14px !important;
}

/* Notebook */
@media(max-width:1280px){
  .uni-school-catalog-page .catalog-grid{
    grid-template-columns:repeat(7,minmax(0,1fr)) !important;
  }
}

/* Tablet horizontal */
@media(max-width:1100px){
  .uni-school-catalog-page .catalog-grid{
    grid-template-columns:repeat(6,minmax(0,1fr)) !important;
  }
}

/* Tablet / móvil grande */
@media(max-width:820px){
  .uni-school-catalog-page .catalog-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:8px !important;
  }

  .uni-school-catalog-page .hero-fun-card,
  .uni-school-catalog-page .hero{
    padding:16px 14px !important;
  }

  .uni-school-catalog-page .card-top{
    padding:6px !important;
  }

  .uni-school-catalog-page .card-body{
    padding:7px !important;
  }

  .uni-school-catalog-page .card-check{
    font-size:.72rem !important;
    padding:7px !important;
  }

  .uni-school-catalog-page .selection-bar{
    bottom:82px !important;
  }
}

/* Celular */
@media(max-width:560px){
  .uni-school-catalog-page .catalog-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:7px !important;
  }

  .uni-school-catalog-page .section{
    padding-left:4px !important;
    padding-right:4px !important;
  }

  .uni-school-catalog-page .text-gradient-title,
  .uni-school-catalog-page .hero h1{
    font-size:1.45rem !important;
  }

  .uni-school-catalog-page .text-gradient-subtitle,
  .uni-school-catalog-page .hero p{
    font-size:.84rem !important;
  }

  .uni-school-catalog-page .card-check{
    font-size:.68rem !important;
  }

  .uni-school-catalog-page .zoom-btn{
    width:28px !important;
    height:28px !important;
  }
}

/* Celular muy chico */
@media(max-width:370px){
  .uni-school-catalog-page .catalog-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

/* UNI_CATALOGO_ESCOLAR_PASO2_COMPACT_V7
   Achica imagen diseño escolar en Fase 2.
   No toca lógica ni formulario. */

.uni-school-catalog-page .config-card{
  display:grid !important;
  grid-template-columns:150px 1fr !important;
  gap:16px !important;
  align-items:start !important;
  padding:14px !important;
}

.uni-school-catalog-page .design-preview{
  width:150px !important;
  max-width:150px !important;
  min-width:150px !important;
  height:auto !important;
  aspect-ratio:1/1 !important;
  padding:8px !important;
  border-radius:18px !important;
  position:sticky !important;
  top:96px !important;
}

.uni-school-catalog-page .design-preview img{
  width:100% !important;
  height:100% !important;
  max-height:130px !important;
  object-fit:contain !important;
}

.uni-school-catalog-page .design-label{
  font-size:.74rem !important;
  padding:5px 8px !important;
  bottom:7px !important;
  left:7px !important;
  right:auto !important;
}

.uni-school-catalog-page .line-top{
  display:grid !important;
  grid-template-columns:1fr 150px !important;
  gap:14px !important;
  align-items:start !important;
}

.uni-school-catalog-page .row-title{
  font-size:1.15rem !important;
  margin-bottom:4px !important;
}

.uni-school-catalog-page .row-copy{
  font-size:.88rem !important;
  margin:0 !important;
}

.uni-school-catalog-page .qty-wrap{
  padding:10px !important;
  border-radius:16px !important;
}

.uni-school-catalog-page .qty-wrap label{
  font-size:.78rem !important;
}

.uni-school-catalog-page .qty-wrap .input{
  height:40px !important;
  border-radius:13px !important;
}

.uni-school-catalog-page .options-head{
  margin-top:12px !important;
  margin-bottom:8px !important;
}

.uni-school-catalog-page .options-head h3{
  font-size:1rem !important;
  margin-bottom:2px !important;
}

.uni-school-catalog-page .options-head p{
  font-size:.84rem !important;
}

.uni-school-catalog-page .options-grid{
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:9px !important;
}

.uni-school-catalog-page .option-ui{
  border-radius:18px !important;
  padding:8px !important;
}

.uni-school-catalog-page .option-thumb{
  height:62px !important;
  border-radius:14px !important;
}

.uni-school-catalog-page .option-name{
  font-size:.78rem !important;
  line-height:1.08 !important;
  min-height:32px !important;
}

.uni-school-catalog-page .option-meta{
  gap:4px !important;
}

.uni-school-catalog-page .pill{
  font-size:.66rem !important;
  padding:4px 6px !important;
}

.uni-school-catalog-page .product-preview{
  margin-top:10px !important;
  padding:8px 10px !important;
  border-radius:16px !important;
}

.uni-school-catalog-page .product-preview .thumb{
  width:54px !important;
  height:54px !important;
  min-width:54px !important;
}

.uni-school-catalog-page .product-preview .thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
}

.uni-school-catalog-page .product-preview .meta strong{
  font-size:.88rem !important;
}

.uni-school-catalog-page .product-preview .meta span{
  font-size:.78rem !important;
}

.uni-school-catalog-page .footer-bar{
  padding:12px 14px !important;
  border-radius:18px !important;
}

.uni-school-catalog-page .footer-bar .btn{
  min-height:42px !important;
  padding:10px 14px !important;
}

/* Notebook */
@media(max-width:1280px){
  .uni-school-catalog-page .options-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  }
}

/* Tablet */
@media(max-width:980px){
  .uni-school-catalog-page .config-card{
    grid-template-columns:120px 1fr !important;
    gap:12px !important;
    padding:12px !important;
  }

  .uni-school-catalog-page .design-preview{
    width:120px !important;
    max-width:120px !important;
    min-width:120px !important;
    top:84px !important;
  }

  .uni-school-catalog-page .design-preview img{
    max-height:104px !important;
  }

  .uni-school-catalog-page .line-top{
    grid-template-columns:1fr !important;
    gap:8px !important;
  }

  .uni-school-catalog-page .qty-wrap{
    width:100% !important;
    max-width:220px !important;
  }

  .uni-school-catalog-page .options-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

/* Móvil */
@media(max-width:680px){
  .uni-school-catalog-page .config-card{
    grid-template-columns:92px 1fr !important;
    gap:10px !important;
    padding:10px !important;
    border-radius:18px !important;
  }

  .uni-school-catalog-page .design-preview{
    width:92px !important;
    max-width:92px !important;
    min-width:92px !important;
    position:relative !important;
    top:auto !important;
    padding:5px !important;
    border-radius:15px !important;
  }

  .uni-school-catalog-page .design-preview img{
    max-height:80px !important;
  }

  .uni-school-catalog-page .design-label{
    font-size:.62rem !important;
    padding:3px 6px !important;
  }

  .uni-school-catalog-page .row-title{
    font-size:.98rem !important;
  }

  .uni-school-catalog-page .row-copy{
    display:none !important;
  }

  .uni-school-catalog-page .qty-wrap{
    max-width:100% !important;
    padding:8px !important;
  }

  .uni-school-catalog-page .options-head{
    grid-column:1 / -1 !important;
  }

  .uni-school-catalog-page .options-grid{
    grid-column:1 / -1 !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
  }

  .uni-school-catalog-page .option-thumb{
    height:56px !important;
  }

  .uni-school-catalog-page .option-name{
    font-size:.72rem !important;
    min-height:28px !important;
  }

  .uni-school-catalog-page .product-preview{
    grid-column:1 / -1 !important;
  }

  .uni-school-catalog-page .footer-bar{
    bottom:82px !important;
  }
}

/* Móvil muy chico */
@media(max-width:390px){
  .uni-school-catalog-page .config-card{
    grid-template-columns:78px 1fr !important;
  }

  .uni-school-catalog-page .design-preview{
    width:78px !important;
    max-width:78px !important;
    min-width:78px !important;
  }

  .uni-school-catalog-page .design-preview img{
    max-height:68px !important;
  }

  .uni-school-catalog-page .options-grid{
    grid-template-columns:1fr !important;
  }
}

/* UNI_CATALOGO_ESCOLAR_ARMONIOSO_V8
   Ajuste fino:
   - Fase 2 imagen diseño más armónica.
   - Fase 1 continuar flotante tipo Fase 2.
   No toca lógica. */

/* FASE 1: barra flotante de selección más pro */
.uni-school-catalog-page .selection-bar{
  position:sticky !important;
  bottom:82px !important;
  z-index:40 !important;
  width:min(760px, calc(100% - 24px)) !important;
  margin:18px auto 10px !important;
  padding:12px 14px !important;
  border-radius:22px !important;
  background:rgba(255,255,255,.96) !important;
  border:1px solid #bae6fd !important;
  box-shadow:0 16px 42px rgba(15,23,42,.16) !important;
  backdrop-filter:blur(12px) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
}

.uni-school-catalog-page .selection-bar form{
  display:flex !important;
  gap:10px !important;
  align-items:center !important;
  margin:0 !important;
}

.uni-school-catalog-page .selection-bar .btn{
  min-height:44px !important;
  padding:10px 18px !important;
  border-radius:999px !important;
  font-size:.94rem !important;
  white-space:nowrap !important;
}

/* FASE 2: imagen del diseño escolar más armónica */
.uni-school-catalog-page .config-card{
  grid-template-columns:132px 1fr !important;
  gap:16px !important;
  padding:14px !important;
  align-items:start !important;
}

.uni-school-catalog-page .design-preview{
  width:132px !important;
  max-width:132px !important;
  min-width:132px !important;
  aspect-ratio:1/1 !important;
  padding:8px !important;
  border-radius:20px !important;
  background:linear-gradient(180deg,#ffffff,#f8fafc) !important;
  border:1px solid #e9d5ff !important;
  box-shadow:0 10px 24px rgba(124,58,237,.08) !important;
}

.uni-school-catalog-page .design-preview img{
  width:100% !important;
  height:100% !important;
  max-height:116px !important;
  object-fit:contain !important;
}

.uni-school-catalog-page .design-label{
  font-size:.72rem !important;
  padding:5px 8px !important;
  border-radius:999px !important;
}

/* La selección de timbre 911 sigue compacta pero no apretada */
.uni-school-catalog-page .options-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:10px !important;
}

.uni-school-catalog-page .option-thumb{
  height:70px !important;
}

.uni-school-catalog-page .option-name{
  font-size:.8rem !important;
}

/* Tablet */
@media(max-width:980px){
  .uni-school-catalog-page .config-card{
    grid-template-columns:122px 1fr !important;
  }

  .uni-school-catalog-page .design-preview{
    width:122px !important;
    max-width:122px !important;
    min-width:122px !important;
  }

  .uni-school-catalog-page .design-preview img{
    max-height:106px !important;
  }

  .uni-school-catalog-page .options-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

/* Móvil */
@media(max-width:680px){
  .uni-school-catalog-page .selection-bar{
    position:fixed !important;
    left:10px !important;
    right:10px !important;
    bottom:82px !important;
    width:auto !important;
    margin:0 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
    padding:12px !important;
  }

  .uni-school-catalog-page .selection-bar form{
    display:grid !important;
    grid-template-columns:1fr !important;
    width:100% !important;
    gap:8px !important;
  }

  .uni-school-catalog-page .selection-bar .btn{
    width:100% !important;
  }

  .uni-school-catalog-page .config-card{
    grid-template-columns:112px 1fr !important;
    gap:10px !important;
    padding:10px !important;
  }

  .uni-school-catalog-page .design-preview{
    width:112px !important;
    max-width:112px !important;
    min-width:112px !important;
    padding:7px !important;
    border-radius:17px !important;
  }

  .uni-school-catalog-page .design-preview img{
    max-height:96px !important;
  }

  .uni-school-catalog-page .options-grid{
    grid-column:1 / -1 !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

/* Celular pequeño */
@media(max-width:390px){
  .uni-school-catalog-page .config-card{
    grid-template-columns:96px 1fr !important;
  }

  .uni-school-catalog-page .design-preview{
    width:96px !important;
    max-width:96px !important;
    min-width:96px !important;
  }

  .uni-school-catalog-page .design-preview img{
    max-height:84px !important;
  }
}

/* UNI_CATALOGO_ESCOLAR_MOBILE_FINAL_V9
   Mejora móvil Fase 1 y Fase 2.
   No toca lógica ni formularios. */

/* =========================================================
   BASE CATÁLOGO ESCOLAR
========================================================= */

body.uni-school-catalog-page{
  overflow-x:hidden !important;
}

.uni-school-catalog-page .container{
  max-width:1180px !important;
}

/* Hero más compacto */
.uni-school-catalog-page .hero-fun-wrapper{
  padding-top:14px !important;
}

.uni-school-catalog-page .hero-fun-card,
.uni-school-catalog-page .hero{
  max-width:1040px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding:22px 20px !important;
  border-radius:26px !important;
}

.uni-school-catalog-page .text-gradient-title,
.uni-school-catalog-page .hero h1{
  font-size:clamp(1.7rem,3.2vw,2.55rem) !important;
  line-height:1.05 !important;
}

.uni-school-catalog-page .text-gradient-subtitle,
.uni-school-catalog-page .hero p{
  font-size:.98rem !important;
  line-height:1.45 !important;
}

/* =========================================================
   FASE 1: GRILLA DISEÑOS ESCOLARES
========================================================= */

.uni-school-catalog-page .catalog-grid{
  grid-template-columns:repeat(6,minmax(0,1fr)) !important;
  gap:12px !important;
  padding-bottom:120px !important;
}

.uni-school-catalog-page .catalog-card{
  border-radius:20px !important;
}

.uni-school-catalog-page .card-top{
  padding:9px !important;
  aspect-ratio:1 / 1 !important;
}

.uni-school-catalog-page .card-top img{
  object-fit:contain !important;
}

.uni-school-catalog-page .card-body{
  padding:9px !important;
}

.uni-school-catalog-page .card-check{
  font-size:.8rem !important;
  line-height:1.15 !important;
  padding:8px !important;
}

/* Barra continuar: flotante, centrada y sin correrse */
.uni-school-catalog-page .selection-bar{
  position:sticky !important;
  bottom:14px !important;
  z-index:60 !important;
  width:min(820px, calc(100% - 24px)) !important;
  margin:18px auto 12px !important;
  padding:12px 14px !important;
  border-radius:24px !important;
  background:rgba(255,255,255,.97) !important;
  border:1px solid #bae6fd !important;
  box-shadow:0 18px 44px rgba(15,23,42,.16) !important;
  backdrop-filter:blur(12px) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
}

.uni-school-catalog-page .selection-bar form{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  margin:0 !important;
}

.uni-school-catalog-page .selection-bar .btn{
  min-height:44px !important;
  padding:10px 18px !important;
  border-radius:999px !important;
  font-size:.94rem !important;
  white-space:nowrap !important;
}

/* =========================================================
   FASE 2: CONFIGURAR TIMBRE 911 POR DISEÑO
========================================================= */

.uni-school-catalog-page .config-list{
  gap:16px !important;
  padding-bottom:130px !important;
}

.uni-school-catalog-page .config-card{
  display:grid !important;
  grid-template-columns:150px 1fr !important;
  gap:16px !important;
  padding:14px !important;
  border-radius:24px !important;
  align-items:start !important;
}

.uni-school-catalog-page .design-preview{
  width:150px !important;
  min-width:150px !important;
  max-width:150px !important;
  aspect-ratio:1 / 1 !important;
  padding:8px !important;
  border-radius:20px !important;
  background:linear-gradient(180deg,#fff,#f8fafc) !important;
  box-shadow:0 12px 26px rgba(124,58,237,.10) !important;
}

.uni-school-catalog-page .design-preview img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  max-height:132px !important;
}

.uni-school-catalog-page .line-top{
  display:grid !important;
  grid-template-columns:1fr 145px !important;
  gap:12px !important;
  align-items:start !important;
}

.uni-school-catalog-page .row-title{
  font-size:1.12rem !important;
  line-height:1.15 !important;
}

.uni-school-catalog-page .row-copy{
  font-size:.86rem !important;
  line-height:1.3 !important;
}

.uni-school-catalog-page .qty-wrap{
  padding:9px !important;
  border-radius:16px !important;
}

.uni-school-catalog-page .options-head{
  margin:10px 0 8px !important;
}

.uni-school-catalog-page .options-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:10px !important;
}

.uni-school-catalog-page .option-ui{
  padding:8px !important;
  border-radius:18px !important;
}

.uni-school-catalog-page .option-thumb{
  height:70px !important;
  border-radius:14px !important;
}

.uni-school-catalog-page .option-name{
  font-size:.8rem !important;
  line-height:1.1 !important;
  min-height:30px !important;
}

.uni-school-catalog-page .pill{
  font-size:.68rem !important;
  padding:4px 7px !important;
}

.uni-school-catalog-page .footer-bar{
  position:sticky !important;
  bottom:14px !important;
  z-index:70 !important;
  width:min(880px, calc(100% - 24px)) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  border-radius:22px !important;
  padding:12px 14px !important;
}

/* =========================================================
   TABLET
========================================================= */

@media(max-width:1024px){
  .uni-school-catalog-page .catalog-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  }

  .uni-school-catalog-page .config-card{
    grid-template-columns:138px 1fr !important;
  }

  .uni-school-catalog-page .design-preview{
    width:138px !important;
    min-width:138px !important;
    max-width:138px !important;
  }

  .uni-school-catalog-page .options-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

/* =========================================================
   MÓVIL
========================================================= */

@media(max-width:760px){
  body.uni-school-catalog-page{
    padding-bottom:170px !important;
  }

  .uni-school-catalog-page .container{
    width:100% !important;
    max-width:100% !important;
    padding-left:10px !important;
    padding-right:10px !important;
  }

  /* Hero móvil */
  .uni-school-catalog-page .hero-fun-wrapper{
    padding-top:10px !important;
  }

  .uni-school-catalog-page .hero-fun-card,
  .uni-school-catalog-page .hero{
    width:calc(100% - 14px) !important;
    padding:16px 14px !important;
    border-radius:22px !important;
  }

  .uni-school-catalog-page .text-gradient-title,
  .uni-school-catalog-page .hero h1{
    font-size:1.65rem !important;
  }

  .uni-school-catalog-page .text-gradient-subtitle,
  .uni-school-catalog-page .hero p{
    font-size:.88rem !important;
  }

  /* Fase 1 móvil: 2 columnas claras */
  .uni-school-catalog-page .catalog-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
    padding-bottom:190px !important;
  }

  .uni-school-catalog-page .catalog-card{
    border-radius:18px !important;
  }

  .uni-school-catalog-page .card-top{
    padding:8px !important;
  }

  .uni-school-catalog-page .card-check{
    font-size:.76rem !important;
    padding:8px !important;
  }

  .uni-school-catalog-page .select-badge{
    font-size:.66rem !important;
    padding:4px 7px !important;
  }

  .uni-school-catalog-page .zoom-btn{
    width:30px !important;
    height:30px !important;
  }

  /* Barra Fase 1 flotante bien centrada */
  .uni-school-catalog-page .selection-bar{
    position:fixed !important;
    left:10px !important;
    right:10px !important;
    bottom:82px !important;
    width:auto !important;
    margin:0 !important;
    padding:11px !important;
    border-radius:22px !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
  }

  .uni-school-catalog-page .selection-bar form{
    display:grid !important;
    grid-template-columns:1fr !important;
    width:100% !important;
    gap:8px !important;
  }

  .uni-school-catalog-page .selection-bar .btn{
    width:100% !important;
    min-height:44px !important;
    font-size:.9rem !important;
  }

  /* Fase 2 móvil: tarjeta en una columna, imagen arriba */
  .uni-school-catalog-page .config-list{
    padding-bottom:190px !important;
  }

  .uni-school-catalog-page .config-card{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    padding:11px !important;
    border-radius:20px !important;
  }

  .uni-school-catalog-page .design-preview{
    width:150px !important;
    min-width:150px !important;
    max-width:150px !important;
    margin:0 auto !important;
    padding:8px !important;
    border-radius:18px !important;
  }

  .uni-school-catalog-page .design-preview img{
    max-height:130px !important;
  }

  .uni-school-catalog-page .line-top{
    grid-template-columns:1fr !important;
    gap:8px !important;
    text-align:center !important;
  }

  .uni-school-catalog-page .row-title{
    font-size:1.04rem !important;
  }

  .uni-school-catalog-page .row-copy{
    font-size:.8rem !important;
  }

  .uni-school-catalog-page .qty-wrap{
    width:100% !important;
    max-width:260px !important;
    margin:0 auto !important;
  }

  .uni-school-catalog-page .options-head{
    text-align:center !important;
  }

  .uni-school-catalog-page .options-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:9px !important;
  }

  .uni-school-catalog-page .option-thumb{
    height:66px !important;
  }

  .uni-school-catalog-page .option-name{
    font-size:.74rem !important;
  }

  .uni-school-catalog-page .product-preview{
    padding:9px !important;
    border-radius:16px !important;
  }

  .uni-school-catalog-page .footer-bar{
    position:fixed !important;
    left:10px !important;
    right:10px !important;
    bottom:82px !important;
    width:auto !important;
    margin:0 !important;
    padding:11px !important;
    border-radius:22px !important;
    display:grid !important;
    gap:8px !important;
  }

  .uni-school-catalog-page .footer-bar > div:last-child{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
  }

  .uni-school-catalog-page .footer-bar .btn{
    width:100% !important;
    min-height:44px !important;
    font-size:.9rem !important;
  }
}

/* Celular pequeño */
@media(max-width:390px){
  .uni-school-catalog-page .catalog-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
  }

  .uni-school-catalog-page .design-preview{
    width:136px !important;
    min-width:136px !important;
    max-width:136px !important;
  }

  .uni-school-catalog-page .options-grid{
    grid-template-columns:1fr !important;
  }
}

/* UNI_CATALOGO_ESCOLAR_CENTER_FLOATS_V10
   Corrige flotantes corridos en móvil.
   Centrado real respecto al viewport. */

@media(max-width:760px){
  body.uni-school-catalog-page{
    overflow-x:hidden !important;
  }

  .uni-school-catalog-page .selection-bar,
  .uni-school-catalog-page .footer-bar{
    position:fixed !important;
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%) !important;
    width:calc(100vw - 22px) !important;
    max-width:520px !important;
    min-width:0 !important;
    margin:0 !important;
    bottom:82px !important;
    box-sizing:border-box !important;
    z-index:900 !important;
  }

  .uni-school-catalog-page .selection-bar{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
    padding:11px !important;
  }

  .uni-school-catalog-page .selection-bar form{
    width:100% !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
    margin:0 !important;
  }

  .uni-school-catalog-page .selection-bar .btn,
  .uni-school-catalog-page .footer-bar .btn{
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }

  .uni-school-catalog-page .footer-bar{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
    padding:11px !important;
  }

  .uni-school-catalog-page .footer-bar > div{
    width:100% !important;
    max-width:100% !important;
  }

  .uni-school-catalog-page .footer-bar > div:last-child{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
  }
}

/* Celular chico */
@media(max-width:390px){
  .uni-school-catalog-page .selection-bar,
  .uni-school-catalog-page .footer-bar{
    width:calc(100vw - 18px) !important;
    max-width:calc(100vw - 18px) !important;
    bottom:80px !important;
  }
}

/* UNI_CATALOGO_ESCOLAR_FLOAT_PC_FIX_V11
   PC centrado normal.
   Móvil conserva centrado fixed de V10. */

/* PC / notebook / tablet grande */
@media(min-width:761px){
  .uni-school-catalog-page .selection-bar,
  .uni-school-catalog-page .footer-bar{
    position:sticky !important;
    left:auto !important;
    right:auto !important;
    transform:none !important;
    bottom:14px !important;
    width:min(880px, calc(100% - 48px)) !important;
    max-width:880px !important;
    margin:18px auto 14px auto !important;
    box-sizing:border-box !important;
    z-index:60 !important;
  }

  .uni-school-catalog-page .selection-bar{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
  }

  .uni-school-catalog-page .selection-bar form{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:10px !important;
    margin:0 !important;
    width:auto !important;
  }

  .uni-school-catalog-page .footer-bar{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
  }

  .uni-school-catalog-page .footer-bar > div:last-child{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:10px !important;
  }

  .uni-school-catalog-page .selection-bar .btn,
  .uni-school-catalog-page .footer-bar .btn{
    width:auto !important;
    max-width:none !important;
  }
}

/* Móvil se mantiene como estaba */
@media(max-width:760px){
  .uni-school-catalog-page .selection-bar,
  .uni-school-catalog-page .footer-bar{
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%) !important;
    width:calc(100vw - 22px) !important;
    max-width:520px !important;
    margin:0 !important;
  }
}