@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700&display=swap");
:root{
  --oppo-green:#1F9D55;
  --oppo-green-2:#0F7A3D;
  --black:#080808;
  --black-2:#111;
  --white:#fff;
  --bg:#f4f5f3;
  --card:#fff;
  --text:#151515;
  --muted:#69706b;
  --line:#e2e6e3;
  --danger:#c62828;
  --warning:#b77900;
  --shadow:0 12px 35px rgba(0,0,0,.08);
  --radius:20px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:OPPOSans,Inter,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text)}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.app{display:grid;grid-template-columns:260px 1fr;min-height:100vh}
.sidebar{position:sticky;top:0;height:100vh;background:var(--black);color:#fff;padding:24px 18px;overflow:auto}
.brand{display:flex;align-items:center;gap:12px;padding:8px 10px 28px}
.logo{width:42px;height:42px;border:2px solid var(--oppo-green);border-radius:50%;display:grid;place-items:center;color:var(--oppo-green);font-weight:900}
.brand strong{font-size:15px;letter-spacing:.08em}
.brand small{display:block;color:#a8ada9;margin-top:3px}
.nav button{width:100%;text-align:left;border:0;background:transparent;color:#c9ccc9;padding:13px 12px;border-radius:12px;margin:2px 0}
.nav button:hover,.nav button.active{background:#171b18;color:#fff}
.nav button.active{box-shadow:inset 3px 0 0 var(--oppo-green)}
.side-foot{margin-top:28px;padding:14px;color:#8f9691;font-size:12px;border-top:1px solid #252525;line-height:1.5}
.main{min-width:0}
.topbar{position:sticky;top:0;z-index:20;background:rgba(244,245,243,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding:14px 28px;display:flex;justify-content:space-between;align-items:center;gap:15px}
.search{display:flex;gap:8px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 12px;min-width:min(430px,55vw)}
.search input{border:0;outline:0;width:100%;background:transparent}
.top-actions{display:flex;gap:8px;flex-wrap:wrap}
.btn{border:1px solid var(--line);background:#fff;padding:10px 14px;border-radius:12px;font-weight:700}
.btn.primary{background:var(--oppo-green);color:#fff;border-color:var(--oppo-green)}
.btn.dark{background:var(--black);color:#fff;border-color:var(--black)}
.btn:hover{transform:translateY(-1px)}
.content{padding:30px;max-width:1500px;margin:auto}
.hero{background:linear-gradient(135deg,#080808 0%,#151815 60%,#0d2a18 100%);color:#fff;border-radius:28px;padding:42px;position:relative;overflow:hidden;box-shadow:var(--shadow)}
.hero:after{content:"";position:absolute;width:340px;height:340px;border:70px solid rgba(31,157,85,.12);border-radius:50%;right:-90px;top:-130px}
.eyebrow{color:#75d69c;text-transform:uppercase;font-weight:800;font-size:12px;letter-spacing:.16em}
.hero h1{font-size:clamp(32px,5vw,62px);line-height:.98;margin:12px 0}
.hero p{max-width:760px;color:#d3d8d4;font-size:17px;line-height:1.6}
.method{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.pill{border:1px solid rgba(255,255,255,.18);padding:8px 12px;border-radius:999px;color:#e8ece9;background:rgba(255,255,255,.05);font-size:12px;font-weight:800}
.grid{display:grid;gap:18px}
.grid-4{grid-template-columns:repeat(4,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.section{margin-top:30px}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:12px;margin-bottom:14px}
.section-head h2{margin:0;font-size:26px}
.section-head p{margin:4px 0 0;color:var(--muted)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:0 4px 18px rgba(0,0,0,.035)}
.kpi strong{display:block;font-size:32px}
.kpi span{color:var(--muted);font-size:13px}
.kpi .accent{color:var(--oppo-green)}
.card h3{margin:0 0 8px}
.card p{color:#555;line-height:1.55}
.badge{display:inline-flex;padding:5px 9px;border-radius:999px;background:#eaf7ef;color:#146c39;font-size:11px;font-weight:800}
.badge.gray{background:#f0f1f0;color:#555}
.badge.warn{background:#fff5dc;color:#805700}
.tabs{display:flex;gap:8px;overflow:auto;padding-bottom:4px}
.tab{border:1px solid var(--line);background:#fff;border-radius:999px;padding:9px 13px;white-space:nowrap;font-weight:700}
.tab.active{background:var(--black);color:#fff;border-color:var(--black)}
.toolbar{display:flex;flex-wrap:wrap;gap:10px;margin:15px 0}
.toolbar input,.toolbar select,.toolbar textarea{border:1px solid var(--line);background:#fff;border-radius:11px;padding:10px;outline:0}
.toolbar input:focus,.toolbar select:focus,.toolbar textarea:focus{border-color:var(--oppo-green)}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:16px;background:#fff}
table{width:100%;border-collapse:collapse;min-width:1000px}
th,td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;font-size:13px}
th{background:#f8f9f8;position:sticky;top:0;z-index:1}
tr:hover td{background:#fbfdfb}
.model-card{position:relative;overflow:hidden}
.model-card .stripe{height:5px;background:var(--oppo-green);position:absolute;top:0;left:0;right:0}
.model-card .model-top{display:flex;justify-content:space-between;gap:10px;align-items:start}
.model-card .specs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.spec{background:#f7f8f7;border-radius:12px;padding:9px}
.spec small{display:block;color:var(--muted);font-size:10px;text-transform:uppercase}
.spec b{font-size:13px}
.quote{border-left:4px solid var(--oppo-green);padding:12px 15px;background:#f5faf7;border-radius:0 12px 12px 0;line-height:1.5}
.compare-selects{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.select-big{width:100%;padding:13px;border-radius:12px;border:1px solid var(--line);background:#fff}
.compare-row{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:0;border-bottom:1px solid var(--line)}
.compare-row>div{padding:12px;border-right:1px solid var(--line)}
.compare-row>div:last-child{border-right:0}
.compare-row.header{font-weight:800;background:#f7f8f7}
.win{color:#11723b;font-weight:800}
.neutral{color:#555}
.sim{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.question{font-size:20px;font-weight:800;margin:8px 0 15px}
.choice{width:100%;text-align:left;padding:12px;border:1px solid var(--line);background:#fff;border-radius:12px;margin:6px 0}
.choice:hover{border-color:var(--oppo-green);background:#f5fbf7}
.result{padding:18px;border-radius:16px;background:#f5faf7;border:1px solid #d9eee1;margin-top:15px}
.progress{height:8px;background:#e4e8e5;border-radius:99px;overflow:hidden}
.progress i{display:block;height:100%;background:var(--oppo-green);width:0}
.quiz-opt.correct{border-color:#1b8b4c;background:#edf9f1}
.quiz-opt.wrong{border-color:#c62828;background:#fff0f0}
.flash{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.flash .mini{padding:16px;border-radius:16px;background:#111;color:#fff}
.mini b{display:block;color:#74d69b;margin-bottom:7px}
details{border:1px solid var(--line);border-radius:14px;padding:12px;background:#fff}
details+details{margin-top:8px}
summary{cursor:pointer;font-weight:800}
.editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}
textarea.editor{min-height:280px;width:100%;resize:vertical;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px}
.notice{padding:12px 14px;border-radius:12px;background:#fff7e5;border:1px solid #f0dfb2;color:#684d08;font-size:13px}
.hidden{display:none!important}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.58);display:grid;place-items:center;padding:20px;z-index:50}
.modal-box{background:#fff;border-radius:22px;max-width:900px;width:100%;max-height:88vh;overflow:auto;padding:25px}
.modal-head{display:flex;justify-content:space-between;align-items:center}
.close{border:0;background:#eee;width:36px;height:36px;border-radius:50%;font-weight:900}
.footer{text-align:center;color:#777;padding:35px 10px;font-size:12px}
@media(max-width:1050px){.app{grid-template-columns:82px 1fr}.sidebar{padding:18px 10px}.brand strong,.brand small,.nav span,.side-foot{display:none}.brand{justify-content:center}.nav button{text-align:center}.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.app{display:block}.sidebar{position:sticky;height:auto;z-index:30;padding:8px;display:flex;overflow:auto}.brand{padding:5px 8px}.nav{display:flex;gap:4px}.nav button{width:auto;white-space:nowrap;padding:10px}.nav button.active{box-shadow:inset 0 -3px 0 var(--oppo-green)}.topbar{padding:10px 14px}.search{min-width:0;flex:1}.content{padding:16px}.hero{padding:26px}.grid-4,.grid-3,.grid-2,.sim,.editor-grid,.compare-selects{grid-template-columns:1fr}.flash{grid-template-columns:1fr}.hero h1{font-size:42px}}

/* === Portfolio visual upgrade === */
.device-stage{height:220px;margin:8px 0 16px;border-radius:18px;background:linear-gradient(145deg,#f8fffb,#e9f8f1);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;perspective:900px;border:1px solid #e1eee7}
.device-stage::after{content:"";position:absolute;width:180px;height:24px;border-radius:50%;bottom:16px;background:rgba(0,0,0,.10);filter:blur(10px)}
.device-3d{width:88px;height:174px;border-radius:20px;position:relative;transform:rotateY(-18deg) rotateX(5deg) rotateZ(-2deg);box-shadow:22px 20px 30px rgba(0,0,0,.18),inset -5px 0 8px rgba(255,255,255,.25);border:2px solid rgba(0,0,0,.12);transition:transform .35s ease,filter .35s ease}
.model-card:hover .device-3d{transform:rotateY(-5deg) rotateX(2deg) translateY(-5px) rotateZ(-1deg);filter:drop-shadow(0 16px 18px rgba(0,0,0,.18))}
.device-screen{position:absolute;inset:5px;border-radius:16px;background:linear-gradient(160deg,#07110d 0%,#193d2c 55%,#0b0e0c 100%);overflow:hidden}
.device-screen::before{content:"";position:absolute;top:6px;left:50%;transform:translateX(-50%);width:26px;height:5px;border-radius:5px;background:#050505}
.device-camera{position:absolute;top:12px;left:9px;width:29px;height:44px;border-radius:10px;background:rgba(0,0,0,.62);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.device-camera::before,.device-camera::after{content:"";position:absolute;border-radius:50%;background:#0b0b0b;border:2px solid #555;width:12px;height:12px;left:6px}
.device-camera::before{top:6px}.device-camera::after{top:23px}
.device-label{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);font-size:8px;letter-spacing:1px;color:rgba(255,255,255,.75);font-weight:700}
.device-color-blue{background:linear-gradient(135deg,#243b72,#0d1b3b)}.device-color-white{background:linear-gradient(135deg,#f4f4f2,#bfc5c3)}.device-color-purple{background:linear-gradient(135deg,#b79adf,#503a72)}.device-color-red{background:linear-gradient(135deg,#9f3b48,#4d141e)}.device-color-dark{background:linear-gradient(135deg,#363b3b,#101212)}
.device-view-note{position:absolute;right:12px;top:12px;font-size:10px;font-weight:700;color:#1d9d6a;background:#fff;padding:6px 9px;border-radius:999px;box-shadow:0 4px 12px rgba(0,0,0,.06)}
.spec-hover{position:relative;cursor:help}
.spec-hover::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 9px);transform:translateX(-50%) translateY(5px);width:230px;padding:10px 12px;border-radius:12px;background:#111714;color:#fff;font-size:11px;line-height:1.4;font-weight:500;box-shadow:0 14px 30px rgba(0,0,0,.22);opacity:0;pointer-events:none;transition:.18s ease;z-index:30}
.spec-hover::before{content:"";position:absolute;left:50%;bottom:calc(100% + 3px);transform:translateX(-50%);border:6px solid transparent;border-top-color:#111714;opacity:0;pointer-events:none;z-index:31;transition:.18s ease}
.spec-hover:hover::after,.spec-hover:hover::before{opacity:1;transform:translateX(-50%) translateY(0)}
.spec-hover:hover{border-color:#bfe9d4;box-shadow:0 0 0 2px rgba(29,157,106,.08)}
.model-store{display:flex;gap:8px;align-items:center;margin-top:12px;flex-wrap:wrap}.store-link{font-size:11px;color:#087b4d;text-decoration:none;font-weight:800}.store-link:hover{text-decoration:underline}
@media(max-width:760px){.device-stage{height:190px}.spec-hover::after{left:10px;transform:translateY(5px);width:210px}.spec-hover:hover::after{transform:translateY(0)}.spec-hover::before{display:none}}

.v2grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.v2card{background:#fff;border:1px solid #e2e6e3;border-radius:18px;padding:18px}.v2card b{color:#14733c}.v2table{overflow:auto}.v2table table{min-width:850px}.v2table th,.v2table td{padding:11px;border-bottom:1px solid #e2e6e3}.v2pill{display:inline-block;padding:6px 10px;border-radius:99px;background:#eaf7ef;color:#146c39;font-weight:800;font-size:11px}.v2two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.v2quote{border-left:4px solid #1f9d55;background:#f1faf4;padding:13px;border-radius:0 12px 12px 0}.v2bad{background:#fff3f3;border:1px solid #efd0d0}.v2good{background:#f1faf4;border:1px solid #cdebd8}@media(max-width:760px){.v2grid,.v2two{grid-template-columns:1fr}}





















/* === V6 official product imagery + adaptive commercial tooltips === */
.official-stage{background:linear-gradient(145deg,#fbfffd,#edf8f2);}
.official-device-wrap{height:190px;width:100%;display:flex;align-items:center;justify-content:center;position:relative;z-index:2;transform-style:preserve-3d;}
.official-product{max-height:188px;max-width:86%;object-fit:contain;filter:drop-shadow(0 18px 16px rgba(0,0,0,.16));transform:perspective(900px) rotateY(-8deg) rotateX(2deg) rotateZ(-1deg);transition:transform .45s ease,filter .45s ease;}
.model-card:hover .official-product{transform:perspective(900px) rotateY(2deg) rotateX(0deg) translateY(-7px) scale(1.035);filter:drop-shadow(0 22px 22px rgba(0,0,0,.20));}
.device-3d-fallback{display:none;width:88px;height:174px;border-radius:20px;position:relative;box-shadow:22px 20px 30px rgba(0,0,0,.18);border:2px solid rgba(0,0,0,.12)}
.device-3d-fallback .device-screen{position:absolute;inset:5px;border-radius:16px;background:linear-gradient(160deg,#07110d,#193d2c 55%,#0b0e0c);overflow:hidden}
.image-source{position:absolute;left:12px;bottom:9px;font-size:9px;color:#74847c;background:rgba(255,255,255,.8);padding:4px 7px;border-radius:999px;z-index:4}
.spec-hover{overflow:visible;transition:.18s ease;}
.spec-hover::after{display:none;}
.spec-hover::before{display:none;}
.spec-tip{position:fixed;left:0;top:0;width:min(210px,calc(100vw - 28px));padding:10px 11px;border-radius:13px;background:#101713;color:#fff;font-size:10.5px;line-height:1.42;font-weight:500;box-shadow:0 16px 36px rgba(0,0,0,.24);opacity:0;pointer-events:none;transform:translateY(4px);transition:opacity .16s ease,transform .16s ease;z-index:9999}
.spec-hover:hover .spec-tip{opacity:1;transform:translateY(0)}
.spec-tip strong{display:block;font-size:10px;color:#9ff0c7;text-transform:uppercase;letter-spacing:.04em;margin-bottom:3px}
.spec-hover.tip-left .spec-tip{transform:translateX(0)}
.spec-hover.tip-right .spec-tip{transform:translateX(0)}
@media(max-width:760px){.official-device-wrap{height:165px}.official-product{max-height:162px;max-width:92%}.image-source{font-size:8px}.spec-tip{width:min(190px,calc(100vw - 24px));font-size:10px}}

/* === V7 · Portafolio limpio y visual uniforme === */
.product-visual{height:210px;margin:8px 0 16px;border-radius:18px;background:linear-gradient(145deg,#fbfffd,#f0f7f3);border:1px solid #e1ebe6;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}
.product-visual::after{content:"";position:absolute;left:50%;bottom:13px;transform:translateX(-50%);width:145px;height:18px;border-radius:50%;background:rgba(0,0,0,.10);filter:blur(9px)}
.visual-label{position:absolute;top:10px;left:11px;z-index:5;font-size:9px;font-weight:900;letter-spacing:.08em;color:#5f6d66;background:rgba(255,255,255,.88);padding:5px 7px;border-radius:999px}
.product-visual .official-product{position:relative;z-index:3;width:auto;height:auto;max-height:178px;max-width:78%;object-fit:contain;filter:drop-shadow(0 15px 15px rgba(0,0,0,.14));transform:none;transition:transform .28s ease,filter .28s ease}
.model-card:hover .product-visual .official-product{transform:translateY(-4px) scale(1.025);filter:drop-shadow(0 19px 19px rgba(0,0,0,.17))}
.image-fallback{display:none;position:relative;z-index:2;width:82px;height:166px;border-radius:19px;background:linear-gradient(145deg,#27302c,#0e1210);box-shadow:0 15px 25px rgba(0,0,0,.18);align-items:center;justify-content:flex-end;flex-direction:column;padding-bottom:17px;color:#fff}
.image-fallback span{font-size:8px;letter-spacing:.12em}.image-fallback small{font-size:8px;margin-top:5px;opacity:.7}
.product-visual.image-error .official-product{display:none}.product-visual.image-error .image-fallback{display:flex}
.spec-hover{position:relative;overflow:visible!important;cursor:help}
.spec-tip{position:fixed!important;width:220px!important;max-width:calc(100vw - 24px);padding:9px 11px!important;border-radius:11px!important;background:#111714!important;color:#fff!important;font-size:10.5px!important;line-height:1.38!important;box-shadow:0 12px 28px rgba(0,0,0,.20)!important;opacity:0!important;visibility:hidden;pointer-events:none;z-index:10000!important;transition:opacity .14s ease,transform .14s ease!important;transform:translateY(4px)!important}
.spec-hover:hover .spec-tip{opacity:1!important;visibility:visible;transform:translateY(0)!important}
.spec-tip strong{display:block!important;font-size:9px!important;letter-spacing:.08em!important;text-transform:uppercase;color:#8fe9b9!important;margin-bottom:3px}
.spec-tip span{display:block;color:#fff}
@media(max-width:760px){.product-visual{height:185px}.product-visual .official-product{max-height:155px;max-width:82%}.spec-tip{width:195px!important;font-size:10px!important}}


/* === V8 · Referencia visual del usuario: limpio, uniforme y centrado === */
.product-visual{
  height:176px;
  margin:8px 0 14px;
  border-radius:16px;
  background:linear-gradient(145deg,#f8fffd 0%,#edf9f4 100%);
  border:1px solid #e2eee8;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  overflow:hidden;
}
.product-visual::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:10px;
  transform:translateX(-50%);
  width:110px;
  height:13px;
  border-radius:50%;
  background:rgba(0,0,0,.08);
  filter:blur(8px);
}
.product-visual .official-product{
  position:relative;
  z-index:2;
  display:block;
  width:76%;
  height:142px;
  max-width:205px;
  max-height:142px;
  object-fit:contain;
  object-position:center;
  margin:auto;
  filter:drop-shadow(0 10px 10px rgba(0,0,0,.12));
  transform:none;
  transition:transform .22s ease,filter .22s ease;
}
.model-card:hover .product-visual .official-product{
  transform:translateY(-3px) scale(1.018);
  filter:drop-shadow(0 13px 13px rgba(0,0,0,.14));
}
.visual-label{display:none!important}
.image-source{display:none!important}
.image-fallback{width:70px;height:136px;border-radius:17px;padding-bottom:14px}

/* Pop-up: lectura grande, corta y agradable */
.spec-tip{
  width:270px!important;
  max-width:min(270px,calc(100vw - 28px));
  padding:13px 15px!important;
  border-radius:13px!important;
  font-size:14px!important;
  line-height:1.42!important;
  font-weight:500!important;
  letter-spacing:0!important;
  background:#101713!important;
  box-shadow:0 16px 34px rgba(0,0,0,.24)!important;
}
.spec-tip strong{
  font-size:12px!important;
  line-height:1.2!important;
  letter-spacing:.07em!important;
  margin-bottom:6px!important;
  color:#9bf0c5!important;
}
.spec-tip span{
  font-size:14px!important;
  line-height:1.42!important;
  color:#fff!important;
}
.spec-hover:hover{
  border-color:#bfe9d4;
  box-shadow:0 0 0 2px rgba(29,157,106,.08);
}
@media(max-width:760px){
  .product-visual{height:160px}
  .product-visual .official-product{height:128px;max-height:128px;width:82%}
  .spec-tip{width:240px!important;max-width:calc(100vw - 24px);font-size:13px!important}
  .spec-tip span{font-size:13px!important}
}


/* === V9 · Portafolio con fondo de referencia + imágenes normalizadas === */
#portafolio{
  background:#CFFFFF;
  margin:-30px;
  padding:30px;
  min-height:calc(100vh - 70px);
}
#portafolio .section-head h2,
#portafolio .section-head p{color:#080808}
#portafolio .toolbar{position:relative;z-index:2}
#portafolio .product-visual{
  background:#F4FFFC;
}
#portafolio .product-visual .official-product{
  width:205px;
  height:142px;
  max-width:205px;
  max-height:142px;
  object-fit:contain;
  object-position:center;
}
@media(max-width:760px){
  #portafolio{margin:-16px;padding:16px;min-height:calc(100vh - 56px)}
  #portafolio .product-visual .official-product{width:190px;height:132px;max-width:190px;max-height:132px}
}

/* === TALLER DE VENTAS · EXPERIENCIA TRANSVERSAL === */
#taller{
  background:linear-gradient(180deg,#f7fbfa 0%,#ffffff 42%,#f7fbfa 100%);
  margin:-30px;
  padding:30px;
  min-height:calc(100vh - 70px);
}
.sales-hero{
  display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:24px;
  padding:34px;border-radius:24px;background:#0b0d0c;color:#fff;
  box-shadow:0 18px 45px rgba(0,0,0,.10);position:relative;overflow:hidden;
}
.sales-hero:after{content:"";position:absolute;width:360px;height:360px;border-radius:50%;right:-140px;top:-190px;background:rgba(207,255,255,.18)}
.sales-hero h1{font-size:clamp(32px,4vw,54px);line-height:1.02;margin:10px 0 14px;letter-spacing:-.04em;position:relative;z-index:1}
.sales-hero h1 span{color:#cfffff}
.sales-hero p{max-width:720px;color:#d9e3df;line-height:1.65;position:relative;z-index:1}
.sales-hero-actions{display:flex;gap:10px;margin-top:22px;position:relative;z-index:2}
.sales-hero .btn{border-color:rgba(255,255,255,.18)}
.sales-score{align-self:stretch;border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.06);border-radius:18px;padding:22px;display:flex;flex-direction:column;justify-content:center;position:relative;z-index:2}
.sales-score small{font-size:10px;letter-spacing:.12em;color:#aebbb5}
.sales-score strong{font-size:48px;line-height:1;margin:10px 0;color:#cfffff}
.sales-score span{font-size:13px;color:#d9e3df;line-height:1.45}

.sales-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0 34px}
.sales-kpi{background:#fff;border:1px solid #e2e9e6;border-radius:16px;padding:18px 20px;display:flex;align-items:center;gap:14px;box-shadow:0 8px 25px rgba(18,35,28,.04)}
.sales-kpi b{font-size:25px;letter-spacing:-.03em}
.sales-kpi span{font-size:12px;color:#68736f;text-transform:uppercase;letter-spacing:.04em}

.sales-section-head{margin-top:28px}
.sales-section-head h2{margin-top:7px}
.sales-route{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin:16px 0 20px}
.sales-step{border:1px solid #e1e9e5;background:#fff;border-radius:15px;padding:15px;text-align:left;cursor:pointer;transition:.18s;min-height:112px}
.sales-step:hover,.sales-step.active{border-color:#9bdcc1;box-shadow:0 10px 24px rgba(25,130,88,.08);transform:translateY(-2px)}
.sales-step b{display:block;font-size:12px;color:#1d9d6a;margin-bottom:18px}
.sales-step span{display:block;font-size:12px;font-weight:800;letter-spacing:.08em}
.sales-step small{display:block;margin-top:6px;color:#77817d;line-height:1.35}

.sales-workshop-box{min-height:20px}
.sales-module,.chat-lab{background:#fff;border:1px solid #e0e8e4;border-radius:20px;overflow:hidden;box-shadow:0 12px 30px rgba(18,35,28,.05)}
.sales-module-head{padding:25px 28px 20px;background:#f2fbf7;display:flex;justify-content:space-between;gap:20px}
.sales-module-tag{font-size:10px;font-weight:800;letter-spacing:.12em;color:#1d9d6a}
.sales-module-head h2{font-size:26px;margin:8px 0}
.sales-module-head p{color:#67736e;max-width:760px;margin:0}
.module-number{font-size:52px;font-weight:800;line-height:1;color:#d4e9df}
.sales-module-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:0}
.module-actions{padding:24px 28px;border-right:1px solid #e8eeeb}
.module-actions>small,.module-script>small{font-size:10px;letter-spacing:.12em;font-weight:800;color:#7a8580}
.module-actions>div{display:flex;gap:14px;margin-top:14px;align-items:flex-start}
.module-actions>div b{font-size:11px;color:#1d9d6a;background:#edf8f3;padding:5px 7px;border-radius:7px}
.module-actions>div span{font-size:14px;line-height:1.45}
.module-script{padding:24px 28px}
.module-script blockquote{margin:14px 0;padding:17px;border-left:3px solid #1d9d6a;background:#f7faf9;border-radius:0 12px 12px 0;line-height:1.55}
.avoid{font-size:12px;color:#7b4545;background:#fff7f7;border:1px solid #f0dddd;padding:12px;border-radius:11px;line-height:1.45}
.avoid b{font-size:10px;letter-spacing:.08em}
.close-inline{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:0 28px 22px}
.close-inline button,.objection-row button{border:1px solid #e0e8e4;background:#fff;border-radius:12px;padding:13px;text-align:left;cursor:pointer}
.close-inline button.selected,.objection-row button.selected{border-color:#1d9d6a;background:#f1fbf6}
.close-inline b,.close-inline span{display:block}.close-inline b{font-size:12px}.close-inline span{font-size:11px;color:#707b76;margin-top:5px;line-height:1.35}
.detail-callout{margin:0 28px 24px;padding:15px 17px;border-radius:12px;background:#effaf5;border:1px solid #cbead9;line-height:1.55;font-size:13px}
.detail-callout b{display:block}.detail-callout span{display:block;color:#6e7974;margin:3px 0 6px}

.scenario-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:24px}
.scenario-card{background:#fff;border:1px solid #e0e8e4;border-radius:15px;padding:16px;text-align:left;cursor:pointer;min-height:190px;transition:.18s}
.scenario-card:hover,.scenario-card.selected{border-color:#9bdcc1;box-shadow:0 10px 25px rgba(25,130,88,.07);transform:translateY(-2px)}
.scenario-card>span{font-size:9px;letter-spacing:.11em;font-weight:800;color:#1d9d6a}
.scenario-card h3{font-size:15px;line-height:1.25;margin:12px 0 10px}
.scenario-card p{font-size:12px;color:#727d78;line-height:1.45;min-height:52px}
.scenario-card>b{font-size:11px;color:#111}

.chat-head{padding:18px 22px;background:#0b0d0c;color:#fff}
.chat-head span{display:block;font-size:9px;letter-spacing:.12em;color:#cfffff}.chat-head b{display:block;margin-top:5px;font-size:16px}
.chat-body{padding:22px;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.chat-client,.chat-goal,.chat-expert,.coach-note{border:1px solid #e1e9e5;border-radius:14px;padding:16px}
.chat-client{background:#fafbfb}.chat-goal{background:#f3fbf7}.chat-expert{grid-column:1/-1}
.chat-client small,.chat-goal small,.chat-expert small{font-size:9px;letter-spacing:.11em;font-weight:800;color:#75817c;display:block;margin-bottom:9px}
.chat-client div{background:#eaf0ed;border-radius:10px;padding:10px;margin-top:7px;font-size:13px}
.chat-goal b{font-size:14px;line-height:1.4}
.chat-expert>div{display:flex;gap:12px;margin-top:11px}.chat-expert>div b{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#1d9d6a;color:#fff;font-size:10px;flex:0 0 auto}.chat-expert span{font-size:13px;line-height:1.5}
.coach-note{grid-column:1/-1;background:#fffdf4;border-color:#eee6c6;font-size:12px;line-height:1.5}

.sales-lower-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:24px}
.sales-panel{background:#fff;border:1px solid #e0e8e4;border-radius:18px;padding:20px}
.panel-title{display:flex;gap:12px;align-items:center;margin-bottom:14px}.panel-title>span{font-size:24px}.panel-title small{display:block;font-size:9px;letter-spacing:.1em;color:#78837e}.panel-title h3{margin:3px 0 0;font-size:17px}
.objection-mini,.closing-mini{display:grid;gap:8px}
.objection-mini button,.closing-mini button{border:1px solid #e4ebe8;background:#fbfcfc;border-radius:11px;padding:11px 13px;text-align:left;cursor:pointer}
.objection-mini b,.closing-mini b{display:block;font-size:12px}.objection-mini span,.closing-mini span{display:block;font-size:11px;color:#717c77;margin-top:4px;line-height:1.35}

.sales-checklist{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:20px}
.check-item{display:flex;gap:12px;align-items:center;border:1px solid #e0e8e4;background:#fff;border-radius:12px;padding:12px 14px;cursor:pointer}
.check-item input{accent-color:#1d9d6a}.check-item span{display:flex;gap:10px;align-items:center;font-size:12px;line-height:1.4}.check-item span b{font-size:9px;color:#1d9d6a}.check-item.done{background:#f1fbf6;border-color:#c8ead8}

.objection-row{display:flex;flex-wrap:wrap;gap:8px;padding:0 28px 18px}.objection-row button{font-size:11px}
@media(max-width:1050px){
 .sales-route{grid-template-columns:repeat(3,1fr)}.scenario-grid{grid-template-columns:repeat(2,1fr)}.sales-kpis{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
 #taller{margin:-16px;padding:16px;min-height:calc(100vh - 56px)}
 .sales-hero{grid-template-columns:1fr;padding:24px}.sales-score{min-height:150px}
 .sales-route,.sales-kpis,.scenario-grid,.sales-lower-grid,.sales-checklist,.sales-module-grid,.chat-body{grid-template-columns:1fr}
 .module-actions{border-right:0;border-bottom:1px solid #e8eeeb}
 .close-inline{grid-template-columns:1fr 1fr;padding:0 18px 18px}
 .sales-module-head{padding:20px}.module-number{font-size:36px}
 .chat-expert{grid-column:auto}.coach-note{grid-column:auto}
 .chat-body{padding:16px}
}

/* === V11 · VISUAL CLEAN · inspirado en la lógica visual de Mi Entel === */
:root{
  --oppo-green:#42E8B4;
  --oppo-green-2:#16B890;
  --black:#12305A;
  --black-2:#0B2142;
  --bg:#F6F8FC;
  --card:#FFFFFF;
  --text:#10213D;
  --muted:#61708A;
  --line:#DDE5F0;
  --brand-blue:#002EFF;
  --brand-blue-soft:#F3F5FF;
  --brand-orange:#FF3D00;
  --shadow:0 10px 28px rgba(24,55,96,.07);
}
body{background:var(--bg);color:var(--text)}
.sidebar{background:#fff;color:var(--text);border-right:1px solid var(--line);padding:20px 14px}
.brand{padding:7px 10px 22px}
.logo{border-color:var(--brand-blue);color:var(--brand-blue);background:var(--brand-blue-soft)}
.brand strong{color:var(--brand-blue)}
.brand small{color:#7a89a1}
.nav button{color:#53647E}
.nav button:hover{background:#F3F5FF;color:var(--brand-blue)}
.nav button.active{background:#F3F5FF;color:var(--brand-blue);box-shadow:inset 3px 0 0 var(--brand-blue)}
.side-foot{color:#8290A5;border-top-color:var(--line)}
.topbar{background:rgba(255,255,255,.92);border-bottom-color:var(--line)}
.search{box-shadow:0 3px 14px rgba(24,55,96,.04)}
.btn.primary{background:var(--brand-blue);border-color:var(--brand-blue)}
.btn.chat-cta{color:var(--brand-blue);border-color:#C9D4EA;background:#fff}
.hero{background:linear-gradient(135deg,#F3F5FF 0%,#FFFFFF 58%,#E9FFF8 100%);color:var(--text);border:1px solid #E0E7F1}
.hero:after{border-color:rgba(0,46,255,.07)}
.hero p{color:#61708A}
.eyebrow{color:var(--brand-blue)}
.pill{border-color:#DCE4F0;color:#365174;background:#fff}
.card{box-shadow:var(--shadow);border-color:var(--line)}
.kpi .accent{color:var(--brand-blue)}
.tab.active{background:var(--brand-blue);border-color:var(--brand-blue)}
.badge{background:#E9FBF5;color:#137F63}
.choice:hover{border-color:#A8BFFF;background:#F3F5FF}
.result{background:#F3F5FF;border-color:#D8E0FF}
.flash .mini{background:#F3F5FF;color:var(--text);border:1px solid #DCE4F0}
.mini b{color:#0F9E7A}
#taller,#laboratorio{background:linear-gradient(180deg,#F7F9FC 0%,#FFFFFF 52%,#F7F9FC 100%);margin:-30px;padding:30px;min-height:calc(100vh - 70px)}
.sales-hero{background:linear-gradient(135deg,#F3F5FF 0%,#FFFFFF 65%,#E8FFF7 100%);color:var(--text);border:1px solid #DDE5F0;box-shadow:var(--shadow)}
.sales-hero:after{background:rgba(66,232,180,.12)}
.sales-hero h1 span{color:var(--brand-blue)}
.sales-hero p{color:#61708A}
.sales-hero .btn{border-color:#D5DFEE}
.sales-score{border:1px solid #DDE5F0;background:#fff}
.sales-score small{color:#71809A}
.sales-score strong{color:var(--brand-blue)}
.sales-score span{color:#61708A}
.sales-kpi{border-color:var(--line);box-shadow:var(--shadow)}
.sales-kpi b{color:var(--brand-blue)}
.sales-step{border-color:#DDE5F0;box-shadow:0 4px 14px rgba(24,55,96,.03)}
.sales-step:hover,.sales-step.active{border-color:#A9BAFF;box-shadow:0 10px 24px rgba(0,46,255,.08);background:#fff}
.sales-step b{color:var(--brand-blue)}
.sales-module,.chat-lab{border-color:#DDE5F0;box-shadow:var(--shadow)}
.sales-module-head{background:#F3F5FF}
.sales-module-tag{color:var(--brand-blue)}
.sales-practice-banner{margin-top:22px;padding:22px 24px;border:1px solid #DDE5F0;border-radius:20px;background:linear-gradient(100deg,#fff,#F3F5FF);display:flex;align-items:center;justify-content:space-between;gap:20px;box-shadow:var(--shadow)}
.sales-practice-banner h2{margin:6px 0 5px;font-size:23px}.sales-practice-banner p{margin:0;color:#61708A}
.compact-route{margin-bottom:18px}

/* LABORATORIO */
.lab-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px 32px;border-radius:24px;background:linear-gradient(135deg,#002EFF 0%,#2457FF 56%,#42E8B4 140%);color:#fff;box-shadow:0 18px 45px rgba(0,46,255,.15)}
.lab-hero .eyebrow{color:#CFFFFF}.lab-hero h1{font-size:clamp(30px,4vw,48px);line-height:1.02;margin:8px 0 10px;max-width:820px}.lab-hero p{margin:0;color:#EAF0FF;max-width:760px;line-height:1.55}.lab-hero-badge{width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);display:flex;flex-direction:column;align-items:center;justify-content:center;flex:none}.lab-hero-badge b{font-size:34px}.lab-hero-badge span{font-size:11px;text-transform:uppercase;letter-spacing:.08em;text-align:center}
.lab-stages{display:grid;grid-template-columns:repeat(6,1fr);gap:9px;margin:18px 0}.lab-stage{border:1px solid var(--line);background:#fff;border-radius:15px;padding:14px;text-align:left;min-height:104px;box-shadow:0 3px 12px rgba(24,55,96,.03)}.lab-stage b{font-size:11px;color:var(--brand-blue)}.lab-stage strong{display:block;margin:14px 0 4px;font-size:13px;letter-spacing:.06em}.lab-stage span{font-size:11px;color:#708099;line-height:1.35}.lab-stage:hover,.lab-stage.active{border-color:#A8B8FF;background:#F3F5FF;box-shadow:0 8px 22px rgba(0,46,255,.07)}
.lab-layout{display:grid;grid-template-columns:360px minmax(0,1fr);gap:18px;align-items:start}.lab-scenarios-panel{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;box-shadow:var(--shadow)}.lab-panel-head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:12px}.lab-panel-head h2{margin:5px 0 0;font-size:22px}.lab-panel-head>span{font-size:11px;color:#708099;background:#F3F5FF;border-radius:999px;padding:6px 9px}.lab-scenario-list{display:grid;gap:9px}.lab-scenario{width:100%;text-align:left;background:#fff;border:1px solid #E0E7F0;border-radius:14px;padding:13px;transition:.16s}.lab-scenario span{display:block;color:var(--brand-blue);font-size:9px;font-weight:900;letter-spacing:.1em}.lab-scenario strong{display:block;margin:5px 0;font-size:14px;color:var(--text)}.lab-scenario small{display:block;color:#71809A;line-height:1.4}.lab-scenario b{display:block;margin-top:9px;font-size:11px;color:#0F9E7A}.lab-scenario:hover,.lab-scenario.selected{border-color:#A8B8FF;background:#F7F9FF}
.whatsapp-card{background:#EAF3F1;border:1px solid #D4E1DE;border-radius:20px;overflow:hidden;box-shadow:var(--shadow);min-height:590px}.wa-top{height:64px;background:#fff;border-bottom:1px solid #DDE5E0;display:flex;align-items:center;gap:10px;padding:9px 14px}.wa-back,.wa-more{font-size:24px;color:#61708A}.wa-avatar{width:38px;height:38px;border-radius:50%;background:#42E8B4;color:#073D33;display:grid;place-items:center;font-weight:900}.wa-top div:nth-of-type(2){display:flex;flex-direction:column;flex:1}.wa-top b{font-size:14px}.wa-top small{font-size:10px;color:#0F9E7A;margin-top:2px}.wa-conversation{min-height:470px;padding:18px 20px;display:flex;flex-direction:column;gap:7px;background:radial-gradient(circle at 20% 0%,rgba(66,232,180,.13),transparent 32%),#EEF6F3}.wa-date{align-self:center;background:#fff;border-radius:999px;padding:5px 9px;color:#758397;font-size:9px;box-shadow:0 2px 6px rgba(0,0,0,.04);margin-bottom:4px}.wa-row{display:flex}.wa-row.client{justify-content:flex-start}.wa-row.agent{justify-content:flex-end}.wa-bubble{max-width:min(78%,520px);padding:9px 11px;border-radius:11px;position:relative;font-size:13px;line-height:1.45;box-shadow:0 1px 3px rgba(0,0,0,.06);color:#18304F;background:#fff}.wa-row.client .wa-bubble{border-top-left-radius:4px}.wa-row.agent .wa-bubble{background:#DDF8EC;border-top-right-radius:4px}.wa-bubble span{display:block;text-align:right;font-size:9px;color:#8390A0;margin-top:4px}.wa-bubble i{font-style:normal;color:#168B72}.wa-coach{margin:14px auto 0;max-width:90%;background:#FFF7E9;border:1px solid #FFE0B3;border-radius:12px;padding:10px 12px}.wa-coach small{display:block;color:var(--brand-orange);font-weight:900;font-size:9px;letter-spacing:.1em;margin-bottom:4px}.wa-coach b{font-size:11px;line-height:1.45;font-weight:600;color:#5C4B2B}.wa-compose{height:56px;background:#fff;border-top:1px solid #DDE5E0;display:flex;align-items:center;gap:12px;padding:9px 14px;color:#94A0AF;font-size:12px}.wa-compose span{flex:1;background:#F4F6F8;border-radius:999px;padding:10px 13px}.wa-compose b{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#002EFF;color:#fff}

/* Portafolio: igualar el tamaño visual de todos los equipos */
#portafolio .product-visual .official-product{width:205px;height:142px;max-width:205px;max-height:142px;object-fit:contain;object-position:center;transform:scale(1)}
#portafolio .model-oppo-reno16-f-5g .product-visual .official-product{transform:scale(1.34)}
#portafolio .model-oppo-reno16-f-5g:hover .product-visual .official-product{transform:translateY(-3px) scale(1.36)}
#portafolio .model-oppo-a6c .product-visual .official-product{transform:scale(1.05)}
#portafolio .model-oppo-reno16-5g .product-visual .official-product{transform:scale(1.08)}

@media(max-width:1050px){.lab-stages{grid-template-columns:repeat(3,1fr)}.lab-layout{grid-template-columns:1fr}.whatsapp-card{min-height:540px}.wa-conversation{min-height:410px}}
@media(max-width:760px){#taller,#laboratorio{margin:-16px;padding:16px}.lab-hero{padding:22px;flex-direction:column;align-items:flex-start}.lab-hero-badge{width:86px;height:86px;align-self:flex-end;margin-top:-72px}.lab-hero-badge b{font-size:25px}.lab-stages{grid-template-columns:repeat(2,1fr)}.sales-practice-banner{flex-direction:column;align-items:flex-start}.sales-hero{grid-template-columns:1fr;padding:24px}.lab-layout{grid-template-columns:1fr}.wa-bubble{max-width:88%}}
@media(max-width:520px){.lab-stages{grid-template-columns:1fr}.lab-hero-badge{margin-top:0;align-self:flex-start}.sales-kpis{grid-template-columns:1fr 1fr}}

/* V12 CLEAN VISUAL */
:root{--entel-blue:#002EFF;--entel-aqua:#42E8B4;--entel-orange:#FF3D00;--entel-bg:#F3F5FF;--entel-ink:#102040;--entel-muted:#667085;--entel-line:#DDE4F0}
body{background:var(--entel-bg);color:var(--entel-ink)}
.sidebar{background:#fff;color:var(--entel-ink);border-right:1px solid var(--entel-line);box-shadow:4px 0 22px rgba(16,32,64,.04)}
.logo{border-color:var(--entel-blue);color:var(--entel-blue)}.brand strong{color:var(--entel-ink)}.brand small{color:#7b879b}
.nav button{color:#53627a}.nav button:hover,.nav button.active{background:#EEF2FF;color:var(--entel-blue)}.nav button.active{box-shadow:inset 3px 0 0 var(--entel-blue)}
.side-foot{color:#7b879b;border-top-color:var(--entel-line)}.topbar{background:rgba(243,245,255,.94);border-bottom-color:var(--entel-line)}
.btn.primary{background:var(--entel-blue);border-color:var(--entel-blue)}.hero{background:linear-gradient(135deg,#fff,#F3F5FF 68%,#E9FFF7);color:var(--entel-ink);border:1px solid var(--entel-line)}.hero p{color:#5d6b82}.eyebrow{color:var(--entel-blue)}
.card,.sales-module,.lab-scenario,.lab-evaluation,.smart-compare-shell{box-shadow:0 8px 28px rgba(16,32,64,.06)}
.sales-hero,.lab-hero{background:linear-gradient(135deg,#fff,#F3F5FF 70%,#E9FFF7)!important;color:var(--entel-ink)!important;border:1px solid var(--entel-line)}.sales-hero p,.lab-hero p{color:#5d6b82!important}
.sales-step.active,.lab-stage.active{border-color:var(--entel-blue)!important;background:#EEF2FF!important;color:var(--entel-blue)}.lab-stage:hover,.sales-step:hover{border-color:#AEBBFF}
.sales-practice-banner{background:#fff;border:1px solid var(--entel-line)}
.lab-evaluation{margin-top:28px;background:#fff;border:1px solid var(--entel-line);border-radius:20px;padding:24px}.lab-eval-head{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:18px}.lab-eval-head h2{margin:6px 0}.lab-eval-head p{color:var(--entel-muted)}
.lab-score{min-width:210px;padding:18px;border-radius:16px;background:#fff;border:1px solid var(--entel-line)}.lab-score small{display:block;font-weight:800;font-size:10px;letter-spacing:.12em;color:#7b879b}.lab-score strong{display:block;font-size:38px;line-height:1.1;margin:6px 0;color:var(--entel-blue)}.lab-score span{font-size:12px;color:var(--entel-muted)}
.sales-checklist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.check-item{background:#F8FAFF!important;border:1px solid var(--entel-line)!important}.check-item.done{background:#ECFFF7!important;border-color:#B7F4DD!important}
.smart-compare-shell{background:#fff;border:1px solid var(--entel-line);border-radius:24px;padding:24px}.smart-compare-picker{background:#F7F9FF;border:1px solid var(--entel-line);border-radius:18px;padding:20px}.smart-picker-title,.smart-why-head{display:flex;align-items:center;gap:12px}.smart-picker-title>span,.smart-why-head>span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--entel-blue);color:#fff;font-weight:900}.smart-picker-title b,.smart-why-head b{display:block;font-size:12px;letter-spacing:.12em}.smart-picker-title small,.smart-why-head small{display:block;color:var(--entel-muted);margin-top:3px}
.smart-picker-fields{display:grid;grid-template-columns:220px 1fr;gap:12px;margin-top:16px}.smart-picker-fields label{font-size:12px;font-weight:800;color:#52617A}.smart-picker-fields select{width:100%;margin-top:6px;border:1px solid #CCD5E5;border-radius:12px;background:#fff;padding:12px;outline:0;color:var(--entel-ink)}.smart-source-note{margin-top:12px;padding:10px 12px;border-radius:12px;background:#fff;border:1px solid var(--entel-line);font-size:12px}.smart-source-note span{font-weight:900;color:var(--entel-blue);margin-right:8px}.smart-source-note b{margin-right:8px}.smart-source-note small{color:var(--entel-muted)}
.smart-empty{text-align:center;padding:52px 20px;color:var(--entel-muted)}.smart-empty span{display:grid;place-items:center;margin:0 auto 10px;width:52px;height:52px;border-radius:16px;background:#EEF2FF;color:var(--entel-blue);font-size:25px}.smart-empty h3{color:var(--entel-ink);margin:8px 0}
.smart-compare-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin-top:20px}.smart-column{border:1px solid var(--entel-line);border-radius:18px;padding:20px;background:#fff}.smart-column.competitor-column{background:#F8FAFF}.smart-column.oppo-column{background:linear-gradient(180deg,#fff,#F6FFFB)}.smart-col-label{font-size:10px;font-weight:900;letter-spacing:.12em;color:#7A879B}.smart-brand{display:inline-block;margin-top:12px;font-size:11px;font-weight:900;color:#52617A}.smart-brand.oppo-brand{color:#138C62}.smart-column h3{font-size:20px;margin:7px 0}.smart-column p{color:#667085;font-size:13px;line-height:1.5}.smart-sku{margin-top:16px;padding:10px;background:#fff;border:1px dashed #CCD5E5;border-radius:12px}.smart-sku small{display:block;font-size:9px;font-weight:900;color:#7A879B}.smart-sku b{font-size:11px;word-break:break-word}
.smart-mini-specs{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}.smart-mini-specs span{font-size:10px;font-weight:800;padding:6px 8px;border-radius:999px;background:#EEF2FF;color:#30457A}.smart-highlight{padding:12px;border-radius:13px;background:#ECFFF7;margin:10px 0 14px}.smart-highlight b{display:block;font-size:10px;color:#138C62;text-transform:uppercase}.smart-highlight span{display:block;margin-top:4px;font-size:13px;font-weight:800}
.smart-why{margin-top:18px;padding:20px;border:1px solid var(--entel-line);border-radius:18px;background:#FBFCFF}.smart-why-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}.smart-why-grid article{display:flex;gap:12px;background:#fff;border:1px solid var(--entel-line);border-radius:16px;padding:16px}.why-number{display:grid;place-items:center;min-width:34px;height:34px;border-radius:10px;background:#E9FFF7;color:#138C62;font-weight:900}.smart-why-grid article b{font-size:14px}.smart-why-grid article p{margin:8px 0 0;color:#5E6B81;font-size:12px;line-height:1.45}.smart-pitch{margin-top:12px;padding:10px 12px;border-left:3px solid var(--entel-blue);background:#F3F5FF;font-size:12px;color:#3E4D69}.smart-coach-line{margin-top:14px;padding:13px 15px;border-radius:13px;background:#FFF7F3;color:#5F514B;font-size:12px;line-height:1.5}.smart-coach-line b{color:var(--entel-orange)}
@media(max-width:900px){.smart-compare-grid,.smart-why-grid{grid-template-columns:1fr}.smart-picker-fields{grid-template-columns:1fr}.lab-eval-head{flex-direction:column;align-items:stretch}.lab-score{min-width:0}.sales-checklist{grid-template-columns:1fr}}

/* V13 · LIMPIO + ACADEMIA + PORTAFOLIO */
body{background:#eef5ff}
.sales-kpis{display:none!important}
.sales-route{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.lab-stages{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.lab-stage strong{font-size:12px}













/* all product visuals use one visual window and centered content */
.product-visual{height:190px!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important;background:#effbf8!important;border-radius:16px!important}
.product-visual .official-product{width:86%!important;height:165px!important;max-width:86%!important;max-height:165px!important;object-fit:contain!important;object-position:center!important;display:block!important;margin:auto!important;transform:none!important}
.product-visual:hover .official-product{transform:scale(1.025)!important}
/* user-supplied portrait image needs the same perceived visual size */
.product-visual img[src*="reno16-f-5g-user"]{width:66%!important;height:170px!important;max-width:66%!important;max-height:170px!important}
.product-visual img[src*="reno16-5g-user"]{width:78%!important;height:165px!important;max-width:78%!important;max-height:165px!important}
.product-visual img[src*="a6c-user"]{width:86%!important;height:165px!important;max-width:86%!important;max-height:165px!important}
@media(max-width:1050px){.sales-route,.lab-stages{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:700px){.sales-route,.lab-stages{grid-template-columns:1fr!important}.product-visual{height:175px!important}}

/* V14 — Academia legible + comparador comercial */



#techTabs{background:transparent;border:0;padding:0;gap:9px;display:flex;flex-wrap:wrap;margin:16px 0 22px}
#techTabs .tab{background:#fff;border:1px solid #d8e8e5;color:#17324f;border-radius:999px;padding:10px 14px;font-weight:800;box-shadow:0 4px 12px rgba(17,80,72,.05)}
#techTabs .tab.active{background:#002EFF;color:#fff;border-color:#002EFF}



.compare-spec-list{display:grid;gap:7px;margin-top:14px}.compare-spec-list>div{padding:9px 10px;border:1px solid #e2e8f0;border-radius:11px;background:#fff}.compare-spec-list small{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:#7b879b;font-weight:900}.compare-spec-list b{display:block;font-size:12px;line-height:1.35;color:#263a57;margin-top:3px}.smart-column.oppo-column .compare-spec-list>div{background:#fbfffd;border-color:#d9eee6}.smart-highlight{margin-top:12px!important}.compact-model-btn{padding:9px 13px!important;font-size:12px!important;border-radius:10px!important}
.smart-sku{display:none!important}.smart-source-note small{font-size:11px}.smart-column.competitor-column{background:#f8faff!important}
.modal-box{max-width:680px!important;width:min(680px,calc(100vw - 36px))!important;max-height:82vh!important;padding:20px!important;border-radius:18px!important;box-shadow:0 18px 55px rgba(16,32,64,.18)!important}.modal-head h2{font-size:20px!important}.modal-box .btn{font-size:12px;padding:9px 12px}

@media(max-width:700px){.smart-compare-grid{grid-template-columns:1fr!important}}


/* ===== V18 · VISUAL SYSTEM ===== */
:root{--navy:#102A56;--navy2:#183A72;--aqua:#DDF8F7;--cyan:#59D9E6;--lav:#EDE6FF;--violet:#7657F5;--coral:#FF6B6B;--ink:#172033;--muted:#64748B;--surface:#fff;--soft:#F7FAFC;--line2:#DCE5EF}
body{background:linear-gradient(180deg,#F8FBFD 0%,#FFFFFF 48%,#F8F7FF 100%);color:var(--ink)}
.sidebar{background:linear-gradient(180deg,#102A56 0%,#132F61 55%,#1A3D74 100%)!important;color:#fff!important;border-right:0!important;box-shadow:8px 0 28px rgba(16,42,86,.12)!important}
.sidebar .brand strong,.sidebar .brand small,.sidebar .nav button,.sidebar .side-foot{color:#fff!important}
.sidebar .logo{background:linear-gradient(135deg,#59D9E6,#7657F5)!important;color:#fff!important}
.nav button{border-radius:12px!important}
.nav button:hover{background:rgba(255,255,255,.10)!important}
.nav button.active{background:linear-gradient(90deg,rgba(89,217,230,.22),rgba(118,87,245,.22))!important;color:#fff!important;box-shadow:inset 3px 0 0 #59D9E6!important}
.topbar{background:rgba(255,255,255,.88)!important;border-bottom:1px solid #E3EAF2!important;backdrop-filter:blur(12px)}
.search{border-color:#D9E3EF!important;background:#fff!important;box-shadow:0 5px 18px rgba(16,42,86,.05)}
.card,.sales-module,.lab-scenario,.lab-evaluation,.smart-compare-shell{border-color:var(--line2)!important;box-shadow:0 8px 26px rgba(16,42,86,.055)!important;border-radius:16px!important}
.hero{background:linear-gradient(135deg,#E7FAFA 0%,#F5F1FF 54%,#FFFFFF 100%)!important;border:1px solid #DFE6F0!important}
.hero h1{background:linear-gradient(90deg,#1677C8,#7657F5);-webkit-background-clip:text;background-clip:text;color:transparent}
.method .pill{background:#fff!important;border-color:#DCE5EF!important;color:#30456B!important}
.sales-step:nth-child(1){background:linear-gradient(145deg,#F0FCFC,#fff)}
.sales-step:nth-child(2){background:linear-gradient(145deg,#F2F6FF,#fff)}
.sales-step:nth-child(3){background:linear-gradient(145deg,#FFF7F3,#fff)}
.sales-step:nth-child(4){background:linear-gradient(145deg,#F7F2FF,#fff)}
.sales-step:nth-child(1) b{color:#159EAE}.sales-step:nth-child(2) b{color:#3575D3}.sales-step:nth-child(3) b{color:#E85D45}.sales-step:nth-child(4) b{color:#7657F5}
.sales-step:hover,.sales-step.active{transform:translateY(-2px);box-shadow:0 12px 25px rgba(16,42,86,.08)!important}





.smart-compare-shell{border-radius:18px!important}.smart-compare-picker{border-radius:15px!important;background:linear-gradient(100deg,#F2FCFC,#F7F3FF)!important}
.smart-column{border-radius:16px!important}.smart-column.competitor-column{background:#F7F9FC!important}.smart-column.oppo-column{background:linear-gradient(180deg,#fff,#F1FCFA)!important;border-top:3px solid #59D9E6!important}
.smart-advantage-box{margin-top:14px;padding:14px;border:1px solid #CFEDE8;border-radius:14px;background:linear-gradient(145deg,#F1FCFA,#F8F7FF)}
.smart-advantage-box>b{display:block;color:#173A70;font-size:11px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:9px}
.adv-row{display:flex;gap:8px;align-items:flex-start;margin:8px 0}.adv-row span{color:#0C9B80;font-weight:900}.adv-row p{margin:0!important;font-size:12px!important;color:#40526D!important}
.smart-reading{margin-top:12px;padding:13px;border-left:3px solid #7657F5;border-radius:0 12px 12px 0;background:#F7F3FF}.smart-reading span{font-size:9px;font-weight:900;letter-spacing:.12em;color:#7657F5}.smart-reading p{margin:6px 0 0!important;color:#354764!important;font-size:12px!important}
.competitor-neutral{color:#71809A!important;font-size:12px!important;margin-top:18px!important}
/* Trainer */
.trainer-shell{border:1px solid #DCE5EF!important;background:#fff!important;border-radius:18px!important;box-shadow:0 10px 30px rgba(16,42,86,.06)!important}
.trainer-head{background:linear-gradient(110deg,#EAFBFA,#F5F0FF)!important;border-bottom:1px solid #DCE5EF!important}
.trainer-status{border-color:#D8E2EF!important;background:#fff!important}.trainer-dot{background:#59D9E6!important}
.trainer-choice{border-radius:12px!important;border-color:#DCE5EF!important;background:#fff!important}.trainer-choice:hover{border-color:#7657F5!important;background:#F8F6FF!important}
.trainer-feedback{border-radius:13px!important;background:linear-gradient(135deg,#F0FCFC,#F7F3FF)!important;border-color:#DCE5EF!important}
.trainer-score-mini strong{color:#7657F5!important}
/* Battle Radar */
.battle-hero{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px;border:1px solid #DCE5EF;border-radius:18px;background:linear-gradient(120deg,#E8FAFA,#F5F0FF 65%,#fff);box-shadow:0 8px 25px rgba(16,42,86,.05);margin-bottom:18px}.battle-hero h2{margin:7px 0}.battle-hero p{max-width:760px;color:#64748B;margin:0;line-height:1.55}.battle-radar{min-width:190px;padding:18px;border-radius:16px;background:#102A56;color:#fff;box-shadow:0 10px 25px rgba(16,42,86,.18)}.battle-radar span{display:block;font-size:9px;letter-spacing:.14em;color:#59D9E6;font-weight:900}.battle-radar strong{display:block;margin-top:8px;font-size:15px}.battle-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:16px}.battle-controls,.battle-move{background:#fff;border:1px solid #DCE5EF;border-radius:16px;padding:20px;box-shadow:0 8px 24px rgba(16,42,86,.05)}.battle-card-title{display:flex;gap:11px;align-items:center}.battle-card-title>span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#102A56;color:#fff;font-weight:900}.battle-card-title b{display:block;font-size:11px;letter-spacing:.1em}.battle-card-title small{color:#71809A}.battle-scenarios{display:grid;gap:8px;margin-top:16px}.battle-chip{border:1px solid #DCE5EF;background:#FAFCFE;border-radius:12px;padding:12px;text-align:left;cursor:pointer;color:#30415F;font-weight:700}.battle-chip.active{background:linear-gradient(90deg,#EAFBFA,#F4F0FF);border-color:#B5C5E6;color:#173A70}.battle-client-quote{margin-top:14px;padding:16px;border-radius:13px;background:#F7F9FC;color:#4B5D78;font-size:14px;font-style:italic}.battle-move-head h3{margin:6px 0 14px}.battle-steps{display:grid;gap:9px}.battle-step{display:flex;gap:11px;padding:12px;border-radius:12px;background:#F8FAFC;border:1px solid #E1E8F0}.battle-step.active{background:#F0FCFC;border-color:#A9E6DF}.battle-step b{color:#7657F5}.battle-step span{font-size:13px;color:#40526D}.battle-script{display:flex;gap:10px;margin:15px 0;padding:14px;border-radius:13px;background:#F7F3FF;border:1px solid #E4DAFF}.battle-script span{font-size:20px}.battle-script b{font-size:11px;color:#7657F5}.battle-script p{margin:4px 0 0;color:#40526D;font-size:13px;line-height:1.5}.battle-debrief{margin-top:16px;padding:14px 16px;border-radius:13px;background:#FFF7F3;border:1px solid #F4DDD5;color:#5F514B}.battle-debrief b{display:block;color:#E45E43;font-size:11px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px}.battle-debrief span{font-size:12px}
@media(max-width:900px){.battle-layout{grid-template-columns:1fr}.battle-hero{flex-direction:column;align-items:flex-start}.battle-radar{width:100%;min-width:0}.sales-route{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:700px){.sales-route{grid-template-columns:1fr!important}.battle-hero{padding:20px}.battle-layout{gap:12px}}


/* ===== V19 · REFINAMIENTO ===== */
.sidebar .nav-group-title{padding:12px 12px 7px;font-size:9px;font-weight:900;letter-spacing:.12em;color:rgba(255,255,255,.58);text-transform:uppercase}.sidebar .nav-group-title.oppo-title{color:#8FE8F0}.sidebar .nav-divider{height:1px;background:rgba(255,255,255,.13);margin:12px 10px}.sidebar .brand strong{font-size:15px}.nav button{border-radius:12px!important}.lab-hero .lab-hero-actions{display:flex;gap:10px;margin-top:18px}.trainer-drawer{margin-top:18px}.trainer-close{margin-left:10px;border:0;background:#EEF3FA;color:#30415F;border-radius:9px;width:30px;height:30px;font-size:20px;cursor:pointer}.trainer-close:hover{background:#E3EAF5}.lab-stage{border-radius:14px!important;border:1px solid #DCE5EF!important;color:#263A57!important;transition:.18s ease}.lab-stage:nth-child(1){background:linear-gradient(145deg,#E5FAFA,#F7FFFF)!important}.lab-stage:nth-child(2){background:linear-gradient(145deg,#EAF1FF,#FBFCFF)!important}.lab-stage:nth-child(3){background:linear-gradient(145deg,#FFF0EA,#FFFDFC)!important}.lab-stage:nth-child(4){background:linear-gradient(145deg,#F1EAFF,#FCFAFF)!important}.lab-stage:nth-child(1) b{color:#139CAD}.lab-stage:nth-child(2) b{color:#3575D3}.lab-stage:nth-child(3) b{color:#E45E43}.lab-stage:nth-child(4) b{color:#7657F5}.lab-stage.active{box-shadow:0 10px 22px rgba(16,42,86,.08)!important;transform:translateY(-1px)}.battle-step{width:100%;text-align:left;font:inherit;cursor:pointer}.battle-step:hover{border-color:#B9DCD9;transform:translateY(-1px)}.battle-step.active{box-shadow:inset 3px 0 0 #59D9E6}.battle-chip:focus-visible,.trainer-choice:focus-visible,.lab-stage:focus-visible{outline:3px solid rgba(118,87,245,.22);outline-offset:2px}.footer{display:none!important}
@media(max-width:700px){.lab-hero .lab-hero-actions{flex-wrap:wrap}.trainer-close{width:28px;height:28px}}

/* === V21 · ORDEN COMERCIAL + CIERRES INTERACTIVOS === */
.sidebar .nav button{font-weight:650!important;letter-spacing:.005em}
.sidebar .nav-group-title{font-weight:800!important}
.workshop-start{margin-top:22px!important;background:linear-gradient(135deg,#F7FBFF 0%,#FFFFFF 58%,#F5F0FF 100%)!important;border:1px solid #DCE5EF!important}
.workshop-start-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:16px}
.workshop-start-grid>div{padding:16px;border:1px solid #E0E7F0;border-radius:12px;background:rgba(255,255,255,.82)}
.workshop-start-grid b{display:block;font-size:11px;letter-spacing:.06em;color:#315BCE;margin-bottom:7px}
.workshop-start-grid span{display:block;font-size:12px;line-height:1.45;color:#62728A}
.standalone-evaluation{margin-top:18px!important}
.start-note{background:linear-gradient(135deg,#F2FBFA,#F7F3FF)!important}
.start-note h3{margin:7px 0}
.start-note p{color:#62728A;max-width:760px}
.closing-selector{border-top:1px solid #E4EAF1;padding:20px 28px 26px;background:#FCFDFF}
.closing-selector-head{display:flex;justify-content:space-between;align-items:end;gap:15px;margin-bottom:14px}
.closing-selector-head small{font-size:10px;letter-spacing:.12em;font-weight:800;color:#526B9A}
.closing-selector-head h3{margin:5px 0 0;font-size:18px}
.closing-selector-head>span{font-size:11px;color:#708099}
.close-inline{padding:0!important}
.close-inline .closing-type{min-height:84px;background:#fff;border:1px solid #DDE5EF;transition:.18s}
.close-inline .closing-type:hover{border-color:#8B7CFF;transform:translateY(-1px)}
.close-inline .closing-type.selected{border-color:#315BCE;background:#F2F5FF;box-shadow:0 7px 18px rgba(49,91,206,.08)}
.detail-callout{margin:14px 0 0!important;background:linear-gradient(135deg,#EFFBFA,#F7F3FF)!important;border-color:#D6E4F2!important}
.detail-callout p{margin:8px 0;color:#52627A}
.detail-callout blockquote{margin:12px 0 0;padding:12px 14px;border-left:3px solid #315BCE;background:#fff;border-radius:0 10px 10px 0;line-height:1.5}
@media(max-width:900px){.workshop-start-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.workshop-start-grid{grid-template-columns:1fr}.closing-selector{padding:18px}.closing-selector-head{align-items:flex-start;flex-direction:column}.close-inline{grid-template-columns:1fr!important}}

/* =========================================================
   V22 · IDENTIDAD VISUAL FOTOGRÁFICA
   ========================================================= */
:root{--navy:#0C2854;--navy2:#123B76;--aqua:#59D9E6;--violet:#7657F5;--coral:#F17B56;--soft:#F5F8FF}

/* Academia OPPO: hero con producto real */
.oppo-hero-visual{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);align-items:stretch;min-height:390px;overflow:hidden!important;position:relative;background:linear-gradient(120deg,#E9FAFC 0%,#F4F0FF 55%,#FFFFFF 100%)!important;border:1px solid #DDE6F2!important;padding:0!important}
.oppo-hero-copy{padding:48px 42px 42px;position:relative;z-index:3}
.oppo-hero-copy h1{font-size:clamp(36px,4.5vw,62px);line-height:.98;margin:12px 0 18px;letter-spacing:-.045em;background:linear-gradient(90deg,#1677C8,#7657F5);-webkit-background-clip:text;background-clip:text;color:transparent}
.oppo-hero-copy h1 span{color:inherit}
.oppo-hero-copy p{max-width:650px;color:#53647D;font-size:17px;line-height:1.65}
.oppo-hero-products{position:relative;min-height:390px;background:radial-gradient(circle at 60% 45%,rgba(89,217,230,.28),transparent 35%),linear-gradient(145deg,#EEF9FF,#F6F1FF);overflow:hidden}
.oppo-hero-products:before{content:"";position:absolute;width:330px;height:330px;border-radius:50%;right:12%;top:35px;background:rgba(255,255,255,.7);box-shadow:0 20px 60px rgba(64,83,150,.12)}
.oppo-hero-products:after{content:"";position:absolute;inset:auto -80px -120px auto;width:360px;height:250px;border-radius:50%;background:rgba(118,87,245,.12);transform:rotate(-15deg)}
.oppo-device{position:absolute;z-index:2;filter:drop-shadow(0 18px 20px rgba(26,55,99,.18));display:flex;align-items:flex-end;justify-content:center}
.oppo-device img{width:100%;height:100%;object-fit:contain;display:block}
.device-main{width:190px;height:310px;right:28%;top:48px;z-index:4;transform:rotate(-2deg)}
.device-back{width:175px;height:300px;right:8%;top:76px;z-index:3;transform:rotate(7deg);opacity:.95}
.device-front{width:135px;height:250px;right:51%;top:120px;z-index:5;transform:rotate(-10deg);opacity:.92}
.oppo-hero-tag{position:absolute;right:28px;bottom:22px;z-index:6;background:#0C2854;color:#fff;padding:10px 14px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 8px 20px rgba(12,40,84,.2)}

/* Taller: fotografía comercial como elemento protagonista */
#taller .sales-hero{background-image:linear-gradient(90deg,rgba(246,250,255,.98) 0%,rgba(246,250,255,.92) 39%,rgba(246,250,255,.42) 66%,rgba(246,250,255,.10) 100%),url("../assets/hero-taller-ventas.png")!important;background-size:cover;background-position:center right!important;min-height:365px;display:flex;align-items:center}
#taller .sales-hero h1{max-width:760px}
#taller .sales-hero p{max-width:650px}
.skill-visual-banner{min-height:220px;margin:20px 0;border-radius:22px;overflow:hidden;position:relative;background-image:linear-gradient(90deg,rgba(9,31,66,.82),rgba(9,31,66,.46),rgba(9,31,66,.08)),url("../assets/hero-taller-ventas.png");background-size:cover;background-position:center 55%;box-shadow:0 16px 36px rgba(16,42,86,.10);display:flex;align-items:center}
.skill-visual-copy{padding:30px 38px;max-width:690px;color:#fff}
.skill-visual-copy .eyebrow{color:#9EF3F0}
.skill-visual-copy h2{font-size:clamp(27px,3.2vw,42px);margin:8px 0 10px;line-height:1.02}
.skill-visual-copy p{margin:0;line-height:1.55;color:#F1F6FF;max-width:620px}

/* Laboratorio: mantiene el foco en la práctica, pero con identidad visual */
#laboratorio .lab-hero{background-image:linear-gradient(90deg,rgba(12,40,84,.94),rgba(18,59,118,.78),rgba(18,59,118,.28)),url("../assets/hero-taller-ventas.png")!important;background-size:cover;background-position:center right!important;min-height:280px}
#laboratorio .lab-hero .eyebrow{color:#A6F3EF}
#laboratorio .lab-hero h1,#laboratorio .lab-hero p{color:#fff!important}

/* Academia OPPO: módulos con imagen y producto */
#inicio .card{border-radius:18px}
#inicio .oppo-hero-visual + .section{margin-top:20px}
#inicio .flash .mini{position:relative;overflow:hidden}
#inicio .flash .mini:after{content:"";position:absolute;right:-18px;bottom:-25px;width:90px;height:90px;border-radius:50%;background:linear-gradient(135deg,rgba(89,217,230,.20),rgba(118,87,245,.18));}

/* Filtros y tarjetas: sensación de plataforma, no de documento */
.section,.card,.lab-scenarios-panel,.whatsapp-card,.smart-compare-shell,.smart-compare-picker{box-shadow:0 8px 26px rgba(16,42,86,.045)}
.btn,.tab,.sales-step,.lab-stage{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.btn:hover,.tab:hover,.sales-step:hover,.lab-stage:hover{transform:translateY(-1px)}

@media(max-width:900px){
  .oppo-hero-visual{grid-template-columns:1fr;min-height:0}
  .oppo-hero-products{min-height:300px}
  .device-main{width:160px;height:260px;right:27%;top:35px}
  .device-back{width:145px;height:250px;right:6%;top:50px}
  .device-front{width:115px;height:215px;right:50%;top:80px}
}
@media(max-width:620px){
  .oppo-hero-copy{padding:30px 24px}
  .oppo-hero-products{min-height:250px}
  .device-main{width:135px;height:220px;right:25%;top:25px}
  .device-back{width:120px;height:205px;right:2%;top:38px}
  .device-front{width:92px;height:175px;right:52%;top:65px}
  .oppo-hero-tag{right:14px;bottom:14px;font-size:9px}
  .skill-visual-copy{padding:25px}
}

/* =========================================================
   V23 · IDENTIDAD VISUAL INTEGRAL · OPPO EVOLUTION
   Referencia visual: panel limpio, aqua/azul/violeta/coral,
   tarjetas suaves, iconografía y Ollie como hilo conductor.
   ========================================================= */
:root{
  --v23-navy:#08275b;
  --v23-navy2:#123b7b;
  --v23-blue:#2477f2;
  --v23-aqua:#39d7cf;
  --v23-mint:#dff9f7;
  --v23-violet:#7657f5;
  --v23-purple:#9a5cff;
  --v23-coral:#ff845f;
  --v23-orange:#ffb43b;
  --v23-ink:#10254a;
  --v23-muted:#637696;
  --v23-line:#dce7f4;
  --v23-bg:#f4f8fd;
  --v23-white:#fff;
}
html{background:var(--v23-bg)}
body{background:linear-gradient(180deg,#f6faff 0%,#eef7ff 52%,#f8f6ff 100%)!important;color:var(--v23-ink)!important;font-family:OPPOSans,Inter,Segoe UI,Arial,sans-serif}
.app{grid-template-columns:190px 1fr!important;min-height:100vh}
.sidebar{position:sticky!important;top:0!important;height:100vh!important;padding:18px 12px!important;background:linear-gradient(180deg,#07265a 0%,#0a2d67 55%,#103d80 100%)!important;color:#fff!important;border:0!important;box-shadow:8px 0 28px rgba(7,38,90,.16)!important;z-index:50}
.sidebar .brand{padding:3px 8px 16px!important;border-bottom:1px solid rgba(255,255,255,.13)!important;margin-bottom:9px!important;align-items:flex-start!important}
.sidebar .logo{width:auto!important;height:auto!important;background:none!important;border-radius:0!important;color:#fff!important;font-size:0!important;box-shadow:none!important;display:block!important}
.sidebar .logo:before{content:"oppo";display:block;font-size:24px;font-weight:500;letter-spacing:-.08em;line-height:.9;color:#fff}
.sidebar .logo:after{content:"EVOLUTION";display:block;font-size:7px;letter-spacing:.28em;font-weight:800;margin-top:5px;color:#b8e6ff}
.sidebar .brand strong{display:block!important;font-size:8px!important;letter-spacing:.11em!important;text-transform:uppercase!important;color:#fff!important;margin-top:13px!important}
.sidebar .nav{gap:4px!important}
.sidebar .nav-group-title{font-size:8px!important;letter-spacing:.12em!important;padding:10px 9px 6px!important;color:rgba(255,255,255,.56)!important}
.sidebar .nav-group-title.oppo-title{color:#72eee5!important}
.sidebar .nav-divider{height:1px!important;background:rgba(255,255,255,.14)!important;margin:9px 7px!important}
.sidebar .nav button{min-height:32px!important;padding:7px 8px!important;border-radius:10px!important;background:transparent!important;color:#fff!important;font-size:11px!important;font-weight:650!important;gap:8px!important;box-shadow:none!important}
.sidebar .nav button:hover{background:rgba(255,255,255,.08)!important;transform:none!important}
.sidebar .nav button.active{background:linear-gradient(90deg,#2ad8e6,#238cf2)!important;color:#fff!important;box-shadow:0 8px 20px rgba(35,140,242,.25)!important}
.sidebar .nav button span{white-space:nowrap}
.main{min-width:0!important;background:transparent!important}
.topbar{display:none!important}
.content{padding:20px 24px 30px!important;max-width:1480px!important}
.page{position:relative;min-height:calc(100vh - 50px);padding:0!important;overflow:hidden;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(244,250,255,.98) 58%,rgba(250,247,255,.98));border:1px solid rgba(213,226,242,.9);border-radius:22px;box-shadow:0 16px 45px rgba(18,59,123,.07)}
.page:not(.hidden)::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 85% 7%,rgba(57,215,207,.18),transparent 20%),radial-gradient(circle at 72% 100%,rgba(118,87,245,.11),transparent 25%);z-index:0}
.page:not(.hidden)::after{content:"";position:absolute;right:12px;top:18px;width:108px;height:132px;background:url("../assets/ollie-mascot.svg") center/contain no-repeat;opacity:.12;pointer-events:none;z-index:0}
.page>*{position:relative;z-index:1}
.section, .section-head, .hero, .sales-hero, .lab-hero, .lab-library-label, .lab-stages, .lab-layout, .toolbar, .smart-compare-shell, .progress, .card{position:relative;z-index:1}
.section-head{padding:24px 28px 8px!important;margin:0!important}
.section-head h2{font-size:25px!important;line-height:1.12!important;letter-spacing:-.035em!important;color:var(--v23-ink)!important;margin:5px 0 8px!important}
.section-head h3{color:var(--v23-ink)!important}
.section-head p{color:var(--v23-muted)!important;font-size:12px!important;line-height:1.55!important}
.eyebrow{font-size:9px!important;font-weight:900!important;letter-spacing:.1em!important;color:#476bba!important;text-transform:uppercase!important}
.btn{border-radius:11px!important;font-weight:800!important}
.btn.primary{background:linear-gradient(90deg,#145fd2,#7657f5)!important;color:#fff!important;border:0!important;box-shadow:0 8px 18px rgba(45,91,210,.18)!important}
.btn.primary:hover{transform:translateY(-1px)!important}
.card,.section.card{background:rgba(255,255,255,.92)!important;border:1px solid var(--v23-line)!important;border-radius:16px!important;box-shadow:0 9px 26px rgba(16,42,86,.06)!important}

/* HOME / ACADEMIA OPPO */
#inicio .oppo-hero-visual{margin:0!important;border:0!important;border-radius:0!important;min-height:320px!important;padding:32px 34px!important;background:linear-gradient(105deg,#e3fbfa 0%,#edf7ff 48%,#f5efff 100%)!important;overflow:hidden!important;box-shadow:none!important}
#inicio .oppo-hero-visual:before{content:"";position:absolute;right:-80px;top:-100px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(57,215,207,.34),rgba(118,87,245,.03) 68%,transparent 70%)}
#inicio .oppo-hero-visual:after{content:"";position:absolute;right:32%;bottom:-70px;width:270px;height:270px;background:url("../assets/ollie-mascot.svg") center/contain no-repeat;opacity:.98;filter:drop-shadow(0 18px 22px rgba(28,65,110,.15))}
#inicio .oppo-hero-copy{max-width:56%;z-index:4!important}
#inicio .oppo-hero-copy h1{font-size:clamp(36px,4.3vw,58px)!important;line-height:1!important;color:var(--v23-ink)!important;letter-spacing:-.055em!important;margin:8px 0 12px!important}
#inicio .oppo-hero-copy h1 span{color:#1d73d9!important}
#inicio .oppo-hero-copy p{max-width:590px!important;color:#536c92!important;font-size:14px!important;line-height:1.55!important}
#inicio .method{display:flex;gap:7px;flex-wrap:wrap;margin-top:17px!important}
#inicio .method .pill{background:#fff!important;border:1px solid #dce8f5!important;color:#31548b!important;border-radius:999px!important;font-size:9px!important;font-weight:900!important;padding:7px 10px!important;box-shadow:0 5px 12px rgba(25,65,120,.05)}
#inicio .oppo-hero-products{right:24px!important;bottom:0!important;width:43%!important;height:100%!important;z-index:3!important}
#inicio .oppo-device{filter:drop-shadow(0 20px 20px rgba(13,47,93,.17))!important}
#inicio .oppo-hero-tag{background:#fff!important;color:#2d55a0!important;border:1px solid #dce8f5!important;box-shadow:0 7px 15px rgba(18,59,123,.08)!important}
#inicio .grid.grid-3{padding:0 28px 16px!important;gap:12px!important}
#inicio .grid.grid-3 .card{min-height:104px!important;padding:16px!important}
#inicio .grid.grid-3 .card h3{font-size:13px!important;margin:0 0 7px!important}
#inicio .grid.grid-3 .card p{font-size:11px!important;color:var(--v23-muted)!important;line-height:1.45!important}
#inicio .section.card{margin:0 28px 28px!important;padding:20px!important}
#inicio .flash{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:10px!important}
#inicio .flash .mini{background:#f6f9ff!important;border:1px solid #e2eaf5!important;border-radius:12px!important;padding:13px!important;color:#5d7091!important;font-size:11px!important;line-height:1.45!important}
#inicio .flash .mini b{display:block!important;color:#1b4f9c!important;font-size:10px!important;margin-bottom:4px!important}

/* COMMERCIAL ACADEMY */
#taller .sales-hero{margin:0!important;border:0!important;border-radius:0!important;min-height:300px!important;padding:30px 34px!important;background:linear-gradient(90deg,rgba(242,248,255,.98) 0%,rgba(243,249,255,.9) 46%,rgba(243,249,255,.35) 100%),url("../assets/hero-taller-ventas.png") right center/cover no-repeat!important;box-shadow:none!important;color:var(--v23-ink)!important}
#taller .sales-hero h1{font-size:clamp(31px,3.5vw,50px)!important;color:var(--v23-ink)!important;max-width:700px!important;letter-spacing:-.045em!important}
#taller .sales-hero h1 span{color:#216fd8!important}
#taller .sales-hero p{color:#5e7190!important;max-width:590px!important;font-size:13px!important}
#taller .skill-visual-banner{margin:12px 28px 4px!important;min-height:145px!important;border-radius:17px!important;background:linear-gradient(90deg,rgba(8,39,91,.92),rgba(8,39,91,.46)),url("../assets/hero-taller-ventas.png") center/cover!important;box-shadow:0 12px 28px rgba(8,39,91,.12)!important}
#taller .skill-visual-copy{padding:24px 28px!important;color:#fff!important;max-width:600px!important}
#taller .skill-visual-copy .eyebrow{color:#72eee5!important}
#taller .skill-visual-copy h2{font-size:25px!important;margin:5px 0!important}
#taller .skill-visual-copy p{font-size:12px!important;color:#e5f3ff!important}
#taller .workshop-start{margin:14px 28px 16px!important;padding:18px!important}
#taller .workshop-start-grid{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:10px!important}
#taller .workshop-start-grid>div{padding:13px!important;border-radius:13px!important;border:1px solid #e0e9f3!important;background:#fff!important;min-height:62px!important}
#taller .workshop-start-grid>div:nth-child(1){background:#e8fbfa!important;border-color:#c8f2ef!important}.workshop-start-grid>div:nth-child(2){background:#edf4ff!important;border-color:#d6e4fb!important}.workshop-start-grid>div:nth-child(3){background:#fff2eb!important;border-color:#ffe0d3!important}.workshop-start-grid>div:nth-child(4){background:#f2edff!important;border-color:#e0d7ff!important}
#taller .workshop-start-grid b{display:block;font-size:10px;color:#1d5aa4!important;margin-bottom:4px}.workshop-start-grid span{font-size:10px;color:#637696}
#taller .sales-section-head{padding-top:8px!important;padding-bottom:8px!important}
#taller .compact-route{margin:0 28px 12px!important;display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:8px!important}
#taller .sales-step{min-height:82px!important;border:0!important;border-radius:14px!important;color:#fff!important;box-shadow:none!important;text-align:left!important;padding:14px!important;position:relative!important;overflow:hidden!important}
#taller .sales-step:nth-child(1){background:linear-gradient(135deg,#13c8c1,#40ddd4)!important}.sales-step:nth-child(2){background:linear-gradient(135deg,#2f83ef,#5da0ff)!important}.sales-step:nth-child(3){background:linear-gradient(135deg,#ff8b54,#ffb15c)!important}.sales-step:nth-child(4){background:linear-gradient(135deg,#7657f5,#9b6cff)!important}
#taller .sales-step b{display:inline-flex;width:27px;height:27px;border-radius:50%;align-items:center;justify-content:center;background:rgba(255,255,255,.2);font-size:10px;margin-right:7px}.sales-step span{font-size:11px;font-weight:900}.sales-step small{display:block;margin:8px 0 0 34px;font-size:9px;color:rgba(255,255,255,.92)}
#taller #salesWorkshopBox{margin:0 28px 28px!important}

/* LAB */
#laboratorio .lab-hero{margin:0!important;border:0!important;border-radius:0!important;min-height:230px!important;padding:28px 32px!important;background:linear-gradient(90deg,rgba(237,247,255,.98),rgba(237,247,255,.86) 48%,rgba(237,247,255,.18)),url("../assets/hero-taller-ventas.png") right center/cover no-repeat!important;color:var(--v23-ink)!important;box-shadow:none!important}
#laboratorio .lab-hero h1{font-size:clamp(30px,3.6vw,48px)!important;color:var(--v23-ink)!important;max-width:650px!important;letter-spacing:-.045em!important}
#laboratorio .lab-hero p{color:#5f7290!important;font-size:12px!important}
#laboratorio .lab-hero-badge{background:rgba(255,255,255,.88)!important;color:#24559c!important;border:1px solid #dbe7f4!important;box-shadow:0 12px 24px rgba(17,62,120,.08)!important}
#laboratorio .lab-library-label{padding:18px 28px 8px!important}
#laboratorio .lab-library-label h2{font-size:20px!important;margin:5px 0!important}
#laboratorio .lab-library-label p{font-size:11px!important;color:var(--v23-muted)!important}
#laboratorio .lab-stages{margin:0 28px 14px!important;display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:8px!important}
#laboratorio .lab-stage{min-height:72px!important;padding:12px!important;border-radius:13px!important}
#laboratorio .lab-layout{margin:0 28px 28px!important;display:grid!important;grid-template-columns:1.05fr .95fr!important;gap:12px!important}
#laboratorio .lab-scenarios-panel,#laboratorio .whatsapp-card{background:#fff!important;border:1px solid var(--v23-line)!important;border-radius:15px!important;box-shadow:0 9px 25px rgba(16,42,86,.05)!important}
#laboratorio .whatsapp-card{overflow:hidden!important}

/* PORTFOLIO */
#portafolio .section-head{padding-bottom:4px!important}
#portafolio .section-head h2:before{content:"◈";display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;margin-right:9px;border-radius:9px;background:#e5f0ff;color:#2b78df;font-size:13px;vertical-align:2px}
#portafolio .toolbar{margin:0 28px 14px!important;background:#fff!important;border:1px solid var(--v23-line)!important;border-radius:13px!important;padding:9px!important;box-shadow:0 6px 18px rgba(16,42,86,.04)!important}
#portafolio .toolbar input,#portafolio .toolbar select{border:1px solid #dce6f1!important;border-radius:9px!important;background:#f9fbfe!important;color:#28456e!important;font-size:11px!important}
#portafolio #portfolioGrid{padding:0 28px 28px!important;grid-template-columns:repeat(3,1fr)!important;gap:12px!important}
#portafolio .model-card{border-radius:15px!important;border:1px solid #dce7f3!important;box-shadow:0 8px 24px rgba(16,42,86,.055)!important;overflow:visible!important;background:#fff!important}
#portafolio .product-visual{background:linear-gradient(145deg,#e9fbfa,#f3f0ff)!important;border:0!important;height:165px!important;border-radius:14px!important}
#portafolio .model-card h3{font-size:15px!important;color:#153a72!important}
#portafolio .model-card p,#portafolio .model-card .meta{font-size:10px!important;color:#6b7c98!important}

/* TECHNOLOGY */














/* SMART COMPARATOR */
#comparador .section-head{background:linear-gradient(100deg,#e7fbfa,#eef6ff,#f5efff);padding-bottom:18px!important}
#comparador .section-head h2{font-size:27px!important}
#comparador .smart-compare-shell{margin:0 28px 28px!important}
#comparador .smart-compare-picker{background:#fff!important;border:1px solid var(--v23-line)!important;border-radius:15px!important;padding:14px!important;box-shadow:0 8px 22px rgba(16,42,86,.05)!important}
#comparador .smart-picker-title span{background:#e8f0ff!important;color:#2c6bd0!important;border-radius:8px!important}
#comparador .smart-picker-fields label{font-size:9px!important;color:#5e7190!important}
#comparador .smart-picker-fields select{border:1px solid #dce7f2!important;border-radius:9px!important;background:#f9fbfe!important}
#comparador .smart-compare-grid{display:grid!important;grid-template-columns:1fr 1.25fr 1.25fr!important;gap:10px!important;margin-top:12px!important}
#comparador .smart-column{background:#fff!important;border:1px solid #dfe8f2!important;border-radius:15px!important;box-shadow:0 8px 22px rgba(16,42,86,.045)!important}
#comparador .competitor-column{background:linear-gradient(145deg,#f5f0ff,#fff)!important}
#comparador .oppo-column:nth-child(2){background:linear-gradient(145deg,#eafbfa,#fff)!important}.oppo-column:nth-child(3){background:linear-gradient(145deg,#eef4ff,#fff)!important}
#comparador .smart-col-label{font-size:8px!important;letter-spacing:.1em!important;color:#71839e!important}
#comparador .smart-column h3{font-size:14px!important;color:#153b73!important}
#comparador .smart-advantage-box{background:rgba(255,255,255,.76)!important;border-radius:11px!important}
#comparador .smart-reading{background:rgba(255,255,255,.8)!important;border-color:#e0e8f2!important}
#comparador .smart-reading span{color:#315fb0!important}
#comparador .smart-coach-line{background:#edf6ff!important;border:1px solid #d8e8fb!important;border-radius:12px!important;color:#526985!important}

/* CERTIFICATION */
#quiz .section-head{background:linear-gradient(100deg,#edf7ff,#e9fbfa,#f5efff)}
#quiz .card{margin:0 28px 28px!important;padding:18px!important}
#quiz .progress{height:7px!important;background:#e6edf6!important;border-radius:999px!important;overflow:hidden!important}
#quiz .progress i{background:linear-gradient(90deg,#2e83ef,#7657f5)!important}
#quizBox{padding:16px!important;background:linear-gradient(145deg,#fff,#f7f9fd)!important;border:1px solid #e0e8f2!important;border-radius:14px!important}
#quizBox h2{font-size:18px!important;color:#173b71!important}
#quizBox .option{border:1px solid #dfe8f2!important;border-radius:10px!important;background:#fff!important;font-size:11px!important}
#quizBox .option:hover{background:#f1f7ff!important;border-color:#a9c9f7!important}

/* AUTOEVALUATION */
#autoevaluacion .section-head{background:linear-gradient(100deg,#e9fbfa,#eef6ff,#f5efff);padding-bottom:18px!important}
#autoevaluacion .standalone-evaluation{margin:0 28px 14px!important;background:#fff!important;border:1px solid var(--v23-line)!important;border-radius:16px!important;box-shadow:0 9px 26px rgba(16,42,86,.055)!important;padding:18px!important}
#autoevaluacion .lab-eval-head{display:grid!important;grid-template-columns:1fr 240px!important;gap:18px!important}
#autoevaluacion .lab-score{background:linear-gradient(145deg,#e9fbfa,#eef5ff)!important;border:1px solid #d9e8f4!important;border-radius:14px!important;padding:16px!important}
#autoevaluacion .lab-score strong{color:#256ed3!important}
#autoevaluacion .sales-checklist{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:8px!important;margin-top:14px!important}
#autoevaluacion .sales-checklist label{background:#f9fbfe!important;border:1px solid #dfe8f2!important;border-radius:10px!important;padding:10px!important;font-size:10px!important}
#autoevaluacion .start-note{margin:0 28px 28px!important;padding:18px!important;background:linear-gradient(100deg,#fff,#edf8ff)!important}

/* responsive */
@media(max-width:1100px){
  .app{grid-template-columns:168px 1fr!important}.content{padding:14px!important}
  
  #inicio .oppo-hero-copy{max-width:63%}
  #inicio .oppo-hero-products{width:39%!important;opacity:.9}
}
@media(max-width:820px){
  .app{grid-template-columns:1fr!important}.sidebar{position:relative!important;height:auto!important;min-height:auto!important;padding:10px!important}.sidebar .nav{display:grid!important;grid-template-columns:repeat(2,1fr)!important}.sidebar .nav-group-title,.sidebar .nav-divider{grid-column:1/-1}.sidebar .brand{display:flex!important;align-items:center!important;gap:12px!important}.sidebar .brand strong{margin-top:0!important}.content{padding:8px!important}.page{border-radius:15px}
  #inicio .oppo-hero-visual,#taller .sales-hero,#laboratorio .lab-hero{min-height:320px!important}.page:not(.hidden)::after{opacity:.07;width:75px}
  #inicio .oppo-hero-copy{max-width:100%!important}.oppo-hero-products{opacity:.25!important;right:-40px!important;width:60%!important}
  #inicio .grid.grid-3, #inicio .flash, #taller .workshop-start-grid, #taller .compact-route, #laboratorio .lab-stages, #laboratorio .lab-layout, #comparador .smart-compare-grid, #autoevaluacion .sales-checklist{grid-template-columns:1fr 1fr!important}
  #autoevaluacion .lab-eval-head{grid-template-columns:1fr!important}
}
@media(max-width:560px){
  .sidebar .nav{grid-template-columns:1fr!important}.section-head{padding:18px 16px 7px!important}
  #inicio .grid.grid-3, #inicio .flash, #taller .workshop-start-grid, #taller .compact-route, #laboratorio .lab-stages, #laboratorio .lab-layout, #comparador .smart-compare-grid, #autoevaluacion .sales-checklist{grid-template-columns:1fr!important}
  #inicio .section.card, #inicio .grid.grid-3, #taller .skill-visual-banner, #taller .workshop-start, #taller .compact-route, #taller #salesWorkshopBox, #laboratorio .lab-library-label, #laboratorio .lab-stages, #laboratorio .lab-layout, #portafolio .toolbar, #portafolio #portfolioGrid, #comparador .smart-compare-shell, #quiz .card, #autoevaluacion .standalone-evaluation, #autoevaluacion .start-note{margin-left:12px!important;margin-right:12px!important;padding-left:12px!important;padding-right:12px!important}
}

/* V23 icon accents */
#inicio .grid.grid-3 .card h3:before{content:"";display:inline-flex;width:27px;height:27px;align-items:center;justify-content:center;border-radius:9px;margin-right:7px;vertical-align:-8px;background:linear-gradient(135deg,#9a5cff,#7657f5);box-shadow:0 5px 10px rgba(118,87,245,.15)}
#inicio .grid.grid-3 .card:nth-child(2) h3:before{background:linear-gradient(135deg,#2dd4cf,#159ce8)}
#inicio .grid.grid-3 .card:nth-child(3) h3:before{background:linear-gradient(135deg,#ffb43b,#ff845f)}




#laboratorio .lab-stage:before{content:"";display:inline-flex;width:25px;height:25px;border-radius:50%;margin-right:7px;vertical-align:-8px;background:rgba(255,255,255,.7);box-shadow:0 3px 8px rgba(16,42,86,.05)}
#laboratorio .lab-stage:nth-child(1):before{background:#bff7f2}#laboratorio .lab-stage:nth-child(2):before{background:#d8e8ff}#laboratorio .lab-stage:nth-child(3):before{background:#ffe0d0}#laboratorio .lab-stage:nth-child(4):before{background:#e1d8ff}
#portafolio .model-card .model-body:before{content:"";display:block;width:36px;height:4px;border-radius:999px;background:linear-gradient(90deg,#39d7cf,#7657f5);margin-bottom:8px}
#comparador .smart-column .smart-col-label:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#39d7cf;margin-right:5px}

/* === AUTOEVALUACIÓN · PROTOTIPO VISUAL V24 === */
:root{--ae-navy:#062b67;--ae-blue:#156de0;--ae-aqua:#18c9c2;--ae-violet:#7657f5;--ae-line:#d8e7f5;--ae-ink:#0d326b;--ae-muted:#5d7598}
.sidebar-ollie{position:absolute;left:0;right:0;bottom:0;height:220px;display:flex;align-items:flex-end;justify-content:center;pointer-events:none;overflow:hidden}
.sidebar-ollie img{width:205px;height:auto;filter:drop-shadow(0 18px 20px rgba(0,0,0,.18));transform:translateY(14px)}
@media(max-width:1050px){.sidebar-ollie{display:none}}
body:has(#autoevaluacion:not(.hidden)) .topbar{display:none}
body:has(#autoevaluacion:not(.hidden)) .content{padding:0;max-width:none}
#autoevaluacion{position:relative;min-height:100vh;background:linear-gradient(145deg,#effcff 0%,#f5f8ff 54%,#f5efff 100%);overflow:hidden}
#autoevaluacion:before{content:"";position:absolute;left:-140px;top:170px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,#8ce9f0 0%,rgba(140,233,240,.08) 62%,transparent 72%);pointer-events:none}
#autoevaluacion:after{content:"";position:absolute;right:-140px;bottom:-180px;width:520px;height:420px;border-radius:50%;background:radial-gradient(circle,#d9c8ff 0%,rgba(217,200,255,.08) 65%,transparent 73%);pointer-events:none}
#autoevaluacion .autoeval-hero{position:relative;min-height:315px;padding:38px 54px 48px;background:linear-gradient(105deg,rgba(226,250,252,.96) 0%,rgba(239,247,255,.92) 42%,rgba(242,239,255,.66) 100%);overflow:hidden;display:flex;align-items:flex-start}
#autoevaluacion .autoeval-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 20%,rgba(255,255,255,.9),transparent 30%),linear-gradient(120deg,transparent 40%,rgba(255,255,255,.35) 41%,transparent 60%);pointer-events:none}
#autoevaluacion .autoeval-hero-copy{position:relative;z-index:5;width:58%;max-width:780px}
#autoevaluacion .autoeval-hero-copy .eyebrow{display:block;color:#2467c6;font-size:11px;letter-spacing:.09em;margin-bottom:12px}
#autoevaluacion .autoeval-kicker{display:block;color:#2a67bd;font-size:10px;font-weight:900;letter-spacing:.08em;margin-bottom:4px}
#autoevaluacion .autoeval-hero h1{margin:4px 0 8px;color:#062e6c;font-size:clamp(38px,4.5vw,62px);line-height:.98;letter-spacing:-.055em}
#autoevaluacion .autoeval-hero p{margin:0;color:#315b92;font-size:17px;line-height:1.45}
#autoevaluacion .autoeval-live{display:inline-flex;align-items:center;gap:10px;margin-top:18px;padding:10px 18px;border:1px solid #d2e4f5;border-radius:999px;background:rgba(255,255,255,.9);color:#2871d2;font-size:11px;font-weight:800;box-shadow:0 8px 18px rgba(38,102,170,.07)}
#autoevaluacion .autoeval-live span{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:linear-gradient(135deg,#4b8cff,#7657f5);color:#fff;font-size:14px}
#autoevaluacion .autoeval-advisor{position:absolute;z-index:2;right:190px;bottom:-2px;width:480px;height:315px;background:url("../assets/autoeval-advisor.png") center bottom/cover no-repeat;filter:drop-shadow(0 18px 24px rgba(15,48,93,.14))}
#autoevaluacion .autoeval-progress{position:absolute;z-index:6;right:44px;top:74px;width:170px;height:190px;border:1px solid rgba(209,225,240,.95);border-radius:22px;background:rgba(255,255,255,.94);box-shadow:0 14px 32px rgba(17,58,110,.12);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
#autoevaluacion .autoeval-progress small{font-size:12px;font-weight:900;color:#164582}
#autoevaluacion .progress-ring{--progress:0deg;width:104px;height:104px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#246df0 var(--progress),#e3edf9 0);position:relative;transform:rotate(-90deg)}
#autoevaluacion .progress-ring:before{content:"";position:absolute;width:82px;height:82px;border-radius:50%;background:#fff}
#autoevaluacion .progress-ring div{position:relative;z-index:2;transform:rotate(90deg)}
#autoevaluacion .progress-ring strong{font-size:22px;color:#123e79}
#autoevaluacion .autoeval-progress b{font-size:9px;color:#1b65bc}
#autoevaluacion .autoeval-panel{position:relative;z-index:8;margin:-6px 44px 18px;padding:24px 28px 18px;border:1px solid rgba(214,230,244,.95);border-radius:24px;background:rgba(255,255,255,.96);box-shadow:0 16px 38px rgba(23,65,115,.10)}
#autoevaluacion .autoeval-panel-head{display:flex;align-items:center;gap:14px;margin-bottom:16px}
#autoevaluacion .autoeval-panel-icon{width:52px;height:52px;flex:0 0 52px;border-radius:16px;display:grid;place-items:center;color:#fff;font-size:25px;background:linear-gradient(135deg,#4d91ff,#7657f5);box-shadow:0 9px 18px rgba(74,126,225,.2)}
#autoevaluacion .autoeval-panel-head .eyebrow{color:#2b69c7;font-size:9px;letter-spacing:.08em}
#autoevaluacion .autoeval-panel-head h2{margin:2px 0 4px;color:#113c77;font-size:24px;letter-spacing:-.025em}
#autoevaluacion .autoeval-panel-head p{margin:0;color:#61799a;font-size:11px}
#autoevaluacion .sales-checklist{display:grid!important;grid-template-columns:1fr 1fr!important;gap:9px 18px!important;margin-top:4px!important}
#autoevaluacion .sales-checklist .check-item{min-height:49px;display:flex;align-items:center;gap:12px;padding:9px 13px!important;border:1px solid #dce9f5!important;border-radius:13px!important;background:linear-gradient(100deg,#fbfdff,#f8fbff)!important;color:#345a8d!important;cursor:pointer;transition:.18s ease;box-shadow:none!important}
#autoevaluacion .sales-checklist .check-item:hover{border-color:#8ec9e9!important;transform:translateY(-1px);box-shadow:0 6px 15px rgba(41,105,170,.06)!important}
#autoevaluacion .sales-checklist .check-item.done{border-color:#2bc9cf!important;background:linear-gradient(100deg,#effdfd,#f4fbff)!important;box-shadow:0 4px 14px rgba(27,191,190,.07)!important}
#autoevaluacion .sales-checklist input{appearance:none;width:25px;height:25px;flex:0 0 25px;border:2px solid #b9cbe0;border-radius:7px;background:#fff;position:relative;margin:0}
#autoevaluacion .sales-checklist input:checked{border-color:#19bfc1;background:linear-gradient(135deg,#13bfc0,#2e7fe9)}
#autoevaluacion .sales-checklist input:checked:after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:15px;font-weight:900}
#autoevaluacion .sales-checklist label span{display:flex!important;align-items:center;gap:9px!important;font-size:11px!important;line-height:1.3!important}
#autoevaluacion .sales-checklist label span b{color:#235d9f!important;font-size:10px!important;min-width:20px}
#autoevaluacion .autoeval-panel-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:14px;padding-top:2px}
#autoevaluacion .autoeval-panel-footer>span{font-size:10px;color:#7085a1}
#autoevaluacion .autoeval-panel-footer .btn,#autoevaluacion .autoeval-next .btn{border:0!important;border-radius:999px!important;background:linear-gradient(90deg,#1d9fd0,#16b9a7)!important;color:#fff!important;padding:11px 20px!important;box-shadow:0 9px 18px rgba(24,154,194,.16)!important}
#autoevaluacion .autoeval-panel-footer .btn span,#autoevaluacion .autoeval-next .btn span{margin-left:12px;font-size:15px}
#autoevaluacion .autoeval-next{position:relative;z-index:5;margin:0 44px 34px;padding:16px 20px;display:flex;align-items:center;gap:14px;border:1px solid #dce8f5;border-radius:19px;background:linear-gradient(100deg,rgba(255,255,255,.96),rgba(243,248,255,.95),rgba(247,239,255,.88));box-shadow:0 10px 25px rgba(26,67,116,.07);overflow:hidden}
#autoevaluacion .autoeval-next:after{content:"";position:absolute;right:120px;top:-90px;width:280px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(118,87,245,.13),transparent 70%);pointer-events:none}
#autoevaluacion .next-icon{width:48px;height:48px;flex:0 0 48px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:23px;background:linear-gradient(135deg,#2b8ff4,#7657f5)}
#autoevaluacion .autoeval-next .eyebrow{font-size:8px;color:#2d6fd0}
#autoevaluacion .autoeval-next h3{margin:2px 0 3px;color:#123d78;font-size:17px}
#autoevaluacion .autoeval-next p{margin:0;color:#617795;font-size:10px}
#autoevaluacion .autoeval-next>div:nth-child(2){flex:1;position:relative;z-index:2}
#autoevaluacion .autoeval-next .btn{position:relative;z-index:2;white-space:nowrap}
@media(max-width:1050px){
 #autoevaluacion .autoeval-advisor{right:135px;width:390px}
 #autoevaluacion .autoeval-progress{right:24px;width:145px}
 #autoevaluacion .autoeval-panel,#autoevaluacion .autoeval-next{margin-left:24px;margin-right:24px}
}
@media(max-width:820px){
 body:has(#autoevaluacion:not(.hidden)) .content{padding:0!important}
 #autoevaluacion .autoeval-hero{min-height:410px;padding:26px 22px 155px}
 #autoevaluacion .autoeval-hero-copy{width:100%}
 #autoevaluacion .autoeval-hero h1{font-size:40px}
 #autoevaluacion .autoeval-advisor{right:-35px;bottom:0;width:370px;height:220px;opacity:.86}
 #autoevaluacion .autoeval-progress{right:18px;top:auto;bottom:25px;width:132px;height:150px}
 #autoevaluacion .progress-ring{width:76px;height:76px}
 #autoevaluacion .progress-ring:before{width:60px;height:60px}
 #autoevaluacion .autoeval-panel{margin:-10px 14px 14px;padding:18px 14px}
 #autoevaluacion .sales-checklist{grid-template-columns:1fr!important}
 #autoevaluacion .autoeval-next{margin:0 14px 24px;flex-wrap:wrap}
}
@media(max-width:560px){
 #autoevaluacion .autoeval-hero{min-height:440px}
 #autoevaluacion .autoeval-advisor{right:-80px;width:330px}
 #autoevaluacion .autoeval-progress{right:12px;bottom:18px}
 #autoevaluacion .autoeval-live{font-size:9px}
 #autoevaluacion .autoeval-panel-head h2{font-size:19px}
 #autoevaluacion .autoeval-panel-footer{align-items:flex-start;flex-direction:column}
 #autoevaluacion .autoeval-next .btn{width:100%}
}


/* ============================================================
   V25 · AUTOEVALUACIÓN — FINAL PROTOTYPE POLISH
   ============================================================ */

.sidebar .nav button{
  color:#fff!important;
  font-weight:520!important;
  letter-spacing:-.01em;
}
.nav-ico{
  width:22px;height:22px;display:inline-grid;place-items:center;flex:0 0 22px;
}
.nav-ico svg{
  width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.75;
  stroke-linecap:round;stroke-linejoin:round;
}
.sidebar .nav button.active .nav-ico svg{stroke:#fff}

.sidebar-ollie-autoeval{
  height:245px!important;
  justify-content:flex-start!important;
  align-items:flex-end!important;
  overflow:hidden!important;
}
.sidebar-ollie-autoeval img{
  width:100%!important;
  max-width:205px!important;
  height:auto!important;
  transform:translateY(12px)!important;
  filter:drop-shadow(0 18px 18px rgba(0,28,70,.20))!important;
  mix-blend-mode:normal!important;
}

#autoevaluacion .autoeval-hero{
  min-height:330px!important;
  padding:36px 54px 52px!important;
  background:
    linear-gradient(90deg,rgba(232,249,255,.98) 0%,rgba(234,247,255,.88) 38%,rgba(239,247,255,.36) 68%,rgba(242,240,255,.18) 100%),
    url("../assets/autoeval-advisor.png") center right/cover no-repeat!important;
  border-bottom:1px solid rgba(204,225,241,.45);
}
#autoevaluacion .autoeval-hero:before{
  background:
    radial-gradient(circle at 75% 25%,rgba(255,255,255,.50),transparent 28%),
    linear-gradient(120deg,rgba(255,255,255,.18),transparent 55%)!important;
}
#autoevaluacion .autoeval-advisor{display:none!important}
#autoevaluacion .autoeval-hero-copy{
  width:59%!important;
  max-width:800px!important;
}
#autoevaluacion .autoeval-hero h1{
  text-shadow:0 2px 0 rgba(255,255,255,.25);
}
#autoevaluacion .autoeval-progress{
  top:72px!important;
  right:42px!important;
  width:176px!important;
  height:194px!important;
  border-radius:23px!important;
  backdrop-filter:blur(7px);
}
#autoevaluacion .autoeval-panel{
  margin:-7px 44px 18px!important;
  border-radius:25px!important;
}
#autoevaluacion .autoeval-panel-icon{
  border-radius:50%!important;
  width:58px!important;height:58px!important;flex-basis:58px!important;
}
#autoevaluacion .autoeval-panel-icon svg{
  width:34px;height:34px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
}
#autoevaluacion .sales-checklist .check-item{
  border-radius:14px!important;
  min-height:52px!important;
}
#autoevaluacion .sales-checklist input{
  width:28px!important;height:28px!important;flex-basis:28px!important;
  border-radius:8px!important;
}
#autoevaluacion .autoeval-next{
  min-height:88px!important;
  border-radius:20px!important;
}
#autoevaluacion .next-icon{
  width:54px!important;height:54px!important;flex-basis:54px!important;
}
#autoevaluacion .next-icon svg{
  width:32px;height:32px;fill:none;stroke:#fff;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round;
}
#autoevaluacion .autoeval-next:before{
  content:"";
  position:absolute;
  right:285px;bottom:-20px;width:190px;height:120px;
  background:
    linear-gradient(135deg,transparent 50%,rgba(61,140,241,.15) 50%) bottom/55px 55px no-repeat,
    linear-gradient(135deg,transparent 50%,rgba(118,87,245,.13) 50%) 55px bottom/55px 75px no-repeat,
    linear-gradient(135deg,transparent 50%,rgba(25,191,193,.13) 50%) 110px bottom/55px 95px no-repeat;
  clip-path:polygon(0 100%,0 82%,10% 82%,10% 66%,23% 66%,23% 46%,38% 46%,38% 25%,53% 25%,53% 0,60% 0,60% 18%,100% 0,100% 100%);
  opacity:.95;
  pointer-events:none;
}
#autoevaluacion .autoeval-next>div:nth-child(2){min-width:0}

@media(max-width:1050px){
  #autoevaluacion .autoeval-hero{
    background-position:68% center!important;
  }
}
@media(max-width:900px){
  #autoevaluacion .autoeval-hero{
    min-height:400px!important;
    padding:28px 22px 155px!important;
    background-position:68% center!important;
  }
  #autoevaluacion .autoeval-hero-copy{width:100%!important}
  #autoevaluacion .autoeval-progress{
    top:auto!important;bottom:22px!important;right:22px!important;
    width:145px!important;height:154px!important;
  }
}
@media(max-width:620px){
  #autoevaluacion .autoeval-hero{
    background-position:64% center!important;
  }
  .sidebar-ollie-autoeval{display:none!important}
}


/* ============================================================
   V26 · AUTOEVALUACIÓN — COMPOSICIÓN FINAL
   Imagen del ejecutivo más contenida y desplazada a la derecha,
   integrada con el mismo fondo; panel y CTA con mayor presencia.
   ============================================================ */

/* El hero vuelve a ser una composición continua: el ejecutivo
   forma parte del escenario y no se percibe como una tarjeta aparte. */
#autoevaluacion .autoeval-hero{
  min-height:330px!important;
  padding:30px 48px 48px!important;
  background:
    linear-gradient(90deg,
      rgba(235,250,255,.98) 0%,
      rgba(236,248,255,.96) 38%,
      rgba(238,247,255,.82) 57%,
      rgba(241,243,255,.50) 74%,
      rgba(244,239,255,.18) 100%),
    url("../assets/autoeval-advisor.png") 82% 48% / 760px auto no-repeat,
    linear-gradient(145deg,#eafaff 0%,#f2f7ff 58%,#f6efff 100%)!important;
}

/* Transición suave alrededor de la fotografía para que se funda
   con las ondas/degradados del layout. */
#autoevaluacion .autoeval-hero:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 78% 46%,rgba(255,255,255,.18),transparent 34%),
    linear-gradient(90deg,transparent 48%,rgba(235,250,255,.22) 66%,rgba(243,239,255,.18) 100%);
}
#autoevaluacion .autoeval-hero-copy{z-index:5;width:57%!important}
#autoevaluacion .autoeval-advisor{display:none!important}

/* El progreso queda cerca del ejecutivo, pero sin taparlo. */
#autoevaluacion .autoeval-progress{
  right:34px!important;
  top:64px!important;
  width:168px!important;
  height:188px!important;
}

/* Panel de hábitos: más grande y ligeramente más arriba. */
#autoevaluacion .autoeval-panel{
  margin:-28px 30px 20px!important;
  padding:27px 30px 21px!important;
  border-radius:26px!important;
  box-shadow:0 18px 42px rgba(23,65,115,.12)!important;
}
#autoevaluacion .autoeval-panel-head{
  margin-bottom:19px!important;
}
#autoevaluacion .autoeval-panel-head h2{
  font-size:27px!important;
}
#autoevaluacion .autoeval-panel-head p{
  font-size:12px!important;
}
#autoevaluacion .sales-checklist{
  gap:10px 20px!important;
  margin-top:6px!important;
}
#autoevaluacion .sales-checklist .check-item{
  min-height:57px!important;
  padding:11px 15px!important;
  border-radius:15px!important;
}
#autoevaluacion .sales-checklist label span{
  font-size:12px!important;
}
#autoevaluacion .sales-checklist input{
  width:29px!important;height:29px!important;flex-basis:29px!important;
}

/* CTA final: más grande, más visible y con mejor equilibrio. */
#autoevaluacion .autoeval-next{
  margin:0 30px 38px!important;
  min-height:116px!important;
  padding:22px 26px!important;
  gap:18px!important;
  border-radius:23px!important;
  box-shadow:0 14px 34px rgba(26,67,116,.09)!important;
}
#autoevaluacion .next-icon{
  width:62px!important;height:62px!important;flex-basis:62px!important;
}
#autoevaluacion .autoeval-next .eyebrow{
  font-size:9px!important;
  letter-spacing:.1em;
}
#autoevaluacion .autoeval-next h3{
  font-size:23px!important;
  margin:3px 0 5px!important;
}
#autoevaluacion .autoeval-next p{
  font-size:11px!important;
  max-width:700px;
}
#autoevaluacion .autoeval-next .btn{
  font-size:12px!important;
  padding:14px 24px!important;
}

/* Ajustes para que el personaje no vuelva a crecer en pantallas
   intermedias y siga respirando a la derecha. */
@media(max-width:1150px){
  #autoevaluacion .autoeval-hero{
    background-size:650px auto!important;
    background-position:88% 48%!important;
  }
  #autoevaluacion .autoeval-progress{
    right:22px!important;
    width:150px!important;
  }
  #autoevaluacion .autoeval-panel{
    margin-left:22px!important;
    margin-right:22px!important;
  }
  #autoevaluacion .autoeval-next{
    margin-left:22px!important;
    margin-right:22px!important;
  }
}
@media(max-width:820px){
  #autoevaluacion .autoeval-hero{
    min-height:405px!important;
    padding:26px 22px 155px!important;
    background-size:560px auto!important;
    background-position:86% 42%!important;
  }
  #autoevaluacion .autoeval-hero-copy{
    width:100%!important;
    max-width:620px!important;
  }
  #autoevaluacion .autoeval-progress{
    top:auto!important;
    bottom:23px!important;
    right:18px!important;
    width:138px!important;
    height:154px!important;
  }
  #autoevaluacion .autoeval-panel{
    margin:-12px 14px 16px!important;
    padding:21px 16px 18px!important;
  }
  #autoevaluacion .autoeval-panel-head h2{
    font-size:22px!important;
  }
  #autoevaluacion .autoeval-next{
    margin:0 14px 26px!important;
    min-height:105px!important;
    padding:18px!important;
  }
}
@media(max-width:560px){
  #autoevaluacion .autoeval-hero{
    background-size:470px auto!important;
    background-position:78% 48%!important;
  }
  #autoevaluacion .autoeval-next h3{
    font-size:19px!important;
  }
}

/* V27 · AUTOEVALUACIÓN — nuevo ejecutivo de fondo */
#autoevaluacion .autoeval-hero{
  background:
    linear-gradient(90deg,rgba(238,249,255,.99) 0%,rgba(238,249,255,.97) 32%,rgba(239,248,255,.88) 49%,rgba(241,247,255,.54) 64%,rgba(244,241,255,.16) 100%),
    url("../assets/autoeval-advisor-v2.png") 82% 50% / 760px auto no-repeat,
    linear-gradient(145deg,#eafaff 0%,#f2f7ff 58%,#f6efff 100%) !important;
}
#autoevaluacion .autoeval-hero:after{
  background:radial-gradient(ellipse at 76% 48%,rgba(255,255,255,.12),transparent 31%),linear-gradient(90deg,transparent 43%,rgba(235,249,255,.10) 62%,rgba(244,240,255,.16) 100%) !important;
}
#autoevaluacion .sales-checklist label span{font-size:14px !important;line-height:1.35 !important}
#autoevaluacion .sales-checklist .check-item{min-height:61px !important;padding:12px 16px !important}
#autoevaluacion .autoeval-hero h1{font-size:34px !important}
#autoevaluacion .autoeval-hero p{font-size:16px !important}
@media(max-width:1150px){#autoevaluacion .autoeval-hero{background-size:650px auto !important;background-position:88% 50% !important}}
@media(max-width:820px){#autoevaluacion .autoeval-hero{background-size:560px auto !important;background-position:86% 44% !important}#autoevaluacion .sales-checklist label span{font-size:13px !important}}
@media(max-width:560px){#autoevaluacion .autoeval-hero{background-size:470px auto !important;background-position:78% 48% !important}#autoevaluacion .autoeval-hero h1{font-size:28px !important}}


/* ============================================================
   V28 · AUTOEVALUACIÓN — FONDO ORIGINAL PROPORCIONADO
   La fotografía se usa como imagen de fondo sin filtros ni
   edición de la imagen. Se mantiene íntegra y a la derecha.
   ============================================================ */
#autoevaluacion .autoeval-hero{
  min-height:350px!important;
  position:relative!important;
  overflow:visible!important;
  background-color:#edf8ff!important;
  background-image:url("../assets/autoeval-fondo-ejecutivo.png")!important;
  background-repeat:no-repeat!important;
  background-position:right center!important;
  background-size:auto 100%!important;
}
/* No aplicar capas sobre la fotografía. */
#autoevaluacion .autoeval-hero:after,
#autoevaluacion .autoeval-hero:before{display:none!important}
#autoevaluacion .autoeval-hero-copy{width:58%!important;z-index:4!important}
#autoevaluacion .autoeval-kicker{
  font-size:15px!important;
  font-weight:750!important;
  letter-spacing:.02em!important;
}
#autoevaluacion .autoeval-hero h1{
  font-size:36px!important;
  line-height:1.08!important;
}
#autoevaluacion .autoeval-hero-copy > p,
#autoevaluacion .autoeval-hero p:not(.autoeval-live){
  font-size:16px!important;
}

/* Progreso más grande y superpuesto sobre el borde superior del panel. */
#autoevaluacion .autoeval-progress{
  width:190px!important;
  height:205px!important;
  right:34px!important;
  top:145px!important;
  z-index:8!important;
}
#autoevaluacion .progress-ring{
  width:104px!important;
  height:104px!important;
}
#autoevaluacion .progress-ring:before{
  width:70px!important;
  height:70px!important;
}

/* El panel sube para que el progreso se monte ligeramente sobre él. */
#autoevaluacion .autoeval-panel{
  margin:-34px 30px 20px!important;
  padding:29px 30px 24px!important;
  border-radius:27px!important;
  position:relative!important;
  z-index:6!important;
}
#autoevaluacion .autoeval-panel-head h2{font-size:28px!important}
#autoevaluacion .autoeval-panel-head p{font-size:13px!important}
#autoevaluacion .sales-checklist{gap:11px 20px!important}
#autoevaluacion .sales-checklist .check-item{
  min-height:62px!important;
  padding:12px 17px!important;
}
#autoevaluacion .sales-checklist label span{
  font-size:14px!important;
  line-height:1.38!important;
}

/* CTA final más protagonista, sin botón “Ver avance”. */
#autoevaluacion .autoeval-next{
  margin:0 30px 40px!important;
  min-height:130px!important;
  padding:25px 30px!important;
  border-radius:25px!important;
}
#autoevaluacion .autoeval-next h3{font-size:26px!important}
#autoevaluacion .autoeval-next p{font-size:12px!important}
#autoevaluacion .autoeval-next .btn{display:none!important}

@media(max-width:1150px){
  #autoevaluacion .autoeval-hero{background-size:auto 100%!important}
  #autoevaluacion .autoeval-progress{right:20px!important}
  #autoevaluacion .autoeval-panel{margin-left:22px!important;margin-right:22px!important}
  #autoevaluacion .autoeval-next{margin-left:22px!important;margin-right:22px!important}
}
@media(max-width:820px){
  #autoevaluacion .autoeval-hero{
    min-height:420px!important;
    background-size:auto 100%!important;
    background-position:78% center!important;
  }
  #autoevaluacion .autoeval-hero-copy{width:100%!important;max-width:610px!important}
  #autoevaluacion .autoeval-progress{
    width:160px!important;height:174px!important;
    top:auto!important;bottom:-42px!important;right:16px!important;
  }
  #autoevaluacion .autoeval-panel{margin:-10px 14px 16px!important;padding:23px 16px 20px!important}
  #autoevaluacion .autoeval-next{margin:0 14px 28px!important}
}
@media(max-width:560px){
  #autoevaluacion .autoeval-hero{background-position:72% center!important}
  #autoevaluacion .autoeval-hero h1{font-size:30px!important}
  #autoevaluacion .autoeval-kicker{font-size:13px!important}
  #autoevaluacion .sales-checklist label span{font-size:13px!important}
}

/* ============================================================
   V29 · AUTOEVALUACIÓN — HERO CON IMAGEN COMO LABORATORIO
   La fotografía proporcionada se usa directamente como fondo
   del bloque superior, con la misma lógica visual del hero de
   Laboratorio: imagen a la derecha + contenido independiente.
   ============================================================ */
#autoevaluacion .autoeval-hero{
  min-height:350px!important;
  padding:30px 42px 42px!important;
  position:relative!important;
  overflow:visible!important;
  display:flex!important;
  align-items:flex-start!important;
  background-image:
    linear-gradient(90deg,
      rgba(237,247,255,.98) 0%,
      rgba(237,247,255,.92) 38%,
      rgba(237,247,255,.56) 57%,
      rgba(237,247,255,.12) 78%,
      rgba(237,247,255,0) 100%),
    url("../assets/autoevaluacion-fondo-prototipo.png")!important;
  background-size:cover!important;
  background-position:right center!important;
  background-repeat:no-repeat!important;
  background-color:#edf7ff!important;
}
/* La foto no se vuelve un elemento independiente. */
#autoevaluacion .autoeval-advisor{display:none!important}
#autoevaluacion .autoeval-hero:before,
#autoevaluacion .autoeval-hero:after{display:none!important}
#autoevaluacion .autoeval-hero-copy{position:relative!important;z-index:5!important;width:58%!important;max-width:780px!important}
#autoevaluacion .autoeval-kicker{font-size:15px!important;font-weight:750!important;letter-spacing:.02em!important}
#autoevaluacion .autoeval-hero h1{font-size:38px!important;line-height:1.06!important;margin:6px 0 9px!important}
#autoevaluacion .autoeval-hero-copy>p{font-size:16px!important}
/* Progreso ligeramente más grande y entrando sobre el panel inferior. */
#autoevaluacion .autoeval-progress{
  right:38px!important;
  top:74px!important;
  width:184px!important;
  height:202px!important;
  z-index:20!important;
}
#autoevaluacion .progress-ring{width:112px!important;height:112px!important}
#autoevaluacion .progress-ring:before{width:88px!important;height:88px!important}
#autoevaluacion .progress-ring strong{font-size:24px!important}
/* Panel de hábitos más protagonista, subiendo hacia el hero. */
#autoevaluacion .autoeval-panel{
  margin:-42px 34px 18px!important;
  padding:28px 30px 20px!important;
  z-index:30!important;
  border-radius:25px!important;
}
#autoevaluacion .sales-checklist label span{font-size:14px!important;line-height:1.38!important}
#autoevaluacion .sales-checklist .check-item{min-height:61px!important}
#autoevaluacion .autoeval-next{margin:0 34px 34px!important;min-height:118px!important}

@media(max-width:1150px){
  #autoevaluacion .autoeval-hero{background-position:right center!important}
  #autoevaluacion .autoeval-progress{right:22px!important}
  #autoevaluacion .autoeval-panel,#autoevaluacion .autoeval-next{margin-left:22px!important;margin-right:22px!important}
}
@media(max-width:820px){
  #autoevaluacion .autoeval-hero{min-height:390px!important;padding:26px 22px 150px!important;background-position:68% center!important}
  #autoevaluacion .autoeval-hero-copy{width:100%!important}
  #autoevaluacion .autoeval-progress{right:18px!important;top:auto!important;bottom:18px!important;width:154px!important;height:168px!important}
  #autoevaluacion .autoeval-panel{margin:-20px 14px 16px!important;padding:22px 16px 18px!important}
  #autoevaluacion .autoeval-next{margin:0 14px 26px!important}
}
@media(max-width:560px){
  #autoevaluacion .autoeval-hero{background-position:63% center!important}
  #autoevaluacion .autoeval-hero h1{font-size:30px!important}
}


/* ============================================================
   V30 · CERTIFICACIÓN — HERO INTEGRADO + QUIZ SUPERPUESTO
   La fotografía funciona como parte del layout, no como tarjeta.
   ============================================================ */
#quiz{
  position:relative!important;
  min-height:calc(100vh - 76px)!important;
  margin:-4px -8px 0!important;
  padding:30px 34px 42px!important;
  overflow:hidden!important;
  background:
    url("../assets/certificacion-hero-fondo.png") center top / cover no-repeat,
    linear-gradient(135deg,#eef8ff,#f7f3ff)!important;
  border-radius:24px!important;
}
#quiz:before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:linear-gradient(90deg,rgba(242,249,255,.94) 0%,rgba(242,249,255,.82) 37%,rgba(242,249,255,.24) 61%,rgba(244,239,255,.08) 100%);
}
#quiz>*{position:relative;z-index:2}
#quiz .section-head{
  background:transparent!important;
  padding:4px 0 10px!important;
  margin:0!important;
  border:0!important;
  box-shadow:none!important;
  max-width:930px!important;
}
#quiz .section-head .eyebrow{color:#315fe0!important;font-weight:800!important}
#quiz .section-head h2{font-size:34px!important;color:#123b78!important;margin:6px 0 4px!important;letter-spacing:-.02em}
#quiz .section-head p{font-size:15px!important;color:#3f6c9f!important}
#quiz>.card{
  position:relative!important;
  margin:4px 0 0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  max-width:1120px!important;
}
#quiz .progress{
  width:650px!important;
  height:9px!important;
  margin:4px 0 13px 2px!important;
  background:rgba(211,226,246,.85)!important;
  border-radius:999px!important;
}
#quiz .progress i{background:linear-gradient(90deg,#6a3df3,#2e83ef)!important;border-radius:999px!important}
#quizBox{
  width:min(860px,calc(100% - 190px))!important;
  min-height:390px!important;
  padding:25px 28px 23px!important;
  background:rgba(255,255,255,.94)!important;
  border:1px solid rgba(214,228,245,.9)!important;
  border-radius:25px!important;
  box-shadow:0 18px 50px rgba(25,65,112,.13)!important;
  backdrop-filter:blur(5px)!important;
}
#quizBox .badge{
  display:inline-flex!important;
  background:transparent!important;
  color:#234d8b!important;
  font-size:14px!important;
  padding:0!important;
  font-weight:800!important;
}
#quizBox .question{
  font-size:22px!important;
  line-height:1.3!important;
  color:#163f7e!important;
  margin:12px 0 18px!important;
  max-width:790px!important;
}
#quizBox .quiz-opt{
  min-height:58px!important;
  margin:8px 0!important;
  padding:14px 18px!important;
  border:1px solid #dbe8f7!important;
  border-radius:15px!important;
  background:rgba(255,255,255,.92)!important;
  color:#244e88!important;
  font-size:14px!important;
  box-shadow:0 3px 10px rgba(31,76,125,.035)!important;
}
#quizBox .quiz-opt:hover{background:#f6faff!important;border-color:#9fc5ee!important;transform:translateY(-1px)}
#quizBox .quiz-opt.correct{border-color:#52bb8d!important;background:#effaf5!important}
#quizBox .quiz-opt.wrong{border-color:#f0a6a6!important;background:#fff4f4!important}
#quizScore{position:relative;z-index:5}
#quiz .result{
  background:rgba(247,251,255,.97)!important;
  border:1px solid #d8e7f5!important;
  border-radius:15px!important;
  color:#244e88!important;
}
/* Progress card floating over the photo, matching the prototype. */
#quiz:after{display:none!important}
#quiz .card:after{display:none!important}
#quiz .quiz-floating-progress{
  position:absolute!important;
  z-index:8!important;
  right:26px!important;
  top:160px!important;
  width:190px!important;
  min-height:205px!important;
  padding:20px 18px!important;
  box-sizing:border-box!important;
  border-radius:23px!important;
  background:rgba(255,255,255,.95)!important;
  border:1px solid rgba(215,228,244,.92)!important;
  box-shadow:0 18px 44px rgba(25,65,112,.13)!important;
  display:flex!important;
  flex-direction:column!important;
  gap:7px!important;
  color:#173f7b!important;
}
#quiz .quiz-fp-icon{width:45px;height:45px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#ffbe2e,#ff9e19);font-size:21px;margin-bottom:2px}
#quiz .quiz-floating-progress strong{font-size:15px!important}
#quiz .quiz-floating-progress>b{font-size:29px!important;line-height:1.1!important}
#quiz .quiz-fp-bar{height:8px;border-radius:999px;background:#e8f0f8;overflow:hidden;margin-top:5px}
#quiz .quiz-fp-bar i{display:block;width:10%;height:100%;border-radius:999px;background:linear-gradient(90deg,#167de4,#7351ef)}
#quiz .quiz-floating-progress small{align-self:flex-end;font-size:12px;color:#5780b4;margin-top:-1px}

@media(max-width:1100px){
  #quiz{padding:26px 22px 34px!important}
  #quizBox{width:min(820px,calc(100% - 100px))!important}
  #quiz:after{right:25px;width:165px}
  #quiz .card:after{right:44px}
}
@media(max-width:820px){
  #quiz{margin:0!important;padding:22px 14px 28px!important;border-radius:18px!important}
  #quiz:before{background:linear-gradient(180deg,rgba(242,249,255,.96) 0%,rgba(242,249,255,.84) 54%,rgba(244,239,255,.28) 100%)}
  #quiz .section-head h2{font-size:28px!important}
  #quizBox{width:100%!important;min-height:0!important;padding:20px!important}
  #quiz .progress{width:100%!important}
  #quiz:after{display:none}
  #quiz .card:after{display:none}
}

@media(max-width:1100px){#quiz .quiz-floating-progress{right:8px!important;width:165px!important}}
@media(max-width:900px){#quizBox{width:calc(100% - 10px)!important}.quiz-floating-progress{display:none!important}}

/* ============================================================
   V31 · ACADEMIA DE TECNOLOGÍA · IDENTIDAD DEL PROTOTIPO
   ============================================================ */






























/* Paleta por especificación */

















/* V32 · ACADEMIA DE TECNOLOGÍA · REPLICA VISUAL DEL PROTOTIPO */
















/* Colores exactos por familia del prototipo */
































/* Modal de detalle: conserva el 100% de la información técnica sin recargar la tarjeta */
#modal.modal{z-index:9999!important;background:rgba(15,37,67,.34)!important;backdrop-filter:blur(5px)!important}
#modal .modal-box{width:min(700px,92vw)!important;border-radius:24px!important;padding:0!important;overflow:hidden!important;background:#fff!important;box-shadow:0 24px 70px rgba(19,48,86,.22)!important}
#modal .modal-head{padding:22px 25px!important;border-bottom:1px solid #e9eff5!important}
#modal .modal-head h2{font-size:23px!important;color:#133160!important}
#modal .modal-head .close{width:38px!important;height:38px!important;border-radius:50%!important;background:#f1f6fa!important;color:#40627f!important}
#modal #modalBody{padding:24px 25px 28px!important}









body.modal-open{overflow:hidden!important}




/* V33 · TECNOLOGÍA · ICONOGRAFÍA + DEFINICIÓN + CÓMO EXPLICARLO */




/* Todas las 13 categorías permanecen en una sola fila horizontal */



























/* Color por especificación, no por posición de la tarjeta */
















/* ============================================================
   V34 · ACADEMIA DE TECNOLOGÍA · ICONOS + FILTROS FUNCIONALES
   ============================================================ */




/* El color de cada pestaña sigue el mismo lenguaje que las tarjetas. */














/* Evita que el navegador haga parecer que el filtro no responde. */





/* ============================================================
   V36 · ACADEMIA DE TECNOLOGÍA · PATRÓN VISUAL MAESTRO
   Tarjeta: círculo + ícono → título → categoría → definición → Cómo explicarlo
   ============================================================ */















/* Colores de las 13 pestañas, siguiendo el mismo código cromático de las tarjetas */















/* El filtro seleccionado conserva el color de su segmento y gana contraste */






/* ============================================================
   V46 · AUTOEVALUACIÓN · TU PRÓXIMO PASO
   Gráfico integrado + CTA visible a la derecha.
   ============================================================ */
#autoevaluacion .autoeval-next{
  display:grid!important;
  grid-template-columns:52px minmax(0,1fr) 250px auto!important;
  align-items:center!important;
  gap:18px!important;
  min-height:150px!important;
  padding:20px 24px!important;
}
#autoevaluacion .autoeval-next-copy{position:relative;z-index:3;min-width:0}
#autoevaluacion .autoeval-next .next-icon{width:52px!important;height:52px!important;flex:0 0 52px!important}
#autoevaluacion .autoeval-statistics{
  display:block!important;
  width:250px!important;
  height:auto!important;
  max-height:170px!important;
  object-fit:contain!important;
  justify-self:center!important;
  pointer-events:none!important;
}
#autoevaluacion .autoeval-next .btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:44px!important;
  padding:12px 18px!important;
  white-space:nowrap!important;
  position:relative!important;
  z-index:4!important;
}
@media(max-width:1100px){
  #autoevaluacion .autoeval-next{grid-template-columns:52px minmax(0,1fr) 210px auto!important;gap:14px!important}
  #autoevaluacion .autoeval-statistics{width:210px!important}
}
@media(max-width:820px){
  #autoevaluacion .autoeval-next{grid-template-columns:52px 1fr!important;align-items:start!important}
  #autoevaluacion .autoeval-statistics{grid-column:2;width:210px!important;margin-top:8px!important}
  #autoevaluacion .autoeval-next .btn{grid-column:2;justify-self:start!important}
}
@media(max-width:560px){
  #autoevaluacion .autoeval-next{grid-template-columns:44px 1fr!important;padding:18px!important}
  #autoevaluacion .autoeval-next .next-icon{width:44px!important;height:44px!important;flex-basis:44px!important}
  #autoevaluacion .autoeval-statistics{width:180px!important}
}

/* =========================================================
   V47 · COMPARADOR INTELIGENTE · DIFERENCIALES COMERCIALES
   ========================================================= */
#comparador .smart-compare-grid{align-items:stretch!important}
#comparador .smart-column{min-height:100%!important}
#comparador .smart-column.oppo-column{border:1px solid rgba(19,140,98,.22)!important;background:linear-gradient(180deg,#ffffff 0%,#f2fff9 100%)!important}
#comparador .smart-column.competitor-column{background:linear-gradient(180deg,#fbfcff 0%,#f6f8ff 100%)!important}
#comparador .smart-advantage-box{margin-top:14px;padding:15px;border-radius:15px;background:linear-gradient(135deg,#effff8,#f7fffb);border:1px solid rgba(19,140,98,.18)}
#comparador .smart-advantage-box>b{display:block;font-size:10px;letter-spacing:.1em;color:#138c62;margin-bottom:10px}
#comparador .adv-row{display:grid!important;grid-template-columns:22px 1fr!important;gap:8px!important;align-items:start!important;padding:8px 0!important;border-top:1px solid rgba(19,140,98,.09)!important}
#comparador .adv-row:first-of-type{border-top:0!important}
#comparador .adv-row>span{display:grid!important;place-items:center!important;width:20px!important;height:20px!important;border-radius:50%!important;background:#d9f8eb!important;color:#138c62!important;font-weight:900!important;font-size:11px!important}
#comparador .adv-row p{margin:0!important;color:#425466!important;font-size:12px!important;line-height:1.45!important}
#comparador .smart-competitor-specs{margin-top:14px;padding:14px;border:1px solid #e2e7f1;border-radius:14px;background:#fff}
#comparador .smart-competitor-specs>b{display:block;font-size:9px;letter-spacing:.1em;color:#7a879b;margin-bottom:7px}
#comparador .smart-competitor-specs>div{display:grid;grid-template-columns:92px 1fr;gap:8px;padding:7px 0;border-top:1px solid #eef1f6}
#comparador .smart-competitor-specs>div:first-of-type{border-top:0}
#comparador .smart-competitor-specs span{font-size:10px;color:#7a879b;font-weight:800}
#comparador .smart-competitor-specs strong{font-size:11px;color:#24324a;line-height:1.35}
#comparador .smart-reading{margin-top:13px;padding:12px 14px;border-radius:13px;background:#f5f8ff}
#comparador .smart-reading span{font-size:9px;font-weight:900;letter-spacing:.1em;color:#315edb}
#comparador .smart-reading p{margin:6px 0 0!important;font-size:12px!important;line-height:1.45!important;color:#46556d!important}
#comparador .compact-model-btn{margin-top:14px!important}


/* ============================================================
   V48 · COMPARADOR INTELIGENTE · PROTOTIPO 3 COLUMNAS
   ============================================================ */
#comparador{background:linear-gradient(135deg,#eefbff 0%,#f4fbff 46%,#f4f1ff 100%)!important}
#comparador .smart-proto-head{padding:22px 18px 10px!important;align-items:flex-end!important}
#comparador .smart-proto-head .eyebrow{color:#315edb!important;font-weight:900!important;letter-spacing:.08em!important}
#comparador .smart-proto-head h2{font-size:30px!important;line-height:1.08!important;margin-top:8px!important;color:#102d5a!important}
#comparador .smart-proto-head p{max-width:520px!important;color:#5c6b82!important}
#comparador .smart-proto-shell{background:transparent!important;border:0!important;box-shadow:none!important;padding:8px 18px 24px!important;margin:0!important}
#comparador .smart-picker-compact{display:grid!important;grid-template-columns:1.15fr 1.55fr 1fr;align-items:center;gap:16px;padding:12px 14px!important;border:1px solid rgba(71,113,185,.13)!important;border-radius:16px!important;background:rgba(255,255,255,.82)!important;box-shadow:0 8px 24px rgba(48,81,126,.06)!important}
#comparador .smart-picker-caption{display:flex;align-items:center;gap:10px}
#comparador .smart-picker-caption>span{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:#eef2ff;color:#4d55d7;font-weight:900;font-size:11px}
#comparador .smart-picker-caption b{display:block;font-size:10px;letter-spacing:.1em;color:#4d5a73}
#comparador .smart-picker-caption small{display:block;margin-top:2px;color:#8290a7;font-size:10px}
#comparador .smart-picker-fields{display:grid!important;grid-template-columns:1fr 1.25fr;gap:10px!important}
#comparador .smart-picker-fields label{font-size:9px!important;color:#76839a!important;font-weight:800!important;letter-spacing:.05em}
#comparador .smart-picker-fields select{width:100%;margin-top:4px;border:1px solid #dce4ef!important;border-radius:11px!important;background:#fff!important;padding:9px 10px!important;color:#20314e!important;font-weight:750!important}
#comparador .smart-source-note{justify-self:end!important;min-width:180px!important;padding:9px 12px!important;border-radius:12px!important;background:#f7f9ff!important;border:1px solid #e5e9f3!important}
#comparador .smart-source-note span{display:block;font-size:8px!important;letter-spacing:.1em!important;color:#8a96a9!important;font-weight:900!important}
#comparador .smart-source-note b{display:block;margin-top:3px;font-size:11px!important;color:#273753!important}
#comparador .smart-compare-grid{grid-template-columns:.95fr 1.15fr 1.15fr!important;gap:14px!important;margin-top:14px!important}
#comparador .smart-column{border-radius:20px!important;padding:22px!important;box-shadow:0 10px 28px rgba(48,81,126,.055)!important;overflow:hidden!important}
#comparador .smart-column.competitor-column{background:rgba(255,255,255,.82)!important;border-color:#e2e8f2!important}
#comparador .smart-column.oppo-column{background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(247,255,252,.98))!important;border-color:rgba(45,188,151,.18)!important}
#comparador .smart-col-label{font-size:10px!important;letter-spacing:.09em!important;color:#5e6c84!important}
#comparador .smart-brand{font-size:10px!important;margin-top:10px!important;color:#3f4d64!important}
#comparador .smart-brand.oppo-brand{color:#20a978!important}
#comparador .smart-column h3{font-size:19px!important;line-height:1.12!important;color:#1b3154!important;margin:5px 0 0!important;min-height:43px}
#comparador .smart-device-stage{position:relative;height:132px;margin:14px 0 12px;border-radius:16px;background:linear-gradient(135deg,#f3f4ff,#fbfdff);display:flex;align-items:center;justify-content:center;overflow:hidden}
#comparador .oppo-device{background:linear-gradient(135deg,#effff8,#f8fffd)!important}
#comparador .smart-device-stage img{height:116px;width:145px;object-fit:contain;object-position:center;filter:drop-shadow(0 12px 12px rgba(28,53,84,.13))}
#comparador .smart-device-stage small{position:absolute;bottom:7px;left:0;right:0;text-align:center;font-size:8px;color:#8b97a9;font-weight:800;letter-spacing:.03em}
#comparador .competitor-device{--device-brand:#40516d}
#comparador .device-back,#comparador .device-front{position:absolute;width:52px;height:104px;border-radius:10px;box-shadow:0 8px 14px rgba(21,36,59,.16);transform:rotate(-7deg)}
#comparador .device-back{background:linear-gradient(145deg,#fff,#dfe5ef);left:calc(50% - 34px);border:1px solid #cbd5e3}
#comparador .device-front{background:linear-gradient(160deg,#111827,#334155);left:calc(50% - 12px);top:20px;transform:rotate(8deg);border:2px solid #e7edf6}
#comparador .device-front span{position:absolute;width:5px;height:5px;border-radius:50%;background:#0a0a0a;top:6px;left:50%;transform:translateX(-50%)}
#comparador .device-brand-mark{position:absolute;left:8px;bottom:10px;font-weight:900;font-size:9px;color:var(--device-brand);opacity:.9}
#comparador .device-back i{position:absolute;width:8px;height:8px;border-radius:50%;background:#171c28;border:1px solid #667085;top:10px;left:9px}
#comparador .device-back i:nth-of-type(2){top:22px}.device-back i:nth-of-type(3){top:34px}.device-back b{position:absolute;width:5px;height:5px;border-radius:50%;background:#e7b44d;top:46px;left:11px}
#comparador .smart-feature-title{font-size:11px;font-weight:900;color:#243652;margin:5px 0 8px}
#comparador .smart-feature-list{list-style:none;margin:0;padding:0}
#comparador .smart-feature-list li{display:grid;grid-template-columns:20px 1fr;gap:7px;padding:7px 0;font-size:11px;line-height:1.42;color:#526179;border-top:1px solid rgba(111,132,163,.10)}
#comparador .smart-feature-list li:first-child{border-top:0}
#comparador .oppo-list li span{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#dff8ec;color:#20a978;font-size:10px;font-weight:900}
#comparador .competitor-list li span{color:#6d7b91;font-weight:900;font-size:15px;line-height:12px}
#comparador .smart-reading{margin-top:11px!important;padding:12px 13px!important;border:1px solid #e1e9f3!important;border-radius:14px!important;background:#fbfdff!important}
#comparador .smart-reading span{font-size:9px!important;letter-spacing:.08em!important;color:#315edb!important}
#comparador .smart-reading p{font-size:11px!important;line-height:1.45!important;color:#516077!important;margin:6px 0 0!important}
#comparador .smart-source-link{display:inline-block;margin-top:10px;font-size:9px;font-weight:900;color:#4c57d8;text-decoration:none}
#comparador .smart-source-link.muted{color:#8b97a9}
#comparador .competitor-neutral{font-size:10px!important;line-height:1.4!important;margin-top:10px!important;color:#7a879b!important}
#comparador .compact-model-btn{width:100%!important;border-radius:13px!important;margin-top:12px!important;min-height:38px!important}
#comparador .smart-coach-line{margin-top:12px!important;padding:12px 16px!important;border-radius:13px!important;background:rgba(255,255,255,.68)!important;border:1px solid rgba(72,104,151,.10)!important;color:#627088!important;font-size:10px!important}
#comparador .smart-coach-line b{color:#315edb!important}
@media(max-width:1050px){#comparador .smart-picker-compact{grid-template-columns:1fr}.smart-source-note{justify-self:start!important}.smart-picker-fields{grid-template-columns:1fr 1fr!important}}
@media(max-width:900px){#comparador .smart-compare-grid{grid-template-columns:1fr 1fr!important}}
@media(max-width:680px){#comparador .smart-compare-grid{grid-template-columns:1fr!important}#comparador .smart-picker-fields{grid-template-columns:1fr!important}#comparador .smart-proto-head h2{font-size:24px!important}}

/* ================================================================
   V49 · GALERÍA A6 PRO 5G · CARRUSEL PORTAFOLIO + COMPARADOR
   Imágenes entregadas por el usuario / referencia OPPO Store
   ================================================================ */
.oppo-gallery{
  position:relative!important;width:100%!important;height:100%!important;
  min-height:0!important;overflow:hidden!important;border-radius:inherit!important;
  display:block!important;background:#eef7ff!important;touch-action:pan-y;
}
.oppo-gallery-image{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  max-width:none!important;max-height:none!important;object-fit:cover!important;object-position:center!important;
  display:block!important;margin:0!important;filter:none!important;transform:none!important;
  transition:opacity .18s ease!important;
}
.oppo-gallery-arrow{
  position:absolute!important;top:50%!important;transform:translateY(-50%)!important;z-index:8!important;
  width:30px!important;height:30px!important;border:0!important;border-radius:50%!important;
  display:grid!important;place-items:center!important;padding:0!important;cursor:pointer!important;
  background:rgba(255,255,255,.93)!important;color:#123d70!important;
  box-shadow:0 5px 16px rgba(18,61,112,.18)!important;font-size:24px!important;line-height:1!important;
  transition:transform .18s ease,box-shadow .18s ease!important;
}
.oppo-gallery-arrow:hover{transform:translateY(-50%) scale(1.08)!important;box-shadow:0 7px 18px rgba(18,61,112,.24)!important}
.oppo-gallery-arrow.prev{left:9px!important}.oppo-gallery-arrow.next{right:9px!important}
.oppo-gallery-counter{
  position:absolute!important;right:9px!important;top:9px!important;z-index:9!important;
  padding:4px 8px!important;border-radius:999px!important;background:rgba(255,255,255,.9)!important;
  color:#163f72!important;font-size:9px!important;font-weight:900!important;letter-spacing:.03em!important;
}
.oppo-gallery-dots{
  position:absolute!important;left:50%!important;bottom:8px!important;transform:translateX(-50%)!important;
  z-index:9!important;display:flex!important;gap:5px!important;padding:5px 8px!important;
  border-radius:999px!important;background:rgba(255,255,255,.84)!important;
}
.oppo-gallery-dot{
  width:6px!important;height:6px!important;border:0!important;border-radius:50%!important;
  padding:0!important;background:#b7c5d8!important;cursor:pointer!important;transition:all .18s ease!important;
}
.oppo-gallery-dot.active{width:18px!important;border-radius:999px!important;background:#19a77b!important}
#portafolio .product-visual:has(.oppo-gallery){padding:0!important}
#portafolio .product-visual:has(.oppo-gallery)::after{display:none!important}
#portafolio .oppo-gallery{border-radius:14px!important}
#portafolio .oppo-gallery-image{object-fit:cover!important}
#comparador .smart-device-stage:has(.oppo-gallery){padding:0!important;background:#edf9f5!important}
#comparador .smart-device-stage:has(.oppo-gallery) .oppo-gallery{border-radius:16px!important}
#comparador .smart-device-stage:has(.oppo-gallery) .oppo-gallery-image{object-fit:cover!important}
#comparador .smart-device-stage:has(.oppo-gallery) .oppo-gallery-arrow{width:27px!important;height:27px!important;font-size:21px!important}
#comparador .smart-device-stage:has(.oppo-gallery) .oppo-gallery-counter{font-size:8px!important}
#comparador .smart-device-stage:has(.oppo-gallery) .oppo-gallery-dots{bottom:6px!important}
#comparador .smart-device-stage:has(.oppo-gallery) > small{z-index:12!important;bottom:5px!important;right:8px!important;left:auto!important;width:auto!important;padding:3px 6px!important;border-radius:999px!important;background:rgba(255,255,255,.72)!important;color:#55718c!important}
@media(max-width:680px){
  .oppo-gallery-arrow{width:27px!important;height:27px!important;font-size:21px!important}
  #portafolio .oppo-gallery{border-radius:13px!important}
}


/* === V50 · PORTAFOLIO: VIDEO + FILTRO SEGMENTADO + GALERÍAS NORMALIZADAS === */
#portafolio .portfolio-video-banner{
  position:relative;
  height:clamp(210px,22vw,300px);
  margin:0 0 18px;
  border-radius:24px;
  overflow:hidden;
  background:#dff8f4;
  border:1px solid rgba(17,58,105,.10);
  box-shadow:0 16px 38px rgba(20,65,105,.10);
}
#portafolio .portfolio-hero-video{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
}
#portafolio .portfolio-video-banner:after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(3,37,78,.58) 0%,rgba(3,37,78,.18) 43%,rgba(3,37,78,.02) 72%);
  pointer-events:none;
}
.portfolio-video-overlay{
  position:absolute;z-index:3;left:28px;top:50%;transform:translateY(-50%);
  display:flex;flex-direction:column;gap:7px;color:#fff;max-width:420px;
  text-shadow:0 2px 12px rgba(0,0,0,.18);
}
.portfolio-video-eyebrow{
  font-size:11px;font-weight:900;letter-spacing:.14em;
  color:#6ff3c5;
}
.portfolio-video-overlay strong{
  font-size:clamp(25px,3.2vw,42px);line-height:1.03;letter-spacing:-.035em;
}
.portfolio-video-overlay span:last-child{font-size:11px;opacity:.88}
.portfolio-video-live{
  position:absolute;z-index:4;right:18px;top:16px;
  padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.9);
  color:#073d73;font-size:9px;font-weight:900;letter-spacing:.08em;
}
.portfolio-toolbar{
  display:flex;align-items:center;gap:14px;margin:0 0 18px;
  padding:10px;background:rgba(255,255,255,.84);border:1px solid #e2ebf2;
  border-radius:18px;box-shadow:0 8px 24px rgba(16,56,95,.06);
}
.portfolio-segmented{
  display:flex;gap:4px;padding:4px;border-radius:13px;background:#edf5fb;
}
.portfolio-segment{
  border:0;background:transparent;color:#55708d;cursor:pointer;
  padding:10px 17px;border-radius:10px;font-weight:850;font-size:12px;
  transition:.18s ease;
}
.portfolio-segment:hover{color:#073d73;background:#fff}
.portfolio-segment.active{
  color:#fff;background:#087df0;
  box-shadow:0 5px 14px rgba(8,125,240,.22);
}
.portfolio-search{margin-left:auto;min-width:260px}
.portfolio-search input{
  width:100%;border:1px solid #dbe7f0;background:#fff;border-radius:11px;
  padding:11px 13px;outline:none;color:#173f6b;font-weight:650;
}
.portfolio-search input:focus{border-color:#55baf1;box-shadow:0 0 0 3px rgba(85,186,241,.12)}
.portfolio-hidden-filter{display:none!important}

/* Gallery images supplied by OPPO Store references: preserve full 16:9 frame and center product */
#portafolio .oppo-gallery{
  background:#eaf9f6!important;
}
#portafolio .oppo-gallery-image{
  object-fit:contain!important;
  object-position:center center!important;
  padding:0!important;
  background:#eaf9f6!important;
  filter:none!important;
}
#portafolio .oppo-gallery-arrow{
  width:28px!important;height:28px!important;font-size:21px!important;
  opacity:.96!important;
}
#portafolio .oppo-gallery-dots{bottom:7px!important}
#portafolio .oppo-gallery-counter{top:8px!important;right:8px!important}
#portafolio .product-visual:has(.oppo-gallery){
  padding:0!important;
  background:#eaf9f6!important;
}
#portafolio .product-visual:has(.oppo-gallery) .visual-label{z-index:10}

@media(max-width:900px){
  .portfolio-toolbar{align-items:stretch;flex-direction:column}
  .portfolio-search{margin-left:0;min-width:0}
}
@media(max-width:600px){
  #portafolio .portfolio-video-banner{height:210px;border-radius:18px}
  .portfolio-video-overlay{left:18px;right:18px}
  .portfolio-video-overlay strong{font-size:25px}
  .portfolio-segmented{width:100%}
  .portfolio-segment{flex:1;padding:10px 7px;font-size:11px}
}


/* === V52 · PORTAFOLIO: VIDEO 16:9 + FONDOS INTEGRADOS + SPECS TIPO PROTOTIPO + COMPARADOR === */
#portafolio .portfolio-video-banner{
  aspect-ratio:16/9;
  height:auto;
  max-height:430px;
  margin:0 0 18px;
  border-radius:22px;
  background:#e8eef3;
  overflow:hidden;
}
#portafolio .portfolio-hero-video{
  width:100%;height:100%;display:block;
  object-fit:contain;
  object-position:center center;
  background:#e8eef3;
}
#portafolio .portfolio-video-banner:after{
  background:linear-gradient(90deg,rgba(3,37,78,.30) 0%,rgba(3,37,78,.08) 38%,rgba(3,37,78,0) 70%);
}
#portafolio .portfolio-video-overlay{left:24px;top:auto;bottom:22px;transform:none;max-width:390px}
#portafolio .portfolio-video-overlay strong{font-size:clamp(22px,2.6vw,34px)}

/* Las imágenes entregadas son composiciones 16:9 completas: no crear un segundo marco detrás. */
#portafolio .product-visual:has(.oppo-gallery),
#portafolio .oppo-gallery,
#comparador .smart-device-stage:has(.oppo-gallery),
#comparador .smart-device-stage:has(.oppo-gallery) .oppo-gallery{
  background:transparent!important;
}
#portafolio .oppo-gallery,
#comparador .smart-device-stage:has(.oppo-gallery) .oppo-gallery{
  aspect-ratio:16/9!important;
  width:100%!important;
  overflow:hidden!important;
}
#portafolio .oppo-gallery-image,
#comparador .smart-device-stage:has(.oppo-gallery) .oppo-gallery-image{
  width:100%!important;height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  padding:0!important;
  display:block!important;
  background:transparent!important;
}
#portafolio .product-visual:has(.oppo-gallery){padding:0!important;aspect-ratio:16/9!important}

/* Especificaciones compactas inspiradas en el prototipo: icono + concepto + valor. */
#portafolio .portfolio-key-specs{
  display:flex!important;
  flex-direction:column!important;
  gap:7px!important;
  margin-top:14px!important;
  padding:0!important;
  background:transparent!important;
}
#portafolio .portfolio-spec-row{
  display:grid!important;
  grid-template-columns:28px minmax(0,1fr)!important;
  align-items:center!important;
  min-height:34px!important;
  padding:2px 0!important;
  border:0!important;
  background:transparent!important;
  border-radius:0!important;
  position:relative!important;
}
#portafolio .portfolio-spec-row .spec-icon{
  width:25px;height:25px;border:1.5px solid #55718c;border-radius:7px;
  display:grid;place-items:center;color:#173f6b;font-size:12px;font-weight:900;
  line-height:1;
}
#portafolio .portfolio-spec-row .spec-icon-battery{border-radius:6px}
#portafolio .portfolio-spec-row .spec-icon-screen{border-radius:5px}
#portafolio .portfolio-spec-row .spec-icon-camera{border-radius:50%}
#portafolio .portfolio-spec-row .spec-copy{
  display:grid!important;
  grid-template-columns:70px minmax(0,1fr)!important;
  gap:8px!important;
  align-items:center!important;
  min-width:0!important;
}
#portafolio .portfolio-spec-row small{
  font-size:10px!important;
  color:#6b7f92!important;
  font-weight:700!important;
  text-transform:none!important;
}
#portafolio .portfolio-spec-row b{
  font-size:11px!important;
  color:#1a3e66!important;
  font-weight:800!important;
  line-height:1.25!important;
  white-space:normal!important;
}
#portafolio .portfolio-spec-row .spec-tip{left:30px;top:100%;z-index:30}

/* Comparador: escenario 16:9 y equipo centrado sin deformación. */
#comparador .smart-device-stage:has(.oppo-gallery){
  aspect-ratio:16/9!important;
  height:auto!important;
  min-height:0!important;
  display:block!important;
  overflow:hidden!important;
}
#comparador .smart-device-stage:has(.oppo-gallery) .oppo-gallery-arrow{z-index:15!important}
#comparador .smart-device-stage:has(.oppo-gallery) .oppo-gallery-counter{z-index:16!important}
#comparador .smart-device-stage:has(.oppo-gallery) .oppo-gallery-dots{z-index:16!important}
@media(max-width:700px){
  #portafolio .portfolio-video-banner{border-radius:16px;max-height:none}
  #portafolio .portfolio-video-overlay{left:16px;bottom:16px}
  #portafolio .portfolio-video-overlay strong{font-size:22px}
  #portafolio .portfolio-spec-row .spec-copy{grid-template-columns:64px minmax(0,1fr)!important}
}

/* === V53 · PORTAFOLIO HERO: VIDEO ESTELAR + 6 BENEFICIOS === */
#portafolio .portfolio-hero-showcase{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.56fr) minmax(0,.72fr);gap:12px;align-items:stretch;margin:0 0 18px}
#portafolio .portfolio-side-stack{display:grid;grid-template-rows:repeat(3,1fr);gap:12px;min-width:0}
#portafolio .portfolio-side-image{position:relative;min-width:0;overflow:hidden;border-radius:18px;background:#f4f3fa;border:1px solid rgba(17,58,105,.08);box-shadow:0 10px 24px rgba(20,65,105,.07);aspect-ratio:16/9}
#portafolio .portfolio-side-image img{width:100%;height:100%;display:block;object-fit:contain;object-position:center;background:#f7f4fb}
#portafolio .portfolio-hero-showcase .portfolio-video-banner{margin:0;min-width:0;aspect-ratio:16/9;height:auto;max-height:none;border-radius:22px;position:relative;overflow:hidden;background:#e8eef3;border:1px solid rgba(17,58,105,.10);box-shadow:0 16px 38px rgba(20,65,105,.12)}
#portafolio .portfolio-hero-showcase .portfolio-hero-video{width:100%;height:100%;display:block;object-fit:contain;object-position:center;background:#e8eef3}
#portafolio .portfolio-hero-showcase .portfolio-video-banner:after{background:linear-gradient(90deg,rgba(3,37,78,.24),rgba(3,37,78,.05) 52%,rgba(3,37,78,0) 80%)}
#portafolio .portfolio-video-overlay{left:22px;right:20px;top:auto;bottom:20px;transform:none;max-width:390px;gap:5px}
#portafolio .portfolio-video-eyebrow{font-size:10px;letter-spacing:.12em}
#portafolio .portfolio-video-overlay strong{font-size:clamp(28px,3.1vw,44px);line-height:1}
#portafolio .portfolio-video-overlay span:last-child{font-size:11px;opacity:.95}
#portafolio .portfolio-featured-badge{position:absolute;z-index:5;right:14px;top:14px;padding:8px 11px;border-radius:999px;background:#fff;color:#145a9d;font-size:10px;font-weight:950;letter-spacing:.07em;box-shadow:0 7px 18px rgba(20,65,105,.13)}
#portafolio .portfolio-live{display:none!important}
#portafolio .oppo-gallery-counter,#comparador .oppo-gallery-counter{display:none!important}
#comparador .smart-source-note{display:none!important}
#comparador .smart-col-label{font-weight:900}
#comparador .smart-device-stage:has(.oppo-gallery),#comparador .smart-device-stage:has(.oppo-gallery) .oppo-gallery{background:transparent!important}
#comparador .smart-device-stage:has(.oppo-gallery) .oppo-gallery-image{object-fit:cover!important;object-position:center!important}
@media(max-width:1100px){#portafolio .portfolio-hero-showcase{grid-template-columns:minmax(0,.7fr) minmax(0,1.6fr) minmax(0,.7fr);gap:8px}#portafolio .portfolio-side-stack{gap:8px}#portafolio .portfolio-video-overlay{left:16px;bottom:15px}}
@media(max-width:760px){#portafolio .portfolio-hero-showcase{grid-template-columns:1fr;gap:10px}#portafolio .portfolio-side-stack{grid-template-columns:repeat(3,1fr);grid-template-rows:none;gap:8px;order:2}#portafolio .portfolio-video-banner{order:1!important}#portafolio .portfolio-side-stack:last-child{order:3}#portafolio .portfolio-side-image{border-radius:12px}#portafolio .portfolio-video-overlay strong{font-size:28px}}

/* === V54 · RENO16 HERO: VIDEO + GALERÍA LATERAL LIMPIA === */
#portafolio .portfolio-hero-showcase{
  display:grid!important;
  grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr)!important;
  gap:18px!important;
  align-items:stretch!important;
  margin:0 0 20px!important;
  padding:0!important;
}
#portafolio .portfolio-hero-showcase .portfolio-video-banner{
  aspect-ratio:16/9!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  margin:0!important;
  border-radius:22px!important;
  overflow:hidden!important;
  background:#dceef3!important;
  border:1px solid rgba(14,66,108,.10)!important;
  box-shadow:0 14px 34px rgba(18,64,101,.10)!important;
  position:relative!important;
}
#portafolio .portfolio-hero-showcase .portfolio-hero-video{
  width:100%!important;height:100%!important;display:block!important;
  object-fit:contain!important;object-position:center!important;
  background:#dceef3!important;
}
#portafolio .portfolio-hero-showcase .portfolio-video-overlay{display:none!important}
#portafolio .portfolio-hero-showcase .portfolio-featured-badge{
  top:14px!important;right:14px!important;left:auto!important;
  padding:8px 12px!important;border-radius:999px!important;
  background:rgba(255,255,255,.94)!important;color:#124f8b!important;
  font-size:11px!important;font-weight:950!important;letter-spacing:.04em!important;
  box-shadow:0 7px 18px rgba(20,65,105,.14)!important;
}
#portafolio .reno16-feature-panel{
  min-width:0!important;display:flex!important;flex-direction:column!important;
  justify-content:center!important;padding:0!important;
  border-radius:22px!important;background:transparent!important;
}
#portafolio .reno16-feature-media{
  position:relative!important;min-width:0!important;overflow:hidden!important;
  aspect-ratio:16/9!important;border-radius:22px!important;
  background:#edf4f7!important;border:1px solid rgba(14,66,108,.08)!important;
  box-shadow:0 14px 34px rgba(18,64,101,.08)!important;
}
#portafolio .reno16-feature-media > img{
  width:100%!important;height:100%!important;display:block!important;
  object-fit:cover!important;object-position:center!important;
}
#portafolio .reno16-gallery-arrow{
  position:absolute!important;top:50%!important;transform:translateY(-50%)!important;
  width:36px!important;height:36px!important;border:0!important;border-radius:50%!important;
  background:rgba(255,255,255,.92)!important;color:#0a4f8e!important;
  font-size:27px!important;line-height:1!important;z-index:4!important;
  box-shadow:0 5px 16px rgba(18,64,101,.18)!important;cursor:pointer!important;
}
#portafolio .reno16-gallery-arrow.prev{left:12px!important}
#portafolio .reno16-gallery-arrow.next{right:12px!important}
#portafolio .reno16-feature-caption{
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  padding:9px 3px 7px!important;color:#0c3967!important;
}
#portafolio .reno16-feature-caption span{font-size:12px!important;font-weight:900!important;letter-spacing:.02em!important}
#portafolio .reno16-feature-caption b{font-size:10px!important;color:#5d7892!important;letter-spacing:.12em!important}
#portafolio .reno16-thumbs{
  display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:6px!important;
}
#portafolio .reno16-thumb{
  appearance:none!important;padding:0!important;border:2px solid transparent!important;
  border-radius:9px!important;overflow:hidden!important;background:transparent!important;
  aspect-ratio:16/9!important;cursor:pointer!important;min-width:0!important;
  opacity:.66!important;transition:opacity .18s ease,border-color .18s ease,transform .18s ease!important;
}
#portafolio .reno16-thumb img{width:100%!important;height:100%!important;display:block!important;object-fit:cover!important}
#portafolio .reno16-thumb:hover{opacity:1!important;transform:translateY(-1px)!important}
#portafolio .reno16-thumb.active{opacity:1!important;border-color:#18a77c!important;box-shadow:0 0 0 2px rgba(24,167,124,.12)!important}
@media(max-width:900px){
 #portafolio .portfolio-hero-showcase{grid-template-columns:1fr!important;gap:12px!important}
 #portafolio .reno16-feature-panel{order:2!important}
 #portafolio .portfolio-hero-showcase .portfolio-video-banner{order:1!important}
}
@media(max-width:560px){
 #portafolio .reno16-thumbs{grid-template-columns:repeat(3,minmax(0,1fr))!important}
 #portafolio .reno16-gallery-arrow{width:32px!important;height:32px!important}
}


/* === V55 · RENO16 HERO: LECTURA MAYOR + ZOOM ESTABLE === */
#portafolio .portfolio-hero-showcase{
  display:grid!important;
  grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr)!important;
  gap:18px!important;
  align-items:start!important;
  width:100%!important;
  box-sizing:border-box!important;
}
#portafolio .portfolio-hero-showcase > *{min-width:0!important;box-sizing:border-box!important}
#portafolio .portfolio-hero-showcase .portfolio-video-banner{
  width:100%!important;
  aspect-ratio:16/9!important;
  height:auto!important;
  align-self:start!important;
  box-sizing:border-box!important;
}
#portafolio .portfolio-hero-showcase .portfolio-hero-video{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  object-fit:contain!important;
  object-position:50% 50%!important;
}
/* Badge destacado: extremo opuesto al lado derecho anterior, más ligero y llamativo. */
#portafolio .portfolio-hero-showcase .portfolio-featured-badge{
  left:14px!important;
  right:auto!important;
  top:14px!important;
  background:#ffd84a!important;
  color:#17385e!important;
  border:1px solid rgba(164,119,0,.18)!important;
  font-size:10px!important;
  font-weight:700!important;
  letter-spacing:.045em!important;
  padding:8px 12px!important;
  box-shadow:0 7px 16px rgba(139,103,0,.18)!important;
  animation:renoFeaturedPulse 2.4s ease-in-out infinite!important;
}
@keyframes renoFeaturedPulse{
  0%,100%{transform:scale(1);box-shadow:0 7px 16px rgba(139,103,0,.16)}
  50%{transform:scale(1.035);box-shadow:0 9px 21px rgba(139,103,0,.25)}
}
/* Galería grande: muestra la imagen completa y su tipografía a mayor tamaño. */
#portafolio .reno16-feature-panel{
  width:100%!important;
  min-width:0!important;
  align-self:start!important;
}
#portafolio .reno16-feature-media{
  width:100%!important;
  height:auto!important;
  aspect-ratio:auto!important;
  overflow:hidden!important;
  background:transparent!important;
  border-radius:20px!important;
  box-sizing:border-box!important;
  display:block!important;
}
#portafolio .reno16-feature-media > img{
  width:100%!important;
  height:auto!important;
  max-width:100%!important;
  display:block!important;
  object-fit:initial!important;
  object-position:center center!important;
  margin:0 auto!important;
  background:transparent!important;
}
#portafolio .reno16-feature-caption{
  padding:10px 3px 8px!important;
}
#portafolio .reno16-feature-caption span{
  font-size:12px!important;
  font-weight:750!important;
  letter-spacing:.02em!important;
}
#portafolio .reno16-thumbs{
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:7px!important;
}
#portafolio .reno16-thumb{
  background:#f3f4f7!important;
  border:2px solid transparent!important;
}
#portafolio .reno16-thumb img{
  width:100%!important;
  height:auto!important;
  aspect-ratio:auto!important;
  object-fit:cover!important;
  display:block!important;
}
/* Evita que el navegador cambie la composición por pequeñas variaciones de ancho/zoom. */
#portafolio .portfolio-hero-showcase,
#portafolio .portfolio-hero-showcase .portfolio-video-banner,
#portafolio .reno16-feature-media,
#portafolio .reno16-feature-media > img{
  transform:none!important;
  zoom:1!important;
}
@media(max-width:760px){
  #portafolio .portfolio-hero-showcase{grid-template-columns:1fr!important;gap:12px!important}
  #portafolio .portfolio-hero-showcase .portfolio-video-banner{order:1!important}
  #portafolio .reno16-feature-panel{order:2!important}
  #portafolio .reno16-thumbs{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}


/* V56 · SIDEBAR COMPACTO MODERNO + RESPONSIVE */
.sidebar .logo:before{content:"oppo"!important;font-size:24px!important;font-weight:500!important;letter-spacing:-.08em!important;line-height:.9!important;color:#fff!important}
.sidebar .logo:after{content:""!important;display:none!important}
.sidebar .brand strong{font-size:10px!important;letter-spacing:.08em!important;line-height:1.2!important}
.sidebar .nav button{font-size:10.5px!important;font-weight:600!important;min-height:34px!important;padding:7px 8px!important}
.sidebar .nav-group-title{font-size:8px!important;font-weight:800!important}
.sidebar .nav-ico{width:22px!important;height:22px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;flex:0 0 22px!important}
.sidebar .nav-ico svg{width:19px!important;height:19px!important;stroke-width:1.8!important}

/* El sidebar se mantiene como rail estable en tablets y móviles para que el contenido no se deforme */
@media (max-width:1100px){
  .app{grid-template-columns:174px minmax(0,1fr)!important}
  .sidebar{padding:16px 10px!important}
  .content{padding:16px!important}
}
@media (max-width:820px){
  .app{grid-template-columns:74px minmax(0,1fr)!important;min-width:0!important}
  .sidebar{position:sticky!important;top:0!important;height:100vh!important;min-height:100vh!important;width:74px!important;padding:12px 7px!important;overflow-y:auto!important;overflow-x:hidden!important}
  .sidebar .brand{justify-content:center!important;display:flex!important;padding:5px 2px 13px!important;margin-bottom:7px!important}
  .sidebar .brand > div:last-child{display:none!important}
  .sidebar .logo{display:block!important;text-align:center!important}
  .sidebar .logo:before{font-size:20px!important}
  .sidebar .nav{display:flex!important;flex-direction:column!important;gap:5px!important}
  .sidebar .nav-group-title{font-size:0!important;height:16px!important;padding:0!important;margin:5px 3px 1px!important}
  .sidebar .nav-group-title:after{content:"";display:block;height:1px;background:rgba(255,255,255,.13);margin-top:8px}
  .sidebar .nav-group-title.oppo-title:after{background:rgba(114,238,229,.35)}
  .sidebar .nav-divider{height:1px!important;margin:5px 3px!important}
  .sidebar .nav button{width:100%!important;min-height:48px!important;padding:8px 4px!important;border-radius:11px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:0!important}
  .sidebar .nav button span:not(.nav-ico){display:none!important}
  .sidebar .nav button .nav-ico{width:30px!important;height:30px!important;flex:0 0 30px!important}
  .sidebar .nav button .nav-ico svg{width:23px!important;height:23px!important;stroke-width:1.8!important}
  .sidebar .nav button.active{box-shadow:0 7px 16px rgba(35,140,242,.28)!important}
  .sidebar-ollie{display:none!important}
  .content{padding:10px!important;min-width:0!important}
  .page{min-width:0!important;border-radius:16px!important}
  .section-head h2{font-size:clamp(20px,4vw,25px)!important}
}
@media (max-width:520px){
  .app{grid-template-columns:62px minmax(0,1fr)!important}
  .sidebar{width:62px!important;padding:10px 5px!important}
  .sidebar .nav button{min-height:44px!important}
  .sidebar .nav button .nav-ico{width:27px!important;height:27px!important;flex-basis:27px!important}
  .sidebar .nav button .nav-ico svg{width:21px!important;height:21px!important}
  .content{padding:7px!important}
  .page{border-radius:13px!important}
}

/* El contenido nunca debe usar el ancho de viewport como referencia de posicionamiento */
.content,.page,.section,.card,.portfolio-hero-showcase,#portafolio,#comparador{min-width:0!important;box-sizing:border-box!important}
img,video{max-width:100%;height:auto}

/* =========================================================
   V57 · SIDEBAR COMPACTO MODERNO + RESPONSIVE REAL
   ========================================================= */
.mobile-menu-toggle,.sidebar-close,.sidebar-backdrop{display:none}

/* Desktop: compacto, limpio y estable */
.app{grid-template-columns:196px minmax(0,1fr)!important;min-width:0!important}
.sidebar{width:auto!important;min-width:0!important;box-sizing:border-box!important;padding:16px 11px!important}
.sidebar .brand{min-width:0!important}
.sidebar .brand strong{font-size:9px!important;line-height:1.2!important;letter-spacing:.10em!important}
.sidebar .logo{width:42px!important;height:42px!important;border:1px solid rgba(255,255,255,.35)!important;border-radius:10px!important;background:linear-gradient(135deg,#18c9c2,#238cf2)!important;display:flex!important;align-items:center!important;justify-content:center!important;font-size:13px!important;font-weight:800!important;letter-spacing:.04em!important;color:#fff!important;box-shadow:0 6px 16px rgba(35,140,242,.18)!important}
.sidebar .logo:before,.sidebar .logo:after{content:none!important;display:none!important}
.sidebar .nav button{font-size:11px!important;font-weight:600!important;min-height:38px!important;padding:8px 9px!important;gap:8px!important}
.sidebar .nav button span:last-child{font-size:11px!important}
.sidebar .nav-ico{width:20px!important;height:20px!important;flex:0 0 20px!important}
.sidebar .nav-ico svg{width:19px!important;height:19px!important}
.sidebar .nav-group-title{font-size:8px!important;letter-spacing:.11em!important}
.sidebar .nav-divider{margin:10px 7px!important}
.main{min-width:0!important}
.content{min-width:0!important;overflow-x:hidden!important}
.page{min-width:0!important;max-width:100%!important}

/* Tablet: sidebar estrecho pero todavía utilizable */
@media (max-width:1050px) and (min-width:821px){
  .app{grid-template-columns:174px minmax(0,1fr)!important}
  .sidebar{padding:14px 9px!important}
  .sidebar .brand{gap:8px!important}
  .sidebar .brand strong{font-size:8px!important}
  .sidebar .logo{width:38px!important;height:38px!important}
  .sidebar .nav button{font-size:10px!important;padding:7px!important}
  .sidebar .nav button span:last-child{font-size:10px!important}
}

/* Móvil: menú lateral real, no barra horizontal */
@media (max-width:820px){
  .mobile-menu-toggle{
    display:flex!important;position:fixed;left:12px;top:12px;z-index:120;
    width:42px;height:42px;border:1px solid rgba(255,255,255,.18);border-radius:12px;
    align-items:center;justify-content:center;background:#07265a;color:#fff;font-size:20px;
    box-shadow:0 8px 22px rgba(7,38,90,.22);cursor:pointer
  }
  .sidebar-backdrop{
    position:fixed;inset:0;background:rgba(4,20,46,.45);z-index:109;display:none!important
  }
  .sidebar-backdrop.open{display:block!important}
  .app{display:block!important;min-height:100vh!important}
  .sidebar{
    position:fixed!important;left:0;top:0;bottom:0;width:min(82vw,300px)!important;height:100dvh!important;
    min-height:100dvh!important;z-index:110;transform:translateX(-105%);transition:transform .24s ease;
    overflow-y:auto!important;overflow-x:hidden!important;padding:16px 12px 22px!important;
    box-shadow:12px 0 34px rgba(4,20,46,.22)!important
  }
  .sidebar.open{transform:translateX(0)!important}
  .sidebar .brand{display:flex!important;align-items:center!important;gap:10px!important}
  .sidebar .brand strong{font-size:10px!important;line-height:1.25!important}
  .sidebar-close{
    display:flex!important;margin-left:auto;width:32px;height:32px;border:0;border-radius:9px;
    align-items:center;justify-content:center;background:rgba(255,255,255,.1);color:#fff;font-size:22px;cursor:pointer
  }
  .sidebar .nav{display:flex!important;flex-direction:column!important;gap:4px!important}
  .sidebar .nav-group-title,.sidebar .nav-divider{display:block!important}
  .sidebar .nav button{width:100%!important;min-height:42px!important;font-size:12px!important;padding:9px 10px!important}
  .sidebar .nav button span:last-child{font-size:12px!important}
  .sidebar .nav-ico{width:21px!important;height:21px!important;flex-basis:21px!important}
  .sidebar .nav-ico svg{width:20px!important;height:20px!important}
  .sidebar-ollie,.sidebar-ollie-autoeval{display:none!important}
  .main{width:100%!important;min-width:0!important}
  .topbar{padding:10px 12px 10px 64px!important}
  .content{padding:8px!important;width:100%!important;box-sizing:border-box!important}
  .page{width:100%!important;box-sizing:border-box!important;border-radius:14px!important}
}

@media (max-width:520px){
  .content{padding:6px!important}
  .topbar{padding-right:8px!important}
  .search{width:100%!important}
  .section-head h2{font-size:21px!important}
  .section-head p{font-size:11px!important}
  .page:not(.hidden)::after{display:none!important}
}

/* Accesibilidad: respeta preferencias de movimiento */
@media (prefers-reduced-motion:reduce){
  .sidebar{transition:none!important}
}


/* =========================================================
   V58 · RESPONSIVE REAL + SIDEBAR MÓVIL CORREGIDO
   Objetivo: una sola composición fluida en móvil, tablet y desktop.
   ========================================================= */
html,body{max-width:100%;overflow-x:hidden!important}
*,*::before,*::after{box-sizing:border-box}

/* Sidebar móvil: restaurar texto oculto por reglas antiguas y alinear todo */
@media (max-width:820px){
  .app{display:block!important;width:100%!important;min-width:0!important;overflow-x:hidden!important}
  .main{width:100%!important;max-width:100%!important;min-width:0!important}
  .sidebar{
    width:min(86vw,292px)!important;
    max-width:292px!important;
    padding:18px 14px 24px!important;
    display:block!important;
    text-align:left!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
  }
  .sidebar .brand{
    width:100%!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:11px!important;
    padding:6px 4px 16px!important;
    margin:0 0 12px!important;
  }
  .sidebar .brand > div:last-child{display:block!important;min-width:0!important}
  .sidebar .logo{
    width:42px!important;height:42px!important;min-width:42px!important;
    display:flex!important;align-items:center!important;justify-content:center!important;
    background:linear-gradient(135deg,#18c9c2,#238cf2)!important;
    border:1px solid rgba(255,255,255,.3)!important;border-radius:10px!important;
    color:#fff!important;font-size:13px!important;font-weight:800!important;
  }
  .sidebar .logo::before,.sidebar .logo::after{content:none!important;display:none!important}
  .sidebar .brand strong{
    display:block!important;color:#fff!important;font-size:11px!important;
    line-height:1.25!important;letter-spacing:.08em!important;text-transform:uppercase!important;
    margin:0!important;white-space:normal!important;
  }
  .sidebar-close{display:flex!important;flex:0 0 32px!important;margin-left:auto!important}
  .sidebar .nav{display:flex!important;flex-direction:column!important;gap:3px!important;width:100%!important}
  .sidebar .nav-group-title{
    display:block!important;font-size:9px!important;height:auto!important;
    padding:12px 10px 7px!important;margin:0!important;color:rgba(255,255,255,.62)!important;
    text-align:left!important;letter-spacing:.12em!important;
  }
  .sidebar .nav-group-title::after{display:none!important}
  .sidebar .nav-divider{display:block!important;height:1px!important;width:calc(100% - 12px)!important;margin:10px 6px!important}
  .sidebar .nav button{
    width:100%!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;
    gap:10px!important;min-height:44px!important;padding:9px 11px!important;
    border-radius:11px!important;text-align:left!important;font-size:12px!important;
  }
  .sidebar .nav button span:not(.nav-ico){
    display:inline!important;visibility:visible!important;opacity:1!important;
    white-space:nowrap!important;overflow:visible!important;
  }
  .sidebar .nav button .nav-ico{width:22px!important;height:22px!important;flex:0 0 22px!important}
  .sidebar .nav button .nav-ico svg{width:21px!important;height:21px!important}
  .sidebar .nav button.active{background:linear-gradient(90deg,#2ad8e6,#238cf2)!important}
  .sidebar-ollie,.sidebar-ollie-autoeval{display:none!important}

  /* Contenido móvil limpio */
  .content{width:100%!important;max-width:100%!important;padding:8px!important;overflow-x:hidden!important}
  .page{width:100%!important;max-width:100%!important;min-width:0!important;overflow:hidden!important}
  .page > *{max-width:100%!important}
}

/* Inicio: nunca mostrar tarjetas cortadas ni grids de desktop en móvil */
@media (max-width:600px){
  #inicio.home-page{width:100%!important;overflow:hidden!important}
  #inicio.home-page .home-shell{width:100%!important;max-width:100%!important;padding:0 0 18px!important;margin:0!important}
  #inicio.home-page .home-hero{
    width:100%!important;height:360px!important;min-height:360px!important;
    border-radius:0 0 18px 18px!important;overflow:hidden!important;
  }
  #inicio.home-page .home-hero-image{background-size:cover!important;background-position:58% center!important;opacity:.48!important}
  #inicio.home-page .home-hero-copy{width:100%!important;padding:30px 20px 0!important;max-width:100%!important}
  #inicio.home-page .home-kicker{font-size:9px!important;letter-spacing:.04em!important}
  #inicio.home-page .home-hero-copy h1{font-size:31px!important;line-height:1.02!important;margin:10px 0 4px!important}
  #inicio.home-page .home-hero-copy h2{font-size:19px!important;line-height:1.15!important;max-width:310px!important}
  #inicio.home-page .home-hero-copy p{font-size:11px!important;line-height:1.45!important;max-width:300px!important}
  #inicio.home-page .home-hero-note{right:16px!important;top:250px!important;font-size:18px!important;line-height:1.05!important}
  #inicio.home-page .home-action-grid{
    display:grid!important;grid-template-columns:1fr!important;gap:10px!important;
    margin:-8px 10px 12px!important;width:auto!important;
  }
  #inicio.home-page .home-action{
    width:100%!important;min-width:0!important;min-height:92px!important;
    grid-template-columns:50px minmax(0,1fr) 28px!important;padding:13px!important;
  }
  #inicio.home-page .home-action b{font-size:15px!important}
  #inicio.home-page .home-action small{font-size:10px!important}
  #inicio.home-page .home-action-icon,#inicio.home-page .home-action-icon img{width:50px!important;height:50px!important;min-width:50px!important}
  #inicio.home-page .home-main-grid{display:flex!important;flex-direction:column!important;width:100%!important;gap:10px!important}
  #inicio.home-page .home-left-column,#inicio.home-page .home-right-column{width:100%!important;min-width:0!important;display:flex!important;flex-direction:column!important;gap:10px!important}
  #inicio.home-page .home-route-card,#inicio.home-page .home-quick-card,#inicio.home-page .home-oppo-card,#inicio.home-page .home-landscape-card{width:100%!important;min-width:0!important}
  #inicio.home-page .home-route-card{padding:14px 12px!important}
  #inicio.home-page .home-route-head{display:block!important}
  #inicio.home-page .home-ollie-cluster{display:none!important}
  #inicio.home-page .home-route{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  #inicio.home-page .home-route .route{width:100%!important;min-height:76px!important;clip-path:polygon(0 0,94% 0,100% 50%,94% 100%,0 100%,3% 50%)!important;padding:11px 17px 10px 20px!important}
  #inicio.home-page .home-route .route b{font-size:12px!important}
  #inicio.home-page .home-route .route small{font-size:9px!important}
  #inicio.home-page .home-quick-grid{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  #inicio.home-page .home-quick-grid button{width:100%!important;min-width:0!important}
  #inicio.home-page .home-oppo-card{height:210px!important;overflow:hidden!important}
  #inicio.home-page .home-product-stack{right:4px!important;bottom:-8px!important;opacity:.9!important}
  #inicio.home-page .home-landscape-card{height:165px!important}
}

/* Portafolio: una tarjeta por fila en móvil para que nunca se compriman tres modelos */
@media (max-width:600px){
  #portafolio #portfolioGrid{display:grid!important;grid-template-columns:1fr!important;gap:12px!important;padding:0 10px 18px!important;width:100%!important}
  #portafolio .portfolio-card,#portafolio .product-card{width:100%!important;min-width:0!important}
  #portafolio .portfolio-hero-showcase{display:flex!important;flex-direction:column!important;width:100%!important;gap:10px!important}
  #portafolio .portfolio-video-banner{order:1!important;width:100%!important}
  #portafolio .portfolio-side-stack{order:2!important;width:100%!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}
  #portafolio .portfolio-side-stack:last-child{order:3!important}
}

/* Tablas/comparadores y grids: siempre una sola columna cuando el ancho ya no permite lectura cómoda */
@media (max-width:600px){
  #comparador .smart-compare-grid,#comparador .smart-why-grid,
  #laboratorio .lab-stages,#laboratorio .lab-layout,
  #taller .workshop-start-grid,#taller .compact-route,
  #autoevaluacion .sales-checklist{grid-template-columns:1fr!important;width:100%!important}
  #comparador .smart-column{width:100%!important;min-width:0!important}
  .section-head,.card,.hero,.lab-hero,.sales-hero{max-width:100%!important;min-width:0!important}
}

/* Evita escalados de texto que rompen el layout en iOS/Android */
@media (max-width:820px){
  body{-webkit-text-size-adjust:100%;text-size-adjust:100%}
  input,select,button,textarea{font-size:16px!important}
}

/* ============================================================
   V59 · CERTIFICACIÓN + TALLER LIMPIO
   ============================================================ */
#quiz .progress,#quiz .quiz-floating-progress{display:none!important}
#quiz .certification-card{max-width:1080px;margin:0 auto;padding:28px!important;background:rgba(255,255,255,.96)!important;border:1px solid #dce7f4!important;border-radius:24px!important;box-shadow:0 16px 40px rgba(22,55,100,.08)!important}
.cert-identity{max-width:760px;margin:0 auto}
.cert-identity-head{margin-bottom:22px}.cert-identity-head h3{font-size:28px;margin:5px 0 8px;color:#173f7b}.cert-identity-head p{margin:0;color:#657793}
.cert-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:end}.cert-form label{display:flex;flex-direction:column;gap:7px;color:#264b7e;font-size:12px;font-weight:800}.cert-form input{height:48px;border:1px solid #d8e5f3;border-radius:12px;padding:0 14px;font:inherit;font-size:14px;color:#173f7b;background:#fff;outline:none}.cert-form input:focus{border-color:#2e83ef;box-shadow:0 0 0 3px rgba(46,131,239,.12)}.cert-form .btn{height:48px;white-space:nowrap}.cert-privacy-note{font-size:11px;color:#8090a7;margin:18px 0 0;line-height:1.5}
#quizBox .quiz-opt.selected{border-color:#2e83ef!important;background:#eef5ff!important;box-shadow:0 0 0 2px rgba(46,131,239,.08)!important}
#quizBox .question{font-size:21px!important}
.cert-final{text-align:center;padding:26px 12px 10px}.cert-final-kicker{font-size:11px;font-weight:900;letter-spacing:.14em;color:#159eae}.cert-final h2{font-size:32px;color:#173f7b;margin:8px 0 0}.cert-final-score{font-size:52px;line-height:1;font-weight:900;color:#2e83ef;margin:12px 0}.cert-final p{max-width:720px;margin:0 auto 20px;color:#516883;line-height:1.6}.cert-final-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:720px;margin:0 auto 22px}.cert-final-meta span{background:#f5f8fc;border-radius:12px;padding:12px;color:#244e88;font-size:12px}.cert-final-meta b{display:block;text-transform:uppercase;font-size:9px;letter-spacing:.1em;color:#7c8da5;margin-bottom:4px}.result.success{color:#168b67!important}.result.error{color:#b64a4a!important}
#taller .sales-step b{background:#fff!important;color:#173f7b!important;box-shadow:0 2px 6px rgba(20,50,90,.08)}
#laboratorio .lab-stage:before{background:#fff!important}

@media(max-width:800px){
  #quiz .certification-card{padding:18px!important;margin:0 8px!important;border-radius:18px!important}
  .cert-form{grid-template-columns:1fr}.cert-form .btn{width:100%}.cert-identity-head h3{font-size:23px}.cert-final-meta{grid-template-columns:1fr}.cert-final h2{font-size:26px}.cert-final-score{font-size:44px}
  #quizBox .question{font-size:18px!important}.quiz-opt{width:100%!important}
}

/* V63 · Mi Punto de Partida Comercial · diagnóstico por situaciones */
#autoevaluacion .autoeval-hero{
  min-height:280px!important;
  padding:42px 54px 38px!important;
  background:linear-gradient(105deg,#e7fbfa 0%,#eef7ff 48%,#f5efff 100%)!important;
}
#autoevaluacion .autoeval-hero-copy{width:min(760px,64%)!important;max-width:760px!important;z-index:5}
#autoevaluacion .autoeval-kicker{font-size:11px!important;color:#2467c6!important;letter-spacing:.1em!important;font-weight:900!important}
#autoevaluacion .autoeval-hero h1{font-size:clamp(30px,3.4vw,48px)!important;line-height:1.02!important;letter-spacing:-.045em!important;color:#082f69!important;margin:7px 0 10px!important}
#autoevaluacion .autoeval-hero p{font-size:15px!important;max-width:650px!important;color:#365f8f!important}
#autoevaluacion .autoeval-live{font-size:11px!important;margin-top:17px!important;padding:9px 15px!important}
#autoevaluacion .autoeval-live span{width:28px!important;height:28px!important;border-radius:50%!important;background:linear-gradient(135deg,#22c7bc,#2d7de9)!important;display:grid!important;place-items:center!important;color:#fff!important;font-weight:900!important}
#autoevaluacion .autoeval-panel{margin:-8px 44px 20px!important;padding:26px 28px 20px!important;border-radius:22px!important}
#autoevaluacion .autoeval-panel-head{margin-bottom:20px!important}
#autoevaluacion .autoeval-panel-head h2{font-size:23px!important;line-height:1.15!important;color:#113d78!important}
#autoevaluacion .autoeval-panel-head p{font-size:12px!important}
#autoevaluacion .autoeval-panel-icon{width:54px!important;height:54px!important;flex:0 0 54px!important;border-radius:50%!important;background:linear-gradient(135deg,#25c8ba,#2b82ea)!important}
#autoevaluacion .autoeval-panel-icon svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:2}
#autoevaluacion .sales-checklist{display:grid!important;grid-template-columns:1fr 1fr!important;gap:14px!important;margin-top:8px!important}
#autoevaluacion .diagnosis-card{background:#fff;border:1px solid #dce8f3;border-radius:16px;padding:16px 16px 15px;box-shadow:0 7px 18px rgba(21,67,112,.045);transition:.18s ease;min-width:0}
#autoevaluacion .diagnosis-card:hover{border-color:#9bd9e5;box-shadow:0 10px 24px rgba(31,101,158,.08);transform:translateY(-1px)}
#autoevaluacion .diagnosis-card.answered{border-color:#86d9d0;background:linear-gradient(145deg,#fff,#f8ffff)}
#autoevaluacion .diagnosis-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}
#autoevaluacion .diagnosis-meta span{width:32px;height:32px;flex:0 0 32px;border-radius:50%;display:grid;place-items:center;background:#edf5ff;color:#2168c7;font-weight:900;font-size:11px}
#autoevaluacion .diagnosis-meta b{font-size:9px;letter-spacing:.1em;color:#18a99e;padding:6px 9px;border-radius:999px;background:#e9fbf7}
#autoevaluacion .diagnosis-card h3{margin:0 0 12px;color:#193f72;font-size:13px;line-height:1.4;font-weight:800}
#autoevaluacion .diagnosis-options{display:grid;gap:7px}
#autoevaluacion .diagnosis-option{width:100%;display:flex;align-items:flex-start;gap:9px;text-align:left;border:1px solid #e0e8f1;background:#f9fbfe;border-radius:11px;padding:9px 10px;color:#4d6684;font:inherit;font-size:10.5px;line-height:1.35;cursor:pointer;transition:.16s ease}
#autoevaluacion .diagnosis-option:hover{border-color:#8bcfd9;background:#f3fcfc}
#autoevaluacion .diagnosis-option.selected{border-color:#25bdb4;background:linear-gradient(100deg,#edfffb,#f2f8ff);color:#194b79;box-shadow:0 5px 12px rgba(25,173,166,.08)}
#autoevaluacion .option-letter{width:22px;height:22px;flex:0 0 22px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1px solid #cad9e7;color:#2b69ae;font-size:9px;font-weight:900}
#autoevaluacion .diagnosis-option.selected .option-letter{background:#20bdb1;border-color:#20bdb1;color:#fff}
#autoevaluacion .autoeval-panel-footer{margin-top:18px!important;padding-top:15px!important;border-top:1px solid #e6edf4;align-items:center!important}
#autoevaluacion .autoeval-panel-footer>span{font-size:11px!important;color:#617996!important}
#autoevaluacion .autoeval-panel-footer .ghost{border:1px solid #d5e3ef!important;background:#fff!important;color:#2a659c!important;box-shadow:none!important;padding:9px 14px!important}
#autoevaluacion .autoeval-result{margin-top:20px;padding:20px;border-radius:18px;background:linear-gradient(135deg,#effcfb,#f2f7ff 60%,#f8f2ff);border:1px solid #d6e7f1}
#autoevaluacion .autoeval-result.hidden{display:none}
#autoevaluacion .result-top{display:grid;grid-template-columns:118px 1fr;gap:17px;align-items:start}
#autoevaluacion .result-badge{min-height:92px;border-radius:18px;background:linear-gradient(145deg,#176ad1,#25bcb1);color:#fff;display:grid;place-items:center;text-align:center;font-size:12px;font-weight:900;letter-spacing:.06em;padding:12px}
#autoevaluacion .result-top .eyebrow{font-size:9px;color:#2772c5;letter-spacing:.1em;font-weight:900}
#autoevaluacion .result-top h3{margin:4px 0 6px;color:#123d78;font-size:19px;line-height:1.18}
#autoevaluacion .result-top p{margin:0;color:#58708e;font-size:11px;line-height:1.5}
#autoevaluacion .result-stages{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}
#autoevaluacion .diagnosis-stage>div:first-child{display:flex;justify-content:space-between;gap:6px;color:#31577f;font-size:9px;font-weight:900;margin-bottom:6px}
#autoevaluacion .diagnosis-stage b{color:#2470c8}
#autoevaluacion .stage-track{height:7px;border-radius:99px;background:#dfeaf3;overflow:hidden}
#autoevaluacion .stage-track i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#24bfb0,#347de7)}
#autoevaluacion .result-next{margin-top:18px;padding-top:15px;border-top:1px solid #dce8f2;display:flex;align-items:center;gap:12px}
#autoevaluacion .result-next span{font-size:8px;letter-spacing:.1em;font-weight:900;color:#2b70c4}
#autoevaluacion .result-next strong{font-size:13px;color:#123e78;flex:1}
#autoevaluacion .result-next .btn{padding:9px 15px!important}
#autoevaluacion .autoeval-next{margin:0 44px 34px!important}
#autoevaluacion .autoeval-next h3{font-size:18px!important}
#autoevaluacion .autoeval-next p{font-size:11px!important}
@media(max-width:900px){
  #autoevaluacion .autoeval-hero{padding:34px 28px 120px!important;min-height:340px!important}
  #autoevaluacion .autoeval-hero-copy{width:100%!important;max-width:620px!important}
  #autoevaluacion .autoeval-advisor{right:-40px!important;bottom:-5px!important;width:360px!important;height:190px!important;opacity:.52!important}
  #autoevaluacion .autoeval-panel{margin:-20px 18px 18px!important;padding:20px 16px!important}
  #autoevaluacion .sales-checklist{grid-template-columns:1fr!important}
  #autoevaluacion .result-stages{grid-template-columns:1fr 1fr}
  #autoevaluacion .result-next{flex-wrap:wrap}
  #autoevaluacion .result-next .btn{width:100%}
  #autoevaluacion .autoeval-next{margin:0 18px 24px!important;flex-wrap:wrap}
  #autoevaluacion .autoeval-next .btn{width:100%}
}
@media(max-width:560px){
  #autoevaluacion .autoeval-hero{padding:28px 17px 105px!important;min-height:320px!important}
  #autoevaluacion .autoeval-hero h1{font-size:30px!important}
  #autoevaluacion .autoeval-hero p{font-size:13px!important;max-width:360px!important}
  #autoevaluacion .autoeval-advisor{right:-90px!important;width:320px!important;height:170px!important;opacity:.32!important}
  #autoevaluacion .autoeval-panel{margin:-16px 10px 14px!important;padding:18px 11px!important;border-radius:18px!important}
  #autoevaluacion .autoeval-panel-head{align-items:flex-start!important}
  #autoevaluacion .autoeval-panel-head h2{font-size:18px!important}
  #autoevaluacion .autoeval-panel-head p{font-size:10px!important}
  #autoevaluacion .autoeval-panel-icon{width:44px!important;height:44px!important;flex-basis:44px!important}
  #autoevaluacion .diagnosis-card{padding:14px 12px!important}
  #autoevaluacion .diagnosis-card h3{font-size:12px!important}
  #autoevaluacion .diagnosis-option{font-size:10.5px!important;padding:9px!important}
  #autoevaluacion .result-top{grid-template-columns:1fr!important}
  #autoevaluacion .result-badge{min-height:50px}
  #autoevaluacion .result-stages{grid-template-columns:1fr!important}
  #autoevaluacion .autoeval-panel-footer{align-items:flex-start!important;flex-direction:column!important}
  #autoevaluacion .autoeval-panel-footer .ghost{width:100%!important}
}

/* V64 · Mi punto de partida — limpieza visual y hero proporcional */
#autoevaluacion .autoeval-hero{
  min-height:clamp(300px, 32vw, 470px)!important;
  padding:clamp(30px,4vw,58px) clamp(24px,5vw,72px) clamp(42px,5vw,64px)!important;
  background:
    linear-gradient(90deg,rgba(247,252,255,.97) 0%,rgba(247,252,255,.90) 30%,rgba(247,252,255,.48) 52%,rgba(247,252,255,.08) 72%),
    url("../assets/autoeval-hero-background.png") right center/cover no-repeat!important;
}
#autoevaluacion .autoeval-hero-copy{
  width:min(58%,760px)!important;
  max-width:760px!important;
}
#autoevaluacion .autoeval-kicker,
#autoevaluacion .autoeval-hero-copy .eyebrow{
  font-weight:650!important;
}
#autoevaluacion .autoeval-hero h1{
  font-weight:650!important;
  font-size:clamp(31px,3.6vw,52px)!important;
  letter-spacing:-.035em!important;
  line-height:1.04!important;
}
#autoevaluacion .autoeval-hero p{
  font-weight:450!important;
  font-size:clamp(15px,1.35vw,18px)!important;
  max-width:650px;
}
#autoevaluacion .autoeval-panel-head h2{
  font-weight:620!important;
  font-size:clamp(20px,2vw,27px)!important;
}
#autoevaluacion .autoeval-panel-head p,
#autoevaluacion .sales-checklist .check-item,
#autoevaluacion .autoeval-panel-footer>span{
  font-weight:450!important;
}
#autoevaluacion .sales-checklist .check-item{
  font-size:13px!important;
}
#autoevaluacion .sales-checklist label span{
  font-size:13px!important;
  line-height:1.4!important;
}
#autoevaluacion .sales-checklist label span b{
  font-weight:650!important;
  font-size:11px!important;
}
#autoevaluacion .autoeval-panel-footer .btn{
  font-weight:600!important;
}
/* Eliminamos la ruta inferior: el siguiente paso vive en el resultado */
#autoevaluacion .autoeval-next{display:none!important}

@media (max-width:900px){
  #autoevaluacion .autoeval-hero{
    min-height:390px!important;
    padding:30px 24px 48px!important;
    background:
      linear-gradient(90deg,rgba(247,252,255,.98) 0%,rgba(247,252,255,.88) 46%,rgba(247,252,255,.35) 72%,rgba(247,252,255,.08) 100%),
      url("../assets/autoeval-hero-background.png") 62% center/cover no-repeat!important;
  }
  #autoevaluacion .autoeval-hero-copy{width:62%!important}
}
@media (max-width:640px){
  #autoevaluacion .autoeval-hero{
    min-height:360px!important;
    padding:28px 20px 42px!important;
    background:
      linear-gradient(90deg,rgba(247,252,255,.99) 0%,rgba(247,252,255,.94) 54%,rgba(247,252,255,.60) 78%,rgba(247,252,255,.22) 100%),
      url("../assets/autoeval-hero-background.png") 66% center/auto 100% no-repeat!important;
  }
  #autoevaluacion .autoeval-hero-copy{width:78%!important;max-width:none!important}
  #autoevaluacion .autoeval-hero h1{font-size:31px!important}
  #autoevaluacion .autoeval-hero p{font-size:15px!important}
  #autoevaluacion .autoeval-panel-head h2{font-size:20px!important}
  #autoevaluacion .sales-checklist label span{font-size:12.5px!important}
}

/* =========================================================
   V65 · PULIDO VISUAL · DIAGNÓSTICO + RUTA INTERACTIVA
   ========================================================= */
/* Acercar el diagnóstico al hero para eliminar el vacío visual */
#autoevaluacion .autoeval-panel{
  margin-top:-34px!important;
  padding-top:22px!important;
}
/* Tipografía más cálida y menos pesada */
#autoevaluacion .autoeval-panel-head h2{
  font-weight:600!important;
  letter-spacing:-.018em!important;
}
#autoevaluacion .autoeval-panel-head p{
  font-weight:400!important;
}
#autoevaluacion .diagnosis-card h3{
  font-weight:600!important;
  font-size:13.5px!important;
  letter-spacing:-.006em!important;
  color:#294a70!important;
}
#autoevaluacion .diagnosis-meta b{
  font-weight:600!important;
}
#autoevaluacion .diagnosis-option{
  font-size:12px!important;
  line-height:1.42!important;
  font-weight:400!important;
  color:#4b6684!important;
  padding:10px 11px!important;
}
#autoevaluacion .diagnosis-option .option-letter{
  font-weight:600!important;
}

/* Inicio · ruta: texto más equilibrado + zoom sutil al pasar el mouse */
#inicio.home-page .home-route .route{
  position:relative!important;
  z-index:1!important;
  transition:transform .2s ease,box-shadow .2s ease,filter .2s ease!important;
  transform-origin:center!important;
}
#inicio.home-page .home-route .route:hover{
  transform:scale(1.035)!important;
  z-index:8!important;
  filter:saturate(1.04)!important;
  box-shadow:0 12px 22px rgba(25,71,130,.16)!important;
}
#inicio.home-page .home-route .route strong{
  width:28px!important;height:28px!important;min-width:28px!important;min-height:28px!important;flex-basis:28px!important;
  font-size:11px!important;
}
#inicio.home-page .home-route .route b{
  font-size:11.5px!important;
  font-weight:700!important;
}
#inicio.home-page .home-route .route small{
  font-size:8.5px!important;
  font-weight:400!important;
}

/* Academia OPPO: integrar aún más el visual y reducir discretamente los equipos */
#inicio.home-page .home-oppo-card{
  background-size:74% auto!important;
  background-position:right bottom!important;
}

/* Taller de Ventas · mismo lenguaje de interacción que Inicio */
#taller .compact-route .sales-step{
  transition:transform .2s ease,box-shadow .2s ease,filter .2s ease!important;
  transform-origin:center!important;
  z-index:1!important;
}
#taller .compact-route .sales-step:hover{
  transform:scale(1.035)!important;
  z-index:5!important;
  filter:saturate(1.04)!important;
  box-shadow:0 12px 22px rgba(25,71,130,.16)!important;
}
#taller .sales-step b{
  width:28px!important;height:28px!important;
  font-size:10px!important;
  font-weight:700!important;
}
#taller .sales-step span{
  font-size:11.5px!important;
  font-weight:700!important;
}
#taller .sales-step small{
  font-size:9px!important;
  font-weight:400!important;
}

@media(max-width:820px){
  #autoevaluacion .autoeval-panel{margin-top:-24px!important}
  #autoevaluacion .diagnosis-card h3{font-size:13px!important}
  #autoevaluacion .diagnosis-option{font-size:12px!important}
  #inicio.home-page .home-route .route:hover,#taller .compact-route .sales-step:hover{transform:scale(1.02)!important}
}


/* V66 · Banco de preguntas y frases para conectar */
.connection-bank{display:flex;flex-direction:column;gap:18px}
.connection-title{display:block;font-size:10px;letter-spacing:.12em;font-weight:700;color:#71807a;margin-bottom:10px}
.connection-list{display:grid;gap:7px}
.connection-item{display:grid;grid-template-columns:26px 1fr;gap:9px;align-items:start;padding:8px 9px;border:1px solid #e7eeeb;background:#fbfdfc;border-radius:11px;transition:.18s}
.connection-item:hover{border-color:#a9dfc8;background:#f3fbf7;transform:translateY(-1px)}
.connection-item>span{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#edf8f3;color:#1d9d6a;font-size:9px;font-weight:700}
.connection-item p{margin:1px 0 0;font-size:11.5px;line-height:1.4;color:#586760;font-weight:500}
.phrase-section{border-top:1px solid #e8efec;padding-top:15px}
.phrase-list{display:grid;gap:7px}
.phrase-item{padding:9px 11px;border-radius:10px;background:#f5faf8;border-left:3px solid #42c79a;color:#52635b;font-size:11.5px;line-height:1.42;font-weight:500}
@media (max-width:700px){.connection-item p,.phrase-item{font-size:12px}.connection-bank{gap:15px}.connection-list{gap:6px}}


/* V67 · Sondea: banco breve y cálido */
.sondeo-connection-bank{gap:0}
.sondeo-connection-bank .connection-title{color:#58736b;margin-bottom:9px}
.sondeo-connection-bank .connection-list{gap:8px}
.sondeo-connection-bank .connection-item{grid-template-columns:30px 1fr;padding:10px 11px;border-color:#e6efeb;background:#fcfefd;border-radius:12px}
.sondeo-connection-bank .connection-item>span{width:28px;height:28px;font-size:9.5px;font-weight:600;background:#eef8f4;color:#249c73}
.sondeo-connection-bank .connection-item p{font-size:12.5px;line-height:1.48;color:#596963;font-weight:400;margin:2px 0 0}
.sondeo-connection-bank .connection-item:hover{background:#f6fbf8;border-color:#b9dfce;transform:translateY(-1px)}
@media(max-width:700px){
 .sondeo-connection-bank .connection-item p{font-size:12.5px}
 .sondeo-connection-bank .connection-item{padding:9px 10px}
}

/* V67+ · OFRECE: banco breve de frases comerciales */
.ofrece-connection-bank{gap:0!important}
.ofrece-connection-bank .connection-title{color:#557067;margin-bottom:9px}
.ofrece-connection-bank .connection-list{gap:8px}
.ofrece-connection-bank .connection-item{grid-template-columns:30px 1fr;padding:10px 11px;border-color:#e6efeb;background:#fcfefd;border-radius:12px}
.ofrece-connection-bank .connection-item>span{width:28px;height:28px;font-size:9.5px;font-weight:600;background:#eef8f4;color:#249c73}
.ofrece-connection-bank .connection-item p{font-size:12.5px;line-height:1.46;color:#596963;font-weight:400;margin:2px 0 0}
.ofrece-connection-bank .connection-item:hover{background:#f6fbf8;border-color:#b9dfce;transform:translateY(-1px)}
@media(max-width:700px){.ofrece-connection-bank .connection-item p{font-size:12px}}

/* V69 · OFRECE: escenarios desplegables y copia rápida */
.ofrece-connection-bank{display:flex;flex-direction:column;gap:18px}
.offer-scenarios{border-top:1px solid rgba(0,47,255,.10);padding-top:16px}
.offer-scenarios-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:10px}
.offer-scenarios-head small{display:block;margin-top:5px;color:#64748b;font-size:.82rem;font-weight:500}
.offer-scenario-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.offer-scenario{border:1px solid rgba(0,47,255,.10);border-radius:14px;background:#fff;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.offer-scenario:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(20,40,80,.08);border-color:rgba(0,47,255,.22)}
.offer-scenario-toggle{width:100%;border:0;background:transparent;display:grid;grid-template-columns:34px 1fr 24px;gap:9px;align-items:center;text-align:left;padding:11px 12px;cursor:pointer;color:#24324a;font:inherit}
.offer-scenario-toggle>span:nth-child(2){font-size:.92rem;font-weight:600}
.offer-scenario-toggle>b{font-size:1.05rem;font-weight:500;color:#002eff;text-align:center;transition:transform .18s ease}
.offer-scenario.open .offer-scenario-toggle>b{transform:rotate(45deg)}
.offer-scenario-num{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#f1f5ff;color:#002eff;font-size:.72rem;font-weight:700}
.offer-scenario-body{display:none;padding:0 13px 13px;border-top:1px solid rgba(0,47,255,.08);background:#fbfcff}
.offer-scenario.open .offer-scenario-body{display:block}
.offer-scenario-body>div{padding-top:11px}
.offer-scenario-body small{font-size:.68rem;letter-spacing:.06em;color:#64748b;font-weight:700}
.offer-scenario-body p{margin:5px 0 0;color:#334155;font-size:.88rem;line-height:1.48;font-weight:500}
.copy-offer-btn{margin-top:12px;border:1px solid #002eff;background:#fff;color:#002eff;border-radius:9px;padding:7px 11px;font:inherit;font-size:.78rem;font-weight:600;cursor:pointer}
.copy-offer-btn:hover{background:#eef2ff}
@media(max-width:800px){
 .offer-scenario-list{grid-template-columns:1fr}
 .offer-scenarios-head{align-items:flex-start}
 .offer-scenario-toggle{padding:10px}
}

/* V70 · OFRECE: composición proporcional + imagen por escenario */
@media (min-width:821px){
  #taller .sales-module-grid{grid-template-columns:.78fr 1.22fr}
  #taller .ofrece-connection-bank{display:grid;grid-template-columns:minmax(230px,.72fr) minmax(0,1.55fr);gap:18px;align-items:start}
  #taller .ofrece-connection-bank .connection-section{min-width:0}
  #taller .ofrece-connection-bank .offer-scenarios{border-top:0;border-left:1px solid #e7edf5;padding:0 0 0 18px}
  #taller .ofrece-connection-bank .offer-scenario-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
}
#taller .offer-scenario-toggle{grid-template-columns:30px 38px minmax(0,1fr) 22px;gap:7px;padding:9px 9px}
#taller .offer-scenario-icon{width:38px;height:38px;display:block;object-fit:contain}
#taller .offer-scenario-toggle>span:nth-child(3){font-size:.78rem;line-height:1.18;font-weight:650}
#taller .offer-scenario-num{width:26px;height:26px;font-size:.66rem}
#taller .offer-scenario-body{padding:0 10px 10px}
#taller .offer-scenario-body>div{padding-top:8px}
#taller .offer-scenario-body p{font-size:.78rem;line-height:1.38}
#taller .copy-offer-btn{margin-top:9px;padding:6px 9px;font-size:.72rem}
@media(max-width:1100px) and (min-width:821px){
  #taller .ofrece-connection-bank{grid-template-columns:minmax(205px,.68fr) minmax(0,1.6fr)}
  #taller .ofrece-connection-bank .offer-scenario-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:820px){
  #taller .sales-module-grid{grid-template-columns:1fr}
  #taller .ofrece-connection-bank{display:flex;gap:15px}
  #taller .ofrece-connection-bank .offer-scenario-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  #taller .ofrece-connection-bank .offer-scenarios{border-top:1px solid rgba(0,47,255,.10);border-left:0;padding:14px 0 0}
}
@media(max-width:560px){
  #taller .ofrece-connection-bank .offer-scenario-list{grid-template-columns:1fr}
  #taller .offer-scenario-toggle{grid-template-columns:28px 36px minmax(0,1fr) 20px}
  #taller .offer-scenario-icon{width:36px;height:36px}
}


/* V71 · Ruta comercial: diseño tipo tarjeta premium + robustez frente a zoom */
#taller .compact-route{
  margin:0 28px 14px!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
  align-items:stretch!important;
}
#taller .compact-route .sales-step{
  min-width:0!important;
  width:100%!important;
  min-height:88px!important;
  height:auto!important;
  box-sizing:border-box!important;
  padding:14px 54px 12px 16px!important;
  border:0!important;
  border-radius:15px!important;
  position:relative!important;
  overflow:hidden!important;
  color:#fff!important;
  text-align:left!important;
  display:block!important;
}
#taller .compact-route .sales-step:nth-child(1){background:linear-gradient(135deg,#10bfb8,#1fc9c1)!important}
#taller .compact-route .sales-step:nth-child(2){background:linear-gradient(135deg,#2c78e8,#3f8bf0)!important}
#taller .compact-route .sales-step:nth-child(3){background:linear-gradient(135deg,#ff812f,#ff9a45)!important}
#taller .compact-route .sales-step:nth-child(4){background:linear-gradient(135deg,#7650e9,#8d5bed)!important}
#taller .compact-route .sales-step:hover,
#taller .compact-route .sales-step.active{
  transform:translateY(-2px)!important;
  filter:saturate(1.04)!important;
  box-shadow:0 10px 22px rgba(30,55,100,.13)!important;
}
#taller .compact-route .sales-step>b{
  display:inline-flex!important;
  width:32px!important;height:32px!important;min-width:32px!important;
  margin:0 8px 0 0!important;
  border-radius:50%!important;
  align-items:center!important;justify-content:center!important;
  vertical-align:middle!important;
  background:rgba(255,255,255,.96)!important;
  color:#24405d!important;
  box-shadow:0 2px 5px rgba(20,45,70,.10)!important;
  font-size:11px!important;font-weight:800!important;
}
#taller .compact-route .sales-step>span{
  display:inline!important;
  vertical-align:middle!important;
  font-size:clamp(11px,1.05vw,15px)!important;
  line-height:1.05!important;
  font-weight:800!important;
  letter-spacing:.015em!important;
  white-space:nowrap!important;
}
#taller .compact-route .sales-step>small{
  display:block!important;
  margin:7px 0 0 40px!important;
  color:rgba(255,255,255,.94)!important;
  font-size:clamp(8px,.68vw,10.5px)!important;
  line-height:1.25!important;
  font-weight:500!important;
  white-space:normal!important;
  max-width:100%!important;
}
#taller .compact-route .sales-step-icon{
  position:absolute!important;
  right:17px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:34px!important;height:34px!important;
  display:grid!important;place-items:center!important;
  color:#fff!important;
  font-style:normal!important;
}
#taller .compact-route .sales-step-icon svg{
  width:34px!important;height:34px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  opacity:.98!important;
}

/* El contenido del taller se adapta por ancho disponible, no por tamaños rígidos. */
#taller .sales-module-grid{grid-template-columns:minmax(220px,.82fr) minmax(0,1.18fr)!important}
#taller .sales-module-grid>*{min-width:0!important}
#taller .ofrece-connection-bank{min-width:0!important}
#taller .ofrece-connection-bank .connection-section,
#taller .ofrece-connection-bank .offer-scenarios{min-width:0!important}
#taller .ofrece-connection-bank .connection-list{min-width:0!important}
#taller .ofrece-connection-bank .connection-item{min-width:0!important}
#taller .ofrece-connection-bank .connection-item p{overflow-wrap:anywhere!important}
#taller .ofrece-connection-bank .offer-scenario-list{grid-template-columns:repeat(2,minmax(0,1fr))!important}
#taller .offer-scenario-toggle{min-width:0!important}
#taller .offer-scenario-toggle>span:nth-child(3){min-width:0!important;overflow-wrap:anywhere!important}

/* A 90%/80% de zoom no se compacta de forma agresiva: conserva aire y jerarquía. */
@media(min-width:1180px){
  #taller .ofrece-connection-bank{grid-template-columns:minmax(250px,.78fr) minmax(0,1.22fr)!important;gap:18px!important}
}
@media(max-width:1180px) and (min-width:901px){
  #taller .compact-route{gap:8px!important;margin-left:18px!important;margin-right:18px!important}
  #taller .compact-route .sales-step{padding-left:12px!important;padding-right:46px!important}
  #taller .compact-route .sales-step-icon{right:11px!important;width:29px!important;height:29px!important}
  #taller .compact-route .sales-step-icon svg{width:29px!important;height:29px!important}
  #taller .compact-route .sales-step>b{width:29px!important;height:29px!important;min-width:29px!important;font-size:10px!important;margin-right:6px!important}
  #taller .compact-route .sales-step>span{font-size:clamp(10px,1.05vw,13px)!important}
  #taller .compact-route .sales-step>small{margin-left:35px!important;font-size:9px!important}
  #taller .sales-module-grid{grid-template-columns:minmax(190px,.72fr) minmax(0,1.28fr)!important}
  #taller .ofrece-connection-bank{grid-template-columns:minmax(205px,.68fr) minmax(0,1.32fr)!important;gap:14px!important}
}
@media(max-width:900px){
  #taller .compact-route{grid-template-columns:repeat(2,minmax(0,1fr))!important;margin-left:14px!important;margin-right:14px!important}
  #taller .sales-module-grid{grid-template-columns:1fr!important}
  #taller .ofrece-connection-bank{display:flex!important;gap:15px!important}
  #taller .ofrece-connection-bank .offer-scenarios{border-top:1px solid rgba(0,47,255,.10)!important;border-left:0!important;padding:14px 0 0!important}
}
@media(max-width:560px){
  #taller .compact-route{grid-template-columns:1fr!important;gap:8px!important}
  #taller .compact-route .sales-step{min-height:76px!important;padding:11px 48px 10px 13px!important}
  #taller .compact-route .sales-step-icon{right:10px!important}
  #taller .ofrece-connection-bank .offer-scenario-list{grid-template-columns:1fr!important}
}

/* V72 · OFRECE + CIERRA · composición compacta y lectura uniforme */
@media (min-width:901px){
  #taller .sales-module-grid:not(.cierre-grid){
    grid-template-columns:minmax(260px,.62fr) minmax(0,1.38fr)!important;
    gap:12px!important;
  }
  #taller .ofrece-connection-bank{
    grid-template-columns:minmax(245px,.48fr) minmax(0,1.52fr)!important;
    gap:12px!important;
  }
  #taller .ofrece-connection-bank .offer-scenarios{
    padding-left:12px!important;
  }
  #taller .ofrece-connection-bank .offer-scenario-list{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
  }
}
@media (min-width:901px) and (max-width:1180px){
  #taller .sales-module-grid:not(.cierre-grid){
    grid-template-columns:minmax(235px,.60fr) minmax(0,1.40fr)!important;
    gap:10px!important;
  }
  #taller .ofrece-connection-bank{
    grid-template-columns:minmax(220px,.45fr) minmax(0,1.55fr)!important;
    gap:10px!important;
  }
  #taller .ofrece-connection-bank .offer-scenario-list{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

/* Cierre: cuatro tipos en columna + speech visible al seleccionar */
#taller .cierre-grid{display:block!important}
#taller .cierre-grid .module-actions{max-width:none!important}
#taller .closing-layout{
  display:grid;
  grid-template-columns:minmax(220px,.38fr) minmax(0,1.62fr);
  gap:16px;
  align-items:stretch;
}
#taller .close-inline{
  display:flex!important;
  flex-direction:column!important;
  gap:8px!important;
}
#taller .close-inline .closing-type{
  width:100%!important;
  min-height:66px!important;
  padding:11px 13px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  text-align:left!important;
  border-radius:12px!important;
}
#taller .close-inline .closing-type b{font-size:13px!important;line-height:1.2!important}
#taller .close-inline .closing-type span{font-size:11px!important;line-height:1.35!important;margin-top:4px!important;color:#68768b!important}
#taller .detail-callout{
  margin:0!important;
  min-height:100%!important;
  padding:18px 20px!important;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
#taller .detail-callout .closing-speech-label{
  font-size:10px;
  letter-spacing:.12em;
  font-weight:800;
  color:#58736b;
  margin-bottom:7px;
}
#taller .detail-callout>b{font-size:16px;color:#25364d}
#taller .detail-callout>span{font-size:12px;color:#68768b;margin-top:4px}
#taller .detail-callout blockquote{margin-top:14px!important;font-size:14px!important;line-height:1.55!important}
@media(max-width:900px){
  #taller .closing-layout{grid-template-columns:1fr;gap:12px}
  #taller .close-inline{display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important}
}
@media(max-width:560px){
  #taller .close-inline{grid-template-columns:1fr!important}
}

/* V72 · ajuste fino de lectura */
@media (min-width:901px){
  #taller .module-actions{padding:20px 18px!important}
  #taller .ofrece-connection-bank .phrase-item{font-size:12.2px!important;line-height:1.46!important;padding:9px 10px!important}
  #taller .ofrece-connection-bank .connection-title{font-size:10px!important;letter-spacing:.08em!important}
}

/* V73 · CIERRE: selector abajo, tarjetas visuales e iconos */
#taller .cierre-grid .closing-selector{
  margin-top:22px!important;
  border-top:1px solid #E5EBF2!important;
  background:linear-gradient(180deg,#FBFCFF 0%,#F8FAFD 100%)!important;
  border-radius:16px!important;
  padding:20px 22px 22px!important;
}
#taller .cierre-grid .closing-selector-head{margin-bottom:16px!important}
#taller .cierre-grid .closing-selector-head h3{font-size:17px!important;line-height:1.25!important}
#taller .cierre-grid .closing-layout{grid-template-columns:minmax(210px,.42fr) minmax(0,1.58fr)!important;gap:14px!important}
#taller .cierre-grid .close-inline{gap:9px!important}
#taller .cierre-grid .close-inline .closing-type{
  min-height:70px!important;
  flex-direction:row!important;
  align-items:center!important;
  gap:11px!important;
  padding:10px 12px!important;
  border-radius:13px!important;
  position:relative!important;
  overflow:hidden!important;
  box-shadow:none!important;
}
#taller .cierre-grid .closing-type::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#B8C5D6}
#taller .cierre-grid .closing-type-icon{
  width:34px!important;height:34px!important;min-width:34px!important;border-radius:10px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  font-size:17px!important;font-weight:900!important;background:#EEF2F7!important;color:#42536B!important;
}
#taller .cierre-grid .closing-type-copy{display:flex!important;flex-direction:column!important;min-width:0!important}
#taller .cierre-grid .closing-type-copy b{font-size:12.5px!important;line-height:1.2!important}
#taller .cierre-grid .closing-type-copy em{font-style:normal!important;font-size:10.5px!important;line-height:1.35!important;margin-top:4px!important;color:#68768B!important}
#taller .cierre-grid .closing-type.close-directo{background:#F0FBF7!important;border-color:#B9E8D5!important}
#taller .cierre-grid .closing-type.close-directo::before{background:#16A879}
#taller .cierre-grid .closing-type.close-directo .closing-type-icon{background:#D8F5E8!important;color:#11855F!important}
#taller .cierre-grid .closing-type.close-eleccion{background:#F1F6FF!important;border-color:#C7D9FA!important}
#taller .cierre-grid .closing-type.close-eleccion::before{background:#3C78D8}
#taller .cierre-grid .closing-type.close-eleccion .closing-type-icon{background:#DDE9FF!important;color:#2E65C1!important}
#taller .cierre-grid .closing-type.close-necesidad{background:#FFF7EF!important;border-color:#F2D8B8!important}
#taller .cierre-grid .closing-type.close-necesidad::before{background:#E58B2A}
#taller .cierre-grid .closing-type.close-necesidad .closing-type-icon{background:#FFE9CF!important;color:#C96E0E!important}
#taller .cierre-grid .closing-type.close-accion{background:#F5F1FF!important;border-color:#D8CDF9!important}
#taller .cierre-grid .closing-type.close-accion::before{background:#7657F5}
#taller .cierre-grid .closing-type.close-accion .closing-type-icon{background:#E9E1FF!important;color:#6747E5!important}
#taller .cierre-grid .closing-type:hover{transform:translateY(-1px)!important;box-shadow:0 5px 14px rgba(39,58,88,.06)!important}
#taller .cierre-grid .closing-type.selected{box-shadow:0 7px 18px rgba(39,58,88,.09)!important}
#taller .cierre-grid .closing-type.selected.close-directo{border-color:#16A879!important}
#taller .cierre-grid .closing-type.selected.close-eleccion{border-color:#3C78D8!important}
#taller .cierre-grid .closing-type.selected.close-necesidad{border-color:#E58B2A!important}
#taller .cierre-grid .closing-type.selected.close-accion{border-color:#7657F5!important}
#taller .cierre-grid .detail-callout{border-radius:14px!important;border:1px solid #E2E8F0!important;background:#fff!important}
@media(max-width:900px){
  #taller .cierre-grid .closing-layout{grid-template-columns:1fr!important}
}

/* V75 · OFRECE: estructura corregida — acciones + frases arriba / escenarios abajo */
#taller .ofrece-grid{
  grid-template-columns:minmax(220px,.78fr) minmax(0,1.22fr)!important;
  gap:18px!important;
  align-items:start!important;
}
#taller .ofrece-grid .module-script{display:contents!important}
#taller .ofrece-grid .ofrece-top-bank{
  grid-column:2!important;
  min-width:0!important;
}
#taller .ofrece-grid .ofrece-scenarios-bottom{
  grid-column:1 / -1!important;
  min-width:0!important;
  margin-top:2px!important;
  padding:18px 18px 20px!important;
  border:1px solid #DCE7F1!important;
  border-radius:18px!important;
  background:
    radial-gradient(circle at 94% 12%,rgba(72,120,255,.10) 0,rgba(72,120,255,0) 20%),
    radial-gradient(circle at 8% 92%,rgba(28,186,145,.10) 0,rgba(28,186,145,0) 22%),
    linear-gradient(135deg,#F8FCFB 0%,#F7F9FF 52%,#FCF9FF 100%)!important;
  position:relative!important;
  overflow:hidden!important;
}
#taller .ofrece-scenarios-bottom::after{
  content:"✦";
  position:absolute;
  right:20px;
  top:9px;
  font-size:34px;
  line-height:1;
  color:rgba(55,105,230,.10);
  pointer-events:none;
}
#taller .ofrece-scenarios-bottom .offer-scenarios-head{
  margin-bottom:13px!important;
  position:relative!important;
  z-index:1!important;
}
#taller .ofrece-scenarios-bottom .offer-scenarios-head small{
  max-width:720px!important;
  line-height:1.45!important;
}
#taller .ofrece-scenarios-bottom .connection-title{
  color:#506A82!important;
  margin-bottom:4px!important;
}
#taller .ofrece-scenarios-bottom .offer-scenario-list{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:9px!important;
  position:relative!important;
  z-index:1!important;
}
#taller .ofrece-scenarios-bottom .offer-scenario{
  border:1px solid #D7E3EE!important;
  border-radius:13px!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 3px 12px rgba(43,68,96,.045)!important;
}
#taller .ofrece-scenarios-bottom .offer-scenario:hover{
  border-color:#B9CDE1!important;
  box-shadow:0 7px 18px rgba(43,68,96,.09)!important;
}
#taller .ofrece-scenarios-bottom .offer-scenario-toggle{
  grid-template-columns:27px 34px minmax(0,1fr) 18px!important;
  gap:7px!important;
  min-height:62px!important;
  padding:8px 9px!important;
}
#taller .ofrece-scenarios-bottom .offer-scenario-num{
  width:26px!important;
  height:26px!important;
  background:#EEF3FF!important;
  color:#315DDC!important;
}
#taller .ofrece-scenarios-bottom .offer-scenario-icon{
  width:34px!important;
  height:34px!important;
  padding:6px!important;
  border-radius:9px!important;
  background:#ECF8F3!important;
}
#taller .ofrece-scenarios-bottom .offer-scenario-toggle>span:nth-child(3){
  font-size:.78rem!important;
  line-height:1.18!important;
  font-weight:700!important;
  color:#2D4157!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
#taller .ofrece-scenarios-bottom .offer-scenario-toggle>b{color:#315DDC!important}
#taller .ofrece-scenarios-bottom .offer-scenario-body{
  padding:0 10px 10px!important;
  background:rgba(249,251,255,.96)!important;
  border-top:1px solid #E3EAF2!important;
}
#taller .ofrece-scenarios-bottom .offer-scenario-body p{
  font-size:.75rem!important;
  line-height:1.4!important;
  color:#40536A!important;
}
#taller .ofrece-scenarios-bottom .offer-scenario-body small{font-size:.64rem!important}
#taller .ofrece-scenarios-bottom .copy-offer-btn{
  background:#fff!important;
  border-color:#315DDC!important;
  color:#315DDC!important;
}
#taller .ofrece-scenarios-bottom .copy-offer-btn:hover{background:#EEF3FF!important}
#taller .ofrece-top-bank .connection-section{
  min-width:0!important;
  padding:2px 0 0!important;
}
#taller .ofrece-top-bank .connection-title{
  color:#557067!important;
  margin-bottom:9px!important;
}
#taller .ofrece-top-bank .connection-list{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
}
#taller .ofrece-top-bank .connection-item{
  min-width:0!important;
  grid-template-columns:29px minmax(0,1fr)!important;
  padding:9px 10px!important;
  border:1px solid #E0ECE7!important;
  border-radius:12px!important;
  background:linear-gradient(135deg,#FCFEFD,#F8FCFA)!important;
}
#taller .ofrece-top-bank .connection-item>span{
  width:27px!important;
  height:27px!important;
  background:#EAF7F1!important;
  color:#15936B!important;
  font-size:9px!important;
}
#taller .ofrece-top-bank .connection-item p{
  margin:1px 0 0!important;
  font-size:12px!important;
  line-height:1.42!important;
  color:#56686A!important;
  font-weight:400!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
#taller .ofrece-top-bank .connection-item:hover{
  background:#F4FBF7!important;
  border-color:#B9DFCE!important;
  transform:translateY(-1px)!important;
}
@media(max-width:1180px) and (min-width:901px){
  #taller .ofrece-grid{grid-template-columns:minmax(210px,.72fr) minmax(0,1.28fr)!important;gap:14px!important}
  #taller .ofrece-scenarios-bottom .offer-scenario-list{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:900px){
  #taller .ofrece-grid{grid-template-columns:1fr!important;gap:14px!important}
  #taller .ofrece-grid .module-script{display:contents!important}
  #taller .ofrece-grid .ofrece-top-bank{grid-column:1!important}
  #taller .ofrece-grid .ofrece-scenarios-bottom{grid-column:1!important;margin-top:0!important}
  #taller .ofrece-scenarios-bottom .offer-scenario-list{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:560px){
  #taller .ofrece-top-bank .connection-list{grid-template-columns:1fr!important}
  #taller .ofrece-scenarios-bottom{padding:15px 12px 16px!important}
  #taller .ofrece-scenarios-bottom .offer-scenario-list{grid-template-columns:1fr!important}
}

/* V76 · FICHA MAESTRA A6 PRO 5G · LÁMINAS EN CARRUSEL */
#modal .modal-box:has(.master-carousel){
  width:min(1120px,94vw)!important;
  max-height:94vh!important;
}
#modal:has(.master-carousel) .modal-head{
  padding:18px 24px!important;
  background:linear-gradient(90deg,#f7f9ff,#fff)!important;
}
#modal:has(.master-carousel) .modal-head h2{font-size:22px!important}
#modal:has(.master-carousel) #modalBody{padding:14px 18px 20px!important}
.master-carousel{position:relative;width:100%;padding:0 38px 14px;box-sizing:border-box;background:linear-gradient(135deg,#f7fbff 0%,#fff7fa 100%);border:1px solid #e4ebf5;border-radius:20px;overflow:hidden}
.master-carousel-top{display:flex;justify-content:space-between;align-items:center;padding:12px 4px 10px;gap:12px}
.master-carousel-label{font-size:10px;font-weight:900;letter-spacing:.12em;color:#167b57}
.master-carousel-counter{font-size:11px;font-weight:800;color:#5e6f86;background:#fff;border:1px solid #e2e9f2;border-radius:999px;padding:5px 9px}
.master-slide{display:none;min-width:0}
.master-slide.active{display:block}
.master-slide img{display:block;width:100%;height:auto;max-height:70vh;object-fit:contain;object-position:center;border-radius:12px;background:#fff;box-shadow:0 10px 28px rgba(20,45,80,.10)}
.master-caption{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 4px 2px;color:#4e6075}
.master-caption strong{font-size:12px;color:#17345e;letter-spacing:.05em}
.master-caption span{font-size:11px;line-height:1.4;text-align:right}
.master-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:42px;height:42px;border:0;border-radius:50%;background:#fff;color:#17345e;box-shadow:0 8px 24px rgba(17,48,87,.18);font-size:32px;line-height:1;cursor:pointer;display:grid;place-items:center;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
.master-arrow:hover{transform:translateY(-50%) scale(1.07);box-shadow:0 12px 30px rgba(17,48,87,.24);background:#f4f9ff}
.master-prev{left:10px}.master-next{right:10px}
.master-dots{display:flex;justify-content:center;gap:7px;padding-top:10px}
.master-dots button{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:#c9d4e2;cursor:pointer;transition:all .18s ease}
.master-dots button.active{width:24px;border-radius:99px;background:#1d9d6a}
@media(max-width:760px){
 #modal .modal-box:has(.master-carousel){width:96vw!important;max-height:94vh!important}
 #modal:has(.master-carousel) #modalBody{padding:8px 10px 14px!important}
 .master-carousel{padding:0 32px 12px;border-radius:16px}
 .master-slide img{max-height:67vh;border-radius:9px}
 .master-caption{display:block;padding-top:8px}.master-caption span{display:block;text-align:left;margin-top:3px}
 .master-arrow{width:36px;height:36px;font-size:27px}.master-prev{left:7px}.master-next{right:7px}
}


/* V77 · PORTAFOLIO · FICHA MAESTRA MÁS GRANDE + FLECHAS BOREALES + RENO16 CENTRADO */
#modal:has(.master-carousel) .modal-head{padding:14px 22px!important}
#modal:has(.master-carousel) #modalBody{padding:8px 10px 12px!important}
.master-carousel{padding:0 46px 8px!important;border-radius:20px!important}
.master-carousel-top{justify-content:flex-end!important;padding:5px 0 7px!important;min-height:22px!important}
.master-carousel-label{display:none!important}
.master-slide img{max-height:76vh!important;border-radius:12px!important;box-shadow:0 10px 28px rgba(20,45,80,.10)!important}
.master-caption{padding:7px 2px 0!important}
.master-caption strong{font-size:11px!important}
.master-caption span{font-size:10px!important}
.master-arrow{width:50px!important;height:50px!important;background:linear-gradient(145deg,#25c8b4,#159f8e)!important;color:#fff!important;border:2px solid rgba(255,255,255,.9)!important;box-shadow:0 8px 22px rgba(18,157,143,.34)!important;font-weight:500!important}
.master-arrow:hover{background:linear-gradient(145deg,#35d8c4,#12a28f)!important;box-shadow:0 12px 28px rgba(18,157,143,.42)!important}
.master-prev{left:8px!important}.master-next{right:8px!important}
.master-dots{padding-top:6px!important}
.master-dots button.active{background:#18ad99!important}
@media(max-width:760px){
 #modal:has(.master-carousel) #modalBody{padding:5px 7px 10px!important}
 .master-carousel{padding:0 36px 7px!important}
 .master-carousel-top{padding:2px 0 5px!important}
 .master-slide img{max-height:73vh!important}
 .master-arrow{width:40px!important;height:40px!important;font-size:26px!important}
 .master-prev{left:4px!important}.master-next{right:4px!important}
}

/* Reno16: el video baja ligeramente y se centra verticalmente dentro de su zona */
#portafolio .portfolio-hero-showcase .portfolio-video-banner{
  align-self:center!important;
  transform:translateY(12px)!important;
}
@media(max-width:760px){
  #portafolio .portfolio-hero-showcase .portfolio-video-banner{transform:translateY(7px)!important}
}

/* V78 · PORTAFOLIO · LÁMINAS POR MODELO + COPIAR IMAGEN */
#modal .modal-box:has(.master-carousel-v78){
  width:min(1320px,97vw)!important;
  max-height:96vh!important;
  padding:0!important;
}
#modal:has(.master-carousel-v78) .modal-head{
  padding:10px 20px!important;
  min-height:52px!important;
  background:#fff!important;
  border-bottom:1px solid #edf2f6!important;
}
#modal:has(.master-carousel-v78) .modal-head h2{
  font-size:21px!important;
  line-height:1.1!important;
}
#modal:has(.master-carousel-v78) #modalBody{padding:6px 10px 12px!important}
.master-carousel-v78{
  padding:0 48px 10px!important;
  background:linear-gradient(135deg,#f5fcfb 0%,#f7fbff 52%,#fff8fc 100%)!important;
  border:1px solid #dfeaf0!important;
  border-radius:18px!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.75)!important;
}
.master-carousel-v78 .master-carousel-top{
  justify-content:flex-end!important;
  padding:3px 0 5px!important;
  min-height:18px!important;
}
.master-carousel-v78 .master-carousel-counter{
  font-size:10px!important;
  padding:4px 8px!important;
  background:rgba(255,255,255,.88)!important;
}
.master-carousel-v78 .master-slides-stage{width:100%;display:block}
.master-carousel-v78 .master-slide{display:none!important;margin:0!important;padding:0!important}
.master-carousel-v78 .master-slide.active{display:block!important}
.master-carousel-v78 .master-slide img{
  width:100%!important;
  height:auto!important;
  max-height:calc(96vh - 112px)!important;
  object-fit:contain!important;
  object-position:center!important;
  display:block!important;
  margin:0 auto!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:0 8px 24px rgba(24,53,79,.10)!important;
}
.master-carousel-v78 .master-arrow{
  width:54px!important;
  height:54px!important;
  background:linear-gradient(145deg,#2bcbb8,#159b91)!important;
  color:#fff!important;
  border:2px solid rgba(255,255,255,.96)!important;
  box-shadow:0 9px 24px rgba(20,161,145,.34)!important;
  font-size:34px!important;
}
.master-carousel-v78 .master-arrow:hover{
  background:linear-gradient(145deg,#3ed9c8,#12a38f)!important;
  transform:translateY(-50%) scale(1.08)!important;
}
.master-carousel-v78 .master-prev{left:7px!important}.master-carousel-v78 .master-next{right:7px!important}
.master-carousel-v78 .master-dots{padding:6px 0 3px!important}
.master-carousel-v78 .master-dots button.active{background:#18ad99!important}
.master-copy-row{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
  padding:7px 0 0!important;
  flex-wrap:wrap!important;
}
.master-copy-btn{
  appearance:none!important;
  border:0!important;
  border-radius:14px!important;
  padding:11px 20px!important;
  min-width:170px!important;
  background:linear-gradient(135deg,#8de7ef,#45cfd3)!important;
  color:#0d4f63!important;
  font-size:13px!important;
  font-weight:850!important;
  letter-spacing:.01em!important;
  cursor:pointer!important;
  box-shadow:0 7px 18px rgba(47,181,190,.24)!important;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease!important;
}
.master-copy-btn:hover{transform:translateY(-2px)!important;box-shadow:0 10px 24px rgba(47,181,190,.32)!important;filter:saturate(1.08)!important}
.master-copy-btn.is-copied{background:linear-gradient(135deg,#75e0c2,#28b79a)!important;color:#fff!important}
.master-copy-row span{font-size:11px!important;color:#64778b!important}
@media(max-width:760px){
  #modal .modal-box:has(.master-carousel-v78){width:97vw!important;max-height:95vh!important}
  #modal:has(.master-carousel-v78) .modal-head{padding:8px 14px!important;min-height:46px!important}
  #modal:has(.master-carousel-v78) .modal-head h2{font-size:18px!important}
  #modal:has(.master-carousel-v78) #modalBody{padding:4px 5px 9px!important}
  .master-carousel-v78{padding:0 34px 8px!important;border-radius:14px!important}
  .master-carousel-v78 .master-slide img{max-height:calc(95vh - 105px)!important;border-radius:9px!important}
  .master-carousel-v78 .master-arrow{width:42px!important;height:42px!important;font-size:27px!important}
  .master-carousel-v78 .master-prev{left:3px!important}.master-carousel-v78 .master-next{right:3px!important}
  .master-copy-row{gap:7px!important}
  .master-copy-row span{font-size:10px!important;text-align:center!important;width:100%!important}
}

/* V79 · Pulido de navegación, selector y ficha maestra */
.app{min-height:100vh!important;align-items:stretch!important}
.sidebar{min-height:100vh!important;height:100vh!important;align-self:stretch!important;position:sticky!important;display:flex!important;flex-direction:column!important}
.sidebar .nav{flex:0 0 auto!important}
.sidebar-credit{position:absolute;left:14px;bottom:12px;z-index:25;color:rgba(255,255,255,.62);font-size:9px;line-height:1.25;letter-spacing:.02em;max-width:150px}
.sidebar-credit strong{display:block;color:rgba(255,255,255,.92);font-size:10px;font-weight:700;margin-top:2px}

/* La Ficha Maestra debe ser visible pero no protagonista frente al contenido */
#portafolio .model-store .btn.primary{padding:7px 11px!important;min-height:31px!important;font-size:10px!important;line-height:1!important;border-radius:9px!important;font-weight:700!important;box-shadow:none!important}
#portafolio .model-store .btn.primary:hover{transform:translateY(-1px)!important;box-shadow:0 5px 12px rgba(16,42,86,.10)!important}

/* Comparador · selectores con lenguaje visual de la plataforma */
#comparador .smart-picker-compact{position:relative!important;overflow:visible!important}
#comparador .smart-picker-fields{gap:12px!important}
#comparador .smart-picker-fields label{position:relative!important;display:block!important}
#comparador .smart-picker-fields label:after{content:'⌄';position:absolute;right:12px;bottom:9px;color:#159e91;font-size:16px;font-weight:800;pointer-events:none;line-height:1}
#comparador .smart-picker-fields select{appearance:none!important;-webkit-appearance:none!important;padding:11px 36px 11px 12px!important;border:1px solid #cfe4e4!important;border-radius:13px!important;background:linear-gradient(180deg,#ffffff 0%,#f5fbfb 100%)!important;box-shadow:0 5px 14px rgba(21,157,145,.06)!important;font-size:12px!important;font-weight:700!important;color:#20314e!important;cursor:pointer!important;transition:.18s ease!important}
#comparador .smart-picker-fields select:hover{border-color:#76cfc6!important;box-shadow:0 7px 18px rgba(21,157,145,.10)!important}
#comparador .smart-picker-fields select:focus{border-color:#3bc7bd!important;box-shadow:0 0 0 3px rgba(59,199,189,.14)!important}
#comparador .smart-picker-caption>span{background:linear-gradient(135deg,#dff9f5,#e9f3ff)!important;color:#159e91!important;border:1px solid #cce9e5!important}

/* Equipo de referencia · visual genérico, sin etiqueta redundante */
#comparador .smart-device-stage{height:142px!important;background:linear-gradient(135deg,#eef8fb 0%,#f7fbff 52%,#f1efff 100%)!important;border:1px solid rgba(90,130,170,.10)!important}
#comparador .smart-device-stage .device-back{filter:drop-shadow(0 12px 12px rgba(27,60,90,.18))!important}
#comparador .smart-device-stage.generic-device .device-brand-mark{display:none!important}
#comparador .smart-device-stage.generic-device .device-back:after{content:'';position:absolute;width:8px;height:8px;border-radius:50%;background:#26384f;top:17px;right:16px;box-shadow:0 14px 0 #26384f,0 28px 0 #26384f;opacity:.9}
#comparador .smart-device-stage.actual-device img{height:124px!important;width:155px!important}
#comparador .smart-device-stage small{display:none!important}

@media(max-width:820px){
 .sidebar-credit{display:none!important}
 #portafolio .model-store .btn.primary{font-size:10px!important;padding:7px 10px!important}
}


/* =========================================================
   V81 · AJUSTES FINOS · SIDEBAR + LABORATORIO + AUTOEVALUACIÓN + PORTAFOLIO
   ========================================================= */

/* Sidebar: elimina cualquier resto visual de Ollie y asegura color continuo hasta el borde inferior. */
.sidebar-ollie,
.sidebar-ollie-autoeval{display:none!important}
.sidebar{
  background:linear-gradient(180deg,#0B2348 0%,#102D55 56%,#153B63 100%)!important;
  min-height:100vh!important;
  min-height:100dvh!important;
  height:100vh!important;
  height:100dvh!important;
  align-self:stretch!important;
  overflow:hidden!important;
  border-bottom:0!important;
}
.app{
  min-height:100vh!important;
  min-height:100dvh!important;
  align-items:stretch!important;
  background:transparent!important;
}

/* Laboratorio de Chat: los números quedan dentro de sus círculos blancos. */
#laboratorio .lab-stage{
  position:relative!important;
  padding:12px 12px 12px 48px!important;
}
#laboratorio .lab-stage:before{
  display:none!important;
}
#laboratorio .lab-stage>b{
  position:absolute!important;
  left:12px!important;
  top:12px!important;
  width:27px!important;
  height:27px!important;
  margin:0!important;
  padding:0!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
  background:#fff!important;
  box-shadow:0 3px 8px rgba(16,42,86,.08)!important;
  font-size:10px!important;
  line-height:1!important;
  font-weight:600!important;
}
#laboratorio .lab-stage:nth-child(1)>b{color:#139CAD!important}
#laboratorio .lab-stage:nth-child(2)>b{color:#3575D3!important}
#laboratorio .lab-stage:nth-child(3)>b{color:#E45E43!important}
#laboratorio .lab-stage:nth-child(4)>b{color:#7657F5!important}

/* Autoevaluación: reduce el vacío entre el título principal y el diagnóstico. */
#autoevaluacion .autoeval-hero{
  min-height:clamp(280px,27vw,390px)!important;
  padding-bottom:clamp(34px,3.5vw,48px)!important;
}
#autoevaluacion .autoeval-panel{
  margin-top:-48px!important;
}

/* Portafolio: título/subtítulo y video quedan visualmente más próximos. */
#portafolio .section-head.portfolio-page-head{
  padding-top:18px!important;
  padding-bottom:0!important;
  margin-bottom:0!important;
}
#portafolio .portfolio-hero-showcase{
  margin-top:-7px!important;
}

@media(max-width:900px){
  #autoevaluacion .autoeval-hero{
    min-height:350px!important;
    padding-bottom:40px!important;
  }
  #autoevaluacion .autoeval-panel{margin-top:-34px!important}
}

@media(max-width:760px){
  #portafolio .section-head.portfolio-page-head{padding-top:12px!important}
  #portafolio .portfolio-hero-showcase{margin-top:-4px!important}
  #laboratorio .lab-stage{padding-left:46px!important}
}


/* ============================================================
   V81 · AJUSTES UX SOLICITADOS
   ============================================================ */

/* Laboratorio: etapas más visibles y sin el badge circular de 12 prácticas. */
#laboratorio .lab-stages{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:12px!important;
}
#laboratorio .lab-stage strong{
  font-size:15px!important;
  font-weight:900!important;
  letter-spacing:.07em!important;
}
#laboratorio .lab-stage span{
  font-size:11.5px!important;
}
#laboratorio .lab-stage b{
  font-size:11px!important;
  font-weight:900!important;
}
#laboratorio .lab-hero{
  padding-right:28px!important;
}
#laboratorio .lab-hero-badge{display:none!important}

/* Taller: el cierre ocupa la pantalla con mejor proporción y menos scroll. */
#taller .sales-module:has(.cierre-grid){
  display:grid!important;
  grid-template-columns:minmax(300px,.78fr) minmax(0,1.22fr)!important;
  column-gap:0!important;
  align-items:start!important;
}
#taller .sales-module:has(.cierre-grid) .sales-module-head{
  grid-column:1/-1!important;
}
#taller .sales-module:has(.cierre-grid) .cierre-grid{
  grid-column:1!important;
  display:block!important;
  min-width:0!important;
}
#taller .sales-module:has(.cierre-grid) .cierre-grid .module-actions{
  padding:24px 22px!important;
}
#taller .sales-module:has(.cierre-grid) .closing-selector{
  grid-column:2!important;
  grid-row:2!important;
  margin:0!important;
  border-top:0!important;
  border-left:1px solid #e5ebf2!important;
  border-radius:0!important;
  min-height:100%!important;
  padding:22px 22px 24px!important;
  background:linear-gradient(180deg,#fbfcff 0%,#f7f9fd 100%)!important;
}
#taller .sales-module:has(.cierre-grid) .closing-selector-head{
  margin-bottom:12px!important;
}
#taller .sales-module:has(.cierre-grid) .closing-layout{
  grid-template-columns:1fr!important;
  gap:10px!important;
}
#taller .sales-module:has(.cierre-grid) .close-inline{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:9px!important;
}
#taller .sales-module:has(.cierre-grid) .close-inline .closing-type{
  min-height:88px!important;
  padding:12px 13px!important;
  border-width:1px!important;
}
#taller .sales-module:has(.cierre-grid) .close-inline .closing-type b{
  font-size:13px!important;
  font-weight:900!important;
}
#taller .sales-module:has(.cierre-grid) .close-inline .closing-type em{
  display:block!important;
  font-style:normal!important;
  font-size:10.5px!important;
  line-height:1.35!important;
  margin-top:5px!important;
  color:#5f6e82!important;
}
/* Colores diferenciados por tipo de cierre. */
#taller .sales-module:has(.cierre-grid) .close-directo{background:#eef6ff!important;border-color:#b9d5f5!important}
#taller .sales-module:has(.cierre-grid) .close-eleccion{background:#f4efff!important;border-color:#d5c7f6!important}
#taller .sales-module:has(.cierre-grid) .close-necesidad{background:#edfaf5!important;border-color:#bde5d0!important}
#taller .sales-module:has(.cierre-grid) .close-accion{background:#fff6e8!important;border-color:#f2d39b!important}
#taller .sales-module:has(.cierre-grid) .close-directo.selected{box-shadow:0 0 0 2px #6aa6e8!important}
#taller .sales-module:has(.cierre-grid) .close-eleccion.selected{box-shadow:0 0 0 2px #9272e8!important}
#taller .sales-module:has(.cierre-grid) .close-necesidad.selected{box-shadow:0 0 0 2px #4fb984!important}
#taller .sales-module:has(.cierre-grid) .close-accion.selected{box-shadow:0 0 0 2px #e5a43d!important}
#taller .sales-module:has(.cierre-grid) .detail-callout{
  min-height:0!important;
  margin-top:2px!important;
  padding:14px 16px!important;
}
#taller .sales-module:has(.cierre-grid) .detail-callout blockquote{
  margin-top:10px!important;
  font-size:13px!important;
}

/* Certificación: la foto vuelve a ser parte visible del layout; el registro queda a la izquierda. */
#quiz{
  background-position:center top!important;
  background-size:cover!important;
}
#quiz .certification-card{
  max-width:none!important;
  width:100%!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
#quiz .cert-identity{
  width:min(620px,58vw)!important;
  max-width:620px!important;
  margin:12px 0 0 2%!important;
  padding:24px 26px 22px!important;
  background:rgba(255,255,255,.90)!important;
  border:1px solid rgba(214,228,245,.86)!important;
  border-radius:24px!important;
  box-shadow:0 18px 42px rgba(25,65,112,.11)!important;
  backdrop-filter:blur(4px)!important;
}
#quiz .cert-identity-head h3{font-size:25px!important}
#quiz .cert-form{
  grid-template-columns:1fr 1fr!important;
  gap:12px!important;
}
#quiz .cert-form label:first-child{grid-column:1/-1!important}
#quiz .cert-form .btn{grid-column:1/-1!important}
#quiz .cert-privacy-note{margin-top:13px!important}
@media(max-width:900px){
  #quiz .cert-identity{
    width:min(680px,100%)!important;
    margin:10px 0 0!important;
  }
}
@media(max-width:700px){
  #laboratorio .lab-stages{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #taller .sales-module:has(.cierre-grid){display:block!important}
  #taller .sales-module:has(.cierre-grid) .sales-module-head,
  #taller .sales-module:has(.cierre-grid) .cierre-grid,
  #taller .sales-module:has(.cierre-grid) .closing-selector{grid-column:auto!important;grid-row:auto!important}
  #taller .sales-module:has(.cierre-grid) .closing-selector{
    border-left:0!important;
    border-top:1px solid #e5ebf2!important;
  }
  #taller .sales-module:has(.cierre-grid) .close-inline{grid-template-columns:1fr 1fr!important}
  #quiz .cert-form{grid-template-columns:1fr!important}
  #quiz .cert-form label:first-child,#quiz .cert-form .btn{grid-column:auto!important}
}
@media(max-width:520px){
  #taller .sales-module:has(.cierre-grid) .close-inline{grid-template-columns:1fr!important}
}


/* V82 · REBATE · tarjetas rápidas y visuales */
#taller .rebate-quick-panel{display:flex;flex-direction:column;gap:12px;padding:16px;border:1px solid #E6EAF1;border-radius:16px;background:linear-gradient(180deg,#FBFCFF,#F7FAFD)}
#taller .rebate-quick-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
#taller .rebate-quick-head h3{margin:2px 0 0;font-size:18px;line-height:1.2;color:#24364D}
#taller .rebate-quick-head>span{font-size:10px;font-weight:800;color:#7A879B;white-space:nowrap}
#taller .rebate-scenario-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
#taller .rebate-scenario-card{border:1px solid #E3E8F0;border-radius:14px;padding:12px;background:#fff;display:grid;grid-template-columns:42px 1fr 18px;gap:10px;align-items:center;text-align:left;cursor:pointer;transition:.18s ease;min-width:0}
#taller .rebate-scenario-card:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(20,43,76,.07)}
#taller .rebate-scenario-card.selected{border-color:#E45E43;box-shadow:0 8px 20px rgba(228,94,67,.12);background:#FFF9F6}
#taller .rebate-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center}
#taller .rebate-icon img{width:25px;height:25px;display:block}
#taller .rebate-0 .rebate-icon{background:#FFF0EA;color:#E45E43}
#taller .rebate-1 .rebate-icon{background:#EEF2FF;color:#5570D8}
#taller .rebate-2 .rebate-icon{background:#F3EDFF;color:#7957D9}
#taller .rebate-card-copy{display:flex;flex-direction:column;gap:3px;min-width:0}
#taller .rebate-card-copy small{font-size:8px;letter-spacing:.1em;font-weight:900;color:#7A879B}
#taller .rebate-card-copy b{font-size:13px;color:#26384F;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#taller .rebate-card-copy em{font-style:normal;font-size:10px;line-height:1.35;color:#68768B}
#taller .rebate-arrow{font-size:17px;font-weight:800;color:#98A4B5}
#taller .rebate-quick-detail{min-height:0}
#taller .rebate-quick-detail:empty{display:none}
#taller .rebate-detail-top{display:flex;align-items:center;gap:8px;margin-bottom:5px}
#taller .rebate-detail-tag{font-size:8px;font-weight:900;letter-spacing:.1em;padding:4px 7px;border-radius:999px;background:#FFF0EA;color:#D8543C}
#taller .rebate-detail-top b{font-size:13px;color:#26384F}
#taller .rebate-quick-detail p{margin:0 0 7px;font-size:11px;line-height:1.45;color:#657287}
#taller .rebate-quick-detail blockquote{margin:0;padding:10px 12px;border-left:3px solid #E45E43;border-radius:0 10px 10px 0;background:#fff;color:#42536B;font-size:12px;line-height:1.48}
@media(max-width:900px){#taller .rebate-scenario-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){#taller .rebate-quick-head{align-items:flex-start;flex-direction:column}#taller .rebate-scenario-grid{grid-template-columns:1fr}#taller .rebate-scenario-card{grid-template-columns:42px 1fr 18px}}

/* V82 · INICIO · frase integrada en burbuja de chat */
#inicio.home-page .home-chat-bubble{position:absolute!important;right:7%!important;top:16%!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:0!important;width:225px!important;padding:20px 22px 22px!important;background:#fff!important;color:#26384F!important;border:1px solid rgba(34,61,96,.08)!important;border-radius:22px 22px 22px 7px!important;box-shadow:0 16px 34px rgba(22,42,72,.14)!important;z-index:4!important}
#inicio.home-page .home-chat-bubble:after{content:"";position:absolute;left:0;bottom:-15px;border-width:15px 15px 0 0;border-style:solid;border-color:#fff transparent transparent transparent;filter:drop-shadow(1px 2px 1px rgba(22,42,72,.05))}
#inicio.home-page .home-chat-bubble strong,#inicio.home-page .home-chat-bubble b{display:block!important;font-size:21px!important;line-height:1.12!important;letter-spacing:-.03em!important}
#inicio.home-page .home-chat-bubble b{margin-top:2px!important}
#inicio.home-page .home-chat-dot{width:8px!important;height:8px!important;border-radius:50%!important;background:#36B98A!important;margin-bottom:10px!important;box-shadow:12px 0 0 #B8E7D5,24px 0 0 #E0F4EC!important}
@media(max-width:900px){#inicio.home-page .home-chat-bubble{right:5%!important;top:12%!important;width:200px!important;padding:16px 18px 18px!important}#inicio.home-page .home-chat-bubble strong,#inicio.home-page .home-chat-bubble b{font-size:18px!important}}
@media(max-width:560px){#inicio.home-page .home-chat-bubble{right:6%!important;top:7%!important;width:170px!important;padding:13px 15px 15px!important;border-radius:17px 17px 17px 6px!important}#inicio.home-page .home-chat-bubble strong,#inicio.home-page .home-chat-bubble b{font-size:15px!important}}

/* V83 · REBATE · banco completo de objeciones, rápido y visual */
#taller .rebate-quick-panel{gap:10px;padding:15px;background:linear-gradient(180deg,#fbfcff 0%,#f4f7fb 100%)}
#taller .rebate-quick-head{align-items:flex-end}
#taller .rebate-quick-head h3{font-size:17px;margin-top:3px}
#taller .rebate-quick-head>span{background:#eef2f7;border-radius:999px;padding:6px 9px;color:#657287}
#taller .rebate-rule{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding:8px 10px;border:1px solid #e5eaf1;border-radius:11px;background:#fff}
#taller .rebate-rule span{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:#273b55;color:#fff;font-size:9px;font-weight:900}
#taller .rebate-rule b{font-size:10px;color:#273b55}
#taller .rebate-rule i{font-style:normal;font-size:9px;color:#7b8798;margin-right:5px}
#taller .rebate-scenario-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
#taller .rebate-scenario-card{min-height:72px;padding:9px;border-radius:12px;grid-template-columns:34px 1fr 12px;gap:8px;background:#fff;box-shadow:0 2px 7px rgba(25,45,70,.035)}
#taller .rebate-scenario-card:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(20,43,76,.09)}
#taller .rebate-icon{width:34px;height:34px;border-radius:10px}
#taller .rebate-icon img{width:20px;height:20px}
#taller .rebate-card-copy{gap:2px}
#taller .rebate-card-copy small{font-size:7px}
#taller .rebate-card-copy b{font-size:11px;line-height:1.2;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#taller .rebate-card-copy em{display:none}
#taller .rebate-arrow{font-size:14px}
#taller .rebate-scenario-card.selected{transform:translateY(-1px)}
#taller .rebate-0 .rebate-icon{background:#fff0ea;color:#e45e43}.rebate-0.selected{border-color:#e45e43!important}
#taller .rebate-1 .rebate-icon{background:#fff7df;color:#c98b00}.rebate-1.selected{border-color:#d7a324!important}
#taller .rebate-2 .rebate-icon{background:#f2edff;color:#7655d8}.rebate-2.selected{border-color:#7655d8!important}
#taller .rebate-3 .rebate-icon{background:#edf2ff;color:#5570d8}.rebate-3.selected{border-color:#5570d8!important}
#taller .rebate-4 .rebate-icon{background:#eaf8f5;color:#269b82}.rebate-4.selected{border-color:#269b82!important}
#taller .rebate-5 .rebate-icon{background:#fff0f4;color:#d65b7b}.rebate-5.selected{border-color:#d65b7b!important}
#taller .rebate-6 .rebate-icon{background:#eef8ff;color:#3f91c9}.rebate-6.selected{border-color:#3f91c9!important}
#taller .rebate-7 .rebate-icon{background:#f4efff;color:#8a5bd5}.rebate-7.selected{border-color:#8a5bd5!important}
#taller .rebate-8 .rebate-icon{background:#fff3e9;color:#df7b39}.rebate-8.selected{border-color:#df7b39!important}
#taller .rebate-9 .rebate-icon{background:#eaf6ff;color:#3988b8}.rebate-9.selected{border-color:#3988b8!important}
#taller .rebate-10 .rebate-icon{background:#edf7f0;color:#4d9b68}.rebate-10.selected{border-color:#4d9b68!important}
#taller .rebate-11 .rebate-icon{background:#eef1f5;color:#65758c}.rebate-11.selected{border-color:#65758c!important}
#taller .rebate-12 .rebate-icon{background:#fff0ee;color:#cc5d50}.rebate-12.selected{border-color:#cc5d50!important}
#taller .rebate-quick-detail{padding:9px 11px;border:1px solid #e3e8ef;border-radius:12px;background:#fff}
#taller .rebate-detail-top{margin-bottom:4px}
#taller .rebate-detail-tag{background:#edf2f7;color:#40536b}
#taller .rebate-detail-top b{font-size:12px}
#taller .rebate-quick-detail p{font-size:10px;margin-bottom:6px}
#taller .rebate-quick-detail blockquote{font-size:11px;padding:9px 11px;margin:0;border-left-color:#e45e43}
#taller .rebate-copy-btn{margin-top:7px;border:0;border-radius:8px;padding:6px 9px;background:#26384f;color:#fff;font-size:9px;font-weight:800;cursor:pointer}
@media(max-width:1000px){#taller .rebate-scenario-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){#taller .rebate-scenario-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#taller .rebate-rule{gap:5px}#taller .rebate-rule i{margin-right:2px}}
@media(max-width:480px){#taller .rebate-scenario-grid{grid-template-columns:1fr 1fr}#taller .rebate-scenario-card{min-height:66px;padding:8px;grid-template-columns:30px 1fr 10px}#taller .rebate-icon{width:30px;height:30px;border-radius:9px}#taller .rebate-icon img{width:18px;height:18px}}


/* V84 · REBATE · lectura central, compacta y legible */
#taller .sales-module:has(.rebate-quick-panel) .sales-module-grid{
  grid-template-columns:1fr!important;
  gap:0!important;
}
#taller .sales-module:has(.rebate-quick-panel) .module-actions{
  border-right:0!important;
  border-bottom:1px solid #e8eef4!important;
  padding:14px 18px!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
  background:#fbfcfe!important;
}
#taller .sales-module:has(.rebate-quick-panel) .module-actions>small{
  grid-column:1/-1!important;
  margin-bottom:-2px!important;
}
#taller .sales-module:has(.rebate-quick-panel) .module-actions>div{
  margin-top:0!important;
  gap:8px!important;
  align-items:center!important;
  min-width:0!important;
}
#taller .sales-module:has(.rebate-quick-panel) .module-actions>div b{
  flex:0 0 auto!important;
  font-size:9px!important;
  padding:4px 6px!important;
}
#taller .sales-module:has(.rebate-quick-panel) .module-actions>div span{
  font-size:11px!important;
  line-height:1.3!important;
  color:#4d6078!important;
}
#taller .sales-module:has(.rebate-quick-panel) .module-script{
  padding:0!important;
  min-width:0!important;
}
#taller .sales-module:has(.rebate-quick-panel) .rebate-quick-panel{
  width:100%!important;
  box-sizing:border-box!important;
  padding:18px!important;
  gap:12px!important;
}
#taller .sales-module:has(.rebate-quick-panel) .rebate-quick-head h3{font-size:19px!important}
#taller .sales-module:has(.rebate-quick-panel) .rebate-scenario-grid{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:10px!important;
}
#taller .sales-module:has(.rebate-quick-panel) .rebate-scenario-card{
  min-height:84px!important;
  padding:11px!important;
  grid-template-columns:38px minmax(0,1fr) 12px!important;
  gap:8px!important;
  border-radius:13px!important;
}
#taller .sales-module:has(.rebate-quick-panel) .rebate-icon{width:38px!important;height:38px!important;border-radius:11px!important}
#taller .sales-module:has(.rebate-quick-panel) .rebate-icon img{width:22px!important;height:22px!important}
#taller .sales-module:has(.rebate-quick-panel) .rebate-card-copy small{font-size:7.5px!important}
#taller .sales-module:has(.rebate-quick-panel) .rebate-card-copy b{font-size:12px!important;line-height:1.25!important}
#taller .sales-module:has(.rebate-quick-panel) .rebate-quick-detail{
  padding:14px 16px!important;
  border-radius:14px!important;
  background:#fff!important;
}
#taller .sales-module:has(.rebate-quick-panel) .rebate-detail-top b{font-size:15px!important}
#taller .sales-module:has(.rebate-quick-panel) .rebate-quick-detail p{
  font-size:13px!important;
  line-height:1.5!important;
  color:#50637b!important;
  margin-bottom:9px!important;
}
#taller .sales-module:has(.rebate-quick-panel) .rebate-quick-detail blockquote{
  font-size:15px!important;
  line-height:1.55!important;
  padding:13px 15px!important;
  border-left-width:4px!important;
  color:#263b55!important;
  background:#f8fbff!important;
}
#taller .sales-module:has(.rebate-quick-panel) .rebate-copy-btn{font-size:10px!important;padding:8px 11px!important}

/* V84 · INICIO · burbuja de mensaje más pequeña */
#inicio.home-page .home-chat-bubble{
  width:168px!important;
  padding:14px 16px 16px!important;
  border-radius:18px 18px 18px 6px!important;
}
#inicio.home-page .home-chat-bubble strong,#inicio.home-page .home-chat-bubble b{font-size:16px!important;line-height:1.12!important}
#inicio.home-page .home-chat-dot{width:6px!important;height:6px!important;margin-bottom:8px!important;box-shadow:10px 0 0 #B8E7D5,20px 0 0 #E0F4EC!important}
#inicio.home-page .home-chat-bubble:after{bottom:-11px;border-width:11px 11px 0 0!important}

/* V84 · INICIO · equipos sin rectángulo de fondo */
#inicio.home-page .home-oppo-card{position:relative!important;overflow:hidden!important}
#inicio.home-page .home-oppo-card{background:#c8fed8!important}
#inicio.home-page .home-oppo-card:before{background:linear-gradient(90deg,rgba(205,255,219,.99) 0%,rgba(205,255,219,.86) 34%,rgba(197,242,235,.40) 58%,rgba(148,185,255,.02) 100%)!important}
#inicio.home-page .home-product-stack{
  display:block!important;
  position:absolute!important;
  right:-10px!important;
  bottom:-18px!important;
  width:63%!important;
  height:100%!important;
  z-index:2!important;
  pointer-events:none!important;
}
#inicio.home-page .home-product-stack .home-product-cutout{
  position:absolute!important;
  right:0!important;
  bottom:-2px!important;
  width:100%!important;
  height:auto!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:right bottom!important;
  filter:drop-shadow(0 12px 18px rgba(23,58,90,.14))!important;
}
@media(max-width:900px){
  #taller .sales-module:has(.rebate-quick-panel) .rebate-scenario-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  #inicio.home-page .home-chat-bubble{width:155px!important;padding:12px 14px 14px!important}
  #inicio.home-page .home-chat-bubble strong,#inicio.home-page .home-chat-bubble b{font-size:15px!important}
}
@media(max-width:700px){
  #taller .sales-module:has(.rebate-quick-panel) .module-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #taller .sales-module:has(.rebate-quick-panel) .rebate-scenario-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #taller .sales-module:has(.rebate-quick-panel) .rebate-quick-detail blockquote{font-size:14px!important}
  #inicio.home-page .home-product-stack{width:60%!important;right:-4px!important;bottom:-10px!important}
}
@media(max-width:480px){
  #taller .sales-module:has(.rebate-quick-panel) .rebate-scenario-grid{grid-template-columns:1fr 1fr!important}
  #taller .sales-module:has(.rebate-quick-panel) .rebate-scenario-card{min-height:76px!important;padding:9px!important;grid-template-columns:32px minmax(0,1fr) 10px!important}
  #taller .sales-module:has(.rebate-quick-panel) .rebate-icon{width:32px!important;height:32px!important}
  #taller .sales-module:has(.rebate-quick-panel) .rebate-icon img{width:18px!important;height:18px!important}
  #inicio.home-page .home-product-stack{width:57%!important}
}


/* =========================================================
   V85 · COMPARADOR · SELECTORES MODERNOS
   ========================================================= */
.smart-picker-compact{
  background:linear-gradient(135deg,#f8fffc 0%,#f5f8ff 100%)!important;
  border:1px solid #dfeae5!important;
  border-radius:20px!important;
  padding:18px!important;
  box-shadow:0 8px 24px rgba(20,48,72,.045)!important;
}
.smart-picker-caption{display:flex!important;align-items:center!important;gap:11px!important}
.smart-picker-caption>span{
  width:34px!important;height:34px!important;
  display:grid!important;place-items:center!important;
  border-radius:11px!important;
  background:#1d9d6a!important;color:#fff!important;
  font-size:11px!important;font-weight:800!important;
  box-shadow:0 6px 14px rgba(29,157,106,.18)!important;
}
.smart-picker-caption b{font-size:11px!important;letter-spacing:.09em!important;color:#31505d!important}
.smart-picker-caption small{display:block!important;margin-top:3px!important;color:#7a8d96!important;font-size:10px!important}
.smart-picker-fields{grid-template-columns:190px minmax(0,1fr)!important;gap:10px!important;margin-top:14px!important}
.smart-picker-fields label{
  position:relative!important;
  font-size:10px!important;
  font-weight:700!important;
  letter-spacing:.03em!important;
  color:#58707a!important;
}
.smart-picker-fields>label>select{
  position:absolute!important;
  width:1px!important;height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
}
.smart-dropdown{
  position:relative!important;
  margin-top:6px!important;
}
.smart-dropdown-trigger{
  width:100%!important;
  min-height:48px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  padding:10px 12px!important;
  border:1px solid #d9e5e2!important;
  border-radius:13px!important;
  background:#fff!important;
  color:#203d45!important;
  font:600 12px 'Open Sans','Segoe UI',Arial,sans-serif!important;
  text-align:left!important;
  cursor:pointer!important;
  box-shadow:0 4px 12px rgba(20,48,72,.035)!important;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease!important;
}
.smart-dropdown-trigger:hover,
.smart-dropdown.open .smart-dropdown-trigger{
  border-color:#83c9ac!important;
  box-shadow:0 7px 18px rgba(29,157,106,.11)!important;
}
.smart-dropdown-trigger:after{
  content:"⌄"!important;
  color:#1d9d6a!important;
  font-size:16px!important;
  line-height:1!important;
  transform:translateY(-1px)!important;
}
.smart-dropdown.open .smart-dropdown-trigger:after{content:"⌃"!important}
.smart-dropdown-menu{
  position:absolute!important;
  left:0!important;
  right:0!important;
  top:calc(100% + 7px)!important;
  z-index:80!important;
  max-height:270px!important;
  overflow:auto!important;
  padding:6px!important;
  display:none!important;
  background:#fff!important;
  border:1px solid #dce9e5!important;
  border-radius:15px!important;
  box-shadow:0 16px 35px rgba(20,48,72,.15)!important;
}
.smart-dropdown.open .smart-dropdown-menu{display:block!important;animation:smartDropIn .16s ease!important}
.smart-dropdown-option{
  width:100%!important;
  border:0!important;
  border-radius:10px!important;
  background:transparent!important;
  padding:10px 11px!important;
  color:#36515a!important;
  font:500 11px 'Open Sans','Segoe UI',Arial,sans-serif!important;
  text-align:left!important;
  cursor:pointer!important;
  transition:background .15s ease,color .15s ease,transform .15s ease!important;
}
.smart-dropdown-option:hover{
  background:#edf9f3!important;
  color:#147d57!important;
  transform:translateX(2px)!important;
}
.smart-dropdown-option.active{
  background:#e5f7ee!important;
  color:#147d57!important;
  font-weight:700!important;
}
@keyframes smartDropIn{
  from{opacity:0;transform:translateY(-4px)}
  to{opacity:1;transform:translateY(0)}
}
@media(max-width:900px){
  .smart-picker-fields{grid-template-columns:1fr!important}
}

/* V86.1 · branding cleanup */
#mainSidebar .brand .logo{display:none!important}

/* V89 · MOBILE FAIL-SAFE */
@media (max-width:820px){
  html,body{width:100%;min-width:0!important;overflow-x:hidden!important}
  body{min-height:100dvh!important}
  .app,.main,.content{width:100%!important;min-width:0!important}
  .main{display:block!important;visibility:visible!important}
  .content{display:block!important;visibility:visible!important}
  #inicio.home-page{display:block}
  .page{max-width:100%!important;min-width:0!important}
}


/* =========================================================
   V90 · MOBILE FIRST PAINT / SIDEBAR OVERLAY FIX
   - El menú lateral NO ocupa espacio vertical en móvil.
   - El contenido principal empieza arriba, debajo del botón ☰.
   - El buscador superior se oculta en móvil para evitar un bloque
     innecesario antes del hero.
   - El fondo queda bloqueado mientras el menú está abierto.
   ========================================================= */
@media (max-width:820px){
  html,body{width:100%!important;min-width:0!important;overflow-x:hidden!important}
  body{margin:0!important}
  body.menu-open{overflow:hidden!important;touch-action:none!important}
  .app{display:block!important;width:100%!important;min-height:100dvh!important;margin:0!important;padding:0!important}
  .main{display:block!important;width:100%!important;min-width:0!important;margin:0!important;padding:0!important;position:relative!important}
  .topbar{display:none!important}
  .content{
    display:block!important;width:100%!important;max-width:none!important;min-width:0!important;
    margin:0!important;padding:58px 8px 12px!important;box-sizing:border-box!important;
  }
  .page{width:100%!important;max-width:none!important;min-width:0!important;margin:0!important;box-sizing:border-box!important}

  /* Menú realmente flotante: nunca empuja el Home hacia abajo. */
  .mobile-menu-toggle{
    position:fixed!important;left:12px!important;top:12px!important;z-index:120!important;
    display:flex!important;width:42px!important;height:42px!important;
    margin:0!important;align-items:center!important;justify-content:center!important;
  }
  .sidebar-backdrop{
    position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;
    z-index:109!important;display:none!important;margin:0!important;
    background:rgba(4,20,46,.46)!important;
  }
  .sidebar-backdrop.open{display:block!important}
  .sidebar{
    position:fixed!important;left:0!important;top:0!important;bottom:auto!important;
    width:min(86vw,292px)!important;height:100dvh!important;min-height:100dvh!important;
    max-height:100dvh!important;margin:0!important;z-index:110!important;
    transform:translate3d(-105%,0,0)!important;transition:transform .24s ease!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    box-sizing:border-box!important;
  }
  .sidebar.open{transform:translate3d(0,0,0)!important}

  /* Primera pantalla: el hero comienza inmediatamente después del área del menú. */
  #inicio.home-page{margin:0!important;min-height:0!important}
  #inicio.home-page .home-shell{margin:0!important;padding:0 0 18px!important}
}

@media (max-width:520px){
  .content{padding:56px 6px 10px!important}
  .mobile-menu-toggle{left:10px!important;top:10px!important;width:42px!important;height:42px!important}
}

/* =========================================================
   V93 · TEMA CLARO ESTABLE + CRÉDITO RESPONSIVE
   Se retira el experimento de tema oscuro y su selector.
   ========================================================= */
.sidebar{padding-bottom:0!important;}
.sidebar-credit{
  position:static!important;
  display:block!important;
  margin:auto 12px 12px!important;
  padding:10px 2px 0!important;
  max-width:none!important;
  flex:0 0 auto!important;
  border-top:1px solid rgba(255,255,255,.11)!important;
  color:rgba(255,255,255,.66)!important;
  font-size:9.5px!important;
  line-height:1.35!important;
  text-align:left!important;
  background:transparent!important;
  z-index:4!important;
}
.sidebar-credit strong{
  display:inline!important;
  margin-left:3px!important;
  color:rgba(255,255,255,.92)!important;
  font-size:10px!important;
  font-weight:650!important;
}
@media(max-width:820px){
  .sidebar-credit{
    display:block!important;
    margin-top:auto!important;
    margin-bottom:max(14px,env(safe-area-inset-bottom))!important;
    padding-top:10px!important;
  }
}

/* V94 · INICIO MÓVIL · mensaje sin cubrir asesora ni bienvenida */
@media(max-width:560px){
  #inicio.home-page .home-chat-bubble{
    top:auto!important;
    right:20px!important;
    bottom:54px!important;
    width:142px!important;
    padding:11px 13px 12px!important;
    border-radius:16px 16px 16px 6px!important;
  }
  #inicio.home-page .home-chat-bubble strong,
  #inicio.home-page .home-chat-bubble b{
    font-size:14px!important;
    line-height:1.08!important;
    letter-spacing:-.02em!important;
  }
  #inicio.home-page .home-chat-dot{margin-bottom:6px!important}
}
@media(max-width:380px){
  #inicio.home-page .home-chat-bubble{right:14px!important;bottom:48px!important;width:134px!important;padding:10px 12px 11px!important}
  #inicio.home-page .home-chat-bubble strong,#inicio.home-page .home-chat-bubble b{font-size:13px!important}
}

/* V94 · PORTAFOLIO + COMPARADOR · videos por modelo */
.video-model-btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;text-decoration:none!important;border:1px solid #0f766e!important;background:#ecfdf8!important;color:#0f766e!important;font-weight:800!important;box-shadow:none!important}
#portafolio .model-store .video-model-btn{padding:7px 11px!important;min-height:31px!important;font-size:10px!important;line-height:1!important;border-radius:9px!important}
#portafolio .model-store .store-link{flex-basis:100%}
.compare-model-actions{display:grid;gap:8px;margin-top:12px}
#comparador .compare-model-actions .compact-model-btn{margin-top:0!important}
#comparador .compact-video-btn{width:100%!important;min-height:38px!important;border-radius:13px!important;font-size:12px!important}

/* V95 · Información comercial enriquecida del Portafolio */
#portafolio .portfolio-sales-info{margin-top:14px;border:1px solid #e5eaf2;border-radius:14px;overflow:hidden;background:#fff}
#portafolio .portfolio-sales-head{padding:10px 12px;background:linear-gradient(135deg,#f5f8ff,#f4fbf8);border-bottom:1px solid #e8edf4;display:flex;align-items:center;justify-content:space-between;gap:8px}
#portafolio .portfolio-sales-head span{font-size:10px;letter-spacing:.055em;font-weight:900;color:#174783}
#portafolio .portfolio-sales-head small{font-size:9px;color:#718096;font-weight:700}
#portafolio .portfolio-sales-grid{display:grid;grid-template-columns:1fr 1fr}
#portafolio .portfolio-sales-item{padding:9px 11px;border-bottom:1px solid #edf0f5;min-width:0}
#portafolio .portfolio-sales-item:nth-child(odd){border-right:1px solid #edf0f5}
#portafolio .portfolio-sales-item small{display:block;font-size:9px;color:#73829a;font-weight:800;margin-bottom:3px}
#portafolio .portfolio-sales-item b{display:block;font-size:10.5px;line-height:1.3;color:#17345d;overflow-wrap:anywhere}
#portafolio .portfolio-sales-support{display:grid;grid-template-columns:1fr 1fr;background:#f8fafc}
#portafolio .portfolio-sales-support>div{display:flex;gap:8px;align-items:flex-start;padding:10px 11px}
#portafolio .portfolio-sales-support>div:first-child{border-right:1px solid #e7ebf1}
#portafolio .portfolio-sales-support p{margin:0;line-height:1.2}
#portafolio .portfolio-sales-support small{display:block;font-size:8.5px;font-weight:900;color:#087b4d;margin-bottom:3px;letter-spacing:.04em}
#portafolio .portfolio-sales-support b{display:block;font-size:9.5px;color:#203a5f}
#portafolio .support-icon{width:23px;height:23px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 23px;background:#e9f8f1;color:#087b4d;font-weight:900}
@media(max-width:600px){
 #portafolio .portfolio-sales-head{align-items:flex-start;flex-direction:column;gap:2px}
 #portafolio .portfolio-sales-grid{grid-template-columns:1fr}
 #portafolio .portfolio-sales-item:nth-child(odd){border-right:0}
 #portafolio .portfolio-sales-support{grid-template-columns:1fr}
 #portafolio .portfolio-sales-support>div:first-child{border-right:0;border-bottom:1px solid #e7ebf1}
}

/* V96 · Portafolio visual compacto */
#portafolio .portfolio-key-specs{display:none!important}
#portafolio .portfolio-sales-info{margin-top:14px;border:1px solid #e1e9f4;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 8px 22px rgba(25,57,101,.055)}
#portafolio .portfolio-sales-head{padding:11px 13px;background:linear-gradient(135deg,#f3f7ff,#effaf7);border-bottom:1px solid #e4ebf4}
#portafolio .portfolio-sales-grid{display:grid;grid-template-columns:1fr 1fr}
#portafolio .portfolio-sales-item{display:flex;gap:9px;align-items:flex-start;padding:10px 11px;border-bottom:1px solid #edf1f6;min-width:0}
#portafolio .portfolio-sales-item:nth-child(odd){border-right:1px solid #edf1f6}
#portafolio .portfolio-sales-item p{margin:0;min-width:0}
#portafolio .sales-web-icon,#portafolio .support-web-icon{width:28px;height:28px;flex:0 0 28px;border-radius:9px;display:grid;place-items:center;background:#eef5ff;color:#1555a3;border:1px solid #dce9f8;font-size:13px;font-weight:900}
#portafolio .portfolio-sales-item small{display:block;font-size:8.8px;color:#6d7e95;font-weight:850;margin-bottom:3px}
#portafolio .portfolio-sales-item b{display:block;font-size:10.4px;line-height:1.32;color:#17365e;overflow-wrap:anywhere}
#portafolio .portfolio-sales-support{display:grid;grid-template-columns:1fr 1fr 1fr;background:#f9fbfd}
#portafolio .portfolio-support-card{position:relative;display:flex;gap:9px;align-items:flex-start;padding:11px;border:0;border-right:1px solid #e7edf4;background:transparent;text-align:left;font:inherit;color:inherit;min-width:0}
#portafolio .portfolio-support-card:last-child{border-right:0}
#portafolio .portfolio-support-card p{margin:0;min-width:0}
#portafolio .portfolio-support-card small{display:block;font-size:8.3px;font-weight:900;letter-spacing:.045em;margin-bottom:3px;color:#4e6b8f}
#portafolio .portfolio-support-card b{display:block;font-size:9.5px;line-height:1.3;color:#203b60}
#portafolio .warranty-card{background:linear-gradient(135deg,#ecfff4,#f5fffa)}
#portafolio .warranty-card .support-web-icon{background:#dff8e9;border-color:#bcebcf;color:#087b4d}
#portafolio .warranty-card small{color:#087b4d}
#portafolio .service-card{background:linear-gradient(135deg,#f2f7ff,#f8fbff)}
#portafolio .service-card .support-web-icon{background:#e7f0ff;border-color:#cfddf6;color:#174783}
#portafolio .accessories-action{cursor:pointer;background:linear-gradient(135deg,#fff9ee,#fffdf7)}
#portafolio .accessories-action:hover{background:#fff5df}
#portafolio .accessories-action .support-web-icon{background:#fff1cf;border-color:#f4d891;color:#8c6400}
#portafolio .accessories-action em{display:block;font-size:8px;color:#8a6a1d;font-style:normal;margin-top:3px;font-weight:700}
#portafolio .support-chevron{margin-left:auto;color:#9a7419;font-size:19px;font-weight:800}
.accessories-modal{position:fixed;inset:0;z-index:10050;display:none;align-items:center;justify-content:center;padding:20px}.accessories-modal.open{display:flex}.accessories-backdrop{position:absolute;inset:0;background:rgba(8,24,48,.62);backdrop-filter:blur(3px)}.accessories-dialog{position:relative;width:min(430px,100%);max-height:80vh;overflow:auto;background:#fff;border-radius:20px;padding:22px;box-shadow:0 28px 80px rgba(0,0,0,.28)}.accessories-close{position:absolute;right:12px;top:10px;border:0;background:#eef3f8;width:32px;height:32px;border-radius:50%;font-size:21px;color:#25476e;cursor:pointer}.accessories-kicker{display:inline-block;font-size:9px;font-weight:900;letter-spacing:.08em;color:#087b4d;background:#eaf9f1;padding:6px 9px;border-radius:999px}.accessories-dialog h3{margin:10px 38px 4px 0;color:#123d72}.accessories-dialog>div>p{margin:0 0 14px;color:#6a7890;font-size:12px}.accessories-list{display:grid;gap:8px}.accessories-list>div{display:flex;align-items:center;gap:9px;padding:10px 11px;background:#f6f9fc;border:1px solid #e5ebf2;border-radius:11px;color:#25476e;font-size:11px}.accessories-list span{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:#e4f7ed;color:#087b4d;font-weight:900}
@media(max-width:820px){#portafolio .portfolio-sales-grid{grid-template-columns:1fr}#portafolio .portfolio-sales-item:nth-child(odd){border-right:0}#portafolio .portfolio-sales-support{grid-template-columns:1fr}#portafolio .portfolio-support-card{border-right:0;border-bottom:1px solid #e7edf4}#portafolio .portfolio-support-card:last-child{border-bottom:0}#portafolio .portfolio-sales-item{padding:10px 12px}#portafolio .portfolio-support-card{padding:11px 12px}}


/* V97 · Portafolio más amplio y respirable */
@media (min-width:1100px){
  .content{max-width:1780px!important;padding-left:24px!important;padding-right:24px!important}
  #portafolio .portfolio-grid{gap:24px!important}
}
#portafolio .model-card>.model-top + p{display:none!important}
#portafolio .portfolio-sales-info{margin-top:10px!important}
#portafolio .portfolio-sales-support{display:flex!important;flex-direction:column!important;background:#f8fafc!important}
#portafolio .portfolio-support-card{width:100%!important;border-right:0!important;border-bottom:1px solid #e5ebf2!important;padding:12px 13px!important;align-items:center!important}
#portafolio .portfolio-support-card:last-child{border-bottom:0!important}
#portafolio .warranty-card{background:linear-gradient(90deg,#eefaf3,#f8fcfa)!important}
#portafolio .service-card{background:#f7f9fd!important}
#portafolio .accessories-action{background:#fff!important}
#portafolio .portfolio-support-card b{font-size:10.2px!important}

/* V97 · Confianza posventa en Comparador */
#comparador .compare-trust-stack{display:grid;grid-template-columns:1fr;gap:8px;margin:12px 0}
#comparador .compare-trust-card{display:flex;align-items:center;gap:9px;border:1px solid #e1e8f0;border-radius:12px;padding:9px 10px;background:#fff;text-align:left}
#comparador .compare-trust-card.warranty{background:#eefaf3;border-color:#ccebd9}
#comparador .compare-trust-card.support{background:#f5f8fc;border-color:#dfe8f3}
#comparador .compare-trust-icon{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:#fff;color:#087b4d;font-weight:900;box-shadow:0 2px 8px rgba(24,61,95,.08);flex:0 0 28px}
#comparador .compare-trust-card div{min-width:0}
#comparador .compare-trust-card small{display:block;font-size:8px;font-weight:900;letter-spacing:.055em;color:#58708c;margin-bottom:2px}
#comparador .compare-trust-card b{display:block;font-size:9.5px;line-height:1.25;color:#17365e}
@media(max-width:820px){
  #portafolio .portfolio-sales-support{display:flex!important}
  #portafolio .portfolio-support-card{padding:12px!important}
}

/* V98 · Portafolio 2 columnas + iconografía SVG contemporánea */
@media (min-width:900px){
  #portafolio .portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:28px!important}
}
@media (min-width:1400px){
  #portafolio .portfolio-grid{gap:32px!important}
}
@media (max-width:899px){
  #portafolio .portfolio-grid{grid-template-columns:1fr!important}
}
#portafolio .model-card{border-radius:20px!important;overflow:hidden;box-shadow:0 10px 30px rgba(22,55,92,.07)!important}
#portafolio .portfolio-sales-info{border-radius:18px!important;box-shadow:none!important}
#portafolio .portfolio-sales-grid{grid-template-columns:1fr 1fr!important}
#portafolio .portfolio-sales-item{padding:12px 14px!important;gap:11px!important}
#portafolio .portfolio-sales-item b{font-size:11.5px!important;line-height:1.42!important;font-weight:600!important;color:#294665!important}
#portafolio .portfolio-sales-item small{font-size:9px!important;font-weight:700!important;letter-spacing:.02em!important;color:#718197!important}
#portafolio .sales-web-icon,#portafolio .support-web-icon{width:34px!important;height:34px!important;flex:0 0 34px!important;border-radius:11px!important;font-size:0!important}
#portafolio .sales-web-icon svg,#portafolio .support-web-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#portafolio .portfolio-sales-support{gap:8px!important;padding:10px!important;background:#f8fafc!important}
#portafolio .portfolio-support-card{border:1px solid transparent!important;border-radius:14px!important;padding:13px 14px!important;min-height:64px;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease!important}
#portafolio .portfolio-support-card + .portfolio-support-card{margin-top:0!important}
#portafolio .portfolio-support-card small{font-size:8.8px!important;font-weight:800!important;letter-spacing:.065em!important}
#portafolio .portfolio-support-card b{font-size:10.8px!important;line-height:1.35!important;font-weight:650!important}
#portafolio .warranty-card{background:linear-gradient(135deg,#eafaf1,#f5fcf8)!important;border-color:#c8ead6!important}
#portafolio .warranty-card .support-web-icon{background:#d9f4e5!important;border-color:#b9e5cb!important;color:#087b4d!important}
#portafolio .service-card{background:linear-gradient(135deg,#eef5ff,#f7faff)!important;border-color:#d5e4f7!important}
#portafolio .service-card .support-web-icon{background:#e1edff!important;border-color:#c7daf6!important;color:#245f9f!important}
#portafolio .accessories-action,#portafolio .portfolio-sales-support>.portfolio-support-card:last-child{background:linear-gradient(135deg,#fff8e9,#fffdf7)!important;border-color:#f1dfb3!important}
#portafolio .accessories-action .support-web-icon,#portafolio .portfolio-sales-support>.portfolio-support-card:last-child .support-web-icon{background:#fff0c9!important;border-color:#eed89b!important;color:#8b6508!important}
@media (hover:hover){
 #portafolio .portfolio-support-card:hover{transform:translateY(-2px) scale(1.008);box-shadow:0 8px 20px rgba(25,57,101,.10)!important;animation:v98SoftPulse .62s ease-out 1}
}
@keyframes v98SoftPulse{0%{transform:translateY(-2px) scale(1.008)}45%{transform:translateY(-2px) scale(1.018)}100%{transform:translateY(-2px) scale(1.008)}}
@media (prefers-reduced-motion:reduce){#portafolio .portfolio-support-card{transition:none!important}#portafolio .portfolio-support-card:hover{animation:none!important}}
@media(max-width:1100px) and (min-width:900px){
 #portafolio .portfolio-sales-grid{grid-template-columns:1fr!important}
 #portafolio .portfolio-sales-item:nth-child(odd){border-right:0!important}
}
@media(max-width:600px){
 #portafolio .portfolio-sales-grid{grid-template-columns:1fr!important}
 #portafolio .portfolio-sales-item:nth-child(odd){border-right:0!important}
 #portafolio .portfolio-sales-support{padding:8px!important}
}

/* V99 · 2 columnas reales + argumentos de valor + posventa consistente */
#portafolio #portfolioGrid.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:30px!important;width:100%!important}
#portafolio .portfolio-sales-item.sales-tip-item{position:relative;width:100%;border-top:0;border-left:0;background:#fff;text-align:left;font:inherit;color:inherit;cursor:help}
#portafolio .portfolio-sales-item.sales-tip-item:nth-child(odd){border-right:1px solid #edf1f6!important}
#portafolio .sales-value-tip{position:absolute;z-index:25;left:14px;right:14px;bottom:calc(100% - 5px);padding:10px 12px;border-radius:12px;background:#15395f;color:#fff;font-size:10.5px;line-height:1.4;font-weight:550;box-shadow:0 12px 28px rgba(15,42,72,.2);opacity:0;visibility:hidden;transform:translateY(5px);transition:.18s ease;pointer-events:none}
#portafolio .sales-value-tip:after{content:"";position:absolute;left:22px;top:100%;border:6px solid transparent;border-top-color:#15395f}
#portafolio .sales-tip-item:hover .sales-value-tip,#portafolio .sales-tip-item:focus-visible .sales-value-tip,#portafolio .sales-tip-item:focus .sales-value-tip{opacity:1;visibility:visible;transform:translateY(0)}
#portafolio .sales-tip-item:hover{background:#f8fbff!important}
#portafolio .portfolio-sales-item b{font-weight:550!important;font-size:11.6px!important;line-height:1.38!important}
#portafolio .portfolio-sales-item small{font-weight:700!important}
#comparador .compare-trust-stack{gap:10px!important;margin:14px 0!important}
#comparador .compare-trust-card{min-height:66px!important;padding:12px 14px!important;border-radius:14px!important;gap:11px!important}
#comparador .compare-trust-card.warranty{background:linear-gradient(135deg,#eafaf1,#f5fcf8)!important;border-color:#c8ead6!important}
#comparador .compare-trust-card.support{background:linear-gradient(135deg,#eef5ff,#f7faff)!important;border-color:#d5e4f7!important}
#comparador .compare-trust-icon{width:34px!important;height:34px!important;flex:0 0 34px!important;border-radius:11px!important;box-shadow:none!important}
#comparador .compare-trust-card.warranty .compare-trust-icon{background:#d9f4e5!important;color:#087b4d!important;border:1px solid #b9e5cb!important}
#comparador .compare-trust-card.support .compare-trust-icon{background:#e1edff!important;color:#245f9f!important;border:1px solid #c7daf6!important}
#comparador .compare-trust-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#comparador .compare-trust-card small{font-size:8.8px!important;font-weight:800!important;letter-spacing:.065em!important}
#comparador .compare-trust-card b{font-size:10.8px!important;line-height:1.35!important;font-weight:650!important}
@media(max-width:899px){#portafolio #portfolioGrid.portfolio-grid{grid-template-columns:1fr!important;gap:18px!important}}
@media(max-width:600px){#portafolio .portfolio-sales-grid{grid-template-columns:1fr!important}#portafolio .portfolio-sales-item.sales-tip-item:nth-child(odd){border-right:0!important}.sales-value-tip{left:10px!important;right:10px!important}}


/* V100 · Portafolio 3 columnas refinado + tooltips seguros + crédito visible */
#portafolio #portfolioGrid.portfolio-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:22px!important;
  width:100%!important;
}
#portafolio .portfolio-sales-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
#portafolio .portfolio-sales-item b{font-weight:500!important;font-size:11.2px!important;line-height:1.38!important;color:#274768!important}
#portafolio .portfolio-sales-item small{font-weight:650!important;color:#71839a!important}
#portafolio .sales-value-tip{
  background:#f7fbff!important;
  color:#294762!important;
  border:1px solid #d9e7f3!important;
  box-shadow:0 10px 24px rgba(25,57,101,.14)!important;
  font-size:10.4px!important;
  line-height:1.45!important;
  font-weight:450!important;
  letter-spacing:0!important;
}
#portafolio .sales-value-tip:after{border-top-color:#d9e7f3!important}
/* Primera fila: el mensaje abre hacia abajo para no quedar recortado por el encabezado */
#portafolio .portfolio-sales-item.sales-tip-item:nth-child(-n+2) .sales-value-tip{
  bottom:auto!important;
  top:calc(100% - 4px)!important;
  transform:translateY(-5px)!important;
}
#portafolio .portfolio-sales-item.sales-tip-item:nth-child(-n+2) .sales-value-tip:after{
  top:auto!important;
  bottom:100%!important;
  border-top-color:transparent!important;
  border-bottom-color:#d9e7f3!important;
}
#portafolio .portfolio-sales-item.sales-tip-item:nth-child(-n+2):hover .sales-value-tip,
#portafolio .portfolio-sales-item.sales-tip-item:nth-child(-n+2):focus .sales-value-tip,
#portafolio .portfolio-sales-item.sales-tip-item:nth-child(-n+2):focus-visible .sales-value-tip{transform:translateY(0)!important}
.sidebar-credit{color:rgba(255,255,255,.78)!important;font-size:9.8px!important;letter-spacing:.025em!important}
.sidebar-credit strong{color:#fff!important;font-size:10.2px!important;font-weight:650!important}
@media(max-width:1180px) and (min-width:900px){
 #portafolio #portfolioGrid.portfolio-grid{gap:18px!important}
 #portafolio .portfolio-sales-grid{grid-template-columns:1fr!important}
 #portafolio .portfolio-sales-item.sales-tip-item:nth-child(odd){border-right:0!important}
 #portafolio .portfolio-sales-item.sales-tip-item:nth-child(-n+2) .sales-value-tip{bottom:calc(100% - 5px)!important;top:auto!important}
 #portafolio .portfolio-sales-item.sales-tip-item:first-child .sales-value-tip{bottom:auto!important;top:calc(100% - 4px)!important}
}
@media(max-width:899px){#portafolio #portfolioGrid.portfolio-grid{grid-template-columns:1fr!important;gap:18px!important}}

/* =========================================================
   V101 · Refinamiento visual solicitado
   ========================================================= */
/* Galerías de producto: centradas y estables ante cambios de zoom */
#portafolio .product-visual:has(.oppo-gallery){
  display:flex!important;align-items:center!important;justify-content:center!important;
  padding:12px!important;background:#fff!important;overflow:hidden!important;
}
#portafolio .oppo-gallery{
  width:min(100%,420px)!important;max-width:100%!important;margin:0 auto!important;
  aspect-ratio:16/9!important;background:linear-gradient(135deg,#dffbf2,#b9d7ff)!important;
  border-radius:16px!important;overflow:hidden!important;position:relative!important;
}
#portafolio .oppo-gallery-image{
  width:100%!important;height:100%!important;display:block!important;margin:0 auto!important;
  object-fit:contain!important;object-position:50% 50%!important;background:transparent!important;
  transform:none!important;zoom:1!important;
}
/* Especificaciones: lectura un poco mayor, sin divisores negros/duros */
#portafolio .portfolio-sales-grid{gap:1px!important;background:#e7eef6!important}
#portafolio .portfolio-sales-item.sales-tip-item{
  border:0!important;background:#fff!important;padding:10px 11px!important;min-height:58px!important;
}
#portafolio .portfolio-sales-item.sales-tip-item:nth-child(odd){border-right:0!important}
#portafolio .portfolio-sales-item b{font-size:11.8px!important;font-weight:520!important;line-height:1.34!important}
#portafolio .portfolio-sales-item small{font-size:9.2px!important;font-weight:650!important}
/* Mensajes de valor: celeste suave + azul marino, legibles sin exceso de negrita */
#portafolio .sales-value-tip{
  background:#e9f6ff!important;color:#123f6d!important;border:1px solid #bcdcf2!important;
  font-size:10.8px!important;line-height:1.43!important;font-weight:480!important;
  box-shadow:0 10px 24px rgba(23,72,112,.14)!important;
}
#portafolio .sales-value-tip:after{border-top-color:#bcdcf2!important}
#portafolio .portfolio-sales-item.sales-tip-item:nth-child(-n+2) .sales-value-tip:after{border-bottom-color:#bcdcf2!important}
/* Compactación moderada: menos largo, sin amontonar */
#portafolio .portfolio-sales-info{margin-top:9px!important}
#portafolio .portfolio-sales-head{padding:9px 11px!important}
#portafolio .portfolio-sales-support{padding:8px!important;gap:7px!important}
#portafolio .portfolio-support-card{padding:10px 11px!important;min-height:58px!important}
/* Crédito: dos líneas intencionales, nombre completo sin corte */
.sidebar-credit{font-size:9.8px!important;line-height:1.3!important;color:rgba(255,255,255,.76)!important;white-space:normal!important}
.sidebar-credit strong{display:block!important;margin:2px 0 0!important;font-size:10.4px!important;font-weight:650!important;color:#fff!important;white-space:nowrap!important}

/* =========================================================
   V102 · Galerías integradas + portafolio compacto + accesos Inicio
   ========================================================= */
/* La galería y su superficie forman una sola pieza visual */
#portafolio .product-visual:has(.oppo-gallery){
  padding:0!important;
  margin:0!important;
  min-height:0!important;
  height:190px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:linear-gradient(135deg,#dffbf2 0%,#ccefe9 30%,#b9d7ff 100%)!important;
  border:0!important;
  border-radius:18px!important;
  overflow:hidden!important;
}
#portafolio .product-visual:has(.oppo-gallery) .visual-label{display:none!important}
#portafolio .oppo-gallery{
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  margin:0!important;
  aspect-ratio:auto!important;
  border-radius:18px!important;
  background:transparent!important;
  box-shadow:none!important;
  border:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
#portafolio .oppo-gallery-image{
  width:100%!important;height:100%!important;
  object-fit:contain!important;object-position:center center!important;
  padding:8px 46px!important;box-sizing:border-box!important;
  background:transparent!important;
}
#portafolio .oppo-gallery-arrow.prev{left:12px!important}
#portafolio .oppo-gallery-arrow.next{right:12px!important}
#portafolio .oppo-gallery-dots{left:50%!important;right:auto!important;transform:translateX(-50%)!important}
/* Menos altura sin perder contenido */
#portafolio .model-card{padding-bottom:13px!important}
#portafolio .model-top{margin-top:10px!important;margin-bottom:7px!important}
#portafolio .portfolio-sales-info{margin-top:6px!important}
#portafolio .portfolio-sales-head{padding:7px 10px!important}
#portafolio .portfolio-sales-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
#portafolio .portfolio-sales-item.sales-tip-item{padding:7px 8px!important;min-height:48px!important;gap:7px!important}
#portafolio .sales-web-icon{width:29px!important;height:29px!important;flex-basis:29px!important;border-radius:9px!important}
#portafolio .sales-web-icon svg{width:16px!important;height:16px!important}
#portafolio .portfolio-sales-item b{font-size:11.5px!important;line-height:1.25!important}
#portafolio .portfolio-sales-item small{font-size:8.7px!important}
#portafolio .portfolio-sales-support{padding:6px!important;gap:5px!important}
#portafolio .portfolio-support-card{padding:8px 9px!important;min-height:48px!important;border-radius:12px!important}
#portafolio .portfolio-support-card .support-web-icon{width:30px!important;height:30px!important;flex-basis:30px!important}
#portafolio .portfolio-support-card b{font-size:10.2px!important;line-height:1.25!important}
#portafolio .portfolio-support-card small{font-size:8.2px!important}
#portafolio .model-store{margin-top:9px!important}
@media(max-width:1180px) and (min-width:900px){
 #portafolio .portfolio-sales-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:600px){
 #portafolio .product-visual:has(.oppo-gallery){height:205px!important}
 #portafolio .oppo-gallery-image{padding:8px 40px!important}
 #portafolio .portfolio-sales-grid{grid-template-columns:1fr!important}
}

/* =========================================================
   V103 · Galería fusionada + beneficios destacados + crédito persistente
   ========================================================= */
/* La fotografía y la superficie visual se leen como una sola pieza.
   Las esquinas del propio recurso quedan redondeadas para evitar cortes rectos visibles. */
#portafolio .product-visual:has(.oppo-gallery){
  background:linear-gradient(135deg,#dffbf2 0%,#c9eee8 34%,#b9d7ff 100%)!important;
  border-radius:20px!important;
  overflow:hidden!important;
}
#portafolio .oppo-gallery{
  border-radius:20px!important;
  overflow:hidden!important;
  background:transparent!important;
}
#portafolio .oppo-gallery-image{
  width:calc(100% - 18px)!important;
  height:calc(100% - 14px)!important;
  margin:7px 9px!important;
  padding:0 34px!important;
  border-radius:17px!important;
  overflow:hidden!important;
  background:transparent!important;
  box-shadow:none!important;
  object-fit:contain!important;
  object-position:center!important;
}
/* Garantía, soporte y accesorios: más presencia sin agrandar demasiado la tarjeta. */
#portafolio .portfolio-support-card b{font-size:11.2px!important;line-height:1.28!important;font-weight:680!important}
#portafolio .portfolio-support-card small{font-size:8.9px!important;line-height:1.32!important}
#portafolio .portfolio-support-card .support-web-icon{width:32px!important;height:32px!important;flex-basis:32px!important}

/* El crédito permanece visible aunque el contenido principal haga scroll. */
@media(min-width:821px){
  .sidebar{position:sticky!important;top:0!important;height:100vh!important;max-height:100vh!important;overflow:hidden!important}
  .sidebar-credit{position:absolute!important;left:12px!important;right:12px!important;bottom:10px!important;margin:0!important;padding:9px 2px 0!important}
  .sidebar .nav{padding-bottom:52px!important;overflow-y:auto!important;overscroll-behavior:contain!important;scrollbar-width:thin!important}
}
@media(max-width:820px){
  .sidebar{display:flex!important;flex-direction:column!important;overflow:hidden!important}
  .sidebar .brand{flex:0 0 auto!important}
  .sidebar .nav{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;padding-bottom:12px!important;overscroll-behavior:contain!important}
  .sidebar-credit{
    position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;
    display:block!important;flex:0 0 auto!important;margin:0 12px max(12px,env(safe-area-inset-bottom))!important;
    padding:10px 2px 0!important;background:linear-gradient(180deg,rgba(13,48,91,0),rgba(13,48,91,.96) 24%)!important;
  }
}
@media(max-width:600px){
  #portafolio .oppo-gallery-image{width:calc(100% - 12px)!important;height:calc(100% - 12px)!important;margin:6px!important;padding:0 30px!important;border-radius:15px!important}
  #portafolio .portfolio-support-card b{font-size:11.5px!important}
  #portafolio .portfolio-support-card small{font-size:9.1px!important}
}

/* =========================================================
   V104 · Galería Portafolio como Comparador + cierres desplegables
   ========================================================= */
/* Evita la barra horizontal visible en el menú lateral. */
.sidebar,.sidebar .nav{overflow-x:hidden!important}
.sidebar .nav{scrollbar-width:none!important}
.sidebar .nav::-webkit-scrollbar{width:0!important;height:0!important;display:none!important}

/* Portafolio: exactamente el mismo principio responsivo del Comparador.
   Una sola superficie 16:9, sin imagen inset ni segundo rectángulo. */
#portafolio .product-visual:has(.oppo-gallery){
  position:relative!important;
  aspect-ratio:16/9!important;
  height:auto!important;
  min-height:0!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:18px!important;
  overflow:hidden!important;
  background:transparent!important;
  display:block!important;
}
#portafolio .product-visual:has(.oppo-gallery) .oppo-gallery{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:18px!important;
  overflow:hidden!important;
  background:transparent!important;
}
#portafolio .product-visual:has(.oppo-gallery) .oppo-gallery-image{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:18px!important;
  box-shadow:none!important;
  background:transparent!important;
  object-fit:cover!important;
  object-position:center center!important;
  transform:none!important;
}
#portafolio .oppo-gallery-arrow{z-index:15!important}
#portafolio .oppo-gallery-dots{z-index:16!important}

/* Tipos de cierre: la lectura solo aparece al elegir la tarjeta. */
#taller .closing-type{height:auto!important;overflow:visible!important;align-items:stretch!important;flex-direction:column!important}
#taller .closing-type-main{display:flex!important;align-items:center!important;gap:11px!important;width:100%!important}
#taller .closing-type-reading{
  display:grid!important;
  grid-template-rows:0fr!important;
  opacity:0!important;
  width:100%!important;
  transition:grid-template-rows .22s ease,opacity .18s ease,margin-top .22s ease!important;
  margin-top:0!important;
  text-align:left!important;
}
#taller .closing-type-reading>*{overflow:hidden!important}
#taller .closing-type.selected .closing-type-reading{grid-template-rows:1fr!important;opacity:1!important;margin-top:10px!important}
#taller .closing-type-reading small{font-size:9.5px!important;font-weight:800!important;letter-spacing:.06em!important;color:#526a86!important}
#taller .closing-type-reading blockquote{margin:5px 0 0!important;padding:9px 10px!important;border-left:3px solid currentColor!important;border-radius:0 9px 9px 0!important;background:rgba(255,255,255,.58)!important;font-size:12.2px!important;line-height:1.5!important;font-weight:520!important;color:#294762!important}
@media(max-width:700px){#taller .closing-type-reading blockquote{font-size:12.5px!important}}

/* Comparador: misma microinteracción de Garantía y Soporte que Portafolio. */
#comparador .compare-trust-card{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease!important;will-change:transform}
#comparador .compare-trust-card:hover{transform:translateY(-2px) scale(1.008)!important;box-shadow:0 8px 20px rgba(25,57,101,.10)!important;animation:v98SoftPulse .62s ease-out 1}
@media(prefers-reduced-motion:reduce){#comparador .compare-trust-card{transition:none!important}#comparador .compare-trust-card:hover{animation:none!important;transform:none!important}}


/* V105 · Autoevaluación más compacta sin sacrificar legibilidad */
#autoevaluacion .diagnosis-grid{gap:10px!important}
#autoevaluacion .diagnosis-card{padding:12px 13px 11px!important;border-radius:14px!important}
#autoevaluacion .diagnosis-card h3{margin-bottom:9px!important;line-height:1.34!important}
#autoevaluacion .diagnosis-meta{margin-bottom:7px!important}
#autoevaluacion .diagnosis-options{gap:5px!important}
#autoevaluacion .diagnosis-option{padding:7px 9px!important;line-height:1.3!important;border-radius:10px!important}
#autoevaluacion .option-letter{flex:0 0 23px!important;width:23px!important;height:23px!important;min-height:23px!important}
@media(max-width:700px){
 #autoevaluacion .diagnosis-card{padding:11px 11px 10px!important}
 #autoevaluacion .diagnosis-option{padding:7px 8px!important}
}

/* V105 · Tipos de cierre compactos y expansión animada hacia abajo */
#taller .cierre-grid .closing-selector{padding:16px 18px 18px!important}
#taller .cierre-grid .close-inline{align-items:start!important}
#taller .cierre-grid .closing-type{min-height:0!important;padding:9px 10px!important;overflow:hidden!important;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,padding .24s ease!important}
#taller .cierre-grid .closing-type-main{min-height:42px!important;gap:9px!important}
#taller .cierre-grid .closing-type-icon{width:31px!important;height:31px!important;min-width:31px!important}
#taller .cierre-grid .closing-type-copy b{font-size:12.5px!important}
#taller .cierre-grid .closing-type-copy em{font-size:10.3px!important;margin-top:2px!important}
#taller .cierre-grid .closing-type-reading{display:grid!important;grid-template-rows:0fr!important;opacity:0!important;margin-top:0!important;padding-top:0!important;border-top:0 solid rgba(83,105,128,.16)!important;transition:grid-template-rows .30s ease,opacity .22s ease,margin-top .30s ease,padding-top .30s ease,border-top-width .30s ease!important}
#taller .cierre-grid .closing-type-reading>*{overflow:hidden!important}
#taller .cierre-grid .closing-type.selected{padding-bottom:11px!important}
#taller .cierre-grid .closing-type.selected .closing-type-reading{display:grid!important;grid-template-rows:1fr!important;opacity:1!important;margin-top:7px!important;padding-top:8px!important;border-top-width:1px!important;animation:none!important}
#taller .cierre-grid .closing-type-reading small{font-size:9.5px!important;margin-bottom:5px!important}
#taller .cierre-grid .closing-type-reading blockquote{font-size:12.6px!important;line-height:1.5!important;padding:9px 10px!important;font-weight:500!important}
@media(max-width:560px){#taller .cierre-grid .closing-type-reading blockquote{font-size:12.8px!important}}

/* ===== Sales Coach Academia · Authentication Gate ===== */
html.auth-locked body { overflow: hidden; }
.auth-gate[hidden], .academy-user-chip[hidden] { display: none !important; }
.auth-gate { position: fixed; inset: 0; z-index: 99999; display: grid; place-items: center; padding: 24px; background: radial-gradient(circle at 18% 10%, #e8f8f2 0, transparent 34%), linear-gradient(135deg,#f7fbff 0%,#eef6ff 52%,#f7fffb 100%); }
.auth-card { width: min(440px,100%); background: rgba(255,255,255,.96); border: 1px solid #dce7f1; border-radius: 24px; box-shadow: 0 24px 70px rgba(7,38,90,.14); padding: 34px; }
.auth-brand { display:flex; align-items:center; gap:12px; margin-bottom:24px; color:#07265a; font-weight:800; letter-spacing:.02em; }
.auth-brand-mark { width:42px; height:42px; border-radius:13px; display:grid; place-items:center; color:#fff; background:linear-gradient(135deg,#087b58,#16b77d); font-size:20px; }
.auth-eyebrow { margin:0 0 8px; color:#07805d; font-size:12px; font-weight:800; letter-spacing:.12em; }
.auth-card h1 { margin:0; color:#092653; font-size:28px; line-height:1.1; }
.auth-subtitle { margin:10px 0 24px; color:#607086; font-size:14px; line-height:1.5; }
.auth-field { display:block; margin:0 0 15px; color:#263a55; font-size:13px; font-weight:700; }
.auth-field input { box-sizing:border-box; width:100%; margin-top:7px; padding:13px 14px; border:1px solid #cfdbe7; border-radius:12px; background:#fff; color:#10233f; font:inherit; font-weight:500; outline:none; transition:.2s; }
.auth-field input:focus { border-color:#1b9b74; box-shadow:0 0 0 4px rgba(27,155,116,.10); }
.auth-submit { width:100%; margin-top:4px; padding:13px 16px; border:0; border-radius:12px; background:#087b58; color:#fff; font-weight:800; cursor:pointer; }
.auth-submit:hover { filter:brightness(.96); transform:translateY(-1px); }
.auth-submit:disabled { opacity:.65; cursor:wait; transform:none; }
.auth-message { min-height:20px; margin:13px 0 0; font-size:13px; line-height:1.4; }
.auth-message.error { color:#b42318; }
.auth-message.success { color:#067647; }
.auth-credit { margin:22px 0 0; text-align:center; color:#8492a6; font-size:11px; }
.academy-user-chip { display:flex; align-items:center; gap:10px; margin-left:auto; }
.academy-user-meta { display:flex; flex-direction:column; align-items:flex-end; line-height:1.15; }
.academy-user-meta strong { color:#173457; font-size:12px; }
.academy-user-meta small { margin-top:3px; color:#718096; font-size:10px; text-transform:capitalize; }
.academy-logout { border:1px solid #d5e0ea; background:#fff; color:#173457; border-radius:10px; padding:8px 11px; font-size:11px; font-weight:700; cursor:pointer; }
@media (max-width:640px) { .auth-card{padding:26px 20px;border-radius:20px}.auth-card h1{font-size:24px}.academy-user-meta{display:none}.academy-logout{padding:7px 9px}.topbar{gap:8px} }


/* V107 · Sesión visible y control de acceso persistente */
.academy-user-chip{position:relative;z-index:20;padding:6px 7px 6px 12px;border:1px solid #dce7f1;border-radius:14px;background:rgba(255,255,255,.94);box-shadow:0 6px 18px rgba(7,38,90,.06)}
.academy-user-chip::before{content:"";width:8px;height:8px;border-radius:50%;background:#18a874;box-shadow:0 0 0 3px rgba(24,168,116,.12)}
.academy-logout{transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.academy-logout:hover{transform:translateY(-1px);border-color:#b9cadb;box-shadow:0 5px 14px rgba(7,38,90,.08)}
@media(max-width:640px){.academy-user-chip{padding:5px 6px}.academy-user-chip::before{display:none}.academy-logout{font-size:10.5px}}


/* =========================================================
   V117 · Sidebar fijo tipo Admin + salida visible
   ========================================================= */
.sidebar-session{margin-top:auto;padding:10px 4px 58px;flex:0 0 auto}
.sidebar-logout{width:100%;min-height:36px;border:1px solid rgba(255,255,255,.14);border-radius:10px;background:rgba(255,255,255,.06);color:#fff;display:flex;align-items:center;gap:8px;padding:8px 10px;font-size:10.5px;font-weight:650;cursor:pointer;transition:background .18s ease,transform .18s ease,border-color .18s ease}
.sidebar-logout:hover{background:rgba(255,255,255,.12);border-color:rgba(114,238,229,.45);transform:translateY(-1px)}
@media(min-width:821px){
  .app{display:block!important;min-height:100vh!important;padding-left:260px!important}
  .sidebar{position:fixed!important;left:0!important;top:0!important;bottom:0!important;width:260px!important;height:100vh!important;height:100dvh!important;min-height:0!important;z-index:80!important;background:linear-gradient(180deg,#0B2348 0%,#102D55 56%,#153B63 100%)!important;display:flex!important;flex-direction:column!important;overflow:hidden!important}
  .sidebar .nav{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;padding-bottom:8px!important}
  .sidebar-credit{position:absolute!important;left:14px!important;right:14px!important;bottom:10px!important;z-index:82!important;margin:0!important;padding:7px 0 0!important;background:linear-gradient(180deg,rgba(21,59,99,0),rgba(21,59,99,.96) 30%)!important}
  .main{width:100%!important;min-width:0!important}
}
@media(max-width:820px){
  .sidebar-session{padding:8px 4px 6px!important;margin-top:auto!important}
  .sidebar-logout{justify-content:center!important;padding:7px 5px!important}
  .sidebar-logout span:last-child{display:none!important}
}

/* =========================================================
   V118 · Sidebar compacto tipo Admin + crédito legible
   ========================================================= */
@media(min-width:821px){
  .app{padding-left:190px!important}
  .sidebar{width:190px!important;padding:15px 10px!important}
  .sidebar .nav button{min-height:36px!important;padding:7px 8px!important;font-size:10.5px!important}
  .sidebar .nav button span:last-child{font-size:10.5px!important}
  .sidebar-session{padding:8px 3px 62px!important}
  .sidebar-credit{left:12px!important;right:12px!important;bottom:9px!important;padding:9px 5px 2px!important;color:rgba(255,255,255,.70)!important;font-size:9px!important;line-height:1.35!important;border-top:1px solid rgba(255,255,255,.13)!important}
  .sidebar-credit strong{display:block!important;margin-top:2px!important;color:#fff!important;font-size:10px!important;font-weight:800!important;letter-spacing:.01em!important}
}
@media(min-width:821px) and (max-width:1100px){
  .app{padding-left:170px!important}
  .sidebar{width:170px!important;padding-left:8px!important;padding-right:8px!important}
}

/* V122 — Autoevaluación guiada: una situación por pantalla */
#autoevaluacion .sales-checklist{display:block!important;max-width:820px;margin:18px auto 0!important}
#autoevaluacion .diagnosis-one{padding:clamp(18px,3vw,30px)!important;border-radius:22px!important;box-shadow:0 18px 45px rgba(22,65,122,.08)!important;transform:none!important;animation:diagnosisIn .35s ease both}
#autoevaluacion .diagnosis-one h3{font-size:clamp(18px,2vw,24px)!important;line-height:1.38!important;margin:12px 0!important}
#autoevaluacion .diagnosis-one .diagnosis-meta span{font-size:14px!important;width:42px;height:42px}
#autoevaluacion .diagnosis-one .diagnosis-meta b{font-size:11px!important}
#autoevaluacion .diagnosis-hint{font-size:14px;color:#607b9e;margin:0 0 16px}
#autoevaluacion .diagnosis-one .diagnosis-options{gap:11px!important}
#autoevaluacion .diagnosis-one .diagnosis-option{font-size:clamp(13px,1.4vw,15px)!important;line-height:1.5!important;padding:15px 16px!important;border-radius:14px!important;align-items:center!important;min-height:62px;transition:transform .2s ease,background .2s ease,border-color .2s ease!important}
#autoevaluacion .diagnosis-one .diagnosis-option:hover:not(:disabled){transform:translateX(4px);border-color:#29bdbb!important}
#autoevaluacion .diagnosis-one .diagnosis-option:disabled{cursor:default;opacity:.77}
#autoevaluacion .diagnosis-one .diagnosis-option.selected:disabled{opacity:1}
#autoevaluacion .diagnosis-one .option-letter{font-size:13px!important;flex-shrink:0}
#autoevaluacion .diagnosis-progress{margin:0 0 22px}
#autoevaluacion .diagnosis-progress-label{display:flex;justify-content:space-between;gap:10px;color:#254b7d;font-size:14px;margin-bottom:10px}
#autoevaluacion .diagnosis-progress-track{height:9px;background:#e6eef8;border-radius:20px;overflow:hidden}
#autoevaluacion .diagnosis-progress-track i{display:block;height:100%;border-radius:20px;background:linear-gradient(90deg,#18bdb8,#3579ee);transition:width .35s ease}
#autoevaluacion .diagnosis-progress-stages{display:flex;justify-content:space-between;gap:5px;margin-top:12px;flex-wrap:wrap}
#autoevaluacion .diagnosis-progress-stages span{font-size:10px;font-weight:800;letter-spacing:.05em;color:#7b91ad}
#autoevaluacion .diagnosis-progress-stages span.active{color:#087b9e}
#autoevaluacion .diagnosis-feedback{margin-top:20px;padding:20px;border-radius:17px;background:#effcf9;border:1px solid #b9e9df;animation:diagnosisIn .3s ease both}
#autoevaluacion .diagnosis-feedback.growth{background:#f0f7ff;border-color:#cbdcf6}
#autoevaluacion .diagnosis-feedback-kicker{font-size:13px;font-weight:900;color:#087e7d}
#autoevaluacion .diagnosis-feedback.growth .diagnosis-feedback-kicker{color:#2769b9}
#autoevaluacion .diagnosis-feedback p{font-size:15px;color:#294c70;line-height:1.55;margin:10px 0}
#autoevaluacion .diagnosis-feedback small{display:block;font-size:13px;color:#58718c;line-height:1.5}
#autoevaluacion .diagnosis-next{margin-top:18px!important;min-height:44px}
#autoevaluacion .autoeval-result{max-width:820px;margin:25px auto!important}
#autoevaluacion .diagnosis-summary{text-align:center}
#autoevaluacion .diagnosis-summary h2{color:#173f73;font-size:clamp(23px,3vw,32px)}
#autoevaluacion .diagnosis-score-big{display:flex;flex-direction:column;align-items:center;gap:6px;margin:16px 0}
#autoevaluacion .diagnosis-score-big strong{font-size:clamp(40px,6vw,60px);color:#2473df;line-height:1}
#autoevaluacion .diagnosis-score-big strong small{font-size:17px;color:#7285a1}
#autoevaluacion .diagnosis-score-big span{font-size:13px;color:#5a7593}
#autoevaluacion .diagnosis-summary-note{font-size:13px;color:#66809c}
#autoevaluacion .diagnosis-results-title{margin:22px 0 14px;color:#173f73}
#autoevaluacion .diagnosis-stage small{display:block;font-size:12px;color:#64809e;margin-top:8px;line-height:1.4}
#autoevaluacion .diagnosis-focus{padding:18px;background:#f0f8ff;border:1px solid #d9e8fa;border-radius:16px;margin:18px 0}
#autoevaluacion .diagnosis-focus b{color:#1c548c}
#autoevaluacion .diagnosis-focus p{line-height:1.6;font-size:14px;color:#426789}
#autoevaluacion .diagnosis-one.diagnosis-exit{animation:diagnosisOut .26s ease forwards}
@keyframes diagnosisIn{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:translateX(0)}}
@keyframes diagnosisOut{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-20px)}}
@media(max-width:600px){#autoevaluacion .diagnosis-one{padding:17px!important}#autoevaluacion .diagnosis-one .diagnosis-option{font-size:13px!important;padding:13px!important}#autoevaluacion .diagnosis-progress-stages span{font-size:9px}#autoevaluacion .diagnosis-feedback{padding:15px}}
@media(prefers-reduced-motion:reduce){#autoevaluacion .diagnosis-one,#autoevaluacion .diagnosis-feedback,#autoevaluacion .diagnosis-one.diagnosis-exit{animation:none!important}#autoevaluacion .diagnosis-progress-track i{transition:none}}


/* V134 · Sondea: composición editorial fiel a la referencia */
.sondea-v134{position:relative;overflow:hidden;padding:25px 22px 20px;border:1px solid #e2ebf8;border-radius:24px;background:linear-gradient(125deg,#f8fbff 0%,#f1f6ff 75%,#eaf6ff 100%);box-shadow:0 12px 35px rgba(32,65,122,.07);color:#102d60;font-family:inherit}
.sondea-v134 *{box-sizing:border-box}.sondea-v134-head{display:flex;align-items:center;gap:20px;position:relative;margin:0 0 23px}.sondea-v134-target{width:76px;height:76px;display:grid;place-items:center;border-radius:20px;background:linear-gradient(135deg,#fff,#e5f9ff);box-shadow:0 5px 17px #9ab5d33b;color:#15b6d1;flex:none}.sondea-v134-target svg{width:39px;height:39px}.sondea-v134-heading{z-index:1}.sondea-v134-tag{display:inline-block;padding:5px 13px;border-radius:99px;background:#e8edff;color:#205cff;font-size:12px;font-weight:800;letter-spacing:1.6px}.sondea-v134 h2{margin:9px 0 8px;font-size:clamp(23px,2.15vw,34px);font-weight:800;line-height:1.16;color:#0b2858}.sondea-v134-head p{margin:0;max-width:760px;color:#52709e;font-size:15px;line-height:1.55}.sondea-v134-big{position:absolute;right:14px;top:-13px;font-size:90px;line-height:1;color:#cce7f8;font-weight:800}
.sondea-v134-columns{display:grid;grid-template-columns:1fr 1fr;gap:0;position:relative}.sondea-v134-left,.sondea-v134-right{position:relative;min-width:0;border-radius:22px;padding:20px;min-height:510px}.sondea-v134-left{overflow:hidden;background:linear-gradient(110deg,#f9fffd 0%,#effafa 57%,#e5f7ff 100%)}.sondea-v134-right{background:rgba(255,255,255,.88);border:1px solid #e5ecf8}.sondea-v134-section-title{display:flex;align-items:center;gap:14px;position:relative;z-index:2;margin-bottom:18px}.sondea-v134-round{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#e5faf4;color:#0abc9f;font-size:25px;flex:none}.sondea-v134-round.blue{background:#e9f2ff;color:#0872d8}.sondea-v134-round svg{width:26px;height:26px}.sondea-v134-section-title h3{margin:0 0 4px;color:#0c2958;font-size:18px;font-weight:800}.sondea-v134-section-title p{margin:0;color:#45628e;font-size:13px;line-height:1.55}.sondea-v134-steps{position:relative;z-index:2;width:57%;display:grid;gap:7px}.sondea-v134-step{display:flex;align-items:center;gap:10px;min-height:57px}.sondea-v134-count{display:grid;place-items:center;flex:none;width:39px;height:39px;border-radius:50%;background:#ddf7f1;color:#04ae92;font-size:13px;font-weight:800}.sondea-v134-step-body{display:flex;align-items:center;gap:12px;flex:1;padding:9px;border:1px solid #e9f1f2;border-radius:13px;background:#ffffffd9;color:#102d60;font-size:13px;line-height:1.4;box-shadow:0 3px 10px #b9cbd015}.sondea-v134-step-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:#e4f8f3;color:#0eb99b;flex:none}.sondea-v134-step-icon svg{width:21px;height:21px}.sondea-v134-tip{position:relative;z-index:2;display:flex;gap:13px;width:57%;margin-top:15px;padding:14px;border-radius:14px;background:#fff8e9e8}.sondea-v134-tip strong{font-size:14px;color:#0b2858}.sondea-v134-tip p{font-size:12px;line-height:1.6;font-style:italic;margin:5px 0 0;color:#24446e}.sondea-v134-bulb{display:grid;place-items:center;width:39px;height:39px;flex:none;background:#ffbd08;color:white;border-radius:12px;font-size:25px}.sondea-v134-person{position:absolute;z-index:1;right:-11%;bottom:-5%;width:67%;height:95%;object-fit:cover;object-position:65% 50%;mask-image:linear-gradient(to right,transparent 0%,black 24%);pointer-events:none}.sondea-v134-questions{display:grid;gap:9px}.sondea-v134-question{display:flex;align-items:center;gap:13px;min-height:66px;padding:11px 13px;border:1px solid #e1ebfa;border-radius:17px;background:linear-gradient(100deg,#f9fcff,#fff);box-shadow:0 2px 8px #9fb8d112}.sondea-v134-question .sondea-v134-count{background:#ddf8f3;color:#0a9d9c;width:43px;height:43px}.sondea-v134-question p{margin:0;flex:1;font-size:14px;line-height:1.48;color:#102e60}.sondea-v134-question button{border:0;background:transparent;color:#193f79;cursor:pointer;padding:8px;border-radius:8px}.sondea-v134-question button:hover{background:#e8f4ff;color:#0075cf}
@media(max-width:1050px){.sondea-v134-columns{grid-template-columns:1fr}.sondea-v134-left,.sondea-v134-right{min-height:auto}.sondea-v134-left{min-height:460px}.sondea-v134-person{width:55%;right:0}.sondea-v134-steps,.sondea-v134-tip{width:55%}}
@media(max-width:620px){.sondea-v134{padding:15px 10px}.sondea-v134-head{gap:10px}.sondea-v134-target{width:52px;height:52px;border-radius:14px}.sondea-v134-target svg{width:27px}.sondea-v134 h2{font-size:22px}.sondea-v134-head p{font-size:12px}.sondea-v134-big{display:none}.sondea-v134-left,.sondea-v134-right{padding:14px}.sondea-v134-left{min-height:650px}.sondea-v134-steps,.sondea-v134-tip{width:100%}.sondea-v134-person{width:90%;height:310px;right:-7%;bottom:0;object-position:65% 45%;mask-image:linear-gradient(to bottom,transparent 0%,black 25%)}.sondea-v134-section-title h3{font-size:16px}.sondea-v134-question{gap:8px;padding:9px}.sondea-v134-question p{font-size:12px}.sondea-v134-question .sondea-v134-count{width:34px;height:34px}}

/* V135: unified stage hover, balanced image, contextual SVG and typography */
#taller .sondea-v134{transition:transform .26s ease,box-shadow .26s ease,border-color .26s ease}
#taller .sondea-v134:hover{transform:translateY(-3px);box-shadow:0 19px 42px rgba(29,73,133,.13);border-color:#c9def4}
#taller .sondea-v134-person{width:58%;height:100%;right:0;bottom:0;object-fit:contain;object-position:right bottom;mask-image:linear-gradient(to right,transparent 0%,black 19%)}
#taller .sondea-v134-left{min-height:535px;background:linear-gradient(110deg,#f9fffd 0%,#effafa 57%,#e5f7ff 100%)}
#taller .sondea-v134-tip p{font-style:normal}
#taller .sondea-v134-bulb svg{width:24px;height:24px}
#taller .sondea-v134 :is(h2,h3,p,strong,span){font-family:inherit}
#taller .sondea-v134-step-body,#taller .sondea-v134-question{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
#taller .sondea-v134-step-body:hover,#taller .sondea-v134-question:hover{transform:translateY(-2px);box-shadow:0 9px 20px rgba(24,85,134,.10);border-color:#bcdfe9}
#taller .sales-module{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
#taller .sales-module:hover{box-shadow:0 14px 32px rgba(29,73,133,.10)}
@media(max-width:1050px){#taller .sondea-v134-person{width:49%;height:100%;right:0;bottom:0;object-fit:contain}#taller .sondea-v134-left{min-height:485px}}
@media(max-width:620px){#taller .sondea-v134-left{min-height:665px}#taller .sondea-v134-person{width:84%;height:300px;right:-2%;bottom:0;object-fit:contain;object-position:right bottom;mask-image:linear-gradient(to bottom,transparent 0%,black 22%)}#taller .sondea-v134:hover{transform:none}}
@media(prefers-reduced-motion:reduce){#taller .sondea-v134,#taller .sondea-v134-step-body,#taller .sondea-v134-question,#taller .sales-module{transition:none!important}}

/* V136 · taller compact hero, matching stage motion, blended portrait */
#taller .sales-hero.sales-hero-clean{min-height:218px!important;height:auto!important;padding:21px 34px 23px!important;background-image:linear-gradient(90deg,rgba(242,248,255,.97) 0%,rgba(242,248,255,.91) 38%,rgba(242,248,255,.48) 60%,rgba(242,248,255,.06) 100%),url("../assets/hero-taller-ventas.png")!important;background-size:cover!important;background-position:right 44%!important}
#taller .sales-hero.sales-hero-clean h1{font-size:clamp(29px,3vw,43px)!important;line-height:1.08!important;margin:8px 0 10px!important}
#taller .sales-hero.sales-hero-clean p{line-height:1.45!important;margin:0!important}
#taller .sales-section-head{margin-top:12px!important;margin-bottom:10px!important}
#taller .compact-route .sales-step{transition:transform .26s cubic-bezier(.2,.75,.25,1),box-shadow .26s ease,filter .26s ease,background-color .26s ease!important;will-change:transform}
#taller .compact-route .sales-step:hover{transform:translateY(-5px) scale(1.015)!important;filter:brightness(1.055) saturate(1.09)!important;box-shadow:0 15px 27px rgba(28,62,113,.2)!important}
#taller .compact-route .sales-step.active:not(:hover){transform:translateY(0)!important;box-shadow:0 5px 15px rgba(28,62,113,.11)!important}
#taller .sondea-v134-left{isolation:isolate;background:linear-gradient(110deg,#f9fffd 0%,#effafa 58%,#e4f6ff 100%)!important}
#taller .sondea-v134-person{mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.45) 13%,black 35%),linear-gradient(to top,black 0%,black 79%,transparent 100%);mask-composite:intersect;-webkit-mask-image:linear-gradient(to right,transparent 0%,black 33%);opacity:.98}
#taller .sondea-v134-left::after{content:"";position:absolute;z-index:1;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 42%,rgba(231,248,255,.13) 75%,rgba(231,248,255,.32) 100%);mix-blend-mode:screen}
@media(max-width:760px){#taller .sales-hero.sales-hero-clean{min-height:205px!important;padding:19px 20px!important;background-position:67% center!important;background-image:linear-gradient(90deg,rgba(242,248,255,.98) 0%,rgba(242,248,255,.91) 58%,rgba(242,248,255,.3) 100%),url("../assets/hero-taller-ventas.png")!important}#taller .sales-hero.sales-hero-clean h1{font-size:clamp(25px,5vw,33px)!important}}
@media(max-width:480px){#taller .sales-hero.sales-hero-clean{min-height:220px!important;padding:17px 15px!important}#taller .sales-hero.sales-hero-clean p{font-size:12px!important}#taller .sondea-v134-person{-webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 25%)}}
@media(prefers-reduced-motion:reduce){#taller .compact-route .sales-step{transition:none!important;will-change:auto}}

/* V137: Ofrece / integración fotográfica Sondea */
#taller .sondea-v134-left{background:linear-gradient(110deg,#f9fffd 0%,#eaf9ff 100%)!important}
#taller .sondea-v134-person{width:64%;height:100%;right:0;bottom:0;object-fit:cover;object-position:70% 65%;opacity:1;mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.15) 9%,black 44%),linear-gradient(to bottom,transparent 0%,black 20%);mask-composite:intersect;-webkit-mask-image:radial-gradient(ellipse 91% 90% at 88% 75%,black 48%,transparent 100%)}
#taller .sondea-v134-left::after{background:linear-gradient(90deg,transparent 45%,rgba(236,249,255,.09) 80%,transparent 100%);mix-blend-mode:normal}
#taller .ofrece-v137{position:relative;padding:20px;border:1px solid #e1eaf7;border-radius:23px;background:linear-gradient(125deg,#f7fbff,#f1f6ff 78%,#eaf9ff);color:#102d60;font-family:inherit;box-shadow:0 12px 35px #20417a12}
#taller .ofrece-v137 *{box-sizing:border-box;font-family:inherit}
#taller .ofrece-v137-header{position:relative;margin:0 0 16px;padding:3px 8px 0}
#taller .ofrece-v137-tag{display:inline-block;padding:5px 12px;border-radius:99px;background:#e7edff;color:#205cff;font-size:12px;font-weight:800;letter-spacing:1.4px}
#taller .ofrece-v137-header h2{margin:9px 0 6px;font-size:clamp(23px,2.15vw,34px);color:#0b2858;font-weight:800}
#taller .ofrece-v137-header p{margin:0;max-width:750px;font-size:14px;color:#52709e;line-height:1.5}
#taller .ofrece-v137-watermark{position:absolute;right:15px;top:-12px;font-size:88px;line-height:1;color:#cce7f8;font-weight:800}
#taller .ofrece-v137-main{display:grid;grid-template-columns:1.05fr 1fr;gap:12px}
#taller .ofrece-v137-guide{position:relative;min-height:450px;overflow:hidden;border-radius:20px;background:linear-gradient(110deg,#f9fffd,#e7f7ff)}
#taller .ofrece-v137-guide-image{position:absolute;inset:0;background-image:linear-gradient(90deg,#f5fcff 0%,rgba(245,252,255,.96) 24%,rgba(245,252,255,.3) 54%,transparent 85%),url('../assets/ofrece-asesora-oppo-v137.png');background-size:cover;background-position:center center}
#taller .ofrece-v137-guide-copy{position:relative;z-index:1;width:57%;padding:23px 12px 20px 20px}
#taller .ofrece-v137-guide h3,#taller .ofrece-v137-phrases h3{font-size:18px;color:#0b2858;margin:0 0 6px;font-weight:800}
#taller .ofrece-v137-guide-copy>p,#taller .ofrece-v137-panel-title p{font-size:13px;color:#45628e;line-height:1.5;margin:0 0 15px}
#taller .ofrece-v137-actions{display:grid;gap:8px}
#taller .ofrece-v137-action{display:flex;align-items:center;gap:8px;min-height:59px;padding:7px;border:1px solid #e7eef2;border-radius:13px;background:#ffffffdb;font-size:12px;line-height:1.35;transition:transform .2s,box-shadow .2s}
#taller .ofrece-v137-action:hover{transform:translateY(-2px);box-shadow:0 8px 17px #24578119}
#taller .ofrece-v137-action>b{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#ddf8f3;color:#00a98d}
#taller .ofrece-v137-action-icon{flex:none;display:grid;place-items:center;width:31px;height:31px;border-radius:10px;background:#e4f8f3;color:#08ae9c}
#taller .ofrece-v137-action-icon svg{width:19px;height:19px}
#taller .ofrece-v137-phrases{border-radius:20px;border:1px solid #e5ecf8;background:#ffffffdf;padding:18px;min-width:0}
#taller .ofrece-v137-panel-title{display:flex;align-items:center;gap:12px;margin-bottom:12px}
#taller .ofrece-v137-bubble{display:grid;place-items:center;flex:none;width:43px;height:43px;border-radius:13px;background:#eaf3ff;color:#1775df;font-size:24px}
#taller .ofrece-v137-phrases .connection-title{display:none}
#taller .ofrece-v137-phrases .connection-list{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}
#taller .ofrece-v137-phrases .connection-item{display:flex!important;align-items:center;gap:8px;min-height:72px;padding:10px!important;border:1px solid #e1ebfa!important;border-radius:13px!important;background:#fafdff!important}
#taller .ofrece-v137-phrases .connection-item>span{flex:none;display:grid;place-items:center;width:29px;height:29px;border-radius:50%;background:#ddf8f3;color:#00a98d;font-weight:800;font-size:12px}
#taller .ofrece-v137-phrases .connection-item p{flex:1;margin:0;font-size:12px;line-height:1.45;color:#102d60}
#taller .offer-phrase-copy{flex:none;display:grid;place-items:center;width:28px;height:30px;border:0;border-radius:7px;background:transparent;color:#2355a2;cursor:pointer}
#taller .offer-phrase-copy svg{width:19px;height:19px}
#taller .offer-phrase-copy:hover{background:#e7f1ff}
#taller .offer-phrase-copy.copied{color:#009b7c}
#taller .ofrece-v137-tip{display:flex;gap:12px;align-items:center;margin-top:15px;padding:14px;border-radius:14px;background:#fff6e4}
#taller .ofrece-v137-tip>span{display:grid;place-items:center;flex:none;width:39px;height:39px;background:#ffbe0b;color:white;border-radius:11px;font-size:24px}
#taller .ofrece-v137-tip strong{font-size:14px;color:#102d60}
#taller .ofrece-v137-tip p{font-size:12px;line-height:1.5;margin:4px 0 0;color:#24446e;font-style:normal}
#taller .ofrece-v137>.ofrece-scenarios-bottom{margin-top:13px!important}
#taller .ofrece-v137 .offer-scenario-list{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;align-items:start!important;gap:9px!important}
#taller .ofrece-v137 .offer-scenario{align-self:start!important;height:auto!important;min-height:0!important;overflow:hidden}
#taller .ofrece-v137 .offer-scenario-body{background:#fbfdff!important}
#taller .ofrece-v137 .offer-scenario-body>div{margin-bottom:10px}
#taller .ofrece-v137 .offer-scenario-body .offer-advisor-says{background:#eaf9f4;padding:10px;border-radius:10px}
#taller .ofrece-v137 .offer-scenario-body small{color:#295782;font-weight:800}
#taller .ofrece-v137 .copy-offer-btn{border-radius:9px}
@media(max-width:1100px){#taller .ofrece-v137-main{grid-template-columns:1fr}#taller .ofrece-v137-guide{min-height:410px}#taller .ofrece-v137 .offer-scenario-list{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:700px){#taller .ofrece-v137{padding:12px}#taller .ofrece-v137-watermark{display:none}#taller .ofrece-v137-guide{min-height:600px}#taller .ofrece-v137-guide-copy{width:100%;padding:15px}#taller .ofrece-v137-guide-image{background-image:linear-gradient(to bottom,#f5fcff 0%,#f5fcff 25%,rgba(245,252,255,.9) 45%,transparent 70%),url('../assets/ofrece-asesora-oppo-v137.png');background-size:cover;background-position:70% bottom}#taller .ofrece-v137-actions{max-width:100%}#taller .ofrece-v137 .offer-scenario-list{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:470px){#taller .ofrece-v137-phrases .connection-list{grid-template-columns:1fr!important}#taller .ofrece-v137 .offer-scenario-list{grid-template-columns:1fr!important}#taller .ofrece-v137-guide{min-height:660px}}

/* V138: refinamientos visuales de Ofrece */
#taller .ofrece-v137-header{padding-left:116px;min-height:104px}
#taller .ofrece-v138-symbol{position:absolute;left:8px;top:4px;width:88px;height:88px;display:grid;place-items:center;border-radius:22px;background:linear-gradient(145deg,#ffffff,#e8faff);color:#08b6b6;box-shadow:0 5px 18px #275a8117}
#taller .ofrece-v138-symbol svg{width:49px;height:49px}
#taller .ofrece-v137 .offer-scenario-body .offer-client-says{background:#fff0f0!important;border:1px solid #f7dddd;border-radius:10px;padding:10px}
#taller .ofrece-v137 .offer-scenario-body .offer-client-says small{color:#a54652}
#taller .ofrece-v137-guide-image{background-image:linear-gradient(90deg,#f5fcff 0%,rgba(245,252,255,.97) 25%,rgba(245,252,255,.65) 43%,rgba(245,252,255,.05) 78%),url('../assets/ofrece-asesora-oppo-v137.png');background-size:100% 100%,auto 88%;background-position:center, right bottom;background-repeat:no-repeat;background-color:#e9f8ff}
@media(max-width:700px){#taller .ofrece-v137-header{padding-left:72px;min-height:85px}#taller .ofrece-v138-symbol{width:57px;height:57px;left:2px;top:5px;border-radius:16px}#taller .ofrece-v138-symbol svg{width:35px;height:35px}#taller .ofrece-v137-guide-image{background-image:linear-gradient(to bottom,#f5fcff 0%,rgba(245,252,255,.96) 28%,rgba(245,252,255,.15) 70%),url('../assets/ofrece-asesora-oppo-v137.png');background-size:100% 100%,auto 57%;background-position:center,right bottom;background-repeat:no-repeat}}

/* V139 — Composición lateral real: texto y asesora no se superponen */
#taller .ofrece-v137-guide{background:linear-gradient(115deg,#f8fdff 0%,#effbff 57%,#dcf5fb 100%)!important;isolation:isolate}
#taller .ofrece-v137-guide-image{inset:0 0 0 51%!important;z-index:0;background-image:linear-gradient(90deg,#effbff 0%,rgba(239,251,255,.42) 13%,transparent 34%),url('../assets/ofrece-asesora-oppo-v139.png')!important;background-size:100% 100%,auto 100%!important;background-position:center,right bottom!important;background-repeat:no-repeat!important;background-color:transparent!important;filter:none!important}
#taller .ofrece-v137-guide-copy{width:53%!important;z-index:2!important;padding:22px 13px 20px 20px!important}
#taller .ofrece-v137-action{background:rgba(255,255,255,.96)!important}
@media(max-width:700px){#taller .ofrece-v137-guide{min-height:760px!important}#taller .ofrece-v137-guide-copy{width:100%!important;padding:16px!important}#taller .ofrece-v137-guide-image{inset:43% 0 0 0!important;background-image:linear-gradient(to bottom,#effbff 0%,rgba(239,251,255,.15) 22%,transparent 45%),url('../assets/ofrece-asesora-oppo-v139.png')!important;background-size:100% 100%,auto 100%!important;background-position:center,right bottom!important}}
@media(min-width:701px) and (max-width:1100px){#taller .ofrece-v137-guide-copy{width:52%!important}}

/* V140: imagen integrada como Sondea; encuadre derecho, sin corte vertical */
#taller .ofrece-v137-guide{min-height:450px!important;background:#edfaff!important;isolation:isolate!important}
#taller .ofrece-v137-guide-image{inset:0!important;z-index:0!important;background-image:linear-gradient(90deg,#f1fcff 0%,rgba(241,252,255,.99) 23%,rgba(241,252,255,.93) 36%,rgba(241,252,255,.52) 51%,rgba(241,252,255,0) 68%),url('../assets/ofrece-asesora-oppo-v140.jpg')!important;background-size:100% 100%,cover!important;background-position:center,center!important;background-repeat:no-repeat!important;filter:none!important}
#taller .ofrece-v137-guide-copy{width:54%!important;z-index:2!important;padding:22px 13px 20px 20px!important}
#taller .ofrece-v137-guide-copy>p{max-width:360px}
#taller .ofrece-v137-action{background:rgba(255,255,255,.94)!important;backdrop-filter:blur(3px)}
@media(max-width:700px){#taller .ofrece-v137-guide{min-height:730px!important}#taller .ofrece-v137-guide-copy{width:100%!important;padding:16px!important}#taller .ofrece-v137-guide-image{inset:0!important;background-image:linear-gradient(180deg,#f1fcff 0%,rgba(241,252,255,.99) 36%,rgba(241,252,255,.86) 52%,rgba(241,252,255,0) 73%),url('../assets/ofrece-asesora-oppo-v140.jpg')!important;background-size:100% 100%,auto 58%!important;background-position:center,right bottom!important}}

/* V141 — Ofrece: desplazar la asesora hacia la derecha y difuminar el borde como Sondea. */
@media (min-width:701px){
  #taller .ofrece-v137-guide-image{
    background-image:linear-gradient(90deg,#f1fcff 0%,rgba(241,252,255,.99) 27%,rgba(241,252,255,.90) 40%,rgba(241,252,255,.50) 56%,rgba(241,252,255,.08) 75%,transparent 90%),url('../assets/ofrece-asesora-oppo-v140.jpg')!important;
    background-size:100% 100%,auto 100%!important;
    background-position:center,right -55px bottom!important;
    background-repeat:no-repeat!important;
    background-color:#f1fcff!important;
  }
}