/* Ajustes de reflujo de Cómo funciona. El resto de la composición usa las clases r-* compartidas. */
@media(max-width:1100px){
.r-how .r-how-hero{min-height:clamp(460px,62vw,620px)}
.r-how .r-how-hero::after{height:64px}
.r-how .r-how-hero .r-hero-media>img{object-position:65% 45%}
.r-how .r-how-hero .r-hero-copy{max-width:620px}
.r-how .r-how-rule{display:block;width:min(360px,85%);height:2px;margin-top:24px;background:currentColor}
.r-how .r-how-connected .r-heading{margin-bottom:28px}
.r-how .r-how-connected-layout{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:center;gap:clamp(24px,4vw,56px)}
.r-how .r-how-system-image{width:100%;max-width:370px;margin:0 auto}
.r-how .r-how-system-image img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain}
.r-how .r-how-connected-list{display:grid;gap:22px;margin:0;padding:0;list-style:none}
.r-how .r-how-connected-list li{display:grid;grid-template-columns:80px minmax(0,1fr);align-items:center;gap:18px;min-width:0}
.r-how .r-how-connected-list img{display:block;width:80px;height:80px;aspect-ratio:1;object-fit:contain}
.r-how .r-how-connected-list h3{margin:0 0 5px;font-family:SiteMontserrat,Montserrat,Arial,sans-serif;font-size:17px;font-weight:600;line-height:1.3;color:#18305c}
.r-how .r-how-connected-list h3 a{color:inherit;text-decoration:none}
.r-how .r-how-connected-list h3 a:hover{text-decoration:underline;text-underline-offset:4px}
.r-how .r-how-connected-list p{margin:0;max-width:350px;font-size:16px;line-height:1.5;color:#18305c}
.r-how .r-how-detect{position:relative;isolation:isolate;overflow:hidden;background:#647494}
.r-how .r-how-scene-media{position:absolute;inset:0;z-index:-2;display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.r-how .r-how-detect::before{position:absolute;inset:0;height:auto;z-index:-1;content:"";background:linear-gradient(180deg,rgba(24,48,92,.58),rgba(24,48,92,.36))}
.r-how .r-how-detect>.r-wrap{position:relative}
.r-how .r-how-detect>.r-wrap>.r-heading,.r-how .r-how-act>.r-wrap>.r-heading{color:#fff;text-align:center}
.r-how .r-how-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:clamp(24px,3vw,40px)}
.r-how .r-how-card{display:flex;flex-direction:column;min-width:0;padding:0;overflow:hidden;border:0;border-radius:22px;background:#fff;color:#18305c;box-shadow:none}
.r-how .r-how-card h3{display:flex;align-items:center;justify-content:center;min-height:84px;margin:0;padding:18px 20px;font-family:SiteCormorant,"Cormorant Garamond",Georgia,serif;font-size:clamp(25px,2.8vw,30px);font-weight:600;line-height:1.08;text-align:center}
.r-how .r-how-card>.r-photo{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:center}
.r-how .r-how-card p{flex:1;margin:0;padding:20px 22px 24px;font-size:16px;line-height:1.55;text-align:center;color:#18305c}
.r-how .r-how-act{position:relative;background:#18305c;isolation:isolate}
.r-how .r-how-act::before{position:absolute;inset:0;height:auto;z-index:-1;content:"";background-image:url('assets/optimized/images/36d7b8c779adf9b967c96ddee488b705.webp');background-size:120% auto;background-position:center;mix-blend-mode:screen;opacity:.12;pointer-events:none}
.r-how .r-how-steps{padding-block:var(--section-air)}
.r-how .r-how-step-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:0;padding:0;list-style:none}
.r-how .r-how-step-list .r-step{display:flex;align-items:center;gap:15px;min-width:0}
.r-how .r-how-step-list img{display:block;flex:0 0 66px;width:66px;height:76px;object-fit:contain}
.r-how .r-how-step-number{display:block;font-family:SiteCormorant,"Cormorant Garamond",Georgia,serif;font-size:36px;line-height:1;color:#18305c}
.r-how .r-how-step-list h3{margin:5px 0 0;font-family:SiteMontserrat,Montserrat,Arial,sans-serif;font-size:15px;line-height:1.3;font-weight:600;color:#18305c}
.r-how .r-how-operations{background:#18305c}
.r-how .r-how-operations .r-heading{max-width:800px;margin-inline:auto;text-align:center;color:#fff}
.r-how .r-how-operations-layout{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:center;gap:32px}
.r-how .r-how-operations-copy .r-list{margin:0 0 28px;padding-left:22px;color:#fff;font-size:16px;line-height:1.7}
.r-how .r-how-operations-copy .r-list a{color:inherit;text-decoration:underline;text-underline-offset:4px}
.r-how .r-how-operations-copy .r-btn{border:2px solid #fff;border-radius:18px;background:#18305c;color:#fff}
.r-how .r-how-operations-image{margin:0;min-width:0}
.r-how .r-how-operations-image img{display:block;width:100%;height:auto;aspect-ratio:1140/660;object-fit:contain;border-radius:0}
.r-how a:focus-visible{outline:3px solid #b98421;outline-offset:5px}
@media(max-width:760px){
  .r-how .r-how-connected-layout{grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:22px}
  .r-how .r-how-connected-list{gap:18px}
  .r-how .r-how-connected-list li{grid-template-columns:64px minmax(0,1fr);gap:14px}
  .r-how .r-how-connected-list img{width:64px;height:64px}
  .r-how .r-how-connected-list h3{font-size:16px}
  .r-how .r-how-connected-list p{font-size:16px}
  .r-how .r-how-step-list{gap:18px}
  .r-how .r-how-step-list .r-step{flex-direction:column;align-items:flex-start;gap:8px}
  .r-how .r-how-step-list img{flex-basis:auto;width:60px;height:70px}
  .r-how .r-how-operations-layout{grid-template-columns:1fr}
  .r-how .r-how-operations-image{max-width:640px;width:100%;margin:0 auto}
  .r-how .r-how-operations-copy .r-list{columns:2;column-gap:32px}
  .r-how .r-how-operations-copy .r-list li{break-inside:avoid}
}
@media(max-width:580px){
  .r-how .r-how-hero{min-height:500px}
  .r-how .r-how-hero .r-hero-media>img{object-position:68% 35%}
  .r-how .r-how-hero .r-hero-copy{max-width:100%;padding-top:130px}
  .r-how .r-how-connected-layout{grid-template-columns:1fr;gap:28px}
  .r-how .r-how-system-image{width:min(76%,300px)}
  .r-how .r-how-connected-list{gap:22px}
  .r-how .r-how-connected-list li{grid-template-columns:76px minmax(0,1fr);gap:18px}
  .r-how .r-how-connected-list img{width:76px;height:76px}
  .r-how .r-how-connected-list h3{font-size:17px}
  .r-how .r-how-connected-list p{font-size:16px}
  .r-how .r-how-cards{grid-template-columns:1fr;gap:28px}
  .r-how .r-how-card h3{min-height:0;padding:18px 20px;font-size:27px}
  .r-how .r-how-card p{padding:20px 22px 24px;font-size:16px}
  .r-how .r-how-step-list{grid-template-columns:1fr;gap:25px}
  .r-how .r-how-step-list .r-step{flex-direction:row;align-items:center;gap:24px}
  .r-how .r-how-step-list img{flex:0 0 68px;width:68px;height:80px}
  .r-how .r-how-step-list h3{font-size:17px}
  .r-how .r-how-operations-copy .r-list{columns:1;font-size:16px;line-height:1.8}
  .r-how .r-how-operations-copy .r-btn{display:inline-flex;justify-content:center;min-width:220px}
}
}
