/*@font-face {
    font-family: 'Cinzel';
    src: url('../font/Cinzel/static/Cinzel-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}*/

@font-face {
  font-family: 'Cinzel';
  src: url('../font/Cinzel/static/Cinzel-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/*@font-face {
    font-family: 'Cinzel';
    src: url('../font/Cinzel/static/Cinzel-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}*/

.section-bg-1 {
  --bg: url('../img/background/bg_1.png');
}

.section-bg-2 {
  --bg: url('../img/background/bg_2.png');
}

.section-bg-3 {
  --bg: url('../img/background/bg_3.png');
}

.section-bg-4 {
  --bg: url('../img/background/bg2.png');
}

[class*="section-bg"] {
  position: relative;
  overflow: hidden;
}

/* ^, * selectores por atibuto (class) Selecciona elementos cuyo atributo class empiece exactamente con section-bg*/

[class*="section-bg"]::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: var(--bg);
  background-size: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  transform: translate3d(0, var(--py, 0px), 0);
  will-change: transform;
  transition: transform 0.08s cubic-bezier(.22, .61, .36, 1);
  z-index: 0;
}

[class*="section-bg"]::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, .22);
  pointer-events: none;
  z-index: 1;
}

[class*="section-bg"]>.container {
  position: relative;
  z-index: 2;
}

#section-1::after {
  filter: blur(1.5px) brightness(.96) saturate(.92);
  transform: scale(1.03);
}

.hero-brand {
  margin-bottom: 1.8rem;
  padding-left: .15rem;
  /* micro anclaje óptico */
}


.brand-name {
  font-family: "Cinzel", serif;
  font-size: .75rem;
  letter-spacing: .42em;
  /* un poco más */
  color: rgba(0, 0, 0, .65);
  /* sube contraste */
}


.brand-author {
  margin-top: .4rem;
  font-family: "Cinzel", serif;
  font-size: .65rem;
  letter-spacing: .28em;
  color: rgba(0, 0, 0, .5);
}

#hero-title {
  color: #c8b25f;
  font-weight: 500;
}

#hero-subtitle::before,
#hero-subtitle::after {
  content: "—";
  margin: 0 .6rem;
  opacity: .7;
}

.cta-caption {
  display: block;
  margin-bottom: .8rem;
  font-size: .6rem;
  letter-spacing: .32em;
  color: rgba(0, 0, 0, .45);
}




/* =========================
   FIX HERO MOBILE SPACING
========================= */

@media (max-width: 768px) {

  #section-1 {
    padding-top: clamp(5rem, 10vh, 7rem);
    padding-bottom: 4rem;
  }

  #section-1 .container {
    padding-top: 0;
  }

  #hero-title {
    margin-top: 0;
  }

  .hero-boot {
    transform: none;
    height: 86%;
    max-width: 100%;
    object-fit: contain;

    /* filtros más suaves */
    filter:
      drop-shadow(0 24px 42px rgba(0, 0, 0, .28)) contrast(1.02) saturate(1.02);
  }


}


/* =========================
   HERO PRODUCT – SECTION 1
========================= */

.hero-media {
  position: relative;
  height: clamp(360px, 52vh, 520px);
  border-radius: 22px;
  overflow: visible;
  /* IMPORTANTE */

  /* Fondo boutique con caída de luz */
  background: radial-gradient(900px 420px at 72% 38%,
      rgba(255, 255, 255, .85) 0%,
      rgba(245, 240, 232, .55) 45%,
      rgba(230, 224, 212, .30) 70%,
      rgba(225, 218, 205, .15) 100%);

  box-shadow:
    0 40px 120px rgba(0, 0, 0, .12),
    0 10px 30px rgba(0, 0, 0, .08);
}

/* Capa atmosférica (muy sutil) */
.hero-media::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,
      rgba(255, 255, 255, .25) 0%,
      rgba(255, 255, 255, .10) 55%,
      rgba(255, 255, 255, 0) 100%);
  pointer-events: none;
  z-index: 1;
}

/* Sombra de piso (clave para “peso”) */



.hero-boot {
  position: relative;
  height: 92%;
  width: auto;

  transform: translateX(6%) scale(1.18) rotate(-0.3deg);
  z-index: 3;

  /* Realismo */
  filter:
    drop-shadow(0 38px 64px rgba(0, 0, 0, .30)) drop-shadow(0 12px 22px rgba(0, 0, 0, .18)) contrast(1.06) saturate(1.04);
}


.hero-copy>div {
  background: rgba(255, 255, 255, .82);
  backdrop-filter: blur(20px);
  box-shadow: 0 20px 50px rgba(0, 0, 0, .12);
}

#hero-title {
  font-size: clamp(2rem, 3.2vw, 3.1rem);
  line-height: 1.1;
  letter-spacing: -0.015em;
}

#section-1 .row {
  align-items: center;
}

@media (min-width: 992px) {
  .hero-copy {
    padding-right: 4vw;
  }
}


/* =========================
   HERO COPY – JRZ WESTERN
========================= */

#section-1 {
  position: relative;
}

/* Contenedor izquierdo */
.hero-copy,
#section-1 .col-lg-6>div {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* Label superior */
#section-1 .text-uppercase {
  font-family: "Cinzel", serif;
  letter-spacing: .22em;
  font-size: .72rem;
  color: rgba(0, 0, 0, .45);
  margin-bottom: 1.1rem;
}

/* TITULAR */
#hero-title {
  font-family: "Cinzel", serif;
  font-weight: 500;
  font-size: clamp(2.6rem, 4.2vw, 3.8rem);
  line-height: 1.05;
  letter-spacing: -0.015em;
  /*color: #d0b867;*/
  color: #7f3a1f;
  text-shadow: 0 1px 0 rgb(19 19 19 / 35%);
  max-width: 12ch;
  margin-bottom: 1.2rem;
}

/* SUBTÍTULO */
#hero-subtitle {
  font-family: "Quicksand", system-ui, sans-serif;
  font-size: clamp(1rem, 1.15vw, 1.1rem);
  line-height: 1.7;
  color: rgba(0, 0, 0, .55);
  max-width: 38ch;
  margin-bottom: 2.4rem;
}

