:root{--brand-red:#ff3b5c;--brand-blue:#168cff;--brand-green:#25d366;--bg:#07080c;--sidebar:#0d0f15;--surface:#11141c;--surface-2:#171b25;--line:rgba(255,255,255,.09);--text:#f6f8fc;--muted:#929aaa;--sidebar-width:248px;--container:1580px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.45;overflow-x:hidden}body.modal-open,body.menu-open{overflow:hidden}button,input,select,textarea{font:inherit}button{color:inherit}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}[hidden]{display:none!important}.container{width:min(var(--container),calc(100% - 44px));margin-inline:auto}

/* Menú lateral */
.store-sidebar{position:fixed;inset:0 auto 0 0;z-index:60;width:var(--sidebar-width);padding:20px 14px 17px;display:flex;flex-direction:column;border-right:1px solid var(--line);background:linear-gradient(180deg,#0e1017,#090b10)}.sidebar-brand{padding:0 7px 22px}.sidebar-brand>a{display:flex;align-items:center;gap:11px}.sidebar-brand img{width:48px;height:48px;object-fit:cover;border-radius:50%;box-shadow:0 0 0 3px rgba(22,140,255,.1)}.sidebar-brand span,.sidebar-brand strong,.sidebar-brand small{min-width:0;display:block}.sidebar-brand strong{overflow:hidden;font-size:.79rem;letter-spacing:.055em;white-space:nowrap;text-overflow:ellipsis}.sidebar-brand small{margin-top:2px;color:#8690a3;font-size:.61rem}.sidebar-brand>button{display:none}.sidebar-nav{display:grid;gap:5px}.sidebar-nav>a,.sidebar-category-menu>summary{min-height:48px;padding:0 13px;display:grid;grid-template-columns:25px 1fr auto;align-items:center;gap:8px;border:1px solid transparent;border-radius:11px;color:#afb7c7;font-size:.76rem;font-weight:750;cursor:pointer;list-style:none}.sidebar-nav>a:hover,.sidebar-nav>a.active,.sidebar-category-menu[open]>summary{border-color:rgba(22,140,255,.14);background:rgba(22,140,255,.11);color:#fff}.sidebar-nav>a.active{box-shadow:inset 3px 0 var(--brand-blue)}.sidebar-nav i,.sidebar-category-menu i{width:25px;height:25px;display:grid;place-items:center;border-radius:8px;background:rgba(255,255,255,.045);color:#79bcff;font-style:normal;font-size:.9rem}.sidebar-nav>a:nth-of-type(2) i{color:#ffe463}.sidebar-nav>a:nth-last-of-type(2) i{color:#ff9c51}.sidebar-nav>a:last-child i{color:#46e4b0}.sidebar-category-menu>summary::-webkit-details-marker{display:none}.sidebar-category-menu>summary b{color:#778196;font-size:.68rem;transition:.2s}.sidebar-category-menu[open]>summary b{transform:rotate(180deg)}.sidebar-category-menu>div{max-height:245px;margin:4px 0 7px 33px;padding-left:11px;display:grid;overflow-y:auto;border-left:1px solid var(--line)}.sidebar-category-menu>div a{min-height:34px;padding:0 7px;display:flex;align-items:center;justify-content:space-between;gap:8px;border-radius:7px;color:#8993a6;font-size:.62rem;font-weight:700}.sidebar-category-menu>div a:hover{color:#fff;background:rgba(255,255,255,.035)}.sidebar-category-menu>div small{min-width:19px;height:19px;display:grid;place-items:center;border-radius:6px;background:rgba(255,255,255,.045);font-size:.52rem}.sidebar-bottom{margin-top:auto;padding:15px 10px 4px;border-top:1px solid var(--line)}.sidebar-bottom>span{color:#63b5ff;font-size:.55rem;font-weight:850;letter-spacing:.13em}.sidebar-bottom p{margin:6px 0 12px;color:#858fa1;font-size:.62rem}.sidebar-bottom a{min-height:39px;display:flex;align-items:center;justify-content:center;border-radius:9px;background:var(--brand-green);color:#052812;font-size:.66rem;font-weight:850}

/* Cabecera y buscador */
.store-shell{min-height:100vh;margin-left:var(--sidebar-width);display:flex;flex-direction:column}.store-topbar{position:sticky;top:0;z-index:45;min-height:72px;padding:12px 25px;display:grid;grid-template-columns:minmax(280px,680px) auto;align-items:center;justify-content:space-between;gap:25px;border-bottom:1px solid var(--line);background:rgba(8,10,14,.94);backdrop-filter:blur(18px)}.mobile-menu-button,.mobile-brand{display:none}.global-search{position:relative;width:min(680px,100%);height:45px;display:flex;align-items:center;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.035)}.global-search>span{padding-left:14px;color:#7f899b}.global-search input{min-width:0;width:100%;height:43px;padding:0 11px;border:0;outline:0;background:transparent;color:#fff;font-size:.76rem}.global-search button{height:35px;margin-right:5px;padding:0 16px;border:0;border-radius:9px;background:linear-gradient(110deg,var(--brand-blue),#5e65eb);color:#fff;font-size:.66rem;font-weight:850;cursor:pointer}.search-suggestions{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:70;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:#131721;box-shadow:0 24px 65px rgba(0,0,0,.52)}.search-suggestions a{min-height:60px;padding:8px 11px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line)}.search-suggestions a:last-child{border-bottom:0}.search-suggestions img,.suggestion-placeholder{width:42px;height:42px;flex:none;object-fit:cover;border-radius:9px}.suggestion-placeholder{display:grid;place-items:center;background:linear-gradient(135deg,var(--brand-blue),var(--brand-red));font-size:.65rem;font-weight:850}.search-suggestions strong,.search-suggestions small{display:block}.search-suggestions strong{font-size:.7rem}.search-suggestions small{margin-top:2px;color:var(--muted);font-size:.58rem}.topbar-whatsapp{display:flex;align-items:center;gap:10px}.topbar-whatsapp:before{content:"";width:10px;height:10px;border-radius:50%;background:var(--brand-green);box-shadow:0 0 0 5px rgba(37,211,102,.1)}.topbar-whatsapp span,.topbar-whatsapp b{display:block}.topbar-whatsapp span{font-size:.68rem;font-weight:800}.topbar-whatsapp b{color:#75dfa0;font-size:.55rem}.store-content{min-height:70vh;flex:1;background:radial-gradient(circle at 7% 0,rgba(22,140,255,.065),transparent 24%),radial-gradient(circle at 96% 8%,rgba(255,59,92,.045),transparent 23%)}

/* Encabezado compacto y accesos */
.catalog-home,.catalog-page{padding-top:26px;padding-bottom:65px}.catalog-welcome,.catalog-page-heading,.category-page-heading{min-height:118px;padding:22px 25px;display:flex;align-items:center;justify-content:space-between;gap:25px;border:1px solid var(--line);border-radius:17px;background:linear-gradient(105deg,rgba(22,140,255,.095),rgba(17,20,28,.92) 45%,rgba(255,59,92,.055))}.catalog-welcome>div>span,.catalog-page-heading span,.category-page-heading span,.catalog-section>header span,.content-page>header>span{color:#70bbff;font-size:.58rem;font-weight:850;letter-spacing:.14em}.catalog-welcome h1,.catalog-page-heading h1,.category-page-heading h1{margin:5px 0 4px;font-size:clamp(1.75rem,3vw,2.9rem);line-height:1;letter-spacing:-.04em}.catalog-welcome p,.catalog-page-heading p,.category-page-heading p{max-width:760px;margin:0;color:#9ba4b4;font-size:.72rem}.catalog-welcome>a,.catalog-page-heading>button{min-height:40px;padding:0 14px;display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.035);color:#cdd3de;font-size:.64rem;font-weight:800;cursor:pointer}.category-page-heading>b{padding:8px 11px;border-radius:9px;background:rgba(22,140,255,.1);color:#88c8ff;font-size:.65rem}

.service-rail{margin:17px 0 0;padding:11px;display:flex;gap:8px;overflow-x:auto;border:1px solid var(--line);border-radius:15px;background:#0c0e13;scrollbar-width:thin;scrollbar-color:#303746 transparent}.service-chip{width:86px;min-width:86px;height:102px;padding:7px 6px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line);border-radius:11px;background:#11141b;color:#fff;cursor:pointer}.service-chip:hover,.service-chip:focus-visible{border-color:var(--brand-green);box-shadow:inset 0 0 0 1px var(--brand-green)}.service-chip img,.service-chip>span{width:53px;height:53px;object-fit:cover;border-radius:11px}.service-chip>span{display:grid;place-items:center;background:linear-gradient(135deg,var(--brand-blue),#7150df,var(--brand-red));font-size:.62rem;font-weight:900}.service-chip strong{max-width:75px;overflow:hidden;font-size:.57rem;white-space:nowrap;text-overflow:ellipsis}.all-services{border-color:rgba(37,211,102,.45)}.all-services>span{background:linear-gradient(135deg,#0f7,#168cff,#ff3b5c)}

.category-shortcuts{margin-top:14px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.category-shortcuts>a{min-height:55px;padding:8px 10px;display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:8px;border:1px solid var(--line);border-radius:11px;background:var(--surface)}.category-shortcuts>a:hover{border-color:rgba(22,140,255,.35);background:#151a25}.category-shortcuts>a>span{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:linear-gradient(135deg,var(--brand-blue),#7548df,var(--brand-red));font-size:.65rem;font-weight:900}.category-shortcuts strong{overflow:hidden;font-size:.66rem;white-space:nowrap;text-overflow:ellipsis}.category-shortcuts small{color:#7f899a;font-size:.56rem}

/* Secciones y tarjetas */
.catalog-section{padding-top:38px;scroll-margin-top:86px}.catalog-section>header{min-height:48px;margin-bottom:13px;padding-bottom:10px;display:flex;align-items:end;justify-content:space-between;gap:15px;border-bottom:1px solid var(--line)}.catalog-section>header h2{margin:3px 0 0;font-size:1.28rem;letter-spacing:-.025em}.catalog-section>header h2 small{color:#778194;font-size:.65rem;font-weight:600}.catalog-section>header>a{color:#83c6ff;font-size:.6rem;font-weight:800}.product-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px 13px}.product-card{min-width:0}.product-media{position:relative;width:100%;aspect-ratio:.78;padding:0;display:block;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:linear-gradient(145deg,#171b25,#0d0f15);cursor:pointer;box-shadow:0 15px 35px rgba(0,0,0,.17)}.product-media img{width:100%;height:100%;object-fit:cover;transition:.25s}.product-media:hover img{transform:scale(1.035)}.product-initials{width:100%;height:100%;display:grid;place-items:center;background:radial-gradient(circle at 30% 20%,rgba(255,255,255,.15),transparent 25%),linear-gradient(145deg,var(--brand-blue),#7149df 55%,var(--brand-red));font-size:2rem;font-weight:950}.featured-badge,.availability{position:absolute;top:7px;z-index:2;padding:4px 7px;border-radius:7px;font-size:.48rem;font-weight:850}.featured-badge{left:7px;background:#ffe066;color:#281f00}.availability{right:7px}.availability.unavailable{background:#b52c45}.availability.soon{background:#d99b25;color:#211400}.media-hint{position:absolute;left:8px;right:8px;bottom:8px;min-height:27px;display:flex;align-items:center;justify-content:center;border-radius:7px;background:rgba(5,7,11,.82);color:#fff;font-size:.5rem;font-weight:800;opacity:0;transform:translateY(4px);transition:.2s}.product-media:hover .media-hint{opacity:1;transform:none}.product-card-body{padding:9px 4px 0}.card-category{display:block;overflow:hidden;color:#758095;font-size:.49rem;font-weight:750;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;text-overflow:ellipsis}.product-title{width:100%;margin:3px 0 5px;padding:0;display:block;overflow:hidden;border:0;background:transparent;color:#f8f9fd;text-align:left;font-size:.72rem;font-weight:850;white-space:nowrap;text-overflow:ellipsis;cursor:pointer}.card-price{min-height:24px;display:flex;align-items:baseline;gap:7px}.card-price s{color:#7f8999;font-size:.59rem}.card-price strong{color:#60e7ed;font-size:.84rem}.product-select{width:100%;min-height:35px;margin-top:7px;border:0;border-radius:8px;background:linear-gradient(105deg,#5ee3e9,#58dff0 45%,#6bd8e9);color:#06252a;font-size:.62rem;font-weight:900;cursor:pointer}.product-select:hover{filter:brightness(1.08)}.product-select:disabled{background:#242833;color:#788193;cursor:not-allowed}.empty-catalog{padding:65px 20px;text-align:center;color:var(--muted)}.empty-catalog h1,.empty-catalog h2{color:#fff}.empty-catalog>a{display:inline-flex;margin-top:12px;padding:10px 14px;border-radius:9px;background:var(--brand-blue);color:#fff;font-size:.68rem;font-weight:850}
.offer-card-badge{
    position:absolute;
    left:7px;
    bottom:7px;
    z-index:2;
    padding:4px 8px;
    border-radius:7px;
    background:#e11d48;
    color:#fff;
    font-size:.48rem;
    font-weight:900;
    letter-spacing:.04em;
    box-shadow:0 6px 16px rgba(225,29,72,.35);
}
/* Catálogo y filtros */
.catalog-filters{margin:15px 0 26px;padding:13px;border:1px solid var(--line);border-radius:13px;background:var(--surface)}.catalog-filters form{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr auto;align-items:end;gap:9px}.catalog-filters label,.category-toolbar{color:#9ba4b4;font-size:.57rem;font-weight:750}.catalog-filters input,.catalog-filters select,.category-toolbar input,.category-toolbar select{width:100%;height:39px;margin-top:5px;padding:0 10px;border:1px solid var(--line);border-radius:8px;outline:0;background:#0d1016;color:#fff;font-size:.66rem}.catalog-filters select option,.category-toolbar select option{color:#111}.filter-actions{height:39px;display:flex;gap:6px}.filter-actions button,.filter-actions a,.category-toolbar button{height:39px;padding:0 12px;display:flex;align-items:center;justify-content:center;border:0;border-radius:8px;background:var(--brand-blue);color:#fff;font-size:.59rem;font-weight:850;cursor:pointer}.filter-actions a{border:1px solid var(--line);background:transparent;color:#aeb6c5}.catalog-page-heading>button{display:none}.category-toolbar{margin:15px 0 26px;display:grid;grid-template-columns:1fr 180px 82px;gap:8px}.category-toolbar input,.category-toolbar select{margin:0}.pagination{display:flex;justify-content:center;gap:6px;margin-top:31px}.pagination a{width:35px;height:35px;display:grid;place-items:center;border:1px solid var(--line);border-radius:8px;color:#8b95a6;font-size:.63rem}.pagination a.active{border-color:transparent;background:var(--brand-blue);color:#fff}

/* Ventanas flotantes */
.store-modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px}.store-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.76);backdrop-filter:blur(5px)}.store-modal-panel{position:relative;z-index:1;width:min(800px,100%);max-height:min(780px,calc(100vh - 34px));overflow-y:auto;border:1px solid rgba(255,255,255,.13);border-radius:19px;background:#121620;box-shadow:0 35px 100px rgba(0,0,0,.65)}.store-modal-close{position:absolute;top:11px;right:11px;z-index:3;width:36px;height:36px;padding:0;border:1px solid var(--line);border-radius:9px;background:rgba(8,10,15,.88);color:#fff;font-size:1.2rem;cursor:pointer}.modal-loading{min-height:210px;display:grid;place-items:center;color:#8993a5;font-size:.72rem}.modal-product-info{display:grid;grid-template-columns:minmax(240px,.82fr) 1.18fr}.modal-product-media{min-height:460px;background:#0a0c11}.modal-product-media img{width:100%;height:100%;object-fit:cover}.modal-product-media>span,.order-modal-image>span{width:100%;height:100%;display:grid;place-items:center;background:linear-gradient(145deg,var(--brand-blue),#7049dd,var(--brand-red));font-size:2rem;font-weight:950}.modal-product-copy{padding:46px 35px 31px}.modal-product-copy>span,.order-modal-header>div>span{color:#71bdff;font-size:.57rem;font-weight:850;letter-spacing:.12em}.modal-product-copy h2{margin:6px 0 10px;font-size:2rem;line-height:1.04;letter-spacing:-.04em}.modal-price-line{display:flex;align-items:baseline;gap:9px}.modal-price-line s{color:#7d8797;font-size:.72rem}.modal-price-line strong{color:#5ce3eb;font-size:1.15rem}.modal-short{margin:15px 0;color:#b1b9c7;font-size:.75rem;font-weight:650}.modal-description{max-height:220px;overflow-y:auto;white-space:pre-line;color:#929cab;font-size:.69rem;line-height:1.65}.modal-actions{margin-top:23px;display:flex;gap:8px}.modal-primary,.modal-secondary{min-height:42px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:9px;font-size:.64rem;font-weight:850;cursor:pointer}.modal-primary{flex:1;background:linear-gradient(110deg,var(--brand-blue),#7551df,var(--brand-red));color:#fff}.modal-secondary{border:1px solid var(--line);background:transparent;color:#bbc3d0}

.order-modal-panel{width:min(600px,100%);padding:30px}.order-modal-header{padding-right:40px;display:flex;align-items:center;gap:13px}.order-modal-image{width:70px;height:83px;flex:none;overflow:hidden;border-radius:11px;background:#0c0f15}.order-modal-image img{width:100%;height:100%;object-fit:cover}.order-modal-image>span{font-size:.85rem}.order-modal-header h2{margin:4px 0 0;font-size:1.42rem;line-height:1.05}.order-modal-panel fieldset{margin:22px 0 0;padding:0;border:0}.order-modal-panel legend{margin-bottom:9px;color:#b9c1cf;font-size:.65rem;font-weight:800}.modal-plan-picker>div{display:grid;gap:7px}.modal-plan-option{min-height:58px;padding:8px 11px;display:grid;grid-template-columns:18px 1fr auto;align-items:center;gap:9px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.025);cursor:pointer}.modal-plan-option:has(input:checked){border-color:var(--brand-blue);background:rgba(22,140,255,.09)}.modal-plan-option.disabled{opacity:.48;cursor:not-allowed}.modal-plan-option input{accent-color:var(--brand-blue)}.modal-plan-option span strong,.modal-plan-option span small{display:block}.modal-plan-option span strong{font-size:.67rem}.modal-plan-option span small{margin-top:2px;color:#8791a2;font-size:.56rem}.modal-plan-option>b{color:#63e2e8;font-size:.66rem}.modal-quantity{display:flex;align-items:center;justify-content:space-between;gap:15px}.modal-quantity legend{float:left;margin:0}.quantity-control{display:flex;align-items:center;border:1px solid var(--line);border-radius:9px;background:#0c0f15}.quantity-control button{width:37px;height:37px;padding:0;border:0;background:transparent;color:#fff;cursor:pointer}.quantity-control input{width:43px;height:37px;padding:0;border:0;border-inline:1px solid var(--line);outline:0;background:transparent;color:#fff;text-align:center;font-size:.72rem;font-weight:800;-moz-appearance:textfield}.quantity-control input::-webkit-inner-spin-button{display:none}.modal-quantity small{color:#7f899b;font-size:.55rem}.order-summary{margin-top:20px;padding:15px;display:flex;align-items:center;justify-content:space-between;border:1px solid var(--line);border-radius:11px;background:#0c0f15}.order-summary>span{color:#aab3c2;font-size:.65rem}.order-summary>div{display:flex;align-items:baseline;gap:7px}.order-summary s{color:#737d8e;font-size:.62rem}.order-summary strong{color:#5ce2e9;font-size:1.05rem}.modal-whatsapp{width:100%;height:47px;margin-top:12px;border:0;border-radius:10px;background:var(--brand-green);color:#052812;font-size:.7rem;font-weight:900;cursor:pointer}.modal-whatsapp:disabled{background:#26312b;color:#73877a;cursor:not-allowed}.modal-order-note{margin:9px 0 0;color:#798395;text-align:center;font-size:.54rem}

/* Páginas informativas */
.content-page,.contact-page,.legal-page{padding-top:48px;padding-bottom:70px}.content-page>header{max-width:850px}.content-page h1,.contact-page h1,.legal-page h1{margin:7px 0 11px;font-size:clamp(2.35rem,5vw,4.6rem);line-height:1;letter-spacing:-.055em}.content-page>header p,.contact-page p,.legal-page p{color:#9ba4b4}.steps-grid{margin-top:28px;display:grid;grid-template-columns:repeat(3,1fr);gap:11px}.steps-grid article,.legal-page section,.contact-page aside{padding:22px;border:1px solid var(--line);border-radius:15px;background:var(--surface)}.steps-grid b{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:linear-gradient(135deg,var(--brand-blue),var(--brand-red));font-size:.75rem}.steps-grid h2{margin:13px 0 4px;font-size:1rem}.steps-grid p{margin:0;color:#8f99aa;font-size:.68rem}.content-whatsapp,.contact-page section>a{min-height:42px;margin-top:20px;padding:0 15px;display:inline-flex;align-items:center;border-radius:9px;background:var(--brand-green);color:#062812;font-size:.67rem;font-weight:850}.contact-page{min-height:540px;display:grid;grid-template-columns:1.2fr .8fr;gap:32px;align-items:center}.contact-page>section>span,.legal-page>span{color:#70bcff;font-size:.58rem;font-weight:850;letter-spacing:.14em}.contact-page dl{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:0}.contact-page dt{font-size:.68rem;font-weight:800}.contact-page dd{margin:0;color:#8f99aa;text-align:right;font-size:.68rem}.legal-page section{max-width:850px}.legal-page h2{margin:21px 0 6px;font-size:1rem}.legal-page h2:first-child{margin-top:0}.legal-page p{font-size:.73rem}.legal-note{padding-top:15px;border-top:1px solid var(--line)}

/* Pie */
.store-footer{min-height:94px;padding:20px 25px;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:30px;border-top:1px solid var(--line);background:#0a0c11}.store-footer>div{display:flex;align-items:center;gap:10px}.store-footer img{border-radius:50%}.store-footer strong,.store-footer small{display:block}.store-footer strong{font-size:.7rem}.store-footer small{color:#7e889a;font-size:.56rem}.store-footer nav{display:flex;gap:17px}.store-footer nav a{color:#929cad;font-size:.58rem;font-weight:700}.store-footer>p{color:#687284;font-size:.54rem}.floating-whatsapp{position:fixed;right:17px;bottom:17px;z-index:55;width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:var(--brand-green);color:#062812;font-size:.58rem;font-weight:950;box-shadow:0 12px 36px rgba(37,211,102,.28)}

@media(max-width:1500px){.product-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.category-shortcuts{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1240px){:root{--sidebar-width:225px}.product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.catalog-filters form{grid-template-columns:1.2fr 1fr 1fr}.filter-actions{grid-column:auto}.store-topbar{padding-inline:18px}}
@media(max-width:920px){:root{--sidebar-width:0px}.store-sidebar{width:min(320px,88vw);transform:translateX(-105%);transition:.22s}.store-sidebar.open{transform:none;box-shadow:35px 0 90px rgba(0,0,0,.6)}.sidebar-brand>button{position:absolute;top:23px;right:16px;width:34px;height:34px;padding:0;display:block;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.04);color:#fff;font-size:1.2rem}.store-menu-overlay{position:fixed;inset:0;z-index:59;display:block;background:rgba(0,0,0,.68);backdrop-filter:blur(3px)}.store-shell{margin-left:0}.store-topbar{min-height:64px;padding:9px 13px;grid-template-columns:40px minmax(0,1fr) 42px;gap:8px}.mobile-menu-button{width:40px;height:40px;padding:0;display:grid;place-content:center;gap:4px;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.035)}.mobile-menu-button i{width:18px;height:2px;display:block;background:#fff}.mobile-brand{min-width:0;display:flex;align-items:center;gap:8px}.mobile-brand img{width:36px;height:36px;border-radius:50%}.mobile-brand strong{overflow:hidden;font-size:.68rem;letter-spacing:.04em;white-space:nowrap;text-overflow:ellipsis}.store-topbar>.global-search{grid-column:1/-1;grid-row:2;width:100%;height:40px}.global-search input{height:38px}.global-search button{height:32px}.topbar-whatsapp{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:var(--brand-green)}.topbar-whatsapp:before{width:8px;height:8px;background:#052812;box-shadow:none}.topbar-whatsapp span,.topbar-whatsapp b{display:none}.category-shortcuts{grid-template-columns:repeat(2,minmax(0,1fr))}.product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.store-footer{grid-template-columns:1fr auto}.store-footer nav{grid-row:2;grid-column:1/-1;flex-wrap:wrap}.store-footer>p{grid-column:2}.catalog-filters form{grid-template-columns:repeat(2,1fr)}.filter-actions{grid-column:1/-1}.modal-product-info{grid-template-columns:260px 1fr}.modal-product-media{min-height:420px}}
@media(max-width:700px){.container{width:calc(100% - 20px)}.catalog-home,.catalog-page{padding-top:14px;padding-bottom:45px}.catalog-welcome,.catalog-page-heading,.category-page-heading{min-height:auto;padding:16px;align-items:flex-start;border-radius:13px}.catalog-welcome h1,.catalog-page-heading h1,.category-page-heading h1{font-size:1.65rem}.catalog-welcome p,.catalog-page-heading p,.category-page-heading p{font-size:.64rem}.catalog-welcome>a{display:none}.catalog-page-heading>button{display:inline-flex;flex:none}.service-rail{margin-top:10px;padding:8px;gap:6px;border-radius:11px}.service-chip{width:70px;min-width:70px;height:84px;padding:5px}.service-chip img,.service-chip>span{width:43px;height:43px;border-radius:9px}.service-chip strong{max-width:61px;font-size:.49rem}.category-shortcuts{margin-top:9px;gap:6px}.category-shortcuts>a{min-height:48px;padding:6px;grid-template-columns:30px minmax(0,1fr) auto;gap:6px}.category-shortcuts>a>span{width:30px;height:30px}.category-shortcuts strong{font-size:.56rem}.catalog-section{padding-top:29px}.catalog-section>header{min-height:43px;margin-bottom:9px}.catalog-section>header h2{font-size:1.05rem}.catalog-section>header>a{font-size:.52rem}.product-grid,.catalog-results .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 8px}.product-media{border-radius:11px}.media-hint{display:none}.featured-badge,.availability{top:5px;padding:3px 5px;font-size:.42rem}.featured-badge{left:5px}.availability{right:5px}.offer-card-badge{
    left:5px;
    bottom:5px;
    padding:3px 6px;
    font-size:.42rem;
}.product-card-body{padding:7px 2px 0}.card-category{font-size:.42rem}.product-title{font-size:.64rem}.card-price{gap:5px}.card-price s{font-size:.52rem}.card-price strong{font-size:.73rem}.product-select{min-height:33px;margin-top:5px;font-size:.56rem}.catalog-filters{display:none;margin-top:9px}.catalog-filters.open{display:block}.catalog-filters form{grid-template-columns:1fr}.filter-actions{grid-column:auto}.category-toolbar{grid-template-columns:1fr 105px 65px;margin-block:10px 20px}.category-toolbar input,.category-toolbar select,.category-toolbar button{height:36px;font-size:.55rem}.store-modal{padding:10px;align-items:end}.store-modal-panel{max-height:calc(100vh - 18px);border-radius:17px 17px 12px 12px}.modal-product-info{display:block}.modal-product-media{min-height:0;height:250px}.modal-product-media img{object-fit:contain;background:#090b10}.modal-product-copy{padding:25px 18px 19px}.modal-product-copy h2{font-size:1.55rem}.modal-description{max-height:180px}.modal-actions{flex-direction:column-reverse}.modal-primary,.modal-secondary{width:100%}.order-modal-panel{padding:24px 15px 17px}.order-modal-header h2{font-size:1.12rem}.order-modal-image{width:58px;height:69px}.modal-plan-option{min-height:54px;padding:7px}.modal-quantity{flex-wrap:wrap}.modal-quantity small{width:100%}.store-footer{padding:20px 14px;display:block}.store-footer nav{margin-top:16px}.store-footer>p{margin:14px 0 0}.steps-grid{grid-template-columns:1fr}.contact-page{display:block}.contact-page aside{margin-top:22px}.content-page h1,.contact-page h1,.legal-page h1{font-size:2.4rem}.floating-whatsapp{right:10px;bottom:10px;width:43px;height:43px}}
@media(max-width:370px){.container{width:calc(100% - 14px)}.product-grid,.catalog-results .product-grid{gap:14px 6px}.product-title{font-size:.59rem}.product-select{font-size:.52rem}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.section-header{min-height:48px;margin-bottom:13px;padding-bottom:10px;display:flex;align-items:end;justify-content:space-between;gap:15px;border-bottom:1px solid var(--line)}.section-header span{color:#70bbff;font-size:.58rem;font-weight:850;letter-spacing:.14em}.section-header h2{margin:3px 0 0;font-size:1.28rem}.section-header>a{color:#83c6ff;font-size:.6rem;font-weight:800}
.product-media img,.modal-product-media img{object-fit:contain;background:#090b10}
@media(max-width:700px){.store-modal{align-items:center;padding:14px}.store-modal-panel{width:min(92vw,460px);max-height:80vh;border-radius:15px}.info-modal-panel{width:min(90vw,430px)}.modal-product-media{height:165px}.modal-product-copy{padding:18px 16px 16px}.modal-product-copy h2{font-size:1.35rem}.modal-short{margin:10px 0;font-size:.67rem}.modal-description{max-height:130px;font-size:.62rem}.modal-actions{margin-top:15px}.order-modal-panel{width:min(92vw,420px);padding:20px 14px 14px}.order-modal-header{gap:10px}.order-modal-image{width:50px;height:58px}.order-modal-panel fieldset{margin-top:15px}.modal-plan-option{min-height:48px}.order-summary{margin-top:14px;padding:11px}.modal-whatsapp{height:43px}.product-media{aspect-ratio:.92}.service-chip{width:62px;min-width:62px;height:75px}.service-chip img,.service-chip>span{width:36px;height:36px}.service-chip strong{max-width:53px;font-size:.45rem}.category-shortcuts>a{grid-template-columns:26px minmax(0,1fr) auto}.category-shortcuts>a>span{width:26px;height:26px;font-size:.56rem}}

/* Cabecera y pie simplificados */
@media(min-width:921px){.store-topbar{display:none}}
@media(max-width:920px){.store-topbar{grid-template-columns:40px minmax(0,1fr)}}
.store-footer{grid-template-columns:1fr}

/* Centrar título de la tienda y pie de página */
.catalog-page-heading {
    justify-content: center;
    text-align: center;
}

.catalog-page-heading > div {
    width: 100%;
}

.store-footer {
    justify-items: center;
    text-align: center;
}

.store-footer > div {
    width: 100%;
    justify-content: center;
}


/* Ventana compacta de información del producto */
.store-modal-backdrop {
    background: rgba(0, 0, 0, 0.52);
    backdrop-filter: blur(2px);
}

.info-modal-panel {
    width: min(650px, calc(100vw - 28px));
    max-height: calc(100vh - 28px);
    border-radius: 16px;
}

.info-modal-panel .modal-product-info {
    position: relative;
    min-height: 220px;
    padding: 76px 20px 20px;
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    align-items: center;
    gap: 18px;
}

.info-modal-panel .modal-product-copy {
    display: contents;
}

.info-modal-panel .modal-product-copy h2 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    min-height: 57px;
    margin: 0;
    padding: 16px 55px 14px 18px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--line);
    font-size: 1.15rem;
    line-height: 1.2;
}

.info-modal-panel .modal-product-media {
    width: 120px;
    height: 140px;
    min-height: 0;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #0a0c11;
}

.info-modal-panel .modal-product-media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.info-modal-panel .modal-description {
    grid-column: 2;
    max-height: 170px;
    overflow-y: auto;
    color: #c5ccda;
    font-size: 0.72rem;
    line-height: 1.65;
    white-space: pre-line;
}

@media (max-width: 700px) {
    .info-modal-panel {
        width: min(92vw, 430px);
    }

    .info-modal-panel .modal-product-info {
        min-height: 190px;
        padding: 68px 14px 16px;
        grid-template-columns: 86px minmax(0, 1fr);
        gap: 12px;
    }

    .info-modal-panel .modal-product-copy h2 {
        min-height: 53px;
        padding: 14px 48px 12px 14px;
        font-size: 0.95rem;
    }

    .info-modal-panel .modal-product-media {
        width: 86px;
        height: 105px;
    }

    .info-modal-panel .modal-description {
        grid-column: 2;
        max-height: 140px;
        font-size: 0.65rem;
        line-height: 1.55;
    }
}

/* =========================================
   IMÁGENES COMPLETAS EN SERVICIOS SUPERIORES
   ========================================= */

.service-chip img {
    width: 60px;
    height: 78px;
    padding: 3px;
    object-fit: contain;
    border: 1px solid #e0e4ea;
    border-radius: 11px;
    background: #f3f5f8;
}

.service-chip:hover img {
    object-fit: contain;
}

@media (max-width: 700px) {
    .service-chip img {
        width: 54px;
        height: 70px;
        padding: 3px;
        border-radius: 10px;
    }
}

/* Servicios superiores más compactos */
.service-rail {
    padding: 8px;
    gap: 6px;
}

.service-chip {
    width: 74px;
    min-width: 74px;
    height: 88px;
    padding: 6px 5px;
    gap: 5px;
}

.service-chip img,
.service-chip > span {
    width: 42px;
    height: 42px;
    border-radius: 9px;
}

.service-chip strong {
    max-width: 64px;
    font-size: 0.51rem;
}

.service-chip.active-service {
    border-color: var(--brand-green);
    box-shadow: inset 0 0 0 1px var(--brand-green);
}

/* Imágenes de productos más pequeñas en PC */
.product-media {
    width: min(145px, 78%);
    margin-inline: auto;
    aspect-ratio: 0.72;
}

/* Tamaños compactos para celular */
@media (max-width: 700px) {
    .service-rail {
        padding: 6px;
        gap: 5px;
    }

    .service-chip {
        width: 54px;
        min-width: 54px;
        height: 66px;
        padding: 4px 3px;
        gap: 3px;
    }

    .service-chip img,
    .service-chip > span {
        width: 31px;
        height: 31px;
        border-radius: 7px;
    }

    .service-chip strong {
        max-width: 48px;
        font-size: 0.42rem;
    }

    .product-grid,
    .catalog-results .product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .product-media {
        width: min(105px, 72%);
        margin-inline: auto;
        aspect-ratio: 0.72;
    }
}

/* Tarjetas de productos compactas en computadora */
@media (min-width: 701px) {
    .product-grid,
    .catalog-results .product-grid {
        grid-template-columns: repeat(auto-fill, 170px);
        justify-content: start;
        gap: 28px 24px;
    }

    .product-card {
        width: 170px;
    }

    .product-media {
        width: 112px;
        margin-inline: auto;
        aspect-ratio: 0.72;
    }

    .product-card-body {
        width: 100%;
    }
}

/* Centrar nombre y contenido de las tarjetas */
.product-card-body {
    text-align: center;
}

.product-title {
    text-align: center;
}

/* Página Cómo comprar centrada */
.content-page {
    text-align: center;
}

.content-page > header {
    margin-inline: auto;
}

.steps-grid article {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.steps-grid b {
    margin-inline: auto;
}

/* Página de contacto centrada */
.contact-page {
    text-align: center;
}

.contact-page > section,
.contact-page > aside {
    text-align: center;
}

.contact-page dl {
    width: fit-content;
    max-width: 100%;
    margin: 20px auto 0;
    grid-template-columns: auto auto;
    justify-content: center;
}

.contact-page dt,
.contact-page dd {
    text-align: center;
}

/* Tamaño del icono real de WhatsApp */
.floating-whatsapp svg {
    width: 25px;
    height: 25px;
    display: block;
    fill: currentColor;
}

/* Forzar centrado del nombre de cada producto */
.product-card .product-card-body > .product-title {
    width: 100%;
    display: block;
    text-align: center !important;
}

/* =========================================
   TEMA CLARO - MENÚ NEGRO
   ========================================= */

:root {
    --bg: #f6f7fb;
    --surface: #ffffff;
    --surface-2: #f1f3f7;
    --line: rgba(15, 23, 42, .10);
    --text: #111827;
    --muted: #667085;
}

body {
    background: #f6f7fb;
    color: #111827;
}

.store-content {
    background:
        linear-gradient(
            180deg,
            #f7f8fb 0,
            #ffffff 38%,
            #f7f8fb 100%
        );
}

/* Menú negro */

.store-sidebar {
    --line: rgba(255, 255, 255, .08);
    color: #f7f8fb;
    border-right-color: rgba(15, 23, 42, .22);
    background: linear-gradient(180deg, #101218, #090b10);
}

.sidebar-brand strong {
    color: #ffffff;
}

.sidebar-brand small {
    color: #8f98a8;
}

.sidebar-nav > a,
.sidebar-category-menu > summary {
    color: #aeb6c5;
}

.sidebar-category-menu > div a {
    color: #909aaa;
}

.sidebar-category-menu > div a:hover {
    color: #ffffff;
}

/* Barra superior del teléfono */

.store-topbar {
    --line: rgba(255, 255, 255, .09);
    color: #ffffff;
    border-bottom-color: rgba(15, 23, 42, .18);
    background: rgba(10, 12, 17, .97);
}

.mobile-brand strong {
    color: #ffffff;
}

.mobile-menu-button {
    border-color: rgba(255, 255, 255, .12);
    background: rgba(255, 255, 255, .05);
}

.mobile-menu-button i {
    background: #ffffff;
}

/* Servicios superiores */

.service-rail {
    border-color: #e2e6ed;
    background: #ffffff;
    box-shadow: 0 8px 30px rgba(15, 23, 42, .045);
    scrollbar-color: #c9ced8 transparent;
}

.service-chip {
    border-color: #e3e6ec;
    background: #f8f9fb;
    color: #202633;
    box-shadow: 0 2px 7px rgba(15, 23, 42, .025);
}

.service-chip:hover,
.service-chip:focus-visible,
.service-chip.active-service {
    border-color: var(--brand-blue);
    background: #ffffff;
    box-shadow: 0 5px 18px rgba(22, 140, 255, .12);
}

.all-services {
    border-color: rgba(37, 211, 102, .55);
}

/* Títulos y separadores */

.catalog-page,
.catalog-home,
.category-page,
.content-page,
.contact-page,
.legal-page {
    color: #111827;
}

.catalog-page-heading,
.catalog-welcome,
.category-page-heading {
    border-color: #e1e5ec;
    background: linear-gradient(105deg, #ffffff, #f7f9fc);
    box-shadow: 0 6px 24px rgba(15, 23, 42, .035);
}

.catalog-page-heading h1,
.catalog-welcome h1,
.category-page-heading h1,
.catalog-section > header h2,
.section-header h2,
.catalog-results > section > header h2,
.catalog-results h2,
.content-page h1,
.contact-page h1,
.legal-page h1 {
    color: #111827;
}

.catalog-page-heading p,
.catalog-welcome p,
.category-page-heading p {
    color: #707a8c;
}

.catalog-section > header,
.section-header,
.catalog-results > section > header {
    border-bottom-color: #e2e5eb;
}

.catalog-section > header span,
.section-header span,
.catalog-results > section > header span,
.catalog-results .category-label {
    color: var(--brand-blue);
}

/* Productos */

.product-card {
    padding: 9px;
    border: 1px solid #e4e7ed;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 7px 22px rgba(15, 23, 42, .055);
    transition:
        transform .2s ease,
        box-shadow .2s ease,
        border-color .2s ease;
}

.product-card:hover {
    transform: translateY(-3px);
    border-color: #d5dae4;
    box-shadow: 0 13px 30px rgba(15, 23, 42, .09);
}

.product-media {
    border-color: #e3e6ec;
    background: #f2f4f7;
    box-shadow: none;
}

.product-media img,
.modal-product-media img {
    background: #f2f4f7;
}

.product-title,
.product-card .product-title {
    color: #171b24 !important;
}

.card-category {
    color: #7c8697;
}

.card-price s {
    color: #929baa;
}

.card-price strong {
    color: #137d83;
}

.product-select {
    background: linear-gradient(105deg, #1f2937, #111827);
    color: #ffffff;
    box-shadow: 0 5px 14px rgba(17, 24, 39, .13);
}

.product-select:hover {
    background:
        linear-gradient(
            105deg,
            var(--brand-red),
            #ef4764
        );
}

.product-select:disabled {
    background: #e5e7eb;
    color: #8a93a2;
    box-shadow: none;
}

/* Categorías */

.category-shortcuts > a,
.steps-grid article,
.legal-page section,
.contact-page aside {
    border-color: #e1e5eb;
    background: #ffffff;
    box-shadow: 0 5px 20px rgba(15, 23, 42, .035);
}

.category-shortcuts > a:hover {
    border-color: rgba(22, 140, 255, .32);
    background: #f8fbff;
}

.category-shortcuts strong,
.steps-grid h2,
.legal-page h2,
.contact-page dt {
    color: #111827;
}

.category-shortcuts small,
.steps-grid p,
.contact-page p,
.legal-page p,
.contact-page dd {
    color: #6f798a;
}

/* Filtros, si después se vuelven a utilizar */

.catalog-filters {
    border-color: #e1e5eb;
    background: #ffffff;
    box-shadow: 0 5px 20px rgba(15, 23, 42, .035);
}

.catalog-filters label,
.category-toolbar {
    color: #606b7d;
}

.catalog-filters input,
.catalog-filters select,
.category-toolbar input,
.category-toolbar select {
    border-color: #dfe3ea;
    background: #f8f9fb;
    color: #171b24;
}

.filter-actions a {
    border-color: #dfe3ea;
    color: #596477;
}

.pagination a {
    border-color: #dfe3ea;
    color: #667085;
    background: #ffffff;
}

.empty-catalog {
    color: #667085;
}

.empty-catalog h1,
.empty-catalog h2 {
    color: #111827;
}

/* Ventanas flotantes */

.store-modal-backdrop {
    background: rgba(15, 23, 42, .46);
    backdrop-filter: blur(4px);
}

.store-modal-panel {
    color: #111827;
    border-color: #e0e4eb;
    background: #ffffff;
    box-shadow: 0 30px 90px rgba(15, 23, 42, .28);
}

.store-modal-close {
    border-color: #dfe3e9;
    background: #f4f6f8;
    color: #202632;
}

.modal-loading {
    color: #697386;
}

.modal-product-media,
.order-modal-image {
    background: #f2f4f7;
}

.modal-product-copy h2,
.order-modal-header h2 {
    color: #111827;
}

.modal-short {
    color: #525d6e;
}

.modal-description {
    color: #667085;
}

.order-modal-panel legend {
    color: #3d4655;
}

.modal-plan-option {
    border-color: #e0e4ea;
    background: #fafbfc;
}

.modal-plan-option:has(input:checked) {
    border-color: var(--brand-blue);
    background: #eef7ff;
}

.modal-plan-option span strong {
    color: #1a202b;
}

.modal-plan-option span small,
.modal-quantity small,
.modal-order-note {
    color: #747f90;
}

.modal-plan-option > b {
    color: #137d83;
}

.quantity-control,
.order-summary {
    border-color: #dfe3e9;
    background: #f6f7f9;
}

.quantity-control button,
.quantity-control input {
    color: #17202c;
}

.quantity-control input {
    border-inline-color: #dfe3e9;
}

.order-summary > span {
    color: #596477;
}

.order-summary strong {
    color: #137d83;
}

/* Pie de página */

.store-footer {
    color: #111827;
    border-top-color: #e1e5eb;
    background: #ffffff;
}

.store-footer strong {
    color: #111827;
}

.store-footer small {
    color: #778194;
}

/* Ajustes para teléfono */

@media (max-width: 700px) {
    .product-card {
        padding: 7px;
        border-radius: 13px;
    }

    .product-card:hover {
        transform: none;
    }

    .service-rail {
        box-shadow: 0 5px 18px rgba(15, 23, 42, .04);
    }

    .store-modal-panel {
        border-color: #dfe3e9;
        background: #ffffff;
    }
}

/* =========================================
   MENÚ CENIZO CON DETALLES ROJOS
   ========================================= */

.store-sidebar {
    --line: #d9dde4;
    padding: 18px 13px;
    border-right: 1px solid #d9dde4;
    background: linear-gradient(
        180deg,
        #f4f5f7 0%,
        #eceef1 100%
    );
    box-shadow: 7px 0 24px rgba(15, 23, 42, .07);
}

.sidebar-brand {
    margin-bottom: 14px;
    padding: 5px 7px 20px;
    border-bottom: 1px solid #d9dde4;
}

.sidebar-brand > a {
    gap: 12px;
}

.sidebar-brand img {
    width: 45px;
    height: 45px;
    border: 2px solid #ffffff;
    box-shadow: 0 6px 16px rgba(15, 23, 42, .13);
}

.sidebar-brand strong {
    color: #20242c;
    font-size: .76rem;
    letter-spacing: .045em;
}

.sidebar-brand small {
    color: #7b8492;
    font-size: .57rem;
}

.sidebar-nav {
    gap: 7px;
}

.sidebar-nav > a,
.sidebar-category-menu > summary {
    min-height: 47px;
    padding: 0 12px;
    border: 1px solid transparent;
    border-radius: 11px;
    color: #4f5866;
    font-size: .71rem;
    transition:
        background .18s,
        color .18s,
        transform .18s,
        box-shadow .18s;
}

.sidebar-nav > a:hover,
.sidebar-category-menu > summary:hover {
    border-color: rgba(225, 45, 72, .14);
    background: rgba(225, 45, 72, .07);
    color: #c82743;
    transform: translateX(2px);
}

/* Opción seleccionada */

.sidebar-nav > a.active {
    border-color: #df304d;
    background: linear-gradient(
        110deg,
        #e53351,
        #cf2441
    );
    color: #ffffff;
    box-shadow: 0 8px 19px rgba(207, 36, 65, .20);
    transform: none;
}

/* Iconos */

.sidebar-nav i,
.sidebar-category-menu i {
    background: rgba(225, 45, 72, .09);
    color: #d52c49;
}

.sidebar-nav > a.active i {
    background: rgba(255, 255, 255, .18);
    color: #ffffff;
}

/* Categorías, si todavía aparecen */

.sidebar-category-menu[open] > summary {
    border-color: rgba(225, 45, 72, .16);
    background: rgba(225, 45, 72, .07);
    color: #c82743;
}

.sidebar-category-menu > summary b {
    color: #8b929e;
}

.sidebar-category-menu[open] > summary b {
    color: #cf2946;
}

.sidebar-category-menu > div {
    margin: 7px 2px 7px 34px;
    padding: 6px;
    border: 1px solid #d9dde4;
    border-radius: 9px;
    background: rgba(255, 255, 255, .52);
}

.sidebar-category-menu > div a {
    min-height: 33px;
    padding: 0 8px;
    color: #626b78;
    border-radius: 7px;
}

.sidebar-category-menu > div a:hover {
    background: rgba(225, 45, 72, .08);
    color: #c82743;
}

.sidebar-category-menu > div small {
    background: #e3e6eb;
    color: #626b78;
}

/* Parte inferior del menú */

.sidebar-bottom {
    border-top-color: #d9dde4;
}

.sidebar-bottom > span {
    color: #c82743;
}

.sidebar-bottom p {
    color: #707986;
}

/* Menú del teléfono */

.sidebar-brand > button {
    border-color: #d4d8df;
    background: #ffffff;
    color: #c82743;
}

.store-topbar {
    color: #20242c;
    border-bottom-color: #d9dde4;
    background: rgba(244, 245, 247, .97);
    box-shadow: 0 5px 18px rgba(15, 23, 42, .07);
}

.mobile-brand strong {
    color: #20242c;
}

.mobile-menu-button {
    border-color: #d4d8df;
    background: #ffffff;
}

.mobile-menu-button i {
    background: #d52c49;
}

@media (max-width: 920px) {
    .store-sidebar {
        box-shadow: 28px 0 70px rgba(15, 23, 42, .22);
    }

    .sidebar-nav > a:hover,
    .sidebar-category-menu > summary:hover {
        transform: none;
    }
}

/* =========================================
   MENÚ OCULTO CON BOTÓN DE TRES RAYAS
   ========================================= */

/* Ocultar inicialmente el menú lateral */

.store-sidebar {
    width: min(310px, 88vw);
    transform: translateX(-105%);
    transition: transform .25s ease;
}

/* Mostrarlo cuando se presionan las tres rayas */

.store-sidebar.open {
    transform: translateX(0);
    box-shadow: 25px 0 70px rgba(15, 23, 42, .22);
}

/* La tienda ocupa toda la pantalla */

.store-shell {
    margin-left: 0;
}

/* Mostrar siempre la barra superior */

.store-topbar {
    min-height: 64px;
    padding: 10px 18px;
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) 44px;
    align-items: center;
    gap: 11px;
    color: #20242c;
    border-bottom: 1px solid #d9dde4;
    background: rgba(244, 245, 247, .97);
    box-shadow: 0 5px 18px rgba(15, 23, 42, .07);
}

/* Botón de tres rayas */

.mobile-menu-button {
    width: 42px;
    height: 42px;
    padding: 0;
    display: grid !important;
    place-content: center;
    gap: 5px;
    border: 1px solid #d4d8df;
    border-radius: 10px;
    background: #ffffff;
    cursor: pointer;
    box-shadow: 0 3px 10px rgba(15, 23, 42, .06);
}

.mobile-menu-button i {
    width: 20px;
    height: 2px;
    display: block;
    border-radius: 4px;
    background: #d52c49;
}

/* Logo y nombre en la barra */

.mobile-brand {
    min-width: 0;
    display: flex !important;
    align-items: center;
    gap: 9px;
}

.mobile-brand img {
    width: 38px;
    height: 38px;
    object-fit: cover;
    border: 2px solid #ffffff;
    border-radius: 50%;
    box-shadow: 0 3px 10px rgba(15, 23, 42, .10);
}

.mobile-brand strong {
    overflow: hidden;
    color: #20242c;
    font-size: .72rem;
    letter-spacing: .04em;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* WhatsApp de la barra */

.topbar-whatsapp {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--brand-green);
}

.topbar-whatsapp span,
.topbar-whatsapp b {
    display: none;
}

.topbar-whatsapp::before {
    width: 9px;
    height: 9px;
    margin: 0;
    background: #063d1b;
    box-shadow: none;
}

/* Buscador debajo de la barra */

.store-topbar > .global-search {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    height: 42px;
    border-color: #d9dde4;
    background: #ffffff;
}

.global-search input {
    height: 40px;
    color: #20242c;
}

.global-search input::placeholder {
    color: #858d99;
}

/* Fondo oscuro al abrir el menú */

.store-menu-overlay {
    position: fixed;
    inset: 0;
    z-index: 59;
    display: block;
    background: rgba(15, 23, 42, .42);
    backdrop-filter: blur(3px);
}

/* Botón para cerrar el menú */

.sidebar-brand > button {
    position: absolute;
    top: 22px;
    right: 15px;
    width: 35px;
    height: 35px;
    padding: 0;
    display: block;
    border: 1px solid #d4d8df;
    border-radius: 9px;
    background: #ffffff;
    color: #c82743;
    font-size: 1.2rem;
    cursor: pointer;
}

/* Ajustes en computadora */

@media (min-width: 921px) {
    .store-topbar {
        grid-template-columns: 42px minmax(180px, 1fr) minmax(300px, 650px) 44px;
    }

    .store-topbar > .global-search {
        grid-column: 3;
        grid-row: 1;
    }
}

/* Ajustes en teléfono */

@media (max-width: 700px) {
    .store-topbar {
        padding: 9px 12px;
        grid-template-columns: 42px minmax(0, 1fr) 42px;
        gap: 8px;
    }

    .mobile-brand strong {
        font-size: .66rem;
    }

    .store-sidebar {
        width: min(300px, 88vw);
    }
}

/* =========================================
   CABECERA CENTRADA Y SERVICIOS MÁS GRANDES
   ========================================= */

/* Cabecera */

.store-topbar {
    position: sticky;
    min-height: 76px;
    padding: 11px 24px;
}

/* Marca centrada realmente */

.mobile-brand {
    position: absolute;
    top: 50%;
    left: 50%;
    width: max-content;
    max-width: 55%;
    justify-content: center;
    transform: translate(-50%, -50%);
}

.mobile-brand img {
    width: 46px;
    height: 46px;
}

.mobile-brand strong {
    font-size: .79rem;
    letter-spacing: .045em;
}

/* Botón de las tres rayas */

.mobile-menu-button {
    position: relative;
    z-index: 2;
    width: 48px;
    height: 48px;
    border-radius: 11px;
}

.mobile-menu-button i {
    width: 23px;
    height: 3px;
}

/* Mantener WhatsApp a la derecha */

.topbar-whatsapp {
    position: relative;
    z-index: 2;
    width: 46px;
    height: 46px;
    justify-self: end;
}

/* Cuadro que contiene los servicios */

.service-rail {
    min-height: 148px;
    padding: 11px;
    gap: 9px;
    align-items: stretch;
}

/* Cuadros de Todos, Netflix, Disney+, etc. */

.service-chip {
    width: 112px;
    min-width: 112px;
    min-height: 124px;
    padding: 12px 8px 10px;
    gap: 8px;
    border-radius: 14px;
}

/* Imagen o iniciales del servicio */

.service-chip img,
.service-chip > i,
.service-chip > span:first-child {
    width: 62px;
    height: 62px;
    border-radius: 13px;
}

/* Nombre del servicio */

.service-chip strong,
.service-chip small {
    font-size: .62rem;
}

/* Ajustes especiales para teléfono */

@media (max-width: 700px) {
    .store-topbar {
        min-height: 70px;
        padding: 9px 12px;
    }

    .mobile-menu-button {
        width: 45px;
        height: 45px;
    }

    .mobile-menu-button i {
        width: 21px;
        height: 3px;
    }

    .mobile-brand {
        max-width: 62%;
    }

    .mobile-brand img {
        width: 43px;
        height: 43px;
    }

    .mobile-brand strong {
        max-width: 160px;
        font-size: .69rem;
    }

    .topbar-whatsapp {
        width: 43px;
        height: 43px;
    }

    .service-rail {
        min-height: 135px;
        padding: 9px;
        gap: 8px;
        overflow-x: auto;
        scroll-snap-type: x proximity;
    }

    .service-chip {
        width: 102px;
        min-width: 102px;
        min-height: 116px;
        padding: 10px 7px 9px;
        scroll-snap-align: start;
    }

    .service-chip img,
    .service-chip > i,
    .service-chip > span:first-child {
        width: 57px;
        height: 57px;
    }

    .service-chip strong,
    .service-chip small {
        font-size: .58rem;
    }
}
 /* =========================================
   ANIMACIONES MEJORADAS DE LA TIENDA
   ========================================= */

/* Entrada general */

.store-topbar {
    animation: headerEntrance .45s ease-out both;
}

.store-content {
    animation: contentEntrance .45s ease-out both;
}

.service-rail {
    animation: sectionEntrance .50s .08s ease-out both;
}

/* Servicios superiores */

.service-chip {
    animation: itemEntrance .45s ease-out both;
    transition:
        transform .20s ease,
        border-color .20s ease,
        box-shadow .20s ease;
}

.service-chip:nth-child(1) {
    animation-delay: .08s;
}

.service-chip:nth-child(2) {
    animation-delay: .13s;
}

.service-chip:nth-child(3) {
    animation-delay: .18s;
}

.service-chip:nth-child(4) {
    animation-delay: .23s;
}

.service-chip:nth-child(5) {
    animation-delay: .28s;
}

.service-chip:nth-child(6) {
    animation-delay: .33s;
}

/* Encabezados de categorías */

.catalog-section > header,
.section-header,
.catalog-results > section > header {
    animation: sectionEntrance .50s ease-out both;
}

/* Productos */

.product-card {
    animation: cardEntrance .50s ease-out both;
    transition:
        transform .22s ease,
        border-color .22s ease,
        box-shadow .22s ease;
}

.product-card:nth-child(1) {
    animation-delay: .08s;
}

.product-card:nth-child(2) {
    animation-delay: .14s;
}

.product-card:nth-child(3) {
    animation-delay: .20s;
}

.product-card:nth-child(4) {
    animation-delay: .26s;
}

.product-card:nth-child(5) {
    animation-delay: .32s;
}

.product-card:nth-child(6) {
    animation-delay: .38s;
}

/* Efectos únicamente en dispositivos con cursor */

@media (hover: hover) {
    .service-chip:hover {
        transform: translateY(-4px);
        border-color: rgba(213, 44, 73, .25);
        box-shadow: 0 11px 24px rgba(15, 23, 42, .10);
    }

    .product-card:hover {
        transform: translateY(-5px);
        border-color: rgba(213, 44, 73, .18);
        box-shadow: 0 16px 32px rgba(15, 23, 42, .11);
    }
}

/* Reacción al pulsar servicios y productos */

.service-chip:active,
.product-card:active {
    transform: scale(.98);
    transition-duration: .08s;
}

/* Imagen de los productos */

.product-media {
    overflow: hidden;
}

.product-media img {
    transition:
        transform .32s ease,
        filter .32s ease;
}

@media (hover: hover) {
    .product-card:hover .product-media img {
        transform: scale(1.035);
        filter: saturate(1.05);
    }
}

/* Botones */

.product-select,
.global-search button,
.modal-order-submit,
.filter-actions button,
.filter-actions a {
    position: relative;
    overflow: hidden;
    transition:
        transform .16s ease,
        filter .18s ease,
        box-shadow .18s ease;
}

/* Brillo suave en botones */

.product-select::after,
.global-search button::after,
.modal-order-submit::after {
    content: "";
    position: absolute;
    top: -80%;
    left: -50%;
    width: 25px;
    height: 260%;
    background: rgba(255, 255, 255, .25);
    transform: rotate(24deg);
    transition: left .55s ease;
    pointer-events: none;
}

@media (hover: hover) {
    .product-select:hover::after,
    .global-search button:hover::after,
    .modal-order-submit:hover::after {
        left: 135%;
    }

    .product-select:hover,
    .global-search button:hover,
    .modal-order-submit:hover {
        transform: translateY(-2px);
        filter: brightness(1.05);
    }
}

.product-select:active,
.global-search button:active,
.modal-order-submit:active,
.store-modal-close:active,
.quantity-control button:active {
    transform: scale(.95);
    transition-duration: .07s;
}

/* Apertura del menú lateral */

.store-sidebar {
    transition:
        transform .26s cubic-bezier(.22, .8, .32, 1),
        box-shadow .26s ease;
}

.store-menu-overlay {
    animation: overlayEntrance .20s ease-out both;
}

/* Opciones dentro del menú */

.sidebar-nav > a {
    transition:
        background .18s ease,
        color .18s ease,
        box-shadow .18s ease;
}

.sidebar-nav > a:active {
    opacity: .82;
}

/* =========================================
   TRES RAYAS TOTALMENTE QUIETAS
   ========================================= */

.mobile-menu-button,
.mobile-menu-button:hover,
.mobile-menu-button:active {
    transform: none !important;
    transition:
        border-color .18s ease,
        background .18s ease,
        box-shadow .18s ease;
}

.mobile-menu-button i,
.mobile-menu-button:hover i,
.mobile-menu-button:active i,
.mobile-menu-button:hover i:nth-child(1),
.mobile-menu-button:hover i:nth-child(2),
.mobile-menu-button:hover i:nth-child(3) {
    width: 23px;
    transform: none !important;
    transition: none !important;
}

/* Sugerencias del buscador */

.search-suggestions {
    transform-origin: top center;
    animation: dropdownEntrance .20s ease-out both;
}

.search-suggestions a {
    transition:
        background .16s ease,
        padding-left .16s ease;
}

@media (hover: hover) {
    .search-suggestions a:hover {
        padding-left: 15px;
        background: rgba(213, 44, 73, .06);
    }
}

/* Ventanas de productos y pedidos */

.store-modal-backdrop {
    animation: overlayEntrance .20s ease-out both;
}

.store-modal-panel {
    transform-origin: center;
    animation: modalEntrance .28s ease-out both;
}

.modal-plan-option {
    transition:
        transform .17s ease,
        border-color .17s ease,
        background .17s ease,
        box-shadow .17s ease;
}

@media (hover: hover) {
    .modal-plan-option:hover {
        transform: translateY(-2px);
        box-shadow: 0 7px 17px rgba(15, 23, 42, .07);
    }
}

.modal-plan-option:active {
    transform: scale(.98);
}

/* Control de cantidad */

.quantity-control button {
    transition:
        transform .12s ease,
        color .15s ease,
        background .15s ease;
}

@media (hover: hover) {
    .quantity-control button:hover {
        color: #d52c49;
        background: rgba(213, 44, 73, .07);
    }
}

/* WhatsApp flotante */

.whatsapp-float,
.floating-whatsapp {
    animation:
        whatsappEntrance .55s .35s ease-out both,
        whatsappPulse 3.2s 1.2s ease-in-out infinite;
    transition:
        transform .20s ease,
        box-shadow .20s ease;
}

@media (hover: hover) {
    .whatsapp-float:hover,
    .floating-whatsapp:hover {
        transform: translateY(-4px) scale(1.04);
        box-shadow: 0 14px 30px rgba(37, 211, 102, .30);
    }
}

/* =========================================
   MOVIMIENTOS
   ========================================= */

@keyframes headerEntrance {
    from {
        opacity: 0;
        transform: translateY(-12px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes contentEntrance {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes sectionEntrance {
    from {
        opacity: 0;
        transform: translateY(15px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes itemEntrance {
    from {
        opacity: 0;
        transform: translateY(13px) scale(.97);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes cardEntrance {
    from {
        opacity: 0;
        transform: translateY(20px) scale(.98);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes overlayEntrance {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes dropdownEntrance {
    from {
        opacity: 0;
        transform: translateY(-7px) scaleY(.97);
    }

    to {
        opacity: 1;
        transform: translateY(0) scaleY(1);
    }
}

@keyframes modalEntrance {
    from {
        opacity: 0;
        transform: translateY(20px) scale(.97);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes whatsappEntrance {
    from {
        opacity: 0;
        transform: translateY(18px) scale(.80);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes whatsappPulse {
    0%,
    100% {
        box-shadow: 0 8px 22px rgba(37, 211, 102, .18);
    }

    50% {
        box-shadow:
            0 10px 27px rgba(37, 211, 102, .27),
            0 0 0 7px rgba(37, 211, 102, .06);
    }
}

/* Teléfono */

@media (max-width: 700px) {
    .mobile-menu-button i,
    .mobile-menu-button:hover i,
    .mobile-menu-button:active i {
        width: 21px;
    }

    .product-card:active,
    .service-chip:active {
        transform: scale(.98);
    }
}

/* Accesibilidad */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

/* =========================================
   VENTANA DE DESCRIPCIÓN AMPLIA Y LEGIBLE
   ========================================= */

.info-modal-panel {
    width: min(920px, calc(100vw - 32px));
    max-height: min(88vh, 700px);
    overflow: hidden;
    border-radius: 19px;
    background: #ffffff;
}

.info-modal-panel .modal-product-info {
    min-height: 540px;
    padding: 82px 28px 26px;
    grid-template-columns: 220px minmax(0, 1fr);
    align-items: start;
    gap: 28px;
}

.info-modal-panel .modal-product-copy h2 {
    min-height: 62px;
    padding: 18px 62px 16px 24px;
    color: #111827;
    border-bottom-color: #e3e7ed;
    background: #ffffff;
    font-size: 1.25rem;
}

.info-modal-panel .modal-product-media {
    position: sticky;
    top: 0;
    width: 220px;
    height: 320px;
    border-color: #dfe3e9;
    border-radius: 16px;
    background: #f3f5f8;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .09);
}

.info-modal-panel .modal-product-media img {
    padding: 8px;
    object-fit: contain;
    background: transparent;
}

.info-modal-panel .modal-description {
    grid-column: 2;
    max-height: 430px;
    padding: 2px 16px 12px 2px;
    overflow-y: auto;
    color: #283241;
    font-size: .84rem;
    font-weight: 500;
    line-height: 1.78;
    white-space: pre-wrap;
    scrollbar-width: thin;
    scrollbar-color: #b8bec8 #edf0f4;
}

.info-modal-panel .modal-description::-webkit-scrollbar {
    width: 8px;
}

.info-modal-panel .modal-description::-webkit-scrollbar-track {
    border-radius: 10px;
    background: #edf0f4;
}

.info-modal-panel .modal-description::-webkit-scrollbar-thumb {
    border: 2px solid #edf0f4;
    border-radius: 10px;
    background: #aeb5c0;
}

.info-modal-panel .store-modal-close {
    top: 11px;
    right: 13px;
    width: 40px;
    height: 40px;
    border-color: #d9dee5;
    background: #f3f5f8;
    color: #1c2532;
}

@media (max-width: 700px) {
    .info-modal-panel {
        width: min(94vw, 460px);
        max-height: 90vh;
        overflow-y: auto;
        border-radius: 17px;
    }

    .info-modal-panel .modal-product-info {
        min-height: 0;
        padding: 72px 16px 18px;
        display: block;
    }

    .info-modal-panel .modal-product-copy h2 {
        min-height: 57px;
        padding: 16px 55px 14px 17px;
        font-size: 1.05rem;
    }

    .info-modal-panel .modal-product-media {
        position: static;
        width: 145px;
        height: 208px;
        margin: 0 auto 18px;
        border-radius: 14px;
    }

    .info-modal-panel .modal-description {
        max-height: 45vh;
        padding: 0 8px 10px 0;
        color: #283241;
        font-size: .75rem;
        line-height: 1.7;
    }
}

/* Miniaturas verticales completas en la franja superior */
.service-chip img {
    width: 60px;
    height: 78px;
    padding: 3px;
    object-fit: contain;
    border: 1px solid #e0e4ea;
    border-radius: 11px;
    background: #f3f5f8;
}

@media (max-width: 700px) {
    .service-chip img {
        width: 54px;
        height: 70px;
        padding: 3px;
        object-fit: contain;
        border-radius: 10px;
    }
}

/* =========================================================
   AJUSTE FINAL PC - DISTRIBUCION DEL CATALOGO
   - Hasta 8 productos por fila en pantallas de escritorio.
   - Si la ultima fila queda con 7 productos, se distribuyen
     de borde a borde para evitar un hueco grande a la derecha.
   - No modifica el diseño movil (2 columnas).
   ========================================================= */
@media (min-width: 1200px) {
    .product-grid,
    .catalog-results .product-grid {
        display: flex;
        flex-wrap: wrap;
        align-items: stretch;
        justify-content: flex-start;
        column-gap: 14px;
        row-gap: 28px;
    }

    .product-grid > .product-card,
    .catalog-results .product-grid > .product-card {
        flex: 0 0 calc((100% - 98px) / 8);
        width: calc((100% - 98px) / 8);
        min-width: 0;
    }

    /* Cuando el total termina en una fila de 7 (7, 15, 23...),
       reparte esa fila de forma uniforme y elimina el hueco final. */
    .product-grid:has(> .product-card:nth-child(8n + 7):last-child),
    .catalog-results .product-grid:has(> .product-card:nth-child(8n + 7):last-child) {
        justify-content: space-between;
    }
}

/* SERVICIOS SUPERIORES MÁS PEQUEÑOS SOLO EN PC */
@media (min-width: 701px) {
    .service-rail {
        min-height: 112px;
        padding: 8px;
        gap: 7px;
    }

    .service-chip {
        width: 88px;
        min-width: 88px;
        min-height: 96px;
        padding: 8px 6px 7px;
        gap: 5px;
        border-radius: 12px;
    }

    .service-chip img,
    .service-chip > i,
    .service-chip > span:first-child {
        width: 60px;
        height: 60px;
        border-radius: 10px;
    }

    .service-chip strong,
    .service-chip small {
        font-size: .52rem;
    }
}

/* =========================================
   LOGOS DE SERVICIOS
   ========================================= */

.service-chip strong,
.service-chip small {
    display: none !important;
}


/* PC */

@media (min-width: 701px) {

    .service-rail {
        min-height: 94px;
        padding: 7px;
        gap: 7px;
        align-items: center;
    }

    .service-chip {
        width: 82px;
        min-width: 82px;

        height: 82px;
        min-height: 82px;

        padding: 7px;

        gap: 0;

        border-radius: 12px;
    }

    .service-chip img {
        width: 66px !important;
        height: 66px !important;

        max-width: 100%;

        padding: 0 !important;

        object-fit: contain !important;

        border: 0 !important;

        border-radius: 10px !important;

        background: transparent !important;
    }

    .service-chip > span {
        width: 62px !important;
        height: 62px !important;

        border-radius: 10px !important;
    }
}


/* TELÉFONO */

@media (max-width: 700px) {

    .service-rail {
        min-height: 78px;
        padding: 6px;
        gap: 6px;
    }

    .service-chip {
        width: 66px;
        min-width: 66px;

        height: 66px;
        min-height: 66px;

        padding: 6px;

        gap: 0;

        border-radius: 10px;
    }

    .service-chip img {
        width: 54px !important;
        height: 54px !important;

        padding: 0 !important;

        object-fit: contain !important;

        border: 0 !important;

        border-radius: 9px !important;

        background: transparent !important;
    }

    .service-chip > span {
        width: 50px !important;
        height: 50px !important;

        border-radius: 9px !important;
    }
}

/* =========================================================
   V6.4 - MODAL DE PEDIDO / ACABADO PROFESIONAL
   Solo visual. No altera la logica de planes, cantidades
   ni el envio del pedido a WhatsApp.
   ========================================================= */

/* Fondo y entrada del modal de pedido */
[data-order-modal] .store-modal-backdrop {
    background:
        radial-gradient(circle at 50% 18%, rgba(22, 140, 255, .12), transparent 34%),
        rgba(15, 23, 42, .52);
    backdrop-filter: blur(7px) saturate(1.08);
}

.order-modal-panel {
    position: relative;
    overflow-x: hidden;
    border: 1px solid rgba(22, 140, 255, .18);
    border-radius: 20px;
    background:
        radial-gradient(circle at 92% 0, rgba(22, 140, 255, .075), transparent 25%),
        linear-gradient(180deg, #ffffff 0%, #fbfcfe 100%);
    box-shadow:
        0 34px 90px rgba(15, 23, 42, .26),
        0 0 0 1px rgba(255, 255, 255, .75) inset;
}

.order-modal-panel::before {
    content: "";
    position: absolute;
    top: 0;
    left: 28px;
    right: 28px;
    height: 3px;
    border-radius: 0 0 99px 99px;
    background: linear-gradient(90deg, transparent, #168cff 24%, #6268ee 70%, transparent);
    box-shadow: 0 4px 18px rgba(22, 140, 255, .30);
    pointer-events: none;
}

.order-modal-panel .store-modal-close {
    top: 13px;
    right: 13px;
    border: 1px solid #dce3ec;
    border-radius: 11px;
    background: rgba(247, 249, 252, .94);
    color: #344054;
    box-shadow: 0 6px 18px rgba(15, 23, 42, .07);
    transition: transform .16s ease, color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

@media (hover: hover) {
    .order-modal-panel .store-modal-close:hover {
        color: #168cff;
        border-color: rgba(22, 140, 255, .32);
        box-shadow: 0 8px 22px rgba(22, 140, 255, .13);
        transform: rotate(4deg) scale(1.04);
    }
}

/* Cabecera del producto */
.order-modal-header {
    position: relative;
    min-height: 96px;
    padding: 4px 46px 17px 0;
    align-items: center;
}

.order-modal-header::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: linear-gradient(90deg, rgba(22, 140, 255, .28), rgba(15, 23, 42, .07) 65%, transparent);
}

.order-modal-image {
    position: relative;
    width: 76px;
    height: 90px;
    padding: 3px;
    overflow: hidden;
    border: 1px solid rgba(22, 140, 255, .20);
    border-radius: 14px;
    background: linear-gradient(145deg, #edf6ff, #ffffff);
    box-shadow:
        0 10px 25px rgba(15, 23, 42, .10),
        0 0 0 4px rgba(22, 140, 255, .045);
    transition: transform .22s ease, box-shadow .22s ease;
}

.order-modal-image img {
    border-radius: 10px;
}

@media (hover: hover) {
    .order-modal-header:hover .order-modal-image {
        transform: translateY(-2px) scale(1.015);
        box-shadow:
            0 14px 30px rgba(15, 23, 42, .13),
            0 0 0 5px rgba(22, 140, 255, .055);
    }
}

.order-modal-header > div > span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 2px;
    color: #168cff;
    font-size: .58rem;
    font-weight: 900;
    letter-spacing: .15em;
}

.order-modal-header > div > span::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #168cff;
    box-shadow: 0 0 0 4px rgba(22, 140, 255, .10);
}

.order-modal-header h2 {
    margin-top: 6px;
    color: #101828;
    font-size: 1.48rem;
    font-weight: 850;
    letter-spacing: -.035em;
}

/* Titulos de seccion con pequenos indicadores visuales */
.order-modal-panel fieldset {
    position: relative;
}

.order-modal-panel legend {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 11px;
    color: #344054;
    font-size: .66rem;
    font-weight: 850;
    letter-spacing: .015em;
}

.modal-plan-picker legend::before,
.modal-quantity legend::before {
    display: inline-grid;
    place-items: center;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    border: 1px solid rgba(22, 140, 255, .15);
    border-radius: 8px;
    background: #edf6ff;
    color: #168cff;
    font-size: .72rem;
    font-weight: 950;
    box-shadow: 0 4px 12px rgba(22, 140, 255, .08);
}

.modal-plan-picker legend::before {
    content: "✓";
}

.modal-quantity legend::before {
    content: "±";
}

/* Opciones de plan */
.modal-plan-picker > div {
    gap: 9px;
}

.modal-plan-option {
    position: relative;
    min-height: 62px;
    padding: 10px 13px;
    overflow: hidden;
    border: 1px solid #e1e7ef;
    border-radius: 13px;
    background: linear-gradient(180deg, #ffffff, #fafbfd);
    box-shadow: 0 4px 13px rgba(15, 23, 42, .035);
    transition:
        transform .18s ease,
        border-color .18s ease,
        background .18s ease,
        box-shadow .18s ease;
}

.modal-plan-option::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    border-radius: 13px 0 0 13px;
    background: linear-gradient(180deg, #168cff, #5f66ee);
    opacity: 0;
    transform: scaleY(.45);
    transition: opacity .18s ease, transform .18s ease;
}

.modal-plan-option input {
    width: 16px;
    height: 16px;
    accent-color: #168cff;
    filter: drop-shadow(0 2px 3px rgba(22, 140, 255, .15));
}

.modal-plan-option span strong {
    color: #182230;
    font-size: .69rem;
    font-weight: 850;
}

.modal-plan-option span small {
    margin-top: 3px;
    color: #7a8597;
    font-size: .56rem;
    line-height: 1.35;
}

.modal-plan-option > b {
    padding: 4px 8px;
    border-radius: 8px;
    background: #effaf8;
    color: #137d83;
    font-size: .64rem;
    font-weight: 900;
}

.modal-plan-option:has(input:checked) {
    border-color: rgba(22, 140, 255, .60);
    background:
        linear-gradient(90deg, rgba(22, 140, 255, .085), rgba(255, 255, 255, .98) 58%);
    box-shadow:
        0 10px 24px rgba(22, 140, 255, .11),
        0 0 0 3px rgba(22, 140, 255, .055);
    transform: translateY(-1px);
    animation: orderPlanSelect .28s ease-out both;
}

.modal-plan-option:has(input:checked)::before {
    opacity: 1;
    transform: scaleY(1);
}

.modal-plan-option:has(input:checked) span strong {
    color: #0b6fc8;
}

@media (hover: hover) {
    .modal-plan-option:not(.disabled):hover {
        transform: translateY(-2px);
        border-color: rgba(22, 140, 255, .30);
        box-shadow: 0 11px 25px rgba(15, 23, 42, .085);
    }
}

/* Cantidad */
.modal-quantity {
    padding: 13px 14px;
    border: 1px solid #e5e9f0 !important;
    border-radius: 13px;
    background: #fbfcfe;
}

.modal-quantity legend {
    float: none;
    width: auto;
    margin: 0;
}

.quantity-control {
    overflow: hidden;
    border-color: #dce3ec;
    border-radius: 11px;
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(15, 23, 42, .045);
}

.quantity-control button {
    color: #168cff;
    font-size: 1rem;
    font-weight: 850;
}

.quantity-control input {
    border-inline-color: #e2e7ee;
    color: #101828;
    font-size: .75rem;
}

@media (hover: hover) {
    .quantity-control button:hover {
        background: #edf6ff;
        color: #0876db;
    }
}

.modal-quantity small {
    color: #8490a2;
    font-weight: 650;
}

/* Resumen y total */
.order-summary {
    position: relative;
    margin-top: 18px;
    padding: 16px 17px;
    overflow: hidden;
    border: 1px solid rgba(22, 140, 255, .16);
    border-radius: 14px;
    background:
        radial-gradient(circle at 100% 0, rgba(22, 140, 255, .10), transparent 48%),
        linear-gradient(105deg, #f8fbff, #ffffff 68%);
    box-shadow: 0 8px 22px rgba(15, 23, 42, .055);
}

.order-summary::before {
    content: "";
    position: absolute;
    left: 0;
    top: 10px;
    bottom: 10px;
    width: 3px;
    border-radius: 0 99px 99px 0;
    background: linear-gradient(180deg, #168cff, #6268ee);
}

.order-summary > span {
    color: #596579;
    font-size: .64rem;
    font-weight: 750;
}

.order-summary strong {
    color: #0f7fba;
    font-size: 1.17rem;
    font-weight: 950;
    letter-spacing: -.02em;
    text-shadow: 0 3px 16px rgba(22, 140, 255, .10);
}

.order-summary s {
    color: #98a2b3;
}

/* Boton WhatsApp */
.modal-whatsapp {
    position: relative;
    overflow: hidden;

    width: 100%;
    height: 50px;
    margin-top: 13px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;

    border: 1px solid rgba(5, 98, 47, .10);
    border-radius: 13px;

    background:
        linear-gradient(
            110deg,
            #1fca61,
            #25d366 55%,
            #32dc78
        );

    color: #043719;

    font-size: .71rem;
    font-weight: 950;
    letter-spacing: .005em;

    box-shadow:
        0 11px 25px rgba(37, 211, 102, .22),
        0 1px 0 rgba(255, 255, 255, .24) inset;

    cursor: pointer;

    transition:
        transform .17s ease,
        filter .17s ease,
        box-shadow .17s ease;
}


/* Logo real de WhatsApp */
.modal-whatsapp svg {
    width: 22px !important;
    height: 22px !important;

    min-width: 22px;
    max-width: 22px;

    flex: 0 0 22px;

    display: block;

    fill: currentColor;
}


/* Texto */
.modal-whatsapp span {
    display: inline-block;

    line-height: 1;
}

.modal-whatsapp::after {
    content: "";
    position: absolute;
    top: -70%;
    left: -35%;
    width: 34px;
    height: 240%;
    background: rgba(255, 255, 255, .32);
    transform: rotate(22deg);
    transition: left .62s ease;
    pointer-events: none;
}

@media (hover: hover) {
    .modal-whatsapp:not(:disabled):hover {
        transform: translateY(-2px);
        filter: brightness(1.025);
        box-shadow:
            0 15px 30px rgba(37, 211, 102, .28),
            0 1px 0 rgba(255, 255, 255, .25) inset;
    }

    .modal-whatsapp:not(:disabled):hover::after {
        left: 125%;
    }
}

.modal-whatsapp:active:not(:disabled) {
    transform: translateY(0) scale(.985);
}

.modal-whatsapp:disabled {
    border-color: #e0e4e9;
    background: #e7ebef;
    color: #98a2b3;
    box-shadow: none;
}

/* Nota inferior con apariencia de sello de confianza */
.modal-order-note {
    width: fit-content;
    max-width: 100%;
    margin: 11px auto 0;
    padding: 6px 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid #e5e9ef;
    border-radius: 99px;
    background: #f8fafc;
    color: #788497;
    font-size: .53rem;
    font-weight: 650;
}

.modal-order-note::before {
    content: "✓";
    display: inline-grid;
    place-items: center;
    width: 15px;
    height: 15px;
    flex: 0 0 15px;
    border-radius: 50%;
    background: rgba(37, 211, 102, .13);
    color: #159c4a;
    font-size: .49rem;
    font-weight: 950;
}

/* Animaciones suaves */
@keyframes orderPlanSelect {
    0% {
        box-shadow: 0 0 0 0 rgba(22, 140, 255, .16);
    }
    55% {
        box-shadow: 0 9px 24px rgba(22, 140, 255, .11), 0 0 0 5px rgba(22, 140, 255, .07);
    }
    100% {
        box-shadow: 0 10px 24px rgba(22, 140, 255, .11), 0 0 0 3px rgba(22, 140, 255, .055);
    }
}

/* Ajustes moviles */
@media (max-width: 700px) {
    .order-modal-panel {
        width: min(94vw, 430px);
        padding: 21px 15px 15px;
        border-radius: 18px;
    }

    .order-modal-panel::before {
        left: 20px;
        right: 20px;
    }

    .order-modal-header {
        min-height: 76px;
        padding-right: 42px;
        padding-bottom: 13px;
        gap: 11px;
    }

    .order-modal-image {
        width: 56px;
        height: 66px;
        border-radius: 12px;
    }

    .order-modal-header h2 {
        font-size: 1.13rem;
    }

    .order-modal-panel fieldset {
        margin-top: 14px;
    }

    .modal-plan-picker > div {
        gap: 7px;
    }

    .modal-plan-option {
        min-height: 54px;
        padding: 8px 9px;
        border-radius: 11px;
    }

    .modal-plan-option > b {
        padding: 3px 6px;
        font-size: .58rem;
    }

    .modal-quantity {
        padding: 11px 10px;
        gap: 10px;
    }

    .modal-quantity small {
        width: 100%;
        margin-top: -2px;
    }

    .order-summary {
        margin-top: 13px;
        padding: 13px 14px;
    }

    .order-summary strong {
        font-size: 1.05rem;
    }

    .modal-whatsapp {
        height: 46px;
        border-radius: 11px;
        font-size: .67rem;
    }

    .modal-order-note {
        width: 100%;
        border-radius: 10px;
        line-height: 1.35;
    }
}

/* Respeta usuarios que prefieren menos movimiento */
@media (prefers-reduced-motion: reduce) {
    [data-order-modal] *,
    [data-order-modal] *::before,
    [data-order-modal] *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}

/* =========================================================
   CONTACTO + RESEÑAS PRO V2
   NEXSTREAM MARKET
   ========================================================= */

.contact-reviews-page {
    width: min(1280px, calc(100% - 38px));
    margin: 0 auto;
    padding: 34px 0 75px;
    display: block !important;
}


/* =========================================================
   HERO
   ========================================================= */

.contact-reviews-page .contact-intro {
    position: relative;
    isolation: isolate;
    overflow: hidden;

    width: 100%;
    max-width: none;

    margin: 0;
    padding: 68px 40px 58px;

    border: 1px solid #e2e7ef;
    border-radius: 26px;

    background:
        radial-gradient(
            circle at 10% 10%,
            rgba(19, 140, 255, .14),
            transparent 29%
        ),
        radial-gradient(
            circle at 90% 8%,
            rgba(225, 45, 72, .10),
            transparent 27%
        ),
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f8faff 56%,
            #ffffff 100%
        );

    text-align: center;

    box-shadow:
        0 26px 70px rgba(15, 23, 42, .08),
        inset 0 1px 0 rgba(255,255,255,.95);
}


/* brillo superior */

.contact-reviews-page .contact-intro::before {
    content: "";

    position: absolute;
    z-index: -1;

    width: 390px;
    height: 390px;

    top: -260px;
    left: 50%;

    transform: translateX(-50%);

    border-radius: 50%;

    background: rgba(22, 140, 255, .13);

    filter: blur(50px);
}


/* línea premium */

.contact-reviews-page .contact-intro::after {
    content: "";

    position: absolute;

    top: 0;
    left: 12%;
    right: 12%;

    height: 3px;

    border-radius: 0 0 20px 20px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #168cff,
            #7969f1,
            #e12d48,
            transparent
        );

    box-shadow:
        0 5px 18px rgba(22, 140, 255, .24);
}


/* etiqueta */

.contact-reviews-page .contact-intro > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;

    padding: 8px 13px;

    border: 1px solid rgba(22,140,255,.17);
    border-radius: 999px;

    background: rgba(22,140,255,.07);

    color: #168cff;

    font-size: .60rem;
    font-weight: 900;
    letter-spacing: .15em;
}


.contact-reviews-page .contact-intro > span::before {
    content: "";

    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: #168cff;

    box-shadow:
        0 0 0 5px rgba(22,140,255,.10);
}


/* título */

.contact-reviews-page .contact-intro h1 {
    max-width: 950px;

    margin: 19px auto 12px;

    color: #101828;

    font-size: clamp(2.8rem, 5.6vw, 5rem);
    font-weight: 950;

    line-height: .96;
    letter-spacing: -.065em;
}


/* descripción */

.contact-reviews-page .contact-intro > p {
    max-width: 700px;

    margin: 0 auto;

    color: #737e90;

    font-size: .82rem;
    line-height: 1.7;
}


/* WHATSAPP */

.contact-reviews-page .contact-main-whatsapp {
    width: auto !important;
    min-height: 50px !important;

    margin: 27px auto 0 !important;
    padding: 0 21px !important;

    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    border: 0 !important;
    border-radius: 13px !important;

    background:
        linear-gradient(
            110deg,
            #16bd57,
            #25d366
        ) !important;

    color: #053718 !important;

    font-size: .67rem !important;
    font-weight: 900 !important;

    text-decoration: none;

    box-shadow:
        0 12px 27px rgba(37,211,102,.21);

    transition:
        transform .2s ease,
        box-shadow .2s ease;
}


@media (hover:hover) {

    .contact-reviews-page .contact-main-whatsapp:hover {
        transform: translateY(-3px);

        box-shadow:
            0 17px 34px rgba(37,211,102,.29);
    }
}


/* =========================================================
   MENSAJES
   ========================================================= */

.contact-reviews-page .review-alert {
    width: 100%;

    margin: 18px 0 0;
    padding: 14px 17px;

    border-radius: 13px;

    font-size: .66rem;
    font-weight: 800;
}


.contact-reviews-page .review-alert.success {
    border: 1px solid rgba(19,169,91,.22);

    background: #edfff5;

    color: #087844;
}


.contact-reviews-page .review-alert.error {
    border: 1px solid rgba(225,45,72,.20);

    background: #fff1f3;

    color: #c52642;
}


/* =========================================================
   BLOQUE OPINIONES
   ========================================================= */

.contact-reviews-page .customer-reviews-section {
    width: 100%;
    max-width: none;

    margin: 24px 0 0;
    padding: 32px;

    border: 1px solid #e1e6ed;
    border-radius: 22px;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #fbfcfe
        );

    box-shadow:
        0 18px 45px rgba(15,23,42,.055);
}


/* cabecera */

.contact-reviews-page .customer-reviews-heading {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: 30px;
    align-items: center;

    padding-bottom: 27px;

    border-bottom: 1px solid #e8ecf1;
}


.contact-reviews-page
.customer-reviews-heading
> div:first-child
> span {

    display: inline-block;

    color: #168cff;

    font-size: .57rem;
    font-weight: 900;
    letter-spacing: .16em;
}


.contact-reviews-page
.customer-reviews-heading h2 {

    margin: 8px 0 7px;

    color: #111827;

    font-size: clamp(1.75rem, 3vw, 2.6rem);
    font-weight: 950;

    line-height: 1.04;
    letter-spacing: -.045em;
}


.contact-reviews-page
.customer-reviews-heading p {

    max-width: 650px;

    margin: 0;

    color: #7a8495;

    font-size: .69rem;
    line-height: 1.6;
}


/* promedio */

.contact-reviews-page .review-average {
    min-width: 205px;

    padding: 19px 22px;

    border: 1px solid #e0e5ec;
    border-radius: 17px;

    background:
        linear-gradient(
            145deg,
            #f8fbff,
            #ffffff
        );

    text-align: center;

    box-shadow:
        0 9px 25px rgba(15,23,42,.045);
}


.contact-reviews-page .review-average strong {
    display: block;

    color: #111827;

    font-size: 2.45rem;
    font-weight: 950;

    line-height: 1;
}


.contact-reviews-page .review-average span {
    display: block;

    margin: 7px 0 5px;

    color: #f4aa12;

    font-size: .87rem;

    letter-spacing: .11em;
}


.contact-reviews-page .review-average small {
    display: block;

    color: #7c8695;

    font-size: .55rem;
    font-weight: 700;
}


/* =========================================================
   SIN RESEÑAS
   ========================================================= */

.contact-reviews-page .reviews-empty {
    margin-top: 22px;

    padding: 35px 20px;

    border: 1px dashed #dce2e9;
    border-radius: 16px;

    background:
        linear-gradient(
            145deg,
            #fafcff,
            #ffffff
        );

    text-align: center;
}


.contact-reviews-page .reviews-empty::before {
    content: "★★★★★";

    display: block;

    margin-bottom: 11px;

    color: #dfe3e9;

    font-size: 1.1rem;
    letter-spacing: .08em;
}


.contact-reviews-page .reviews-empty strong {
    display: block;

    color: #202735;

    font-size: .8rem;
    font-weight: 900;
}


.contact-reviews-page .reviews-empty p {
    margin: 7px 0 0;

    color: #8992a0;

    font-size: .61rem;
}


/* =========================================================
   GRID DE RESEÑAS
   ========================================================= */

.contact-reviews-page .customer-review-grid {
    margin-top: 25px;

    display: grid;
    grid-template-columns:
        repeat(3, minmax(0,1fr));

    gap: 13px;
}


.contact-reviews-page .customer-review-card {
    position: relative;

    min-width: 0;

    padding: 19px;

    border: 1px solid #e3e7ed;
    border-radius: 16px;

    background: #ffffff;

    box-shadow:
        0 8px 25px rgba(15,23,42,.04);

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        border-color .2s ease;
}


@media (hover:hover) {

    .contact-reviews-page .customer-review-card:hover {
        transform: translateY(-4px);

        border-color:
            rgba(22,140,255,.22);

        box-shadow:
            0 17px 38px rgba(15,23,42,.08);
    }
}


/* cabecera reseña */

.contact-reviews-page
.customer-review-card > header {

    display: flex;
    align-items: center;
    gap: 11px;
}


.contact-reviews-page .review-avatar {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;

    display: grid;
    place-items: center;

    border-radius: 13px;

    background:
        linear-gradient(
            135deg,
            #168cff,
            #7467ef
        );

    color: #ffffff;

    font-size: .8rem;
    font-weight: 950;

    box-shadow:
        0 8px 18px rgba(22,140,255,.17);
}


.contact-reviews-page
.customer-review-card header strong {

    display: block;

    color: #1b2230;

    font-size: .68rem;
    font-weight: 900;
}


.contact-reviews-page
.customer-review-card header small {

    display: block;

    margin-top: 3px;

    color: #8992a0;

    font-size: .52rem;
}


/* estrellas */

.contact-reviews-page .review-stars {
    margin-top: 15px;
}


.contact-reviews-page .review-stars span {
    color: #f4a912;

    font-size: .67rem;
    letter-spacing: .06em;
}


.contact-reviews-page .review-stars i {
    color: #dfe3e8;

    font-size: .67rem;
    font-style: normal;
}


/* comentario */

.contact-reviews-page
.customer-review-card > p {

    margin: 12px 0 0;

    color: #596576;

    font-size: .63rem;
    line-height: 1.7;
}


/* footer reseña */

.contact-reviews-page
.customer-review-card > footer {

    margin-top: 17px;
    padding-top: 13px;

    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;

    gap: 8px;

    border-top: 1px solid #edf0f4;
}


.contact-reviews-page
.customer-review-card footer span {

    color: #858e9c;

    font-size: .5rem;
    font-weight: 750;
}


.contact-reviews-page .verified-review {
    color: #139c54 !important;

    font-weight: 900 !important;
}


/* links reseñas */

.contact-reviews-page .review-evidence,
.contact-reviews-page .review-contact-client {

    min-height: 34px !important;
    margin: 12px 0 0 !important;
    padding: 0 11px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 9px !important;

    text-decoration: none !important;

    font-size: .53rem !important;
    font-weight: 850 !important;
}


.contact-reviews-page .review-evidence {
    border: 1px solid #dfe4ea !important;

    background: #f6f8fa !important;

    color: #596575 !important;
}


.contact-reviews-page .review-contact-client {
    border: 1px solid rgba(37,211,102,.18) !important;

    background: rgba(37,211,102,.10) !important;

    color: #118346 !important;
}


/* =========================================================
   FORMULARIO
   ========================================================= */

.contact-reviews-page .publish-review-section {
    width: 100%;
    max-width: none;

    margin: 24px 0 0;
    padding: 34px;

    display: grid;
    grid-template-columns:
        minmax(260px,.72fr)
        minmax(0,1.28fr);

    gap: 42px;
    align-items: start;

    border: 1px solid #e0e5ec;
    border-radius: 22px;

    background:
        radial-gradient(
            circle at 0 0,
            rgba(22,140,255,.09),
            transparent 28%
        ),
        linear-gradient(
            145deg,
            #f9fbff,
            #ffffff
        );

    box-shadow:
        0 18px 48px rgba(15,23,42,.06);
}


/* texto izquierda */

.contact-reviews-page
.publish-review-copy {

    position: sticky;
    top: 25px;

    padding: 15px 5px;
}


.contact-reviews-page
.publish-review-copy > span {

    display: inline-block;

    color: #e12d48;

    font-size: .57rem;
    font-weight: 900;
    letter-spacing: .15em;
}


.contact-reviews-page
.publish-review-copy h2 {

    max-width: 420px;

    margin: 10px 0 10px;

    color: #111827;

    font-size: clamp(1.75rem,3vw,2.65rem);
    font-weight: 950;

    line-height: 1.04;
    letter-spacing: -.045em;
}


.contact-reviews-page
.publish-review-copy > p {

    max-width: 430px;

    margin: 0;

    color: #778294;

    font-size: .69rem;
    line-height: 1.65;
}


/* información */

.contact-reviews-page .review-privacy-info {
    margin-top: 23px;

    display: grid;

    gap: 9px;
}


.contact-reviews-page
.review-privacy-info p {

    position: relative;

    margin: 0;
    padding: 11px 12px 11px 35px;

    border: 1px solid #e3e7ed;
    border-radius: 11px;

    background:
        rgba(255,255,255,.75);

    color: #657183;

    font-size: .57rem;
    line-height: 1.5;
}


.contact-reviews-page
.review-privacy-info p::before {

    content: "✓";

    position: absolute;

    left: 12px;
    top: 50%;

    transform: translateY(-50%);

    width: 16px;
    height: 16px;

    display: grid;
    place-items: center;

    border-radius: 50%;

    background: rgba(19,169,91,.11);

    color: #139b54;

    font-size: .52rem;
    font-weight: 950;
}


/* =========================================================
   TARJETA FORMULARIO
   ========================================================= */

.contact-reviews-page .customer-review-form {
    width: 100%;

    padding: 25px;

    border: 1px solid #dde3ea;
    border-radius: 18px;

    background: #ffffff;

    box-shadow:
        0 15px 36px rgba(15,23,42,.07);
}


/* grid formulario */

.contact-reviews-page .review-form-grid {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0,1fr));

    gap: 15px;
}


.contact-reviews-page
.customer-review-form label {

    min-width: 0;

    display: block;
}


.contact-reviews-page
.customer-review-form label > span,

.contact-reviews-page
.review-rating-picker legend {

    display: block;

    margin-bottom: 7px;

    color: #364152;

    font-size: .57rem;
    font-weight: 850;
}


/* INPUTS */

.contact-reviews-page
.customer-review-form
input[type="text"],

.contact-reviews-page
.customer-review-form
input[type="email"],

.contact-reviews-page
.customer-review-form
input[type="tel"] {

    appearance: none;

    width: 100% !important;
    height: 48px !important;

    padding: 0 13px !important;

    border: 1px solid #dce2e9 !important;
    border-radius: 11px !important;

    outline: none;

    background: #f9fafc !important;

    color: #202735 !important;

    font-size: .64rem !important;

    transition:
        border-color .18s ease,
        background .18s ease,
        box-shadow .18s ease;
}


.contact-reviews-page
.customer-review-form textarea {

    appearance: none;

    width: 100% !important;
    min-height: 135px !important;

    padding: 13px !important;

    resize: vertical;

    border: 1px solid #dce2e9 !important;
    border-radius: 11px !important;

    outline: none;

    background: #f9fafc !important;

    color: #202735 !important;

    font-family: inherit !important;
    font-size: .64rem !important;

    line-height: 1.55;

    transition:
        border-color .18s ease,
        background .18s ease,
        box-shadow .18s ease;
}


.contact-reviews-page
.customer-review-form
input:focus,

.contact-reviews-page
.customer-review-form
textarea:focus {

    border-color:
        rgba(22,140,255,.55) !important;

    background: #ffffff !important;

    box-shadow:
        0 0 0 4px rgba(22,140,255,.08) !important;
}


.contact-reviews-page
.customer-review-form input::placeholder,

.contact-reviews-page
.customer-review-form textarea::placeholder {

    color: #a1a9b5;
}


/* texto pequeño */

.contact-reviews-page
.customer-review-form label small {

    display: block;

    margin-top: 5px;

    color: #949daa;

    font-size: .48rem;
    line-height: 1.4;
}


/* =========================================================
   CALIFICACIÓN
   ========================================================= */

.contact-reviews-page .review-rating-picker {
    margin: 18px 0 0;
    padding: 15px;

    border: 1px solid #e0e5eb;
    border-radius: 13px;

    background: #f9fafc;
}


.contact-reviews-page
.review-rating-picker > div {

    display: grid;

    grid-template-columns:
        repeat(5, minmax(0,1fr));

    gap: 7px;
}


.contact-reviews-page
.review-rating-picker label {

    position: relative;

    cursor: pointer;
}


.contact-reviews-page
.review-rating-picker input {

    position: absolute;

    opacity: 0;
}


.contact-reviews-page
.review-rating-picker label > span {

    min-height: 42px;

    margin: 0 !important;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid #dce2e9;
    border-radius: 10px;

    background: #ffffff;

    color: #838d9c;

    font-size: .61rem;
    font-weight: 900;

    transition:
        transform .18s ease,
        border-color .18s ease,
        background .18s ease,
        color .18s ease,
        box-shadow .18s ease;
}


.contact-reviews-page
.review-rating-picker
input:checked + span {

    border-color:
        rgba(244,169,18,.45);

    background:
        linear-gradient(
            145deg,
            #fff8e7,
            #fffdf7
        );

    color: #c98400;

    box-shadow:
        0 6px 16px rgba(244,169,18,.10);
}


@media (hover:hover) {

    .contact-reviews-page
    .review-rating-picker
    label > span:hover {

        transform: translateY(-2px);

        border-color:
            rgba(244,169,18,.45);

        color: #c98400;
    }
}


/* =========================================================
   COMENTARIO
   ========================================================= */

.contact-reviews-page .review-comment-field {
    display: block;

    margin-top: 17px;
}


/* =========================================================
   ARCHIVO
   ========================================================= */

.contact-reviews-page .review-file-field {
    display: block;

    margin-top: 17px;
}


.contact-reviews-page
.review-file-field > span small {

    display: inline;

    margin-left: 4px;

    color: #9ba3af;

    font-size: .48rem;
}


.contact-reviews-page
.review-file-field
input[type="file"] {

    width: 100%;

    min-height: 50px;

    padding: 8px;

    border: 1px dashed #ccd4df;
    border-radius: 11px;

    background: #f9fafc;

    color: #687386;

    font-size: .57rem;
}


.contact-reviews-page
.review-file-field
input[type="file"]::file-selector-button {

    height: 33px;

    margin-right: 10px;
    padding: 0 12px;

    border: 0;
    border-radius: 8px;

    background: #e9eef5;

    color: #364152;

    font-size: .53rem;
    font-weight: 850;

    cursor: pointer;
}


/* =========================================================
   AUTORIZACIÓN
   ========================================================= */

.contact-reviews-page .review-phone-consent {

    margin-top: 17px !important;
    padding: 14px !important;

    display: grid !important;

    grid-template-columns:
        18px minmax(0,1fr);

    gap: 10px;

    align-items: start;

    border: 1px solid #dde3ea !important;
    border-radius: 12px !important;

    background: #f9fafc !important;

    cursor: pointer;
}


.contact-reviews-page
.review-phone-consent input {

    width: 17px;
    height: 17px;

    margin: 1px 0 0;

    accent-color: #168cff;
}


.contact-reviews-page
.customer-review-form
.review-phone-consent > span {

    margin: 0 !important;

    color: #626d7e;

    font-size: .55rem;
    font-weight: 700;

    line-height: 1.55;
}


/* =========================================================
   BOTÓN PUBLICAR
   ========================================================= */

.contact-reviews-page .submit-customer-review {

    width: 100%;

    min-height: 51px;

    margin-top: 18px;

    border: 0;
    border-radius: 12px;

    background:
        linear-gradient(
            115deg,
            #168cff,
            #6476ef
        );

    color: #ffffff;

    font-size: .65rem;
    font-weight: 950;

    cursor: pointer;

    box-shadow:
        0 11px 25px rgba(22,140,255,.20);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        filter .18s ease;
}


@media (hover:hover) {

    .contact-reviews-page
    .submit-customer-review:hover {

        transform: translateY(-2px);

        filter: brightness(1.03);

        box-shadow:
            0 17px 33px rgba(22,140,255,.27);
    }
}


.contact-reviews-page .review-moderation-note {

    margin: 11px 3px 0;

    color: #919aa8;

    font-size: .49rem;
    line-height: 1.55;

    text-align: center;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 950px) {

    .contact-reviews-page {
        width: min(100% - 26px, 1280px);
    }

    .contact-reviews-page
    .customer-review-grid {

        grid-template-columns:
            repeat(2, minmax(0,1fr));
    }

    .contact-reviews-page
    .publish-review-section {

        grid-template-columns: 1fr;

        gap: 22px;
    }

    .contact-reviews-page
    .publish-review-copy {

        position: static;

        text-align: center;
    }

    .contact-reviews-page
    .publish-review-copy h2,

    .contact-reviews-page
    .publish-review-copy > p {

        margin-left: auto;
        margin-right: auto;
    }
}


/* =========================================================
   CELULAR
   ========================================================= */

@media (max-width: 600px) {

    .contact-reviews-page {

        width: calc(100% - 20px);

        padding-top: 13px;
        padding-bottom: 50px;
    }


    /* hero */

    .contact-reviews-page .contact-intro {

        padding:
            38px 17px 30px;

        border-radius: 18px;
    }


    .contact-reviews-page
    .contact-intro > span {

        padding: 6px 10px;

        font-size: .49rem;
    }


    .contact-reviews-page
    .contact-intro h1 {

        margin-top: 15px;

        font-size: 2.55rem;
    }


    .contact-reviews-page
    .contact-intro > p {

        font-size: .64rem;
    }


    .contact-reviews-page
    .contact-main-whatsapp {

        width: 100% !important;

        min-height: 48px !important;

        margin-top: 21px !important;
    }


    /* reseñas */

    .contact-reviews-page
    .customer-reviews-section {

        margin-top: 12px;

        padding: 18px 14px;

        border-radius: 17px;
    }


    .contact-reviews-page
    .customer-reviews-heading {

        grid-template-columns: 1fr;

        gap: 15px;

        padding-bottom: 18px;

        text-align: center;
    }


    .contact-reviews-page
    .customer-reviews-heading h2 {

        font-size: 1.55rem;
    }


    .contact-reviews-page
    .customer-reviews-heading p {

        margin-left: auto;
        margin-right: auto;

        font-size: .61rem;
    }


    .contact-reviews-page
    .review-average {

        width: 100%;
        min-width: 0;

        padding: 14px;
    }


    .contact-reviews-page
    .review-average strong {

        font-size: 2rem;
    }


    .contact-reviews-page
    .customer-review-grid {

        grid-template-columns: 1fr;

        gap: 9px;
    }


    /* formulario */

    .contact-reviews-page
    .publish-review-section {

        margin-top: 12px;

        padding: 20px 14px;

        border-radius: 17px;
    }


    .contact-reviews-page
    .publish-review-copy {

        padding: 5px 2px;
    }


    .contact-reviews-page
    .publish-review-copy h2 {

        font-size: 1.52rem;
    }


    .contact-reviews-page
    .publish-review-copy > p {

        font-size: .61rem;
    }


    .contact-reviews-page
    .review-privacy-info {

        margin-top: 16px;
    }


    .contact-reviews-page
    .review-privacy-info p {

        padding:
            10px 10px 10px 34px;

        text-align: left;

        font-size: .54rem;
    }


    .contact-reviews-page
    .customer-review-form {

        padding: 15px;

        border-radius: 14px;
    }


    .contact-reviews-page
    .review-form-grid {

        grid-template-columns: 1fr;

        gap: 11px;
    }


    .contact-reviews-page
    .customer-review-form
    input[type="text"],

    .contact-reviews-page
    .customer-review-form
    input[type="email"],

    .contact-reviews-page
    .customer-review-form
    input[type="tel"] {

        height: 47px !important;

        font-size: .62rem !important;
    }


    .contact-reviews-page
    .customer-review-form textarea {

        min-height: 120px !important;

        font-size: .62rem !important;
    }


    .contact-reviews-page
    .review-rating-picker {

        padding: 11px;
    }


    .contact-reviews-page
    .review-rating-picker > div {

        gap: 4px;
    }


    .contact-reviews-page
    .review-rating-picker
    label > span {

        min-height: 38px;

        padding: 0 2px;

        font-size: .52rem;
    }


    .contact-reviews-page
    .review-file-field
    input[type="file"] {

        font-size: .52rem;
    }


    .contact-reviews-page
    .submit-customer-review {

        min-height: 49px;
    }
}


/* =========================================================
   ANIMACIÓN SUAVE
   ========================================================= */

@keyframes contactProEnter {

    from {
        opacity: 0;
        transform: translateY(14px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


.contact-reviews-page .contact-intro,

.contact-reviews-page
.customer-reviews-section,

.contact-reviews-page
.publish-review-section {

    animation:
        contactProEnter .5s ease both;
}


.contact-reviews-page
.customer-reviews-section {

    animation-delay: .06s;
}


.contact-reviews-page
.publish-review-section {

    animation-delay: .12s;
}


@media (prefers-reduced-motion: reduce) {

    .contact-reviews-page *,
    .contact-reviews-page *::before,
    .contact-reviews-page *::after {

        animation: none !important;
        transition: none !important;
    }
}

/* =========================================================
   COUNTRY PICKER PRO
   NEXSTREAM MARKET
   ========================================================= */

.contact-reviews-page .review-phone-group {
    position: relative;
    min-width: 0;
}


/* TÍTULO */

.contact-reviews-page .review-field-title {
    display: flex;
    align-items: center;
    gap: 6px;

    margin-bottom: 7px;

    color: #263142;

    font-size: .58rem;
    font-weight: 900;
}


.contact-reviews-page
.review-field-title small {

    padding: 3px 6px;

    border-radius: 20px;

    background: #f0f3f7;

    color: #8a94a4;

    font-size: .44rem;
    font-weight: 800;
}


/* PAÍS + NÚMERO */

.contact-reviews-page .review-phone-row {

    display: grid;

    grid-template-columns:
        minmax(210px, .95fr)
        minmax(180px, 1.05fr);

    gap: 9px;
}


/* =========================================================
   SELECTOR
   ========================================================= */

.contact-reviews-page .country-picker {

    position: relative;

    min-width: 0;

    z-index: 30;
}


/* BOTÓN PRINCIPAL */

.contact-reviews-page
.country-picker-trigger {

    appearance: none;

    width: 100%;
    height: 48px;

    padding: 0 12px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 10px;

    border: 1px solid #dce2ea;
    border-radius: 11px;

    outline: none;

    background:
        linear-gradient(
            180deg,
            #ffffff,
            #f9fafc
        );

    color: #4b5667;

    font-family: inherit;

    cursor: pointer;

    box-shadow:
        0 2px 5px rgba(15,23,42,.025);

    transition:
        border-color .18s ease,
        box-shadow .18s ease,
        background .18s ease;
}


/* lado izquierdo */

.contact-reviews-page
.country-picker-current {

    min-width: 0;

    display: flex;
    align-items: center;

    gap: 9px;
}


.contact-reviews-page
.country-picker-globe {

    width: 27px;
    height: 27px;

    flex: 0 0 27px;

    display: grid;
    place-items: center;

    border-radius: 8px;

    background:
        linear-gradient(
            145deg,
            #edf7ff,
            #f5f1ff
        );

    font-size: .75rem;
}


.contact-reviews-page
.country-picker-text {

    overflow: hidden;

    color: #455164;

    font-size: .61rem;
    font-weight: 800;

    white-space: nowrap;
    text-overflow: ellipsis;
}


/* flecha */

.contact-reviews-page
.country-picker-arrow {

    width: 24px;
    height: 24px;

    flex: 0 0 24px;

    display: grid;
    place-items: center;

    border-radius: 7px;

    background: #eef1f5;

    color: #687386;

    font-size: .57rem;
    font-weight: 950;

    transition:
        transform .2s ease,
        color .2s ease,
        background .2s ease;
}


/* ABIERTO */

.contact-reviews-page
.country-picker.is-open
.country-picker-trigger {

    border-color:
        rgba(22,140,255,.48);

    background: #ffffff;

    box-shadow:
        0 0 0 4px
        rgba(22,140,255,.075);
}


.contact-reviews-page
.country-picker.is-open
.country-picker-arrow {

    transform: rotate(180deg);

    background:
        rgba(22,140,255,.10);

    color: #168cff;
}


/* =========================================================
   MENÚ FLOTANTE
   ========================================================= */

.contact-reviews-page
.country-picker-menu {

    position: absolute;

    z-index: 100;

    top: calc(100% + 7px);

    left: 0;

    width: 100%;

    max-height: 315px;

    padding: 7px;

    overflow-y: auto;
    overscroll-behavior: contain;

    border: 1px solid #dfe4eb;

    border-radius: 13px;

    background:
        rgba(255,255,255,.98);

    box-shadow:
        0 20px 45px
        rgba(15,23,42,.15);

    backdrop-filter:
        blur(12px);

    animation:
        countryMenuOpen .18s ease;
}


.contact-reviews-page
.country-picker-menu[hidden] {

    display: none !important;
}


/* título menú */

.contact-reviews-page
.country-picker-title {

    padding: 7px 9px 9px;

    color: #9199a6;

    font-size: .48rem;
    font-weight: 900;

    letter-spacing: .09em;

    text-transform: uppercase;
}


/* OPCIONES */

.contact-reviews-page
.country-option {

    width: 100%;
    min-height: 40px;

    padding: 0 9px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 10px;

    border: 0;

    border-radius: 9px;

    background: transparent;

    color: #4c5768;

    font-family: inherit;

    cursor: pointer;

    transition:
        background .16s ease,
        color .16s ease,
        transform .16s ease;
}


.contact-reviews-page
.country-option > span {

    font-size: .58rem;
    font-weight: 790;

    text-align: left;
}


.contact-reviews-page
.country-option > b {

    min-width: 43px;

    padding: 5px 7px;

    border-radius: 7px;

    background: #f0f3f7;

    color: #6d7787;

    font-size: .51rem;
    font-weight: 900;

    text-align: center;

    transition:
        background .16s ease,
        color .16s ease;
}


/* HOVER */

@media (hover:hover) {

    .contact-reviews-page
    .country-option:hover {

        background:
            rgba(22,140,255,.065);

        color: #137fd8;

        transform: translateX(2px);
    }


    .contact-reviews-page
    .country-option:hover > b {

        background:
            rgba(22,140,255,.10);

        color: #168cff;
    }
}


/* SELECCIONADO */

.contact-reviews-page
.country-option.selected {

    background:
        linear-gradient(
            90deg,
            rgba(22,140,255,.10),
            rgba(102,116,237,.06)
        );

    color: #147fd7;
}


.contact-reviews-page
.country-option.selected > b {

    background: #168cff;

    color: #ffffff;
}


/* OTRO PAÍS */

.contact-reviews-page
.country-picker-divider {

    height: 1px;

    margin: 6px 4px;

    background: #edf0f4;
}


.contact-reviews-page
.country-option-other {

    color: #6e5bd7;
}


.contact-reviews-page
.country-option-other > b {

    color: #6e5bd7;

    background:
        rgba(110,91,215,.09);
}


/* SCROLL */

.contact-reviews-page
.country-picker-menu::-webkit-scrollbar {

    width: 5px;
}


.contact-reviews-page
.country-picker-menu::-webkit-scrollbar-thumb {

    border-radius: 20px;

    background: #ccd3dc;
}


/* =========================================================
   CAMPO NÚMERO
   ========================================================= */

.contact-reviews-page
.review-number-field {

    position: relative;
}


.contact-reviews-page
.phone-selected-code {

    position: absolute;

    z-index: 2;

    left: 12px;
    top: 50%;

    transform: translateY(-50%);

    min-width: 27px;

    color: #168cff;

    font-size: .59rem;
    font-weight: 950;

    pointer-events: none;
}


.contact-reviews-page
.review-number-field
input[type="tel"] {

    width: 100% !important;

    height: 48px !important;

    padding-left: 47px !important;

    border-radius: 11px !important;
}


/* ayuda */

.contact-reviews-page
.review-phone-help {

    display: block;

    margin-top: 7px;

    color: #929ba8;

    font-size: .48rem;

    line-height: 1.45;
}


/* =========================================================
   OTRO PAÍS
   ========================================================= */

.contact-reviews-page
.review-custom-country-code {

    margin-top: 9px;

    padding: 12px;

    border:
        1px solid rgba(102,116,237,.15);

    border-radius: 11px;

    background:
        linear-gradient(
            145deg,
            rgba(22,140,255,.045),
            rgba(102,116,237,.035)
        );

    animation:
        countryMenuOpen .18s ease;
}


.contact-reviews-page
.review-custom-country-code[hidden] {

    display: none !important;
}


.contact-reviews-page
.review-custom-country-code > span {

    display: block;

    margin-bottom: 7px;

    color: #596577;

    font-size: .52rem;
    font-weight: 850;
}


.contact-reviews-page
.review-custom-code-input {

    position: relative;

    max-width: 180px;
}


.contact-reviews-page
.review-custom-code-input b {

    position: absolute;

    z-index: 2;

    top: 50%;
    left: 12px;

    transform: translateY(-50%);

    color: #168cff;

    font-size: .7rem;
}


.contact-reviews-page
.review-custom-code-input input {

    width: 100%;

    height: 43px;

    padding: 0 12px 0 28px;

    border: 1px solid #dce2e9;
    border-radius: 9px;

    outline: none;

    background: #ffffff;

    color: #283344;

    font-family: inherit;

    font-size: .61rem;
    font-weight: 800;
}


/* ANIMACIÓN */

@keyframes countryMenuOpen {

    from {
        opacity: 0;

        transform:
            translateY(-5px)
            scale(.985);
    }

    to {
        opacity: 1;

        transform:
            translateY(0)
            scale(1);
    }
}


/* =========================================================
   CELULAR
   ========================================================= */

@media (max-width: 600px) {

    .contact-reviews-page
    .review-phone-row {

        grid-template-columns: 1fr;

        gap: 8px;
    }


    .contact-reviews-page
    .country-picker-trigger {

        height: 47px;
    }


    .contact-reviews-page
    .country-picker-menu {

        max-height: 280px;
    }


    .contact-reviews-page
    .review-number-field
    input[type="tel"] {

        height: 47px !important;
    }


    .contact-reviews-page
    .review-custom-code-input {

        max-width: none;
    }
}
/* =========================================================
   COMO COMPRAR - FIX / DISEÑO PRO
   ========================================================= */

.how-buy-page {
    width: min(1180px, calc(100% - 36px));
    margin: 0 auto;
    padding: 32px 0 72px;
    text-align: center;
}

.how-buy-page svg {
    max-width: 100%;
}

.how-buy-hero {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding: 58px 30px 44px;
    border: 1px solid #e1e6ed;
    border-radius: 24px;
    background:
        radial-gradient(circle at 10% 0%, rgba(22,140,255,.10), transparent 31%),
        radial-gradient(circle at 91% 5%, rgba(225,45,72,.08), transparent 26%),
        linear-gradient(145deg,#ffffff,#f8faff);
    box-shadow: 0 22px 55px rgba(15,23,42,.07);
}

.how-buy-hero::before {
    content: "";
    position: absolute;
    top: 0;
    left: 12%;
    right: 12%;
    height: 3px;
    border-radius: 0 0 20px 20px;
    background: linear-gradient(90deg,transparent,#168cff,#7269ef,#e12d48,transparent);
}

.how-buy-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    border: 1px solid rgba(22,140,255,.15);
    border-radius: 999px;
    background: rgba(22,140,255,.06);
    color: #168cff;
    font-size: .58rem;
    font-weight: 900;
    letter-spacing: .14em;
}

.how-buy-kicker i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #168cff;
    box-shadow: 0 0 0 4px rgba(22,140,255,.10);
}

.how-buy-page .how-buy-hero h1 {
    margin: 18px 0 11px;
    color: #101828;
    font-size: clamp(2.7rem,5vw,4.8rem);
    font-weight: 950;
    line-height: .98;
    letter-spacing: -.055em;
}

.how-buy-hero > p {
    max-width: 760px;
    margin: 0 auto;
    color: #6f7a8d;
    font-size: .78rem;
    line-height: 1.7;
}

.how-buy-actions {
    margin-top: 26px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.how-buy-primary,
.how-buy-whatsapp {
    min-height: 48px;
    padding: 0 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border-radius: 12px;
    text-decoration: none;
    font-size: .65rem;
    font-weight: 900;
    transition: transform .18s ease, box-shadow .18s ease;
}

.how-buy-primary {
    background: linear-gradient(115deg,#1d2533,#111827);
    color: #fff;
    box-shadow: 0 10px 24px rgba(17,24,39,.17);
}

.how-buy-whatsapp {
    background: linear-gradient(115deg,#1fc760,#25d366);
    color: #07391b;
    box-shadow: 0 10px 24px rgba(37,211,102,.18);
}

.how-buy-whatsapp svg {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px;
    max-width: 20px;
    display: block;
    flex: 0 0 20px;
    fill: currentColor;
}

@media (hover:hover) {
    .how-buy-primary:hover,
    .how-buy-whatsapp:hover {
        transform: translateY(-2px);
    }
}

.how-buy-mini-trust {
    margin-top: 23px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 9px 18px;
    color: #7d8796;
    font-size: .55rem;
    font-weight: 750;
}

.how-buy-process {
    margin-top: 44px;
}

.how-buy-process > header > span {
    color: #168cff;
    font-size: .56rem;
    font-weight: 900;
    letter-spacing: .15em;
}

.how-buy-process > header h2 {
    margin: 7px 0 5px;
    color: #111827;
    font-size: clamp(1.7rem,3vw,2.45rem);
    letter-spacing: -.04em;
}

.how-buy-process > header p {
    margin: 0;
    color: #7d8795;
    font-size: .68rem;
}

.how-buy-steps {
    margin-top: 24px;
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 12px;
}

.how-buy-steps article {
    position: relative;
    min-width: 0;
    padding: 24px 18px 22px;
    border: 1px solid #e2e6ed;
    border-radius: 17px;
    background: linear-gradient(155deg,#fff,#fafbfd);
    box-shadow: 0 8px 24px rgba(15,23,42,.045);
    text-align: center;
}

.how-step-number {
    position: absolute;
    top: 13px;
    right: 14px;
    color: #b9c0cb;
    font-size: .55rem;
    font-weight: 950;
}

.how-step-icon {
    width: 54px;
    height: 54px;
    margin: 5px auto 16px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(22,140,255,.16);
    border-radius: 15px;
    background: linear-gradient(145deg,#eef7ff,#fff);
    color: #168cff;
    box-shadow: 0 8px 18px rgba(22,140,255,.09);
}

.how-step-icon.whatsapp-step {
    color: #1aaa58;
    border-color: rgba(37,211,102,.18);
    background: linear-gradient(145deg,#eafff2,#fff);
}

.how-step-icon svg {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px;
    max-width: 24px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.how-buy-steps h3 {
    margin: 0 0 7px;
    color: #171d29;
    font-size: .95rem;
    font-weight: 900;
}

.how-buy-steps article p {
    margin: 0;
    color: #778293;
    font-size: .62rem;
    line-height: 1.62;
}

.how-buy-confidence {
    margin-top: 38px;
    padding: 28px;
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    gap: 30px;
    align-items: center;
    border: 1px solid #e1e5ec;
    border-radius: 20px;
    background: radial-gradient(circle at 0 0,rgba(22,140,255,.08),transparent 34%),#fff;
    box-shadow: 0 14px 38px rgba(15,23,42,.05);
    text-align: left;
}

.how-confidence-copy > span {
    color: #e12d48;
    font-size: .55rem;
    font-weight: 900;
    letter-spacing: .14em;
}

.how-confidence-copy h2 {
    margin: 8px 0 9px;
    color: #111827;
    font-size: 1.55rem;
    line-height: 1.08;
    letter-spacing: -.035em;
}

.how-confidence-copy p {
    margin: 0;
    color: #758091;
    font-size: .66rem;
    line-height: 1.65;
}

.how-confidence-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;
}

.how-confidence-grid > div {
    min-width: 0;
    min-height: 74px;
    padding: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #e5e8ed;
    border-radius: 12px;
    background: #fafbfd;
}

.how-confidence-grid b {
    width: 29px;
    height: 29px;
    flex: 0 0 29px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    background: rgba(37,211,102,.10);
    color: #18a954;
    font-size: .68rem;
}

.how-confidence-grid span,
.how-confidence-grid strong,
.how-confidence-grid small {
    display: block;
}

.how-confidence-grid strong {
    color: #202633;
    font-size: .60rem;
    font-weight: 850;
}

.how-confidence-grid small {
    margin-top: 3px;
    color: #818b9a;
    font-size: .50rem;
    line-height: 1.4;
}

@media (max-width: 900px) {
    .how-buy-steps {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .how-buy-confidence {
        grid-template-columns: 1fr;
        text-align: center;
    }
}

@media (max-width: 600px) {
    .how-buy-page {
        width: calc(100% - 20px);
        padding: 14px 0 46px;
    }

    .how-buy-hero {
        padding: 37px 16px 28px;
        border-radius: 18px;
    }

    .how-buy-page .how-buy-hero h1 {
        font-size: 2.45rem;
    }

    .how-buy-hero > p {
        font-size: .64rem;
    }

    .how-buy-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .how-buy-primary,
    .how-buy-whatsapp {
        width: 100%;
        min-height: 47px;
    }

    .how-buy-mini-trust {
        display: grid;
        gap: 7px;
    }

    .how-buy-process {
        margin-top: 34px;
    }

    .how-buy-steps {
        grid-template-columns: 1fr;
        gap: 9px;
    }

    .how-buy-steps article {
        min-height: 0;
        padding: 16px 15px 16px 78px;
        text-align: left;
    }

    .how-step-icon {
        position: absolute;
        left: 14px;
        top: 16px;
        width: 48px;
        height: 48px;
        margin: 0;
    }

    .how-step-icon svg {
        width: 21px !important;
        height: 21px !important;
        min-width: 21px;
        max-width: 21px;
    }

    .how-buy-steps h3 {
        padding-right: 24px;
        font-size: .82rem;
    }

    .how-buy-steps article p {
        font-size: .57rem;
    }

    .how-buy-confidence {
        margin-top: 28px;
        padding: 19px 14px;
        border-radius: 16px;
    }

    .how-confidence-copy h2 {
        font-size: 1.32rem;
    }

    .how-confidence-grid {
        grid-template-columns: 1fr;
        text-align: left;
    }
}

/* =========================================================
   TOTAL DEL PEDIDO - PRECIO NORMAL / PRECIO OFERTA
   FIX FINAL
   ========================================================= */

/* Caja general */
[data-order-modal] .order-summary {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    align-items: center !important;

    gap: 18px !important;

    min-height: 72px !important;
    padding: 13px 16px !important;
}


/* Título izquierdo */
[data-order-modal] .order-summary-title,
[data-order-modal] .order-summary > span:first-child {
    color: #596477 !important;

    font-size: .72rem !important;
    font-weight: 850 !important;

    white-space: nowrap;
}


/* Contenedor derecho de precios */
[data-order-modal] .order-summary-prices,
[data-order-modal] .order-summary > div {
    display: flex !important;

    align-items: flex-end !important;
    justify-content: flex-end !important;

    gap: 17px !important;

    text-align: right !important;
}


/* =========================================================
   PRECIO NORMAL
   ========================================================= */

[data-order-modal] [data-order-compare] {
    position: relative !important;

    display: inline-block !important;

    min-width: 62px !important;

    padding-top: 16px !important;

    color: #98a2b3 !important;

    font-size: .84rem !important;
    font-weight: 800 !important;

    line-height: 1 !important;

    text-align: right !important;
}


/* Si no existe oferta, desaparece */
[data-order-modal] [data-order-compare][hidden] {
    display: none !important;
}


/* Texto "Precio normal" */
[data-order-modal] [data-order-compare]:not([hidden])::before {
    content: "Precio normal";

    position: absolute;

    top: 0;
    right: 0;

    color: #98a2b3 !important;

    font-size: .59rem !important;
    font-weight: 800 !important;

    line-height: 1 !important;

    white-space: nowrap;
}


/* Línea que tacha SOLO el precio */
[data-order-modal] [data-order-compare]:not([hidden])::after {
    content: "";

    position: absolute;

    right: 0;
    bottom: .35em;

    width: 100%;
    height: 1.5px;

    background: #98a2b3;

    pointer-events: none;
}


/* =========================================================
   PRECIO ACTUAL NORMAL
   ========================================================= */

[data-order-modal] [data-order-total] {
    position: relative !important;

    display: inline-block !important;

    color: #087fb8 !important;

    font-size: 1.38rem !important;
    font-weight: 950 !important;

    line-height: 1 !important;

    text-align: right !important;

    white-space: nowrap !important;
}


/* =========================================================
   CUANDO HAY OFERTA
   ========================================================= */

/*
   Si data-order-compare está visible,
   sabemos que existe promoción.
*/

[data-order-modal]
.order-summary-prices:has([data-order-compare]:not([hidden]))
[data-order-total],

[data-order-modal]
.order-summary > div:has([data-order-compare]:not([hidden]))
[data-order-total] {

    padding-top: 17px !important;

    color: #e11d48 !important;

    font-size: 1.65rem !important;
    font-weight: 950 !important;

    line-height: 1 !important;
}


/* Texto "Precio oferta" */
[data-order-modal]
.order-summary-prices:has([data-order-compare]:not([hidden]))
[data-order-total]::before,

[data-order-modal]
.order-summary > div:has([data-order-compare]:not([hidden]))
[data-order-total]::before {

    content: "Precio oferta";

    position: absolute;

    top: 0;
    right: 0;

    color: #e11d48 !important;

    font-size: .63rem !important;
    font-weight: 900 !important;

    line-height: 1 !important;

    white-space: nowrap;
}


/* =========================================================
   CELULAR
   ========================================================= */

@media (max-width: 600px) {

    [data-order-modal] .order-summary {
        grid-template-columns: 1fr auto !important;

        gap: 10px !important;

        padding: 12px 11px !important;
    }


    [data-order-modal] .order-summary-prices,
    [data-order-modal] .order-summary > div {
        gap: 11px !important;
    }


    [data-order-modal] [data-order-compare] {
        min-width: 54px !important;

        padding-top: 14px !important;

        font-size: .73rem !important;
    }


    [data-order-modal]
    [data-order-compare]:not([hidden])::before {
        font-size: .53rem !important;
    }


    [data-order-modal] [data-order-total] {
        font-size: 1.22rem !important;
    }


    [data-order-modal]
    .order-summary-prices:has([data-order-compare]:not([hidden]))
    [data-order-total],

    [data-order-modal]
    .order-summary > div:has([data-order-compare]:not([hidden]))
    [data-order-total] {

        padding-top: 15px !important;

        font-size: 1.45rem !important;
    }


    [data-order-modal]
    .order-summary-prices:has([data-order-compare]:not([hidden]))
    [data-order-total]::before,

    [data-order-modal]
    .order-summary > div:has([data-order-compare]:not([hidden]))
    [data-order-total]::before {

        font-size: .56rem !important;
    }
}
/* =========================================================
   COMBOS
   Ocultar total y WhatsApp hasta seleccionar 2 servicios
   ========================================================= */

[data-order-modal] .order-summary[hidden],
[data-order-modal] .modal-whatsapp[hidden] {
    display: none !important;
}
/* =========================================================
   COMBOS
   Lista de servicios en 2 columnas
   ========================================================= */

[data-order-modal] [data-plan-options].combo-plan-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

[data-order-modal] [data-plan-options].combo-plan-grid .modal-plan-option {
    min-height: 54px;
    padding: 8px 10px;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
}

[data-order-modal] [data-plan-options].combo-plan-grid .modal-plan-option span {
    min-width: 0;
}

[data-order-modal] [data-plan-options].combo-plan-grid .modal-plan-option span strong {
    display: block;
    font-size: .62rem;
    line-height: 1.15;
    word-break: break-word;
}

/* Ajuste fino en móvil */
@media (max-width: 700px) {
    [data-order-modal] [data-plan-options].combo-plan-grid {
        gap: 8px;
    }

    [data-order-modal] [data-plan-options].combo-plan-grid .modal-plan-option {
        min-height: 50px;
        padding: 7px 8px;
        gap: 7px;
    }

    [data-order-modal] [data-plan-options].combo-plan-grid .modal-plan-option span strong {
        font-size: .58rem;
    }
}