/* ========================================================================
   Oromáticas · Bloques — banda de logística
   Paleta de marca: azul noche #243460, dorado #C79E62.
   El texto secundario iba en blanco sobre dorado (2,1:1, ilegible);
   en azul noche sube a 4,8:1 y cumple AA.
   ===================================================================== */

.oro-envio{
  --oro-navy:#243460;
  --oro-navy-2:#1a2749;
  --oro-oro:#c79e62;
  --oro-oro-claro:#d8b57f;
  --oro-crema:#fdfaf4;
  box-sizing:border-box;
  padding:clamp(40px,6vw,80px) clamp(16px,4vw,24px);
}
.oro-envio *,.oro-envio *::before,.oro-envio *::after{box-sizing:border-box;}
.oro-envio [hidden]{display:none !important;}

.oro-envio__banda{
  position:relative;
  max-width:1080px;
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:clamp(20px,3vw,40px);
  padding:clamp(24px,3.4vw,34px) clamp(24px,3.6vw,44px);
  border-radius:28px;
  background:linear-gradient(135deg,var(--oro-oro-claro) 0%,var(--oro-oro) 55%,#bd9155 100%);
  box-shadow:0 22px 48px -18px rgba(36,52,96,.38),0 2px 0 rgba(255,255,255,.35) inset;
  overflow:hidden;
}

/* Hoja de agua: textura de marca, no un borde grueso */
.oro-envio__marca{
  position:absolute;
  right:-38px;
  bottom:-52px;
  width:230px;
  color:var(--oro-navy);
  opacity:.09;
  pointer-events:none;
}
.oro-envio__marca svg{width:100%;height:auto;display:block;}

.oro-envio__icono{
  position:relative;
  flex:none;
  width:66px;
  height:66px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--oro-navy);
  color:var(--oro-crema);
  box-shadow:0 8px 18px -6px rgba(26,39,73,.55);
}
.oro-envio__icono svg{width:32px;height:32px;}

.oro-envio__texto{position:relative;flex:1 1 auto;min-width:0;}

.oro-envio__titulo{
  margin:0;
  font-family:"Playfair Display",Georgia,"Times New Roman",serif;
  font-size:clamp(20px,2.4vw,27px);
  font-weight:800;
  line-height:1.15;
  letter-spacing:.005em;
  text-transform:uppercase;
  color:var(--oro-navy);
}
.oro-envio__titulo em{
  font-family:"Cormorant Garamond","Playfair Display",Georgia,serif;
  font-style:italic;
  font-weight:400;
  text-transform:none;
  letter-spacing:.01em;
}

/* Antes era blanco sobre dorado: 2,1:1, ilegible. En azul noche sube a 4,8:1. */
.oro-envio__linea{
  margin:7px 0 0;
  font-size:clamp(14.5px,1.2vw,16px);
  line-height:1.5;
  color:var(--oro-navy);
  font-weight:500;
}
.oro-envio__linea strong{font-weight:800;}

.oro-envio__proxima{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:11px 0 0;
  padding:6px 14px 6px 11px;
  border-radius:999px;
  background:var(--oro-crema);
  box-shadow:0 2px 8px -2px rgba(36,52,96,.28);
  font-size:13.5px;
  line-height:1.35;
  color:var(--oro-navy);
}
.oro-envio__proxima strong{font-weight:800;}
.oro-envio__punto{
  flex:none;width:7px;height:7px;border-radius:50%;
  background:#2f9e5f;box-shadow:0 0 0 3px rgba(47,158,95,.2);
}

.oro-envio__cta{
  flex:none;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:16px 26px;
  border-radius:999px;
  background:var(--oro-navy);
  color:#fff !important;
  font-family:inherit;
  font-size:15.5px;
  font-weight:700;
  line-height:1;
  text-decoration:none !important;
  box-shadow:0 12px 26px -10px rgba(26,39,73,.7);
  transition:background .22s ease,transform .22s cubic-bezier(.22,1,.36,1),box-shadow .22s ease;
}
.oro-envio__cta:hover,.oro-envio__cta:focus{
  background:var(--oro-navy-2);
  color:#fff !important;
  transform:translateY(-2px);
  box-shadow:0 18px 34px -12px rgba(26,39,73,.8);
}
.oro-envio__cta:focus-visible{outline:3px solid var(--oro-crema);outline-offset:3px;}
.oro-envio__cta svg{width:19px;height:19px;flex:none;}

@media (max-width:860px){
  .oro-envio__banda{
    flex-direction:column;
    align-items:flex-start;
    text-align:left;
    gap:18px;
    border-radius:24px;
  }
  .oro-envio__cta{width:100%;justify-content:center;}
  .oro-envio__marca{width:170px;right:-30px;bottom:-42px;}
}

@media (prefers-reduced-motion:reduce){
  .oro-envio__cta{transition:none;}
  .oro-envio__cta:hover,.oro-envio__cta:focus{transform:none;}
}

/* ========================================================================
   Hero de la portada: fondo por tamaño de pantalla.
   El original pesaba 1.623 KB y se servía igual a un móvil de 375 px.
   El !important es necesario porque la URL base va en un style en línea,
   que gana a cualquier selector.
   ===================================================================== */

@media (max-width: 1280px) {
  .oro-hero {
    background-image: url("/wp-content/uploads/oromaticas-hero/hero-1280.webp") !important;
  }
}

@media (max-width: 800px) {
  .oro-hero {
    background-image: url("/wp-content/uploads/oromaticas-hero/hero-800.webp") !important;
  }
}