/* CTA – lujo silencioso */
#section-1 .btn {
  font-family: "Cinzel", serif;
  font-size: .75rem;
  letter-spacing: .28em;
  padding: .85rem 2.6rem;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, .45);
  background: transparent;
  color: #1a1a1a;
  transition: all .35s ease;
}

/* Hover elegante */
#section-1 .btn:hover {
  background: #1a1a1a;
  color: #fff;
  transform: translateY(-1px);
}

/* Ajuste de alineación vertical */
#section-1 .row {
  align-items: center;
}

/* En desktop: texto más “anclado” */
@media (min-width: 992px) {
  #section-1 .col-lg-6:first-child {
    padding-left: 2vw;
  }
}

/* =========================
   WESTERN EDITORIAL HERO
========================= */

#hero-title {
  font-family: "Cinzel", serif;
  font-weight: 500;
  line-height: 1.04;
  letter-spacing: -0.02em;
  max-width: 10ch;
  margin-bottom: 1.2rem;
}

/* Subtítulo editorial */
#hero-subtitle {
  font-family: "Quicksand", system-ui, sans-serif;
  font-size: .95rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(0, 0, 0, .45);

  margin-bottom: 3rem;
}

/* CTA silencioso */
#section-1 .btn {
  font-family: "Cinzel", serif;
  font-size: .7rem;
  letter-spacing: .35em;
  text-transform: uppercase;

  padding: .8rem 2.8rem;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, .35);
  background: transparent;

  transition: all .35s ease;
}


#section-1 .btn:hover {
  background: #1a1a1a;
  color: #fff;
}


@media (max-width: 768px) {
  #hero-title {
    font-size: 2.4rem;
    max-width: 100%;
  }

  #hero-subtitle {
    font-size: 1rem;
    max-width: 100%;
  }
}

.hero-boot {
  image-rendering: auto;
  backface-visibility: hidden;
  transform-style: preserve-3d;
}

@media (max-width: 768px) {

  #hero-title {
    font-size: clamp(2.1rem, 8vw, 2.6rem);
    line-height: 1.08;
    max-width: 14ch;
  }

  #hero-subtitle {
    font-size: .85rem;
    letter-spacing: .12em;
  }

}



/* =========================
   EDITORIAL REVEAL
========================= */

.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity 1.2s ease,
    transform 1.2s cubic-bezier(.22, .61, .36, 1);
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}







/* ===== FORCE HERO DUO (SIN FALLAS POR SELECTORES) ===== */
/* ===== HERO DUO BOOTS - JRZ WESTERN ===== */



/* Sombra de piso */

@media (max-width: 768px) {
  [class*="section-bg"]::after {
    background-size: cover;
    background-position: center center;
  }

}











/*para el idioma*/
.goog-te-banner-frame,
.goog-te-gadget,
.goog-te-balloon-frame,
#goog-gt-tt {
  display: none !important;
}

body {
  top: 0 !important;
}

.img_lang {
  width: 18px;
  height: 18px;
  object-fit: cover;
  border-radius: 50%;
}

.lang.is-active .img_lang {
  box-shadow: 0 0 0 2px rgba(185, 140, 63, .45);
}

/*ocultamos la barra ssquerosa de google*/
/* Ocultar barra superior de Google Translate */
.goog-te-banner-frame,
.goog-te-gadget,
.goog-te-balloon-frame,
#goog-gt-tt,
body>.skiptranslate {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
}

body {
  top: 0 !important;
  position: static !important;
}

/* =========================
   JRZ BRAND FOCUS - CLEAN HERO
========================= */

.hero-brand {
  margin-bottom: 1.4rem;
}

.hero-brand-logo {
  display: block;
  width: clamp(78px, 6vw, 118px);
  height: auto;
  margin-bottom: .55rem;
  opacity: .96;
  filter: drop-shadow(0 10px 20px rgba(80, 45, 20, .12));
}

.hero-brand .brand-author {
  display: block;
  font-family: "Cinzel", serif;
  font-size: .58rem;
  letter-spacing: .34em;
  color: rgba(0, 0, 0, .48);
  text-transform: uppercase;
}


@media (max-width: 768px) {
  .hero-brand-logo {
    width: 82px;
  }

  .hero-brand {
    margin-bottom: 1.1rem;
  }

  #section-1 .hero-brand {
    width: fit-content !important;
    margin: 0 auto 1.25rem auto !important;
    padding-left: 0 !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  #section-1 .hero-brand-logo {
    display: block !important;
    width: 82px !important;
    margin: 0 auto .42rem auto !important;
  }

  #section-1 .hero-brand .brand-author {
    display: block !important;
    width: auto !important;
    margin: 0 auto !important;
    padding-left: .32em !important;
    text-align: center !important;
  }
}

/* =========================
   MOBILE - DISABLE PARALLAX JITTER  -> Quitar el famoso temblor de las imagenes en el celular
========================= */

@media (max-width: 768px) {
  [class*="section-bg"]::after {
    transform: none !important;
    transition: none !important;
    will-change: auto !important;
    background-attachment: scroll !important;
  }

  [class*="section-bg"]::before {
    transform: none !important;
  }
}














/* =========================================================
   JRZ WESTERN
   SECTION 01 -> SECTION 02 CINEMATIC TRANSITION
========================================================= */

#section-1,
#section-2 {
  isolation: isolate;
}


/* profundidad para la llegada de section 2 */
#section-2 {
  perspective: 1400px;
  perspective-origin: 50% 35%;
}


/* solamente mientras JS controla la transición */
#section-2 .container {
  transform-origin: 50% 20%;
}


/* capa WebGL creada desde jrz-motion.js */
#jrz-motion-layer {
  position: fixed;
  inset: 0;

  width: 100%;
  height: 100%;

  z-index: 20;

  pointer-events: none;
  overflow: hidden;

  opacity: 0;
}


/* Canvas de polvo */
#jrz-motion-canvas {
  position: absolute;
  inset: 0;

  width: 100%;
  height: 100%;

  display: block;

  pointer-events: none;
}


/*
  Capa atmosférica.
  No es negra.
  Sirve para integrar las partículas
  con los beige / tierra del sitio.
*/
#jrz-motion-layer::after {
  content: "";
  position: absolute;
  inset: 0;

  background:
    radial-gradient(circle at 70% 50%,
      rgba(165, 116, 67, .08),
      transparent 38%),
    linear-gradient(90deg,
      rgba(239, 220, 190, 0),
      rgba(183, 135, 86, .05),
      rgba(112, 72, 41, .08));

  pointer-events: none;
}


