/* ---------- SECCION "PEDIDOS PERSONALIZADOS" ----------
   Título + frase + carrusel. El <section class="trust"> original
   (definido en style.css) solo aporta ahora un padding vertical
   distinto, fijado aquí para no editar style.css: separación
   elegante respecto al hero arriba, y un remate corto respecto
   a "Nuestros Modelos" abajo. */
.trust{
  padding:64px 24px 28px;
}

.orders-header{
  text-align:center;
  max-width:640px;
  margin:0 auto 22px;
}

/* Envoltorio solo del ancho del texto, para poder anclar los
   adornos a los bordes reales del título (no del bloque centrado). */
.orders-title-wrap{
  position:relative;
  display:inline-block;
}
.orders-title{
  position:relative;
  z-index:1;
  margin:0 0 8px;
  font-family:'Baloo 2', sans-serif;
  font-weight:800;
  font-size:clamp(2.1rem, 1.4rem + 3vw, 3rem);
  line-height:1.1;
  color:var(--coral);
  background:linear-gradient(90deg, var(--coral) 0%, var(--marigold) 50%, var(--blue-deep) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  filter:drop-shadow(0 5px 0 rgba(255,255,255,0.55)) drop-shadow(0 10px 18px rgba(30,95,217,0.22));
}
.orders-subtitle{
  margin:0;
  font-weight:700;
  font-size:1rem;
  color:var(--ink-soft);
}

/* ---------- Adornos alrededor del título ----------
   Solo CSS/SVG (sin imágenes externas), pequeños, a los lados y con
   una animación muy sutil de flotación/brillo para no distraer. */
.orders-deco{
  position:absolute;
  pointer-events:none;
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
  z-index:0;
}
.orders-deco-star{
  width:20px; height:20px;
  left:-26px; top:-10px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23F4B942' d='M12 2 14.6 9 22 9.3 16.2 14 18.2 21 12 17 5.8 21 7.8 14 2 9.3 9.4 9 12 2Z'/%3E%3C/svg%3E");
  filter:drop-shadow(0 2px 3px rgba(244,185,66,0.35));
  animation:ordersFloat 3.6s ease-in-out infinite;
}
.orders-deco-heart{
  width:16px; height:16px;
  right:-24px; bottom:6px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23E9573F' d='M12 21s-7-4.35-9.6-8.6C.6 9.3 2 5.6 5.5 4.8c2-.45 4 .3 5 2l1.5 2 1.5-2c1-1.7 3-2.45 5-2 3.5.8 4.9 4.5 3.1 7.6C19 16.65 12 21 12 21Z'/%3E%3C/svg%3E");
  filter:drop-shadow(0 2px 3px rgba(233,87,63,0.35));
  animation:ordersFloat 4.2s ease-in-out .3s infinite;
}
.orders-deco-spark{
  width:11px; height:11px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%233F8FCB' d='M12 2c0 4.7-2.1 6.8-6.7 8.8C10 12.8 12 14.9 12 19.6c0-4.7 2.1-6.8 6.7-8.8C14 8.8 12 6.7 12 2Z'/%3E%3C/svg%3E");
  animation:ordersGlow 2.6s ease-in-out infinite;
}
.orders-deco-spark-left{
  left:-4px; bottom:-6px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%234FB98A' d='M12 2c0 4.7-2.1 6.8-6.7 8.8C10 12.8 12 14.9 12 19.6c0-4.7 2.1-6.8 6.7-8.8C14 8.8 12 6.7 12 2Z'/%3E%3C/svg%3E");
}
.orders-deco-spark-right{
  right:-10px; top:-14px;
  animation-delay:.8s;
}
.orders-deco-line{
  width:24px; height:2px;
  border-radius:2px;
  top:50%;
  transform:translateY(-50%);
}
.orders-deco-line-left{
  left:-52px;
  background:linear-gradient(90deg, transparent, var(--blue-deep) 80%);
}
.orders-deco-line-right{
  right:-50px;
  background:linear-gradient(90deg, var(--marigold) 20%, transparent);
}

@media (max-width: 480px){
  .trust{padding:40px 16px 20px;}
  .orders-deco-line{display:none;}
}

@keyframes ordersFloat{
  0%, 100%{ transform:translateY(0); }
  50%{ transform:translateY(-4px); }
}
@keyframes ordersGlow{
  0%, 100%{ opacity:.45; transform:scale(0.85); }
  50%{ opacity:1; transform:scale(1.05); }
}

/* ---------- CARRUSEL ----------
   Viewport con altura fija: el ancho de cada imagen se calcula solo
   (width:auto), así conservan su proporción real sin recortarse ni
   deformarse aunque el alto cambie. */
.orders-carousel{
  max-width:1180px; margin:0 auto;
  height:141px;
  overflow:hidden;
  position:relative;
  cursor:grab;
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%);
  mask-image:linear-gradient(90deg, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%);
}
.orders-carousel.is-dragging{
  cursor:grabbing;
}
.orders-carousel-track{
  display:flex;
  align-items:center;
  gap:16px;
  height:100%;
  width:max-content;
  will-change:transform;
}
.orders-carousel-track img{
  height:100%;
  width:auto;
  display:block;
  flex-shrink:0;
  border-radius:var(--radius-md);
  box-shadow:var(--shadow);
  user-select:none;
  -webkit-user-drag:none;
  pointer-events:none;
}