/* =========================================================
   wopi – Página "REDES SOCIALES"
   Se carga después de styles.css (cabecera, pie, contacto,
   formulario, --m, .in-wrap, .caja-titulo, .like, botones,
   casos de éxito).
   ========================================================= */

/* ---------- Piezas de esta página ---------- */

/* Botón blanco con sombra dura ("Ver planes", "Saber más") */
.boton-blanco {
  display: inline-block;
  padding: calc(3 * var(--m)) calc(12 * var(--m));
  font-family: var(--font-titulos);
  font-size: max(16px, calc(15 * var(--m)));
  line-height: 1.2;
  color: var(--negro);
  text-decoration: none;
  background: var(--blanco);
  border: 2px solid var(--negro);
  box-shadow: calc(4 * var(--m)) calc(4 * var(--m)) 0 var(--negro);
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.boton-blanco:hover,
.boton-blanco:focus-visible {
  transform: translate(2px, 2px);
  box-shadow: 1px 1px 0 var(--negro);
  background: var(--celeste);
  outline: none;
}
.boton-blanco--chico { font-size: max(14px, calc(12.5 * var(--m))); padding: calc(2 * var(--m)) calc(10 * var(--m)); }

/* "Ver planes" en amarillo, para diferenciarlo de "Quiero crecer" */
.rs-hero .boton-blanco { background: var(--amarillo); }
.rs-hero .boton-blanco:hover,
.rs-hero .boton-blanco:focus-visible { background: var(--celeste); }

/* Variante verde del botón con WhatsApp */
.boton-wa--verde .boton-wa__texto { background: #25d366; }

.pastilla--blanca { background: var(--blanco); color: var(--negro); border-color: var(--blanco); }

/* "en" / "es tu" en minúscula, más chico */
.rs-en { text-transform: none; color: var(--amarillo); }
.rs-en--blanco { color: var(--blanco); }
.rs-celeste { color: var(--celeste); }

/* Títulos de sección */
.rs-h2 {
  margin: 0;
  font-family: var(--font-titulos);
  font-weight: 400;
  font-size: calc(38 * var(--m));
  line-height: 1.1;
  text-align: center;
  text-transform: uppercase;
}
.rs-h2--blanco { color: var(--blanco); text-shadow: calc(3 * var(--m)) calc(3 * var(--m)) 0 var(--negro); }

/* Grilla de feed de 3×3 (perfil del hero y comparación) */
.feed {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.2cqw;
  overflow: hidden;
  background: var(--negro);
  border: 1.2cqw solid var(--negro);
}
.feed__c {
  display: grid;
  place-items: center;
  aspect-ratio: 1;
  width: 100%;
  font-family: var(--font-titulos);
  font-size: 5.4cqw;
  line-height: 1;
  overflow: hidden;
  text-align: center;
  text-transform: uppercase;
  background: var(--c, #ccc);
}
img.feed__c { object-fit: cover; }
.feed__c--trama { background: url("../img/trama-fondo.png") center / 400% auto, var(--celeste); }
.feed__c--degrade { background: radial-gradient(circle at 100% 100%, var(--azul), var(--salmon) 75%); }
.feed--gris { gap: 1.4cqw; background: #222; border-color: #222; }
.feed--gris .feed__c {
  font-family: var(--font-texto);
  font-size: 4.6cqw;
  text-transform: none;
  color: #8a8a8a;
  background: #c9c9c9;
}
.feed--gris .feed__c:nth-child(even) { background: #e2e2e2; }
.feed--gris .feed__c:nth-child(3n+1) { background: #b3b3b3; }

/* =========================================================
   1. HERO
   ========================================================= */
.rs-hero {
  --m: calc(clamp(.75px, .0885vw, 1.7px) * .82);   /* todo el hero al 82%: entra en una pantalla */
  position: relative;
  z-index: 3;                       /* el celular baja sobre las cintas */
  background: var(--salmon) radial-gradient(ellipse 55% 95% at 100% 100%,
              var(--azul) 0%, #9a5fc4 35%, #d4568e 68%, var(--salmon) 100%);
}
.rs-hero__fondo { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.rs-hero__trama {
  position: absolute;
  left: 0; top: 0;
  width: calc(330 * var(--m));
  height: calc(150 * var(--m));
  background: url("../img/trama-fondo.png") right bottom / calc(598 * var(--m)) auto no-repeat;
  opacity: .8;
}
.rs-hero__redes {
  position: absolute;
  top: calc(16 * var(--m));
  left: calc(100% - 290 * var(--m));   /* cortado contra el borde derecho */
  margin: 0;
  font-family: var(--font-titulos);
  font-size: calc(52 * var(--m));
  line-height: calc(58 * var(--m));
  text-transform: uppercase;
  white-space: nowrap;
  color: transparent;
  -webkit-text-stroke: max(1px, calc(1.3 * var(--m))) rgba(255, 255, 255, .55);
}

.rs-hero__wrap { width: calc(1170 * var(--m)); min-height: calc(430 * var(--m)); }   /* 1170 × 0,82 = el mismo ancho que las otras páginas */

.rs-hero__texto {
  position: relative;
  z-index: 2;            /* por encima de la estrella */
  width: calc(540 * var(--m));
  padding: calc(56 * var(--m)) 0 calc(44 * var(--m)) calc(85 * var(--m));
}
.rs-etiqueta {
  display: inline-block;
  margin: 0 0 calc(22 * var(--m)) calc(6 * var(--m));
  padding: calc(3 * var(--m)) calc(10 * var(--m));
  font-size: max(10px, calc(10.5 * var(--m)));
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  background: var(--celeste);
  border: 2px solid var(--negro);
  transform: rotate(-3deg);
}
.rs-hero__titulo {
  margin: 0;
  font-family: var(--font-titulos);
  font-weight: 400;
  font-size: calc(56 * var(--m));
  line-height: .98;
  text-transform: uppercase;
  color: var(--blanco);
  text-shadow: calc(4 * var(--m)) calc(4 * var(--m)) 0 var(--negro);
}
.rs-hero__bajada {
  max-width: calc(360 * var(--m));
  margin: calc(26 * var(--m)) 0 calc(24 * var(--m));
  font-size: max(13px, calc(12.5 * var(--m)));
  font-weight: 600;
  line-height: 1.5;
  color: var(--blanco);
}
.rs-hero__botones { display: flex; flex-wrap: wrap; align-items: center; gap: calc(16 * var(--m)) calc(30 * var(--m)); }

/* --- Celular con perfil de Instagram --- */
.perfil {
  position: absolute;
  z-index: 2;
  left: calc(720 * var(--m));
  top: calc(32 * var(--m));
  width: calc(240 * var(--m));
  padding: calc(9 * var(--m));
  background: var(--negro);
  border-radius: calc(30 * var(--m));
  box-shadow: calc(10 * var(--m)) calc(10 * var(--m)) 0 rgba(0, 0, 0, .25);
  transform: rotate(5deg);
  container-type: inline-size;
}
.perfil::before {                     /* la "isla" de la cámara */
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%; top: calc(14 * var(--m));
  width: 30%; height: calc(14 * var(--m));
  margin-left: -15%;
  border-radius: 99px;
  background: var(--negro);
}
.perfil__pantalla {
  overflow: hidden;
  padding: 11cqw 4cqw 0;
  background: var(--blanco);
  border-radius: calc(22 * var(--m));
}
.perfil__cabecera { display: flex; align-items: center; gap: 3cqw; }
.perfil__avatar {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 20cqw; height: 20cqw;
  border-radius: 50%;
  background: var(--azul);
  border: 1.2cqw solid var(--salmon);
  box-shadow: 0 0 0 .8cqw var(--amarillo);
}
.perfil__avatar img { width: 76%; }
.perfil__dato { flex: 1; display: flex; flex-direction: column; align-items: center; font-size: 3.6cqw; line-height: 1.15; text-align: center; }
.perfil__dato b { font-size: 5cqw; }
.perfil__nombre { margin: 3cqw 0 .6cqw; font-size: 4.4cqw; font-weight: 700; }
.perfil__bio { margin: 0 0 3cqw; font-size: 3.6cqw; line-height: 1.35; }
.perfil__seguir {
  display: block;
  padding: 1.6cqw 0;
  font-family: var(--font-titulos);
  font-size: 4.6cqw;
  text-align: center;
  color: var(--blanco);
  background: var(--azul);
  border: .8cqw solid var(--negro);
}
.perfil__destacadas { display: flex; justify-content: space-around; margin: 4cqw 0; }
.perfil__destacadas span {
  display: grid;
  place-items: center;
  width: 15cqw; height: 15cqw;
  border-radius: 50%;
  font-family: var(--font-titulos);
  font-size: 3cqw;
  text-transform: uppercase;
  background: var(--c);
  border: .8cqw solid var(--negro);
}
.perfil .feed { margin: 0 -4cqw; border-width: 1cqw 0 0; }

/* --- Globos, avisos y estrella --- */
.rs-like { z-index: 3; }
.rs-like--1 { left: calc(668 * var(--m)); top: calc(145 * var(--m)); font-size: calc(23 * var(--m)); transform: rotate(-4deg); }
.rs-like--2 { left: calc(962 * var(--m)); top: calc(92 * var(--m));  font-size: calc(17 * var(--m)); animation-delay: -1.5s; }
.rs-like--3 { left: calc(952 * var(--m)); top: calc(335 * var(--m)); font-size: calc(19 * var(--m)); animation-delay: -3s; }

.rs-aviso {
  position: absolute;
  z-index: 3;
  left: calc(905 * var(--m));
  top: calc(222 * var(--m));
  display: flex;
  align-items: center;
  gap: calc(8 * var(--m));
  width: calc(180 * var(--m));
  margin: 0;
  padding: calc(8 * var(--m)) calc(10 * var(--m));
  font-size: max(10px, calc(9.5 * var(--m)));
  font-weight: 700;
  line-height: 1.25;
  background: var(--blanco);
  border: 2px solid var(--negro);
  box-shadow: calc(5 * var(--m)) calc(5 * var(--m)) 0 var(--negro);
  animation: aparecer 6s ease-in-out infinite;
}
.rs-aviso i {
  flex-shrink: 0;
  width: calc(20 * var(--m)); height: calc(20 * var(--m));
  border-radius: 50%;
  background: var(--amarillo);
  border: 2px solid var(--negro);
}
.rs-chat {
  position: absolute;
  z-index: 3;
  left: calc(630 * var(--m));
  top: calc(352 * var(--m));
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: calc(6 * var(--m)) calc(10 * var(--m));
  font-size: max(10px, calc(10 * var(--m)));
  line-height: 1.3;
  background: #2fd36b;
  border: 2px solid var(--negro);
  border-radius: calc(8 * var(--m)) calc(8 * var(--m)) calc(8 * var(--m)) 0;
  box-shadow: calc(4 * var(--m)) calc(4 * var(--m)) 0 var(--negro);
  animation: aparecer 6s ease-in-out infinite -3s;
}
.rs-chat small { font-size: .85em; }
@keyframes aparecer {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(calc(-6 * var(--m))); }
}
.rs-hero__estrella {
  position: absolute;
  z-index: 1;
  left: calc(560 * var(--m));
  top: calc(300 * var(--m));
  width: calc(92 * var(--m));
  animation: girar 45s linear infinite;
}

/* =========================================================
   2. CINTAS (texto que se desplaza)
   ========================================================= */
.cintas {
  position: relative;
  z-index: 2;
  height: calc(190 * var(--m));
  overflow: hidden;
  background: #0d0d0d url("../img/fondo-textura-negro.jpg") center / cover;
}
.cinta {
  position: absolute;
  left: -5%;
  width: 110%;
  overflow: hidden;
  border-top: 2px solid var(--negro);
  border-bottom: 2px solid var(--negro);
}
.cinta--amarilla { top: calc(50 * var(--m)); background: var(--amarillo); transform: rotate(3deg); }
.cinta--celeste  { top: calc(62 * var(--m)); background: var(--celeste);  transform: rotate(-3deg); }
.cinta__pista {
  display: flex;
  width: max-content;
  animation: cinta 40s linear infinite;
}
.cinta--amarilla .cinta__pista { animation-direction: reverse; }
.cinta__pista span {
  display: flex;
  align-items: center;
  padding: calc(9 * var(--m)) 0;
  font-family: var(--font-titulos);
  font-size: calc(22 * var(--m));
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}
.cinta__pista span::after {           /* estrellita negra entre palabras */
  content: "";
  width: calc(20 * var(--m));
  height: calc(20 * var(--m));
  margin: 0 calc(24 * var(--m));
  background: url("../img/estrella-negra.svg") center / contain no-repeat;
}
.cinta--amarilla .cinta__pista span { opacity: .55; }
@keyframes cinta { to { transform: translateX(-50%); } }   /* el texto está repetido: el bucle no salta */

/* =========================================================
   3. SERVICIOS
   ========================================================= */
.rs-servicios {
  padding: calc(16 * var(--m)) 20px calc(110 * var(--m));
  background: #0d0d0d url("../img/fondo-textura-negro.jpg") center / cover;
}
.rs-servicios__grilla {
  display: grid;
  grid-template-columns: repeat(3, calc(272 * var(--m)));
  justify-content: center;
  align-items: stretch;
  gap: calc(22 * var(--m));
  margin-top: calc(36 * var(--m));
}
.rs-servicio {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: calc(420 * var(--m));
  padding: calc(26 * var(--m)) calc(20 * var(--m)) calc(26 * var(--m));
  text-align: center;
  background: var(--fondo);
  border: max(2px, calc(2.5 * var(--m))) solid var(--negro);
  box-shadow: calc(10 * var(--m)) calc(10 * var(--m)) 0 rgba(0, 0, 0, .75), 0 0 0 1px rgba(255, 255, 255, .08);
  transition: transform .25s ease;
}
.rs-servicio:hover { transform: translateY(calc(-5 * var(--m))); }
.rs-servicio__titulo { width: 100%; min-height: calc(82 * var(--m)); display: flex; align-items: center; justify-content: center; font-size: calc(23 * var(--m)); padding: calc(10 * var(--m)) calc(10 * var(--m)) calc(12 * var(--m)); }
.rs-servicio__ico { width: calc(120 * var(--m)); margin: calc(26 * var(--m)) 0 calc(18 * var(--m)); }
.rs-servicio__texto {
  margin: 0 0 calc(22 * var(--m));
  font-size: max(13px, calc(12.5 * var(--m)));
  font-weight: 700;
  line-height: 1.45;
}
.rs-servicio .boton-blanco { margin-top: auto; }

/* =========================================================
   4. NUESTRO MÉTODO
   ========================================================= */
.rs-metodo {
  position: relative;
  padding: calc(10 * var(--m)) 20px calc(56 * var(--m));
  background: var(--amarillo);
}
.rs-metodo__ola {
  position: absolute;
  left: 0; bottom: calc(100% - 1px);
  width: 100%;
  height: calc(60 * var(--m));
}
.rs-metodo__grilla {
  display: grid;
  grid-template-columns: repeat(3, calc(262 * var(--m)));
  justify-content: center;
  gap: calc(34 * var(--m));
  margin-top: calc(34 * var(--m));
}
.rs-metodo__item { text-align: center; }
.rs-metodo__caja { font-size: calc(20 * var(--m)); padding: calc(14 * var(--m)) calc(10 * var(--m)) calc(16 * var(--m)); }
.rs-metodo__sin-ia {
  display: inline-block;
  margin-bottom: calc(6 * var(--m));
  padding: calc(2 * var(--m)) calc(8 * var(--m));
  font-family: var(--font-titulos);
  font-weight: 400;
  font-size: 1.08em;
  text-transform: uppercase;
  color: var(--amarillo);
  background: var(--negro);
  transform: rotate(-2deg);
}
.rs-metodo__item p {
  max-width: calc(230 * var(--m));
  margin: calc(24 * var(--m)) auto 0;
  font-size: max(13px, calc(12.5 * var(--m)));
  font-weight: 700;
  line-height: 1.45;
}

/* =========================================================
   5. TU FEED ES TU VIDRIERA
   ========================================================= */
.rs-vidriera {
  padding: calc(50 * var(--m)) 20px calc(46 * var(--m));
  background: #0d0d0d url("../img/fondo-textura-negro.jpg") center / cover;
  color: var(--blanco);
  text-align: center;
}
.rs-vidriera__sub, .rs-vidriera__nota {
  margin: calc(12 * var(--m)) 0 0;
  font-size: max(12px, calc(11 * var(--m)));
  font-weight: 600;
}
.rs-vidriera__nota { margin-top: calc(38 * var(--m)); }

.rs-vidriera__comparar {
  display: grid;
  grid-template-columns: calc(215 * var(--m)) calc(190 * var(--m)) calc(215 * var(--m));
  justify-content: center;
  align-items: center;
  margin-top: calc(44 * var(--m));
}
.rs-cel { position: relative; margin: 0; display: flex; flex-direction: column; align-items: center; container-type: inline-size; }
.rs-cel__marco {
  width: 100%;
  padding: 7cqw 7cqw 8cqw;
  background: var(--blanco);
  border: 2.8cqw solid var(--negro);
  border-radius: 10cqw;
  box-shadow: 0 0 0 1.6cqw var(--blanco);
  color: var(--negro);
}
.rs-cel__usuario {
  display: flex;
  align-items: center;
  gap: 3cqw;
  margin: 0 0 5cqw;
  font-size: 5cqw;
  font-weight: 700;
  text-align: left;
}
.rs-cel__usuario > i {
  display: grid;
  place-items: center;
  width: 11cqw; height: 11cqw;
  border-radius: 50%;
  background: #ccc;
}
.rs-cel__avatar { background: var(--azul) !important; border: .8cqw solid var(--salmon); }
.rs-cel__avatar img { width: 78%; }
.rs-cel .feed__c { font-size: 5.8cqw; }
.rs-cel .feed--gris .feed__c { font-size: 5cqw; }
.rs-cel .pastilla { margin-top: calc(18 * var(--m)); text-transform: uppercase; }
.rs-cel .pastilla:not(.pastilla--blanca) { color: var(--blanco); border-color: var(--blanco); }

.rs-vidriera__flecha { justify-self: center; width: calc(80 * var(--m)); animation: empujar 2s ease-in-out infinite; }
@keyframes empujar { 50% { transform: translateX(calc(8 * var(--m))); } }
.rs-vidriera__warning {
  position: absolute;
  left: calc(-110 * var(--m));
  bottom: calc(40 * var(--m));
  width: calc(90 * var(--m));
  transform-origin: 50% 100%;
  animation: sacudir 4s ease-in-out infinite;
}
@keyframes sacudir {
  0%, 84%, 100% { transform: rotate(0deg); }
  88% { transform: rotate(-6deg); }
  92% { transform: rotate(6deg); }
  96% { transform: rotate(-3deg); }
}
.rs-vidriera__crece {
  position: absolute;
  right: calc(-130 * var(--m));
  top: calc(70 * var(--m));
  width: calc(125 * var(--m));
  animation: flotar 6s ease-in-out infinite;
}

/* =========================================================
   6. PLANES
   ========================================================= */
.rs-planes {
  padding: calc(55 * var(--m)) 20px calc(58 * var(--m));
  text-align: center;
  background: url("../img/trama-fondo.png") center / calc(598 * var(--m)) auto, var(--celeste);
}
.rs-planes__titulo {
  margin: 0;
  font-family: var(--font-titulos);
  font-weight: 400;
  font-size: calc(36 * var(--m));
  text-transform: uppercase;
  color: var(--blanco);
  text-shadow: calc(3 * var(--m)) calc(3 * var(--m)) 0 var(--negro);
}
.rs-planes__sub, .rs-planes__nota {
  margin: calc(8 * var(--m)) 0 0;
  font-size: max(12px, calc(11.5 * var(--m)));
  font-weight: 700;
}
.rs-planes__nota { margin-top: calc(36 * var(--m)); }
.rs-planes__nota a { color: inherit; }

.rs-planes__grilla {
  display: grid;
  grid-template-columns: repeat(3, calc(238 * var(--m)));
  justify-content: center;
  align-items: start;
  gap: calc(28 * var(--m));
  margin-top: calc(46 * var(--m));
}
.plan-rs {
  position: relative;
  display: flex;
  flex-direction: column;
  text-align: left;
  background: var(--blanco);
  border: max(2px, calc(2.5 * var(--m))) solid var(--negro);
  box-shadow: calc(8 * var(--m)) calc(8 * var(--m)) 0 var(--negro);
  transition: transform .25s ease;
}
.plan-rs:hover { transform: translateY(calc(-5 * var(--m))); }
.plan-rs--crece { margin-top: calc(-16 * var(--m)); }
.plan-rs__cabecera {
  padding: calc(14 * var(--m)) calc(10 * var(--m)) calc(12 * var(--m));
  text-align: center;
  border-bottom: max(2px, calc(2.5 * var(--m))) solid var(--negro);
}
.plan-rs__cabecera h3 {
  margin: 0;
  font-family: var(--font-titulos);
  font-weight: 400;
  font-size: calc(25 * var(--m));
  text-transform: uppercase;
}
.plan-rs__cabecera p { margin: calc(4 * var(--m)) 0 0; font-size: max(10px, calc(9.5 * var(--m))); font-weight: 700; }
.plan-rs--arranque .plan-rs__cabecera { background: var(--amarillo); }
.plan-rs--crece .plan-rs__cabecera {
  padding-top: calc(22 * var(--m));
  color: var(--blanco);
  background: radial-gradient(ellipse 80% 140% at 100% 100%, var(--azul), #b25aa8 45%, var(--salmon) 80%);
}
.plan-rs--crece .plan-rs__cabecera h3 { font-size: calc(30 * var(--m)); text-shadow: calc(2 * var(--m)) calc(2 * var(--m)) 0 var(--negro); }
.plan-rs--full .plan-rs__cabecera { background: var(--negro); color: var(--celeste); }

.plan-rs__lista {
  padding: calc(16 * var(--m)) calc(18 * var(--m)) 0;
  font-size: max(12px, calc(10.5 * var(--m)));
  font-weight: 600;
  line-height: 2;
}
.plan-rs__lista li { position: relative; padding-left: calc(16 * var(--m)); }
.plan-rs__lista li::before {
  content: "";
  position: absolute;
  left: 0; top: 50%;
  width: calc(9 * var(--m));
  height: max(2px, calc(2.5 * var(--m)));
  margin-top: -1px;
  background: var(--negro);
}
.plan-rs__boton { margin: calc(16 * var(--m)) calc(16 * var(--m)) calc(18 * var(--m)); align-self: flex-start; }

.plan-rs__elegido {
  position: absolute;
  right: calc(-36 * var(--m));
  top: calc(-34 * var(--m));
  display: grid;
  place-items: center;
  width: calc(88 * var(--m));
  aspect-ratio: 1;
  margin: 0;
  background: url("../img/estrella-negra.svg") center / contain no-repeat;
  animation: latir 3s ease-in-out infinite;
}
.plan-rs__elegido span {
  font-family: var(--font-titulos);
  font-size: calc(11 * var(--m));
  line-height: 1.05;
  text-align: center;
  color: var(--amarillo);
  transform: rotate(12deg);
}
@keyframes latir {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.06); }
}

/* =========================================================
   MÓVIL Y TABLET CHICA (≤ 820px)
   ========================================================= */
@media (max-width: 820px) {
  .in-wrap { width: 100%; }

  /* 1. Hero: texto arriba, celular abajo */
  .rs-hero__wrap { min-height: 0; padding-bottom: 40px; }
  .rs-hero__texto { width: auto; padding: 40px 20px 0; text-align: center; }
  .rs-etiqueta { font-size: 11px; padding: 4px 10px; margin: 0 0 22px; }
  .rs-hero__titulo { font-size: min(52px, 13.5vw); text-shadow: 4px 4px 0 var(--negro); }
  .rs-hero__bajada { max-width: 420px; margin: 22px auto 24px; font-size: 14px; }
  .rs-hero__botones { justify-content: center; gap: 16px 22px; }
  .boton-wa--chico { --bw-fs: 18px; --bw-alto: calc(18px * 1.2 + 10px); gap: 8px; }
  .boton-wa--chico .boton-wa__texto { padding: 3px 12px; box-shadow: 4px 4px 0 var(--negro); }
  .boton-blanco { font-size: 18px; padding: 3px 14px; box-shadow: 4px 4px 0 var(--negro); }
  .rs-hero__redes { top: auto; bottom: 120px; left: calc(100% - 140px); font-size: 52px; line-height: 56px; }

  .perfil {
    position: relative;
    left: auto; top: auto;
    width: min(260px, 70vw);
    margin: 60px auto -110px;
    padding: 9px;
    border-radius: 32px;
    box-shadow: 10px 10px 0 rgba(0, 0, 0, .25);
  }
  .perfil::before { top: 14px; height: 14px; }
  .perfil__pantalla { border-radius: 24px; }
  .rs-like--1 { left: 4%;  top: auto; bottom: 330px; font-size: 22px; }
  .rs-like--2 { left: auto; right: 4%; top: auto; bottom: 420px; font-size: 17px; }
  .rs-like--3 { left: auto; right: 3%; top: auto; bottom: 170px; font-size: 19px; }
  .rs-aviso { left: auto; right: 2%; top: auto; bottom: 260px; width: 150px; font-size: 10px; padding: 7px 8px; box-shadow: 4px 4px 0 var(--negro); }
  .rs-aviso i { width: 18px; height: 18px; }
  .rs-chat { left: 2%; top: auto; bottom: 120px; font-size: 11px; padding: 6px 9px; }
  .rs-hero__estrella { left: -30px; top: auto; bottom: 200px; width: 80px; }

  /* 2. Cintas */
  .cintas { height: 160px; }
  .cinta--amarilla { top: 62px; }
  .cinta--celeste  { top: 74px; }
  .cinta__pista span { font-size: 18px; padding: 8px 0; }
  .cinta__pista span::after { width: 16px; height: 16px; margin: 0 18px; }

  /* 3. Servicios */
  .rs-h2 { font-size: min(34px, 9vw); }
  .rs-h2--blanco { text-shadow: 3px 3px 0 var(--negro); }
  .rs-servicios { padding: 30px 20px 100px; }
  .rs-servicios__grilla { grid-template-columns: min(340px, 100%); gap: 32px; margin-top: 30px; }
  .rs-servicio { min-height: 0; padding: 24px 20px 26px; box-shadow: 8px 8px 0 rgba(0, 0, 0, .75), 0 0 0 1px rgba(255, 255, 255, .08); }
  .rs-servicio__titulo { min-height: 0; font-size: 22px; padding: 10px 12px 12px; }
  .rs-servicio__ico { width: 120px; margin: 24px 0 16px; }
  .rs-servicio__texto { font-size: 14px; margin-bottom: 20px; }
  .boton-blanco--chico { font-size: 16px; padding: 3px 12px; }

  /* 4. Método */
  .rs-metodo { padding: 10px 20px 52px; }
  .rs-metodo__ola { height: 40px; }
  .rs-metodo__grilla { grid-template-columns: min(320px, 100%); gap: 34px; margin-top: 28px; }
  .rs-metodo__caja { font-size: 20px; padding: 12px 10px 14px; box-shadow: 6px 6px 0 var(--negro); }
  .rs-metodo__item p { max-width: 300px; margin-top: 16px; font-size: 14px; }

  /* 5. Vidriera */
  .rs-vidriera { padding: 50px 20px 46px; }
  .rs-vidriera__sub, .rs-vidriera__nota { font-size: 13px; }
  .rs-vidriera__comparar { grid-template-columns: min(230px, 70vw); gap: 26px; margin-top: 40px; }
  .rs-vidriera__flecha { width: 60px; transform: rotate(90deg); animation: none; }
  .rs-cel .pastilla { margin-top: 18px; }
  .rs-vidriera__warning { left: -72px; bottom: 60px; width: 72px; }
  .rs-vidriera__crece { right: -70px; top: -24px; width: 104px; }

  /* 6. Planes */
  .rs-planes { padding: 50px 20px 56px; background-size: 598px auto; }
  .rs-planes__titulo { font-size: min(32px, 8.4vw); text-shadow: 3px 3px 0 var(--negro); }
  .rs-planes__sub, .rs-planes__nota { font-size: 13px; }
  .rs-planes__grilla { grid-template-columns: min(320px, 100%); gap: 40px; margin-top: 50px; }
  .plan-rs { box-shadow: 7px 7px 0 var(--negro); }
  .plan-rs--crece { margin-top: 0; }
  .plan-rs__cabecera { padding: 14px 10px 12px; }
  .plan-rs--crece .plan-rs__cabecera { padding-top: 16px; }
  .plan-rs__cabecera h3 { font-size: 26px; }
  .plan-rs--crece .plan-rs__cabecera h3 { font-size: 30px; text-shadow: 2px 2px 0 var(--negro); }
  .plan-rs__cabecera p { font-size: 12px; }
  .plan-rs__lista { padding: 16px 20px 0; font-size: 14px; line-height: 1.9; }
  .plan-rs__lista li { padding-left: 18px; }
  .plan-rs__lista li::before { width: 10px; height: 2px; }
  .plan-rs__boton { margin: 16px 20px 20px; }
  .plan-rs__elegido { width: 82px; right: -16px; top: -40px; }
  .plan-rs__elegido span { font-size: 11px; }
}