/* GPU friendly */
#section-1 .container,
#section-2 .container,
#section-2 .w-subtext,
#section-2 .title-section-2,
#section-2 .w-subline,
#section-2 .w-btn,
#section-2 .w-card2 {
  backface-visibility: hidden;
}


/*
  Las columnas serán las que reciban
  la animación de entrada.

  Esto evita pelear con:

  .w-card2:hover {
      transform: translateY(-8px);
  }
*/
#section-2 .w-card2 {
  transform-style: preserve-3d;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 768px) {

  #section-2 {
    perspective: 900px;
  }

}


/* =========================================================
   ACCESIBILIDAD
========================================================= */

@media (prefers-reduced-motion: reduce) {

  #jrz-motion-layer {
    display: none !important;
  }

  #section-1 .container,
  #section-2 .container {
    transform: none !important;
    opacity: 1 !important;
  }

}
















/* =========================================================
   JRZ WESTERN
   HERO — EDITORIAL LUXURY V2
========================================================= */

#section-1 {
  position: relative;
  min-height: 100svh;

  overflow: hidden;

  isolation: isolate;

  background-color: #eee0cc;
}


/* =========================================================
   IMAGEN
========================================================= */

#section-1::after {

  filter:
    brightness(.93)
    contrast(1.09)
    saturate(1.08) !important;

}


/*
  Capa lumínica.

  Importante:
  ya NO cubrimos toda la fotografía con blanco.
*/
#section-1::before {

  background:

    radial-gradient(
      900px 700px at 25% 46%,
      rgba(250,242,226,.72) 0%,
      rgba(248,236,216,.50) 32%,
      rgba(246,225,198,.13) 57%,
      transparent 76%
    ),

    linear-gradient(
      90deg,
      rgba(250,242,228,.62) 0%,
      rgba(249,236,214,.35) 31%,
      rgba(247,220,185,.09) 47%,
      transparent 67%
    ) !important;

}



/* =========================================================
   CONTENEDOR
========================================================= */

#section-1 .hero-container {

  position: relative;

  z-index: 4;

}


/* =========================================================
   PANEL VELLUM
========================================================= */

#section-1 .hero-editorial {

  position: relative;

  width: min(520px, 100%);

  padding:

    clamp(26px, 3vw, 48px)

    clamp(28px, 3.4vw, 58px)

    clamp(28px, 3vw, 46px)

    clamp(28px, 3.5vw, 58px);


  /*
    La clave del nuevo diseño:
    una superficie translúcida,
    no una caja sólida.
  */

  background:

    linear-gradient(
      110deg,
      rgba(250,242,229,.76) 0%,
      rgba(242,222,195,.52) 63%,
      rgba(231,198,158,.15) 86%,
      transparent 100%
    );


  backdrop-filter:
    blur(5px);

  -webkit-backdrop-filter:
    blur(5px);


  /*
    Desvanecemos el panel hacia la derecha.
  */

  -webkit-mask-image:

    linear-gradient(
      90deg,
      #000 0%,
      #000 72%,
      rgba(0,0,0,.86) 83%,
      transparent 100%
    );

  mask-image:

    linear-gradient(
      90deg,
      #000 0%,
      #000 72%,
      rgba(0,0,0,.86) 83%,
      transparent 100%
    );

}


/* línea superior editorial */

#section-1 .hero-editorial::before {

  content: "";

  position: absolute;

  top: 0;
  left: 0;

  width: 90px;
  height: 1px;

  background:

    linear-gradient(
      90deg,
      #7f3a1f,
      transparent
    );

}


/* micro detalle vertical */

#section-1 .hero-editorial::after {

  content: "";

  position: absolute;

  top: 0;
  left: 0;

  width: 1px;
  height: 86px;

  background:

    linear-gradient(
      180deg,
      rgba(127,58,31,.62),
      transparent
    );

}



/* =========================================================
   EYEBROW
========================================================= */

#section-1 .hero-eyebrow {

  display: flex;

  align-items: center;

  gap: 13px;

  margin-bottom: 32px;

  font-family:
    "Cinzel",
    serif;

  font-size: .52rem;

  letter-spacing: .29em;

  text-transform: uppercase;

  color:
    rgba(83,55,35,.52);

}


#section-1 .hero-eyebrow-line {

  width: 34px;

  height: 1px;

  background:
    rgba(127,58,31,.42);

}



/* =========================================================
   MARCA
========================================================= */

#section-1 .hero-brand {

  margin-bottom: 20px;

}


#section-1 .hero-brand-logo {

  width:
    clamp(
      76px,
      5vw,
      100px
    );

  margin-bottom: 7px;

  filter:

    drop-shadow(
      0 11px 22px
      rgba(73,39,21,.09)
    );

}


#section-1 .brand-author {

  display: block;

  padding-left: 3px;

  font-family:
    "Cinzel",
    serif;

  font-size: .48rem;

  letter-spacing: .39em;

  color:
    rgba(75,49,31,.45);

}



/* =========================================================
   TITULAR
========================================================= */

#section-1 #hero-title {

  margin:
    0 0 24px;

  max-width: 9ch;

  font-family:
    "Cinzel",
    serif;

  font-size:

    clamp(
      3.2rem,
      4.4vw,
      4.65rem
    );

  font-weight: 500;

  line-height: .91;

  letter-spacing: -.035em;

  color:
    #75321d;

  text-shadow:

    0 1px 0
    rgba(255,255,255,.28);

}



/* =========================================================
   MENSAJE
========================================================= */

#section-1 .hero-statement {

  position: relative;

  max-width: 360px;

  margin:
    0
    0
    30px;

  padding-left: 17px;


  font-size: .91rem;

  line-height: 1.75;

  color:
    rgba(55,40,29,.61);

}


/* detalle editorial */

#section-1 .hero-statement::before {

  content: "";

  position: absolute;

  left: 0;

  top: 7px;

  bottom: 7px;

  width: 1px;

  background:
    rgba(127,58,31,.27);

}



/* =========================================================
   CTA
========================================================= */

