@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/barlow-condensed-400.woff2") format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/barlow-condensed-600.woff2") format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/barlow-condensed-700.woff2") format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:800;font-display:swap;src:url("../fonts/barlow-condensed-800.woff2") format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:900;font-display:swap;src:url("../fonts/barlow-condensed-900.woff2") format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:italic;font-weight:800;font-display:swap;src:url("../fonts/barlow-condensed-800-italic.woff2") format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:italic;font-weight:900;font-display:swap;src:url("../fonts/barlow-condensed-900-italic.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:400 700;font-display:swap;src:url("../fonts/inter-latin.woff2") format("woff2")}
.fsb{--fs-accent:#10bff3;--fs-bg:#08090a;--fs-card:#151719;--fs-text:#f8fafc;--fs-muted:#a0a6ad;box-sizing:border-box;background:var(--fs-bg);color:var(--fs-text);font-family:Inter,Arial,sans-serif}.fsb *{box-sizing:border-box}.fsb a{color:inherit;text-decoration:none}.fsb h1,.fsb h2,.fsb h3,.fsb .price{font-family:"Barlow Condensed",Arial,sans-serif;text-transform:uppercase;margin:0;line-height:.92}.fsb p{line-height:1.65}.fsb-wrap{width:min(1180px,calc(100% - 40px));margin:auto}.fsb-section{padding:110px 0}.fsb-section.alt{background:#0e1011}.fsb-section-head{max-width:760px;margin-bottom:55px}.fsb-section-head.is-center{text-align:center;margin-left:auto;margin-right:auto}.fsb-section-head h2{font-size:clamp(48px,6vw,76px);font-weight:900}.fsb-section-head p{color:var(--fs-muted);font-size:17px}.fsb-eyebrow{display:flex;align-items:center;gap:12px;color:var(--fs-accent);font-size:12px;font-weight:800;letter-spacing:.25em;text-transform:uppercase;margin-bottom:22px}.fsb-eyebrow span{width:34px;height:1px;background:var(--fs-accent)}.fsb-section-head.is-center .fsb-eyebrow,.fsb-cta .fsb-eyebrow{justify-content:center}.fsb-btn{display:inline-flex;align-items:center;justify-content:center;padding:15px 26px;border-radius:999px;background:linear-gradient(135deg,#42ddff,var(--fs-accent),#168bd8);color:#031016!important;font-family:"Barlow Condensed",sans-serif;font-weight:900;text-transform:uppercase;letter-spacing:.05em;transition:.25s}.fsb-btn:hover{transform:translateY(-2px);filter:brightness(1.08)}.fsb-btn.small{padding:11px 20px}.fsb-btn.ghost{background:transparent;border:1px solid #ffffff2a;color:#fff!important}.fsb-btn.dark{background:#050607;color:var(--fs-accent)!important}.fsb-btn.ghost-light{background:#ffffff12;border:1px solid #ffffff60;color:#fff!important}.fsb-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:35px}.fsb-actions.center{justify-content:center}.fsb-nav{position:relative;z-index:20;border-bottom:1px solid #ffffff10}.fsb-nav-inner{min-height:80px;display:flex;align-items:center;justify-content:space-between;gap:30px}.fsb-brand{display:flex;align-items:center;gap:11px;font-weight:900;letter-spacing:.12em}.fsb-brand b{display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg,#42ddff,#1495d9);color:#031016;font-size:22px}.fsb-nav nav{display:flex;gap:32px;font-size:14px}.fsb-nav nav a:hover{color:var(--fs-accent)}.fsb-hero{position:relative;min-height:820px;display:flex;align-items:center;overflow:hidden;padding:100px 0}.fsb-hero-bg{position:absolute;inset:0;background:radial-gradient(circle at 18% 50%,#10bff322,transparent 32%),linear-gradient(#08090ad8,#08090af5),url('../images/cover.png') center/cover}.fsb-hero-grid{position:relative;display:grid;grid-template-columns:1.4fr .8fr;align-items:center;gap:60px}.fsb-hero h1{font-size:clamp(62px,8vw,112px);font-weight:900;max-width:800px}.fsb-hero h1::first-line{color:var(--fs-text)}.fsb-hero p{max-width:670px;color:var(--fs-muted);font-size:18px}.fsb-hero-grid>img{width:100%;max-height:610px;object-fit:cover;object-position:left;border-radius:28px;box-shadow:0 30px 90px #000}.fsb-marquee{overflow:hidden;border-top:1px solid #ffffff10;border-bottom:1px solid #ffffff10;padding:28px 0}.fsb-marquee div{width:max-content;color:#ffffff1a;font:900 52px/1 "Barlow Condensed",sans-serif;white-space:nowrap;animation:fsbMarquee 28s linear infinite}@keyframes fsbMarquee{to{transform:translateX(-50%)}}.fsb-two{display:grid;grid-template-columns:1fr 1.05fr;gap:70px;align-items:center}.fsb-poster{width:100%;border-radius:28px;box-shadow:0 25px 70px #0009}.fsb-badges{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:30px 0}.fsb-badges span,.fsb-card{border:1px solid #ffffff12;background:#ffffff08;border-radius:16px}.fsb-badges span{padding:15px}.fsb-plan-grid,.fsb-feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.fsb-card{padding:26px}.fsb-card h3{font-size:25px;margin:18px 0 10px}.fsb-card p{color:var(--fs-muted);font-size:14px}.fsb-plan{display:flex;flex-direction:column;position:relative;min-height:470px}.fsb-plan.featured{background:linear-gradient(145deg,#42ddff,#0798dc);color:#031016;transform:translateY(-10px);box-shadow:0 20px 60px #10bff33a}.fsb-plan>em{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:#050607;color:var(--fs-accent);font-style:normal;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.12em;padding:7px 14px;border-radius:99px}.fsb-plan>small{text-transform:uppercase;letter-spacing:.18em}.fsb-plan .price{font-size:50px;font-weight:900;margin:22px 0}.fsb-plan .price sup,.fsb-plan .price small{font:500 13px Inter,sans-serif}.fsb-plan ul{list-style:none;padding:0;margin:0 0 25px;flex:1}.fsb-plan li{font-size:13px;margin:11px 0}.fsb-plan.featured .fsb-btn{background:#050607;color:var(--fs-accent)!important}.fsb-feature-grid .fsb-card i{display:grid;place-items:center;width:48px;height:48px;background:#10bff31a;border-radius:12px;color:var(--fs-accent);font-style:normal;font-size:22px}.fsb-transform-grid,.fsb-three{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.fsb-transform{height:390px;border-radius:24px;overflow:hidden;display:flex;align-items:flex-end;padding:26px;position:relative;background:radial-gradient(circle at 70% 20%,#10bff355,transparent 35%),linear-gradient(145deg,#222,#050607)}.fsb-transform::after{content:"FITNESS SPOT";position:absolute;right:-15px;top:50px;transform:rotate(90deg);font:900 18px "Barlow Condensed";color:#ffffff12;letter-spacing:.2em}.fsb-transform.t2{background:radial-gradient(circle at 25% 30%,#118abd66,transparent 38%),linear-gradient(145deg,#181a1d,#050607)}.fsb-transform.t3{background:radial-gradient(circle at 75% 70%,#18d8ff55,transparent 35%),linear-gradient(145deg,#202225,#050607)}.fsb-transform div{position:relative;z-index:2}.fsb-transform b{display:block;color:var(--fs-accent);font:900 38px "Barlow Condensed"}.fsb-transform small{color:var(--fs-muted);text-transform:uppercase;letter-spacing:.15em}.fsb-transform h3{font-size:24px;margin-top:18px}.fsb-transform p{color:var(--fs-muted);font-size:14px}.fsb-quote{display:flex;flex-direction:column}.fsb-quote .stars{color:var(--fs-accent);letter-spacing:.15em}.fsb-quote blockquote{font-size:17px;line-height:1.7;margin:22px 0;flex:1}.fsb-quote figcaption{display:flex;gap:12px;align-items:center;border-top:1px solid #ffffff10;padding-top:20px}.fsb-quote figcaption>b{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--fs-accent);color:#031016}.fsb-quote figcaption span{display:flex;flex-direction:column}.fsb-quote figcaption small{color:var(--fs-muted);text-transform:uppercase;letter-spacing:.1em}.fsb-wrap.narrow{max-width:980px}.fsb-video{position:relative;display:block;overflow:hidden;border-radius:28px;min-height:480px;background:#111}.fsb-video img{width:100%;height:480px;object-fit:cover;filter:brightness(.55)}.fsb-video>span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:88px;height:88px;border-radius:50%;background:var(--fs-accent);color:#031016;font-size:30px}.fsb-video>strong{position:absolute;left:35px;right:35px;bottom:30px;font:900 34px "Barlow Condensed";text-transform:uppercase}.fsb-four,.fsb-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.fsb-steps article>b{font:900 72px "Barlow Condensed";color:var(--fs-accent);opacity:.3}.fsb-steps h3{font-size:25px}.fsb-steps p{color:var(--fs-muted);font-size:14px}.fsb-stats>div{text-align:center;padding:30px 16px;border:1px solid #ffffff12;background:#ffffff08;border-radius:22px}.fsb-stats b{display:block;color:var(--fs-accent);font:900 58px "Barlow Condensed"}.fsb-stats span{display:block;color:var(--fs-muted);font-size:12px;text-transform:uppercase;letter-spacing:.12em}.fsb-stats.mini{margin-top:55px}.fsb-stats.mini>div{padding:0;border:0;background:none;text-align:left}.fsb-stats.mini b{font-size:38px}.fsb-faq details{border:1px solid #ffffff12;background:#ffffff08;border-radius:16px;margin:10px 0;padding:0 22px}.fsb-faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;font:800 19px "Barlow Condensed";text-transform:uppercase;padding:22px 0}.fsb-faq details p{color:var(--fs-muted);margin:0;padding:0 0 22px}.fsb-cta{text-align:center;padding:70px 35px;border-radius:36px;background:radial-gradient(circle at 15% 10%,#ffffff38,transparent 28%),linear-gradient(135deg,#44dcff,#098fd6);color:#031016}.fsb-cta h2{font-size:clamp(64px,8vw,105px);font-weight:900;max-width:850px;margin:auto}.fsb-cta p{max-width:680px;margin:22px auto}.fsb-cta .fsb-eyebrow{color:#031016}.fsb-cta .fsb-eyebrow span{background:#031016}.fsb-footer{border-top:1px solid #ffffff10}.fsb-footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:60px;padding:70px 0}.fsb-footer-grid p{color:var(--fs-muted);font-size:14px}.fsb-footer-grid>div:first-child p{max-width:470px}.fsb-footer-grid small{color:var(--fs-muted);letter-spacing:.15em}.fsb-social{display:flex;gap:10px}.fsb-social a{display:grid;place-items:center;width:40px;height:40px;border:1px solid #ffffff20;border-radius:50%;font-size:11px}.fsb-copy{text-align:center;border-top:1px solid #ffffff10;padding:22px;color:var(--fs-muted);font-size:12px}
@media(max-width:1024px){.fsb-plan-grid,.fsb-feature-grid,.fsb-four,.fsb-stats{grid-template-columns:repeat(2,1fr)}.fsb-hero-grid{grid-template-columns:1fr}.fsb-hero-grid>img{display:none}.fsb-hero{min-height:760px}.fsb-two{gap:40px}}
@media(max-width:767px){.fsb-section{padding:75px 0}.fsb-nav nav{display:none}.fsb-nav .fsb-btn{font-size:11px}.fsb-brand span{font-size:12px}.fsb-hero{min-height:720px;padding:80px 0}.fsb-hero h1{font-size:62px}.fsb-two,.fsb-transform-grid,.fsb-three,.fsb-footer-grid{grid-template-columns:1fr}.fsb-plan-grid,.fsb-feature-grid{grid-template-columns:1fr}.fsb-four,.fsb-stats{grid-template-columns:repeat(2,1fr)}.fsb-badges{grid-template-columns:1fr}.fsb-plan.featured{transform:none}.fsb-video,.fsb-video img{min-height:350px;height:350px}.fsb-section-head h2{font-size:48px}.fsb-footer-grid{gap:25px}.fsb-stats b{font-size:42px}.fsb-stats.mini{gap:14px}}
@media(max-width:440px){.fsb-four,.fsb-stats{grid-template-columns:1fr 1fr}.fsb-stats.mini span{font-size:9px}.fsb-actions .fsb-btn{width:100%}}

/* Version 2: aislamiento frente al tema de WordPress y composición fiel a Lovable. */
.elementor-widget[class*="elementor-widget-fitness_spot_"]>.elementor-widget-container{overflow:visible}
.fsb{position:relative;width:100%;isolation:isolate;-webkit-font-smoothing:antialiased}
.fsb ::selection{background:var(--fs-accent);color:#031016}.fsb img{display:block;max-width:100%}
.fsb h1,.fsb h2,.fsb h3,.fsb p{padding:0!important}
.fsb.fsb h1,.fsb.fsb h2,.fsb.fsb h3{font-family:"Barlow Condensed",Arial,sans-serif;font-style:normal;letter-spacing:var(--fs-heading-ls,-.018em)}
.fsb h1{margin:0!important}.fsb h2{margin:0!important}.fsb h3{margin:0!important}
.fsb p{margin:20px 0 0!important}
.fsb-section,.fsb-hero{background-color:var(--fs-bg)}
.fsb-section::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.14;pointer-events:none;background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(to bottom,transparent,#000 35%,transparent)}
.fsb-nav{position:fixed;top:0;left:0;right:0;width:100%;z-index:999;background:rgba(8,9,10,.58);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);transition:background .25s ease,box-shadow .25s ease}.fsb-nav.is-scrolled{background:rgba(8,9,10,.94);box-shadow:0 12px 35px rgba(0,0,0,.35)}
body.admin-bar .fsb-nav{top:32px}.elementor-editor-active .fsb-nav{position:relative;top:auto!important}.elementor-editor-active .fsb-hero{min-height:760px}
.fsb-hero{min-height:min(940px,100svh);padding:148px 0 88px!important}
.fsb-hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);background-size:64px 64px;opacity:.025}
.fsb-hero-bg{z-index:-2;background:radial-gradient(circle at 12% 40%,rgba(16,191,243,.22),transparent 33%),radial-gradient(circle at 90% 20%,rgba(16,191,243,.12),transparent 26%),linear-gradient(90deg,rgba(8,9,10,.96) 0%,rgba(8,9,10,.86) 58%,rgba(8,9,10,.72) 100%),url('../images/cover.png') center/cover no-repeat;filter:saturate(.8)}
.fsb-hero-grid{grid-template-columns:minmax(0,1.32fr) minmax(340px,.68fr);gap:58px}
.fsb-hero-copy{min-width:0}
.fsb-hero h1{display:flex;flex-direction:column;gap:0;max-width:760px;font-size:clamp(64px,7.2vw,106px)!important;font-weight:900!important;line-height:.80!important;text-wrap:balance}
.fsb-hero h1 span,.fsb-hero h1 em{display:block;margin:0!important;padding:0!important}
.fsb-hero h1 em{font-family:"Barlow Condensed",Arial,sans-serif;font-style:italic;font-weight:900;background:linear-gradient(115deg,#66e8ff 0%,var(--fs-accent) 48%,#138bd2 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.fsb-hero p{max-width:650px!important;margin-top:28px!important;color:#bec5cc!important;font-size:17px!important;line-height:1.7!important}
.fsb-hero-art{position:relative;width:100%;max-width:460px;justify-self:end}
.fsb-hero-art img{position:relative;z-index:2;display:block;width:100%!important;height:auto!important;aspect-ratio:4/5;object-fit:cover;border:1px solid rgba(255,255,255,.12);border-radius:30px;box-shadow:0 36px 100px rgba(0,0,0,.78),0 0 70px rgba(16,191,243,.16)}
.fsb-hero-art::before{content:"";position:absolute;inset:8% -7% -6% 8%;z-index:1;border-radius:42px;background:linear-gradient(145deg,rgba(16,191,243,.32),transparent 65%);filter:blur(24px)}
.fsb-hero-art>span{position:absolute;z-index:3;left:-22px;bottom:30px;display:flex;flex-direction:column;min-width:150px;padding:15px 18px;border:1px solid rgba(255,255,255,.15);border-radius:14px;background:rgba(8,9,10,.86);box-shadow:0 15px 40px rgba(0,0,0,.45);backdrop-filter:blur(14px);font:700 12px/1.25 Inter,sans-serif;letter-spacing:.13em;text-transform:uppercase}
.fsb-hero-art>span b{color:var(--fs-accent);font:900 27px/1 "Barlow Condensed",sans-serif;letter-spacing:.02em}
.fsb-orbit{position:absolute;z-index:1;width:190px;height:190px;right:-55px;top:-48px;border:1px solid rgba(16,191,243,.4);border-radius:50%}.fsb-orbit::before,.fsb-orbit::after{content:"";position:absolute;border:1px solid rgba(16,191,243,.18);border-radius:50%}.fsb-orbit::before{inset:18px}.fsb-orbit::after{inset:42px;background:rgba(16,191,243,.07)}
.fsb-actions{margin-top:34px!important}.fsb-btn{min-height:52px;font-size:15px;line-height:1.1!important;box-shadow:0 14px 38px rgba(16,191,243,.18)}.fsb-btn.ghost{box-shadow:none}
.fsb-stats.mini{margin-top:58px!important;padding-top:26px;border-top:1px solid rgba(255,255,255,.09)}
.fsb-stats.mini b{font-size:42px!important;line-height:1!important}.fsb-stats.mini span{margin-top:7px;max-width:125px;line-height:1.35}
.fsb-section-head h2{font-size:clamp(50px,5.7vw,76px)!important;font-weight:900!important;line-height:.88!important}
.fsb-section-head p{max-width:690px;color:#aeb5bd!important;line-height:1.72!important}
.fsb-about-media{position:relative;aspect-ratio:4/5;overflow:hidden;border:1px solid rgba(255,255,255,.11);border-radius:30px;background:#090a0b;box-shadow:0 30px 90px rgba(0,0,0,.65)}
.fsb-about-media::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.72),transparent 42%);pointer-events:none}
.fsb-about-media .fsb-poster{position:absolute;inset:0 auto 0 0;width:180%!important;max-width:none!important;height:100%!important;object-fit:cover;border-radius:0;box-shadow:none}
.fsb-about-media>div{position:absolute;z-index:2;right:20px;bottom:20px;padding:15px 18px;border:1px solid rgba(255,255,255,.14);border-radius:14px;background:rgba(8,9,10,.82);backdrop-filter:blur(14px)}
.fsb-about-media small,.fsb-about-media strong{display:block}.fsb-about-media small{color:#aeb5bd;font-size:10px;letter-spacing:.16em;text-transform:uppercase}.fsb-about-media strong{margin-top:4px;font:900 25px/1 "Barlow Condensed",sans-serif;text-transform:uppercase}
.fsb-card{transition:transform .28s ease,border-color .28s ease,background .28s ease,box-shadow .28s ease}.fsb-card:hover{transform:translateY(-6px);border-color:rgba(16,191,243,.34);background:rgba(255,255,255,.055);box-shadow:0 22px 55px rgba(0,0,0,.28)}
.fsb-plan.featured:hover{transform:translateY(-16px)}
.fsb-transform{border:1px solid rgba(255,255,255,.1);box-shadow:inset 0 -100px 120px rgba(0,0,0,.55);transition:transform .35s ease,border-color .35s ease}.fsb-transform:hover{transform:translateY(-7px);border-color:rgba(16,191,243,.38)}
.fsb-video{border:1px solid rgba(255,255,255,.11);box-shadow:0 30px 85px rgba(0,0,0,.55)}
.fsb-faq details{transition:border-color .25s ease,background .25s ease}.fsb-faq summary::-webkit-details-marker{display:none}.fsb-faq details[open]{border-color:rgba(16,191,243,.35);background:rgba(16,191,243,.055)}
.fsb-cta{position:relative;overflow:hidden;box-shadow:0 32px 90px rgba(16,191,243,.22)}
.fsb-cta::after{content:"FITNESS SPOT";position:absolute;left:50%;bottom:-42px;transform:translateX(-50%);white-space:nowrap;color:rgba(255,255,255,.11);font:900 150px/1 "Barlow Condensed",sans-serif;letter-spacing:.03em;pointer-events:none}
.fsb-cta>*{position:relative;z-index:1}
@media(max-width:1024px){.fsb-hero{min-height:auto}.fsb-hero-grid{grid-template-columns:minmax(0,1fr) minmax(300px,.72fr);gap:34px}.fsb-hero h1{font-size:clamp(60px,8vw,88px)!important}.fsb-hero-art{max-width:390px}.fsb-stats.mini{grid-template-columns:repeat(4,1fr)}}
@media(max-width:820px){.fsb-hero-grid{grid-template-columns:1fr}.fsb-hero-art{display:none}.fsb-two{grid-template-columns:1fr}.fsb-about-media{max-width:560px;margin:auto}.fsb-hero h1{max-width:700px}}
@media(max-width:767px){.fsb-wrap{width:min(100% - 30px,1180px)}.fsb-nav-inner{min-height:68px}.fsb-nav .fsb-btn.small{padding:9px 14px;min-height:42px}.fsb-hero{padding:118px 0 70px!important}.fsb-hero h1{font-size:clamp(54px,17vw,76px)!important;line-height:.82!important}.fsb-hero p{font-size:15px!important;margin-top:24px!important}.fsb-section-head h2{font-size:clamp(44px,14vw,60px)!important}.fsb-section{padding:78px 0!important}.fsb-stats.mini{grid-template-columns:repeat(2,1fr);gap:24px 18px}.fsb-stats.mini>div{text-align:left}.fsb-stats.mini b{font-size:38px!important}.fsb-about-media{aspect-ratio:4/5}.fsb-cta{padding:58px 22px}.fsb-cta::after{font-size:86px;bottom:-20px}}
@media(max-width:782px){body.admin-bar .fsb-nav{top:46px}}
@media(prefers-reduced-motion:reduce){.fsb *{scroll-behavior:auto!important}.fsb-marquee div{animation:none}.fsb-card,.fsb-btn,.fsb-transform{transition:none}}

/* Version 2.1: interacciones, carrusel accesible y apilado scroll-driven. */
body.elementor-editor-preview .fsb-nav,body.fsb-elementor-editing .fsb-nav{position:relative;top:auto!important}
.fsb-brand img{display:block;width:auto;max-width:180px;height:44px;object-fit:contain;object-position:left center}
.fsb-footer .fsb-brand img{max-width:210px;height:52px}
.fsb-marquee-track>span{display:inline-flex;align-items:center;gap:28px;padding-right:28px}
.fsb-marquee-track>span i{color:var(--fs-accent);font-style:normal;font-size:.58em;opacity:.72}
.fsb-badges>span{display:flex;align-items:center;gap:12px}
.fsb-feature-icon,.fsb-badge-icon{display:grid;place-items:center;width:48px;height:48px;flex:0 0 48px;border:1px solid rgba(16,191,243,.14);border-radius:12px;background:rgba(16,191,243,.1);color:var(--fs-accent);font-style:normal;font-size:22px;line-height:1}
.fsb-badges .fsb-badge-icon{width:42px;height:42px;flex-basis:42px;padding:0!important;border:1px solid rgba(16,191,243,.14);border-radius:11px;background:rgba(16,191,243,.1);color:var(--fs-accent)}
.fsb-feature-grid .fsb-card .fsb-feature-icon i,.fsb-feature-grid .fsb-card .fsb-feature-icon span,.fsb-badge-icon i,.fsb-badge-icon span{display:grid;place-items:center;width:24px;height:24px;padding:0!important;border:0;border-radius:0;background:none;color:inherit;font-size:20px;line-height:1}
.fsb-feature-icon svg,.fsb-badge-icon svg{display:block;width:24px;height:24px;overflow:visible;color:inherit}
.fsb-testimonial-shell{position:relative;isolation:isolate}
.fsb-testimonial-track{display:grid;grid-auto-flow:column;grid-auto-columns:44%;gap:20px;overflow-x:auto;overflow-y:hidden;padding:8px 4px 26px;scroll-behavior:smooth;scroll-padding-inline:4px;scroll-snap-type:x mandatory;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.fsb-testimonial-track::-webkit-scrollbar{display:none}
.fsb-testimonial-track:focus-visible{outline:2px solid var(--fs-accent);outline-offset:5px}
.fsb-testimonial-track>.fsb-quote{min-width:0;min-height:330px;margin:0;scroll-snap-align:start;scroll-snap-stop:always}
.fsb-quote figcaption img,.fsb-quote .fsb-testimonial-avatar,.fsb-client-photo,.fsb-avatar-placeholder{display:block;width:48px;height:48px;flex:0 0 48px;border:2px solid rgba(16,191,243,.42);border-radius:50%;object-fit:cover;object-position:center;background:#0d1113}
.fsb-avatar-placeholder{display:grid;place-items:center;color:var(--fs-accent)}
.fsb-avatar-placeholder svg{display:block;width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.fsb-slider-arrow{position:absolute;z-index:5;top:50%;display:grid;place-items:center;width:48px;height:48px;padding:0;border:1px solid rgba(255,255,255,.22);border-radius:50%;background:rgba(8,9,10,.92);box-shadow:0 12px 34px rgba(0,0,0,.48);color:#fff;cursor:pointer;font:700 22px/1 Inter,Arial,sans-serif;transition:opacity .2s ease,visibility .2s ease,background .2s ease,border-color .2s ease,transform .2s ease}
.fsb-slider-arrow.prev{left:0;transform:translate(-50%,-50%)}
.fsb-slider-arrow.next{right:0;transform:translate(50%,-50%)}
.fsb-slider-arrow.prev:hover,.fsb-slider-arrow.prev:focus-visible{transform:translate(-50%,-50%) scale(1.08)}
.fsb-slider-arrow.next:hover,.fsb-slider-arrow.next:focus-visible{transform:translate(50%,-50%) scale(1.08)}
.fsb-slider-arrow:hover{border-color:var(--fs-accent);background:#0b252d;color:var(--fs-accent)}
.fsb-slider-arrow svg{display:block;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fsb-slider-arrow:focus-visible{outline:3px solid var(--fs-accent);outline-offset:3px}
.fsb-slider-arrow.is-disabled,.fsb-slider-arrow:disabled{opacity:0;visibility:hidden;pointer-events:none}

.fsb-video{outline:none;transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease}
.fsb-video img{transition:transform .55s cubic-bezier(.2,.8,.2,1),filter .35s ease}
.fsb-video>span,.fsb-video .fsb-video-play,.fsb-video .fsb-play{isolation:isolate;pointer-events:none;transition:transform .3s ease,background .3s ease,box-shadow .3s ease}
.fsb-video .fsb-video-play,.fsb-video .fsb-play{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:88px;height:88px;border:0;border-radius:50%;transform:translate(-50%,-50%);background:var(--fs-accent);color:#031016;font-size:30px}
.fsb-video>span::before,.fsb-video .fsb-video-play::before,.fsb-video .fsb-play::before{content:"";position:absolute;inset:-12px;z-index:-1;border:1px solid rgba(16,191,243,.65);border-radius:inherit;opacity:.45;transition:inset .3s ease,opacity .3s ease}
.fsb-video:hover,.fsb-video:focus-visible{transform:translateY(-4px);border-color:rgba(16,191,243,.5);box-shadow:0 38px 100px rgba(0,0,0,.65),0 0 55px rgba(16,191,243,.13)}
.fsb-video:hover img,.fsb-video:focus-visible img{transform:scale(1.035);filter:brightness(.68) saturate(1.08)}
.fsb-video:hover>span,.fsb-video:focus-visible>span,.fsb-video:hover .fsb-video-play,.fsb-video:focus-visible .fsb-video-play,.fsb-video:hover .fsb-play,.fsb-video:focus-visible .fsb-play{transform:translate(-50%,-50%) scale(1.1);background:#65e5ff;box-shadow:0 0 0 10px rgba(16,191,243,.12),0 14px 40px rgba(16,191,243,.38)}
.fsb-video:hover>span::before,.fsb-video:focus-visible>span::before,.fsb-video:hover .fsb-video-play::before,.fsb-video:focus-visible .fsb-video-play::before,.fsb-video:hover .fsb-play::before,.fsb-video:focus-visible .fsb-play::before{inset:-20px;opacity:0}
.fsb-video:focus-visible{outline:3px solid var(--fs-accent);outline-offset:5px}

.fsb-cta{display:flex!important;flex-direction:column;align-items:center!important;justify-content:center!important;text-align:center!important}
.fsb-cta>.fsb-eyebrow{justify-content:center!important;margin-left:auto!important;margin-right:auto!important;text-align:center!important}
.fsb-cta>h2,.fsb-cta>p{width:100%;margin-left:auto!important;margin-right:auto!important;text-align:center!important}
.fsb .fsb-cta p{margin:22px auto 0!important;text-align:center!important}
.fsb-cta .fsb-actions{width:100%;justify-content:center!important;align-items:center!important;margin-left:auto!important;margin-right:auto!important}

@media(max-width:1024px){.fsb-testimonial-track{grid-auto-columns:58%}}
@media(max-width:767px){
  .fsb-transform-grid{display:block;isolation:isolate;padding-bottom:140px;padding-bottom:clamp(100px,18svh,170px)}
  .fsb-transform-grid>.fsb-transform{width:100%;height:clamp(390px,68vh,560px);height:clamp(390px,68svh,560px);max-height:calc(100vh - var(--fsb-fixed-offset,84px) - 18px);max-height:calc(100svh - var(--fsb-fixed-offset,84px) - 18px);margin:0 0 20px;transform:none!important}
  @supports ((position:sticky) or (position:-webkit-sticky)){
    .fsb-transform-grid>.fsb-transform{position:-webkit-sticky;position:sticky;top:var(--fsb-fixed-offset,84px);z-index:var(--fsb-stack-index,1);margin-bottom:140px;margin-bottom:clamp(100px,18svh,170px);box-shadow:0 30px 75px rgba(0,0,0,.66)}
    .fsb-transform-grid>.fsb-transform:last-child{margin-bottom:0}
  }
  .fsb-testimonial-track{grid-auto-columns:min(88%,390px);gap:14px;padding:6px 2px 22px;scroll-padding-inline:2px;touch-action:pan-x pan-y}
  .fsb-testimonial-track>.fsb-quote{min-height:350px}
  .fsb-slider-arrow{top:50%;width:42px;height:42px;font-size:19px}
  .fsb-slider-arrow.prev{left:5px;transform:translate(0,-50%)}
  .fsb-slider-arrow.next{right:5px;transform:translate(0,-50%)}
  .fsb-slider-arrow.prev:hover,.fsb-slider-arrow.prev:focus-visible,.fsb-slider-arrow.next:hover,.fsb-slider-arrow.next:focus-visible{transform:translate(0,-50%) scale(1.06)}
}
@media(max-width:767px) and (prefers-reduced-motion:reduce){
  .fsb-transform-grid{padding-bottom:0}
  .fsb-transform-grid>.fsb-transform{position:relative;top:auto;z-index:auto;margin-bottom:20px;max-height:none}
}
@media(prefers-reduced-motion:reduce){
  .fsb-testimonial-track{scroll-behavior:auto;scroll-snap-type:none}
  .fsb-slider-arrow,.fsb-video,.fsb-video img,.fsb-video>span,.fsb-video .fsb-video-play,.fsb-video .fsb-play{transition:none!important}
  .fsb-video:hover,.fsb-video:focus-visible{transform:none}
  .fsb-video:hover img,.fsb-video:focus-visible img{transform:none}
}

/*
 * Version 2.2 — fidelidad cromática con el source original de Lovable.
 * Tokens fuente exactos:
 * background oklch(6% 0 0), card oklch(10% 0 0), foreground oklch(98% 0 0),
 * muted-foreground oklch(65% 0 0), primary oklch(75% .17 220),
 * gradient-primary 135deg: oklch(78% .18 215) -> oklch(62% .2 235),
 * border oklch(100% 0 0 / .08), glass card/60 + blur(16px), header blur(24px),
 * shadow-brand 0 20px 60px -15px primary/.45, shadow-elegant 0 30px 80px -20px black/.6.
 */
.fsb{
  --fs-bg:#010101;
  --fs-card:#030303;
  --fs-text:#f8f8f8;
  --fs-muted:#8f8f8f;
  --fs-accent:#00c4f7;
  --fs-accent-start:#00d2fe;
  --fs-accent-end:#0093eb;
  --fs-accent-ink:#020202;
  --fs-border:rgba(255,255,255,.08);
  --fs-border-soft:rgba(255,255,255,.05);
  --fs-gradient-primary:linear-gradient(135deg,var(--fs-accent-start),var(--fs-accent-end));
  --fs-shadow-brand:0 20px 60px -15px rgba(0,196,247,.45);
  --fs-shadow-elegant:0 30px 80px -20px rgba(0,0,0,.6);
  --fs-glass:rgba(3,3,3,.6);
  background-color:var(--fs-bg);
}
@supports (color:oklch(50% 0 0)){
  .fsb{
    --fs-bg:oklch(6% 0 0);--fs-card:oklch(10% 0 0);--fs-text:oklch(98% 0 0);--fs-muted:oklch(65% 0 0);
    --fs-accent:oklch(75% .17 220);--fs-accent-start:oklch(78% .18 215);--fs-accent-end:oklch(62% .2 235);--fs-accent-ink:oklch(8% 0 0);
    --fs-border:oklch(100% 0 0/.08);--fs-border-soft:oklch(100% 0 0/.05);
    --fs-shadow-brand:0 20px 60px -15px oklch(75% .17 220/.45);--fs-shadow-elegant:0 30px 80px -20px oklch(0% 0 0/.6)
  }
}
@supports (color:color-mix(in oklab,black,white)){.fsb{--fs-glass:color-mix(in oklab,var(--fs-card) 60%,transparent);--fs-shadow-brand:0 20px 60px -15px color-mix(in oklab,var(--fs-accent) 45%,transparent)}}
.fsb.fsb-section,.fsb.fsb-hero,.fsb.fsb-footer{background-color:var(--fs-bg)}
.fsb.fsb-section.alt{background-color:var(--fs-bg);background-image:linear-gradient(color-mix(in oklab,var(--fs-card) 20%,transparent),color-mix(in oklab,var(--fs-card) 20%,transparent))}
#about.fsb.fsb-section{background-color:var(--fs-bg);background-image:linear-gradient(to bottom,var(--fs-bg),color-mix(in oklab,var(--fs-card) 20%,transparent))}
.fsb-section::before{content:none!important;background:none!important}

/* Header: transparente en reposo; background/80, borde white/5 y blur-xl (24px) al hacer scroll. */
.fsb-nav{background:transparent;border-bottom-color:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;transition:background-color .3s ease,border-color .3s ease,box-shadow .3s ease,-webkit-backdrop-filter .3s ease,backdrop-filter .3s ease}
.fsb-nav.is-scrolled{background:rgba(1,1,1,.8);background:color-mix(in oklab,var(--fs-bg) 80%,transparent);border-bottom-color:var(--fs-border-soft);box-shadow:none;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}
.fsb-brand b{background:var(--fs-gradient-primary);color:var(--fs-accent-ink)}
.fsb-nav .fsb-btn.small{background:var(--fs-accent);color:var(--fs-accent-ink)!important;box-shadow:none}
.fsb-nav .fsb-btn.small:hover{transform:none;filter:none;opacity:.9}

/* Gradiente tipográfico compartido por los spans de títulos y las métricas del source. */
.fsb .fsb-gradient-text,.fsb-hero h1 em,.fsb-stats b,.fsb-transform b,.fsb-steps article>b{background:var(--fs-gradient-primary);color:transparent!important;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.fsb .fsb-gradient-text{display:inline;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.fsb-section-head p,.fsb-hero p,.fsb-card p,.fsb-steps p,.fsb-transform p,.fsb-transform small,.fsb-quote figcaption small,.fsb-footer-grid p,.fsb-footer-grid small,.fsb-copy{color:var(--fs-muted)!important}

/* Hero: imagen al 40% y overlay background/60 -> background/70 -> background; sin rejilla decorativa. */
.fsb-hero{isolation:isolate;background-color:var(--fs-bg)}
.fsb-hero-bg{z-index:0;background:none!important;filter:none;opacity:1}
.fsb-hero-bg::before,.fsb-hero-bg::after{content:"";position:absolute;inset:0;pointer-events:none}
.fsb-hero-bg::before{z-index:0;background-image:var(--fsb-hero-bg,url('../images/hero-bg.jpg'));background-position:center;background-size:cover;background-repeat:no-repeat;opacity:var(--fsb-hero-image-opacity,.4)}
.fsb-hero-bg::after{z-index:1;background:linear-gradient(to bottom,rgba(1,1,1,.6),rgba(1,1,1,.7),#010101);background:linear-gradient(to bottom,color-mix(in oklab,var(--fs-bg) 60%,transparent),color-mix(in oklab,var(--fs-bg) 70%,transparent),var(--fs-bg))}
.fsb-hero::before{content:"";position:absolute;z-index:2;left:-160px;top:33.333%;width:384px;height:384px;border-radius:50%;background:rgba(16,191,243,.2);background:color-mix(in oklab,var(--fs-accent) 20%,transparent);filter:blur(120px);pointer-events:none}
.fsb-hero::after{content:none}
.fsb-hero-grid{z-index:3}
.fsb-hero-art::before{inset:-32px;z-index:1;border-radius:50%;background:rgba(16,191,243,.2);background:color-mix(in oklab,var(--fs-accent) 20%,transparent);filter:blur(64px)}
.fsb-hero-art img{border:0;border-radius:24px;box-shadow:var(--fs-shadow-elegant)}
.fsb-orbit{display:none}

/* Botones del source: gradient-primary + shadow-brand y escala 105%. */
.fsb-btn{background:var(--fs-gradient-primary);color:var(--fs-accent-ink)!important;box-shadow:var(--fs-shadow-brand);transition:transform .15s ease,background-color .15s ease,border-color .15s ease,opacity .15s ease,filter .15s ease}
.fsb-btn:hover{transform:scale(1.05);filter:none}
.fsb-btn.ghost{background:transparent;border-color:oklch(100% 0 0/.2);box-shadow:none;color:var(--fs-text)!important}
.fsb-btn.ghost:hover{transform:none;background:oklch(100% 0 0/.05);filter:none}

/* Marquee: card/30, bordes white/5, texto white/10 y separador primary/40. */
.fsb-marquee{padding:32px 0;border-color:var(--fs-border-soft);background-color:var(--fs-bg);background-image:linear-gradient(color-mix(in oklab,var(--fs-card) 30%,transparent),color-mix(in oklab,var(--fs-card) 30%,transparent))}
.fsb-marquee .fsb-marquee-track{color:oklch(100% 0 0/.1);font-size:clamp(36px,5vw,60px);animation-duration:30s}
.fsb-marquee-track>span{gap:64px;padding-right:64px}
.fsb-marquee-track>span i{color:color-mix(in oklab,var(--fs-accent) 40%,transparent);opacity:1}

/* About: glow primary/10 con blur-3xl (64px), imagen y glass card del source. */
.fsb-about-media{isolation:isolate;aspect-ratio:6/7;overflow:visible;border:0;border-radius:24px;background:transparent;box-shadow:var(--fs-shadow-elegant)}
.fsb-about-media::before{content:"";position:absolute;inset:-16px;z-index:-1;border-radius:50%;background:rgba(16,191,243,.1);background:color-mix(in oklab,var(--fs-accent) 10%,transparent);filter:blur(64px);pointer-events:none}
.fsb-about-media::after{content:none}
.fsb-about-media .fsb-poster{inset:0;width:100%!important;max-width:100%!important;height:100%!important;border-radius:24px;object-fit:cover;box-shadow:none}
.fsb-about-media>div{right:-24px;bottom:-24px;padding:16px 24px;border:1px solid var(--fs-border);border-radius:16px;background:rgba(3,3,3,.6);background:var(--fs-glass);box-shadow:none;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.fsb-badges>span{padding:12px 16px;border:1px solid var(--fs-border);border-radius:12px;background:rgba(3,3,3,.6);background:var(--fs-glass);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.fsb-badges .fsb-badge-icon{width:20px;height:20px;flex-basis:20px;padding:0!important;border:0;background:transparent;color:var(--fs-accent)}
.fsb-badges .fsb-badge-icon i,.fsb-badges .fsb-badge-icon span,.fsb-badges .fsb-badge-icon svg{width:20px;height:20px;color:var(--fs-accent);font-size:20px}

/* Glass cards, planes y beneficios: estados exactos del source. */
.fsb-card,.fsb-stats>div,.fsb-faq details{border:1px solid var(--fs-border);background:rgba(3,3,3,.6);background:var(--fs-glass);box-shadow:none;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.fsb-card{transition:transform .15s ease,border-color .15s ease,background-color .15s ease,box-shadow .15s ease}
.fsb-card:hover{transform:none;border-color:var(--fs-border);background:rgba(3,3,3,.6);background:var(--fs-glass);box-shadow:none}
.fsb-plan:hover{transform:translateY(-8px)}
.fsb-card.fsb-plan.featured,.fsb-card.fsb-plan.featured:hover{background:var(--fs-gradient-primary);color:var(--fs-accent-ink);box-shadow:var(--fs-shadow-brand)}
.fsb-plan.featured{transform:none}
.fsb-plan.featured:hover{transform:translateY(-8px)}
.fsb-plan .fsb-btn{box-shadow:none}
.fsb-plan:not(.featured) .fsb-btn{background:oklch(100% 0 0/.05);border-color:oklch(100% 0 0/.1);color:var(--fs-text)!important}
.fsb-plan:not(.featured) .fsb-btn:hover{transform:none;background:oklch(100% 0 0/.1)}
.fsb-plan.featured .fsb-btn{background:oklch(0% 0 0);color:var(--fs-accent)!important}
.fsb-plan.featured .fsb-btn:hover{transform:none;background:oklch(0% 0 0/.8)}
.fsb-feature-grid .fsb-card:hover{transform:none;border-color:color-mix(in oklab,var(--fs-accent) 40%,transparent);background:rgba(3,3,3,.6);background:var(--fs-glass)}
.fsb-feature-icon{border:0;background:rgba(16,191,243,.1);background:color-mix(in oklab,var(--fs-accent) 10%,transparent);color:var(--fs-accent);transition:background-color .15s ease,color .15s ease}
.fsb-feature-grid .fsb-card:hover .fsb-feature-icon{background:var(--fs-accent);color:var(--fs-accent-ink)}
.fsb-feature-grid .fsb-card .fsb-feature-icon i,.fsb-feature-grid .fsb-card .fsb-feature-icon span,.fsb-feature-grid .fsb-card .fsb-feature-icon svg{color:inherit}
.fsb-faq details[open]{border-color:var(--fs-border);background:rgba(3,3,3,.6);background:var(--fs-glass)}

/* Las fotografías de transformación son 4:3 en el source; conservar la proporción evita cortar ambos sujetos. */
.fsb-transform{height:auto;aspect-ratio:4/3;background-position:center;background-size:cover;background-repeat:no-repeat}

/* Video: overlay y play gradient del source; sólo el play escala al 110%. */
.fsb-video{border:0;box-shadow:var(--fs-shadow-elegant)}
.fsb-video::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,oklch(0% 0 0/.8),transparent,oklch(0% 0 0/.3));pointer-events:none}
.fsb-video img{position:relative;z-index:0;filter:none;opacity:.7}
.fsb-video>strong{z-index:3}
.fsb-video .fsb-video-play,.fsb-video .fsb-play{z-index:3;background:var(--fs-gradient-primary);color:var(--fs-accent-ink);box-shadow:var(--fs-shadow-brand)}
.fsb-video>span::before,.fsb-video .fsb-video-play::before,.fsb-video .fsb-play::before{content:none}
.fsb-video:hover,.fsb-video:focus-visible{transform:none;border-color:transparent;box-shadow:var(--fs-shadow-elegant)}
.fsb-video:hover img,.fsb-video:focus-visible img{transform:none;filter:none}
.fsb-video:hover>span,.fsb-video:focus-visible>span,.fsb-video:hover .fsb-video-play,.fsb-video:focus-visible .fsb-video-play,.fsb-video:hover .fsb-play,.fsb-video:focus-visible .fsb-play{transform:translate(-50%,-50%) scale(1.1);background:var(--fs-gradient-primary);box-shadow:var(--fs-shadow-brand)}

/* CTA conserva sus glows, sin la rejilla decorativa global. */
.fsb-cta{border-radius:40px;background:radial-gradient(circle at -40px -40px,oklch(100% 0 0/.2),transparent 260px),radial-gradient(circle at calc(100% + 40px) calc(100% + 40px),oklch(0% 0 0/.3),transparent 260px),var(--fs-gradient-primary);box-shadow:none;color:var(--fs-accent-ink)}
.fsb-cta::after{content:none}
.fsb-cta .fsb-eyebrow{color:var(--fs-accent-ink)}
.fsb-cta .fsb-eyebrow span{background:var(--fs-accent-ink)}
.fsb-btn.ghost-light{background:oklch(8% 0 0/.1);border-color:oklch(8% 0 0/.3);box-shadow:none;color:var(--fs-accent-ink)!important;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.fsb-btn.ghost-light:hover{transform:none;background:oklch(8% 0 0/.2)}

/* Footer: background, bordes y sociales SVG idénticos al source. */
.fsb-footer{background-color:var(--fs-bg);border-top-color:var(--fs-border-soft)}
.fsb-footer-grid{gap:40px;padding:64px 0}
.fsb-footer-grid>div:first-child p{margin-top:16px!important}
.fsb-footer-grid>div:not(:first-child) p{margin-top:16px!important}
.fsb-social{gap:12px;margin-top:24px}
.fsb-social a{width:40px;height:40px;border-color:oklch(100% 0 0/.1);color:var(--fs-text);font-size:0;transition:background-color .15s ease,border-color .15s ease,color .15s ease,transform .15s ease}
.fsb-social a:hover,.fsb-social a:focus-visible{border-color:var(--fs-accent);background:var(--fs-accent);color:var(--fs-accent-ink);transform:none}
.fsb-social a:focus-visible{outline:2px solid var(--fs-accent);outline-offset:3px}
.fsb-social-icon{display:grid;place-items:center;width:16px;height:16px;color:inherit}
.fsb-social-icon svg,.fsb-social a>svg{display:block;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fsb-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.fsb-footer-grid>div:not(:first-child) a:hover{color:var(--fs-accent)}
.fsb-footer .fsb-social a:hover,.fsb-footer .fsb-social a:focus-visible{color:var(--fs-accent-ink)}
.fsb-copy{border-top-color:var(--fs-border-soft);padding:24px}

@media(max-width:767px){
  .fsb-about-media>div{display:none}
  .fsb-cta{padding:48px 22px}
  .fsb-marquee-track>span{gap:64px;padding-right:64px}
  .fsb-transform-grid>.fsb-transform{height:auto!important;min-height:0;max-height:none!important;aspect-ratio:4/3;background-position:center!important;background-size:cover!important;background-repeat:no-repeat!important}
  .fsb-four,.fsb-stats{grid-template-columns:1fr}
  .fsb-stats.mini{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:640px) and (max-width:767px){.fsb-badges,.fsb-feature-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:768px) and (max-width:1023px){.fsb-four,.fsb-stats{grid-template-columns:repeat(4,1fr)}}
@media(max-width:1023px){
  .fsb-hero-grid,.fsb-two{grid-template-columns:1fr}
  .fsb-hero-art{display:none}
  .fsb-about-media{width:min(100%,560px);margin-right:auto;margin-left:auto}
}
@media(prefers-reduced-motion:reduce){
  .fsb-btn,.fsb-card,.fsb-badges>span,.fsb-feature-icon,.fsb-social a{transition:none!important}
  .fsb-btn:hover,.fsb-plan:hover,.fsb-plan.featured:hover{transform:none}
}

/* ============================================================
   2.3.0 — Correcciones de producción, personalización y pulido
   ============================================================ */

/* Variables que alimentan la pestaña Estilo. Los valores por defecto
   reproducen exactamente el aspecto de la 2.2: nada cambia hasta que
   alguien toca un control en Elementor. */
.fsb{
  --fs-btn-bg:var(--fs-gradient-primary);
  --fs-btn-ink:var(--fs-accent-ink,#031016);
  --fs-btn-bg-hover:var(--fs-btn-bg);
  --fs-btn-ink-hover:var(--fs-btn-ink);
  --fs-icon-size:24px;
  --fs-icon-box:48px;
  --fs-icon-color:var(--fs-accent);
  --fs-icon-bg:rgba(16,191,243,.1);
  --fs-ease:cubic-bezier(.22,.61,.36,1);
  --fs-whatsapp:#25d366;
}
@supports (color:color-mix(in oklab,black,white)){
  .fsb{--fs-icon-bg:color-mix(in oklab,var(--fs-accent) 10%,transparent)}
}

/* Botón principal enrutado por variables: el control de color gana sin
   pelear con el !important heredado. Los fantasma conservan su estilo. */
.fsb .fsb-btn:not(.ghost):not(.ghost-light):not(.dark){
  background:var(--fs-btn-bg);color:var(--fs-btn-ink)!important;
}
.fsb .fsb-btn:not(.ghost):not(.ghost-light):not(.dark):hover{
  background:var(--fs-btn-bg-hover);color:var(--fs-btn-ink-hover)!important;
}

/* Texto enriquecido (wp_kses_post) — hereda el color de cuerpo. */
.fsb .fsb-rich{color:var(--fs-muted);line-height:1.65}
.fsb .fsb-rich>:first-child{margin-top:0}
.fsb .fsb-rich>:last-child{margin-bottom:0}
.fsb .fsb-rich p{margin:0 0 1em}
.fsb .fsb-rich ul,.fsb .fsb-rich ol{margin:0 0 1em;padding-left:1.25em}
.fsb .fsb-rich li{margin:.35em 0}
.fsb .fsb-rich strong,.fsb .fsb-rich b{color:var(--fs-text);font-weight:700}
.fsb .fsb-rich a{color:var(--fs-accent);text-decoration:underline;text-underline-offset:3px}
.fsb-section-head .fsb-rich{max-width:70ch;font-size:17px}
.fsb-section-head.is-center .fsb-rich{margin-left:auto;margin-right:auto}

/* ---- P0.1 Transformaciones: foto como <img>, no como background ----
   El lazy-load de fondos de Elementor inyecta
   `.e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded) * {background-image:none!important}`
   y ese !important gana al style inline. Un <img> es inmune, y además
   aporta srcset, alt y lazy nativo. */
.fsb-transform{position:relative;overflow:hidden;isolation:isolate}
.fsb-transform-photo{
  position:absolute;inset:0;z-index:0;display:block;
  width:100%;height:100%;max-width:none;
  object-fit:cover;object-position:center 22%;
  border-radius:inherit;
  transition:transform .55s var(--fs-ease);
}
.fsb-transform.has-photo::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to top,rgba(0,0,0,.93) 0%,rgba(0,0,0,.62) 45%,rgba(0,0,0,.10) 100%);
}
.fsb-transform-body,.fsb-transform>div{position:relative;z-index:2}
.fsb-transform::after{z-index:2}
.fsb-transform-body h3{margin-top:14px;font-size:26px;line-height:1.02}
.fsb-transform-body p{margin:10px 0 0;font-size:14px;line-height:1.6}
.fsb-transform-body small{display:block;margin-top:2px}

/* ---- P0.2 Sticky móvil ----
   La 2.2 forzaba `height:auto!important` + `aspect-ratio:4/3`, lo que dejaba
   tarjetas de ~260px apiladas con separaciones de hasta 170px: el efecto
   saltaba y dejaba huecos. Volvemos a una altura relativa al viewport y
   dejamos que object-fit recorte, que es para lo que sirve. */
@media(max-width:767px){
  .fsb-transform-grid{display:block;isolation:isolate;padding-bottom:0}
  .fsb-transform-grid>.fsb-transform{
    width:100%;
    aspect-ratio:auto!important;
    height:min(74vh,540px)!important;
    height:min(74svh,540px)!important;
    min-height:340px;
    max-height:none!important;
    margin:0 0 18px;
    transform:none!important;
  }
  @media(prefers-reduced-motion:no-preference){
    .fsb-transform-grid>.fsb-transform{
      position:-webkit-sticky;position:sticky;
      top:var(--fsb-fixed-offset,84px);
      z-index:var(--fsb-stack-index,1);
      margin-bottom:22px;
      box-shadow:0 26px 60px rgba(0,0,0,.62);
    }
    /* El hueco que permite ver el apilado va DESPUÉS de la última tarjeta,
       no entre todas: así no aparecen bandas vacías al hacer scroll. */
    .fsb-transform-grid>.fsb-transform:last-child{margin-bottom:0}
    .fsb-transform-grid::after{content:"";display:block;height:clamp(80px,14svh,140px)}
  }
  @media(prefers-reduced-motion:reduce){
    .fsb-transform-grid>.fsb-transform{position:relative;top:auto;z-index:auto;margin-bottom:18px}
    .fsb-transform-grid::after{content:none}
  }
}

/* ---- P0.3 FAQ: chevron de acento que gira al abrir ---- */
.fsb-faq summary{align-items:center;gap:18px}
.fsb-faq-q{flex:1 1 auto;min-width:0}
.fsb-faq-icon{
  display:grid;place-items:center;flex:0 0 26px;width:26px;height:26px;
  color:var(--fs-accent);
  transition:transform .3s var(--fs-ease),color .2s ease;
}
.fsb-faq-icon svg{display:block;width:20px;height:20px}
.fsb-faq details[open] .fsb-faq-icon{transform:rotate(180deg)}
.fsb-faq summary:hover .fsb-faq-icon{color:var(--fs-text)}
.fsb-faq .fsb-faq-a{margin:0;padding:0 0 22px;color:var(--fs-muted)}

/* ---- P0.4 Icono de WhatsApp en el botón del CTA ----
   Usa currentColor, no el verde de marca: sobre el degradado azul del CTA
   el verde choca. El verde queda reservado al footer, donde identifica canal. */
.fsb-btn-icon{
  display:inline-grid;place-items:center;
  width:1.2em;height:1.2em;margin-right:.5em;
  color:inherit;flex:0 0 auto;
}
.fsb-btn-icon svg{display:block;width:100%;height:100%}

/* ---- P0.5 Footer: enlaces blancos e iconos por canal ---- */
.fsb-footer-grid a{color:var(--fs-text)}
.fsb-contact,.fsb-footer-links{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:12px}
.fsb-contact-link{
  display:inline-flex;align-items:center;gap:11px;
  color:var(--fs-text);font-size:14px;line-height:1.45;
  transition:color .18s ease;
}
.fsb-footer-grid .fsb-contact-link,.fsb-footer-grid .fsb-contact-text{color:var(--fs-text)}
a.fsb-contact-link:hover,a.fsb-contact-link:focus-visible{color:var(--fs-accent)}
.fsb-contact-icon{
  display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;
  border:1px solid var(--fs-border);border-radius:10px;
  background:var(--fs-glass);color:var(--fs-accent);
  transition:border-color .18s ease,background-color .18s ease,color .18s ease;
}
.fsb-contact-icon svg{display:block;width:16px;height:16px}
.fsb-contact-item.is-whatsapp .fsb-contact-icon{
  color:var(--fs-whatsapp);
  border-color:rgba(37,211,102,.34);
  background:rgba(37,211,102,.12);
}
a.fsb-contact-link:hover .fsb-contact-icon{border-color:var(--fs-accent);background:var(--fs-accent);color:var(--fs-accent-ink)}
.fsb-contact-item.is-whatsapp a.fsb-contact-link:hover .fsb-contact-icon,
a.fsb-contact-link:hover .is-whatsapp{background:var(--fs-whatsapp);border-color:var(--fs-whatsapp);color:#04170b}
.fsb-footer-links a{display:inline-block;font-size:14px;color:var(--fs-text)}
.fsb-footer-links a:hover,.fsb-footer-links a:focus-visible{color:var(--fs-accent)}
.fsb-footer-grid .fsb-footer-col small{display:block;margin-bottom:2px}
.fsb-footer a:focus-visible,.fsb-faq summary:focus-visible{outline:2px solid var(--fs-accent);outline-offset:3px;border-radius:6px}

/* ---- Testimonios: nombres en blanco (venían en #333 del tema) ---- */
.fsb .fsb-quote figcaption .fsb-client-name,
.fsb .fsb-quote figcaption strong{color:var(--fs-text)!important;font-weight:700;letter-spacing:.01em}
.fsb .fsb-quote figcaption small{color:var(--fs-muted)}

/* ---- P2 Escala única de iconos, gobernada por la pestaña Estilo ---- */
.fsb .fsb-feature-icon,.fsb .fsb-badge-icon{
  width:var(--fs-icon-box);height:var(--fs-icon-box);flex-basis:var(--fs-icon-box);
  border-radius:calc(var(--fs-icon-box) / 4);
  background:var(--fs-icon-bg);color:var(--fs-icon-color);
}
.fsb .fsb-feature-icon svg,.fsb .fsb-badge-icon svg,
.fsb .fsb-feature-icon i,.fsb .fsb-badge-icon i,
.fsb .fsb-feature-icon span,.fsb .fsb-badge-icon span{
  width:var(--fs-icon-size);height:var(--fs-icon-size);font-size:var(--fs-icon-size);
}
.fsb-badges .fsb-badge-icon{
  width:var(--fs-icon-size);height:var(--fs-icon-size);flex-basis:var(--fs-icon-size);
  border-radius:0;background:transparent;color:var(--fs-icon-color);
}

/* ---- P2 Beneficios ---- */
.fsb-feature-grid .fsb-card{display:flex;flex-direction:column;padding:28px 24px}
.fsb-feature-grid .fsb-card h3{margin:20px 0 8px;font-size:22px;line-height:1.05;letter-spacing:.01em}
.fsb-feature-grid .fsb-card p,.fsb-feature-grid .fsb-card .fsb-rich{margin:0;font-size:14px;line-height:1.6}
@media(min-width:768px) and (max-width:1099px){
  .fsb-feature-grid{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:1100px){
  .fsb-feature-grid{grid-template-columns:repeat(4,1fr)}
}

/* ---- P2 Sobre el Coach ---- */
@media(min-width:1024px){
  .fsb-two{grid-template-columns:1fr 1.08fr;gap:64px;align-items:center}
}
.fsb-badges{gap:12px;margin:28px 0 32px}
.fsb-badges>span{
  display:flex;align-items:center;gap:12px;
  padding:13px 16px;font-size:14px;line-height:1.3;
}
.fsb-about-media>div small{display:block;margin-bottom:2px;font-size:11px;letter-spacing:.18em}
.fsb-about-media>div strong{font-family:"Barlow Condensed",Arial,sans-serif;font-size:20px;text-transform:uppercase}

/* ---- P2 Cómo funciona: se lee como secuencia, no como cuatro tarjetas sueltas ---- */
.fsb-steps article{position:relative;padding-top:22px;border-top:1px solid var(--fs-border)}
.fsb-steps article>b{display:block;font-size:clamp(44px,5vw,64px);line-height:1;opacity:1}
.fsb-steps h3{margin:14px 0 8px;font-size:22px;line-height:1.05}
.fsb-steps p,.fsb-steps .fsb-rich{margin:0;font-size:14px;line-height:1.6}
@media(min-width:768px){
  .fsb-steps article::after{
    content:"";position:absolute;top:-1px;left:0;height:1px;width:0;
    background:var(--fs-gradient-primary);
    transition:width .7s var(--fs-ease);
  }
  .fsb-steps article.is-visible::after{width:100%}
}

/* ---- P2 Planes ---- */
.fsb-plan{padding:30px 24px;min-height:0}
.fsb-plan>small{font-size:11px;letter-spacing:.16em;opacity:.85}
.fsb-plan h3{margin:12px 0 0;font-size:30px;line-height:1}
.fsb-plan .price{display:flex;align-items:baseline;gap:4px;margin:18px 0 22px;font-size:clamp(40px,3.4vw,50px);line-height:1}
.fsb-plan .price sup{position:static;top:auto;font:600 14px Inter,sans-serif;opacity:.75}
.fsb-plan .price small{font:500 13px Inter,sans-serif;opacity:.75}
.fsb-plan ul{margin:0 0 24px}
.fsb-plan li{display:flex;gap:8px;margin:10px 0;font-size:13.5px;line-height:1.5}
.fsb-plan .fsb-btn{width:100%}
@media(min-width:768px) and (max-width:1099px){
  .fsb-plan-grid{grid-template-columns:repeat(2,1fr)}
  .fsb-plan.featured{transform:none}
}

/* ============================================================
   P3 Movimiento — sólo opacity y transform, cero CLS.
   Todo dentro de prefers-reduced-motion: no-preference.
   ============================================================ */
@media(prefers-reduced-motion:no-preference){
  .fsb-reveal{
    opacity:0;transform:translate3d(0,20px,0);
    transition:opacity .55s var(--fs-ease),transform .55s var(--fs-ease);
    transition-delay:var(--fsb-reveal-delay,0ms);
  }
  .fsb-reveal.is-visible{opacity:1;transform:none}
}
@media(prefers-reduced-motion:reduce){
  .fsb-reveal{opacity:1;transform:none}
}

@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .fsb-feature-grid .fsb-card{transition:transform .28s var(--fs-ease),border-color .28s ease,background-color .28s ease}
  .fsb-feature-grid .fsb-card:hover{transform:translateY(-5px)}
  .fsb-plan{transition:transform .28s var(--fs-ease),box-shadow .28s ease}
  .fsb-plan:not(.featured):hover{transform:translateY(-6px)}
  .fsb-plan.featured:hover{transform:translateY(-16px)}
  .fsb-badges>span{transition:transform .22s var(--fs-ease),border-color .22s ease}
  .fsb-badges>span:hover{transform:translateY(-3px);border-color:rgba(16,191,243,.34)}
  .fsb-transform:hover .fsb-transform-photo{transform:scale(1.06)}
  .fsb-quote{transition:transform .28s var(--fs-ease),border-color .28s ease}
  .fsb-quote:hover{transform:translateY(-4px)}
}

/* El widget de Transformaciones no puede quedar recortado o el sticky muere.
   Acotado a nuestro propio widget: no toca contenedores ajenos. */
.elementor-widget-fitness_spot_transformations,
.elementor-widget-fitness_spot_transformations > .elementor-widget-container{overflow:visible}

@media(prefers-reduced-motion:reduce){
  .fsb-steps article::after{transition:none}
  .fsb-transform-photo{transition:none}
}

/* Red de seguridad del reveal, en CSS puro: si el JS muriera después de marcar
   los nodos, a los 6 s la animación los deja visibles igualmente. Nunca se
   queda contenido en opacity:0 por un fallo de script. */
@media(prefers-reduced-motion:no-preference){
  .fsb-reveal{animation:fsbRevealFailsafe 1ms linear 6s forwards}
  .fsb-reveal.is-visible{animation:none}
}
@keyframes fsbRevealFailsafe{to{opacity:1;transform:none}}

/* ============================================================
   2.4.0 — Iconos visibles, Beneficios y capa de movimiento
   ============================================================ */

/* ---- Iconos ----
   Elementor convierte los iconos de Font Awesome en SVG en línea, pero la hoja
   que les da fill:currentColor sólo se encola si un widget la declara como
   dependencia. Sin ella el SVG usa el fill por defecto, que es NEGRO: sobre
   fondo oscuro, un icono invisible. Esto lo arregla para cualquier icono que
   elija la agencia, venga de donde venga. */
.fsb .fsb-feature-icon svg,
.fsb .fsb-badge-icon svg,
.fsb .fsb-contact-icon svg,
.fsb .fsb-btn-icon svg,
.fsb .fsb-faq-icon svg{color:inherit}
.fsb .fsb-feature-icon svg:not(.fsb-glyph),
.fsb .fsb-badge-icon svg:not(.fsb-glyph){fill:currentColor;stroke:none}
/* El set propio es de trazo: nunca relleno. */
.fsb svg.fsb-glyph{fill:none;stroke:currentColor;overflow:visible}

/* ---- Beneficios: tarjetas con aire y un icono con presencia ---- */
.fsb-feature-grid{gap:24px}
.fsb-feature-grid .fsb-card{
  min-height:230px;padding:32px 28px;
  justify-content:flex-start;
}
.fsb-feature-grid .fsb-card h3{margin:22px 0 10px;font-size:21px;letter-spacing:.005em}
.fsb-feature-grid .fsb-card p,.fsb-feature-grid .fsb-card .fsb-rich{font-size:14.5px;line-height:1.62}
.fsb .fsb-feature-icon{
  --fs-icon-box:54px;--fs-icon-size:26px;
  border:1px solid rgba(16,191,243,.22);
  border-radius:16px;
  background:var(--fs-icon-bg);
  color:var(--fs-icon-color);
  box-shadow:0 0 0 0 rgba(16,191,243,.28);
  transition:background-color .3s var(--fs-ease),color .3s var(--fs-ease),
             border-color .3s var(--fs-ease),box-shadow .45s var(--fs-ease),
             transform .35s var(--fs-ease);
}
@supports (color:color-mix(in oklab,black,white)){
  .fsb .fsb-feature-icon{border-color:color-mix(in oklab,var(--fs-accent) 22%,transparent)}
}
.fsb .fsb-feature-icon svg{width:var(--fs-icon-size);height:var(--fs-icon-size)}
/* Al pasar por la tarjeta el icono se enciende: es el gesto que pedía el diseño. */
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .fsb-feature-grid .fsb-card:hover .fsb-feature-icon{
    background:var(--fs-gradient-primary);
    border-color:transparent;color:var(--fs-accent-ink);
    box-shadow:0 10px 30px -8px rgba(16,191,243,.55);
    transform:translateY(-2px) rotate(-4deg);
  }
}

/* ---- Sobre el Coach: cada distintivo con su chip de icono ---- */
.fsb-badges>span{gap:14px;padding:14px 18px}
.fsb .fsb-badges .fsb-badge-icon{
  display:grid;place-items:center;
  width:34px;height:34px;flex:0 0 34px;
  border:1px solid rgba(16,191,243,.22);
  border-radius:11px;
  background:var(--fs-icon-bg);
  color:var(--fs-icon-color);
  transition:background-color .3s var(--fs-ease),color .3s var(--fs-ease),border-color .3s var(--fs-ease);
}
@supports (color:color-mix(in oklab,black,white)){
  .fsb .fsb-badges .fsb-badge-icon{border-color:color-mix(in oklab,var(--fs-accent) 22%,transparent)}
}
.fsb .fsb-badges .fsb-badge-icon svg{width:19px;height:19px}
.fsb-badge-text{flex:1 1 auto;min-width:0}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .fsb-badges>span:hover .fsb-badge-icon{
    background:var(--fs-gradient-primary);border-color:transparent;color:var(--fs-accent-ink);
  }
}

/* ============================================================
   Movimiento. Todas las transformaciones se componen mediante
   variables para que reveal, hover, tilt y parallax no se pisen:
   un elemento sólo puede tener una propiedad `transform`.
   ============================================================ */
.fsb-reveal{transform:translate3d(0,var(--fsb-ty,22px),0)}
.fsb-reveal.is-visible{--fsb-ty:0px}

.fsb-feature-grid>.fsb-card,
.fsb-plan-grid>.fsb-plan,
.fsb-quote{
  transform:perspective(900px)
            rotateX(var(--fsb-rx,0deg)) rotateY(var(--fsb-ry,0deg))
            translate3d(0,calc(var(--fsb-ty,0px) + var(--fsb-base,0px) + var(--fsb-lift,0px)),0);
  transform-style:preserve-3d;
}
.fsb-plan{--fsb-base:0px}
.fsb-plan.featured{--fsb-base:-10px}
@media(max-width:1099px){.fsb-plan.featured{--fsb-base:0px}}

/* Foco de luz que sigue al puntero. Sólo pinta; no mueve nada. */
.fsb-card{position:relative}
.fsb-card::after{
  content:"";position:absolute;inset:0;border-radius:inherit;
  pointer-events:none;opacity:0;transition:opacity .35s ease;
  background:radial-gradient(320px circle at var(--fsb-mx,50%) var(--fsb-my,50%),
             rgba(16,191,243,.16),transparent 62%);
}
@supports (color:color-mix(in oklab,black,white)){
  .fsb-card::after{background:radial-gradient(320px circle at var(--fsb-mx,50%) var(--fsb-my,50%),
    color-mix(in oklab,var(--fs-accent) 16%,transparent),transparent 62%)}
}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .fsb-card:hover::after{opacity:1}
  .fsb-feature-grid>.fsb-card:hover,.fsb-plan-grid>.fsb-plan:hover{--fsb-lift:-6px}
  .fsb-quote:hover{--fsb-lift:-4px}
}

/* Parallax de scroll: la variable la escribe el JS. */
.fsb-hero-art>img{transform:translate3d(0,var(--fsb-par,0px),0);will-change:transform}
.fsb-transform-photo{
  transform:scale(var(--fsb-photo-scale,1.06)) translate3d(0,var(--fsb-par,0px),0);
}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .fsb-transform:hover{--fsb-photo-scale:1.13}
}
.fsb-about-media{transform:translate3d(0,calc(var(--fsb-ty,0px) + var(--fsb-par,0px)),0)}

/* Botones magnéticos: se inclinan hacia el cursor. */
.fsb .fsb-btn{
  transform:translate3d(var(--fsb-magx,0px),calc(var(--fsb-magy,0px) + var(--fsb-btn-lift,0px)),0);
  transition:transform .18s var(--fs-ease),filter .25s ease,background-color .25s ease;
}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .fsb .fsb-btn:hover{--fsb-btn-lift:-2px;filter:brightness(1.08)}
}

/* Barra de progreso de lectura en la navegación.
   OJO: aquí NO se puede tocar `position`. El nav es position:fixed desde la capa
   de aislamiento; ponerle relative lo saca del viewport fijo, mata el sticky y
   deja ver el body blanco a través del header transparente. Como ya es fixed,
   sirve de bloque contenedor para este ::after sin declarar nada. */
.fsb-nav::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;
  transform:scaleX(var(--fsb-progress,0));transform-origin:0 50%;
  background:var(--fs-gradient-primary);
  transition:opacity .3s ease;opacity:var(--fsb-progress-op,0);
  pointer-events:none;
}

/* Entrada del encabezado de sección: el antetítulo entra lateral, el titular
   se descubre con una cortina y el degradado del subrayado se dibuja. */
@media(prefers-reduced-motion:no-preference){
  .fsb-section-head .fsb-eyebrow{
    opacity:0;transform:translate3d(-14px,0,0);
    transition:opacity .5s var(--fs-ease) 80ms,transform .5s var(--fs-ease) 80ms;
  }
  .fsb-section-head.is-visible .fsb-eyebrow{opacity:1;transform:none}
  .fsb-section-head .fsb-eyebrow span{transform:scaleX(0);transform-origin:0 50%;
    transition:transform .55s var(--fs-ease) 180ms}
  .fsb-section-head.is-visible .fsb-eyebrow span{transform:scaleX(1)}
  .fsb-section-head h2{
    clip-path:inset(0 0 110% 0);
    transition:clip-path .7s var(--fs-ease) 140ms;
  }
  .fsb-section-head.is-visible h2{clip-path:inset(0 0 -20% 0)}
}

/* Cinta animada: acelera con el scroll. */
.fsb-marquee-track,.fsb-marquee div{animation-duration:var(--fsb-marquee-dur,28s)}

@media(prefers-reduced-motion:reduce){
  .fsb-feature-grid>.fsb-card,.fsb-plan-grid>.fsb-plan,.fsb-quote,
  .fsb-hero-art>img,.fsb-transform-photo,.fsb-about-media,.fsb .fsb-btn{
    --fsb-rx:0deg;--fsb-ry:0deg;--fsb-par:0px;--fsb-magx:0px;--fsb-magy:0px;
    transform:none!important;
  }
  .fsb-card::after{content:none}
  .fsb-nav::after{content:none}
}

/* El hero compone dos fuentes de movimiento: el scroll (--fsb-par) y el
   puntero (--fsb-px/--fsb-py). Van en la misma transform o se anulan. */
.fsb-hero-art>img{
  transform:translate3d(var(--fsb-px,0px),calc(var(--fsb-par,0px) + var(--fsb-py,0px)),0);
  transition:transform .35s var(--fs-ease);
}
.fsb-video img,.fsb-video:hover img,.fsb-video:focus-visible img{
  transform:translate3d(0,var(--fsb-par,0px),0);
}
@media(prefers-reduced-motion:reduce){
  .fsb-hero-art>img,.fsb-video img,.fsb-video:hover img{transform:none!important;transition:none}
}

/* ============================================================
   2.5.0 — Beneficios y distintivos alineados 1:1 con Lovable
   Medidas tomadas del source: grid gap-4 (16px), glass-card p-6
   (24px), recuadro h-12 w-12 rounded-xl (48px/12px), icono h-6 w-6
   (24px), h3 mt-5 text-xl, p mt-2 text-sm. La 2.4 se había pasado
   de tamaño; esto lo devuelve a la referencia.
   ============================================================ */
.fsb-feature-grid{gap:16px}
.fsb-feature-grid .fsb-card{min-height:0;padding:24px}
.fsb-feature-grid .fsb-card h3{margin:20px 0 0;font-size:20px;font-weight:900;line-height:1.1;letter-spacing:0}
.fsb-feature-grid .fsb-card p,
.fsb-feature-grid .fsb-card .fsb-rich{margin:8px 0 0;font-size:14px;line-height:1.55}
/* sm:grid-cols-2 = 640px, lg:grid-cols-4 = 1024px */
@media(min-width:640px) and (max-width:1023px){.fsb-feature-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.fsb-feature-grid{grid-template-columns:repeat(4,1fr)}}

.fsb .fsb-feature-icon{
  --fs-icon-box:48px;--fs-icon-size:24px;
  border:0;border-radius:12px;
  background:var(--fs-icon-bg);color:var(--fs-icon-color);
  box-shadow:none;
  transition:background-color .2s ease,color .2s ease;
}
.fsb .fsb-feature-icon svg{width:24px;height:24px}
/* group-hover:bg-primary group-hover:text-primary-foreground — sólido, sin degradado ni giro. */
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .fsb-feature-grid .fsb-card:hover .fsb-feature-icon{
    background:var(--fs-accent);color:var(--fs-accent-ink);
    border-color:transparent;box-shadow:none;transform:none;
  }
}

/* Distintivos: en el source NO hay recuadro. Es el icono lucide desnudo de
   20px en color primario, junto a un texto de 14px en caja normal. */
.fsb-badges{gap:16px}
.fsb-badges>span{gap:12px;padding:12px 16px;border-radius:12px;font-size:14px;font-weight:600;text-transform:none}
.fsb .fsb-badges .fsb-badge-icon{
  width:20px;height:20px;flex:0 0 20px;
  border:0;border-radius:0;background:none;box-shadow:none;
  color:var(--fs-accent);
}
.fsb .fsb-badges .fsb-badge-icon svg{width:20px;height:20px}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .fsb-badges>span:hover .fsb-badge-icon{background:none;color:var(--fs-accent)}
}
@media(min-width:640px){.fsb-badges{grid-template-columns:repeat(2,1fr)}}

/* ============================================================
   2.5.0 — La capa defensiva deja de anular nuestro propio diseño
   Las reglas anti-tema de la v2 forzaban con !important el margen
   de h1/h2/h3/p y el padding. Eso hacía inertes TODOS los márgenes
   que definiéramos después, por mucha especificidad que tuvieran.
   Ahora el valor viaja en una variable: la defensa sigue en pie,
   pero cada sección puede fijar su propio ritmo, y el control de
   Tipografía de Elementor vuelve a poder cambiar el interletraje.
   ============================================================ */
.fsb h1{margin:var(--fs-h1-margin,0)!important}
.fsb h2{margin:var(--fs-h2-margin,0)!important}
.fsb h3{margin:var(--fs-h3-margin,0)!important}
.fsb p{margin:var(--fs-p-margin,20px 0 0)!important}
.fsb h1,.fsb h2,.fsb h3,.fsb p{padding:var(--fs-hp-padding,0)!important}

/* Beneficios — h3 mt-5 (20px), p mt-2 (8px), como en el source. */
.fsb-feature-grid .fsb-card{--fs-h3-margin:20px 0 0;--fs-p-margin:8px 0 0}
/* Cómo funciona */
.fsb-steps article{--fs-h3-margin:14px 0 0;--fs-p-margin:8px 0 0}
/* Transformaciones */
.fsb-transform-body{--fs-h3-margin:14px 0 0;--fs-p-margin:10px 0 0}
/* Planes */
.fsb-plan{--fs-h3-margin:12px 0 0}
/* Texto enriquecido: el autor manda dentro del bloque. */
.fsb .fsb-rich{--fs-p-margin:0 0 1em}
.fsb .fsb-rich>:last-child{--fs-p-margin:0}
.fsb-section-head{--fs-p-margin:20px 0 0}

/* ============================================================
   2.6.0 — Header y cinta de certificados
   ============================================================ */

/* El header es transparente arriba por diseño (así es el original) y sólo toma
   fondo con .is-scrolled. El tema pinta el body en blanco, así que mientras el
   hero no ha pintado se ve un header blanco. Con el fondo de página oscuro el
   destello desaparece. Esta hoja sólo se carga en páginas que usan los bloques. */
:root{--fsb-page-bg:#08090a}
html,body{background-color:var(--fsb-page-bg)}

/* ---- Cinta de certificados ----
   Mismo concepto que la cinta de palabras: pista duplicada que se desplaza el
   50%, con el separador ✦ entre piezas. */
.fsb-marquee.has-media{padding:48px 0;overflow:hidden}
.fsb-marquee.has-media .fsb-marquee-track{
  display:flex;align-items:center;width:max-content;
  font-size:0;line-height:0;
  animation:fsbMarquee var(--fsb-marquee-dur,96s) linear infinite;
}
.fsb-marquee.has-media .fsb-marquee-item{
  display:inline-flex;align-items:center;flex:0 0 auto;
  gap:44px;padding-right:44px;
}
.fsb-marquee.has-media .fsb-marquee-item>i{
  font:900 30px/1 "Barlow Condensed",Arial,sans-serif;font-style:normal;
  color:var(--fs-accent);opacity:.55;
}
.fsb .fsb-marquee-img{
  display:block;width:auto;height:auto;
  /* 520px de alto deja que 11 de las 12 conserven sus 500px de ancho reales;
     sólo la vertical (500x700) se reduce para no disparar la banda. */
  max-width:var(--fsb-cert-w,500px);
  max-height:var(--fsb-cert-h,520px);
  border-radius:14px;
  border:1px solid var(--fs-border);
  box-shadow:0 18px 45px rgba(0,0,0,.5);
  background:var(--fs-card);
  transform-origin:center center;
  /* El crecimiento es instantáneo, como se pidió: nada de transición al entrar. */
  transition:none;
}
/* Hover: la imagen crece de golpe y se pone por encima de sus vecinas. */
.fsb-marquee.has-media .fsb-marquee-item:hover{position:relative;z-index:3}
.fsb-marquee.has-media .fsb-marquee-item:hover .fsb-marquee-img,
.fsb-marquee.has-media .fsb-marquee-item.is-zoomed .fsb-marquee-img{
  transform:scale(1.16);
  border-color:var(--fs-accent);
  box-shadow:0 26px 70px rgba(0,0,0,.68);
}
.fsb-marquee.has-media .fsb-marquee-item.is-zoomed{position:relative;z-index:3}
/* La cinta se detiene mientras el puntero está encima, o al tocar en móvil. */
.fsb-marquee.has-media:hover .fsb-marquee-track,
.fsb-marquee.has-media.is-paused .fsb-marquee-track{animation-play-state:paused}

@media(max-width:767px){
  .fsb-marquee.has-media{padding:26px 0}
  .fsb-marquee.has-media .fsb-marquee-item{gap:26px;padding-right:26px}
  .fsb-marquee.has-media .fsb-marquee-item>i{font-size:22px}
  .fsb .fsb-marquee-img{--fsb-cert-w:min(70vw,320px);--fsb-cert-h:300px;border-radius:11px}
  /* En táctil no hay hover: el dedo amplía y detiene, y el escalado se reduce
     para que la pieza ampliada siga cabiendo en pantalla. */
  .fsb-marquee.has-media .fsb-marquee-item.is-zoomed .fsb-marquee-img{transform:scale(1.1)}
}

/* Sin animación: la cinta pasa a ser una tira que se arrastra con el dedo,
   y se oculta la copia duplicada para no repetir los certificados. */
@media(prefers-reduced-motion:reduce){
  .fsb-marquee.has-media{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .fsb-marquee.has-media .fsb-marquee-track{animation:none}
  .fsb-marquee.has-media .fsb-marquee-item[aria-hidden="true"]{display:none}
  .fsb-marquee.has-media .fsb-marquee-item:hover .fsb-marquee-img{transform:none}
}

/* ============================================================
   2.7.0 — Miniaturas de 200px con zoom suave a 500px
   ============================================================ */

/* La banda recorta en horizontal pero deja salir el zoom por arriba y por
   abajo. `overflow:clip` por eje es lo que permite esto: con `hidden` el
   navegador convertiría el otro eje en contenedor de scroll y aparecería una
   barra vertical. Se deja `hidden` como reserva para navegadores antiguos:
   allí el zoom se recorta, pero nada se rompe. */
.fsb-marquee.has-media{padding:26px 0;overflow:hidden}
@supports (overflow-x:clip){
  .fsb-marquee.has-media{overflow-x:clip;overflow-y:visible}
}

/* Miniatura a 200px. La altura sale sola de la proporción; el tope mantiene
   la banda pareja (208px = 520 x 200/500). */
.fsb .fsb-marquee-img{
  max-width:var(--fsb-cert-w,200px);
  max-height:var(--fsb-cert-h,208px);
  border-radius:10px;
  box-shadow:0 10px 26px rgba(0,0,0,.45);
  /* Se amplía con transform, no con width: así no se recalcula el layout de
     la pista ni se desplazan las piezas vecinas. */
  transition:transform .38s var(--fs-ease),box-shadow .38s var(--fs-ease),border-color .3s ease;
}
/* 200 x 2.5 = 500px exactos. */
.fsb-marquee.has-media .fsb-marquee-item:hover .fsb-marquee-img,
.fsb-marquee.has-media .fsb-marquee-item.is-zoomed .fsb-marquee-img{
  transform:scale(var(--fsb-cert-zoom,2.5));
  border-color:var(--fs-accent);
  box-shadow:0 30px 80px rgba(0,0,0,.72);
}
.fsb-marquee.has-media .fsb-marquee-item{gap:26px;padding-right:26px}
.fsb-marquee.has-media .fsb-marquee-item>i{font-size:22px}
/* La pieza ampliada se pinta por encima de sus vecinas y de las secciones
   contiguas; la clase del contenedor la pone el JS al entrar el puntero. */
.fsb-marquee.has-media .fsb-marquee-item:hover,
.fsb-marquee.has-media .fsb-marquee-item.is-zoomed{position:relative;z-index:20}
.fsb-marquee-lift{position:relative;z-index:60}

@media(max-width:767px){
  /* 500px no cabe en un móvil: el zoom se limita a lo que da la pantalla. */
  .fsb .fsb-marquee-img{
    --fsb-cert-w:150px;--fsb-cert-h:156px;
    --fsb-cert-zoom:2.1;
    border-radius:8px;
  }
  .fsb-marquee.has-media{padding:20px 0}
  .fsb-marquee.has-media .fsb-marquee-item{gap:18px;padding-right:18px}
  .fsb-marquee.has-media .fsb-marquee-item>i{font-size:18px}
}

@media(prefers-reduced-motion:reduce){
  .fsb .fsb-marquee-img{transition:none}
  .fsb-marquee.has-media .fsb-marquee-item:hover .fsb-marquee-img{transform:none}
}

/* ---- Barra de progreso de lectura ----
   La rueda del ratón desplaza a saltos de ~100px, así que el valor llega en
   escalones y la barra parecía moverse sólo al detener el scroll. Con el
   desplazamiento suave del menú la posición sí varía de forma continua, y por
   eso allí se veía bien. Interpolar el ancho corrige los dos casos. */
.fsb-nav::after{transition:transform .16s linear,opacity .3s ease}
@media(prefers-reduced-motion:reduce){.fsb-nav::after{transition:none}}