.bpa-showcase{width:100%;max-width:100%;margin-left:0}.bpa-showcase{color-scheme:dark;--bg:#0c0a11;--panel:#15121c;--muted:#b4adbf;--white:#f8f5fc;--pink:#ff2855;--line:#ffffff1a;--max:1160px}.bpa-showcase *{box-sizing:border-box}.bpa-showcase{scroll-behavior:smooth;scroll-padding-top:80px}.bpa-showcase{margin:0;background:var(--bg);color:var(--white);font:16px/1.6 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}.bpa-showcase{overflow:clip;background:radial-gradient(ellipse at 8% 22%,#3e0b2c88,transparent 36%),radial-gradient(ellipse at 88% 18%,#2a175688,transparent 38%),var(--bg)}.bpa-showcase .wrap{width:min(var(--max),calc(100% - 48px));margin-inline:auto}.bpa-showcase .topline{height:36px;border-bottom:1px solid var(--line);background:#0a0810}.bpa-showcase .topline .wrap{display:flex;justify-content:space-between;align-items:center;height:100%;font-size:10px;font-weight:800;letter-spacing:.13em}.bpa-showcase .topline a,.bpa-showcase .nav a,.bpa-showcase .footer a{color:inherit;text-decoration:none}.bpa-showcase .topline a{letter-spacing:0;color:#ccc2d2}.bpa-showcase .nav{position:sticky;top:0;z-index:30;background:#0c0a11ef;backdrop-filter:blur(14px);height:70px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:24px}.bpa-showcase .brand{display:flex;gap:10px;align-items:center;font-size:14px;font-weight:800;letter-spacing:.04em;white-space:nowrap}.bpa-showcase .brand-icon{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:linear-gradient(140deg,#ff315b,#8d42da);box-shadow:0 5px 20px #ff285544;font-size:13px}.bpa-showcase .nav nav{display:flex;gap:24px;align-items:center;font-size:13px;color:#c8c0cf}.bpa-showcase .nav nav a:hover,.bpa-showcase .footer a:hover{color:#fff}.bpa-showcase .nav-cta,.bpa-showcase .pill{display:inline-flex;align-items:center;justify-content:center;gap:14px;border-radius:999px;padding:11px 19px;background:var(--pink);color:white!important;font-size:13px;font-weight:750;text-decoration:none;box-shadow:0 8px 24px #ff285533}.bpa-showcase .hero{position:relative;padding:90px 0 62px;background:radial-gradient(ellipse at 77% 38%,#60308a99,transparent 38%),linear-gradient(115deg,#260d26,#100d19 47%,#171025)}.bpa-showcase .hero-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:60px}.bpa-showcase .eyebrow{display:flex;align-items:center;gap:10px;color:#ff6c89;font-size:11px;font-weight:850;letter-spacing:.16em}.bpa-showcase .eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--pink);box-shadow:0 0 14px var(--pink)}.bpa-showcase h1,.bpa-showcase h2,.bpa-showcase h3,.bpa-showcase p{margin-top:0}.bpa-showcase .hero h1{margin:20px 0 20px;font-size:clamp(42px,5.1vw,68px);line-height:1.03;letter-spacing:-.055em}.bpa-showcase .hero h1 em{font-style:normal;background:linear-gradient(95deg,#fff,#f29cc8 62%,#bd99ff);-webkit-background-clip:text;background-clip:text;color:transparent}.bpa-showcase .lead{max-width:550px;color:#d0c9d7;font-size:17px;line-height:1.75}.bpa-showcase .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0 34px}.bpa-showcase .pill{padding:12px 20px}.bpa-showcase .pill-outline{border:1px solid #ffffff32;background:#ffffff08;box-shadow:none}.bpa-showcase .stats{display:flex;gap:36px;border-top:1px solid var(--line);padding-top:18px}.bpa-showcase .stats div{display:flex;flex-direction:column}.bpa-showcase .stats b{font-size:24px;line-height:1.1}.bpa-showcase .stats span{color:#aaa2b5;font-size:12px}.bpa-showcase .hero-art{position:relative;min-height:370px;display:grid;place-items:center}.bpa-showcase .window{width:100%;max-width:530px;overflow:hidden;border:1px solid #ffffff24;border-radius:19px;background:#100e16;box-shadow:0 30px 80px #0008;transform:rotate(1deg)}.bpa-showcase .window-top{height:34px;display:flex;align-items:center;gap:6px;padding:0 13px;border-bottom:1px solid var(--line);color:#9a92a2;font-size:9px}.bpa-showcase .window-top i{width:8px;height:8px;border-radius:50%;background:#5a5362}.bpa-showcase .window-top span{margin-left:auto;letter-spacing:.12em}.bpa-showcase .window-inner{min-height:242px;padding:28px;background:linear-gradient(115deg,#39102c,#301750 72%,#1b1428)}.bpa-showcase .mini-label,.bpa-showcase .code-caption{color:#ff708f;font-size:9px;font-weight:850;letter-spacing:.14em}.bpa-showcase .window-inner h2{margin:10px 0;font-size:25px;line-height:1.2}.bpa-showcase .window-inner p:not(.mini-label){max-width:380px;color:#d1c7d7;font-size:13px}.bpa-showcase .mini-flow{display:flex;gap:12px;align-items:center;color:#eae5ef;font-size:12px;font-weight:750}.bpa-showcase .mini-flow b{color:#ff4269}.bpa-showcase .hero-button{position:absolute;bottom:-12px;right:-4px;padding:12px 18px;border:1px solid #ffffff20;border-radius:18px;background:#17131d;box-shadow:0 20px 50px #0009}.bpa-showcase .hero-button .bpa-button{height:82px;width:260px;font-size:21px;border-radius:23px}.bpa-showcase .hero-button .bpa-icon,.bpa-showcase .hero-button .bpa-icon svg{width:40px;height:40px}.bpa-showcase .hero-button .bpa-icon{flex-basis:40px}.bpa-showcase .hero-button .bpa-status{font-size:10px}.bpa-showcase .section{padding-block:94px}.bpa-showcase .section-heading{max-width:680px;margin:0 auto 38px;text-align:center}.bpa-showcase .section-heading .eyebrow{justify-content:center}.bpa-showcase .section-heading h2,.bpa-showcase .requirement-grid h2{font-size:clamp(32px,4vw,48px);line-height:1.1;letter-spacing:-.04em;margin:12px 0}.bpa-showcase .section-heading h2 span{color:#d3a2f0}.bpa-showcase .section-heading>p:last-child{color:var(--muted);max-width:650px;margin-inline:auto}.bpa-showcase .feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.bpa-showcase .feature-grid article{padding:24px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(145deg,#ffffff09,#ffffff03)}.bpa-showcase .feature-icon{display:grid;place-items:center;width:38px;height:38px;margin-bottom:15px;border-radius:12px;background:#ff28551c;color:#ff7792;font-size:20px}.bpa-showcase .feature-grid h3{margin-bottom:8px;font-size:17px}.bpa-showcase .feature-grid p{margin-bottom:0;color:var(--muted);font-size:13px}.bpa-showcase .demo-section{padding:88px 0 94px;background:linear-gradient(180deg,#120e19,#100d15);border-block:1px solid var(--line)}.bpa-showcase .demo-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.bpa-showcase .demo-panel{display:flex;min-width:0;flex-direction:column;align-items:center;gap:16px;padding:8px 4px;border:0;border-radius:0;background:transparent}.bpa-showcase .demo-panel--light,.bpa-showcase .demo-panel--dark{background:transparent;color:#f5f2fa}.bpa-showcase .panel-tag{align-self:flex-start;font-size:9px;font-weight:850;letter-spacing:.13em;opacity:.62}.bpa-showcase .color-controls{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 14px;width:100%;font-size:11px}.bpa-showcase .color-controls label{display:flex;align-items:center;gap:6px;white-space:nowrap;opacity:.82}.bpa-showcase .color-controls input{width:28px;height:24px;padding:2px;border:1px solid currentColor;border-radius:5px;background:transparent;cursor:pointer}.bpa-showcase .color-controls input:focus-visible{outline:2px solid #5686f5;outline-offset:2px}.bpa-showcase .demo-panel .bpa-widget{margin:auto 0}.bpa-showcase .demo-panel .bpa-button{height:98px}.bpa-showcase .demo-panel .bpa-status{font-size:11px}.bpa-showcase .code-caption{align-self:flex-start}.bpa-showcase .snippet{display:block;width:100%;overflow-wrap:anywhere;padding:11px;border:1px solid #ffffff1d;border-radius:9px;background:#0a0910;color:#ddd6e5;font:11px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace}.bpa-showcase .demo-panel--light .snippet{background:#e8ebf0;color:#252631;border-color:#00000014}.bpa-showcase .fine-print{text-align:center;color:var(--muted);font-size:12px;margin:20px 0 0}.bpa-showcase .integration{padding-bottom:90px}.bpa-showcase .steps{display:grid;grid-template-columns:1fr 1fr;gap:16px}.bpa-showcase .steps article{padding:26px;border:1px solid var(--line);border-radius:16px;background:#ffffff06}.bpa-showcase .steps article>b{color:#ff6c89;font-size:12px;letter-spacing:.15em}.bpa-showcase .steps h3{margin:10px 0;font-size:20px}.bpa-showcase .steps p{color:var(--muted);font-size:14px}.bpa-showcase .pre,.bpa-showcase pre{overflow:auto;padding:16px;border-radius:10px;background:#09080d;color:#e4ddeb;font:12px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace}.bpa-showcase .notice{display:flex;flex-direction:column;gap:3px;margin-top:16px;padding:17px 20px;border-left:3px solid #ff5475;border-radius:7px;background:#ff285510}.bpa-showcase .notice span{color:#c5bdcc;font-size:13px}.bpa-showcase .requirements{padding:68px 0;background:#15111b;border-block:1px solid var(--line)}.bpa-showcase .requirement-grid{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:50px}.bpa-showcase .requirement-grid ul{list-style:none;margin:0;padding:0}.bpa-showcase .requirement-grid li{display:flex;justify-content:space-between;gap:18px;padding:13px 0;border-bottom:1px solid var(--line)}.bpa-showcase .requirement-grid li span{color:var(--muted);font-size:13px;text-align:right}.bpa-showcase .faq{max-width:900px}.bpa-showcase .faq details{border-bottom:1px solid var(--line);padding:17px 4px}.bpa-showcase .faq summary{cursor:pointer;font-weight:700}.bpa-showcase .faq details p{margin:10px 0 0;color:var(--muted);font-size:14px}.bpa-showcase .footer{border-top:1px solid var(--line);padding:24px 0;background:#09080d}.bpa-showcase .footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:18px}.bpa-showcase .footer p{margin:0;color:#aaa2b5;font-size:12px}.bpa-showcase .footer>a{font-size:12px}@media(max-width:850px){.bpa-showcase .nav nav{gap:12px}.bpa-showcase .nav nav a:nth-child(n+4){display:none}.bpa-showcase .hero-grid{gap:32px}.bpa-showcase .hero{padding-top:64px}.bpa-showcase .feature-grid{grid-template-columns:repeat(2,1fr)}.bpa-showcase .requirement-grid{grid-template-columns:1fr;gap:12px}}@media(max-width:640px){.bpa-showcase .wrap{width:calc(100% - 28px)}.bpa-showcase .topline .wrap{font-size:8px}.bpa-showcase .nav{height:62px}.bpa-showcase .nav nav{display:none}.bpa-showcase .nav-cta{padding:9px 12px;font-size:11px}.bpa-showcase .hero{padding:54px 0 45px}.bpa-showcase .hero-grid{grid-template-columns:1fr;gap:34px}.bpa-showcase .hero h1{font-size:46px}.bpa-showcase .lead{font-size:15px}.bpa-showcase .hero-art{min-height:270px}.bpa-showcase .window-inner{min-height:190px;padding:20px}.bpa-showcase .hero-button{right:0;bottom:-8px}.bpa-showcase .hero-button .bpa-button{height:72px;width:238px}.bpa-showcase .stats{gap:20px}.bpa-showcase .stats b{font-size:21px}.bpa-showcase .stats span{font-size:10px}.bpa-showcase .section,.bpa-showcase .demo-section{padding-block:62px}.bpa-showcase .feature-grid,.bpa-showcase .demo-grid,.bpa-showcase .steps{grid-template-columns:1fr}.bpa-showcase .feature-grid article{padding:20px}.bpa-showcase .demo-panel{padding:18px}.bpa-showcase .demo-panel .bpa-button{height:88px}.bpa-showcase .requirement-grid li{align-items:flex-start;flex-direction:column;gap:2px}.bpa-showcase .requirement-grid li span{text-align:left}.bpa-showcase .footer .wrap{flex-wrap:wrap}.bpa-showcase .footer .brand{width:100%}}@media(prefers-reduced-motion:reduce){.bpa-showcase{scroll-behavior:auto}.bpa-showcase *,.bpa-showcase *::before,.bpa-showcase *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
.bpa-publish-showcase-page.admin-bar .bpa-showcase .nav{top:32px}
@media(max-width:782px){.bpa-publish-showcase-page.admin-bar .bpa-showcase .nav{top:46px}}
body.bpa-publish-showcase-page{overflow-x:clip}

/* Demo: cards de contraste para presentar cada variante con claridad. */
.bpa-showcase .demo-panel{gap:16px;padding:24px;border:1px solid #ffffff1c;border-radius:18px;background:#f2f4f5;color:#202a2a;box-shadow:0 18px 48px #0003}
.bpa-showcase .demo-panel--dark{background:linear-gradient(145deg,#17131f,#100d15);color:#f5f2fa}
.bpa-showcase .demo-panel--light .panel-tag,.bpa-showcase .demo-panel--light .color-controls{color:#29313a}
.bpa-showcase .demo-panel--dark .panel-tag,.bpa-showcase .demo-panel--dark .color-controls{color:#f5f2fa}
.bpa-showcase .demo-panel .bpa-widget{display:flex;width:min(100%,520px);min-height:168px;flex-direction:column;align-items:center;justify-content:center;gap:10px;margin:auto 0;padding:24px;border:1px solid #11161c16;border-radius:14px;background:linear-gradient(145deg,#ffffff,#e7ecef);box-shadow:inset 0 1px 0 #fff8}
.bpa-showcase .demo-panel--dark .bpa-widget{border-color:#ffffff20;background:radial-gradient(ellipse at 50% 15%,#332648,#191520 72%);box-shadow:inset 0 1px 0 #ffffff12}
.bpa-showcase .demo-panel .bpa-status{margin:0;color:#58636c;text-align:center}
.bpa-showcase .demo-panel--dark .bpa-status{color:#c3bbcb}
.bpa-showcase .demo-panel .bpa-button{max-width:100%;}
@media(max-width:640px){.bpa-showcase .demo-panel{padding:18px}.bpa-showcase .demo-panel .bpa-widget{min-height:148px;padding:18px}}