#section-1 .hero-cta {

  position: relative;

  display: inline-flex;

  align-items: center;

  gap: 13px;

  padding:

    10px
    0
    12px;


  font-family:
    "Cinzel",
    serif;

  font-size: .61rem;

  letter-spacing: .27em;

  text-transform: uppercase;

  text-decoration: none;

  color:
    rgba(48,34,24,.80);

}


#section-1 .hero-cta-line {

  width: 67px;

  height: 1px;

  background:

    linear-gradient(
      90deg,
      rgba(76,50,31,.72),
      rgba(76,50,31,.12)
    );

  transition:

    width
    .45s
    cubic-bezier(.16,1,.3,1);

}


#section-1 .hero-cta-arrow {

  display: inline-block;

  font-size: 1rem;

  transition:

    transform
    .4s
    cubic-bezier(.16,1,.3,1);

}


#section-1 .hero-cta:hover {

  color:
    #7f3a1f;

}


#section-1 .hero-cta:hover
.hero-cta-line {

  width: 105px;

}


#section-1 .hero-cta:hover
.hero-cta-arrow {

  transform:
    translateX(7px);

}



/* =========================================================
   MINI NAVEGACIÓN
========================================================= */

#section-1 .hero-world {

  display: grid;

  grid-template-columns:
    repeat(3,1fr);

  width: 100%;

  max-width: 430px;

  margin-top: 43px;

  padding-top: 15px;

  border-top:

    1px solid
    rgba(82,56,37,.18);

}


#section-1 .hero-world-item {

  position: relative;

  display: block;

  padding:
    3px
    20px
    5px
    0;

  text-decoration: none;

  transition:
    transform .3s ease;

}


#section-1 .hero-world-item +
.hero-world-item {

  padding-left: 23px;

  border-left:

    1px solid
    rgba(82,56,37,.11);

}


#section-1 .hero-world-num {

  display: block;

  margin-bottom: 7px;

  font-family:
    "Cinzel",
    serif;

  font-size: .43rem;

  letter-spacing: .20em;

  color:
    rgba(127,58,31,.42);

}


#section-1 .hero-world strong {

  font-family:
    "Cinzel",
    serif;

  font-size: .56rem;

  font-weight: 500;

  letter-spacing: .25em;

  color:
    rgba(49,35,25,.64);

  transition:
    color .3s ease;

}


#section-1 .hero-world-item:hover {

  transform:
    translateY(-3px);

}


#section-1 .hero-world-item:hover strong {

  color:
    #7f3a1f;

}



/* =========================================================
   NÚMERO 01 GIGANTE
========================================================= */

#section-1 .hero-edition-number {

  position: absolute;

  left: -20px;

  bottom: -27px;

  z-index: 2;

  font-family:
    "Cinzel",
    serif;

  font-size:
    clamp(
      10rem,
      20vw,
      22rem
    );

  font-weight: 500;

  line-height: .75;

  letter-spacing: -.08em;

  color:
    rgba(112,59,34,.035);

  pointer-events: none;

  user-select: none;

}



/* =========================================================
   SELLO JRZ
========================================================= */

#section-1 .hero-seal {

  position: absolute;

  z-index: 5;

  left:
    clamp(
      710px,
      46vw,
      920px
    );

  bottom:
    clamp(
      72px,
      9vh,
      115px
    );

  width:
    clamp(
      88px,
      7vw,
      116px
    );

  aspect-ratio: 1;

  pointer-events: none;

}


#section-1 .hero-seal svg {

  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  overflow: visible;

  animation:

    heroSealRotate
    28s
    linear
    infinite;

}


#section-1 .hero-seal text {

  font-family:
    "Cinzel",
    serif;

  font-size: 8px;

  letter-spacing: 2.4px;

  fill:
    rgba(83,51,29,.48);

}


#section-1
.hero-seal-center {

  position: absolute;

  inset: 30%;

  display: grid;

  place-items: center;

  border:

    1px solid
    rgba(112,65,36,.25);

  border-radius: 50%;

  font-family:
    "Cinzel",
    serif;

  font-size: .62rem;

  letter-spacing: .11em;

  color:
    rgba(94,53,29,.58);

}


@keyframes heroSealRotate {

  to {

    transform:
      rotate(360deg);

  }

}



/* =========================================================
   PRODUCT NOTE
========================================================= */

#section-1 .hero-product-note {

  position: absolute;

  z-index: 5;

  right:
    clamp(
      55px,
      7vw,
      130px
    );

  top:
    28%;


  display: flex;

  align-items: center;

  gap: 13px;

  pointer-events: none;

}


#section-1
.hero-product-note-line {

  width: 54px;

  height: 1px;

  background:

    linear-gradient(
      90deg,
      transparent,
      rgba(244,226,200,.55)
    );

}


#section-1
.hero-product-note-copy {

  display: flex;

  flex-direction: column;

  gap: 4px;

}


#section-1
.hero-product-note-copy span {

  font-family:
    "Cinzel",
    serif;

  font-size: .40rem;

  letter-spacing: .32em;

  color:
    rgba(255,245,230,.52);

}


#section-1
.hero-product-note-copy strong {

  font-family:
    "Cinzel",
    serif;

  font-size: .49rem;

  font-weight: 500;

  letter-spacing: .22em;

  color:
    rgba(255,246,231,.72);

}



/* =========================================================
   FIRMA VERTICAL
========================================================= */

#section-1
.hero-vertical-signature {

  position: absolute;

  z-index: 5;

  right: 21px;

  top: 50%;

  transform:

    translateY(-50%)
    rotate(90deg);

  font-family:
    "Cinzel",
    serif;

  font-size: .38rem;

  letter-spacing: .39em;

  color:
    rgba(255,244,227,.40);

  white-space: nowrap;

  pointer-events: none;

}



/* =========================================================
   SCROLL
========================================================= */

#section-1 .hero-scroll {

  position: absolute;

  z-index: 6;

  left: 50%;

  bottom: 22px;

  transform:
    translateX(-50%);

  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 8px;

}


#section-1
.hero-scroll span {

  font-family:
    "Cinzel",
    serif;

  font-size: .39rem;

  letter-spacing: .32em;

  color:
    rgba(53,38,28,.44);

}


#section-1
.hero-scroll i {

  position: relative;

  width: 1px;

  height: 36px;

  overflow: hidden;

  background:
    rgba(71,48,32,.14);

}


