.elementor-113 .elementor-element.elementor-element-d1e270c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for html, class: .elementor-element-2786cee *//* ═══════ PAGE: HOW IT WORKS ═══════ */
.hw-hero{padding:5rem 0 3rem;text-align:center}
.hw-hero h1{font-family:var(--serif);font-size:clamp(2.2rem,4.5vw,3.6rem);font-weight:400;color:var(--ink);letter-spacing:-0.03em;line-height:1.08;margin-bottom:1rem}
.hw-hero h1 em{font-style:italic;color:var(--electric)}
.hw-hero p{font-size:1.05rem;color:var(--t500);max-width:520px;margin:0 auto;line-height:1.65}

/* Timeline steps */
.hw-timeline{padding:2rem 0 5rem}
.hw-step{display:grid;grid-template-columns:1fr 60px 1fr;gap:0;align-items:start;min-height:320px}
.hw-step.reverse .hw-step-content{order:3}
.hw-step.reverse .hw-step-visual{order:1}
.hw-step-content{padding:2.5rem 3rem 2.5rem 0}
.hw-step.reverse .hw-step-content{padding:2.5rem 0 2.5rem 3rem}
.hw-step-num{font-family:var(--mono);font-size:0.65rem;font-weight:500;color:var(--electric);letter-spacing:0.1em;margin-bottom:0.5rem}
.hw-step-content h2{font-family:var(--serif);font-size:clamp(1.4rem,2.5vw,1.9rem);font-weight:400;color:var(--ink);letter-spacing:-0.02em;line-height:1.15;margin-bottom:0.75rem}
.hw-step-content>p{font-size:0.9rem;color:var(--t500);line-height:1.7;margin-bottom:1.25rem}
.hw-step-content ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:0.5rem;margin-bottom:1.5rem}
.hw-step-content ul li{display:flex;align-items:flex-start;gap:0.5rem;font-size:0.84rem;color:var(--t700);line-height:1.5}
.hw-step-content ul li svg{width:15px;height:15px;stroke:var(--mint);fill:none;stroke-width:2.5;flex-shrink:0;margin-top:2px}
.hw-step-content .hw-note{font-size:0.78rem;color:var(--t400);font-style:italic;line-height:1.5}

/* Center line */
.hw-line{display:flex;flex-direction:column;align-items:center;position:relative}
.hw-dot{width:48px;height:48px;border-radius:50%;background:var(--elec-glow);border:2px solid var(--electric);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:0.82rem;font-weight:700;color:var(--electric);position:relative;z-index:1}
.hw-line::after{content:'';position:absolute;top:48px;bottom:0;width:2px;background:var(--sand)}
.hw-step:last-child .hw-line::after{display:none}

/* Visual placeholder */
.hw-step-visual{padding:2rem 0}
.hw-visual{background:#fff;border:1px solid var(--sand);border-radius:16px;height:280px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.hw-visual::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(0,0,0,0.012) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,0.012) 1px,transparent 1px);background-size:32px 32px}
.hw-visual span{font-size:0.72rem;font-weight:600;color:var(--t300);text-transform:uppercase;letter-spacing:0.08em;position:relative}

/* Platforms strip */
.hw-platforms{padding:4rem 0;background:var(--ink);text-align:center}
.hw-plat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;max-width:800px;margin:2rem auto 0}
.hw-plat{padding:2rem;background:var(--ink2);border:1px solid rgba(255,255,255,0.06);border-radius:14px;transition:0.3s}
.hw-plat:hover{border-color:rgba(255,255,255,0.12);background:var(--ink3)}
.hw-plat strong{display:block;font-size:1rem;color:#fff;margin-bottom:0.25rem}
.hw-plat span{font-size:0.78rem;color:var(--t400);line-height:1.5}

/* Separator CTA */
.hw-mid-cta{padding:4rem 0;background:var(--warm);text-align:center}
.hw-mid-cta h2{font-family:var(--serif);font-size:clamp(1.4rem,2.5vw,1.9rem);font-weight:400;color:var(--ink);letter-spacing:-0.02em;margin-bottom:0.5rem}
.hw-mid-cta p{font-size:0.9rem;color:var(--t500);max-width:440px;margin:0 auto 1.5rem;line-height:1.6}

/* SEO section */
.hw-seo{padding:5rem 0}
.hw-seo-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;margin-top:3rem}
.hw-seo-block{padding:2rem;background:var(--warm);border-radius:14px;border:1px solid var(--sand)}
.hw-seo-block .mono-label{font-family:var(--mono);font-size:0.62rem;font-weight:500;color:var(--electric);text-transform:uppercase;letter-spacing:0.1em;margin-bottom:0.6rem}
.hw-seo-block h3{font-family:var(--serif);font-size:1.3rem;color:var(--ink);margin-bottom:0.75rem;line-height:1.25}
.hw-seo-block p{font-size:0.86rem;color:var(--t500);line-height:1.75}
.hw-seo-block p strong{color:var(--t700)}

/* Final CTA */
.hw-final{padding:4rem 0 5rem;text-align:center}
.hw-final h2{font-family:var(--serif);font-size:clamp(1.5rem,2.5vw,2.2rem);font-weight:400;color:var(--ink);letter-spacing:-0.02em;margin-bottom:0.6rem}
.hw-final p{font-size:0.92rem;color:var(--t500);max-width:460px;margin:0 auto 1.5rem;line-height:1.6}

/* FAQ toggle compatible con schema PHP */
.faq-item.open .faq-a{max-height:300px}
.faq-item.open .faq-q svg{transform:rotate(180deg)}
.faq-item:hover{border-color:var(--t200) !important}

@media(max-width:900px){
  .hw-step{grid-template-columns:1fr;gap:0}
  .hw-step .hw-line{display:none}
  .hw-step-content,.hw-step.reverse .hw-step-content{padding:1.5rem 0;order:1 !important}
  .hw-step-visual{order:2 !important;padding:0 0 2rem}
  .hw-plat-grid{grid-template-columns:1fr}
  .hw-seo-grid{grid-template-columns:1fr}
}/* End custom CSS */