/* ============================================================
   REDISEÑO de la portada (index.html) — capa nueva sobre styles.css + polish.css.
   No modifica ni una regla de esos dos archivos: todo lo de aquí usa
   clases con prefijo rd- para no chocar con nada existente ni con
   otras páginas del sitio (este archivo solo lo carga index.html).
   ============================================================ */

.rd-body{ font-family:"Plus Jakarta Sans",Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.rd-body h1,.rd-body h2,.rd-body h3{ letter-spacing:-.02em; }

/* ---------- Botones (solo dentro de esta página, no toca .btn global) ---------- */
.rd-body .btn-gold{
  background:linear-gradient(155deg,#e9c25a,var(--gold) 55%,var(--gold-dark));
  box-shadow:0 12px 26px rgba(173,129,16,.32), inset 0 1px 0 rgba(255,255,255,.4);
}
.rd-body .btn-gold svg{ width:16px; height:16px; margin-left:2px; transition:transform .18s ease; }
.rd-body .btn-gold:hover svg{ transform:translateX(4px); }
.rd-body .btn-light{ border-color:#cfe4dd; }
.rd-body .btn-light svg{ color:var(--green); }
.rd-body .btn-light:hover{ border-color:var(--green); background:#eefaf3; }

/* Header: ver site-header.css (compartido con todas las páginas). */

/* ---------- Hero ---------- */
.rd-hero{
  padding:56px 0 64px;
  background:
    radial-gradient(640px 420px at 8% 15%, rgba(18,63,73,.05), transparent 60%),
    radial-gradient(circle, rgba(18,63,73,.08) 1.4px, transparent 1.4px) 0 0/26px 26px;
  background-color:var(--white);
}
.rd-hero-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:52px; align-items:center; }
.rd-eyebrow{ display:inline-flex; align-items:center; gap:8px; color:var(--gold-dark); font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; margin-bottom:14px; }
.rd-eyebrow::before{ content:""; width:22px; height:2px; background:var(--gold); border-radius:2px; }
.rd-hero-copy h1{ margin:0 0 18px; font-size:clamp(2.1rem,4vw,3.1rem); line-height:1.12; color:var(--petrol); }
.rd-hero-copy p{ margin:0 0 26px; color:var(--muted); font-size:1.08rem; max-width:52ch; }
.rd-hero-actions{ display:flex; gap:14px; flex-wrap:wrap; }
.rd-hero-indicators{ list-style:none; display:flex; flex-wrap:wrap; gap:10px 22px; margin:30px 0 0; padding:0; font-size:.86rem; color:var(--muted); font-weight:600; }
.rd-hero-indicators li{ position:relative; padding-left:16px; }
.rd-hero-indicators li::before{ content:""; position:absolute; left:0; top:.5em; width:6px; height:6px; border-radius:50%; background:var(--gold); }
.rd-hero-media{ position:relative; }
.rd-hero-media img{ width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; border-radius:18px; box-shadow:var(--shadow); }
.rd-hero-tag{
  position:absolute; left:20px; bottom:20px; display:flex; align-items:center; gap:10px;
  background:rgba(255,255,255,.96); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  border-radius:14px; padding:10px 16px 10px 12px; box-shadow:var(--shadow);
  max-width:calc(100% - 40px);
}
.rd-hero-tag svg{ width:20px; height:20px; flex:none; color:var(--gold-dark); }
.rd-hero-tag strong{ display:block; color:var(--petrol); font-size:.86rem; line-height:1.2; }
.rd-hero-tag span{ display:block; color:var(--muted); font-size:.76rem; line-height:1.2; }

@media (max-width:900px){
  .rd-hero{ padding:28px 0 32px; }
  .rd-hero-grid{ grid-template-columns:1fr; gap:22px; }
  .rd-hero-media{ order:-1; }
  .rd-hero-media img{ aspect-ratio:16/9; border-radius:14px; }
  .rd-hero-copy p{ font-size:.96rem; }
  .rd-hero-indicators{ margin-top:18px; gap:8px 18px; }
  .rd-hero-tag{ left:12px; bottom:12px; padding:8px 12px 8px 10px; }
  .rd-hero-tag strong{ font-size:.8rem; }
  .rd-hero-tag span{ font-size:.7rem; }
}

/* ---------- Franja de confianza ---------- */
.rd-trust{ background:var(--soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:26px 0; }
.rd-trust-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
.rd-trust-grid > div{ display:flex; align-items:center; gap:11px; font-size:.82rem; font-weight:700; color:var(--petrol); }
.rd-trust-grid svg{
  width:36px; height:36px; padding:8px; box-sizing:border-box; color:var(--gold-dark); flex-shrink:0;
  background:#fff; border:1px solid var(--line); border-radius:50%; box-shadow:0 4px 10px rgba(18,63,73,.06);
}
@media (max-width:900px){ .rd-trust-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:430px){ .rd-trust-grid{ grid-template-columns:1fr; } }

/* ---------- Secciones genéricas ---------- */
.rd-section{ padding:76px 0; }
.rd-section-soft{
  background:
    radial-gradient(520px 320px at 92% 0%, rgba(215,170,40,.07), transparent 60%),
    radial-gradient(circle, rgba(18,63,73,.06) 1.4px, transparent 1.4px) 0 0/26px 26px,
    var(--soft);
}
.rd-section-head{ max-width:640px; margin:0 auto 40px; text-align:center; }
.rd-section-head h2{ margin:0 0 8px; color:var(--petrol); font-size:clamp(1.8rem,3.4vw,2.5rem); }
.rd-section-head p{ margin:0; color:var(--muted); }
.rd-section-head::before{ content:""; display:block; width:36px; height:3px; margin:0 auto 16px; border-radius:2px; background:var(--gold); }

/* ---------- Soluciones ---------- */
.rd-solutions{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.rd-solution{ border:1px solid var(--line); border-radius:16px; overflow:hidden; background:white; display:flex; flex-direction:column; }
.rd-solution img{ width:100%; height:270px; object-fit:cover; object-position:center 22%; }
.rd-solution-body{ padding:24px; display:flex; flex-direction:column; gap:10px; flex:1; }
.rd-solution-body h3{ margin:0; color:var(--petrol); font-size:1.22rem; }
.rd-solution-body p{ margin:0; color:var(--muted); font-size:.9rem; }
.rd-solution-body ul{ margin:4px 0 0; padding-left:18px; color:#4f686e; font-size:.85rem; display:grid; gap:4px; }
.rd-link{ display:inline-flex; align-items:center; gap:6px; margin-top:auto; padding-top:14px; color:var(--petrol-2); font-weight:800; font-size:.88rem; }
.rd-link svg{ width:15px; height:15px; transition:transform .15s ease; }
.rd-link:hover svg{ transform:translateX(3px); }
@media (max-width:900px){ .rd-solutions{ grid-template-columns:1fr; } }

/* ---------- Proceso 4 pasos ---------- */
.rd-process{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.rd-process-step{
  position:relative; text-align:center; padding:28px 16px; background:#fff;
  border:1px solid var(--line); border-radius:16px;
}
.rd-process-step:not(:last-child)::after{
  content:""; position:absolute; top:44px; left:100%; width:18px; height:2px; background:var(--line);
}
.rd-process-step span{ display:grid; place-items:center; width:40px; height:40px; margin:0 auto 14px; border-radius:50%; background:var(--petrol); color:#fff; font-weight:800; }
.rd-process-step h3{ margin:0 0 6px; color:var(--petrol); font-size:1.02rem; }
.rd-process-step p{ margin:0; color:var(--muted); font-size:.85rem; }
@media (max-width:900px){ .rd-process{ grid-template-columns:repeat(2,1fr); } .rd-process-step::after{ display:none; } }
@media (max-width:430px){ .rd-process{ grid-template-columns:1fr; } }

/* ---------- Operaciones reales ---------- */
.rd-operations{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.rd-operations figure{ margin:0; position:relative; border-radius:16px; overflow:hidden; aspect-ratio:4/3; box-shadow:0 10px 28px rgba(18,63,73,.12); }
.rd-operations img{ width:100%; height:100%; object-fit:cover; object-position:center 25%; transition:transform .4s ease; }
.rd-operations figure:hover img{ transform:scale(1.04); }
.rd-operations figcaption{
  position:absolute; inset:auto 0 0 0; padding:34px 16px 14px; font-size:.92rem; font-weight:700; color:#fff;
  background:linear-gradient(transparent,rgba(6,29,35,.88));
}
@media (max-width:900px){ .rd-operations{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:430px){ .rd-operations{ grid-template-columns:1fr; } }

/* ---------- Alan Chelme ---------- */
.rd-alan{ padding:76px 0; }
.rd-alan-grid{ display:grid; grid-template-columns:.6fr 1fr; gap:44px; align-items:center; }
.rd-alan-grid img{ width:100%; height:100%; max-height:420px; object-fit:cover; object-position:center top; border-radius:16px; }
.rd-alan-grid h2{ margin:6px 0 14px; color:var(--petrol); font-size:clamp(1.7rem,3vw,2.2rem); }
.rd-alan-grid p{ margin:0 0 20px; color:var(--muted); max-width:56ch; }
.rd-alan-points{ list-style:none; margin:0 0 24px; padding:0; display:grid; gap:12px; max-width:48ch; }
.rd-alan-points li{ display:flex; align-items:flex-start; gap:10px; }
.rd-alan-points svg{ width:18px; height:18px; margin-top:2px; color:#fff; background:var(--petrol-2); border-radius:50%; padding:3px; box-sizing:border-box; flex-shrink:0; }
.rd-alan-points span{ color:var(--ink); font-size:.92rem; }
@media (max-width:900px){ .rd-alan-grid{ grid-template-columns:1fr; } .rd-alan-grid img{ max-height:280px; } }

/* ---------- Explicación de la cotización ---------- */
.rd-quote-explain{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-bottom:34px; }
.rd-quote-explain > div{ display:flex; gap:12px; align-items:flex-start; }
.rd-quote-explain svg{ width:22px; height:22px; color:var(--gold-dark); flex-shrink:0; margin-top:2px; }
.rd-quote-explain strong{ display:block; color:var(--petrol); font-size:.9rem; margin-bottom:3px; }
.rd-quote-explain span{ color:var(--muted); font-size:.82rem; }
@media (max-width:900px){ .rd-quote-explain{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:430px){ .rd-quote-explain{ grid-template-columns:1fr; } }

/* ---------- CTA final ---------- */
.rd-cta-final{ padding:80px 0; background:linear-gradient(145deg,#092d35,#123f49); color:#fff; text-align:center; }
.rd-cta-final h2{ margin:0 0 12px; font-size:clamp(1.8rem,3.4vw,2.5rem); }
.rd-cta-final p{ margin:0 0 28px; color:rgba(255,255,255,.75); max-width:56ch; margin-left:auto; margin-right:auto; }
.rd-cta-final .rd-hero-actions{ justify-content:center; }

/* ---------- Footer ---------- */
.rd-footer{ padding:56px 0 100px; background:var(--petrol-3); color:rgba(255,255,255,.8); }
.rd-footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:32px; }
.rd-footer-brand img{ height:30px; margin-bottom:14px; }
.rd-footer-brand p{ margin:0 0 16px; font-size:.86rem; color:rgba(255,255,255,.62); max-width:36ch; }
.rd-footer .footer-social a{ background:rgba(255,255,255,.1); }
.rd-footer-grid > div:not(.rd-footer-brand){ display:flex; flex-direction:column; gap:10px; font-size:.86rem; }
.rd-footer-grid strong{ color:#fff; font-size:.78rem; text-transform:uppercase; letter-spacing:.06em; margin-bottom:4px; }
.rd-footer-grid a,.rd-footer-grid span{ color:rgba(255,255,255,.7); }
.rd-footer-grid a:hover{ color:var(--gold); }
@media (max-width:900px){ .rd-footer-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:430px){ .rd-footer-grid{ grid-template-columns:1fr; } }

/* ---------- Movimiento respetuoso ---------- */
@media (prefers-reduced-motion:reduce){
  .rd-nav,.rd-link svg{ transition:none !important; }
}

/* ============ Ronda de diseño: botones limpios + hero oscuro ============ */
.rd-body .btn{ min-height:52px; padding:14px 26px; font-size:1rem; font-weight:800; letter-spacing:-.005em; }
.rd-body .btn-gold{
  background:#f2b91f; color:#14282d; border:0;
  box-shadow:0 10px 24px rgba(242,185,31,.38);
}
.rd-body .btn-gold:hover{ background:#ffc934; box-shadow:0 14px 30px rgba(242,185,31,.5); }
.rd-body .btn-light{ background:#25d366; color:#fff; border:0; box-shadow:0 10px 24px rgba(37,211,102,.3); }
.rd-body .btn-light svg{ color:#fff; }
.rd-body .btn-light:hover{ background:#1fbd5a; border:0; }
.rd-header .btn-gold{ background:#f2b91f; box-shadow:0 8px 20px rgba(242,185,31,.35); }
.rd-nav-cta{ min-height:44px !important; padding:10px 20px !important; font-size:.92rem !important; }

.rd-hero{
  background:
    radial-gradient(720px 480px at 12% 20%, rgba(215,170,40,.16), transparent 62%),
    radial-gradient(circle, rgba(255,255,255,.07) 1.4px, transparent 1.4px) 0 0/26px 26px,
    linear-gradient(135deg,#0a2e35,#123f49 60%,#1d5b66);
  background-color:#123f49;
}
.rd-hero-copy h1{ color:#fff; }
.rd-hero-copy p{ color:rgba(255,255,255,.82); }
.rd-hero .rd-eyebrow{ color:#f2b91f; }
.rd-hero-indicators{ color:rgba(255,255,255,.85); }
.rd-hero-media img{ box-shadow:0 30px 70px rgba(0,0,0,.4); border:3px solid rgba(255,255,255,.14); }
.rd-hero-tag{ border:2px solid #f2b91f; }
.rd-solution:nth-child(3) img{ object-position:center 88%; }
.rd-solution:nth-child(2) img{ object-position:center 40%; }
@media (max-width:900px){
  .rd-hero-media img{ object-position:center 66%; }
  .rd-hero-tag{ bottom:auto; top:12px; }
}

/* ---------- Ruta interactiva de la carga: carta de puntos ---------- */
.rd-route{ max-width:1100px; margin:0 auto; padding:0 0 22px; border-radius:24px; background:#0c2c33; box-shadow:0 24px 60px rgba(10,46,53,.28); overflow:hidden; }
.rd-route-bar{ display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; padding:14px 22px; border-bottom:1px solid rgba(255,255,255,.08); font-family:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.74rem; letter-spacing:.08em; text-transform:uppercase; color:#8fb3ba; }
.rd-route-bar span:last-child{ color:#f2c94c; }
.rd-route-map{ display:block; width:100%; height:auto; }
.rd-grat path{ stroke:rgba(143,179,186,.14); stroke-width:1; fill:none; }
.rd-grat-lab text{ fill:#6f969d; font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:11px; }
.rd-dots{ fill:none; stroke:#2f6571; stroke-width:4; stroke-linecap:round; }
.rd-route-base{ fill:none; stroke:rgba(143,179,186,.45); stroke-width:2; stroke-dasharray:2 7; stroke-linecap:round; }
.rd-route-progress{ fill:none; stroke:#f2b91f; stroke-width:2.6; stroke-linecap:round; filter:drop-shadow(0 0 4px rgba(242,185,31,.55)); }
.rd-stop{ cursor:pointer; outline:none; }
.rd-stop circle{ fill:#0c2c33; stroke:#8fb3ba; stroke-width:2; transition:fill .3s ease, stroke .3s ease; }
.rd-stop text{ fill:#cfe0e3; font-size:13px; font-weight:700; paint-order:stroke; stroke:#0c2c33; stroke-width:4px; stroke-linejoin:round; }
.rd-stop.is-reached circle{ stroke:#f2b91f; fill:#f2b91f; }
.rd-stop.is-active circle{ fill:#fff; stroke:#f2b91f; stroke-width:3; }
.rd-stop.is-active text{ fill:#f2c94c; }
.rd-stop:hover circle,.rd-stop:focus-visible circle{ stroke:#fff; }
.rd-stop:focus-visible text{ text-decoration:underline; }
.rd-route-stops{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:0; margin:0 22px; border-top:1px solid rgba(255,255,255,.08); }
.rd-route-stops button{ position:relative; display:flex; flex-direction:column; gap:2px; padding:14px 10px 12px; border:0; border-top:3px solid transparent; margin-top:-2px; background:none; color:#cfe0e3; font:inherit; font-size:.86rem; font-weight:700; text-align:left; cursor:pointer; transition:color .18s ease, border-color .18s ease; }
.rd-route-stops button small{ font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:.68rem; font-weight:500; letter-spacing:.06em; color:#7fa2a9; }
.rd-route-stops button:hover{ color:#fff; }
.rd-route-stops button.is-active{ color:#fff; border-top-color:#f2b91f; }
.rd-route-stops button.is-active small{ color:#f2c94c; }
.rd-route-stops button:focus-visible{ outline:2px solid #f2b91f; outline-offset:-2px; }
.rd-route-card{ margin:6px 22px 0; padding:18px 22px; border-radius:16px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); text-align:left; }
.rd-route-card.is-swap{ animation:rdSwap .35s ease; }
@keyframes rdSwap{ from{ transform:translateY(6px); } to{ transform:none; } }
.rd-route-when{ display:inline-block; margin-bottom:8px; padding:4px 10px; border-radius:6px; background:rgba(242,185,31,.14); color:#f2c94c; font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; }
.rd-route-card h3{ margin:0 0 6px; color:#fff; font-size:1.2rem; }
.rd-route-card p{ margin:0; color:#b5cbcf; max-width:70ch; }
.rd-route-actions{ display:flex; flex-wrap:wrap; justify-content:flex-start; gap:12px; margin:18px 22px 0; }
.rd-route .rd-btn-outline{ background:transparent; color:#fff; border-color:rgba(255,255,255,.5); }
.rd-route .rd-btn-outline:hover{ background:#fff; color:#0c2c33; }
@media (max-width:760px){
  .rd-route{ border-radius:18px; }
  .rd-grat-lab,.rd-stop text{ display:none; }
  .rd-dots{ stroke-width:5; }
  .rd-route-stops{ grid-template-columns:repeat(3,minmax(0,1fr)); margin:0 12px; }
  .rd-route-card{ margin:6px 12px 0; padding:16px; }
  .rd-route-actions{ margin:16px 12px 0; }
  .rd-route-bar{ padding:12px 14px; font-size:.66rem; }
}
@media (prefers-reduced-motion:reduce){ .rd-route-card.is-swap{ animation:none; } }

/* ---------- Contenedor que se llena (calculadora) ---------- */
.rd-fill{ margin:18px 0 4px; }
.rd-fill[hidden]{ display:none; }
.rd-fill-head{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin-bottom:8px; color:var(--petrol); font-size:.86rem; font-weight:700; }
.rd-fill-head b{ font-size:1.05rem; font-variant-numeric:tabular-nums; }
.rd-fill-box{ position:relative; height:78px; border:3px solid #123f49; border-radius:8px; overflow:hidden;
  background:repeating-linear-gradient(90deg,#f4f8f8 0 15px,#e3ecec 15px 18px); }
.rd-fill-bar{ position:absolute; inset:0 auto 0 0; width:0;
  background:repeating-linear-gradient(90deg,transparent 0 24px,rgba(18,63,73,.35) 24px 26px),repeating-linear-gradient(0deg,#f2b91f 0 24px,#d69c0c 24px 26px);
  transition:width .9s cubic-bezier(.22,1,.36,1); box-shadow:4px 0 0 rgba(18,63,73,.25); }
.rd-fill.is-fcl .rd-fill-bar{ background:repeating-linear-gradient(90deg,transparent 0 24px,rgba(255,255,255,.25) 24px 26px),repeating-linear-gradient(0deg,#1d5b66 0 24px,#164a54 24px 26px); }
.rd-fill-door{ position:absolute; right:0; top:0; bottom:0; width:12px; background:repeating-linear-gradient(0deg,#123f49 0 6px,#1d5b66 6px 12px); }
.rd-fill-note{ margin:10px 0 0; color:var(--muted); font-size:.86rem; }
@media (prefers-reduced-motion:reduce){ .rd-fill-bar{ transition:none; } }

/* ---------- Tarjetas de soluciones: un poco de vida al pasar el mouse ---------- */
.rd-solution{ transition:transform .25s ease, box-shadow .25s ease; }
.rd-solution img{ transition:transform .5s ease; }
.rd-solution:hover{ transform:translateY(-4px); box-shadow:0 18px 40px rgba(18,63,73,.14); }
.rd-solution:hover img{ transform:scale(1.04); }
@media (prefers-reduced-motion:reduce){ .rd-solution,.rd-solution img{ transition:none; } .rd-solution:hover,.rd-solution:hover img{ transform:none; } }
.rd-body .rd-btn-outline{ background:#fff; color:var(--petrol); border:1.5px solid var(--petrol); box-shadow:none; }
.rd-body .rd-btn-outline:hover{ background:var(--petrol); color:#fff; }

/* ============================================================
   PORTADA v2 (septiembre 2026) — prefijo rd2-
   Hero oscuro con foto real, panel de cotización superpuesto
   y selector por caso. Paleta: teal #17363F/#274F5B, dorado #DAAD2B.
   ============================================================ */
.rd-body{ --rd2-ink:#17363F; --rd2-teal:#274F5B; --rd2-gold:#DAAD2B; --rd2-paper:#F5F3EE; --rd2-line:#E2DED4; --rd2-muted:#5E6B6E; background:var(--rd2-paper); }
.rd2-kicker,.rd2-route-label,.rd2-ref,.rd2-case-tag{ font-family:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace; }
.rd2-kicker{ display:block; font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:#7A5B00; }

.rd2-hero{ position:relative; overflow:hidden; background:var(--rd2-ink); color:#fff; min-height:640px; }
.rd2-hero-media{ position:absolute; top:0; right:0; bottom:0; width:48%; }
.rd2-hero-media img{ width:100%; height:100%; object-fit:cover; object-position:center 35%; display:block; }
.rd2-hero-media::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg,var(--rd2-ink) 0%,rgba(23,54,63,.4) 38%,rgba(23,54,63,0) 70%); }
.rd2-hero-tag{ position:absolute; z-index:2; right:32px; bottom:150px; display:flex; gap:10px; align-items:center; padding:10px 14px; border-radius:12px; background:rgba(255,255,255,.94); color:var(--rd2-ink); }
.rd2-hero-tag svg{ width:18px; height:18px; fill:none; stroke:var(--rd2-teal); stroke-width:2; }
.rd2-hero-tag strong{ display:block; font-size:.9rem; } .rd2-hero-tag span{ font-size:.8rem; color:var(--rd2-muted); }
.rd2-hero-inner{ position:relative; z-index:2; padding-top:88px; padding-bottom:170px; }
.rd2-hero-copy{ max-width:640px; display:flex; flex-direction:column; gap:22px; }
.rd2-route-label{ font-size:.8rem; letter-spacing:.12em; text-transform:uppercase; color:var(--rd2-gold); }
.rd2-hero h1{ margin:0; font-size:clamp(2.3rem,5vw,4rem); line-height:1.03; letter-spacing:-.03em; color:#fff; font-weight:800; text-wrap:balance; }
.rd2-hero p{ margin:0; max-width:34em; font-size:1.15rem; line-height:1.55; color:rgba(255,255,255,.8); }
.rd2-hero-actions{ display:flex; flex-wrap:wrap; gap:12px; }
.rd-body .rd2-btn-ghost{ background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.55); box-shadow:none; }
.rd-body .rd2-btn-ghost:hover{ background:rgba(255,255,255,.1); color:#fff; }
.rd2-hero-wa{ display:inline-flex; align-items:center; gap:8px; color:rgba(255,255,255,.75); font-size:.92rem; font-weight:600; }
.rd2-hero-wa svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; }
.rd2-hero-wa:hover{ color:#fff; }

.rd2-panel-wrap{ position:relative; z-index:3; margin-top:-120px; }
/* ---------- Portada A: contenedor Chelme ---------- */
.rd3-hero{ position:relative; overflow:hidden; background:linear-gradient(180deg,#EAF1F2 0%,var(--rd2-paper) 100%); color:var(--rd2-ink); }
.rd3-hero::before{ content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(23,54,63,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(23,54,63,.05) 1px,transparent 1px); background-size:48px 48px; -webkit-mask-image:linear-gradient(180deg,#000 40%,transparent); mask-image:linear-gradient(180deg,#000 40%,transparent); pointer-events:none; }
.rd3-hero-inner{ position:relative; display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:24px; align-items:center; padding-top:64px; padding-bottom:150px; }
.rd3-hero-copy{ display:flex; flex-direction:column; gap:20px; }
.rd3-kicker{ color:#7A5B00; }
.rd3-hero h1{ margin:0; font-size:clamp(2.3rem,4.6vw,3.9rem); line-height:1.03; letter-spacing:-.03em; font-weight:800; color:var(--rd2-ink); text-wrap:balance; }
.rd3-hero-copy > p{ margin:0; max-width:32em; font-size:1.12rem; line-height:1.55; color:#3E5157; }
.rd-body .rd3-btn-outline{ background:transparent; color:var(--rd2-teal); border:1.5px solid var(--rd2-teal); box-shadow:none; }
.rd-body .rd3-btn-outline:hover{ background:var(--rd2-teal); color:#fff; }
.rd3-hero-alt{ margin:0; font-size:.92rem; color:var(--rd2-muted); }
.rd3-hero-alt a{ color:var(--rd2-teal); font-weight:700; text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.rd3-hero-stage{ position:relative; align-self:stretch; min-height:470px; margin:-64px -40px 0 0; touch-action:pan-y; }
.rd3-hero-img{ position:absolute; left:50%; top:52%; width:104%; max-width:none; height:auto; transform:translate(-50%,-50%); transition:opacity .6s ease; }
.rd3-hero-canvas{ position:absolute; inset:0; width:100%; height:100%; opacity:0; transition:opacity .6s ease; cursor:grab; }
.rd3-hero-stage.has-3d .rd3-hero-canvas{ opacity:1; }
.rd3-hero-stage.has-3d .rd3-hero-img{ opacity:0; }
.rd3-hero-stage.is-dragging .rd3-hero-canvas{ cursor:grabbing; }
.rd3-tag{ position:absolute; z-index:2; display:inline-flex; align-items:center; gap:8px; padding:8px 14px; border-radius:999px; background:#fff; box-shadow:0 8px 24px rgba(23,54,63,.12); font-size:.84rem; font-weight:700; color:var(--rd2-ink); pointer-events:none; }
.rd3-tag i{ width:8px; height:8px; border-radius:50%; background:#1F9D6B; box-shadow:0 0 0 4px rgba(31,157,107,.15); }
.rd3-tag-a{ left:4%; bottom:44px; }
.rd3-tag-b{ right:8%; bottom:4px; }
.rd3-hint{ position:absolute; right:calc(8% + 6px); bottom:52px; font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:.72rem; letter-spacing:.06em; color:var(--rd2-muted); opacity:0; transition:opacity .6s ease; }
.rd3-hero-stage.has-3d .rd3-hint{ opacity:1; }
@media (max-width:900px){
  .rd3-hero-inner{ grid-template-columns:1fr; gap:8px; padding-top:32px; padding-bottom:130px; }
  .rd3-hero-stage{ min-height:0; height:260px; margin:0 -16px; }
  .rd3-hero-img{ width:96%; }
  .rd3-tag{ font-size:.74rem; padding:6px 10px; }
  .rd3-tag-a{ left:12px; bottom:18px; } .rd3-tag-b{ display:none; }
  .rd3-hint{ right:16px; bottom:auto; top:4px; }
  .rd3-hero .rd2-hero-actions .btn{ flex:1 1 100%; justify-content:center; }
}
@media (prefers-reduced-motion:reduce){ .rd3-hero-img,.rd3-hero-canvas{ transition:none; } }
.rd2-panel{ display:grid; grid-template-columns:1.1fr .9fr; gap:0; border-radius:24px; background:#fff; border:1px solid var(--rd2-line); box-shadow:0 30px 70px rgba(23,54,63,.18); overflow:hidden; }
.rd2-quote{ padding:28px; display:flex; flex-direction:column; gap:14px; }
.rd2-quote-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:14px; flex-wrap:wrap; }
.rd2-quote-head h2{ margin:4px 0 0; font-size:1.5rem; color:var(--rd2-ink); }
.rd2-seg{ display:inline-flex; padding:4px; border-radius:999px; background:var(--rd2-paper); gap:4px; }
.rd2-seg .quote-menu-item{ all:unset; cursor:pointer; padding:8px 14px; border-radius:999px; font-size:.86rem; font-weight:700; color:var(--rd2-muted); }
.rd2-seg .quote-menu-item.active{ background:var(--rd2-teal); color:#fff; }
.rd2-seg .quote-menu-item:focus-visible{ outline:3px solid var(--rd2-gold); outline-offset:2px; }
.rd2-quote #miniFields{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.rd2-quote #miniFields:empty{ display:none; }
.rd2-result{ padding:16px 18px; border-radius:16px; background:var(--rd2-teal); color:#fff; }
.rd2-result-top{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.rd2-result-top span{ font-size:.9rem; font-weight:700; opacity:.85; }
.rd2-result-top strong{ font-size:1.7rem; font-variant-numeric:tabular-nums; }
.rd2-result p{ margin:8px 0 0; font-size:.86rem; line-height:1.5; color:rgba(255,255,255,.82); }
.rd2-quote-actions{ display:flex; flex-wrap:wrap; align-items:center; gap:16px; }
.rd2-preview{ padding:28px; background:#FBFAF7; border-left:1px solid var(--rd2-line); display:flex; flex-direction:column; gap:14px; }
.rd2-preview-head{ display:flex; justify-content:space-between; align-items:center; gap:10px; }
.rd2-preview-head strong{ font-size:1.1rem; color:var(--rd2-ink); }
.rd2-sample{ padding:4px 10px; border-radius:999px; background:#EFEBE1; font-size:.75rem; font-weight:700; color:var(--rd2-muted); }
.rd2-op-row{ display:flex; align-items:center; gap:12px; padding:14px 16px; border:1px solid var(--rd2-line); border-radius:14px; background:#fff; }
.rd2-ref{ font-size:.82rem; font-weight:600; }
.rd2-op-name{ flex:1; font-size:.9rem; }
.rd2-status{ padding:4px 10px; border-radius:999px; background:#E3EEF0; color:var(--rd2-teal); font-size:.75rem; font-weight:800; white-space:nowrap; }
.rd2-steps{ display:flex; gap:6px; } .rd2-steps i{ flex:1; height:6px; border-radius:3px; background:var(--rd2-line); } .rd2-steps i.on{ background:var(--rd2-teal); }
.rd2-next{ display:flex; gap:12px; padding:14px 16px; border-radius:14px; background:#FFF4D6; }
.rd2-dot{ width:10px; height:10px; margin-top:6px; border-radius:50%; background:var(--rd2-gold); flex-shrink:0; }
.rd2-next strong{ display:block; font-size:.9rem; color:var(--rd2-ink); } .rd2-next span{ font-size:.84rem; color:var(--rd2-muted); }
.rd2-preview-list{ list-style:none; margin:0; padding:0; display:grid; gap:8px; font-size:.9rem; color:var(--rd2-ink); }
.rd2-preview-list li{ display:flex; gap:8px; align-items:center; }
.rd2-preview-list svg{ width:16px; height:16px; fill:none; stroke:#1F7A55; stroke-width:2.4; }

.rd2-head{ margin-bottom:28px; display:flex; flex-direction:column; gap:8px; }
.rd2-head h2{ margin:0; font-size:clamp(1.8rem,3.4vw,2.6rem); letter-spacing:-.02em; color:var(--rd2-ink); }
.rd2-cases{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.rd2-case{ display:flex; flex-direction:column; gap:10px; padding:26px; border-radius:20px; background:#fff; border:1px solid var(--rd2-line); color:var(--rd2-ink); transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.rd2-case:hover{ transform:translateY(-3px); border-color:var(--rd2-teal); box-shadow:0 16px 36px rgba(23,54,63,.1); }
.rd2-case.is-main{ border:1.5px solid var(--rd2-teal); }
.rd2-case-tag{ font-size:.75rem; font-weight:600; color:var(--rd2-teal); text-transform:uppercase; letter-spacing:.06em; }
.rd2-case strong{ font-size:1.35rem; }
.rd2-case > span:not(.rd2-case-tag){ color:var(--rd2-muted); line-height:1.5; }
.rd2-case em{ margin-top:auto; padding-top:6px; font-style:normal; font-weight:800; color:var(--rd2-teal); display:inline-flex; align-items:center; gap:6px; }
.rd2-case em svg{ width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; }
.rd2-more{ margin-top:18px; display:flex; flex-wrap:wrap; gap:8px 16px; font-size:.92rem; color:var(--rd2-muted); }
.rd2-more a{ font-weight:700; color:var(--rd2-teal); }

.rd2-close{ padding:72px 0; }
.rd2-close-inner{ display:flex; justify-content:space-between; align-items:center; gap:28px; flex-wrap:wrap; padding:44px 48px; border-radius:28px; background:var(--rd2-teal); color:#fff; }
.rd2-close h2{ margin:0 0 6px; font-size:2rem; color:#fff; }
.rd2-close p{ margin:0; color:rgba(255,255,255,.82); }

@media (max-width:980px){
  .rd2-panel{ grid-template-columns:1fr; }
  .rd2-preview{ border-left:0; border-top:1px solid var(--rd2-line); }
  .rd2-cases{ grid-template-columns:1fr; }
}
@media (max-width:760px){
  .rd2-hero{ min-height:0; }
  .rd2-hero-media{ position:relative; width:auto; height:300px; order:2; }
  .rd2-hero-media::after{ background:linear-gradient(180deg,var(--rd2-ink) 0%,rgba(23,54,63,0) 45%); }
  .rd2-hero{ display:flex; flex-direction:column; }
  .rd2-hero-inner{ padding-top:36px; padding-bottom:28px; order:1; }
  .rd2-hero-tag{ right:auto; left:16px; bottom:48px; }
  .rd2-hero p{ font-size:1rem; }
  .rd2-hero-actions .btn{ flex:1 1 100%; justify-content:center; }
  .rd2-panel-wrap{ margin-top:-32px; }
  .rd2-quote,.rd2-preview{ padding:18px; }
  .rd2-quote #miniFields{ grid-template-columns:1fr; }
  .rd2-close-inner{ padding:28px 22px; }
}
@media (prefers-reduced-motion:reduce){ .rd2-case{ transition:none; } .rd2-case:hover{ transform:none; } }
@media (max-width:760px){ .rd2-result-top{ flex-direction:column; align-items:flex-start; gap:2px; } .rd2-result-top strong{ font-size:1.45rem; } }

/* ---------- Servicios en China (superpuesto a la portada) ---------- */
.rd2-services{ padding:30px; border-radius:24px; background:#fff; border:1px solid var(--rd2-line); box-shadow:0 30px 70px rgba(23,54,63,.18); display:flex; flex-direction:column; gap:22px; }
.rd2-services-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; }
.rd2-services-head h2{ margin:6px 0 0; font-size:clamp(1.7rem,3vw,2.3rem); letter-spacing:-.02em; color:var(--rd2-ink); }
.rd2-services-head p{ margin:0; max-width:34em; color:var(--rd2-muted); }
.rd2-svc-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:minmax(210px,auto); gap:14px; }
.rd2-svc{ position:relative; display:flex; overflow:hidden; border-radius:18px; color:#fff; min-height:210px; isolation:isolate; }
.rd2-svc img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 30%; z-index:-2; transition:transform .5s ease; }
.rd2-svc::after{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(23,54,63,0) 25%,rgba(23,54,63,.9) 100%); }
.rd2-svc:hover img{ transform:scale(1.05); }
.rd2-svc:focus-visible{ outline:3px solid var(--rd2-gold); outline-offset:3px; }
.rd2-svc-body{ margin-top:auto; padding:18px; display:flex; flex-direction:column; gap:4px; }
.rd2-svc-body strong{ font-size:1.12rem; }
.rd2-svc-body span{ font-size:.86rem; line-height:1.45; color:rgba(255,255,255,.86); }
.rd2-svc.is-featured{ grid-column:span 2; grid-row:span 2; }
.rd2-svc.is-featured .rd2-svc-body{ padding:26px; gap:8px; }
.rd2-svc.is-featured strong{ font-size:1.7rem; letter-spacing:-.02em; }
.rd2-svc.is-featured .rd2-svc-body > span:not(.rd2-svc-tag){ font-size:1rem; max-width:32em; }
.rd2-svc-tag{ align-self:flex-start; padding:5px 11px; border-radius:999px; background:var(--rd2-gold); color:var(--rd2-ink) !important; font-size:.74rem !important; font-weight:800; }
.rd2-svc em{ margin-top:6px; font-style:normal; font-weight:800; display:inline-flex; align-items:center; gap:6px; color:#fff; }
.rd2-svc em svg{ width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; }
.rd2-services-foot{ margin:0; color:var(--rd2-muted); font-size:.95rem; }
.rd2-services-foot a{ font-weight:800; color:var(--rd2-teal); }
.rd2-quote-section{ padding-top:84px; }
@media (max-width:980px){ .rd2-svc-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } .rd2-svc.is-featured{ grid-column:1 / -1; grid-row:auto; min-height:300px; } }
@media (max-width:560px){ .rd2-services{ padding:18px; } .rd2-svc-grid{ grid-template-columns:1fr; } .rd2-svc{ min-height:190px; } }
@media (prefers-reduced-motion:reduce){ .rd2-svc img{ transition:none; } .rd2-svc:hover img{ transform:none; } }
@media (max-width:980px){ .rd2-svc.is-featured::after{ background:linear-gradient(180deg,rgba(23,54,63,.35) 0%,rgba(23,54,63,.92) 70%); } }

/* ---------- Contenedor 3D de la calculadora ---------- */
.rd-fill-3d{ position:relative; border-radius:16px; overflow:hidden; background:radial-gradient(120% 90% at 50% 0%,#eef3f3 0%,#dde7e8 100%); border:1px solid var(--rd2-line,#E2DED4); }
.rd-fill-3d[hidden]{ display:none; }
.rd-fill-3d canvas{ display:block; cursor:grab; }
.rd-fill-3d canvas:active{ cursor:grabbing; }
.rd-fill.has-3d .rd-fill-box{ display:none; }
.rd-fill-legend{ position:absolute; left:12px; top:10px; display:flex; flex-wrap:wrap; gap:10px; font-size:.74rem; font-weight:700; color:#17363F; pointer-events:none; }
.rd-fill-legend span{ display:inline-flex; align-items:center; gap:6px; padding:4px 9px; border-radius:999px; background:rgba(255,255,255,.85); }
.rd-fill-legend span::before{ content:""; width:10px; height:10px; border-radius:3px; }
.lg-you::before{ background:#c9a26a; box-shadow:inset 0 0 0 1px #8a6a3a; }
.lg-others::before{ background:#d9e4e6; box-shadow:inset 0 0 0 1px #a7b8bb; }
.rd-fill-3d.is-fcl .lg-others{ display:none; }
.rd-fill-hint{ position:absolute; right:12px; top:12px; font-size:.72rem; color:#5E6B6E; pointer-events:none; }

/* ---------- Escena "Así cargamos tu contenedor" (avanza con el scroll) ---------- */
.rd2-story{ position:relative; height:340vh; margin-top:72px; }
.rd2-story-sticky{ position:sticky; top:76px; height:calc(100vh - 76px); min-height:520px; display:flex; align-items:center; overflow:hidden; }
.rd2-story-inner{ flex:none; width:min(92%,var(--container,1180px)); margin:0 auto; display:grid; grid-template-columns:.8fr 1.2fr; gap:36px; align-items:center; }
.rd2-story-copy{ display:flex; flex-direction:column; gap:14px; align-items:flex-start; }
.rd2-story-copy h2{ margin:0; font-size:clamp(1.8rem,3.2vw,2.5rem); letter-spacing:-.02em; color:var(--rd2-ink); }
.rd2-story-steps{ list-style:none; margin:4px 0 8px; padding:0 0 0 18px; border-left:2px solid var(--rd2-line); display:grid; gap:14px; }
.rd2-story-steps li{ position:relative; }
.rd2-story-steps li::before{ content:""; position:absolute; left:-25px; top:5px; width:12px; height:12px; border-radius:50%; background:#fff; border:2px solid var(--rd2-line); box-sizing:border-box; transition:background .3s, border-color .3s; }
.rd2-story-steps li:not(.is-on) strong{ color:var(--rd2-muted); font-weight:700; }
.rd2-story-steps li.is-done::before{ background:var(--rd2-teal); border-color:var(--rd2-teal); }
.rd2-story-steps li.is-on strong{ color:var(--rd2-ink); }
.rd2-story-steps li.is-on::before{ background:var(--rd2-gold); border-color:var(--rd2-gold); box-shadow:0 0 0 4px rgba(218,173,43,.25); }
.rd2-story-steps strong{ display:block; color:var(--rd2-ink); font-size:1.05rem; }
.rd2-story-steps span{ font-size:.92rem; color:var(--rd2-muted); }
.rd2-story-stage{ position:relative; height:min(62vh,520px); border-radius:24px; overflow:hidden; background:linear-gradient(180deg,#e9eff0 0%,#dce4e5 100%); border:1px solid var(--rd2-line); }
.rd2-story-poster{ width:100%; height:100%; object-fit:cover; display:block; }
.rd2-story.has-3d .rd2-story-poster{ display:none; }
.rd2-story-stage canvas{ display:block; }
.rd2-story-note{ position:absolute; right:12px; bottom:10px; padding:3px 9px; border-radius:999px; background:rgba(255,255,255,.8); font-size:.72rem; font-weight:700; color:var(--rd2-muted); }
/* Sin 3D o con movimiento reducido: bloque normal, sin efecto de scroll */
.rd2-story.is-static{ height:auto; }
.rd2-story.is-static .rd2-story-sticky{ position:static; height:auto; min-height:0; padding:24px 0; }
.rd2-story.is-static .rd2-story-steps li{ opacity:1; }
@media (max-width:900px){
  .rd2-story{ height:300vh; }
  .rd2-story-sticky{ top:64px; height:calc(100vh - 64px); align-items:stretch; padding:18px 0; box-sizing:border-box; }
  .rd2-story-inner{ grid-template-columns:1fr; gap:14px; align-content:start; }
  .rd2-story-copy h2{ font-size:1.5rem; }
  .rd2-story-steps{ gap:8px; }
  .rd2-story-steps li:not(.is-on) span{ display:none; }
  .rd2-story-copy .btn{ display:none; }
  .rd2-story-stage{ height:40vh; min-height:240px; }
  .rd2-story.is-static .rd2-story-steps li span{ display:block; }
}

/* Videos de TikTok: portadas propias, el video se abre en TikTok (sin scripts de terceros) */
.rd-tt-grid{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:14px; }
.rd-tt-card{ position:relative; display:block; aspect-ratio:9/16; border-radius:16px; overflow:hidden; background:#0b2a31; box-shadow:0 10px 28px rgba(18,63,73,.14); color:#fff; text-decoration:none; }
.rd-tt-card img{ width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
.rd-tt-card::after{ content:""; position:absolute; inset:45% 0 0; background:linear-gradient(180deg,rgba(7,30,35,0),rgba(7,30,35,.9)); pointer-events:none; }
.rd-tt-card:hover img,.rd-tt-card:focus-visible img{ transform:scale(1.04); }
.rd-tt-card:focus-visible{ outline:3px solid var(--gold); outline-offset:3px; }
.rd-tt-play{ position:absolute; top:50%; left:50%; width:46px; height:46px; margin:-23px 0 0 -23px; display:grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.9); z-index:1; }
.rd-tt-play svg{ width:20px; height:20px; fill:var(--petrol); margin-left:2px; }
.rd-tt-title{ position:absolute; left:12px; right:12px; bottom:12px; z-index:1; font-weight:750; font-size:.86rem; line-height:1.3; }
.rd-tt-more{ margin:26px 0 0; text-align:center; }
.rd-tt-more svg{ width:18px; height:18px; vertical-align:-3px; }
@media (max-width:1000px){ .rd-tt-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:640px){
  .rd-tt-grid{ display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; padding:0 0 6px; }
  .rd-tt-card{ flex:0 0 58%; scroll-snap-align:start; }
}
@media (prefers-reduced-motion:reduce){ .rd-tt-card img{ transition:none; } }
/* Foto de Alan en la Feria de Cantón: la persona está en la mitad inferior */
.rd-alan-grid img.rd-alan-photo{ object-position:50% 72%; }