#section-1
.hero-scroll i::after {

  content: "";

  position: absolute;

  left: 0;

  top: -100%;

  width: 1px;

  height: 100%;

  background:
    #7f3a1f;

  animation:

    heroScrollLine
    2.2s
    cubic-bezier(.16,1,.3,1)
    infinite;

}


@keyframes heroScrollLine {

  0% {

    transform:
      translateY(0);

  }

  72% {

    transform:
      translateY(200%);

  }

  100% {

    transform:
      translateY(200%);

  }

}



/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 991px) {

  #section-1 {

    align-items:
      flex-start !important;

  }


  #section-1
  .hero-container {

    padding-top:
      85px;

  }


  #section-1
  .hero-editorial {

    width: 100%;

    padding:
      28px
      22px
      32px;

    text-align: center;

    background:

      linear-gradient(
        180deg,
        rgba(250,242,228,.78),
        rgba(244,224,197,.51),
        rgba(244,224,197,.20)
      );


    -webkit-mask-image: none;

    mask-image: none;

  }


  #section-1
  .hero-editorial::after {

    display: none;

  }


  #section-1
  .hero-eyebrow {

    justify-content: center;

  }


  #section-1
  #hero-title {

    margin-left: auto;

    margin-right: auto;

    font-size:
      clamp(
        2.7rem,
        11vw,
        4rem
      );

  }


  #section-1
  .hero-statement {

    margin-left: auto;

    margin-right: auto;

    padding-left: 0;

    max-width: 320px;

  }


  #section-1
  .hero-statement::before {

    display: none;

  }


  #section-1
  .hero-cta {

    margin:
      0 auto;

  }


  #section-1
  .hero-world {

    margin-left: auto;

    margin-right: auto;

  }


  #section-1
  .hero-seal,

  #section-1
  .hero-product-note,

  #section-1
  .hero-vertical-signature,

  #section-1
  .hero-scroll {

    display: none;

  }


  #section-1
  .hero-edition-number {

    left: -20px;

    bottom: 20px;

    font-size:
      11rem;

  }

}
/* =====================================================================
   JRZ WESTERN · SECTION 1 · PREMIUM EDITORIAL V3
   ---------------------------------------------------------------------
   SAFE OVERRIDE:
   - Sólo actúa cuando #section-1 tiene la clase .hero-lux-v3
   - No modifica section-2, section-3, section-4, carrito, menú o footer
   - No requiere JavaScript
===================================================================== */

#section-1.hero-lux-v3{
  min-height:100svh;
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:#ead9c6;
}

/* ---------------------------------------------------------------------
   FOTOGRAFÍA
   Conservamos exactamente bg_1.png.
   El transform vuelve a incluir --py para no anular tu parallax existente.
--------------------------------------------------------------------- */

#section-1.hero-lux-v3::after{
  background-size:cover !important;
  background-position:center center !important;

  transform:
    translate3d(0, var(--py, 0px), 0)
    scale(1.025) !important;

  filter:
    brightness(.92)
    contrast(1.10)
    saturate(1.08) !important;
}

/* La izquierda recibe luz; el producto de la derecha conserva contraste. */
#section-1.hero-lux-v3::before{
  z-index:1;

  background:
    radial-gradient(
      68vw 92vh at 7% 46%,
      rgba(250,243,231,.89) 0%,
      rgba(248,237,219,.69) 31%,
      rgba(239,211,175,.27) 54%,
      rgba(239,211,175,0) 76%
    ),
    linear-gradient(
      90deg,
      rgba(249,241,226,.63) 0%,
      rgba(247,230,207,.33) 34%,
      rgba(238,201,158,.08) 52%,
      transparent 68%
    ) !important;
}

/* ---------------------------------------------------------------------
   ATMÓSFERA EDITORIAL
--------------------------------------------------------------------- */

#section-1.hero-lux-v3 .hero-lux-atmosphere{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;

  background:
    linear-gradient(
      90deg,
      transparent 0 47.8%,
      rgba(102,61,34,.11) 47.9%,
      transparent 48.05%
    ),
    radial-gradient(
      circle at 49% 73%,
      rgba(246,226,194,.10),
      transparent 18%
    );
}

/* Línea editorial superior que conecta copy y fotografía */
#section-1.hero-lux-v3 .hero-lux-atmosphere::before{
  content:"";
  position:absolute;
  top:clamp(104px,14vh,145px);
  left:clamp(38px,5.5vw,105px);
  width:min(42vw,760px);
  height:1px;

  background:
    linear-gradient(
      90deg,
      rgba(112,61,34,.32),
      rgba(112,61,34,.12) 70%,
      transparent
    );
}

/* Pequeño destello editorial, casi imperceptible */
#section-1.hero-lux-v3 .hero-lux-atmosphere::after{
  content:"";
  position:absolute;
  top:0;
  left:42%;
  width:18%;
  height:100%;

  background:
    linear-gradient(
      105deg,
      transparent 30%,
      rgba(255,238,208,.055) 48%,
      transparent 65%
    );

  transform:skewX(-8deg);
}

/* ---------------------------------------------------------------------
   CONTENEDOR
--------------------------------------------------------------------- */

#section-1.hero-lux-v3 > .hero-container{
  position:relative;
  z-index:4;
}

#section-1.hero-lux-v3 .hero-copy{
  padding-right:0;
}

/* El panel deja de sentirse como "card".
   Es una lámina translúcida que desaparece hacia la foto. */
#section-1.hero-lux-v3 .hero-editorial{
  position:relative;

  width:min(590px,100%);
  margin-left:clamp(0px,1.6vw,30px);

  padding:
    clamp(31px,3vw,48px)
    clamp(54px,4vw,72px)
    clamp(31px,3vw,46px)
    clamp(42px,3.7vw,66px);

  background:
    linear-gradient(
      102deg,
      rgba(249,240,225,.72) 0%,
      rgba(239,216,188,.49) 64%,
      rgba(225,185,140,.17) 86%,
      transparent 100%
    );

  box-shadow:
    inset 1px 0 0 rgba(111,58,32,.21);

  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);

  -webkit-mask-image:
    linear-gradient(
      90deg,
      #000 0%,
      #000 78%,
      rgba(0,0,0,.75) 90%,
      transparent 100%
    );

  mask-image:
    linear-gradient(
      90deg,
      #000 0%,
      #000 78%,
      rgba(0,0,0,.75) 90%,
      transparent 100%
    );

  animation:
    jrzHeroPanelIn
    .95s
    cubic-bezier(.16,1,.3,1)
    both;
}

