/* ======================================================================
   Ofertas — réplica del diseño "5% de descuento / Student Colour Offer"
   (Claudia). Define sus propias variables `--of-*`; va encima de
   home-nuevo.css, que carga el layout para toda la web.

   Añadido al integrarla (11/09/2026), con sus mismas variables y medidas:
     · `.of-btn` / `.of-btn--borde`: su botón del hero, reutilizable fuera de él;
     · `.of-band__datos`: fila bajo la banda con años, dirección, teléfono y
       horario, que la versión anterior de la página enseñaba;
     · `.of-final`: el cierre con las reseñas y los botones de reservar.
   Árabe: propiedades lógicas (`padding-inline-*`, `border-inline-*`) y sin
   espaciado de letras, que en árabe rompe la unión de las letras.
   ====================================================================== */
:root{
  --of-oro:#C0913F; --of-tinta:#262019; --of-gris:#55493F;
  --of-rosa:#DFA79B; --of-rosa-suave:#EFC9C3;
  --of-fondo:#FAF5F0; --of-hero:#F6E7E3; --of-borde:#D9C8AF;
}

/* ---------- hero ---------- */
.of-hero{background:var(--of-hero);display:grid;grid-template-columns:1.05fr 1fr;align-items:stretch;overflow:hidden}
.of-hero__txt{align-self:center;justify-self:center;text-align:center;max-width:560px;
              padding:clamp(3rem,7vw,5.5rem) clamp(1.5rem,4vw,3rem)}
.of-hero__kicker{display:flex;align-items:center;justify-content:center;gap:.8rem;
                 color:var(--of-oro);font-family:'Jost',sans-serif;font-size:.68rem;
                 font-weight:500;letter-spacing:.3em;text-transform:uppercase}
.of-hero__kicker span{width:28px;height:1px;background:var(--of-oro);opacity:.8}
.of-hero__titulo{font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--of-tinta);
                 font-size:clamp(2.6rem,2rem + 3vw,4.6rem);line-height:1.05;
                 text-transform:uppercase;letter-spacing:.02em;margin-top:1.1rem}
.of-hero__sub{font-family:'Cormorant Garamond',serif;font-weight:500;color:var(--of-oro);
              font-size:clamp(1.25rem,1rem + 1.3vw,2rem);letter-spacing:.26em;
              text-transform:uppercase;margin-top:.55rem}
.of-hero__parr{color:var(--of-gris);font-weight:300;line-height:1.65;margin-top:1.5rem;
               font-size:clamp(.95rem,.9rem + .2vw,1.08rem)}
.of-hero__btn,.of-btn{display:inline-block;background:var(--of-rosa);color:#3B2A24;
              border:1px solid transparent;
              text-decoration:none;border-radius:999px;padding:.95rem 2.1rem;
              font-family:'Jost',sans-serif;font-size:.68rem;font-weight:600;
              letter-spacing:.22em;text-transform:uppercase;transition:background .3s,transform .3s}
.of-hero__btn{margin-top:1.9rem}
.of-hero__btn:hover,.of-btn:hover{background:#D6968A;transform:translateY(-1px)}
.of-btn--borde{background:transparent;border-color:var(--of-oro);color:var(--of-tinta)}
.of-btn--borde:hover{background:var(--of-rosa-suave)}
.of-hero__img{position:relative;min-height:400px}
.of-hero__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:25% center;display:block}

/* ---------- oferta estudiante ---------- */
.of-oferta{background:var(--of-fondo);padding:clamp(3rem,6vw,5.5rem) clamp(1.5rem,4vw,3.2rem)}
.of-oferta__inner{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1fr 1.08fr;
                  gap:clamp(2.5rem,5vw,5.5rem);align-items:start}
.of-kicker{color:var(--of-oro);font-family:'Jost',sans-serif;font-size:.64rem;font-weight:600;
           letter-spacing:.26em;text-transform:uppercase}
.of-titulo{font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--of-tinta);
           font-size:clamp(2rem,1.5rem + 2vw,3.2rem);line-height:1.1;margin-top:.7rem}
.of-divisor{display:flex;align-items:center;gap:.7rem;margin:1.2rem 0 1.5rem;color:var(--of-oro)}
.of-divisor span{width:150px;height:1px;background:currentColor;opacity:.7}
.of-divisor span:last-child{width:34px}
.of-divisor i{font-style:normal;font-size:.8rem}
.of-parr{color:var(--of-gris);font-weight:300;line-height:1.8;font-size:.96rem;max-width:48ch}

.of-sub{color:var(--of-oro);font-family:'Jost',sans-serif;font-size:.7rem;font-weight:600;
        letter-spacing:.2em;text-transform:uppercase;margin:1.9rem 0 1.1rem}
