:root{color-scheme:dark;--bg:#1d2023;--ink:#f4f3ef;--muted:#afb3b5;--line:#ffffff21;--accent:#80c4c7;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink)}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.45;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:4px}[hidden]{display:none!important}.topbar{position:absolute;top:0;left:0;width:100%;padding:28px 4vw;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:20px}.wordmark{font-size:19px;font-weight:800;letter-spacing:-.07em}.wordmark span{font-size:9px;font-weight:400;letter-spacing:.14em;margin-left:16px}.toplabel{font-size:9px;letter-spacing:.18em;color:#c1c3c4}.hero{position:relative;min-height:100svh;padding:125px 6vw 65px;display:flex;flex-direction:column;align-items:center;background:radial-gradient(ellipse at 50% 56%,#42474b 0,#262a2e 40%,#1b1e21 78%);overflow:hidden}.hero-copy{text-align:center;z-index:1;pointer-events:none}.eyebrow{font-size:10px;letter-spacing:.25em;color:#b4c1c3;text-transform:uppercase;margin:0 0 22px}h1{font-size:clamp(40px,6.5vw,98px);font-weight:400;letter-spacing:-.065em;line-height:1.02;margin:0;overflow-wrap:anywhere}.subtitle{font-size:clamp(14px,1.3vw,19px);color:#b5b9bc;margin:19px 0 0;line-height:1.5}.rotate-hint{position:absolute;bottom:0;left:0;width:100%;text-align:center;color:#c2c8ca;font-size:9px;letter-spacing:.14em;pointer-events:none}.explore{margin-top:auto;display:flex;align-items:center;gap:28px;font-size:10px;letter-spacing:.17em;padding:17px 0}.explore span{font-size:23px}.demo-note{font-size:8px;letter-spacing:.15em;color:#8e969b;margin-top:10px}.film{height:700vh;position:relative;scroll-margin-top:0}.film-stage{position:sticky;top:0;height:100svh;overflow:hidden;background:#232629}#product-video{position:absolute;width:100%;height:100%;object-fit:contain;inset:0;background:#232629}.film-vignette{position:absolute;inset:0;background:linear-gradient(#0005,transparent 20%,transparent 78%,#0007);pointer-events:none}.film-heading{position:absolute;left:4vw;right:4vw;top:28px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:10px;letter-spacing:.14em;text-transform:uppercase}.ghost{border:1px solid #ffffff50;background:#1a1d2070;color:white;border-radius:30px;padding:12px 16px;font-size:10px;letter-spacing:.03em;backdrop-filter:blur(8px)}.info-panel{position:absolute;left:6vw;bottom:15vh;width:min(370px,35vw);padding:30px;background:#ffffffdf;color:#1c2529;border:1px solid #ffffffa0;box-shadow:0 14px 60px #0002;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border-radius:3px;transition:opacity .15s,transform .2s;opacity:0;pointer-events:none;max-height:calc(100svh - 180px);overflow:auto}.info-panel.right{left:auto;right:6vw}.panel-number{font-size:10px;letter-spacing:.2em;color:#5f777b}.info-panel h2{font-size:clamp(24px,2.1vw,34px);line-height:1.05;letter-spacing:-.04em;font-weight:400;margin:20px 0 15px;overflow-wrap:anywhere}.info-panel p{font-size:13px;line-height:1.65;color:#47575d;margin:0;white-space:pre-line;overflow-wrap:anywhere}.film-bottom{position:absolute;bottom:27px;left:4vw;right:4vw;display:flex;justify-content:space-between;gap:20px;color:#cdd1d2;font-size:9px;letter-spacing:.12em}.track{position:absolute;bottom:0;left:0;right:0;height:2px;background:#ffffff25}.track i{display:block;width:0;height:100%;background:#b3d7d8}.contact{padding:130px 24px;text-align:center;background:#eef0ec;color:#1e262a}.contact .eyebrow{color:#657b80}.contact h2{font-size:clamp(40px,6vw,84px);font-weight:400;letter-spacing:-.065em;line-height:1.06;margin:28px 0 42px}.cta{display:inline-flex;align-items:center;justify-content:space-between;gap:45px;border:1px solid #1e262a;padding:20px 25px;font-size:10px;letter-spacing:.13em;transition:background .2s}.cta:hover{background:#1e262a;color:white}.cta span{font-size:20px}footer{padding:28px 4vw;display:flex;justify-content:space-between;gap:20px;color:#a5afb3;font-size:10px}footer a{text-decoration:underline;text-underline-offset:3px}.media-error{position:absolute;left:10%;right:10%;top:45%;background:#1c2226ee;border:1px solid #ffffff40;padding:22px;line-height:1.5;text-align:center;font-size:13px}.preview-badge{position:fixed;bottom:8px;left:50%;transform:translateX(-50%);background:#a9d8d9;color:#172126;padding:10px 15px;border-radius:20px;font-size:9px;letter-spacing:.07em;z-index:30;max-width:90%;text-align:center}.editor-body{background:#171c20;color:#edf1ef}.editor-header{padding:26px max(22px,5vw);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:20px}.editor-header nav{display:flex;gap:18px;font-size:12px}.editor-shell{width:min(1100px,100%);padding:48px 22px 130px;margin:auto}.editor-title{font-size:clamp(36px,5vw,60px);letter-spacing:-.05em;font-weight:400;margin:0 0 16px}.editor-intro{font-size:14px;line-height:1.7;color:#b5c0c4;max-width:700px;margin-bottom:38px}.editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.edit-card{background:#20272c;border:1px solid #ffffff16;border-radius:10px;padding:26px;margin-bottom:24px}.edit-card h2{font-size:18px;font-weight:400;letter-spacing:-.025em;margin:0 0 24px}.edit-card h3{font-size:14px;font-weight:400;margin:0}.step{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:1px solid #ffffff45;border-radius:50%;font-size:10px;margin-right:10px;color:#a7cbd0}.field{display:block;font-size:12px;color:#c1cbd0;margin:18px 0}.field input:not([type=range]):not([type=checkbox]),.field textarea,.field select{display:block;width:100%;background:#171d22;color:white;border:1px solid #ffffff25;padding:13px;border-radius:5px;margin-top:8px;min-height:44px}.field textarea{resize:vertical;min-height:110px;line-height:1.5}.field input[type=range]{display:block;width:100%;margin-top:16px;accent-color:#a7d0d3;min-height:30px}.help{font-size:11px;color:#a4b0b6;line-height:1.65}.upload{display:flex;align-items:center;justify-content:space-between;gap:15px;border:1px dashed #ffffff40;padding:17px;border-radius:7px;margin:14px 0}.upload label{font-size:12px;cursor:pointer;color:#d3e7e8;flex-shrink:0}.upload span{font-size:10px;color:#a4b0b6;overflow-wrap:anywhere}.upload input{max-width:180px;font-size:11px}.mini-video{display:block;width:100%;max-height:250px;object-fit:contain;background:#171d22;border-radius:5px}.panel-edit{border-top:1px solid #ffffff1c;padding:20px 0 4px}.panel-edit:first-child{border-top:0;padding-top:0}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:15px}.panel-head label{font-size:12px;display:flex;gap:8px;align-items:center}.position-label{display:flex;justify-content:space-between;align-items:center}.position-label input{max-width:90px}.inline-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}.btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;background:transparent;color:#dce9eb;border:1px solid #ffffff45;border-radius:6px;padding:13px 17px;font-size:12px;min-height:44px}.btn.primary{background:#b4d9db;border-color:#b4d9db;color:#142126;font-weight:600}.btn:hover{filter:brightness(1.1)}.savebar{position:fixed;bottom:0;left:0;right:0;z-index:20;background:#141b20f5;border-top:1px solid #ffffff25;backdrop-filter:blur(15px);padding:15px max(22px,5vw);display:flex;justify-content:space-between;align-items:center;gap:15px}.savebar .inline-actions{margin:0}.status{font-size:11px;color:#b8c8cc;line-height:1.5;max-width:420px}.notice{padding:17px;background:#adc8ce12;border:1px solid #adc8ce40;color:#cbd7da;border-radius:6px;font-size:12px;line-height:1.7;margin:20px 0}.editor-error{color:#ffc2b2}.export-progress{display:block;width:100%;accent-color:#9bcdd0;margin-top:10px}.small-link{font-size:11px;text-decoration:underline;background:none;border:0;color:#b8c8cc;padding:10px 0}.slider-preview{margin-top:16px;background:#171d22;padding:16px;border-radius:5px}.slider-preview input{width:100%;accent-color:#a7d0d3}.slider-preview output{font-size:12px}.right-column>.edit-card{position:sticky;top:24px}.panel-readout{font-size:11px;color:#a4cdd0;line-height:1.6;margin-top:13px;min-height:35px}.checkbox{accent-color:#a7d0d3;width:17px;height:17px}.import-label{cursor:pointer}.export-result{font-size:12px;line-height:1.8;background:#153b36;padding:18px;border-radius:5px;margin-top:15px}.export-result a{text-decoration:underline}.form-row{display:flex;gap:12px;align-items:center}.form-row>*{flex:1}.export-cancel{margin-left:12px}.preview-toolbar{display:flex;justify-content:space-between;gap:10px;align-items:center}.preview-toolbar button{font-size:10px}.noscript{background:#4d2c25;padding:20px;font-size:14px}@media(max-width:720px){.topbar{padding:24px 22px}.toplabel{display:none}.wordmark span{font-size:8px;margin-left:10px}.hero{padding:110px 20px 40px;min-height:100svh}.hero-copy{max-width:100%}.rotate-hint{font-size:8px;letter-spacing:.06em}.info-panel,.info-panel.right{left:20px;right:20px;bottom:70px;width:auto;padding:22px;max-height:40svh}.info-panel h2{font-size:26px;margin:12px 0}.info-panel p{font-size:12px;line-height:1.55}.film-heading{left:20px;right:20px;top:22px}.film-heading>span{max-width:46%;line-height:1.6;font-size:9px}.film-bottom{left:20px;right:20px;font-size:8px;letter-spacing:.04em}.contact{padding:90px 24px}.contact h2{font-size:46px}.editor-grid{grid-template-columns:1fr}.editor-shell{padding-top:30px}.edit-card{padding:22px}.editor-header{padding:22px}.editor-header nav{font-size:11px;gap:12px}.savebar{align-items:stretch;flex-direction:column;padding:11px 16px;gap:8px}.savebar .inline-actions{display:grid;grid-template-columns:1fr 1.4fr}.status{max-width:none;font-size:10px}.editor-shell{padding-bottom:170px}.upload{flex-wrap:wrap}.upload input{max-width:100%}.right-column>.edit-card{position:static}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* V2: mismos estilos, secuencia de fotogramas y controles automáticos. */
.hero{min-height:46svh;padding-bottom:32px}.hero .explore{margin-top:18px}.hero-play{margin-top:28px}.auto-play{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:17px 23px;background:#eef4f2;color:#19272b;border:1px solid #fff;border-radius:40px;font-size:11px;font-weight:700;letter-spacing:.075em;box-shadow:0 5px 28px #0003;min-height:48px;cursor:pointer}.auto-play:hover{background:#bfe3e3}.play-controls{display:flex;gap:10px;align-items:center}.film-heading{z-index:5}.film-heading .auto-play{font-size:10px;padding:15px 20px}#product-frames,.sequence-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#232629}.sequence-poster{z-index:1;pointer-events:none}#editor-narration{width:100%;margin-top:12px}.panel-remove{background:transparent;color:#b8c8cc;border:0;font-size:11px;text-decoration:underline}.film-stage.automatic .info-panel{pointer-events:none}@media(max-width:720px){.hero{min-height:45svh;padding-top:105px}.hero .auto-play{font-size:9px;padding:15px 18px}.film-heading{align-items:flex-start}.film-heading>span{display:none}.play-controls{width:100%;justify-content:center;flex-wrap:wrap}.film-heading .auto-play{font-size:9px;padding:15px 17px}}
/* BRANDE · medical demo */
:root{color-scheme:light;--bg:#edf5fc;--ink:#163247;--muted:#597589;--line:#193e5d21;--accent:#087db4}
body{background:var(--bg);color:var(--ink)}
.toplabel,.eyebrow,.subtitle,.demo-note{color:#58778c}.hero{min-height:51svh;background:linear-gradient(125deg,#fff,#e9f4fe);padding:125px 6vw 35px}.hero h1{font-size:clamp(44px,6.5vw,94px)}.hero-copy{pointer-events:auto}.demo-note{font-size:8px}.hero .explore{color:#3e657f}.auto-play{background:#153d59;color:white;border:1px solid #153d59;box-shadow:0 9px 25px #194d6e24}.auto-play:hover{background:#086da3;color:white}.film-stage,#product-frames,.sequence-poster{background:#edf5fc}.film-vignette{background:linear-gradient(#f0f7ffbb,transparent 23%,transparent 78%,#e8f3fcbb)}.film-heading,.film-bottom{color:#345b74}.ghost{color:#224c66;background:#ffffffba;border-color:#a8c4d7}.info-panel{background:#ffffffe0;color:#173247;border:1px solid #fff;border-radius:10px;box-shadow:0 14px 60px #234d6e16;bottom:12vh;width:min(350px,32vw);padding:26px}.info-panel h2{font-size:clamp(23px,2vw,32px);margin:15px 0}.info-panel p{color:#46677c;font-size:13px;line-height:1.6}.panel-number{color:#3c7b9c}.track{background:#a1bdd250}.track i{background:#147eaf}.contact{background:white;color:#163247}.contact .eyebrow{color:#58778c}.cta{border-color:#163247}.cta:hover{background:#163247}footer{color:#57768b;background:#edf5fc}.media-error{background:#fff;color:#24485f;border-color:#94b3c9}.editor-body{background:#edf4fa;color:#173247}.editor-header{border-color:#c8d9e5}.editor-intro,.help,.status{color:#537186}.edit-card{background:white;border-color:#cfdee9;box-shadow:0 4px 20px #24476405}.edit-card h2,.edit-card h3,.field{color:#173247}.step{border-color:#9cb9ce;color:#386480}.field input:not([type=range]):not([type=checkbox]),.field textarea,.field select{background:#f3f8fc;color:#193d57;border-color:#bfd1df}.upload{border-color:#acc4d5}.upload label,.upload span{color:#426d89}.btn{color:#214f6c;border-color:#a6c0d2;background:#fff}.btn.primary{background:#163e59;border-color:#163e59;color:white}.savebar{background:#f8fcfff5;border-color:#bdd1df}.notice{background:#eaf4fc;border-color:#bdd7e9;color:#315b76}.small-link,.panel-remove{color:#3d6d8a}.mini-video,.slider-preview{background:#eaf3fb}.panel-readout{color:#426d89}.panel-edit{border-color:#cbdce8}.export-result{background:#e1f3ec;color:#214d40}.panel-head{flex-wrap:wrap}.upload input{color:#315b76}.editor-error{color:#b32b2b}.right-column>.edit-card{max-height:calc(100vh - 170px);overflow:auto}.form-row{flex-wrap:wrap}
@media(max-width:720px){.hero{min-height:53svh;padding:105px 20px 30px}.info-panel,.info-panel.right{left:18px;right:18px;bottom:66px;width:auto;max-height:32svh;padding:18px 21px}.info-panel h2{font-size:24px;margin:10px 0}.info-panel p{font-size:12px}.film-heading{top:18px}.film-heading .auto-play{font-size:9px}.wordmark span{letter-spacing:.05em}.right-column>.edit-card{max-height:none;overflow:visible}.hero .auto-play{font-size:10px}.contact h2{font-size:40px}}

/* Nueve posiciones independientes de tarjeta. */
.info-panel[data-position]{left:auto;right:auto;top:auto;bottom:auto;transform:translate(var(--point-card-tx,0),var(--point-card-ty,0));width:min(350px,calc(100% - 36px));max-height:calc(100svh - 210px);z-index:3;--point-card-tx:0;--point-card-ty:0}
.info-panel[data-position$="-left"]{left:max(18px,4vw)}
.info-panel[data-position$="-center"]{left:50%;--point-card-tx:-50%}
.info-panel[data-position$="-right"]{right:max(18px,4vw)}
.info-panel[data-position^="bottom-"]{bottom:max(70px,10svh)}
.info-panel[data-position^="middle-"]{top:50%;--point-card-ty:-50%}
.info-panel[data-position^="top-"]{top:110px}
.product-point{position:absolute;width:13px;height:13px;margin:-6.5px 0 0 -6.5px;border:2px solid white;border-radius:50%;background:#087eb4;box-shadow:0 0 0 1px #12638670,0 2px 8px #143c5740;pointer-events:none;z-index:2}
.product-point::after{content:"";position:absolute;inset:-9px;border:1px solid #138ab3a0;border-radius:50%;background:#43bde31c;animation:point-breathe 2.8s ease-in-out infinite}
@keyframes point-breathe{0%,100%{transform:scale(.75);opacity:.35}50%{transform:scale(1.28);opacity:.85}}
.point-controls{display:flex;flex-wrap:wrap;align-items:center;gap:12px;background:#eef6fc;border-radius:6px;padding:14px;margin:15px 0}.point-controls label{display:flex;align-items:center;gap:8px;font-size:12px}.point-controls .help{width:100%}.point-controls .btn{font-size:11px}
.point-dialog{border:1px solid #b6d2e3;border-radius:14px;background:#f8fcff;color:#17374e;width:min(1000px,94vw);max-height:94svh;padding:24px;overflow:auto}.point-dialog::backdrop{background:#102c46b3;backdrop-filter:blur(5px)}.point-dialog-head,.point-dialog-actions{display:flex;align-items:center;justify-content:space-between;gap:18px}.point-dialog h2{font-size:23px;margin:0;font-weight:400}.point-dialog-head .help{margin:8px 0 16px}.point-stage{position:relative;width:100%;height:clamp(220px,56svh,570px);background:#edf5fc;border-radius:8px;overflow:hidden;cursor:crosshair;touch-action:manipulation}.point-stage canvas{position:absolute;inset:0;width:100%;height:100%}.point-dialog .help{font-size:12px}.point-stage:focus-visible{outline:2px solid #087eb4;outline-offset:3px}
@media(max-width:720px){.info-panel[data-position]{width:min(300px,78vw);max-height:35svh;padding:18px}.info-panel[data-position^="top-"]{top:122px}.point-dialog{padding:15px}.point-dialog-head{gap:10px}.point-dialog h2{font-size:19px}.point-dialog-actions{gap:10px}.point-dialog .help{font-size:11px}}
@media(prefers-reduced-motion:reduce){.product-point::after{animation:none;opacity:.5}}

/* Móvil: evita recalcular el desenfoque sobre cada imagen en movimiento. */
@media(max-width:768px),(pointer:coarse){.info-panel{backdrop-filter:none;-webkit-backdrop-filter:none;background:#ffffffed;box-shadow:0 5px 24px #234d6e13}.film-stage{contain:paint}.film-heading .ghost{backdrop-filter:none}}

/* En móvil, todas las tarjetas quedan abajo para despejar el producto. */
@media(max-width:768px),(pointer:coarse){.info-panel[data-position]{top:auto;bottom:max(68px,calc(env(safe-area-inset-bottom,0px) + 52px));left:18px;right:18px;width:auto;transform:none;max-height:30svh;--point-card-tx:0;--point-card-ty:0}}

.download-sheet{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:#087ca8;color:white;border:1px solid #087ca8;border-radius:30px;min-height:46px;padding:15px 23px;font-size:11px;font-weight:700;letter-spacing:.06em;box-shadow:0 6px 24px #0b4c6d28;cursor:pointer}.download-sheet:hover{background:#075e83}.top-download{position:fixed;top:max(18px,env(safe-area-inset-top,0px));right:4vw;z-index:25}.has-datasheet .toplabel{margin-right:230px}.has-datasheet .film-heading{top:86px}.has-datasheet .info-panel[data-position^="top-"]{top:158px}.final-download{margin:0 14px 16px 0}.point-duration{width:70px;padding:8px;border:1px solid #b8cfdf;border-radius:5px;margin-left:8px}
@media(max-width:768px),(pointer:coarse){.top-download{top:max(12px,env(safe-area-inset-top,0px));right:14px;font-size:9px;padding:12px 17px;min-height:42px}.has-datasheet .film-heading{top:72px}.has-datasheet .topbar{padding-top:75px}.has-datasheet .toplabel{display:none}.has-datasheet .hero{padding-top:135px}.has-datasheet .info-panel[data-position]{top:auto}.final-download{display:flex;margin:0 auto 15px;width:fit-content}}