/* Micro-esquina superior */
#section-1.hero-lux-v3 .hero-editorial::before{
  content:"";
  position:absolute;
  left:0;
  top:0;

  width:84px;
  height:1px;

  background:
    linear-gradient(
      90deg,
      #7d3822,
      transparent
    );
}

#section-1.hero-lux-v3 .hero-editorial::after{
  content:"";
  position:absolute;
  left:0;
  top:0;

  width:1px;
  height:86px;

  background:
    linear-gradient(
      180deg,
      rgba(125,56,34,.70),
      transparent
    );
}

/* ---------------------------------------------------------------------
   EYEBROW
--------------------------------------------------------------------- */

#section-1.hero-lux-v3 .hero-eyebrow{
  display:flex;
  align-items:center;
  gap:13px;

  margin-bottom:29px;

  font-family:"Cinzel",serif;
  font-size:.49rem;
  letter-spacing:.31em;
  text-transform:uppercase;

  color:rgba(74,48,32,.54);

  animation:
    jrzHeroElementIn
    .8s
    .12s
    cubic-bezier(.16,1,.3,1)
    both;
}

#section-1.hero-lux-v3 .hero-eyebrow-line{
  width:36px;
  height:1px;
  flex:0 0 auto;
  background:rgba(125,56,34,.45);
}

/* ---------------------------------------------------------------------
   LOGO
--------------------------------------------------------------------- */

#section-1.hero-lux-v3 .hero-brand{
  margin:0 0 18px !important;
  padding:0 !important;

  animation:
    jrzHeroElementIn
    .85s
    .20s
    cubic-bezier(.16,1,.3,1)
    both;
}

#section-1.hero-lux-v3 .hero-brand-logo{
  display:block;

  width:clamp(74px,5vw,96px) !important;
  height:auto;

  margin:0 0 7px !important;

  opacity:.98;

  filter:
    drop-shadow(0 12px 24px rgba(71,38,20,.10));
}

#section-1.hero-lux-v3 .brand-author{
  display:block;

  margin:0 !important;
  padding-left:3px !important;

  font-family:"Cinzel",serif;
  font-size:.46rem !important;
  letter-spacing:.41em !important;
  text-transform:uppercase;

  color:rgba(71,47,31,.45) !important;
}

/* ---------------------------------------------------------------------
   TITULAR
--------------------------------------------------------------------- */

#section-1.hero-lux-v3 #hero-title{
  display:block;

  max-width:none !important;
  margin:0 0 24px !important;

  font-family:"Cinzel",serif;
  font-weight:500;

  line-height:.88 !important;
  letter-spacing:-.047em !important;

  color:#76331f !important;

  text-shadow:
    0 1px 0 rgba(255,255,255,.28) !important;

  animation:
    jrzHeroElementIn
    .95s
    .26s
    cubic-bezier(.16,1,.3,1)
    both;
}

#section-1.hero-lux-v3 #hero-title > span{
  display:block;
  width:max-content;
}

#section-1.hero-lux-v3 #hero-title > span:nth-child(1){
  font-size:clamp(3.45rem,4.35vw,4.9rem);
}

#section-1.hero-lux-v3 #hero-title > span:nth-child(2){
  margin-left:clamp(0px,.8vw,14px);
  font-size:clamp(3.25rem,4.05vw,4.55rem);
}

#section-1.hero-lux-v3 #hero-title > span:nth-child(3){
  margin-left:clamp(36px,3.2vw,62px);
  font-size:clamp(3.65rem,4.55vw,5.1rem);

  color:#682a1b;
}

/* Una línea óptica bajo PASIÓN */
#section-1.hero-lux-v3 #hero-title > span:nth-child(3)::after{
  content:"";
  display:inline-block;

  width:clamp(28px,3vw,52px);
  height:1px;

  margin-left:15px;
  margin-bottom:.34em;

  vertical-align:middle;

  background:
    linear-gradient(
      90deg,
      rgba(104,42,27,.52),
      transparent
    );
}

/* ---------------------------------------------------------------------
   MENSAJE
--------------------------------------------------------------------- */

#section-1.hero-lux-v3 .hero-statement{
  position:relative;

  max-width:365px;

  margin:0 0 27px !important;
  padding-left:17px;

  font-size:.90rem;
  line-height:1.75;

  color:rgba(54,40,29,.62);

  animation:
    jrzHeroElementIn
    .85s
    .36s
    cubic-bezier(.16,1,.3,1)
    both;
}

#section-1.hero-lux-v3 .hero-statement::before{
  content:"";

  position:absolute;
  left:0;
  top:6px;
  bottom:6px;

  width:1px;

  background:
    linear-gradient(
      180deg,
      rgba(125,56,34,.38),
      rgba(125,56,34,.08)
    );
}

/* ---------------------------------------------------------------------
   CTA
--------------------------------------------------------------------- */

#section-1.hero-lux-v3 .hero-cta{
  display:inline-flex;
  align-items:center;
  gap:13px;

  padding:9px 0 11px;

  font-family:"Cinzel",serif;
  font-size:.59rem;
  letter-spacing:.28em;

  color:rgba(48,34,24,.80);
  text-decoration:none;
  text-transform:uppercase;

  animation:
    jrzHeroElementIn
    .85s
    .44s
    cubic-bezier(.16,1,.3,1)
    both;
}

#section-1.hero-lux-v3 .hero-cta-line{
  position:relative;

  width:66px;
  height:1px;

  overflow:hidden;

  background:
    rgba(78,51,32,.18);

  transition:
    width
    .45s
    cubic-bezier(.16,1,.3,1);
}

#section-1.hero-lux-v3 .hero-cta-line::after{
  content:"";

  position:absolute;
  inset:0;

  background:
    linear-gradient(
      90deg,
      rgba(92,55,33,.85),
      rgba(92,55,33,.20)
    );

  transform:translateX(-105%);

  animation:
    jrzHeroCtaLine
    2.8s
    1.3s
    cubic-bezier(.16,1,.3,1)
    infinite;
}

#section-1.hero-lux-v3 .hero-cta-arrow{
  display:inline-block;

  font-size:1rem;
  letter-spacing:0;

  transition:
    transform
    .4s
    cubic-bezier(.16,1,.3,1);
}