.of-pasos{list-style:none;margin:0;padding:0}
.of-pasos li{display:flex;align-items:flex-start;gap:1rem;margin-bottom:1.05rem;
             color:#3E362F;font-size:.94rem;line-height:1.55}
.of-pasos li span{flex:none;width:32px;height:32px;border-radius:50%;background:var(--of-rosa-suave);
                  color:#3B2A24;display:flex;align-items:center;justify-content:center;
                  font-family:'Jost',sans-serif;font-size:.8rem;font-weight:600;margin-top:-.2rem}
.of-raya{border:0;height:1px;background:#E4D6C3;margin:1.7rem 0 0}
.of-terminos{list-style:disc;margin:0;padding-inline-start:1.2rem;color:var(--of-gris);
             font-weight:300;font-size:.92rem;line-height:1.65}
.of-terminos li{margin-bottom:.5rem}
.of-terminos li::marker{color:var(--of-tinta)}

.of-oferta__fotos{display:flex;flex-direction:column;gap:1.25rem}
.of-oferta__fotos img{width:100%;border-radius:14px;display:block;
                      box-shadow:0 16px 32px -24px rgba(30,22,16,.55)}

/* ---------- banda de ventajas ---------- */
.of-band{background:var(--of-fondo);padding:0 clamp(1.5rem,4vw,3.2rem) clamp(3rem,6vw,5rem)}
.of-band__caja{max-width:1180px;margin:0 auto;border:1px solid var(--of-borde);border-radius:14px;
               display:grid;grid-template-columns:repeat(3,1fr);
               padding:clamp(1.8rem,3.2vw,2.8rem) clamp(.8rem,2vw,1.8rem)}
.of-band__item{text-align:center;padding:0 clamp(1rem,2.4vw,2.4rem)}
.of-band__item + .of-band__item{border-inline-start:1px solid #E6DACA}
.of-band__ico{color:var(--of-oro)}
.of-band__ico svg{width:46px;height:auto;display:block;margin:0 auto 1.1rem}
.of-band__item h3{font-family:'Jost',sans-serif;font-size:.78rem;font-weight:600;
                  letter-spacing:.16em;text-transform:uppercase;color:var(--of-tinta)}
.of-band__item p{color:var(--of-gris);font-weight:300;font-size:.86rem;line-height:1.6;
                 margin:.65rem auto 0;max-width:30ch}

/* Fila de datos del salón, a lo ancho de la caja */
.of-band__datos{grid-column:1/-1;list-style:none;margin:clamp(1.6rem,3vw,2.3rem) 0 0;
                padding:clamp(1.3rem,2.4vw,1.8rem) clamp(1rem,2.4vw,2.4rem) 0;
                border-top:1px solid #E6DACA;display:flex;flex-wrap:wrap;justify-content:center;
                gap:.8rem 2.2rem;color:var(--of-gris);font-weight:300;font-size:.86rem;line-height:1.5}
.of-band__datos li{display:flex;align-items:center;gap:.55rem}
.of-band__datos svg{flex:none;width:18px;height:18px;color:var(--of-oro)}
.of-band__datos a{color:var(--of-tinta);text-decoration:none;border-bottom:1px solid transparent;
                  transition:border-color .3s,color .3s}
.of-band__datos a:hover{color:var(--of-oro);border-bottom-color:currentColor}
.of-band__exp{font-weight:500;color:var(--of-tinta)}

/* ---------- cierre: reseñas y reservar ---------- */
.of-final{background:var(--of-hero);text-align:center;
          padding:clamp(3rem,6vw,5rem) clamp(1.5rem,4vw,3.2rem)}
.of-final__inner{max-width:760px;margin:0 auto}
.of-final .of-divisor{justify-content:center}
.of-final .of-divisor span:last-child{width:150px}
.of-final__txt{color:var(--of-gris);font-weight:300;line-height:1.8;font-size:.98rem}
.of-final__txt span{color:var(--of-tinta);font-weight:500}
.of-final__acciones{display:flex;flex-wrap:wrap;justify-content:center;gap:.9rem;margin-top:1.9rem}

/* ---------- árabe: sin espaciado entre letras ---------- */
[dir=rtl] .of-hero__kicker,[dir=rtl] .of-hero__titulo,[dir=rtl] .of-hero__sub,
[dir=rtl] .of-hero__btn,[dir=rtl] .of-btn,[dir=rtl] .of-kicker,[dir=rtl] .of-sub,
[dir=rtl] .of-band__item h3{letter-spacing:0}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .of-hero{grid-template-columns:1fr}
  .of-hero__img{order:-1;min-height:0;aspect-ratio:4/3}
  .of-oferta__inner{grid-template-columns:1fr}
  .of-band__caja{grid-template-columns:1fr;gap:1.8rem}
  .of-band__item + .of-band__item{border-inline-start:none;border-top:1px solid #E6DACA;padding-top:1.8rem}
  .of-band__datos{margin-top:0;flex-direction:column;align-items:center;text-align:center}
}