#section-1.hero-lux-v3 .hero-cta:hover{
  color:#77331f;
}

#section-1.hero-lux-v3 .hero-cta:hover .hero-cta-line{
  width:102px;
}

#section-1.hero-lux-v3 .hero-cta:hover .hero-cta-arrow{
  transform:translateX(7px);
}

/* ---------------------------------------------------------------------
   UNIVERSO JRZ
--------------------------------------------------------------------- */

#section-1.hero-lux-v3 .hero-world{
  display:grid;
  grid-template-columns:repeat(3,1fr);

  width:100%;
  max-width:430px;

  margin-top:39px !important;
  padding-top:14px;

  border-top:
    1px solid rgba(78,52,34,.18);

  animation:
    jrzHeroElementIn
    .9s
    .52s
    cubic-bezier(.16,1,.3,1)
    both;
}

#section-1.hero-lux-v3 .hero-world-item{
  position:relative;

  min-width:0;

  padding:3px 18px 5px 0;

  border:0;

  transition:
    transform .35s cubic-bezier(.16,1,.3,1),
    opacity .35s ease;
}

#section-1.hero-lux-v3 .hero-world-item + .hero-world-item{
  padding-left:22px;

  border-left:
    1px solid rgba(78,52,34,.10);
}

#section-1.hero-lux-v3 .hero-world-num{
  display:block;

  margin-bottom:6px;

  font-family:"Cinzel",serif;
  font-size:.42rem;
  letter-spacing:.20em;

  color:rgba(125,56,34,.47);
}

#section-1.hero-lux-v3 .hero-world strong{
  font-family:"Cinzel",serif;
  font-size:.55rem;
  font-weight:500;
  letter-spacing:.24em;

  color:rgba(47,34,25,.66);
}

/* ---------------------------------------------------------------------
   NÚMERO EDITORIAL
--------------------------------------------------------------------- */

#section-1.hero-lux-v3 .hero-lux-index{
  position:absolute;

  left:-24px;
  bottom:-38px;

  z-index:2;

  font-family:"Cinzel",serif;
  font-size:clamp(11rem,20vw,22rem);
  font-weight:500;
  line-height:.74;
  letter-spacing:-.08em;

  color:rgba(112,58,33,.030);

  pointer-events:none;
  user-select:none;
}

/* ---------------------------------------------------------------------
   FIRMA SOBRE LA FOTOGRAFÍA
--------------------------------------------------------------------- */

#section-1.hero-lux-v3 .hero-product-signature{
  position:absolute;

  z-index:5;

  left:64%;
  top:22%;

  display:flex;
  align-items:center;
  gap:13px;

  pointer-events:none;

  color:rgba(84,50,30,.56);

  animation:
    jrzHeroPhotoNoteIn
    1.05s
    .62s
    cubic-bezier(.16,1,.3,1)
    both;
}

#section-1.hero-lux-v3 .hero-product-signature__rule{
  width:48px;
  height:1px;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(92,54,31,.45)
    );
}

#section-1.hero-lux-v3 .hero-product-signature > div{
  display:flex;
  flex-direction:column;
  gap:4px;
}

#section-1.hero-lux-v3 .hero-product-signature small,
#section-1.hero-lux-v3 .hero-product-signature strong{
  font-family:"Cinzel",serif;
  font-weight:500;
  line-height:1;
}

#section-1.hero-lux-v3 .hero-product-signature small{
  font-size:.39rem;
  letter-spacing:.30em;
  opacity:.72;
}

#section-1.hero-lux-v3 .hero-product-signature strong{
  font-size:.48rem;
  letter-spacing:.22em;
}

/* ---------------------------------------------------------------------
   SELLO
--------------------------------------------------------------------- */

#section-1.hero-lux-v3 .hero-lux-seal{
  position:absolute;

  z-index:5;

  left:48.2%;
  bottom:8.5%;

  width:clamp(82px,6.5vw,110px);
  aspect-ratio:1;

  pointer-events:none;

  color:rgba(86,50,29,.52);

  animation:
    jrzHeroSealIn
    1.05s
    .72s
    cubic-bezier(.16,1,.3,1)
    both;
}

#section-1.hero-lux-v3 .hero-lux-seal svg{
  position:absolute;
  inset:0;

  width:100%;
  height:100%;

  overflow:visible;

  animation:
    jrzHeroSealRotate
    34s
    linear
    infinite;
}

#section-1.hero-lux-v3 .hero-lux-seal text{
  font-family:"Cinzel",serif;
  font-size:7.4px;
  letter-spacing:2.15px;

  fill:currentColor;
}

#section-1.hero-lux-v3 .hero-lux-seal__center{
  position:absolute;
  inset:32%;

  display:grid;
  place-items:center;

  border:
    1px solid rgba(99,57,32,.24);

  border-radius:50%;

  font-family:"Cinzel",serif;
  font-size:.57rem;
  letter-spacing:.10em;

  color:rgba(88,49,28,.62);
}

/* ---------------------------------------------------------------------
   FIRMA VERTICAL
--------------------------------------------------------------------- */

#section-1.hero-lux-v3 .hero-vertical-signature{
  position:absolute;

  right:20px;
  top:50%;

  z-index:5;

  transform:
    translateY(-50%)
    rotate(90deg);

  transform-origin:center;

  font-family:"Cinzel",serif;
  font-size:.37rem;
  letter-spacing:.41em;

  color:rgba(255,241,220,.40);

  white-space:nowrap;
  pointer-events:none;
}

/* ---------------------------------------------------------------------
   DISCOVER
--------------------------------------------------------------------- */

#section-1.hero-lux-v3 .hero-scroll{
  position:absolute;

  left:50%;
  bottom:18px;

  z-index:6;

  transform:translateX(-50%);

  display:flex;
  flex-direction:column;
  align-items:center;
  gap:7px;

  pointer-events:none;
}

#section-1.hero-lux-v3 .hero-scroll span{
  font-family:"Cinzel",serif;
  font-size:.38rem;
  letter-spacing:.34em;

  color:rgba(56,39,28,.43);
}

#section-1.hero-lux-v3 .hero-scroll i{
  position:relative;

  width:1px;
  height:34px;

  overflow:hidden;

  background:rgba(75,48,31,.14);
}

#section-1.hero-lux-v3 .hero-scroll i::after{
  content:"";

  position:absolute;
  left:0;
  top:-100%;

  width:1px;
  height:100%;

  background:#77331f;

  animation:
    jrzHeroScrollLine
    2.2s
    cubic-bezier(.16,1,.3,1)
    infinite;
}

/* ---------------------------------------------------------------------
   ENTRADAS
--------------------------------------------------------------------- */

@keyframes jrzHeroPanelIn{
  from{
    opacity:0;
    transform:translate3d(-20px,8px,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

@keyframes jrzHeroElementIn{
  from{
    opacity:0;
    transform:translate3d(0,17px,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

@keyframes jrzHeroPhotoNoteIn{
  from{
    opacity:0;
    transform:translate3d(16px,0,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

@keyframes jrzHeroSealIn{
  from{
    opacity:0;
    transform:scale(.90);
  }
  to{
    opacity:1;
    transform:scale(1);
  }
}

@keyframes jrzHeroSealRotate{
  to{
    transform:rotate(360deg);
  }
}

@keyframes jrzHeroCtaLine{
  0%,18%{
    transform:translateX(-105%);
  }
  55%,100%{
    transform:translateX(110%);
  }
}

@keyframes jrzHeroScrollLine{
  0%{
    transform:translateY(0);
  }
  72%,100%{
    transform:translateY(200%);
  }
}

/* ---------------------------------------------------------------------
   TABLET / MOBILE
--------------------------------------------------------------------- */

@media (max-width:991.98px){

  #section-1.hero-lux-v3{
    align-items:flex-start !important;
  }

  #section-1.hero-lux-v3::before{
    background:
      linear-gradient(
        180deg,
        rgba(248,239,224,.86) 0%,
        rgba(246,228,203,.63) 47%,
        rgba(236,199,155,.20) 72%,
        transparent 100%
      ) !important;
  }

  #section-1.hero-lux-v3 > .hero-container{
    padding-top:84px;
    padding-bottom:74px;
  }

  #section-1.hero-lux-v3 .hero-editorial{
    width:min(620px,94vw);

    margin:0 auto;

    padding:
      28px
      clamp(20px,6vw,44px)
      31px;

    text-align:center;

    background:
      linear-gradient(
        180deg,
        rgba(249,240,225,.76),
        rgba(239,215,184,.45),
        rgba(229,191,147,.11)
      );

    -webkit-mask-image:none;
    mask-image:none;

    box-shadow:
      inset 0 1px 0 rgba(125,56,34,.16);
  }

  #section-1.hero-lux-v3 .hero-editorial::after{
    display:none;
  }

  #section-1.hero-lux-v3 .hero-eyebrow{
    justify-content:center;
  }

  #section-1.hero-lux-v3 .hero-brand{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
  }

  #section-1.hero-lux-v3 .hero-brand-logo{
    margin-left:auto !important;
    margin-right:auto !important;
  }

  #section-1.hero-lux-v3 #hero-title > span{
    width:auto;
    text-align:center;
  }

  #section-1.hero-lux-v3 #hero-title > span:nth-child(1),
  #section-1.hero-lux-v3 #hero-title > span:nth-child(2),
  #section-1.hero-lux-v3 #hero-title > span:nth-child(3){
    margin-left:0;
    font-size:clamp(2.65rem,10.7vw,4.15rem);
  }

  #section-1.hero-lux-v3 #hero-title > span:nth-child(3)::after{
    display:none;
  }

  #section-1.hero-lux-v3 .hero-statement{
    max-width:330px;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:0;
  }

  #section-1.hero-lux-v3 .hero-statement::before{
    display:none;
  }

  #section-1.hero-lux-v3 .hero-cta{
    width:max-content;
    margin-left:auto;
    margin-right:auto;
  }

  #section-1.hero-lux-v3 .hero-world{
    max-width:450px;
    margin-left:auto;
    margin-right:auto;
  }

  #section-1.hero-lux-v3 .hero-product-signature,
  #section-1.hero-lux-v3 .hero-lux-seal,
  #section-1.hero-lux-v3 .hero-vertical-signature,
  #section-1.hero-lux-v3 .hero-scroll{
    display:none;
  }

  #section-1.hero-lux-v3 .hero-lux-index{
    bottom:18px;
    font-size:clamp(9rem,33vw,13rem);
  }

  #section-1.hero-lux-v3 .hero-lux-atmosphere::before{
    left:7vw;
    width:52vw;
  }
}

@media (max-width:575.98px){

  #section-1.hero-lux-v3 > .hero-container{
    padding-top:70px;
  }

  #section-1.hero-lux-v3 .hero-eyebrow{
    font-size:.42rem;
    letter-spacing:.22em;
  }

  #section-1.hero-lux-v3 .hero-eyebrow-line{
    width:24px;
  }

  #section-1.hero-lux-v3 .hero-statement{
    font-size:.84rem;
    line-height:1.65;
  }

  #section-1.hero-lux-v3 .hero-world-item{
    padding-right:8px;
  }

  #section-1.hero-lux-v3 .hero-world-item + .hero-world-item{
    padding-left:9px;
  }

  #section-1.hero-lux-v3 .hero-world strong{
    font-size:.47rem;
    letter-spacing:.14em;
  }

  #section-1.hero-lux-v3 .hero-world-num{
    font-size:.38rem;
  }
}

/* ---------------------------------------------------------------------
   REDUCED MOTION
--------------------------------------------------------------------- */

@media (prefers-reduced-motion:reduce){

  #section-1.hero-lux-v3 .hero-editorial,
  #section-1.hero-lux-v3 .hero-eyebrow,
  #section-1.hero-lux-v3 .hero-brand,
  #section-1.hero-lux-v3 #hero-title,
  #section-1.hero-lux-v3 .hero-statement,
  #section-1.hero-lux-v3 .hero-cta,
  #section-1.hero-lux-v3 .hero-world,
  #section-1.hero-lux-v3 .hero-product-signature,
  #section-1.hero-lux-v3 .hero-lux-seal{
    animation:none !important;
  }

  #section-1.hero-lux-v3 .hero-lux-seal svg,
  #section-1.hero-lux-v3 .hero-cta-line::after,
  #section-1.hero-lux-v3 .hero-scroll i::after{
    animation:none !important;
  }
}