/* =========================================================================
   DKS Shop — premium theme styles
   Icons: Bootstrap Icons · Font: Inter (bundled)
   ========================================================================= */
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url('fonts/inter.woff2') format('woff2')}

:root{
  --blue:#1b3a7a; --blue-2:#12285a; --sky:#eaf1fc;
  --ink:#1a2230; --muted:#5b6675; --line:#e7ebf2; --bg:#f6f8fb; --card:#fff;
  --acc:#e10a7d; --acc-2:#b80866;
  --green:#1aa35c; --red:#d63a3a; --gold:#f5a623;
  --r:14px; --r-sm:10px;
  --sh:0 2px 10px rgba(20,35,70,.055);
  --sh-md:0 8px 26px rgba(20,35,70,.09);
  --sh-lg:0 18px 50px rgba(20,35,70,.13);
  --ct:1200px;
  --font:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;

  /* MODALIDAD — every accent on the cart/checkout/drawer/pay funnel is painted from
     these four, so the whole flow is pink for Alquiler and blue for Venta. The body
     (and the drawer's .dks-dm) carries .dks-m-alquiler / .dks-m-venta; these defaults
     are the rental colours, used wherever no mode class applies. */
  --m:#e10a7d; --m-2:#b80866; --m-soft:#fdeaf4; --m-line:#f8cfe4; --m-sh:225,10,125;
}
body.dks-m-alquiler,.dks-dm.dks-m-alquiler{--m:var(--acc);--m-2:var(--acc-2);--m-soft:#fdeaf4;--m-line:#f8cfe4;--m-sh:225,10,125}
body.dks-m-venta,.dks-dm.dks-m-venta{--m:var(--blue);--m-2:var(--blue-2);--m-soft:var(--sky);--m-line:#cfe0f7;--m-sh:27,58,122}
.dks-container{max-width:var(--ct);margin:0 auto;padding:0 22px}
body{color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
/* Product page: subtle full-screen background (full-bleed by being on <body>). */
.single-product,.single-product body{background:radial-gradient(1100px 560px at 82% -60px,rgba(27,58,122,.07),transparent 55%),linear-gradient(180deg,#f5f9ff 0%,#fbfcfe 420px)}
a{text-decoration:none}

/* =============================== HEADER (KM-style clean single bar) ===== */
.dks-header{font-family:var(--font);position:relative;z-index:120}
/* Kill the block-theme default flow margin so the hero sits flush under the header. */
.wp-site-blocks > main,.dks-home-main,.dks-servicios-main{margin-block-start:0;margin-top:0}

/* Top strip: official-distributor + production-leader seal, above the main nav. */
.dks-topbar{background:linear-gradient(90deg,var(--blue-2),var(--blue));color:#fff;font-size:.9rem}
.dks-topbar-in{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:40px}
.dks-topbadges{display:flex;align-items:center;gap:1.1rem;flex-wrap:wrap}
.dks-topbadge{display:inline-flex;align-items:center;gap:.4rem;font-weight:600;letter-spacing:.01em}
.dks-topbadge i{color:#8fd0ff;font-size:.9rem}
.dks-topbadge--lead i{color:#ffd34d}
.dks-toplinks{display:flex;align-items:center;gap:.6rem;white-space:nowrap;opacity:.92}
.dks-toplinks a{color:#fff;display:inline-flex;align-items:center;gap:.35rem;font-weight:600}
.dks-toplinks a:hover{text-decoration:underline}
.dks-topsep{opacity:.5}
@media(max-width:720px){
  .dks-topsep{display:none}
  .dks-topbar{font-size:.78rem}
  .dks-topbar-in{min-height:32px}
  /* Rotador: una sola línea, con el mensaje activo centrado y el resto fuera. Los mensajes
     se apilan en la misma celda para que la barra no cambie de alto al cambiar de texto. */
  .dks-topbar-in.is-rot{display:grid;grid-template-columns:1fr;justify-items:center;padding-block:.3rem}
  .dks-topbar-in.is-rot .dks-topbadges,.dks-topbar-in.is-rot .dks-toplinks{display:contents}
  .dks-topbar-in.is-rot .dks-toprot{grid-area:1/1;opacity:0;transform:translateY(4px);
    transition:opacity .35s ease,transform .35s ease;pointer-events:none;white-space:nowrap;
    max-width:100%;overflow:hidden;text-overflow:ellipsis}
  .dks-topbar-in.is-rot .dks-toprot.on{opacity:1;transform:none;pointer-events:auto}
  .dks-topbar-in.is-rot .dks-topsocial{display:none}
}

.dks-mainbar{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:120}
.dks-mainbar-in{display:flex;align-items:stretch;gap:1.2rem;min-height:66px}
.dks-brand{flex:0 0 auto;display:flex;align-items:center;padding-right:1.4rem;margin-right:.2rem;border-right:1px solid var(--line)}
.dks-brand img,.dks-brand .custom-logo{max-height:60px;width:auto}
.dks-brand .dks-logo-link{display:flex;align-items:center}
.dks-logo-img{height:52px!important;width:auto!important;max-width:none!important;display:block}
.dks-logo-text{font-size:1.4rem;font-weight:800;color:var(--blue);letter-spacing:-.03em}

/* inline primary nav */
.dks-navbar{display:flex;align-items:stretch}
.dks-menu{list-style:none;margin:0;padding:0;display:flex;align-items:stretch;gap:.15rem}
.dks-menu li{position:relative}
.dks-menu > li{display:flex;align-items:center}
.dks-menu > li > :is(a,button){display:flex;align-items:center;gap:.4rem;padding:.55rem .85rem;color:var(--ink);font-size:.94rem;font-weight:500;border-radius:8px;transition:.15s;white-space:nowrap}
.dks-menu > li.menu-item-has-children > :is(a,button)::after{content:"\f282";font-family:"bootstrap-icons";font-size:.72rem;color:var(--muted);transition:.2s}
.dks-menu > li:hover > :is(a,button){color:var(--blue);background:var(--bg)}
.dks-menu > li.menu-item-has-children:hover > :is(a,button)::after{transform:rotate(180deg);color:var(--blue)}
.dks-menu .current-menu-item > a{color:var(--blue)}
/* Corporativo / Gráfico only open their mega panel, so they render as <button> instead of a
   link (see dks_render_nav) — strip the UA button look and match the anchors. */
.dks-menu > li > button.dks-menu-open{font:inherit;font-size:.94rem;font-weight:500;background:none;border:0;cursor:pointer;text-align:left}
.dks-menu .sub-menu{display:none;position:absolute;top:100%;left:0;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-md);border-radius:0 0 var(--r-sm) var(--r-sm);min-width:245px;z-index:70;padding:.35rem 0}
/* hover:hover only — on a touch screen the :hover state sticks after a tap, which
   kept the panel open even though the accordion had removed .dks-open */
@media(hover:hover){.dks-menu li:hover > .sub-menu{display:block}}
.dks-menu .sub-menu a{display:block;padding:.55rem 1.1rem;color:var(--ink);font-size:.9rem;font-weight:500;transition:.12s}
.dks-menu .sub-menu a:hover{background:var(--bg);color:var(--blue)}

/* mega menu (full-width dropdown, KM style) */
.dks-menu > li.dks-has-mega{position:static}
.dks-mega{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid var(--line);box-shadow:var(--sh-lg);z-index:65}
.dks-mega::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
@media(hover:hover){
  .dks-menu > li.dks-has-mega:hover > .dks-mega,
  .dks-menu > li.sub-menu:hover > .sub-menu{display:block}
  .dks-menu li:hover > .sub-menu{display:block}
}
/* centre the panel on the site container instead of letting the columns hug the left
   edge with a dead gap before the promo card */
.dks-mega-in{display:flex;gap:2.5rem;padding:1.9rem 22px 2.1rem;align-items:stretch;max-width:var(--ct);margin:0 auto}
.dks-mega-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:2.4rem;flex:1 1 auto;min-width:0}
.dks-mega-col{min-width:0}
.dks-mega-col h4{margin:0 0 .85rem;padding-bottom:.6rem;border-bottom:1px solid var(--line);font-size:.74rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.dks-mega-col h4 a{color:inherit;transition:.12s}
.dks-mega-col h4 a:hover{color:var(--blue)}
.dks-mega-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.05rem}
.dks-mega-col ul a{display:flex;align-items:center;gap:.5rem;padding:.5rem .7rem;margin-left:-.7rem;border-radius:8px;color:var(--ink);font-size:.95rem;font-weight:500;transition:background .12s,color .12s}
.dks-mega-col ul a::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--line);flex:0 0 auto;transition:background .12s}
.dks-mega-col ul a:hover{background:var(--bg);color:var(--blue)}
.dks-mega-col ul a:hover::before{background:var(--acc)}
.dks-mega-promo{position:relative;flex:0 0 310px;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(135deg,var(--blue),var(--blue-2));color:#fff;border-radius:var(--r);padding:1.5rem 1.6rem;overflow:hidden;transition:.2s}
.dks-mega-promo:hover{box-shadow:var(--sh-md)}
.dks-mega-promo > i{font-size:1.9rem;margin-bottom:.7rem}
.dks-mega-promo b{font-size:1.12rem;margin-bottom:.3rem}
.dks-mega-promo span{font-size:.9rem;color:#d7e2f6;line-height:1.4}
.dks-mega-promo em{margin-top:.9rem;font-style:normal;font-weight:600;font-size:.88rem;color:#fff;display:inline-flex;align-items:center;gap:.4rem}
.dks-mega-promo em .bi{transition:.2s}
.dks-mega-promo:hover em .bi{transform:translateX(4px)}

/* right icon cluster */
.dks-actions{flex:0 0 auto;display:flex;align-items:stretch;margin-left:auto;border-left:1px solid var(--line)}
/* box-sizing + padding:0 so the <button> doesn't render a pixel wider than the <a>s */
.dks-ic{position:relative;box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:54px;padding:0;color:var(--blue);font-size:1.28rem;line-height:1;background:none;border:0;border-right:1px solid var(--line);cursor:pointer;transition:.15s;text-decoration:none}
/* bi-person is drawn smaller than bi-search/bi-cart3 at the same font-size */
.dks-ic .bi-person{font-size:1.42rem}
.dks-ic:last-child{border-right:0}
.dks-ic:hover{background:var(--bg);color:var(--blue-2)}
.dks-cart-count{position:absolute;top:13px;right:9px;background:var(--acc);color:#fff;font-size:.6rem;font-weight:700;min-width:16px;height:16px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 4px;box-shadow:0 2px 6px rgba(225,10,125,.4)}
.dks-burger{display:none;align-items:center;background:none;border:0;font-size:1.7rem;color:var(--blue);cursor:pointer;padding:0 .6rem}

/* toggleable search bar (drops below the main row) */
.dks-searchbar{display:none;background:#fff;border-bottom:1px solid var(--line)}
.dks-searchbar.open{display:block}
.dks-searchbar > .dks-container{padding-top:.85rem;padding-bottom:.85rem}
.dks-search{display:flex;border:1.5px solid var(--line);border-radius:999px;overflow:hidden;background:var(--bg);transition:.18s}
.dks-search:focus-within{border-color:var(--blue);background:#fff;box-shadow:0 0 0 4px var(--sky)}
.dks-search input[type=search]{flex:1;border:0;background:transparent;padding:.72rem 1.2rem;font-size:.95rem;font-family:var(--font);outline:none;min-width:0}
.dks-search button{border:0;background:var(--blue);color:#fff;padding:0 1.4rem;font-size:1.1rem;cursor:pointer;transition:.15s}
.dks-search button:hover{background:var(--blue-2)}
/* Live-search dropdown */
.dks-search-wrap{position:relative}
.dks-search-results{position:absolute;left:22px;right:22px;top:calc(100% + .5rem);z-index:130;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-lg);overflow:hidden;max-height:70vh;overflow-y:auto}
.dks-search-results[hidden]{display:none}
.dks-sr-head{padding:.55rem .95rem;font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);background:var(--bg);border-bottom:1px solid var(--line)}
.dks-sr-item{display:flex;align-items:center;gap:.9rem;padding:.7rem .95rem;border-bottom:1px solid var(--line);transition:background .12s}
.dks-sr-item:last-of-type{border-bottom:0}
.dks-sr-item:hover{background:var(--bg)}
.dks-sr-img{flex:0 0 auto;width:58px;height:58px;border-radius:var(--r-sm);background:var(--bg);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;overflow:hidden}
.dks-sr-img img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.dks-sr-tx{display:flex;flex-direction:column;gap:.22rem;min-width:0;flex:1}
.dks-sr-cat{font-size:.68rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--acc)}
.dks-sr-t{font-weight:700;font-size:.95rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}
.dks-sr-chips{display:flex;flex-wrap:wrap;gap:.3rem}
.dks-sr-chip{font-size:.7rem;font-weight:600;color:var(--blue);background:var(--sky);border-radius:6px;padding:.12rem .45rem;white-space:nowrap}
.dks-sr-meta{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin-top:.05rem}
.dks-sr-p{font-size:.92rem;color:var(--ink);font-weight:800}
.dks-sr-p del{color:var(--muted);font-weight:400;margin-right:.3rem;font-size:.8rem}
.dks-sr-p ins{text-decoration:none}
.dks-sr-stock{font-size:.72rem;font-weight:600;display:inline-flex;align-items:center;gap:.25rem}
.dks-sr-stock.ok{color:var(--green)}
.dks-sr-stock.no{color:var(--muted)}
.dks-sr-arrow{flex:0 0 auto;color:#c3ccda;font-size:1rem}
.dks-sr-all{display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.8rem;font-size:.85rem;font-weight:700;color:#fff;background:var(--blue)}
.dks-sr-all:hover{background:var(--blue-2)}
.dks-sr-empty{padding:1.6rem 1rem;font-size:.92rem;color:var(--muted);text-align:center;display:flex;flex-direction:column;align-items:center;gap:.4rem}
.dks-sr-empty i{font-size:1.5rem;color:#c3ccda}
.dks-sr-empty small{font-size:.8rem;color:var(--muted)}

/* breadcrumb — slim row below the header (wrap_before/after are empty, so the
   crumb links sit directly inside .dks-container — size THAT, not a nav wrapper). */
.dks-crumbs{background:transparent;font-size:.72rem!important;line-height:1.35}
.dks-crumbs .dks-container{padding-top:1rem;padding-bottom:.15rem;color:var(--muted);display:flex;align-items:center;flex-wrap:wrap;gap:.08rem}
.dks-crumbs,.dks-crumbs *{font-size:.72rem!important}
.dks-crumbs a{color:var(--muted);font-weight:500;transition:.15s}
.dks-crumbs a:hover{color:var(--blue);text-decoration:underline}
.dks-crumbs .bi{font-size:.56rem!important;margin:0 .28rem;color:#c3ccda;position:relative;top:-1px}

/* ===================== CHECKOUT / CART HEADER (steps) =================== */
.dks-header--checkout .dks-mainbar{box-shadow:var(--sh)}
.dks-checkout-in{min-height:66px;gap:1rem}
.dks-checkout-in .dks-brand{border-right:0}
.dks-steps{list-style:none;margin:0 auto;padding:0;display:flex;align-items:center;gap:2.6rem}
.dks-step{display:flex;align-items:center;gap:.55rem;color:#b9c2d0}
.dks-step-ic{width:40px;height:40px;border-radius:50%;border:2px solid currentColor;display:flex;align-items:center;justify-content:center;font-size:1.15rem;transition:.2s}
.dks-step-lbl{font-size:.9rem;font-weight:600}
.dks-step.on{color:var(--blue)}
.dks-step.on .dks-step-ic{background:var(--sky);border-color:var(--blue)}
.dks-step.done{color:var(--green)}
.dks-checkout-help{display:flex;align-items:center;gap:.5rem;color:var(--blue);font-weight:700;font-size:.92rem}
.dks-checkout-help:hover{color:var(--blue-2)}

/* =============================== CART (KM style) ======================= */
/* hide the block-theme page title ("Cart") above our own heading */
.woocommerce-cart .wp-block-post-title,.woocommerce-checkout .wp-block-post-title,
.woocommerce-cart .entry-title,.woocommerce-checkout .entry-title,
.woocommerce-cart header.entry-header,.woocommerce-checkout header.entry-header{display:none!important}
/* break the cart out of the block theme's constrained content width */
.woocommerce-cart main :is(.wp-block-group,.entry-content,.wp-block-post-content,.woocommerce),
.woocommerce-checkout main :is(.wp-block-group,.entry-content,.wp-block-post-content,.woocommerce){max-width:none!important;padding-left:0;padding-right:0}
.woocommerce-cart .woocommerce-notices-wrapper{max-width:var(--ct);margin:0 auto;padding:0 22px}
.dks-cart{max-width:var(--ct);margin:2.2rem auto 3rem;padding:0 22px;display:grid;grid-template-columns:1fr 372px;gap:2.6rem;align-items:start}
.dks-cart-titlebar h1{font-size:1.9rem;font-weight:800;letter-spacing:-.02em;margin:0 0 .3rem}
/* the cart is either a rental or a sale, never both — say which, in that mode's colour */
.dks-cart-mode{display:inline-flex;align-items:center;gap:.45rem;background:var(--m-soft);color:var(--m);border:1px solid var(--m-line);border-radius:999px;padding:.35rem .8rem;font-size:.82rem;font-weight:800;line-height:1.35}
.dks-cart-subhead{font-size:1.02rem;font-weight:700;margin:1.1rem 0 .2rem;padding-bottom:.9rem;border-bottom:1px solid var(--line)}

.dks-cart-items{display:flex;flex-direction:column}
.dks-cart-item{display:grid;grid-template-columns:88px 1fr auto auto auto;grid-template-areas:"thumb info qty remove price";align-items:start;gap:1.1rem;padding:1.4rem 0;border-bottom:1px solid var(--line)}
.dks-ci-thumb{grid-area:thumb;position:relative;width:88px}
.dks-ci-thumb img{width:88px;height:88px;object-fit:contain;border-radius:var(--r-sm);background:#fff;border:1px solid var(--line)}
.dks-ci-badge{position:absolute;top:-9px;right:-9px;z-index:2;width:24px;height:24px;border-radius:50%;background:var(--m);color:#fff;font-size:.76rem;font-weight:800;line-height:1;display:flex;align-items:center;justify-content:center;border:2px solid #fff;box-shadow:0 2px 6px rgba(var(--m-sh),.35)}
.dks-ci-info{grid-area:info;display:flex;flex-direction:column;gap:.3rem;min-width:0}
.dks-ci-name{font-size:1.05rem;font-weight:700;color:var(--ink)}
.dks-ci-name:hover{color:var(--m)}
.dks-ci-stock{display:inline-flex;align-items:center;gap:.4rem;font-size:.82rem;font-weight:600;color:var(--green)}
.dks-ci-stock.dks-out{color:var(--gold)}
/* modality / package / duration — chips, not a run-on "label: value" list */
.dks-ci-chips{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.45rem}
.dks-ci-chip{display:inline-flex;align-items:center;gap:.3rem;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:.24rem .6rem;font-size:.76rem;font-weight:700;color:var(--muted);line-height:1.35;white-space:nowrap}
.dks-ci-chip .bi{font-size:.8rem;opacity:.8}
.dks-ci-chip--lead{background:var(--m-soft);border-color:var(--m-line);color:var(--m);font-weight:800}
/* what the customer typed into the consumables form, quoted back at them */
.dks-ci-note{display:flex;gap:.4rem;margin:.5rem 0 0;padding:.5rem .65rem;background:var(--bg);border-left:3px solid var(--m-line);border-radius:6px;font-size:.84rem;line-height:1.45;color:var(--muted)}
.dks-ci-note .bi{color:var(--m);font-size:.85rem;margin-top:.1rem}
.dks-ci-meta{font-size:.86rem;color:var(--muted);line-height:1.5;margin-top:.2rem}
.dks-ci-meta dl,.dks-ci-meta p{margin:0}
.dks-ci-meta dt,.dks-ci-meta dd{display:inline;margin:0}
.dks-ci-qty{grid-area:qty}
.dks-ci-qty .quantity{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:#fff}
.dks-ci-qty .quantity label{display:none}
.dks-qbtn{width:34px;height:38px;border:0;background:none;color:var(--m);font-size:.9rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s}
.dks-qbtn:hover{background:var(--m-soft)}
.dks-ci-qty input.qty{width:40px;border:0;border-left:1px solid var(--line);border-right:1px solid var(--line);text-align:center;font-size:.95rem;font-weight:700;font-family:var(--font);padding:.5rem 0;-moz-appearance:textfield}
.dks-ci-qty input.qty::-webkit-outer-spin-button,.dks-ci-qty input.qty::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.dks-ci-remove{grid-area:remove}
.dks-cart .dks-ci-remove .remove{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;color:var(--muted)!important;font-size:1rem;transition:.15s;text-decoration:none}
.dks-cart .dks-ci-remove .remove:hover{background:#fdeef2!important;color:var(--acc)!important}
/* amount + "/ mes" on one line, the bolívar equivalent quietly under it */
.dks-ci-price{grid-area:price;display:flex;flex-direction:column;align-items:flex-end;gap:.15rem;text-align:right;font-size:1.05rem;font-weight:800;color:var(--ink);white-space:nowrap}
.dks-ci-amt{display:inline-flex;align-items:baseline;gap:.2rem}
.dks-ci-amt small{font-size:.76rem;font-weight:600;color:var(--muted)}
.dks-ci-price .dks-quote{font-size:.98rem}
/* on a line the bolívares are plain text — the bordered chip belongs to the total.
   Scoped through the cell so it outranks the generic .dks-bs skin further down. */
.dks-ci-price .dks-bs-line{margin:0;padding:0;background:none;border:0;border-radius:0;font-size:.78rem;font-weight:600;color:var(--muted);white-space:nowrap}

.dks-cart-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.2rem;padding:1.6rem 0}
/* the promo code is always expanded on desktop; the toggle only exists for phones */
.dks-coupon-toggle{display:none}
/* kept in the DOM so the form still posts update_cart when JS is off */
.dks-hidden-submit{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.dks-cart-busy{opacity:.55;pointer-events:none;transition:opacity .15s}
.dks-coupon label{display:block;font-size:.82rem;color:var(--muted);margin-bottom:.4rem}
.dks-coupon-row{display:flex;align-items:stretch;gap:.6rem}
/* Woo/theme sheets restyle bare `.input-text`; scope ours so the pill survives, and
   use border-box or the padding pushes the field past its container. */
.dks-cart-actions .dks-coupon-row input.input-text{box-sizing:border-box;flex:1 1 auto;height:46px;min-width:0;border:1.5px solid var(--line)!important;border-radius:999px!important;padding:.6rem 1.1rem!important;font-size:.9rem!important;font-family:var(--font)!important;background:#fff;outline:none}
.dks-cart-actions .dks-coupon-row input.input-text:focus{border-color:var(--blue)!important;box-shadow:0 0 0 4px var(--sky)}
.dks-cart-actions .dks-btn-ghost{box-sizing:border-box;flex:0 0 auto;height:46px;display:inline-flex;align-items:center;justify-content:center;border:1.5px solid var(--blue);background:#fff;color:var(--blue);font-weight:700;font-size:.82rem;letter-spacing:.02em;border-radius:999px;padding:0 1.3rem;cursor:pointer;transition:.15s;white-space:nowrap}
.dks-btn-ghost:hover{background:var(--blue);color:#fff}
.dks-cart-actions .dks-btn-update{box-sizing:border-box;height:46px;border:0;background:none;color:var(--muted);font-weight:600;font-size:.88rem;cursor:pointer;display:inline-flex;align-items:center;gap:.4rem;transition:.15s;padding:0}
.dks-btn-update:hover{color:var(--blue)}
/* a direct child of the .dks-cart grid (not of .dks-cart-main) so phones can push it
   below the summary; on desktop it stays under the line items, in column 1 */
.dks-cart-back{grid-column:1;justify-self:start;display:inline-flex;align-items:center;gap:.55rem;color:var(--blue);font-weight:700;font-size:.86rem;letter-spacing:.02em}
.dks-cart-back:hover{color:var(--blue-2)}

/* order summary sidebar */
.dks-summary-title{font-size:1.15rem;font-weight:800;margin:0 0 1rem}
.dks-sum-card{border:1px solid var(--line);border-radius:var(--r);padding:1.1rem 1.2rem;margin-bottom:1rem;background:#fff}
.dks-sum-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;font-size:.95rem;padding:.32rem 0;color:var(--ink)}
.dks-sum-lead b{font-size:1.05rem}
.dks-sum-note{font-size:.82rem;color:var(--muted);margin-top:.2rem}
.dks-sum-discount span{color:var(--green)}
.dks-sum-free{color:var(--green);font-weight:700}
.dks-sum-total{border-top:1px solid var(--line);margin-top:.5rem;padding-top:.8rem;font-size:1.15rem;font-weight:800;align-items:flex-start}
.dks-sum-total b{display:flex;flex-direction:column;align-items:flex-end;gap:.2rem;font-size:1.3rem;color:var(--m)}
.dks-sum-total .amount,.dks-sum-total bdi{font-weight:800}
.dks-btn-checkout{display:block;text-align:center;background:var(--m);color:#fff;font-weight:800;letter-spacing:.02em;padding:.95rem 1rem;border-radius:var(--r-sm);margin-top:1.1rem;font-size:.95rem;transition:.18s;box-shadow:0 6px 18px rgba(var(--m-sh),.28)}
.dks-btn-checkout:hover{background:var(--m-2);transform:translateY(-1px)}

/* advice box */
.dks-cart-advice{background:var(--sky);border-radius:var(--r);padding:1.2rem 1.3rem}
.dks-cart-advice > b{display:block;font-size:1rem;margin-bottom:.8rem;color:var(--ink)}
.dks-cart-advice-in{display:flex;align-items:center;gap:.9rem}
.dks-cart-advice .ava{width:46px;height:46px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex:0 0 auto}
.dks-cart-advice-in a{display:block;color:var(--blue);font-weight:700;font-size:.98rem}
.dks-cart-advice-in a:last-child{font-weight:500;font-size:.86rem;margin-top:.1rem}
.dks-cart-advice-in a:hover{text-decoration:underline}

/* empty cart */
.dks-empty{display:flex;align-items:center;gap:2rem;padding:2rem 0 1rem}
.dks-empty-ic{font-size:5rem;color:#c3ccda;line-height:1}
.dks-empty-msg{font-size:1.1rem;font-weight:700;margin:0 0 1.2rem}
.dks-cart--empty .dks-btn-checkout{display:inline-block}

/* WooCommerce notices — one card style, colour-coded by type.
   Woo's own rules add a purple top border, 3.5em of left padding for a glyph from its
   icon font, and a table clearfix; all of it is replaced here. */
.woocommerce-message,.woocommerce-info,.woocommerce-error{
  display:flex;align-items:center;flex-wrap:wrap;gap:.5rem .85rem;
  max-width:var(--ct);margin:1rem auto;padding:.95rem 1.2rem!important;
  border:1px solid var(--line);border-top-width:1px!important;border-radius:var(--r-sm);
  background:var(--bg);color:var(--ink);font-size:.92rem;font-weight:600;line-height:1.45;
  list-style:none;box-shadow:0 1px 2px rgba(20,35,70,.05);width:auto}
.woocommerce-message::before,.woocommerce-info::before,.woocommerce-error::before,
.woocommerce-message::after,.woocommerce-info::after,.woocommerce-error::after{
  content:none!important;display:none!important}
/* our own leading glyph, from the icon font already loaded on every page */
.woocommerce-message::before,.woocommerce-info::before,.woocommerce-error::before{
  content:""!important;display:inline-block!important;position:static;flex:0 0 auto;
  font-family:bootstrap-icons!important;font-size:1.15rem;line-height:1}
.woocommerce-message{border-color:#bfe6cf;background:#eefbf3;color:#146c40}
.woocommerce-message::before{content:"\f26a"!important;color:#1aa35c}
.woocommerce-info{border-color:#c3d3ee;background:#f4f8fe;color:#1b3a7a}
.woocommerce-info::before{content:"\f430"!important;color:var(--blue)}
.woocommerce-error{border-color:#f3c2cf;background:#fdeef2;color:#a11049}
.woocommerce-error::before{content:"\f33a"!important;color:#d21f5c}
/* the trailing action link ("Ver carrito", "Volver a la tienda") */
.woocommerce-message .button,.woocommerce-info .button,.woocommerce-error .button{
  order:2;margin-left:auto;display:inline-flex;align-items:center;gap:.35rem;
  background:#fff;border:1.5px solid currentColor;border-radius:999px;padding:.45rem 1rem;
  color:inherit;font-size:.84rem;font-weight:700;line-height:1.2;white-space:nowrap;
  transition:.15s;float:none;text-decoration:none}
/* currentColor would resolve against this rule's own `color`, so name each hover fill */
.woocommerce-message .button:hover{background:#146c40;color:#fff}
.woocommerce-info .button:hover{background:var(--blue);color:#fff}
.woocommerce-error .button:hover{background:#a11049;color:#fff}
/* WooCommerce prints the error text as one <li> per problem */
.woocommerce-error li{width:100%;margin:0;list-style:none}

/* Newer Woo emits notices as block banners with an inline SVG instead of the classes
   above ("No se ha hecho ningún pedido todavía", empty cart, …). Same skin, different DOM.
   Scoped away from .dks-coupon-box, which styles its own banner. */
:not(.dks-coupon-box)>.wc-block-components-notice-banner{
  display:flex;align-items:center;gap:.5rem .85rem;flex-wrap:wrap;
  max-width:var(--ct);margin:1rem auto;padding:.95rem 1.2rem!important;
  border:1px solid var(--line)!important;border-radius:var(--r-sm)!important;
  background:var(--bg)!important;color:var(--ink);font-size:.92rem;font-weight:600;
  box-shadow:0 1px 2px rgba(20,35,70,.05);min-height:0!important}
:not(.dks-coupon-box)>.wc-block-components-notice-banner>svg{
  flex:0 0 auto;width:22px;height:22px;margin:0!important;padding:0!important;
  background:transparent!important;border-radius:0!important}
:not(.dks-coupon-box)>.wc-block-components-notice-banner .wc-block-components-notice-banner__content{
  display:flex;align-items:center;flex-wrap:wrap;gap:.5rem .85rem;flex:1 1 auto;margin:0!important}
.wc-block-components-notice-banner.is-success{border-color:#bfe6cf!important;background:#eefbf3!important;color:#146c40}
.wc-block-components-notice-banner.is-success>svg{fill:#1aa35c!important}
.wc-block-components-notice-banner.is-info{border-color:#c3d3ee!important;background:#f4f8fe!important;color:#1b3a7a}
.wc-block-components-notice-banner.is-info>svg{fill:var(--blue)!important}
.wc-block-components-notice-banner.is-error{border-color:#f3c2cf!important;background:#fdeef2!important;color:#a11049}
.wc-block-components-notice-banner.is-error>svg{fill:#d21f5c!important}
:not(.dks-coupon-box)>.wc-block-components-notice-banner .button{
  margin-left:auto;display:inline-flex;align-items:center;gap:.35rem;
  background:#fff;border:1.5px solid currentColor;border-radius:999px;padding:.45rem 1rem;
  color:inherit;font-size:.84rem;font-weight:700;line-height:1.2;white-space:nowrap;text-decoration:none;transition:.15s}
.wc-block-components-notice-banner.is-success .button:hover{background:#146c40;color:#fff}
.wc-block-components-notice-banner.is-info .button:hover{background:var(--blue);color:#fff}
.wc-block-components-notice-banner.is-error .button:hover{background:#a11049;color:#fff}

/* Hide the block-theme's own header/footer template parts — we render ours
   via wp_body_open / wp_footer, so the block ones would duplicate. */
.woocommerce-cart header.wp-block-template-part,
.woocommerce-checkout header.wp-block-template-part,
.woocommerce-shop header.wp-block-template-part,
.post-type-archive-product header.wp-block-template-part,
.tax-product_cat header.wp-block-template-part,
.single-product header.wp-block-template-part{display:none!important}
/* our header already renders a breadcrumb — hide WooCommerce's block one */
.wc-block-breadcrumbs,.wp-block-woocommerce-breadcrumbs{display:none!important}
/* no chunky focus box on mouse click (keyboard focus still shows) */
:where(a,button,input,select,summary,.dks-fopt,.dks-sorttab,.dks-tier,.dks-term):focus:not(:focus-visible){outline:none!important;box-shadow:none}
a:focus,button:focus{outline-color:var(--blue)}

/* =============================== CHECKOUT (KM style) =================== */
.woocommerce-checkout .woocommerce{max-width:var(--ct);margin:1.6rem auto 3rem;padding:0 22px}
.woocommerce-checkout .woocommerce-form-coupon-toggle{max-width:var(--ct);margin:0 auto 1.2rem}
/* friendly coupon UX — WooCommerce renders this as a block notice banner */
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info,
.woocommerce-checkout .woocommerce-form-coupon-toggle .wc-block-components-notice-banner{background:#fff!important;border:1px dashed #c3d3ee!important;color:var(--ink)!important;border-radius:var(--r-sm)!important;padding:.75rem 1.1rem!important;font-size:.92rem;font-weight:600;box-shadow:none!important;min-height:0!important}
.woocommerce-checkout .woocommerce-form-coupon-toggle .wc-block-components-notice-banner__content{margin:0}
.woocommerce-checkout .woocommerce-form-coupon-toggle .wc-block-components-notice-banner>svg{fill:var(--acc)!important;background:transparent!important;border-radius:0;padding:0;margin-right:.4rem;width:20px;height:20px}
.woocommerce-checkout .woocommerce-form-coupon-toggle a.showcoupon,
.woocommerce-checkout .woocommerce-form-coupon-toggle a{color:var(--blue)!important;font-weight:700;text-decoration:none}
.woocommerce-checkout .woocommerce-form-coupon-toggle a:hover{color:var(--acc)!important}
.woocommerce-checkout form.checkout_coupon{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.3rem 1.4rem;margin:0 auto 1.4rem;max-width:var(--ct);box-shadow:var(--sh)}
.woocommerce-checkout form.checkout_coupon>p:first-child{margin-top:0;color:var(--muted);font-size:.9rem}
.woocommerce-checkout form.checkout_coupon .form-row{display:inline-block;margin:.4rem .6rem 0 0;vertical-align:top}
.woocommerce-checkout form.checkout_coupon .input-text{min-width:240px}
.woocommerce-checkout form.checkout_coupon .button{background:var(--blue)!important;color:#fff!important;border:0!important;border-radius:999px!important;padding:.7rem 1.4rem!important;font-weight:700!important;font-size:.9rem!important;box-shadow:none!important;transition:.15s}
.woocommerce-checkout form.checkout_coupon .button:hover{background:var(--blue-2)!important}
/* Right column stacks: heading → coupon → summary. Rows are explicit so the coupon
   (which the JS appends after #order_review) is not auto-placed below the pay button,
   and `1fr` on the last row absorbs the height of the spanning #customer_details
   instead of inflating row 1. */
form.checkout.woocommerce-checkout{display:grid;grid-template-columns:1fr 384px;grid-template-rows:min-content min-content 1fr;column-gap:2.4rem;row-gap:0;align-items:start}
#customer_details{grid-column:1;grid-row:1 / span 3}
#order_review_heading{grid-column:2;grid-row:1;margin:0 0 .9rem;font-size:1.15rem;font-weight:800}
.dks-coupon-box{grid-column:2;grid-row:2}
#order_review{grid-column:2;grid-row:3}
#customer_details .col-1,#customer_details .col-2{width:auto;float:none}
.woocommerce-checkout h3{font-size:1.15rem;font-weight:800;color:var(--ink);margin:0 0 1rem}
.woocommerce-billing-fields,.woocommerce-shipping-fields,.woocommerce-additional-fields{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.4rem 1.5rem;margin-bottom:1.4rem}
/* Woo prints these wrappers even with nothing in them (no shipping address needed,
   order notes disabled) — an empty card. Whitespace defeats :empty, so match on children. */
.woocommerce-shipping-fields:not(:has(*)),.woocommerce-additional-fields:not(:has(*)){display:none}
.woocommerce-checkout .form-row{margin:0 0 1rem}
.woocommerce-checkout label{font-size:.85rem;font-weight:600;color:var(--ink);margin-bottom:.35rem;display:block}
.woocommerce-checkout .required{color:var(--acc);border:0}
.woocommerce-checkout input.input-text,.woocommerce-checkout textarea,.woocommerce-checkout select,.woocommerce-checkout .select2-selection{border:1.5px solid var(--line)!important;border-radius:var(--r-sm)!important;padding:.7rem .9rem!important;font-size:.92rem!important;font-family:var(--font)!important;background:#fff;width:100%;min-height:auto;box-shadow:none!important}
.woocommerce-checkout .select2-selection__rendered{line-height:1.5!important;padding:0!important}
.woocommerce-checkout .select2-selection__arrow{top:.55rem!important}
.woocommerce-checkout input.input-text:focus,.woocommerce-checkout textarea:focus,.woocommerce-checkout select:focus{border-color:var(--blue)!important;box-shadow:0 0 0 4px var(--sky)!important;outline:0}
/* order review (right card, like the cart summary) */
#order_review{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.3rem 1.4rem;position:sticky;top:82px}
#order_review .shop_table{width:100%;border:0;margin:0 0 1rem;font-size:.92rem}
#order_review .shop_table th,#order_review .shop_table td{padding:.5rem 0;border:0;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
#order_review .shop_table td.product-total,#order_review .shop_table th.product-total,#order_review .shop_table .amount{text-align:right;font-weight:700}
#order_review .shop_table td.product-total{white-space:nowrap;padding-left:.75rem;vertical-align:top}
/* product line with thumbnail */
.dks-review-table td.product-name{padding:.7rem 0!important}
.dks-ro-item{display:flex;align-items:center;gap:.75rem}
.dks-ro-thumb{position:relative;flex:0 0 auto;width:54px;height:54px;border-radius:var(--r-sm);background:var(--bg);border:1px solid var(--line);display:flex;align-items:center;justify-content:center}
.dks-ro-thumb img{width:100%;height:100%;object-fit:contain;border-radius:var(--r-sm);mix-blend-mode:multiply}
.dks-ro-qty{position:absolute;top:-9px;right:-9px;z-index:2;width:22px;height:22px;border-radius:50%;background:var(--blue);color:#fff;font-size:.72rem;font-weight:800;line-height:1;display:flex;align-items:center;justify-content:center;border:2px solid #fff;box-shadow:0 2px 6px rgba(20,35,70,.3)}
.dks-ro-tx{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.dks-ro-name{font-weight:700;font-size:.9rem;color:var(--ink);line-height:1.25}
.dks-ro-tx .variation,.dks-ro-tx .wc-item-meta{font-size:.78rem;color:var(--muted);margin:.2rem 0 0;padding:0;list-style:none}
/* variation meta: "Label: value" one pair per line, INLINE so it wraps within the
   column and never forces it wide (a wide grid/table col collides with the price). */
.dks-ro-tx .variation{display:block;line-height:1.35}
.dks-ro-tx .variation dt{display:inline;margin:0;font-weight:600;color:var(--muted)}
.dks-ro-tx .variation dt::after{content:" "}
.dks-ro-tx .variation dd{display:inline;margin:0;color:var(--muted)}
.dks-ro-tx .variation dd p{display:inline;margin:0}
.dks-ro-tx .variation dd::after{content:"";display:block}
/* coupon — expandable box beside the summary (moved here by JS) */
.dks-coupon-box{margin:0 0 1rem}
.dks-coupon-box .woocommerce-form-coupon-toggle{margin:0}
.dks-coupon-box .woocommerce-info,
.dks-coupon-box .wc-block-components-notice-banner{background:#fff!important;border:1px dashed #c3d3ee!important;color:var(--ink)!important;border-radius:var(--r-sm)!important;padding:.8rem 1rem!important;font-size:.88rem;font-weight:600;box-shadow:none!important;min-height:0!important;display:flex;align-items:center;gap:.45rem;margin:0!important}
.dks-coupon-box .wc-block-components-notice-banner>svg{fill:var(--acc)!important;background:transparent!important;width:20px;height:20px;margin:0}
.dks-coupon-box a.showcoupon,.dks-coupon-box a{color:var(--blue)!important;font-weight:700;text-decoration:none}
.dks-coupon-box a:hover{color:var(--acc)!important}
/* Woo floats the coupon's .form-row children, so the form collapses to ~34px and the
   input and button spill outside the card. Stack them instead: field, then button. */
.dks-coupon-box form.checkout_coupon{display:flex;flex-direction:column;gap:.6rem;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1rem;margin:.6rem 0 0;box-shadow:var(--sh);max-width:none;overflow:hidden}
.dks-coupon-box form.checkout_coupon>p:first-child{margin:0;color:var(--muted);font-size:.86rem}
.dks-coupon-box form.checkout_coupon .form-row{display:block;float:none!important;width:100%!important;margin:0;padding:0}
.dks-coupon-box form.checkout_coupon .input-text{width:100%;min-width:0!important;border:1.5px solid var(--line)!important;border-radius:var(--r-sm)!important;padding:.7rem .9rem!important;margin:0;box-sizing:border-box}
.dks-coupon-box form.checkout_coupon .button{width:100%;background:var(--blue)!important;color:#fff!important;border:0!important;border-radius:999px!important;padding:.7rem 1rem!important;font-weight:700!important;font-size:.9rem!important;margin:0;float:none!important}
.dks-coupon-box form.checkout_coupon .button:hover{background:var(--blue-2)!important}
.dks-coupon-box form.checkout_coupon .clear{display:none}
/* mobile collapsible summary toggle */
.dks-ro-toggle,.dks-ro-panel{display:none}
#order_review .cart-subtotal th,#order_review .order-total th{font-weight:700}
#order_review .order-total{font-size:1.15rem}
#order_review .order-total .amount{color:var(--ink);font-weight:800}
#order_review .wc-item-meta,#order_review .variation{font-size:.82rem;color:var(--muted);margin:.2rem 0 0;list-style:none;padding:0}
/* payment — radio cards.
   Woo's own rules are `.woocommerce-checkout #payment ...` (a purple-grey tint on the
   wrapper and #dcd7e2 on the boxes), so ours must carry the same prefix to win. */
.woocommerce-checkout #payment,
.woocommerce-cart #payment,
#payment{background:transparent!important;border:0;border-top:1px solid var(--line);border-radius:0;margin-top:1.1rem;padding:1.1rem 0 0}
.dks-pay-title{display:flex;align-items:center;justify-content:space-between;gap:.5rem;font-size:1rem!important;font-weight:800;color:var(--ink);margin:0 0 .8rem!important}
.dks-pay-title .dks-pay-secure{font-size:.74rem;font-weight:700;color:#146c40;background:#eefbf3;border:1px solid #bfe6cf;border-radius:999px;padding:.22rem .55rem;display:inline-flex;align-items:center;gap:.3rem;white-space:nowrap}
.woocommerce-checkout #payment ul.payment_methods,
#payment ul.payment_methods{border:0;padding:0;margin:0;list-style:none;background:transparent;display:flex;flex-direction:column;gap:.6rem}
.woocommerce-checkout #payment ul.payment_methods::before,
.woocommerce-checkout #payment ul.payment_methods::after{content:none;display:none}
.woocommerce-checkout #payment ul.payment_methods li,
#payment ul.payment_methods li{line-height:1.4;margin:0;background:#fff;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:.85rem 1rem;transition:border-color .15s,box-shadow .15s,background .15s}
#payment ul.payment_methods li:hover{border-color:#c3d3ee}
#payment ul.payment_methods li:has(input[type=radio]:checked){border-color:var(--blue);background:#fbfcff;box-shadow:0 0 0 3px var(--sky)}
#payment ul.payment_methods li:has(input[type=radio]:focus-visible){box-shadow:0 0 0 4px var(--sky)}
#payment ul.payment_methods li label{font-weight:700;color:var(--ink);font-size:.95rem;display:flex;align-items:center;gap:.55rem;cursor:pointer;margin:0}
#payment ul.payment_methods li input[type=radio]{accent-color:var(--blue);width:18px;height:18px;flex:0 0 auto;margin:0;cursor:pointer}
#payment ul.payment_methods li label img{margin-left:auto;max-height:24px;width:auto;float:none}
#payment ul.payment_methods li .payment_method_paypal a.about_paypal{display:none}
.woocommerce-checkout #payment div.payment_box,
#payment div.payment_box{background:var(--bg)!important;background-color:var(--bg)!important;border-radius:var(--r-sm);font-size:.86rem;color:var(--muted);padding:.8rem .95rem;margin:.7rem 0 0;line-height:1.45;width:auto}
#payment div.payment_box p:last-child{margin-bottom:0}
.woocommerce-checkout #payment div.payment_box::before,
.woocommerce-checkout #payment div.payment_box::after,
#payment div.payment_box::before,#payment div.payment_box::after{display:none!important;content:none!important;border:0!important}
.woocommerce-checkout #payment .place-order,
#payment .place-order{padding:1rem 0 0;margin:0;background:transparent}
.woocommerce-checkout #place_order,.woocommerce #payment #place_order{display:block!important;width:100%;background:var(--acc)!important;color:#fff!important;font-weight:800!important;letter-spacing:.02em;font-size:.98rem!important;border:0!important;border-radius:var(--r-sm)!important;padding:.95rem 1rem!important;margin-top:0!important;box-shadow:0 6px 18px rgba(225,10,125,.28)!important;transition:.18s;float:none;text-transform:none}
.woocommerce-checkout #place_order:hover{background:var(--acc-2)!important;transform:translateY(-1px)}
.woocommerce-checkout #place_order:disabled{opacity:.6;cursor:not-allowed;transform:none}
.dks-pay-trust{display:flex;align-items:center;justify-content:center;gap:.4rem;font-size:.78rem;color:var(--muted);margin:.75rem 0 0}
.dks-pay-trust i{color:#146c40}
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper{margin:0 0 .9rem}
.woocommerce-checkout .woocommerce-privacy-policy-text{font-size:.8rem;color:var(--muted);margin:0 0 .9rem}
.woocommerce-checkout .woocommerce-privacy-policy-text p:last-child{margin-bottom:0}
/* thank-you / order-received page (classic template, forced over the block version) */
/* core/columns wrapper left behind once its address blocks are removed: 0px tall, but it
   still collects the theme's blockGap */
.wc-block-order-confirmation-address-wrapper{display:none}
.dks-thanks{max-width:820px;margin:2rem auto 3.5rem;padding:3rem 22px 0}
.dks-thanks-head{text-align:center;margin-bottom:1.8rem}
.dks-thanks-ic{display:flex;align-items:center;justify-content:center;width:68px;height:68px;margin:0 auto 1.1rem;
  border-radius:50%;background:#eefbf3;border:1px solid #bfe6cf;color:#1aa35c;font-size:2rem}
.dks-thanks-head--failed .dks-thanks-ic{background:#fdeef2;border-color:#f3c2cf;color:#d21f5c}
.dks-thanks-head h1{font-size:clamp(1.5rem,3vw,2.1rem);font-weight:800;letter-spacing:-.02em;color:var(--ink);margin:0 0 .6rem;line-height:1.2}
.dks-thanks-head p{color:var(--muted);font-size:1rem;line-height:1.6;max-width:52ch;margin:0 auto}
.dks-thanks-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.6rem 1.7rem;margin-bottom:1.4rem}
.dks-thanks-title{font-size:1.1rem;font-weight:800;color:var(--ink);margin:0 0 1.1rem}
.dks-thanks-meta{list-style:none;margin:0 0 .4rem;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:1rem}
.dks-thanks-meta li{display:flex;flex-direction:column;gap:.25rem;padding:.85rem 1rem;background:var(--bg);border-radius:var(--r-sm)}
.dks-thanks-meta span{font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700}
.dks-thanks-meta b{font-size:.98rem;color:var(--ink);font-weight:700}
.dks-thanks-meta b .amount{color:var(--ink)}
.dks-thanks-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-bottom:1.4rem}
.dks-thanks-btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;flex:1 1 200px;
  background:var(--blue);color:#fff;border-radius:999px;padding:.8rem 1.4rem;font-weight:700;font-size:.92rem;transition:.15s}
.dks-thanks-btn:hover{background:var(--blue-2);color:#fff}
.dks-thanks-btn--ghost{background:#fff;color:var(--blue);border:1.5px solid var(--line)}
.dks-thanks-btn--ghost:hover{background:var(--blue);color:#fff;border-color:var(--blue)}
.dks-thanks-help{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;background:#fff;border:1px solid var(--line);
  border-radius:var(--r);box-shadow:var(--sh);padding:1.1rem 1.3rem}
.dks-thanks-help-ic{width:48px;height:48px;flex:0 0 auto;border-radius:12px;background:#e8f7ef;color:var(--green);
  display:flex;align-items:center;justify-content:center;font-size:1.35rem}
.dks-thanks-help b{color:var(--ink)}
.dks-thanks-help p{color:var(--muted);font-size:.88rem;margin-top:.1rem}
.dks-thanks-help-btn{margin-left:auto;display:inline-flex;align-items:center;gap:.45rem;background:#1aa35c;color:#fff;
  border-radius:999px;padding:.6rem 1.1rem;font-weight:700;font-size:.9rem;transition:.15s}
.dks-thanks-help-btn:hover{background:#158b4d;color:#fff}
/* the order + customer tables printed by the woocommerce_thankyou hook */
.dks-thanks .woocommerce-order-details,
.dks-thanks .woocommerce-customer-details{margin-top:1.6rem;padding-top:1.4rem;border-top:1px solid var(--line)}
.dks-thanks .woocommerce-order-details h2,
.dks-thanks .woocommerce-customer-details h2{font-size:1rem;font-weight:800;color:var(--ink);margin:0 0 .9rem}
.dks-thanks table.shop_table{width:100%;border:0;border-collapse:collapse;font-size:.92rem}
.dks-thanks table.shop_table th,
.dks-thanks table.shop_table td{padding:.7rem 0;border:0;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.dks-thanks table.shop_table td:last-child,
.dks-thanks table.shop_table th:last-child{text-align:right;white-space:nowrap}
/* line item: thumbnail beside the name; the quantity and the variation meta that Woo
   prints as siblings stay on their own line under it */
.dks-thanks td.product-name{padding:.9rem 0}
.dks-ty-item{display:inline-flex;align-items:center;gap:.8rem;vertical-align:middle}
.dks-ty-thumb{flex:0 0 auto;width:56px;height:56px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg);
  display:flex;align-items:center;justify-content:center;overflow:hidden}
.dks-ty-thumb img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;display:block;margin:0}
.dks-ty-name{font-weight:700;color:var(--ink);line-height:1.3}
.dks-thanks .product-quantity{margin-left:.4rem;color:var(--muted);font-weight:600}
.dks-thanks .wc-item-meta{margin:.5rem 0 0 4.6rem;padding:0;list-style:none;font-size:.82rem;color:var(--muted)}
.dks-thanks .wc-item-meta li{margin:0}
.dks-thanks .wc-item-meta p{display:inline;margin:0}
.dks-thanks .wc-item-meta strong{font-weight:600;color:var(--ink);margin-right:.3rem}
.dks-thanks table.shop_table tfoot th{font-weight:700;color:var(--ink)}
/* with payment_method filtered out, Total is the last footer row */
.dks-thanks table.shop_table tfoot tr:last-child th,
.dks-thanks table.shop_table tfoot tr:last-child td{border-bottom:0;font-size:1.05rem;font-weight:800;color:var(--ink)}
.dks-thanks address{font-style:normal;color:var(--muted);line-height:1.6;font-size:.92rem}
@media(max-width:640px){
  .dks-thanks{padding:0 16px}
  .dks-thanks-card{padding:1.2rem 1.1rem}
  .dks-thanks-actions{flex-direction:column}
  .dks-thanks-btn{flex:1 1 auto;width:100%}
  .dks-thanks-help-btn{margin-left:0;width:100%;justify-content:center}
}

.woocommerce-order{max-width:820px;margin:2rem auto 3rem;padding:0 22px}
.woocommerce-order .woocommerce-notice--success,.woocommerce-thankyou-order-received{background:#eefbf3;border:1px solid #bfe6cf;color:#146c40;border-radius:var(--r);padding:1.2rem 1.4rem;font-size:1.05rem;font-weight:700}
.woocommerce-order .woocommerce-order-overview{list-style:none;display:flex;flex-wrap:wrap;gap:1.4rem;padding:1.2rem 0;margin:1.2rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.woocommerce-order .woocommerce-order-overview li{font-size:.8rem;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;border:0}
.woocommerce-order .woocommerce-order-overview li strong{display:block;font-size:1.05rem;color:var(--ink);text-transform:none;letter-spacing:0;margin-top:.2rem}
/* checkout — mobile/tablet/landscape-phone/desktop-mode: collapsible product summary
   on top; full-width review below. Breakpoint raised to 1024 so large & landscape
   phones (and "request desktop site") also get the full-width stacked layout. */
@media(max-width:1024px){
  /* align-items:stretch is REQUIRED — the base desktop rule sets align-items:start
     (for the grid), which otherwise cascades into this flex column and makes children
     shrink to content width (panel/summary drift left & look "not full screen"). */
  form.checkout.woocommerce-checkout{display:flex;flex-direction:column;gap:1rem;align-items:stretch}
  #order_review_heading{display:none}
  .dks-ro-toggle{order:-3}
  .dks-ro-panel{order:-2}
  #customer_details{order:0}
  .dks-coupon-box{order:1;margin-top:0}
  #order_review{order:2;position:static}
  .dks-ro-toggle{display:flex;width:100%;align-items:center;justify-content:space-between;gap:1rem;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.2rem;font-family:var(--font);font-weight:800;font-size:1rem;color:var(--ink);cursor:pointer;box-shadow:var(--sh)}
  .dks-ro-toggle-l{display:flex;align-items:center;gap:.5rem}
  .dks-ro-toggle-l i{color:var(--blue)}
  .dks-ro-toggle-r{display:flex;align-items:center;gap:.6rem}
  .dks-ro-total{color:var(--blue);font-weight:800}
  .dks-ro-toggle .bi-chevron-down{transition:.2s;color:var(--muted)}
  /* the toggle + panel must read as one card, matching #order_review below: same border,
     radius, shadow and padding. Closed, the toggle owns all four corners; open, it drops
     its bottom border and radius so the seam is invisible. */
  .dks-ro-panel{display:none;background:#fff;border:1px solid var(--line);border-top:0;border-radius:0 0 var(--r) var(--r);margin-top:-1rem;padding:.2rem 1.1rem 1.2rem;box-shadow:var(--sh)}
  .dks-ro-open .dks-ro-panel{display:block}
  .dks-ro-open .dks-ro-toggle{border-radius:var(--r) var(--r) 0 0;border-bottom-color:transparent}
  .dks-ro-open .dks-ro-toggle .bi-chevron-down{transform:rotate(180deg)}
  .dks-ro-panel .dks-review-table{width:100%;font-size:.9rem}
  .dks-ro-panel .dks-review-table td,.dks-ro-panel .dks-review-table th{padding:.5rem 0;border:0;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
  .dks-ro-panel .product-total,.dks-ro-panel .amount{text-align:right;font-weight:700}
  .dks-ro-panel .dks-review-table td.product-total{white-space:nowrap;padding-left:.75rem}
  .dks-ro-panel .order-total{font-size:1.05rem}
}

/* =============================== SHOP ARCHIVE (KM style) =============== */
.dks-shop{max-width:var(--ct);margin:.5rem auto 3rem;padding:0 22px;display:grid;grid-template-columns:262px 1fr;gap:0 2.2rem;align-items:start}
/* the breadcrumb's own bottom spacing plus the theme's blockGap put ~42px between the
   crumbs and the shop; the crumb bar already reads as the page's top edge */
body:has(.dks-shop) .dks-crumbs{margin-bottom:0;padding-bottom:0}
.wp-site-blocks>main:has(.dks-shop){margin-top:0!important}
.wp-site-blocks>main:has(.dks-shop)>.wp-block-group{padding-block:0!important}
/* WooCommerce may inject a notices block as the first grid child — span it. */
.dks-shop > .wc-block-components-notices,.dks-shop > .woocommerce-notices-wrapper{grid-column:1 / -1;margin-bottom:1rem}
/* taller than the viewport, a sticky column would pin its top and leave the last groups
   unreachable — scroll it on its own, with the bar hidden so the rail stays clean */
.dks-shop-side{grid-column:1;position:sticky;top:82px;max-height:calc(100vh - 94px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;-ms-overflow-style:none;padding-bottom:.6rem}
.dks-shop-side::-webkit-scrollbar{width:0;height:0}
.dks-shop-main{grid-column:2}
.dks-filters-head{display:flex;align-items:center;justify-content:space-between;padding:0 0 .7rem;border-bottom:2px solid var(--ink);margin-bottom:.4rem}
.dks-filters-head > span{font-size:1.05rem;font-weight:800;color:var(--ink);display:inline-flex;align-items:center;gap:.5rem}
.dks-clear-filters{font-size:.82rem;font-weight:700;color:var(--blue)}
.dks-clear-filters:hover{color:var(--acc);text-decoration:underline}
.dks-fgroup{border-bottom:1px solid var(--line)}
.dks-fgroup-h{width:100%;display:flex;align-items:center;justify-content:space-between;background:none;border:0;padding:.95rem 0;font-size:.95rem;font-weight:700;color:var(--ink);cursor:pointer;font-family:var(--font)}
.dks-fgroup-h .bi{color:var(--muted);font-size:.8rem;transition:.2s}
.dks-fgroup.open .dks-fgroup-h .bi{transform:rotate(180deg);color:var(--blue)}
.dks-fgroup-body{display:none;padding:0 0 .8rem}
.dks-fgroup.open .dks-fgroup-body{display:block}
.dks-fopt{display:flex;align-items:center;gap:.6rem;padding:.4rem 0;color:var(--ink);font-size:.9rem}
.dks-fopt:hover{color:var(--blue)}
.dks-fbox{width:18px;height:18px;border:1.5px solid #c3ccda;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:.72rem;color:#fff;flex:0 0 auto;transition:.15s}
.dks-fopt.on .dks-fbox{background:var(--blue);border-color:var(--blue)}
.dks-fname{flex:1}
.dks-fcount{color:var(--muted);font-size:.82rem}
.dks-nofilters{color:var(--muted);font-size:.88rem;padding:1rem 0}
.dks-filter-open{display:none}
/* the drawer's own sort group and the phone toolbar are mobile-only */
.dks-shop-toolbar,.dks-fgroup--sort{display:none}
.dks-filter-close{display:none}
.dks-ajax-loading{opacity:.45;pointer-events:none;transition:opacity .2s}
.dks-fopt,.dks-sorttab,.dks-fgroup-h{cursor:pointer}

/* ---- main column ---- */
.dks-shop-title{font-size:1.95rem;font-weight:800;letter-spacing:-.02em;color:var(--ink);margin:.2rem 0 .5rem}
.dks-shop-intro{color:var(--muted);font-size:.98rem;line-height:1.6;margin-bottom:1.4rem;max-width:70ch}
.dks-cat-cards{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem;margin-bottom:1.6rem}
.dks-cat-card{display:flex;align-items:center;gap:.9rem;border:1.5px solid var(--sky);background:linear-gradient(180deg,#fbfdff,#f4f8fe);border-radius:var(--r);padding:1rem 1.2rem;transition:.18s}
.dks-cat-card:hover{border-color:var(--blue);box-shadow:var(--sh)}
.dks-cat-card .ic{width:44px;height:44px;border-radius:10px;background:#fff;border:1px solid var(--sky);display:flex;align-items:center;justify-content:center;font-size:1.35rem;color:var(--blue);flex:0 0 auto}
.dks-cat-card b{color:var(--blue);font-size:1.02rem;font-weight:700}

.dks-sortbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;border-bottom:1px solid var(--line);margin-bottom:1.6rem}
.dks-sorttabs{display:flex;gap:1.6rem;flex-wrap:wrap}
.dks-sorttab{position:relative;padding:.7rem 0;font-size:.95rem;font-weight:600;color:var(--muted);border-bottom:3px solid transparent;transition:.15s}
.dks-sorttab:hover{color:var(--blue)}
.dks-sorttab.on{color:var(--blue);border-color:var(--blue)}
.dks-result-count{color:var(--muted);font-size:.88rem}

/* ---- product grid + cards ---- */
.dks-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem}
.dks-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.4rem;transition:.18s;overflow:hidden}
.dks-card:hover{box-shadow:var(--sh-md);transform:translateY(-3px);border-color:#d5deec}
.dks-card--feat{border-color:#f2d38a;box-shadow:0 0 0 1px #f2d38a}
.dks-card-ribbon{position:absolute;top:0;left:0;z-index:3;display:inline-flex;align-items:center;gap:.35rem;background:linear-gradient(135deg,#f5a623,#e2850a);color:#fff;font-size:.7rem;font-weight:800;letter-spacing:.02em;padding:.4rem .8rem;border-radius:var(--r) 0 12px 0;box-shadow:var(--sh)}
.dks-card-img{display:block;text-align:center;margin-bottom:1rem}
.dks-card-img img{width:100%;height:200px;object-fit:contain}
.dks-card-name{font-size:1.18rem;font-weight:700;color:var(--ink);margin-bottom:.7rem;line-height:1.25}
.dks-card-name:hover{color:var(--blue)}
.dks-card-chips{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.8rem}
.dks-chip{background:var(--sky);color:var(--blue);font-size:.74rem;font-weight:600;padding:.28rem .6rem;border-radius:999px;border:1px solid #d9e6fb}
.dks-card-feats{list-style:none;margin:0 0 1rem;padding:0;display:flex;flex-direction:column;gap:.35rem}
.dks-card-feats li{font-size:.88rem;color:var(--muted);display:flex;gap:.45rem;line-height:1.4}
.dks-card-feats .bi{color:var(--green);flex:0 0 auto;margin-top:.15rem}
.dks-card-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:.8rem;flex-wrap:wrap;padding-top:.9rem;border-top:1px solid var(--line)}
.dks-card-price{font-size:1.2rem;font-weight:800;color:var(--blue);line-height:1.1}
.dks-card-price .amount,.dks-card-price bdi{font-weight:800}
.dks-card-price del{font-size:.85rem;color:var(--muted);font-weight:500}
.dks-card-per{display:block;font-size:.72rem;font-weight:500;color:var(--muted)}
.dks-card-cta{display:inline-flex;align-items:center;gap:.4rem;background:var(--blue);color:#fff;font-weight:700;font-size:.88rem;padding:.6rem .95rem;border-radius:var(--r-sm);transition:.15s}
.dks-card-cta:hover{background:var(--blue-2)}
.dks-card-cta .bi{transition:.2s}
.dks-card-cta:hover .bi{transform:translateX(3px)}

.dks-shop-empty{text-align:center;padding:3rem 1rem;color:var(--muted)}
.dks-shop-empty .bi{font-size:2.4rem;display:block;margin-bottom:.6rem;color:#c3ccda}
.dks-shop-empty p{margin:0 0 1rem}

.dks-pagination{display:flex;justify-content:center;gap:.4rem;margin-top:2.2rem}
.dks-pagination .page-numbers{min-width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:var(--r-sm);color:var(--ink);font-weight:600;font-size:.92rem;padding:0 .4rem;transition:.15s}
.dks-pagination .page-numbers:hover{border-color:var(--blue);color:var(--blue)}
.dks-pagination .page-numbers.current{background:var(--blue);border-color:var(--blue);color:#fff}

/* =============================== FOOTER ================================= */
.dks-footer{background:radial-gradient(1200px 400px at 80% -10%,#1a2f5e,#0e1a30);color:#c3ccda;font-size:.9rem;margin-top:3.5rem}
/* When the blue CTA is the page's LAST section, the footer's top margin shows as a white
   band. Butt them together and mark the seam with a hairline. Note :last-child — on the
   home page the reviews section follows the CTA, and there the 3.5rem gap must stay. */
body:has(.dks-contact:last-child) .dks-footer{margin-top:0;border-top:1px solid rgba(255,255,255,.14)}
body:has(.dks-contact:last-child) .wp-site-blocks>main{margin-bottom:0}
/* The block footer template part renders empty (our real footer is hooked onto <body>),
   but still collects the theme's 1.2rem blockGap. Zero-height node, so zero its margin. */
.wp-site-blocks>footer.wp-block-template-part{margin-top:0}
.dks-footer a{color:#c3ccda;transition:.15s}
.dks-footer a:hover{color:#fff}
.dks-footer-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.35fr;gap:2.2rem;padding:3.4rem 22px 2.4rem}
.dks-fbrand .dks-logo-text{color:#fff}
/* the shared .dks-logo-img sets height with !important, so override it here too or the
   max-height below just crops the mark */
.dks-fbrand img{max-height:64px;filter:brightness(0) invert(1)}
.dks-fbrand .dks-logo-img{height:64px!important}
.dks-fabout p{margin:1rem 0 1.2rem;line-height:1.65;color:#9fabbd;max-width:34ch}
.dks-fcol h4{color:#fff;font-size:1.02rem;margin:0 0 1.1rem;font-weight:700}
.dks-fcol ul{list-style:none;margin:0;padding:0}
.dks-fcol li{margin-bottom:.65rem;display:flex;align-items:flex-start;gap:.55rem}
.dks-fcol li .bi{color:var(--acc);margin-top:.15rem}
.dks-fcontact a{color:#dbe3ef}
.dks-fsocial{display:flex;gap:.65rem}
.dks-fsocial a{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:#fff;transition:.18s}
.dks-fsocial a:hover{background:var(--acc);transform:translateY(-2px)}
.dks-fpay{display:flex;align-items:center;gap:.75rem;padding:1.3rem 22px;border-top:1px solid rgba(255,255,255,.09);font-size:.85rem;color:#9fabbd;max-width:var(--ct);margin:0 auto}
.dks-fpay .bi{font-size:1.65rem;color:#c3ccda}
.dks-fbar{background:rgba(0,0,0,.25);font-size:.82rem;color:#8896aa}
.dks-fbar-in{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.05rem 22px;flex-wrap:wrap}
.dks-fbar-links{display:flex;gap:1.3rem;flex-wrap:wrap}

/* ====================== WOOCOMMERCE SINGLE PRODUCT ===================== */
.single-product main.wp-block-group{max-width:var(--ct);margin:0 auto;padding:2rem 22px 0}
.woocommerce div.product{font-family:var(--font)}
.dks-product{display:block!important}
.dks-product .dks-hero{display:grid;grid-template-columns:minmax(0,40%) minmax(0,1fr);column-gap:4%;align-items:start;grid-template-areas:"gallery summary" "advice summary"}
.dks-product .dks-col-left{width:auto!important;min-width:0;float:none!important;grid-area:gallery}
.woocommerce div.product .dks-col-right,.dks-product .dks-col-right{width:auto!important;float:none!important;grid-area:summary}
.dks-product .dks-col-advice{grid-area:advice}
.dks-product .dks-col-full{width:100%;float:none!important;clear:both}
.dks-product div.images{width:100%!important;float:none!important;margin:0}

/* ---- Tabla de precios (sección 'spectable') ---- */
.dks-spec-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:#fff;box-shadow:var(--sh)}
.dks-spec{width:100%;border-collapse:collapse;font-size:.92rem;min-width:680px}
.dks-spec th,.dks-spec td{padding:.85rem 1rem;text-align:center;border-bottom:1px solid var(--line)}
.dks-spec thead th{background:var(--bg);font-size:.78rem;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.dks-spec tbody th{text-align:left;font-weight:700;color:var(--ink);white-space:nowrap}
.dks-spec tbody th a{color:var(--blue)}
.dks-spec tbody th a:hover{text-decoration:underline}
.dks-spec tbody tr:last-child th,.dks-spec tbody tr:last-child td{border-bottom:0}
.dks-spec tbody tr:hover{background:var(--sky)}
.dks-spec td small{display:block;margin-top:.15rem;font-size:.72rem;color:var(--muted)}
.dks-spec-note{margin:.9rem 0 0;font-size:.83rem;color:var(--muted);line-height:1.55}
.dks-spec-note .bi{color:var(--blue)}

/* ---- Caja de precio: cuatro paquetes de alquiler y la nota del costo por página ---- */
.dks-relax .dks-tiers--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.dks-tiers--4 .dks-tier{padding:.75rem .5rem}
.dks-tiers--4 .tn{font-size:.82rem}
.dks-tiers--4 .tvol{font-size:.68rem}
.dks-tiers--4 .tp b{font-size:1rem}
.dks-relax-click{margin:.7rem 0 0;font-size:.82rem;color:var(--muted);line-height:1.5}
.dks-relax-click .bi{color:var(--blue)}
.dks-relax-click b{color:var(--ink)}
.dks-card-from{font-size:.78rem;color:var(--muted);margin-right:.25rem}
@media(max-width:520px){
  .dks-relax .dks-tiers--4{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Atajo a WhatsApp bajo el botón principal de la ficha: alternativa para quien no quiere
   dejar sus datos y esperar la cotización por correo. Verde de WhatsApp, no el rosa/azul de
   la modalidad, para que se lea como "otra vía" y no compita con la acción principal. */
.dks-wa-direct{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.1rem .5rem;
  margin-top:.6rem;padding:.72rem 1rem;border:1.5px solid #cfe9d6;border-radius:var(--r-sm);
  background:#f2fbf5;color:#146c40;font-weight:800;font-size:.95rem;line-height:1.25;transition:.16s}
.dks-wa-direct:hover{background:#e4f6ea;border-color:#25d366;color:#0f5730}
.dks-wa-direct .bi{font-size:1.1rem;color:#25d366}
.dks-wa-direct small{flex:0 0 100%;text-align:center;font-size:.76rem;font-weight:600;color:#4e8a68}

/* ---- GALERÍA DE PRODUCTO CON GIRO 360° (ver dks_product_images) ---- */
/* min-width:0 + max-width en la imagen: sin ellos el ancho intrínseco de 900px del
   fotograma agranda la columna del grid y desborda la pantalla en el móvil. */
.dks-pgal{width:100%;min-width:0;max-width:480px}
.dks-pgal-stage{position:relative;border-radius:12px;background:#fff}
.dks-pgal-360,.dks-pgal-still{display:block;width:100%;height:430px}
.dks-pgal-360{position:relative;touch-action:pan-y;cursor:grab;outline:none}
.dks-pgal-360.is-drag{cursor:grabbing}
.dks-pgal-360:focus-visible{box-shadow:0 0 0 3px var(--sky);border-radius:12px}
.dks-pgal-fr,.dks-pgal-still{width:100%;max-width:100%;height:430px;object-fit:contain;-webkit-user-select:none;user-select:none}
.dks-pgal-hint{position:absolute;left:50%;bottom:6px;transform:translateX(-50%);display:inline-flex;align-items:center;gap:.4rem;
  padding:.32rem .7rem;border-radius:999px;background:rgba(13,28,64,.72);color:#fff;font-size:.74rem;font-weight:600;
  white-space:nowrap;pointer-events:none;transition:opacity .3s}
.dks-pgal-hint.is-off{opacity:0}
.dks-pgal-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:8;width:44px;height:44px;border-radius:50%;
  border:1px solid var(--line);background:rgba(255,255,255,.95);box-shadow:var(--sh-md);color:var(--blue);cursor:pointer;
  display:flex;align-items:center;justify-content:center;font-size:1.15rem;opacity:0;transition:.18s}
.dks-pgal:hover .dks-pgal-arrow{opacity:1}
.dks-pgal-arrow:hover{background:var(--blue);color:#fff}
.dks-pgal-prev{left:14px}
.dks-pgal-next{right:14px}
/* Tira de miniaturas: cinco visibles y el resto se desliza. El ancho de cada una se calcula
   para que entren justo cinco, así se ven grandes sin desbordar la columna de la galería. */
.dks-pgal-strip{position:relative;margin:2.2rem 0 0}
.dks-pgal-thumbs{--pgal-gap:.5rem;display:grid;grid-auto-flow:column;
  grid-auto-columns:calc((100% - 4*var(--pgal-gap))/5);gap:var(--pgal-gap);
  overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;-ms-overflow-style:none}
.dks-pgal-thumbs::-webkit-scrollbar{display:none}
.dks-pgal-th{position:relative;aspect-ratio:1;padding:6px;border:1.5px solid var(--line);border-radius:10px;
  background:#fff;cursor:pointer;opacity:.7;transition:.15s;scroll-snap-align:start}
/* flechas de la tira, una a cada lado y por encima de las miniaturas de los extremos */
.dks-pgal-sc{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:30px;height:30px;
  border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.96);color:var(--blue);
  cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.9rem;
  box-shadow:var(--sh-md);transition:.15s}
.dks-pgal-sc:hover{background:var(--blue);color:#fff}
/* el display:flex de arriba gana al display:none de [hidden] (misma especificidad), así que
   sin esta línea las flechas salen aunque no haya nada que deslizar */
.dks-pgal-sc[hidden]{display:none}
.dks-pgal-sc.is-off{opacity:0;pointer-events:none}
.dks-pgal-sc-prev{left:-6px}
.dks-pgal-sc-next{right:-6px}
.dks-pgal-th img{width:100%;height:100%;object-fit:contain;display:block}
.dks-pgal-th:hover,.dks-pgal-th.on{opacity:1;border-color:var(--blue);box-shadow:0 0 0 3px var(--sky)}
/* la miniatura del giro se distingue con su etiqueta 360° */
.dks-pgal-th--360>span{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;gap:.15rem;
  padding:.1rem 0;font-size:.58rem;font-weight:800;letter-spacing:.02em;color:#fff;background:var(--blue);
  border-radius:0 0 7px 7px}
.dks-pgal-th--360>span .bi{font-size:.62rem}
@media(max-width:860px){
  .dks-pgal{max-width:none}
  .dks-pgal-360,.dks-pgal-still,.dks-pgal-fr{height:330px}
  .dks-pgal-arrow{opacity:1;width:38px;height:38px}
}
@media(max-width:600px){
  /* en el móvil caben cuatro sin que queden diminutas */
  .dks-pgal-thumbs{grid-auto-columns:calc((100% - 3*var(--pgal-gap))/4)}
}

/* gallery — premium frame, uniform image height, single thumbnail row, arrows */
.woocommerce div.product div.images{max-width:480px}
.woocommerce div.product div.images .woocommerce-product-gallery{position:relative}
.woocommerce div.product div.images .flex-viewport{border:0;border-radius:0;background:transparent;box-shadow:none;padding:0;height:auto!important}
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper{margin:0;border:0;box-shadow:none;padding:0;background:transparent}
.woocommerce div.product div.images .woocommerce-product-gallery__image{text-align:center}
.woocommerce div.product div.images .woocommerce-product-gallery__image img{border:0;border-radius:8px;margin:0 auto;display:block;width:auto;max-width:100%;height:430px;object-fit:contain}
.woocommerce div.product .woocommerce-product-gallery__trigger{display:none!important}
/* prev / next arrows */
.woocommerce div.product .flex-direction-nav{list-style:none;margin:0;padding:0}
.woocommerce div.product .flex-direction-nav li{margin:0}
.woocommerce div.product .flex-direction-nav a{position:absolute;top:calc(50% - 26px);transform:translateY(-50%);width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.95);border:1px solid var(--line);box-shadow:var(--sh-md);display:flex!important;align-items:center;justify-content:center;color:var(--blue);text-indent:0;overflow:hidden;font-size:0;z-index:8;opacity:0;transition:.18s;text-decoration:none}
.woocommerce div.product div.images:hover .flex-direction-nav a{opacity:1}
.woocommerce div.product .flex-direction-nav a:hover{background:var(--blue);color:#fff;transform:translateY(-50%) scale(1.06)}
.woocommerce div.product .flex-direction-nav a.flex-disabled{opacity:0!important;pointer-events:none}
.woocommerce div.product .flex-direction-nav .flex-prev{left:14px}
.woocommerce div.product .flex-direction-nav .flex-next{right:14px}
.woocommerce div.product .flex-direction-nav a:before{font-family:"bootstrap-icons"!important;font-size:1.15rem;line-height:1}
.woocommerce div.product .flex-direction-nav .flex-prev:before{content:"\F284"}
.woocommerce div.product .flex-direction-nav .flex-next:before{content:"\F285"}
/* single-row thumbnails */
.woocommerce div.product .flex-control-thumbs{margin:2.4rem 0 0;display:flex;gap:.7rem;flex-wrap:nowrap;padding:0;overflow-x:auto;scrollbar-width:thin}
.woocommerce div.product .flex-control-thumbs li{flex:0 0 auto;width:64px;margin:0;list-style:none}
.woocommerce div.product .flex-control-thumbs img{width:64px;height:64px;object-fit:contain;border:1.5px solid var(--line);border-radius:9px;padding:5px;background:#fff;opacity:.7;transition:.15s;cursor:pointer}
.woocommerce div.product .flex-control-thumbs img:hover,.woocommerce div.product .flex-control-thumbs img.flex-active{opacity:1;border-color:var(--blue);box-shadow:0 0 0 3px var(--sky)}

.woocommerce div.product .product_title{font-size:2.05rem;font-weight:800;letter-spacing:-.02em;color:var(--ink);margin:.1rem 0 .55rem;line-height:1.12}
.woocommerce-product-details__short-description,.dks-hero-desc{color:#42506000;color:#425060;font-size:1rem;line-height:1.62;margin-bottom:1.1rem}

/* feature badges */
.dks-badges{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1.4rem}
.dks-badge{display:inline-flex;align-items:center;gap:.4rem;background:var(--sky);color:var(--blue);font-size:.78rem;font-weight:600;padding:.4rem .8rem;border-radius:999px;border:1px solid #d9e6fb}
/* On phones the ragged wrap looks messy — lay the spec tags on a tidy 2-col grid that
   fills the width, and let a lone last tag span the full row. */
@media(max-width:560px){
  .dks-badges{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
  .dks-badge{justify-content:center;text-align:center}
  .dks-badge:last-child:nth-child(odd){grid-column:1 / -1}
}
.dks-badge .bi{font-size:.95rem}

/* left extras + advice */
.dks-leftextra{margin-top:1.3rem}
.dks-extra-links{display:flex;gap:1.6rem;margin:0 0 1.2rem;font-size:.9rem;flex-wrap:wrap}
.dks-extra-links a{color:var(--blue);display:inline-flex;align-items:center;gap:.45rem;font-weight:600;transition:.15s}
.dks-extra-links a:hover{color:var(--acc)}
.dks-advice{display:flex;align-items:center;gap:1rem;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.1rem 1.2rem;box-shadow:var(--sh)}
.dks-advice .ava{width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,var(--blue),#3b64c0);display:flex;align-items:center;justify-content:center;font-size:1.7rem;color:#fff;flex:0 0 auto}
.dks-advice b{display:block;color:var(--ink);font-size:1rem}
.dks-advice small{color:var(--muted);font-size:.82rem}
.dks-advice a{color:var(--blue);font-weight:700;font-size:1.08rem;display:block;margin-top:.15rem}
.dks-advice a:hover{color:var(--acc)}

/* ===================== RELAXRATE CONFIGURATOR ========================== */
/* Cada panel del cuadro de precio lleva sus propios colores de modalidad, con los mismos
   tokens que ya usan carrito y checkout: alquiler rosa, venta azul. */
.dks-pane[data-pane="alquiler"]{--m:var(--acc);--m-2:var(--acc-2);--m-sh:225,10,125}
.dks-pane[data-pane="venta"]{--m:var(--blue);--m-2:var(--blue-2);--m-sh:27,58,122}
.dks-relax{border:1px solid var(--line);border-radius:var(--r);padding:1.4rem;background:var(--card);box-shadow:var(--sh-md);position:relative;overflow:hidden}
.dks-relax:before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,var(--m),var(--m-2))}
.dks-relax-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;flex-wrap:wrap;margin-top:.2rem}
.dks-relax-head h3{margin:0;font-size:1.18rem;color:var(--ink);font-weight:700;max-width:60%}
.dks-relax-price{text-align:right;line-height:1.1}
.dks-relax-price .amt{font-size:1.85rem;font-weight:800;color:var(--ink);letter-spacing:-.02em}
.dks-relax-price small{display:block;font-size:.7rem;font-weight:600;color:var(--muted);margin-top:.15rem}
.dks-relax-sub{font-size:.86rem;color:var(--muted);margin:.5rem 0 1.1rem}
.dks-relax-sub a,.dks-relax-lbl a{color:var(--blue);font-weight:600}
.dks-relax-sub a:hover,.dks-relax-lbl a:hover{color:var(--acc)}
.dks-relax-lbl{display:flex;justify-content:space-between;align-items:center;font-size:.87rem;font-weight:700;color:var(--ink);margin:1rem 0 .55rem}
.dks-relax-lbl a{font-size:.8rem;font-weight:600}
.dks-tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}
.dks-tier{position:relative;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:.85rem .55rem .75rem;text-align:center;cursor:pointer;background:#fff;transition:.16s}
.dks-tier:hover{border-color:#b9caea;transform:translateY(-2px);box-shadow:var(--sh)}
.dks-tier.on{border-color:var(--blue);background:linear-gradient(180deg,var(--sky),#fff);box-shadow:0 0 0 1.5px var(--blue),var(--sh)}
.dks-tier-check{position:absolute;top:-9px;right:-9px;width:24px;height:24px;border-radius:50%;background:var(--blue);color:#fff;display:none;align-items:center;justify-content:center;font-size:.8rem;box-shadow:0 2px 6px rgba(27,58,122,.4)}
.dks-tier.on .dks-tier-check{display:flex}
.dks-tier .tn{font-weight:800;color:var(--blue);font-size:.9rem}
.dks-tier .tvol{margin:.4rem 0 .5rem;font-size:.76rem;color:var(--muted);line-height:1.5}
.dks-tier .tvol .dot-bw{color:#222;font-size:.5rem;vertical-align:middle}
.dks-tier .tvol .dot-co{color:var(--acc);font-size:.5rem;vertical-align:middle}
.dks-tier .tp b{font-size:1.15rem;color:var(--ink);font-weight:800}
.dks-tier .tp span{font-size:.72rem;color:var(--muted)}
.dks-terms{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}
.dks-term{border:1.5px solid var(--line);border-radius:var(--r-sm);padding:.65rem;text-align:center;cursor:pointer;font-size:.85rem;font-weight:700;color:var(--ink);background:#fff;transition:.16s}
.dks-term:hover{border-color:#b9caea}
.dks-term.on{border-color:var(--blue);background:var(--sky);box-shadow:0 0 0 1.5px var(--blue)}
.dks-relax-perks{list-style:none;margin:1.1rem 0;padding:0;font-size:.87rem}
.dks-relax-perks li{display:flex;align-items:center;gap:.55rem;margin-bottom:.45rem;color:#42506000;color:#425060}
.dks-relax-perks .bi{color:var(--green);font-size:1.05rem}

/* variable form: hide dropdowns + quantity, keep the CTA */
.dks-relax .variations,.dks-relax .reset_variations,
.dks-relax .woocommerce-variation-price,.dks-relax .woocommerce-variation-description,
.dks-relax .woocommerce-variation-availability,.dks-relax .quantity{display:none!important}
.dks-relax form.variations_form{margin:.4rem 0 0}
.dks-relax .woocommerce-variation.single_variation{margin:0}
.woocommerce div.product form.cart{margin:0}
.woocommerce div.product .single_add_to_cart_button.button,
.dks-relax .single_add_to_cart_button{display:block;width:100%;text-align:center;background:linear-gradient(135deg,var(--m),var(--m-2))!important;color:#fff!important;padding:1rem!important;font-size:1rem!important;font-weight:800!important;letter-spacing:.02em;border:0!important;border-radius:var(--r-sm)!important;text-transform:uppercase;box-shadow:0 8px 22px rgba(var(--m-sh),.32);transition:.16s!important;cursor:pointer}
.woocommerce div.product .single_add_to_cart_button.button:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(var(--m-sh,225,10,125),.42)}
.woocommerce div.product .single_add_to_cart_button.disabled{opacity:.55;box-shadow:none}
.dks-stock{display:flex;gap:1.5rem;align-items:center;margin-top:1rem;font-size:.85rem;color:#425060;flex-wrap:wrap}
.dks-stock span{display:inline-flex;align-items:center;gap:.4rem}
.dks-stock .bi{color:var(--green);font-size:1.05rem}

/* =============== sub-nav + rich content sections ====================== */
.dks-subnav{clear:both;position:sticky;top:0;z-index:30;background:rgba(251,252,254,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);margin:2.8rem 0 0;display:flex;flex-wrap:wrap;gap:.2rem}
.dks-subnav a{padding:1rem 1.15rem;font-weight:700;color:var(--muted);border-bottom:3px solid transparent;margin-bottom:-1px;font-size:.94rem;transition:.15s}
.dks-subnav a:hover,.dks-subnav a.on{color:var(--blue);border-color:var(--blue)}
.dks-sections{clear:both}
.km-pdp{max-width:100%;font-family:var(--font);color:var(--ink)}
.km-pdp h2{font-size:1.45rem;font-weight:800;letter-spacing:-.02em;margin:0 0 .4em}
.km-pdp h4{font-size:1.02rem;font-weight:700;margin:0 0 .35em}
.km-lead{font-size:.96rem;color:#425060;max-width:74ch;line-height:1.55}
.km-sec{padding:1.7rem 0;border-bottom:1px solid var(--line);scroll-margin-top:90px}
/* Feature highlights: cards in a 2-col grid, each with a topic icon in an accent chip. */
.km-bullets{list-style:none;margin:1.1rem 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.km-bullets li{display:flex;align-items:flex-start;gap:.7rem;background:var(--card,#fff);border:1px solid var(--line);border-radius:14px;padding:.85rem .95rem;font-size:.9rem;line-height:1.45;color:#3a4658}
.km-bullets li > i{flex:0 0 auto;display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:var(--sky);color:var(--blue);font-size:1.05rem}
.km-bullets li > span{padding-top:.15rem}
@media(max-width:640px){.km-bullets{grid-template-columns:1fr}}
.dks-flash{animation:dksflash 1.4s ease}
@keyframes dksflash{0%,100%{background:transparent}25%{background:var(--sky)}}

/* services */
.km-svc{display:grid;grid-template-columns:1fr 1fr;gap:0 3rem;margin-top:.8rem}
.km-svc-h{font-weight:800;color:var(--blue);padding:.7rem 0 .3rem;font-size:.82rem;text-transform:uppercase;letter-spacing:.04em}
.km-svc-row{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.48rem 0;border-top:1px solid var(--line);font-size:.88rem;color:#425060}
.km-inc,.km-exc{display:inline-flex;align-items:center;gap:.35rem;font-weight:700;font-size:.76rem;white-space:nowrap}
.km-inc{color:var(--green)}.km-exc{color:var(--red)}
.km-note{font-size:.78rem;color:var(--muted);margin-top:1rem}

/* help cards */
.km-help-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.2rem}
.km-help-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.15rem;box-shadow:var(--sh);scroll-margin-top:100px}
.km-help-ic{width:40px;height:40px;border-radius:11px;background:var(--sky);color:var(--blue);display:flex;align-items:center;justify-content:center;font-size:1.2rem;margin-bottom:.55rem}
.km-help-card p{margin:0;color:#425060;font-size:.9rem;line-height:1.55}

/* description */
.km-desc2{display:grid;grid-template-columns:1.25fr 1fr;gap:2rem;align-items:center;margin-top:.8rem}
.km-desc2 dl{margin:0}
.km-desc2 dt{font-weight:700;margin-top:.85rem;display:flex;align-items:center;gap:.5rem;color:var(--ink)}
.km-desc2 dt .bi{color:var(--blue)}
.km-desc2 dd{margin:.2rem 0 0 1.8rem;color:#425060;font-size:.92rem;line-height:1.55}
.km-desc2-img img{border-radius:var(--r);box-shadow:var(--sh-md);border:1px solid var(--line)}

/* special config band */
.km-config{display:grid;grid-template-columns:1fr 1.25fr;gap:2rem;align-items:center;background:linear-gradient(135deg,var(--sky),#fff);border:1px solid #dce7f9;border-radius:var(--r);padding:1.5rem 1.8rem;margin-top:.6rem}
.km-config-img img{border-radius:var(--r);box-shadow:var(--sh-md)}

/* specs */
.km-spec{display:grid;grid-template-columns:1fr 1fr;gap:0 3rem;margin-top:.6rem}
.km-spec .row{display:flex;justify-content:space-between;padding:.52rem 0;border-top:1px solid var(--line);font-size:.88rem}
.km-spec .row b{font-weight:600;color:var(--ink)}
.km-spec .row span{color:#425060;padding-left:.8rem;text-align:right}
.km-yes,.km-spec .row span.km-yes{color:var(--green);font-weight:700}
.km-no,.km-spec .row span.km-no{color:var(--red);font-weight:700}
.km-spec-extra{max-height:0;overflow:hidden;margin-top:0;transition:max-height .35s ease}
.km-spec-extra.open{max-height:400px;margin-top:0}
.dks-spec-toggle{display:inline-flex;align-items:center;gap:.4rem;margin-top:1rem;color:var(--blue);font-weight:700;font-size:.9rem;cursor:pointer}
.dks-spec-toggle:hover{color:var(--acc)}

/* box */
.km-box ul{padding-left:1.3rem;line-height:1.9;color:#3a4757}
.km-box ul ul{margin-top:.2rem}

/* reviews */
.km-reviews-sec{background:linear-gradient(135deg,#fbf7ec,#fdf3e3);border:1px solid #f2e6cf;border-radius:var(--r);padding:2.4rem;border-bottom:0;margin-top:2.6rem;scroll-margin-top:90px}
.km-reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;margin-top:1.4rem}
.km-review{background:#fff;border:1px solid #f0e6d2;border-radius:var(--r);padding:1.4rem;box-shadow:var(--sh)}
.km-stars{color:var(--gold);font-size:1rem;letter-spacing:.08em}
.km-review p{font-size:.95rem;color:#42505f;margin:.6rem 0}
.km-review cite{font-style:normal;font-weight:700;font-size:.86rem;color:var(--ink)}

/* contact */
.km-contact{text-align:center;padding:3rem 0 1rem}
.km-contact .big{font-size:1.5rem;font-weight:700;margin:.2rem 0}
.km-contact .lead{font-size:1.7rem;font-weight:800;color:var(--blue);margin:.3rem 0}
.km-contact .lead a{color:var(--blue)}
.km-contact .lead a:hover{color:var(--acc)}
.km-contact small{color:var(--muted);display:block;margin:.2rem 0 1.2rem}
.km-contact-btns{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:.45rem;background:var(--blue);color:#fff;font-weight:700;padding:.85rem 1.7rem;border-radius:var(--r-sm);text-transform:uppercase;font-size:.86rem;letter-spacing:.02em;transition:.16s}
.btn:hover{background:var(--blue-2);transform:translateY(-2px);box-shadow:var(--sh-md)}
.btn.ghost{background:#fff;color:var(--blue);border:1.5px solid var(--blue)}
.btn.ghost:hover{background:var(--sky)}
.km-config .btn{background:var(--acc)}
.km-config .btn:hover{background:var(--acc-2)}

/* =============================== RESPONSIVE ============================= */
@media(max-width:1024px){
  .dks-footer-grid{grid-template-columns:1fr 1fr}
  .dks-product .dks-col-left{position:static}
  /* shop: sidebar becomes an off-canvas drawer */
  /* .dks-shop-main is pinned to grid-column:2; without resetting it the sidebar's now
     empty column 1 stays in the grid and squeezes the product list. */
  .dks-shop{grid-template-columns:minmax(0,1fr);padding:0 16px}
  .dks-shop-main{grid-column:1;min-width:0}
  /* the theme's main already supplies a 30px gutter — don't pay it twice — and its
     full-width group adds 70px above the shop title */
  .wp-site-blocks>main:has(.dks-shop){padding-left:0!important;padding-right:0!important}
  .wp-site-blocks>main:has(.dks-shop)>.wp-block-group{padding-block:0!important}
  body:has(.dks-shop) .dks-crumbs{margin-bottom:0;padding-bottom:0}
  .dks-shop{margin-top:.5rem}
  /* the 43-char title still lands on two lines at 358px up to ~1.6rem */
  .dks-shop-title{text-align:center;font-size:clamp(1.3rem,5.9vw,1.6rem);line-height:1.25;letter-spacing:-.01em;text-wrap:balance;margin:.2rem 0 .6rem}
  .dks-shop-intro{text-align:center;margin-left:auto;margin-right:auto}
  .dks-shop-side{position:fixed;inset:0 auto 0 0;box-sizing:border-box;width:min(340px,88vw);background:#fff;z-index:400;padding:1.2rem;box-shadow:var(--sh-lg);transform:translateX(-102%);transition:transform .25s;overflow-y:auto;top:0;max-height:none}
  .dks-shop-side.show{transform:none}
  /* the scrim is a sibling layer, not an inset of the drawer: box-sizing above keeps
     the drawer at exactly min(340px,88vw) so the two edges line up */
  .dks-shop-side.show::after{content:"";position:fixed;inset:0;left:min(340px,88vw);background:rgba(15,25,45,.45);z-index:-1}
  /* toolbar: [Filtros] and the product count share the row, half and half */
  .dks-sortbar{display:none}
  .dks-shop-toolbar{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:.8rem;margin:0 0 1.2rem}
  .dks-toolbar-count{font-size:.88rem;color:var(--muted);font-weight:600;text-align:right}
  .dks-filter-open{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;width:100%;box-sizing:border-box;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:.6rem 1rem;font-weight:700;font-size:.9rem;color:var(--ink);cursor:pointer;margin:0;font-family:var(--font)}
  /* sorting moves inside the drawer, as a single-choice list matching .dks-fopt */
  .dks-fgroup--sort{display:block}
  .dks-sorttabs--drawer{display:flex;flex-direction:column;gap:0}
  .dks-sorttabs--drawer .dks-sorttab{display:flex;align-items:center;gap:.6rem;padding:.4rem 0;border-bottom:0;font-size:.9rem;font-weight:500;color:var(--ink)}
  /* round box = pick one, versus the square checkboxes of the multi-select filters */
  .dks-sorttabs--drawer .dks-sorttab::before{content:"";width:18px;height:18px;flex:0 0 auto;border:1.5px solid #c3ccda;border-radius:50%;background:#fff;transition:.15s;box-sizing:border-box}
  .dks-sorttabs--drawer .dks-sorttab.on{color:var(--blue);font-weight:700}
  .dks-sorttabs--drawer .dks-sorttab.on::before{border-color:var(--blue);border-width:5px}
  .dks-filter-open .bi{color:var(--blue)}
  .dks-filter-close{margin-left:auto;background:none;border:0;font-size:1.15rem;color:var(--muted);cursor:pointer}
}
@media(max-width:1024px){
  /* ---- mobile header ---- */
  .dks-mainbar-in{gap:.35rem;min-height:56px;flex-wrap:nowrap;overflow:hidden}
  .dks-brand{order:1;padding-right:0;margin:0 auto 0 0;border-right:0;min-width:0;flex:0 1 auto}
  .dks-brand img{max-width:100%;height:auto}
  .dks-actions{flex:0 0 auto}
  .dks-burger{flex:0 0 auto}
  .dks-logo-img{height:36px!important}
  .dks-actions{order:2;margin-left:0;border-left:0}
  .dks-ic{width:42px;font-size:1.2rem;border-right:0}
  .dks-ic-sm-hide{display:none}
  .dks-burger{order:3;display:flex;width:42px;justify-content:center;padding:0}
  .dks-burger[aria-expanded="true"] i::before{content:"\f62a"}
  /* nav becomes a full-width dropdown panel under the bar */
  .dks-navbar{display:none;order:5;position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid var(--line);box-shadow:var(--sh-md);z-index:300;max-height:calc(100vh - 56px);overflow-y:auto;-webkit-overflow-scrolling:touch}
  .dks-navbar.open{display:block}
  .dks-menu{flex-direction:column;align-items:stretch;gap:0;max-width:var(--ct);margin:0 auto;padding:0}
  .dks-menu > li{display:block;border-bottom:1px solid var(--line)}
  .dks-menu > li > button.dks-menu-open{width:100%;font-size:1rem;font-weight:600}
  .dks-menu > li > :is(a,button){padding:1rem 22px;border-radius:0;justify-content:space-between;font-size:1rem;font-weight:600}
  .dks-menu > li.menu-item-has-children > :is(a,button)::after{transition:transform .2s}
  .dks-menu > li.dks-open > :is(a,button){color:var(--blue);background:var(--bg)}
  .dks-menu > li.dks-open.menu-item-has-children > :is(a,button)::after{transform:rotate(180deg)}
  .dks-menu .sub-menu{position:static;display:none;border:0;box-shadow:none;padding:.2rem 22px .7rem;min-width:0;background:var(--bg)}
  .dks-menu > li.dks-open > .sub-menu{display:block}
  /* mega collapses to an accordion panel toggled by tap */
  .dks-menu > li.dks-has-mega{position:static}
  .dks-mega{position:static;display:none;border-top:0;box-shadow:none;background:var(--bg)}
  .dks-menu > li.dks-open > .dks-mega{display:block}
  /* the panel becomes a plain list, like the top-level items: full-bleed rows with
     dividers. .dks-mega-cols is a grid on desktop, so reset it back to a column here. */
  .dks-mega-in{display:block;padding:0;max-width:none}
  .dks-mega-cols{display:flex;flex-direction:column;gap:0}
  /* "Impresoras por categoría" / "por grupo de usuarios" only add noise on a phone */
  .dks-mega-col h4{display:none}
  .dks-mega-col ul{gap:0}
  .dks-mega-col ul a{margin:0;padding:.85rem 22px;border-radius:0;border-top:1px solid var(--line);font-size:.95rem;background:transparent}
  .dks-mega-col ul a::before{display:none}
  .dks-mega-col ul a:hover,.dks-mega-col ul a:active{background:#fff}
  .dks-mega-promo{display:none}
  .dks-searchbar > .dks-container{padding-left:22px;padding-right:22px}
  .dks-product .dks-hero{grid-template-columns:1fr;grid-template-areas:"gallery" "summary" "advice";column-gap:0}
  .dks-product .dks-col-left,.dks-product .dks-col-right{width:100%!important}
  .dks-product .dks-col-left{margin-bottom:1.6rem}
  .dks-product .dks-col-advice{margin-top:1.6rem}
  /* checkout header (steps) on mobile: logo left, compact steps right */
  .dks-checkout-in{gap:.4rem;min-height:56px}
  .dks-checkout-in .dks-brand{order:0;margin:0 auto 0 0}
  .dks-steps{order:1;gap:.5rem;margin:0}
  .dks-step-lbl{display:none}
  .dks-step-ic{width:30px;height:30px;font-size:.9rem}
  .dks-checkout-help{display:none}
  .dks-cart{grid-template-columns:minmax(0,1fr);gap:1.6rem}
  .dks-cart-main,.dks-cart-side{min-width:0}
  .dks-cart-item{grid-template-columns:64px minmax(0,1fr) auto;grid-template-areas:"thumb info remove" "thumb qty price";column-gap:.9rem;row-gap:.7rem;align-items:start}
  .dks-ci-info{min-width:0}
  .dks-ci-name{overflow-wrap:anywhere}
  .dks-ci-thumb{width:64px}
  .dks-ci-thumb img{width:64px;height:64px}
  .dks-ci-badge{width:21px;height:21px;font-size:.7rem;top:-7px;right:-7px}
  .dks-ci-remove{justify-self:end;align-self:start}
  .dks-ci-qty{align-self:center}
  .dks-ci-price{align-self:center}
  .dks-cart-actions{flex-direction:column;align-items:stretch}
  .dks-coupon,.dks-coupon-row{width:100%}
  .dks-coupon-row input{min-width:0;flex:1}
  .dks-grid{grid-template-columns:1fr}
  .dks-cat-cards{grid-template-columns:1fr}
  .dks-card-img img{height:170px}
  /* checkout single column */
  form.checkout.woocommerce-checkout{grid-template-columns:1fr}
  #customer_details,#order_review_heading,#order_review{grid-column:1;grid-row:auto}
  #order_review{position:static;margin-top:.6rem}
  .km-svc,.km-spec,.km-desc2,.km-config,.km-help-grid,.km-reviews{grid-template-columns:1fr;gap:1rem}
  .km-config{padding:1.4rem}
  .km-desc2 dd{margin-left:1.8rem}
  .dks-footer-grid{grid-template-columns:1fr;gap:1.6rem}
  .dks-fbar-in{flex-direction:column;align-items:flex-start}
  .dks-subnav{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}
  .dks-subnav a{white-space:nowrap}
}
@media(max-width:560px){
  .dks-container{padding:0 16px}
  .single-product main.wp-block-group{padding:1.2rem 16px 0}
  .woocommerce div.product .product_title{font-size:1.6rem}
  .dks-relax{padding:1.1rem}
  .dks-relax-head h3{font-size:1.05rem;max-width:100%}
  .dks-relax-price{text-align:left}
  .dks-relax-price .amt{font-size:1.6rem}
  .dks-tiers{grid-template-columns:1fr}
  .dks-tier{display:flex;align-items:center;gap:.6rem;justify-content:space-between;text-align:left;padding:.8rem 1rem}
  .dks-tier.on{padding-right:2.6rem}
  .dks-tier .tn{flex:0 0 auto;min-width:5.5rem}
  .dks-tier .tvol{margin:0;flex:1}
  .dks-tier .tp{white-space:nowrap}
  .dks-tier-check{top:50%;right:.7rem;transform:translateY(-50%)}
  .dks-terms{grid-template-columns:1fr 1fr 1fr;gap:.4rem}
  .dks-term{padding:.55rem .3rem;font-size:.78rem}
  .km-pdp h2{font-size:1.4rem}
  .km-reviews-sec,.km-config{padding:1.2rem}
  .km-contact .lead{font-size:1.25rem}
  .km-svc-row{font-size:.88rem}
  /* --- cart: phone-optimised --- */
  .dks-cart{margin-top:1.4rem;padding:0 16px}
  .dks-cart-titlebar h1{font-size:1.5rem}
  .dks-cart-item{padding:1.1rem 0}
  .dks-ci-name{font-size:1rem}
  .dks-ci-price{font-size:1rem}
  .dks-ci-qty input.qty{width:36px}
  .dks-qbtn{width:40px;height:42px;font-size:1rem}
  .dks-cart-actions{padding:1.4rem 0;gap:1.4rem}
  .dks-coupon-row{flex-wrap:wrap;gap:.55rem}
  .dks-coupon-row input{flex:1 1 100%}
  .dks-coupon-row .dks-btn-ghost{flex:1 1 100%;padding:.7rem 1rem;height:auto}
  .dks-summary-title{font-size:1.05rem}
}

/* =========================================================================
   HOME PAGE — KM shop replica, modernised
   ========================================================================= */
.dks-home{--pad:clamp(3rem,6vw,5.5rem)}
.dks-home section{position:relative}
.dks-home h2{font-size:clamp(1.55rem,3vw,2.1rem);font-weight:800;letter-spacing:-.02em;color:var(--ink);margin:0 0 .5rem;line-height:1.15}
.dks-sec-eyebrow{display:inline-block;font-size:.74rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--acc);margin-bottom:.55rem}
.dks-sec-sub{color:var(--muted);font-size:1.02rem;margin:.1rem 0 0;max-width:52ch}

/* shared home buttons */
.dks-btn-primary{display:inline-flex;align-items:center;gap:.5rem;background:linear-gradient(120deg,var(--blue),var(--blue-2));color:#fff;font-weight:700;font-size:.95rem;padding:.85rem 1.5rem;border-radius:999px;box-shadow:0 10px 24px rgba(20,35,70,.22);transition:.18s}
.dks-btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(20,35,70,.28)}
.dks-btn-primary .bi{transition:.2s}.dks-btn-primary:hover .bi{transform:translateX(4px)}
.dks-btn-line{display:inline-flex;align-items:center;gap:.5rem;color:var(--blue);font-weight:700;font-size:.95rem;padding:.85rem 1.2rem;border-radius:999px;transition:.15s}
.dks-btn-line:hover{background:#fff;box-shadow:var(--sh)}
button.dks-btn-line{background:transparent;border:0;font-family:inherit;cursor:pointer}
.dks-btn-white{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;background:#fff;color:var(--blue);font-weight:700;font-size:.95rem;padding:.85rem 1.5rem;border-radius:999px;transition:.18s}
.dks-btn-white:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.18)}
.dks-btn-outline-w{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:1.5px solid rgba(255,255,255,.55);color:#fff;font-weight:700;font-size:.95rem;padding:.85rem 1.5rem;border-radius:999px;transition:.15s}
.dks-btn-outline-w:hover{background:rgba(255,255,255,.14);border-color:#fff}

/* section head (title left, link right) */
.dks-home-sec{padding:var(--pad,clamp(3rem,6vw,5.5rem)) 0}
.dks-sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem;margin-bottom:2.2rem}
.dks-sec-head--center{justify-content:center;text-align:center}
.dks-sec-head--center .dks-sec-sub{margin-inline:auto}
.dks-sec-link{flex:0 0 auto;display:inline-flex;align-items:center;gap:.45rem;color:var(--blue);font-weight:700;font-size:.92rem;transition:.15s}
.dks-sec-link:hover{color:var(--acc)}.dks-sec-link .bi{transition:.2s}.dks-sec-link:hover .bi{transform:translateX(4px)}
.dks-sec-cta{text-align:center;margin-top:2.4rem}

/* ---- HERO (premium navy) — scoped to the HOME so it never leaks onto the
   product page, which reuses the base .dks-hero class for its own layout. ---- */
.dks-home .dks-hero{position:relative;overflow:hidden;color:#eaf1fc;background:radial-gradient(900px 520px at 88% -15%,rgba(225,10,125,.28),transparent 60%),radial-gradient(700px 500px at 10% 120%,rgba(87,140,230,.30),transparent 60%),linear-gradient(135deg,#12285a 0%,#1b3a7a 48%,#0d1c40 100%)}
.dks-home .dks-hero::before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 1px 1px,rgba(255,255,255,.10) 1px,transparent 0);background-size:24px 24px;opacity:.6;pointer-events:none}
.dks-hero-in{position:relative;z-index:1;display:grid;grid-template-columns:1.12fr .88fr;gap:3rem;align-items:center;padding:clamp(3.2rem,6vw,5.8rem) 22px}
.dks-hero-eyebrow{display:inline-flex;align-items:center;gap:.4rem;background:rgba(255,255,255,.12);color:#fff;font-weight:800;font-size:.78rem;letter-spacing:.04em;padding:.42rem .95rem;border-radius:999px;border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(4px);margin-bottom:1.3rem}
.dks-hero-eyebrow .bi{color:#ffd36b}
.dks-hero-copy h1{font-size:clamp(2.2rem,4.7vw,3.5rem);line-height:1.05;letter-spacing:-.03em;font-weight:800;color:#fff;margin:0 0 1.2rem}
.dks-hero-copy h1 span{background:linear-gradient(120deg,#8fbcff,#ff7bb5);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.dks-hero-copy>p{font-size:1.08rem;line-height:1.62;color:#c3d3ee;max-width:48ch;margin:0 0 1.8rem}
.dks-hero-cta{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap}
.dks-hero .dks-btn-primary{background:linear-gradient(120deg,var(--acc),var(--acc-2));box-shadow:0 12px 30px rgba(225,10,125,.42)}
.dks-hero .dks-btn-line{color:#fff;border:1.5px solid rgba(255,255,255,.35)}
.dks-hero .dks-btn-line:hover{background:rgba(255,255,255,.12);box-shadow:none}
.dks-hero-trust{list-style:none;margin:2rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:1.4rem}
/* phones-only duplicate of the first two figures; the .dks-stats band covers desktop */
.dks-hero-figs{display:none}
.dks-hero-trust li{display:inline-flex;align-items:center;gap:.5rem;font-size:.9rem;font-weight:600;color:#eaf1fc}
.dks-hero-trust .bi{color:#5fe39a;font-size:1.05rem}
.dks-hero-media{position:relative;display:flex;justify-content:center;align-items:center}
.dks-hero-media::before{content:"";position:absolute;width:min(520px,100%);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(143,188,255,.5),transparent 62%);filter:blur(38px);z-index:0}
.dks-hero-photo{position:relative;z-index:1;width:auto;max-width:100%;height:auto;max-height:470px;object-fit:contain;filter:drop-shadow(0 34px 46px rgba(3,10,28,.55))}
/* no white box — the printer floats on the navy hero, larger */
.dks-hero-card{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;background:transparent;border:0;border-radius:0;padding:0;width:min(440px,100%);box-shadow:none;color:#fff;transition:.25s}
.dks-hero-card:hover{transform:translateY(-6px)}
.dks-hero-badge{position:absolute;top:0;left:50%;transform:translateX(-50%);display:inline-flex;align-items:center;gap:.35rem;background:var(--acc);color:#fff;font-size:.74rem;font-weight:800;letter-spacing:.02em;padding:.36rem .8rem;border-radius:999px;box-shadow:0 6px 18px rgba(225,10,125,.45);z-index:2}
.dks-hero-card-img{display:flex;align-items:center;justify-content:center;height:340px;margin:1.4rem 0 1rem;filter:drop-shadow(0 30px 40px rgba(3,10,28,.55))}
.dks-hero-card-img img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.dks-hero-ph{font-size:7rem;color:rgba(255,255,255,.5);text-align:center;margin:1.4rem auto}
.dks-hero-card-info{display:flex;flex-direction:column;align-items:center;gap:.3rem}
.dks-hero-card-info b{font-size:1.2rem;color:#fff}
.dks-hero-card-info>span:not(.dks-hero-card-price){color:#c3d3ee;font-size:.9rem}
.dks-hero-card-price{display:inline-flex;align-items:baseline;gap:.35rem;color:#fff;font-weight:800;font-size:1.5rem}
.dks-hero-card-price em{font-style:normal;font-size:.78rem;font-weight:600;color:#c3d3ee}
.dks-hero-card-price small{font-size:.82rem;font-weight:600;color:#c3d3ee}
.dks-hero-card-price .amount,.dks-hero-card-price bdi{color:#fff}
.dks-hero-chip{position:absolute;display:inline-flex;align-items:center;gap:.4rem;background:#fff;border:1px solid var(--line);box-shadow:var(--sh-md);border-radius:999px;padding:.5rem .85rem;font-size:.8rem;font-weight:700;color:var(--ink);animation:dks-float 4s ease-in-out infinite}
.dks-hero-chip .bi{color:var(--blue)}
.dks-hero-chip-1{top:8%;right:-2%}
.dks-hero-chip-2{bottom:6%;left:-4%;animation-delay:-2s}
@keyframes dks-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.dks-visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---- HERO SLIDER · crossfade of the original hero + finished KM banners ----
   Slides are stacked; the active one is position:relative (so it drives the section
   height) while the rest are absolute overlays that fade in/out. This lets the tall
   copy hero and the short 16:9 banners share one slider without a fixed height. */
/* Phones/tablets: a contained rounded card with side gutters. Desktop turns it full-bleed
   and viewport-tall further down (see the min-width:901px block). */
.dks-hero-slider{padding:clamp(1.4rem,3vw,2.6rem) clamp(16px,3vw,22px)}
.dks-hero-slider::before{display:none}   /* the dotted texture moves onto the hero slide only */
.dks-banner{position:relative;max-width:var(--ct);margin-inline:auto}
.dks-banner-view{position:relative;overflow:hidden;background:#0d1c40;border-radius:20px;box-shadow:0 24px 60px rgba(15,28,60,.18);transition:height .55s ease}
.dks-banner-slide{position:absolute;top:0;left:0;width:100%;opacity:0;transition:opacity .7s ease;pointer-events:none}
.dks-banner-slide.on{opacity:1;pointer-events:auto;z-index:1}
/* Before the JS runs, the active slide defines the height so the slider never collapses;
   once JS is ready it drives .dks-banner-view height explicitly and animates it. */
.dks-banner:not(.js-ready) .dks-banner-slide.on{position:relative}
/* Banners show at their natural 16:9 — no crop. Contained to 1200px the banner height
   (~670px) already matches the hero slide (~669px), so on desktop every slide is the same
   size without forcing it; on phones each slide keeps its own height (hero tall, banner short). */
.dks-slide-img{display:block;line-height:0}
.dks-slide-img img{width:100%;height:auto;display:block}
/* CTA overlaid on the banner slides only (never the hero). Its corner is set per banner
   (.dks-cta-bl/br/tr/tl/bc) over a text-free area; on phones all sit centred above the dots. */
.dks-banner-cta{position:absolute;z-index:3;display:inline-flex;align-items:center;gap:.5rem;background:linear-gradient(120deg,var(--acc),var(--acc-2));color:#fff;font-weight:700;font-size:.95rem;line-height:1.2;padding:.8rem 1.45rem;border-radius:999px;box-shadow:0 12px 30px rgba(225,10,125,.42);transition:box-shadow .18s}
.dks-banner-cta:hover{box-shadow:0 16px 40px rgba(225,10,125,.62);color:#fff}
.dks-banner-cta .bi{transition:transform .18s}
.dks-banner-cta:hover .bi{transform:translateX(3px)}
.dks-cta-bl{left:clamp(16px,5%,72px);bottom:clamp(18px,12%,82px)}
.dks-cta-br{right:clamp(16px,5%,72px);bottom:clamp(18px,12%,82px)}
.dks-cta-tr{right:clamp(16px,5%,72px);top:clamp(18px,12%,82px)}
.dks-cta-tl{left:clamp(16px,5%,72px);top:clamp(18px,12%,82px)}
.dks-cta-bc{left:50%;transform:translateX(-50%);bottom:clamp(18px,10%,64px)}
/* hugs the bottom edge — for artwork whose own headline already fills the lower band */
.dks-cta-bl-low{left:clamp(16px,5%,72px);bottom:18px}
@media(max-width:600px){
  .dks-banner-cta{left:50%!important;right:auto!important;top:auto!important;transform:translateX(-50%);bottom:34px;font-size:.76rem;padding:.55rem 1rem;white-space:nowrap}
}
/* hero slide keeps the brand gradient + dotted texture it always had */
.dks-slide-hero{background:radial-gradient(900px 520px at 88% -15%,rgba(225,10,125,.28),transparent 60%),radial-gradient(700px 500px at 10% 120%,rgba(87,140,230,.30),transparent 60%),linear-gradient(135deg,#12285a 0%,#1b3a7a 48%,#0d1c40 100%)}
.dks-slide-hero::before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 1px 1px,rgba(255,255,255,.10) 1px,transparent 0);background-size:24px 24px;opacity:.6;pointer-events:none}
.dks-banner-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:46px;height:46px;border-radius:50%;border:0;cursor:pointer;background:rgba(255,255,255,.85);color:var(--ink);box-shadow:0 6px 18px rgba(0,0,0,.22);display:flex;align-items:center;justify-content:center;font-size:1.25rem;transition:.18s;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.dks-banner-arrow:hover{background:#fff;box-shadow:0 8px 22px rgba(0,0,0,.3)}
.dks-banner-prev{left:16px}
.dks-banner-next{right:16px}
/* Dots ride in a translucent pill so they stay legible over any banner artwork. */
.dks-banner-dots{position:absolute;left:0;right:0;bottom:16px;z-index:4;display:flex;justify-content:center;align-items:center;gap:.55rem;width:max-content;margin-inline:auto;padding:.42rem .7rem;border-radius:999px;background:rgba(13,28,64,.42);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.dks-banner-dot{width:9px;height:9px;padding:0;border:0;border-radius:999px;cursor:pointer;background:rgba(255,255,255,.5);box-shadow:0 1px 4px rgba(0,0,0,.35);transition:.22s}
.dks-banner-dot:hover{background:rgba(255,255,255,.8)}
.dks-banner-dot.on{background:#fff;width:26px}
@media(max-width:600px){
  .dks-banner-arrow{display:none}   /* phones swipe instead */
  .dks-banner-dots{bottom:10px}
}
/* ---- PHONES / TABLETS · full-bleed banners that fill the screen ----
   Only the artwork slides take the viewport height (the JS keeps measuring the active slide,
   so slide 1 still uses its own taller copy layout instead of being squeezed). --dks-bh is the
   space left under the header; the second cap keeps the crop inside each artwork's own
   proportions — 185vw for the 9:16 phone art, 62vw for the 21:9 art tablets still get. */
@media(max-width:900px){
  .dks-hero-slider{padding:0}
  .dks-banner{max-width:none}
  .dks-banner-view{border-radius:0;box-shadow:none}
  /* picture needs the height too, or the img falls back to its natural size and leaves a gap */
  .dks-slide-img{display:block}
  .dks-slide-img picture{display:block;height:100%}
  .dks-slide-img img{width:100%;height:100%;object-fit:cover;object-position:center}
  .dks-pos-top img{object-position:center top}
  .dks-pos-bottom img{object-position:center bottom}
}
@media(max-width:600px){
  .dks-slide-img{height:min(var(--dks-bh,calc(100svh - 92px)),185vw)}   /* 9:16 phone art */
}
@media(min-width:601px) and (max-width:900px){
  .dks-slide-img{height:min(var(--dks-bh,calc(100svh - 100px)),125vw)}  /* 4:5 tablet art */
}
/* ---- DESKTOP · full-bleed banner that fits the window without scrolling ----
   The slider spans the whole viewport width and is exactly as tall as the space left under
   the header, so a laptop shows the complete banner with no scroll at all. --dks-bh is
   measured by JS (the header height changes with the viewport); the calc() is the fallback.
   The 50vw cap stops the height from running past the artwork's own 21:9 proportions on tall
   windows. Banners are 21:9 with a wide empty safe margin baked in, so object-fit:cover only
   ever trims background — never text or product. */
@media(min-width:901px){
  .dks-hero-slider{padding:0}
  .dks-banner{max-width:none}
  .dks-banner-view{border-radius:0;box-shadow:none;transition:none;
    height:min(var(--dks-bh,calc(100svh - 108px)),50vw);min-height:380px}
  .dks-banner-slide{height:100%}
  .dks-banner:not(.js-ready) .dks-banner-slide.on{position:absolute}
  .dks-slide-img,.dks-slide-img picture{display:block;height:100%}
  /* The crop is anchored per banner (.dks-pos-*) to the edge that carries the artwork's
     headline, so the trimmed sliver is always the empty side. */
  .dks-slide-img img{height:100%;object-fit:cover;object-position:center}
  .dks-pos-top img{object-position:center top}
  .dks-pos-bottom img{object-position:center bottom}
  /* Slide 1 (copy + printer photo) has to live inside that same height: centre it and let the
     type shrink with the viewport height so a short laptop never clips it. */
  .dks-slide-hero{overflow:hidden}
  /* extra bottom padding keeps the trust row clear of the slider dots */
  /* border-box matters here: with the theme's default content-box the padding would be added
     on top of height:100% and push the copy past the bottom of the slide. */
  .dks-hero-in{height:100%;box-sizing:border-box;align-content:center;
    padding-block:clamp(1rem,4vh,2.6rem) clamp(2.6rem,7vh,3.6rem)}
  .dks-hero-eyebrow{margin-bottom:min(1.3rem,2.4vh)}
  .dks-hero-copy h1{font-size:min(3.5rem,4.4vw,9.4vh);margin-bottom:min(1.2rem,2.2vh)}
  .dks-hero-copy>p{font-size:min(1.08rem,2.6vh);margin-bottom:min(1.8rem,3.4vh)}
  .dks-hero-trust{margin-top:min(2rem,3.6vh)}
  .dks-hero-photo{max-height:min(470px,66vh)}
  .dks-banner-prev{left:26px}
  .dks-banner-next{right:26px}
  .dks-banner-dots{bottom:22px}
}

/* ---- Tira de fotos sobre el hero de una landing de sector (ver dks_render_svc) ----
   Cuatro fotos reales de Konica Minolta (oficina, control de producción, autenticación con
   tarjeta e impresión móvil) en tiles 4:3 iguales. Todas son fotografías, así que van a 'cover':
   mezclar una foto con recortes de producto sin fondo quedaba raro. */
.dks-svc-shots{background:var(--bg)}
.dks-svc-shots-in{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.dks-svc-shot{margin:0;overflow:hidden;aspect-ratio:4/3;background:#fff}
.dks-svc-shot img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:760px){
  .dks-svc-shots-in{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
}

/* ---- INSTAGRAM FEED (página de redes) · mosaico cuadrado con la leyenda al pasar ---- */
.dks-igf{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem}
.dks-igf-i{position:relative;display:block;aspect-ratio:1;border-radius:14px;overflow:hidden;background:var(--sky);box-shadow:var(--sh)}
.dks-igf-i img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
.dks-igf-i:hover img{transform:scale(1.06)}
.dks-igf-t{position:absolute;top:.6rem;right:.7rem;z-index:2;color:#fff;font-size:1.05rem;text-shadow:0 2px 8px rgba(0,0,0,.55)}
.dks-igf-ov{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:flex-end;gap:.45rem;
  padding:.9rem;color:#fff;font-size:.8rem;line-height:1.45;
  background:linear-gradient(to top,rgba(6,12,28,.88),rgba(6,12,28,.35) 55%,transparent);
  opacity:0;transition:opacity .28s ease}
.dks-igf-i:hover .dks-igf-ov,.dks-igf-i:focus-visible .dks-igf-ov{opacity:1}
.dks-igf-ov em{font-style:normal;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.dks-igf-ov b{display:inline-flex;align-items:center;gap:.35rem;font-size:.82rem}
.dks-igf-ov b .bi{color:#ff6b9d}
@media(max-width:900px){.dks-igf{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){
  .dks-igf{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}
  /* sin hover en el móvil: la leyenda siempre visible, sólo el degradado inferior */
  .dks-igf-ov{opacity:1;background:linear-gradient(to top,rgba(6,12,28,.85),transparent 45%);justify-content:flex-end;padding:.6rem}
  .dks-igf-ov em{display:none}
}

/* ---- STATS ---- */
.dks-stats{background:var(--blue);color:#fff}
.dks-stats-in{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;padding:2.2rem 22px}
.dks-stat{text-align:center;padding:.4rem}
.dks-stat b{display:block;font-size:clamp(1.8rem,3.5vw,2.5rem);font-weight:800;letter-spacing:-.02em;line-height:1}
.dks-stat span{display:block;margin-top:.4rem;font-size:.86rem;color:#cdd9f0}
.dks-stat+.dks-stat{border-left:1px solid rgba(255,255,255,.14)}

/* ---- BEST SELLERS grid (3 cols) ---- */
.dks-home-grid{grid-template-columns:repeat(3,1fr)}
.dks-card-more{align-items:flex-start;justify-content:center;gap:.5rem;text-align:left;background:linear-gradient(150deg,var(--sky),#fff);border-style:dashed;border-color:#c8d6ef}
.dks-card-more:hover{border-color:var(--blue);box-shadow:var(--sh-md);transform:translateY(-3px)}
.dks-card-more-ic{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:#fff;color:var(--blue);font-size:1.5rem;box-shadow:var(--sh);margin-bottom:.4rem}
.dks-card-more b{font-size:1.12rem;color:var(--ink)}
.dks-card-more>span{color:var(--muted);font-size:.92rem}
.dks-card-more em{margin-top:.5rem;font-style:normal;font-weight:700;color:var(--blue);display:inline-flex;align-items:center;gap:.4rem}
.dks-card-more em .bi{transition:.2s}.dks-card-more:hover em .bi{transform:translateX(4px)}

/* ---- RELAXRATE benefits ---- */
.dks-relaxsec{background:var(--bg)}
.dks-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.dks-benefit{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.6rem;transition:.18s}
.dks-benefit:hover{transform:translateY(-4px);box-shadow:var(--sh-md);border-color:#d6e0f2}
.dks-benefit-ic{display:flex;align-items:center;justify-content:center;width:54px;height:54px;border-radius:14px;background:linear-gradient(135deg,var(--sky),#dae7fb);color:var(--blue);font-size:1.5rem;margin-bottom:1rem}
.dks-benefit b{display:block;font-size:1.08rem;color:var(--ink);margin-bottom:.4rem}
.dks-benefit>span{color:var(--muted);font-size:.94rem;line-height:1.5}

/* ---- SUPPLIES ---- */
.dks-supply-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}
.dks-supply{display:flex;align-items:center;gap:1rem;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.2rem 1.3rem;transition:.18s}
.dks-supply:hover{transform:translateY(-3px);box-shadow:var(--sh-md);border-color:#d6e0f2}
.dks-supply-ic{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:12px;background:var(--sky);color:var(--blue);font-size:1.35rem}
.dks-supply b{flex:1;font-size:1rem;color:var(--ink)}
.dks-supply-arr{color:var(--muted);transition:.2s}
.dks-supply:hover .dks-supply-arr{color:var(--blue);transform:translateX(4px)}

/* ---- TESTIMONIALS ---- */
.dks-reviews{background:var(--bg)}
.dks-review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.dks-review{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.7rem;display:flex;flex-direction:column;gap:.9rem;box-shadow:var(--sh)}
.dks-review-stars{color:var(--gold);font-size:.95rem;letter-spacing:.1em}
.dks-review blockquote{margin:0;font-size:1.02rem;line-height:1.55;color:var(--ink)}
.dks-review figcaption{display:flex;align-items:center;gap:.7rem;margin-top:auto}
.dks-review-ava{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--blue-2));color:#fff;font-weight:800;font-size:1.1rem;flex:0 0 auto}
.dks-review-who{display:flex;flex-direction:column;line-height:1.25}
.dks-review-who b{font-size:.96rem;color:var(--ink)}
.dks-review-who small{color:var(--muted);font-size:.82rem}

/* ---- CONTACT CTA ---- */
/* Sits directly above the footer, so it borrows the footer's navy instead of the bright
   brand blue — otherwise the seam reads as two unrelated bands. */
.dks-contact{position:relative;background:radial-gradient(1000px 460px at 15% 120%,#22407a,transparent 62%),linear-gradient(160deg,#1a2f5e 0%,#132549 55%,#0e1a30 100%);color:#fff;overflow:hidden}
.dks-contact::before{content:"";position:absolute;top:-40%;right:-10%;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(225,10,125,.28),transparent 65%);pointer-events:none}
.dks-contact-in{position:relative;display:flex;align-items:center;justify-content:space-between;gap:2.5rem;flex-wrap:wrap}
/* page-level rules like `.dks-svcpage h2 {color:var(--ink)}` tie on specificity and land
   later, painting this dark section's heading near-black (contrast 1.15). Out-specify. */
.dks-contact .dks-contact-copy h2,
.dks-contact .dks-contact-copy h3,
.dks-contact h2{color:#fff}
.dks-contact .dks-contact-copy p,
.dks-contact p{color:#d7e2f6;font-size:1.05rem;line-height:1.6;max-width:48ch;margin:.3rem 0 1.2rem}
.dks-contact .dks-contact-links a{color:#fff}
.dks-contact-links{display:flex;flex-wrap:wrap;gap:1.6rem}
.dks-contact-links a{display:inline-flex;align-items:center;gap:.5rem;color:#fff;font-weight:700;font-size:1.02rem;transition:.15s}
.dks-contact-links a:hover{color:#ffd7ec}
.dks-contact-actions{display:flex;flex-direction:column;gap:.7rem;min-width:260px}

/* ---- HOME responsive ---- */
@media(max-width:1024px){
  .dks-hero-in{grid-template-columns:1fr;gap:2.2rem}
  .dks-hero-media{justify-content:flex-start}
  .dks-hero-chip-1{right:2%}.dks-hero-chip-2{left:2%}
  .dks-home-grid{grid-template-columns:repeat(2,1fr)}
  .dks-benefits,.dks-review-grid{grid-template-columns:repeat(2,1fr)}
  .dks-supply-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:860px){
  .dks-stats-in{grid-template-columns:repeat(2,1fr);gap:1.4rem 1rem}
  .dks-stat:nth-child(3){border-left:0}
  .dks-contact-in{flex-direction:column;align-items:flex-start}
  .dks-contact-actions{width:100%}
}
@media(max-width:560px){
  .dks-sec-head{flex-direction:column;align-items:flex-start;gap:.7rem}
  .dks-sec-head--center{align-items:center}
  .dks-home-grid,.dks-benefits,.dks-review-grid,.dks-supply-grid{grid-template-columns:1fr}
  .dks-hero-copy h1{font-size:2rem}
  .dks-hero-trust{gap:.7rem 1.2rem}
  .dks-stat b{font-size:1.9rem}
  .dks-hero-chip{display:none}
}

/* =========================================================================
   SERVICIOS PAGE — KM /servicios replica, modernised
   ========================================================================= */
.dks-servicios{--pad:clamp(3rem,6vw,5.5rem)}
.dks-servicios .dks-home-sec{padding:var(--pad,clamp(3rem,6vw,5.5rem)) 0}

/* ---- hero ---- */
.dks-svc-hero{position:relative;overflow:hidden;color:#eaf1fc;text-align:center;background:radial-gradient(900px 520px at 85% -20%,rgba(225,10,125,.26),transparent 60%),radial-gradient(760px 520px at 8% 120%,rgba(87,140,230,.30),transparent 60%),linear-gradient(135deg,#12285a 0%,#1b3a7a 50%,#0d1c40 100%)}
.dks-svc-hero::before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 1px 1px,rgba(255,255,255,.10) 1px,transparent 0);background-size:24px 24px;opacity:.55;pointer-events:none}
.dks-svc-hero-in{position:relative;z-index:1;max-width:820px;margin:0 auto;padding:clamp(3rem,6vw,5rem) 22px}
.dks-svc-eyebrow{display:inline-flex;align-items:center;gap:.45rem;background:rgba(255,255,255,.12);color:#fff;font-weight:800;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;padding:.42rem .95rem;border-radius:999px;border:1px solid rgba(255,255,255,.2);margin-bottom:1.3rem}
.dks-svc-eyebrow .bi{color:#ffd36b}
.dks-svc-hero h1{font-size:clamp(2rem,4.4vw,3.1rem);line-height:1.08;letter-spacing:-.03em;font-weight:800;color:#fff;margin:0 0 1.1rem}
.dks-svc-hero h1 span{background:linear-gradient(120deg,#8fbcff,#ff7bb5);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.dks-svc-hero p{font-size:1.08rem;line-height:1.62;color:#c3d3ee;max-width:60ch;margin:0 auto 1.8rem}
.dks-svc-hero .dks-hero-cta{justify-content:center}
.dks-svc-hero .dks-btn-primary{background:linear-gradient(120deg,var(--acc),var(--acc-2));box-shadow:0 12px 30px rgba(225,10,125,.42)}
/* Logo dentro de un titular: se alinea con la línea base del texto y crece con él, así el
   conjunto "Quiénes somos en [dks]" se lee como una sola frase. */
/* El logotipo es en minúsculas, así que a la misma altura que el texto se ve pequeño:
   se le da algo más y se baja un pelo para que apoye en la línea base. */
.dks-h1-logo{display:inline-block;height:1.16em;width:auto;vertical-align:-.19em;margin-left:.18em}

/* Variante PARTIDA: texto a la izquierda, foto a la derecha (ver dks_hero_split).
   La foto no es un fondo velado sino una mitad limpia, con un degradado corto que la funde
   con el azul para que no haya un corte duro entre las dos zonas. */
.dks-svc-hero--split{text-align:left;background:
  radial-gradient(760px 520px at 8% 120%,rgba(87,140,230,.30),transparent 60%),
  linear-gradient(135deg,#12285a 0%,#1b3a7a 52%,#0d1c40 100%)}
.dks-svc-hero--split::after{content:"";position:absolute;top:0;right:0;bottom:0;width:47%;z-index:0;
  background-image:var(--hero-img);background-size:cover;background-position:center}
.dks-svc-hero--split::before{content:"";position:absolute;top:0;bottom:0;right:47%;width:170px;z-index:1;
  background-image:linear-gradient(90deg,rgba(13,28,64,0) 0%,rgba(13,28,64,.55) 55%,#12285a 100%);
  background-size:auto;opacity:1;transform:scaleX(-1)}
.dks-svc-hero--split .dks-svc-hero-in{position:relative;z-index:2;max-width:var(--ct);margin:0 auto;
  display:grid;grid-template-columns:minmax(0,50%);padding:clamp(3rem,6.5vw,5rem) 22px}
.dks-svc-hero--split .dks-svc-eyebrow{justify-self:start}
.dks-svc-hero--split h1{font-size:clamp(1.9rem,3.3vw,2.6rem)}
.dks-svc-hero--split p{margin-left:0;margin-right:0;max-width:46ch}
.dks-svc-hero--split .dks-hero-cta{justify-content:flex-start}
@media(max-width:860px){
  /* en vertical el texto va primero, centrado, y la foto debajo a todo el ancho */
  .dks-svc-hero--split{text-align:center}
  .dks-svc-hero--split::after{position:relative;display:block;width:auto;height:min(52vw,280px);
    background-position:center 35%}
  .dks-svc-hero--split::before{display:none}
  .dks-svc-hero--split .dks-svc-hero-in{grid-template-columns:minmax(0,1fr);padding-top:clamp(1.8rem,6vw,2.6rem)}
  .dks-svc-hero--split .dks-svc-eyebrow{justify-self:center}
  .dks-svc-hero--split p{margin-left:auto;margin-right:auto}
  .dks-svc-hero--split .dks-hero-cta{justify-content:center}
}

/* Variante con foto de fondo y texto CENTRADO: la usan todas las landings de sección
   (ver dks_hero_bg). La foto va en ::after y el velo en ::before, con el mismo tinte azul
   corporativo del degradado que había antes, para que el conjunto siga siendo DKS. */
.dks-svc-hero--bg{background:#0d1c40}
.dks-svc-hero--bg::after{content:"";position:absolute;inset:0;z-index:0;background-image:var(--hero-img);
  background-size:cover;background-position:center}
.dks-svc-hero--bg::before{content:"";position:absolute;inset:0;z-index:1;opacity:1;background-size:auto;
  background-image:linear-gradient(180deg,rgba(9,20,45,.86) 0%,rgba(12,26,58,.82) 55%,rgba(9,20,45,.9) 100%)}
.dks-svc-hero--bg .dks-svc-hero-in{z-index:2}
.dks-svc-hero--bg p{color:#dbe5f6;text-shadow:0 1px 2px rgba(4,10,25,.45)}
@media(max-width:860px){
  /* En el móvil la foto se ve menos porque el texto ocupa casi todo: se refuerza el velo
     y se ancla el encuadre al centro para no perder el motivo. */
  .dks-svc-hero--bg::before{background-image:linear-gradient(180deg,rgba(9,20,45,.9) 0%,rgba(12,26,58,.88) 60%,rgba(9,20,45,.93) 100%)}
  .dks-svc-hero--bg::after{background-position:center center}
}

/* Variante con foto (ver 'hero_img' en dks_svc_pages), al estilo de la tienda de KM España:
   la imagen ocupa todo el hero y el texto va encima, alineado a la izquierda. El velo en
   degradado es lo que mantiene el contraste sin apagar la foto del lado derecho. */
.dks-svc-hero--foto{text-align:left;background:#0d1c40}
.dks-svc-hero--foto::after{content:"";position:absolute;inset:0;background-image:var(--hero-img);
  background-size:cover;background-position:center right;z-index:0}
.dks-svc-hero--foto::before{content:"";position:absolute;inset:0;z-index:1;background:
  linear-gradient(95deg,rgba(9,20,45,.96) 0%,rgba(9,20,45,.94) 42%,rgba(9,20,45,.62) 62%,rgba(9,20,45,.12) 100%);
  background-image:linear-gradient(95deg,rgba(9,20,45,.96) 0%,rgba(9,20,45,.94) 42%,rgba(9,20,45,.62) 62%,rgba(9,20,45,.12) 100%);
  background-size:auto;opacity:1}
.dks-svc-hero--foto .dks-svc-hero-in{z-index:2;max-width:var(--ct);margin:0 auto;
  padding:clamp(3.2rem,7vw,5.6rem) 22px;display:grid;grid-template-columns:minmax(0,52%);gap:0}
/* El hero con foto es un grid de una columna: sin justify-self la píldora se estira a todo
   el ancho y el texto queda pegado a la izquierda. */
.dks-svc-hero--foto .dks-svc-eyebrow{justify-self:start}
.dks-svc-hero--foto h1{font-size:clamp(1.9rem,3.4vw,2.7rem)}
.dks-svc-hero--foto h1 span{background:none;-webkit-text-fill-color:#8fbcff;color:#8fbcff}
.dks-svc-hero--foto p{margin:0 0 .9rem;max-width:60ch;font-size:1rem;color:#dbe5f6;text-shadow:0 1px 2px rgba(4,10,25,.4)}
.dks-svc-hero--foto p:last-of-type{margin-bottom:1.8rem}
.dks-svc-hero--foto .dks-hero-cta{justify-content:flex-start}
@media(max-width:860px){
  .dks-svc-hero--foto{text-align:center}
  /* en vertical la foto se ve por debajo del texto, no detrás: velo fuerte arriba y más
     transparente al final, que es donde queda la impresora */
  /* En vertical se usa el arte 4:5 propio (--hero-img-v), con la impresora abajo: velo fuerte
     arriba, donde va el texto, y casi limpio al final para que la foto se vea de verdad. */
  .dks-svc-hero--foto::after{background-image:var(--hero-img-v,var(--hero-img));background-position:center bottom}
  .dks-svc-hero--foto::before{background-image:linear-gradient(180deg,rgba(9,20,45,.95) 0%,rgba(9,20,45,.92) 42%,rgba(9,20,45,.72) 72%,rgba(9,20,45,.35) 100%)}
  .dks-svc-hero--foto .dks-svc-hero-in{padding-bottom:clamp(9rem,44vw,15rem)}
  .dks-svc-hero--foto .dks-svc-hero-in{grid-template-columns:minmax(0,1fr)}
  .dks-svc-hero--foto .dks-svc-eyebrow{justify-self:center}
  .dks-svc-hero--foto p{margin-left:auto;margin-right:auto}
  .dks-svc-hero--foto .dks-hero-cta{justify-content:center}
}

/* ---- services grid ---- */
.dks-svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.dks-svc-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.9rem 1.7rem;overflow:hidden;transition:.2s}
.dks-svc-card::after{content:"";position:absolute;left:0;top:0;height:100%;width:4px;background:linear-gradient(180deg,var(--blue),var(--acc));transform:scaleY(0);transform-origin:top;transition:.25s}
.dks-svc-card:hover{transform:translateY(-5px);box-shadow:var(--sh-lg);border-color:#d6e0f2}
.dks-svc-card:hover::after{transform:scaleY(1)}
.dks-svc-num{position:absolute;top:1.3rem;right:1.5rem;font-size:2.2rem;font-weight:800;line-height:1;color:var(--sky);letter-spacing:-.03em}
.dks-svc-ic{display:flex;align-items:center;justify-content:center;width:58px;height:58px;border-radius:16px;background:linear-gradient(135deg,var(--sky),#dae7fb);color:var(--blue);font-size:1.65rem;margin-bottom:1.1rem;transition:.25s}
.dks-svc-card:hover .dks-svc-ic{background:linear-gradient(135deg,var(--blue),var(--blue-2));color:#fff}
.dks-svc-card b{font-size:1.14rem;color:var(--ink);margin-bottom:.5rem;line-height:1.25}
.dks-svc-txt{color:var(--muted);font-size:.95rem;line-height:1.55;flex:1}
.dks-svc-more{margin-top:1.1rem;font-style:normal;font-weight:700;font-size:.9rem;color:var(--blue);display:inline-flex;align-items:center;gap:.4rem}
.dks-svc-more .bi{transition:.2s}
.dks-svc-card:hover .dks-svc-more{color:var(--acc)}
.dks-svc-card:hover .dks-svc-more .bi{transform:translateX(4px)}

/* ---- product showcase band ---- */
.dks-svc-products{background:var(--bg)}

/* ---- responsive ---- */
@media(max-width:1024px){
  .dks-svc-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .dks-svc-grid{grid-template-columns:1fr}
  .dks-svc-hero .dks-hero-cta{flex-direction:column;align-items:stretch}
}

/* =============================== PRIVACY POLICY ========================= */
/* the theme's full-width group pads 70px above the title, plus its block gaps */
.privacy-policy .wp-site-blocks>main>.wp-block-group{padding-block:0!important}
.privacy-policy .wp-site-blocks>main{margin-top:0!important}
body.privacy-policy .wp-block-post-title{
  max-width:var(--ct)!important;margin:0 auto!important;padding:2rem 22px 0;
  font-size:clamp(1.9rem,3.4vw,2.7rem)!important;line-height:1.15;letter-spacing:-.02em;color:var(--ink)}
body.privacy-policy .entry-content.wp-block-post-content{
  max-width:860px!important;margin:1.6rem auto 3.5rem!important;padding:2.4rem 2.6rem;
  background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);
  font-size:1rem;line-height:1.75;color:#3d4757}
body.privacy-policy .entry-content.wp-block-post-content>*{max-width:none!important;margin-left:0!important;margin-right:0!important}
/* the lead line ("Última actualización") reads as a note, not body copy */
.privacy-policy .wp-block-post-content>p:first-child{
  margin:0 0 1.8rem;padding:.75rem 1rem;background:var(--bg);border-left:3px solid var(--blue);
  border-radius:0 var(--r-sm) var(--r-sm) 0;font-size:.9rem;color:var(--muted)}
.privacy-policy .wp-block-post-content>p:first-child strong{color:var(--ink)}
.privacy-policy .wp-block-post-content h2{
  margin:2.6rem 0 .9rem;padding-top:1.6rem;border-top:1px solid var(--line);
  font-size:1.3rem!important;line-height:1.3;font-weight:800;color:var(--ink);letter-spacing:-.01em}
.privacy-policy .wp-block-post-content h2:first-of-type{border-top:0;padding-top:0;margin-top:0}
.privacy-policy .wp-block-post-content h3{margin:1.6rem 0 .5rem;font-size:1.02rem!important;font-weight:700;color:var(--blue)}
.privacy-policy .wp-block-post-content p{margin:0 0 1rem;font-size:1rem}
.privacy-policy .wp-block-post-content ul{margin:0 0 1.2rem;padding:0;list-style:none;display:flex;flex-direction:column;gap:.6rem}
.privacy-policy .wp-block-post-content li{position:relative;padding-left:1.5rem}
.privacy-policy .wp-block-post-content li::before{
  content:"";position:absolute;left:.3rem;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--acc)}
.privacy-policy .wp-block-post-content li strong{color:var(--ink)}
.privacy-policy .wp-block-post-content code{
  background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:.1rem .4rem;
  font-size:.86em;color:var(--blue);word-break:break-word}
.privacy-policy .wp-block-post-content a{color:var(--blue);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.privacy-policy .wp-block-post-content a:hover{color:var(--acc)}
@media(max-width:768px){
  .privacy-policy .wp-block-post-title{padding:1.6rem 22px 0}
  .privacy-policy .wp-block-post-content{padding:1.4rem 1.3rem;border-radius:var(--r);margin:1.2rem 16px 2.4rem!important}
  .privacy-policy .wp-block-post-content h2{font-size:1.15rem!important;margin-top:2rem}
}

/* =============================== MY ACCOUNT ============================= */
/* Full-screen branded login (logged-out account page) */
.dks-login-screen{background:#0d1c40}
.dks-login-screen .wp-block-template-part,
.dks-login-screen .wp-block-post-title,
.dks-login-screen .woocommerce-breadcrumb,
.dks-login-screen .dks-crumbs{display:none!important}
.dks-login-screen{overflow-x:hidden}
.dks-login-screen .wp-site-blocks>main,
.dks-login-screen .wp-site-blocks,
.dks-login-screen .wp-block-group,
.dks-login-screen .entry-content,
.dks-login-screen .wp-block-post-content,
.dks-login-screen .woocommerce{margin:0!important;padding:0!important;max-width:none!important;width:100%!important}
.dks-login{display:grid;grid-template-columns:1.05fr 1fr;min-height:100vh;min-height:100dvh;width:100%;max-width:100%;overflow:hidden;font-family:var(--font)}
.dks-login-brand{position:relative;overflow:hidden;color:#eaf1fc;display:flex;flex-direction:column;justify-content:center;padding:clamp(1.8rem,4vw,3.2rem);
  background:radial-gradient(900px 520px at 88% -15%,rgba(225,10,125,.30),transparent 60%),radial-gradient(700px 500px at 10% 120%,rgba(87,140,230,.32),transparent 60%),linear-gradient(135deg,#12285a 0%,#1b3a7a 48%,#0d1c40 100%)}
.dks-login-logo img{height:40px;width:auto}
.dks-login-brand-in{max-width:30ch}
.dks-login-brand-in h2{font-size:clamp(1.7rem,3vw,2.4rem);font-weight:800;line-height:1.15;margin:.2rem 0 .8rem}
.dks-login-brand-in p{color:#c6d4ee;font-size:1rem;line-height:1.6;margin-bottom:1.6rem}
.dks-login-points{list-style:none;display:flex;flex-direction:column;gap:.75rem}
.dks-login-points li{display:flex;align-items:center;gap:.7rem;font-size:.95rem;color:#e4ecfb}
.dks-login-points i{flex:0 0 auto;width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:9px;background:rgba(255,255,255,.12);font-size:1rem}
.dks-login-back{position:absolute;left:clamp(1.8rem,4vw,3.2rem);bottom:clamp(1.8rem,4vw,3.2rem);color:#c6d4ee;font-weight:600;font-size:.9rem;display:inline-flex;align-items:center;gap:.4rem;transition:.15s}
.dks-login-back:hover{color:#fff}
.dks-login-panel{display:flex;align-items:center;justify-content:center;padding:clamp(1.5rem,4vw,3rem);background:#fff}
.dks-login-card{width:100%;max-width:400px}
.dks-login-logo--mobile{display:none;margin-bottom:1.6rem}
.dks-login-logo--mobile .dks-logo-img{height:58px!important}
.dks-login-card h1{font-size:clamp(1.5rem,3vw,1.9rem);font-weight:800;color:var(--ink);margin-bottom:.35rem}
.dks-login-sub{color:var(--muted);margin-bottom:1.6rem}
.dks-login .woocommerce-form-login,
.dks-login-form{display:flex;flex-direction:column;gap:1.05rem;width:100%;border:0!important;padding:0!important;margin:0!important;box-sizing:border-box}
.dks-field{display:flex;flex-direction:column;gap:.4rem;width:100%;min-width:0}
.dks-field-l{font-size:.85rem;font-weight:600;color:var(--ink);display:flex;align-items:center;gap:.45rem}
.dks-field-l i{color:var(--blue)}
.dks-login input{box-sizing:border-box}
.dks-field input{width:100%;border:1.5px solid var(--line);border-radius:11px;padding:.8rem .95rem;font-size:.98rem;font-family:var(--font);background:var(--bg);transition:.15s;-webkit-appearance:none}
.dks-field input:focus{outline:none;border-color:var(--blue);background:#fff;box-shadow:0 0 0 4px var(--sky)}
.dks-field-pw{position:relative;display:flex;width:100%}
.dks-field-pw input{flex:1 1 auto;min-width:0;width:100%;padding-right:2.8rem}
.dks-pw-toggle{position:absolute;right:.3rem;top:50%;transform:translateY(-50%);border:0;background:transparent;color:var(--muted);width:2.4rem;height:2.4rem;cursor:pointer;font-size:1.05rem}
.dks-pw-toggle:hover{color:var(--blue)}
.dks-login-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.dks-check{display:flex;align-items:center;gap:.5rem;font-size:.9rem;color:var(--muted);cursor:pointer}
.dks-check input{width:17px;height:17px;accent-color:var(--blue)}
.dks-login-lost{font-size:.88rem;color:var(--blue);font-weight:600}
.dks-login-lost:hover{text-decoration:underline}
.dks-login-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;background:var(--acc);color:#fff;border:0;border-radius:999px;padding:.9rem 1.4rem;font-size:1rem;font-weight:700;font-family:var(--font);cursor:pointer;transition:.15s;box-shadow:0 8px 22px rgba(225,10,125,.28)}
.dks-login-btn:hover{background:var(--acc-2);transform:translateY(-1px)}
.dks-login-help{margin-top:1.6rem;font-size:.9rem;color:var(--muted);text-align:center}
.dks-login-help a{color:var(--blue);font-weight:600}
.dks-login-help a:hover{text-decoration:underline}
.woocommerce-form-login .woocommerce-error,.dks-login .woocommerce-error{list-style:none;background:#fdecec;border:1px solid #f5c2c2;color:#b02020;border-radius:11px;padding:.7rem .9rem;font-size:.88rem;margin-bottom:1rem}

/* Logged-in dashboard */
.dks-account-screen .wp-block-post-title{display:none}
.dks-account-screen .wp-block-post-content{padding-top:0!important}
/* The block theme constrains .wp-block-post-content to the content width, which caps
   the account pages far below the viewport. Release it and let .woocommerce size them. */
.dks-account-screen .wp-site-blocks>main,
.dks-account-screen .entry-content,
.dks-account-screen .wp-block-post-content{max-width:none!important;width:auto!important;margin-left:0!important;margin-right:0!important}
/* The theme stacks 70px + 19px + 26px of top margin above the content, and 56px of
   bottom margin meets the footer's own 56px. Collapse both into the .woocommerce margin. */
.dks-account-screen .wp-site-blocks>main,
.dks-account-screen .wp-block-post-content{margin-top:0!important;margin-bottom:0!important}
/* the theme's full-width group adds 70px of padding above the content */
.dks-account-screen .wp-site-blocks>main>.wp-block-group{padding-block:0!important}
.dks-account-screen .dks-footer{margin-top:0}
/* Woo's block-theme compat sheet caps this at 1000px via `.woocommerce-account main
   .woocommerce`, so we have to out-specify it, not just out-order it. */
.dks-account-screen .woocommerce,
.woocommerce-account.dks-account-screen main .woocommerce{max-width:1680px;margin:1.6rem auto 3.5rem;padding:0 clamp(16px,2.6vw,44px)}
.dks-account-grid{display:grid;grid-template-columns:264px minmax(0,1fr);gap:1.8rem;align-items:start}
/* Neutralize WooCommerce's default float+percentage layout so the grid controls sizing */
.dks-account-grid .woocommerce-MyAccount-navigation,
.dks-account-grid .woocommerce-MyAccount-content{width:auto!important;float:none!important;margin:0!important}
.dks-acct-nav{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:.5rem;position:sticky;top:90px}
.dks-acct-nav ul{list-style:none;display:flex;flex-direction:column;gap:.15rem;margin:0;padding:0}
.dks-acct-nav li{margin:0;border:0;padding:0;list-style:none}
.dks-acct-nav li a{display:flex;align-items:center;gap:.7rem;padding:.7rem .85rem;border-radius:10px;color:var(--ink);font-weight:600;font-size:.93rem;line-height:1.3;white-space:normal;transition:.13s}
.dks-acct-nav li a i{font-size:1.05rem;color:var(--muted);transition:.13s}
.dks-acct-nav li a:hover{background:var(--bg)}
.dks-acct-nav li.is-active a{background:var(--blue);color:#fff}
.dks-acct-nav li.is-active a i{color:#fff}
.woocommerce-MyAccount-content{background:transparent;min-width:0}
.dks-acct-welcome{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;background:radial-gradient(600px 300px at 90% -40%,rgba(225,10,125,.20),transparent 60%),linear-gradient(135deg,#1b3a7a,#12285a);color:#eaf1fc;border-radius:var(--r);padding:1.5rem 1.6rem;margin-bottom:1.4rem}
.dks-acct-hi{font-size:1.35rem;font-weight:800;display:block;margin-bottom:.25rem}
.dks-acct-welcome p{color:#c6d4ee;font-size:.93rem;max-width:52ch}
.dks-acct-logout{flex:0 0 auto;display:inline-flex;align-items:center;gap:.4rem;background:rgba(255,255,255,.14);color:#fff;border-radius:999px;padding:.55rem 1rem;font-weight:600;font-size:.88rem;transition:.15s}
.dks-acct-logout:hover{background:rgba(255,255,255,.24)}
.dks-acct-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:1.1rem;margin-bottom:1.4rem}
.dks-acct-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.2rem;display:flex;flex-direction:column;gap:.5rem;transition:.16s}
.dks-acct-card:hover{transform:translateY(-3px);box-shadow:var(--sh-md);border-color:#d4ddec}
.dks-acct-card-ic{width:44px;height:44px;border-radius:11px;background:var(--sky);color:var(--blue);display:flex;align-items:center;justify-content:center;font-size:1.25rem}
.dks-acct-card b{font-size:1rem;color:var(--ink)}
.dks-acct-card-d{font-size:.86rem;color:var(--muted);line-height:1.45}
.dks-acct-card-go{margin-top:.2rem;font-size:.85rem;font-weight:700;color:var(--blue);display:inline-flex;align-items:center;gap:.35rem}
.dks-acct-help{display:flex;align-items:center;gap:1rem;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.1rem 1.3rem;flex-wrap:wrap}
.dks-acct-help-ic{width:48px;height:48px;border-radius:12px;background:#e8f7ef;color:var(--green);display:flex;align-items:center;justify-content:center;font-size:1.35rem;flex:0 0 auto}
.dks-acct-help b{color:var(--ink)}
.dks-acct-help p{color:var(--muted);font-size:.88rem;margin-top:.1rem}
.dks-acct-help-btn{margin-left:auto;display:inline-flex;align-items:center;gap:.45rem;background:#1aa35c;color:#fff;border-radius:999px;padding:.6rem 1.1rem;font-weight:700;font-size:.9rem;transition:.15s}
.dks-acct-help-btn:hover{background:#158b4d}
/* single order view */
.dks-order-back{display:inline-flex;align-items:center;gap:.4rem;font-size:.85rem;font-weight:700;color:var(--blue);margin-bottom:.7rem}
.dks-order-back:hover{color:var(--acc)}
.dks-order-titlerow{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap}
.dks-order-status{display:inline-flex;align-items:center;border-radius:999px;padding:.28rem .8rem;font-size:.76rem;font-weight:800;
  letter-spacing:.02em;text-transform:uppercase;background:var(--bg);color:var(--muted);border:1px solid var(--line)}
.dks-order-status.is-processing{background:#eef4ff;color:#1b3a7a;border-color:#c3d3ee}
.dks-order-status.is-completed{background:#eefbf3;color:#146c40;border-color:#bfe6cf}
.dks-order-status.is-on-hold,.dks-order-status.is-pending{background:#fff7e8;color:#8a5a00;border-color:#f0dcb0}
.dks-order-status.is-cancelled,.dks-order-status.is-failed,.dks-order-status.is-refunded{background:#fdeef2;color:#a11049;border-color:#f3c2cf}
.dks-order-head p{margin:.45rem 0 0;color:var(--muted);font-size:.9rem}
/* Woo nests a bordered table inside the details card, and boxes each address again */
.woocommerce-MyAccount-content .woocommerce-order-details,
.woocommerce-MyAccount-content .woocommerce-customer-details{background:#fff;border:1px solid var(--line);border-radius:var(--r);
  box-shadow:var(--sh);padding:1.5rem 1.6rem;margin-bottom:1.4rem}
.woocommerce-MyAccount-content .woocommerce-order-details h2,
.woocommerce-MyAccount-content .woocommerce-customer-details h2{font-size:1.05rem!important;font-weight:800;color:var(--ink);margin:0 0 1.1rem}
.woocommerce-MyAccount-content .woocommerce-order-details table.shop_table,
.woocommerce-MyAccount-content .woocommerce-customer-details table.shop_table{border:0!important;border-radius:0!important;box-shadow:none!important;background:transparent!important}
.woocommerce-MyAccount-content .woocommerce-order-details table.shop_table thead th{background:transparent;border-bottom:1px solid var(--line);padding-left:0;padding-right:0}
.woocommerce-MyAccount-content .woocommerce-order-details table.shop_table td,
.woocommerce-MyAccount-content .woocommerce-order-details table.shop_table tfoot th{padding-left:0;padding-right:0}
.woocommerce-MyAccount-content .woocommerce-order-details table.shop_table td:last-child,
.woocommerce-MyAccount-content .woocommerce-order-details table.shop_table th:last-child{text-align:right;white-space:nowrap}
.woocommerce-MyAccount-content .woocommerce-order-details table.shop_table tbody tr:hover td{background:transparent}
.woocommerce-MyAccount-content .woocommerce-order-details tfoot tr:last-child th,
.woocommerce-MyAccount-content .woocommerce-order-details tfoot tr:last-child td{border-bottom:0;font-size:1.05rem;font-weight:800;color:var(--ink)}
.woocommerce-MyAccount-content .woocommerce-customer-details address{border:0!important;padding:0!important;border-radius:0!important;
  font-style:normal;color:var(--muted);line-height:1.7;font-size:.92rem}
.woocommerce-MyAccount-content .woocommerce-customer-details address p{margin:.35rem 0 0;display:flex;align-items:center;gap:.5rem}
/* line item thumbnails, same treatment as the thank-you page */
.woocommerce-MyAccount-content .dks-ty-item{display:inline-flex;align-items:center;gap:.8rem;vertical-align:middle}
.woocommerce-MyAccount-content .dks-ty-thumb{flex:0 0 auto;width:56px;height:56px;border:1px solid var(--line);border-radius:var(--r-sm);
  background:var(--bg);display:flex;align-items:center;justify-content:center;overflow:hidden}
.woocommerce-MyAccount-content .dks-ty-thumb img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;display:block;margin:0}
.woocommerce-MyAccount-content .dks-ty-name{font-weight:700;color:var(--ink);line-height:1.3}
.woocommerce-MyAccount-content .product-quantity{margin-left:.4rem;color:var(--muted);font-weight:600}
.woocommerce-MyAccount-content .wc-item-meta{margin:.5rem 0 0 4.6rem;padding:0;list-style:none;font-size:.82rem;color:var(--muted)}
.woocommerce-MyAccount-content .wc-item-meta p{display:inline;margin:0}
.woocommerce-MyAccount-content .wc-item-meta strong{font-weight:600;color:var(--ink);margin-right:.3rem}

/* endpoint page heading (dashboard has its own hero instead) */
.dks-acct-head{margin:0 0 1.3rem}
.dks-acct-head h1{font-size:clamp(1.35rem,2vw,1.75rem);font-weight:800;color:var(--ink);margin:0;line-height:1.2}
.dks-acct-head p{color:var(--muted);font-size:.92rem;margin:.35rem 0 0}
/* endpoint content sits on white cards so it fills the wider column */
.woocommerce-MyAccount-content>form,
.woocommerce-MyAccount-content>.woocommerce-Addresses>div,
.woocommerce-MyAccount-content>.woocommerce-Address,
.woocommerce-MyAccount-content>.woocommerce-order-details,
.woocommerce-MyAccount-content>.woocommerce-customer-details,
.dks-acct-panel{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.5rem 1.6rem}
.woocommerce-MyAccount-content>form h3,
.dks-acct-panel h3{font-size:1.05rem;font-weight:800;color:var(--ink);margin:0 0 1.1rem}
.woocommerce-MyAccount-content fieldset{border:0;padding:1.3rem 0 0;margin:1.3rem 0 0;border-top:1px solid var(--line)}
.woocommerce-MyAccount-content legend{font-size:1rem;font-weight:800;color:var(--ink);padding:0;margin-bottom:.4rem}
/* Woo ships float + percentage widths; the grid below needs them neutralized. */
.woocommerce-MyAccount-content .form-row{width:auto!important;float:none!important;margin:0 0 1.1rem;padding:0}
.woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper,
.woocommerce-EditAccountForm{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:0 1.3rem;align-items:start}
.woocommerce-MyAccount-content .form-row-wide,
.woocommerce-EditAccountForm>fieldset,
.woocommerce-EditAccountForm>.clear,
.woocommerce-EditAccountForm>p:last-of-type,
.woocommerce-MyAccount-content .woocommerce-address-fields>p:last-of-type{grid-column:1/-1}
.woocommerce-MyAccount-content label{display:block;font-size:.85rem;font-weight:600;color:var(--ink);margin-bottom:.35rem}
.woocommerce-MyAccount-content .required{color:var(--acc);border:0}
.woocommerce-MyAccount-content input.input-text,
.woocommerce-MyAccount-content textarea,
.woocommerce-MyAccount-content select,
.woocommerce-MyAccount-content .select2-selection{width:100%;border:1.5px solid var(--line)!important;border-radius:var(--r-sm)!important;padding:.7rem .9rem!important;font-size:.92rem!important;font-family:var(--font)!important;background:#fff;box-shadow:none!important;min-height:auto}
.woocommerce-MyAccount-content input.input-text:focus,
.woocommerce-MyAccount-content textarea:focus,
.woocommerce-MyAccount-content select:focus{border-color:var(--blue)!important;box-shadow:0 0 0 4px var(--sky)!important;outline:0}
/* select2 needs its inner span reset too, or the country/state boxes end up ~71px tall
   (select2's own line-height + our padding stack). Mirrors the checkout rules. */
.woocommerce-MyAccount-content .select2-container{width:100%!important}
.woocommerce-MyAccount-content .select2-selection{box-sizing:border-box;height:auto;min-height:0;display:flex;align-items:center}
.woocommerce-MyAccount-content .select2-selection__rendered{line-height:1.5!important;padding:0!important;color:var(--ink)}
.woocommerce-MyAccount-content .select2-selection__arrow{top:50%!important;transform:translateY(-50%);right:.6rem!important;height:auto}
.woocommerce-MyAccount-content em,
.woocommerce-MyAccount-content .woocommerce-password-hint{display:block;font-size:.8rem;color:var(--muted);margin-top:.3rem;font-style:normal}
/* addresses: two cards side by side.
   `.u-columns` carries a `::before/::after` table clearfix; as grid children those
   pseudo-elements each claim a cell and shove the real cards out of place. */
.woocommerce-MyAccount-content .woocommerce-Addresses{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.3rem;margin:0}
.woocommerce-MyAccount-content .woocommerce-Addresses::before,
.woocommerce-MyAccount-content .woocommerce-Addresses::after{content:none;display:none}
.woocommerce-MyAccount-content .woocommerce-Address{width:auto!important;float:none!important;margin:0!important;display:flex;flex-direction:column}
.woocommerce-MyAccount-content .woocommerce-Address-title{display:flex;align-items:center;justify-content:space-between;gap:.75rem 1rem;flex-wrap:wrap;margin-bottom:.9rem}
.woocommerce-MyAccount-content .woocommerce-Address-title h2,
.woocommerce-MyAccount-content .woocommerce-Address-title h3{font-size:1.05rem;font-weight:800;margin:0;min-width:0;flex:1 1 auto}
.woocommerce-MyAccount-content .woocommerce-Address address{font-style:normal;color:var(--muted);font-size:.92rem;line-height:1.6;margin:0}
.woocommerce-MyAccount-content .woocommerce-Address>p{color:var(--muted);font-size:.92rem;margin:0}
/* Woo tables inside account content */
.woocommerce-MyAccount-content .woocommerce-orders-table,
.woocommerce-MyAccount-content table.shop_table{width:100%;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);border-collapse:separate;border-spacing:0;overflow:hidden;font-size:.9rem}
.woocommerce-MyAccount-content table.shop_table th,
.woocommerce-MyAccount-content table.shop_table td{padding:.9rem 1.1rem;border-bottom:1px solid var(--line);text-align:left}
.woocommerce-MyAccount-content table.shop_table thead th{background:var(--bg);font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.woocommerce-MyAccount-content table.shop_table tbody tr:last-child td{border-bottom:0}
.woocommerce-MyAccount-content table.shop_table tbody tr:hover td{background:#fbfcff}
.woocommerce-MyAccount-content .woocommerce-Button,
.woocommerce-MyAccount-content .button{display:inline-flex;align-items:center;gap:.4rem;background:var(--blue);color:#fff;border:0;border-radius:999px;padding:.6rem 1.2rem;font-weight:600;font-size:.9rem;cursor:pointer;transition:.15s}
.woocommerce-MyAccount-content .button:hover{background:var(--blue-2)}
.woocommerce-MyAccount-content .woocommerce-Address-title .edit{display:inline-flex;align-items:center;gap:.35rem;background:var(--sky);color:var(--blue);border-radius:999px;padding:.4rem .9rem;font-size:.82rem;font-weight:700;line-height:1.2;white-space:nowrap;flex:0 0 auto;transition:.15s}
.woocommerce-MyAccount-content .woocommerce-Address-title .edit:hover{background:var(--blue);color:#fff}
/* empty states (no orders / no downloads) — a centred panel, not a notice strip.
   Woo renders these as .wc-block-components-notice-banner, so match that too. */
.woocommerce-MyAccount-content>.wc-block-components-notice-banner{
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:.55rem;
  max-width:none;margin:0;padding:2.6rem 1.6rem!important;
  border:1px dashed #c3d3ee!important;background:#fff!important;color:var(--ink);
  font-size:1rem;font-weight:600;box-shadow:none!important}
.woocommerce-MyAccount-content>.wc-block-components-notice-banner>svg{
  width:56px!important;height:56px!important;padding:14px!important;
  border-radius:50%!important;background:var(--sky)!important;fill:var(--blue)!important;
  margin:0 0 .35rem!important;box-sizing:border-box}
.woocommerce-MyAccount-content>.wc-block-components-notice-banner .wc-block-components-notice-banner__content{
  display:flex;flex-direction:column;align-items:center;gap:.6rem;margin:0!important}
.woocommerce-MyAccount-content>.wc-block-components-notice-banner .button{
  margin:.3rem 0 0!important;background:var(--blue)!important;border:0!important;color:#fff!important;
  padding:.65rem 1.4rem;border-radius:999px;font-weight:700;font-size:.9rem;text-decoration:none}
.woocommerce-MyAccount-content>.wc-block-components-notice-banner .button:hover{background:var(--blue-2)!important}

.woocommerce-MyAccount-content .woocommerce-info,
.woocommerce-MyAccount-content .woocommerce-message,
.woocommerce-MyAccount-content .woocommerce-Message{
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.55rem;
  background:#fff!important;border:1px dashed #c3d3ee!important;border-radius:var(--r);
  padding:2.6rem 1.6rem!important;margin:0;color:var(--ink);font-size:1rem;font-weight:600;
  box-shadow:none!important}
.woocommerce-MyAccount-content .woocommerce-info::before,
.woocommerce-MyAccount-content .woocommerce-message::before{
  content:"\f179"!important;display:flex!important;align-items:center;justify-content:center;
  width:56px;height:56px;margin-bottom:.35rem;border-radius:50%;
  background:var(--sky);color:var(--blue);font-family:bootstrap-icons!important;font-size:1.6rem;line-height:1}
.woocommerce-MyAccount-content .woocommerce-info .button,
.woocommerce-MyAccount-content .woocommerce-message .button{
  order:0;margin:.5rem 0 0;background:var(--blue);border:0;color:#fff;padding:.65rem 1.4rem}
.woocommerce-MyAccount-content .woocommerce-info .button:hover,
.woocommerce-MyAccount-content .woocommerce-message .button:hover{background:var(--blue-2);color:#fff}

@media(max-width:1100px){
  .dks-account-grid{grid-template-columns:230px minmax(0,1fr);gap:1.3rem}
}
@media(max-width:900px){
  .dks-account-grid{grid-template-columns:1fr;gap:1.1rem}
  .dks-acct-nav{position:static}
  .dks-acct-welcome{padding:1.2rem}
  .woocommerce-MyAccount-content>form,
  .woocommerce-MyAccount-content>.woocommerce-Addresses>div{padding:1.2rem}
  .woocommerce-MyAccount-content .woocommerce-Addresses{grid-template-columns:1fr}
  /* the line-item cell's min-content (thumb + name + qty) overflows a 390px table */
  .woocommerce-MyAccount-content .woocommerce-order-details table.shop_table{table-layout:fixed}
  .woocommerce-MyAccount-content .dks-ty-item{gap:.6rem}
  .woocommerce-MyAccount-content .dks-ty-thumb{width:44px;height:44px}
  .woocommerce-MyAccount-content .dks-ty-name{font-size:.9rem;overflow-wrap:anywhere}
  .woocommerce-MyAccount-content .wc-item-meta{margin-left:0}
  .woocommerce-MyAccount-content .woocommerce-order-details table.shop_table td,
  .woocommerce-MyAccount-content .woocommerce-order-details table.shop_table th{font-size:.88rem}
}
@media(max-width:820px){
  .dks-login{grid-template-columns:1fr}
  .dks-login-brand{display:none}
  .dks-login-logo--mobile{display:block}
  .dks-login-panel{min-height:100vh;min-height:100dvh}
}

/* ---------------- mobile polish: footer, hero, cart, order summary ---------------- */
@media(max-width:768px){
  /* footer: everything centred, roomier bottom, larger brand mark */
  .dks-footer-grid{grid-template-columns:1fr;gap:2rem;padding:2.6rem 22px 2.2rem;text-align:center}
  .dks-fcol{display:flex;flex-direction:column;align-items:center}
  .dks-fbrand{display:flex;justify-content:center;margin-bottom:1rem}
  .dks-fbrand img,.dks-fbrand svg{height:56px;width:auto;max-height:56px}
  .dks-fbrand .dks-logo-img{height:56px!important}
  .dks-fabout p{max-width:42ch;margin:0 auto}
  .dks-fsocial{justify-content:center;margin-top:1.1rem}
  .dks-footer-grid>.dks-fcol:not(.dks-fabout){border-top:1px solid rgba(255,255,255,.08);padding-top:1.4rem}
  .dks-footer-grid .dks-fcol ul{width:100%}
  .dks-footer-grid .dks-fcol li{justify-content:center;text-align:center}
  /* contact rows: icon sits inline with the label, and the address centres as a block
     instead of hanging off the icon's first line */
  .dks-fcontact li{display:flex;align-items:center;justify-content:center;gap:.5rem;text-align:center;margin-bottom:.85rem}
  .dks-fcontact li .bi{margin-top:0;flex:0 0 auto;font-size:1rem}
  .dks-fcontact li:first-child{align-items:flex-start;max-width:32ch;margin-inline:auto}
  .dks-fcontact li:first-child .bi{margin-top:.2rem}

  /* payment strip: the label and the five icons are siblings, so wrap rather than
     column — column would stack each icon on its own line */
  .dks-fpay{flex-wrap:wrap;justify-content:center;gap:.5rem .7rem;padding:1.4rem 22px;text-align:center}
  .dks-fpay>span{flex:0 0 100%}
  .dks-fpay .bi{font-size:1.5rem}

  /* legal bar: stacked and centred, with breathing room at the very bottom */
  .dks-fbar-in{flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.8rem;padding:1.2rem 22px 1.8rem}
  .dks-fbar-links{justify-content:center;gap:1rem;row-gap:.5rem}

  /* hero: one column, copy first, CTAs full width. min-width:0 stops the grid child
     from being sized by its content and pushing the buttons off-screen. */
  .dks-hero-in{grid-template-columns:minmax(0,1fr);gap:2rem;padding:2.6rem 22px 2.8rem;text-align:center;justify-items:center}
  .dks-hero-copy{min-width:0;display:flex;flex-direction:column;align-items:center}
  .dks-hero-copy h1{font-size:clamp(1.9rem,8vw,2.5rem);overflow-wrap:anywhere}
  .dks-hero-copy>p{font-size:1rem;margin-bottom:1.4rem;max-width:44ch}
  .dks-hero-cta{display:flex;flex-direction:column;align-items:stretch;gap:.7rem;width:100%}
  .dks-hero-cta>a{width:100%;max-width:100%;box-sizing:border-box;justify-content:center;white-space:normal}
  .dks-hero-media{order:2;justify-content:center;min-width:0}
  .dks-hero-media img{max-width:100%;height:auto}
  .dks-hero-badges{justify-content:center}
  /* "Tóner automático incluido" wraps onto its own row and unbalances the hero */
  .dks-hero-trust li:nth-child(3){display:none}

  /* checkout: one field per row — no 47% halves on a phone */
  form.checkout .form-row-first,
  form.checkout .form-row-last,
  form.checkout .form-row{width:100%!important;float:none!important;margin-left:0;margin-right:0}

  /* order summary reads like the other cards on the page */
  #order_review{border-radius:var(--r);box-shadow:var(--sh);padding:1.2rem 1.1rem}

  /* The separate blue band can never blend into the hero slide: the hero paints two radial
     highlights over its linear gradient, so its bottom edge is a different colour at each x.
     Hide the band on phones and use the two figures that live inside the hero slide instead. */
  .dks-stats{display:none}
  /* order:3 — .dks-hero-media is order:2, so without this the figures land above the photo */
  .dks-hero-figs{order:3;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;
    width:100%;margin-top:.4rem;padding-top:1.6rem;border-top:1px solid rgba(255,255,255,.12)}
  .dks-hero-figs .dks-stat{background:none;border:0;border-radius:0;padding:.2rem;text-align:center}

  /* "Por qué nosotros" keeps all four figures, as 2×2 tiles. No aspect-ratio — a forced
     square left a hollow middle; a min-height on the label keeps the numbers aligned. */
  .dks-why-stats-in{grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;padding:1.8rem 22px}
  .dks-why-stat{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
    padding:1.3rem .85rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.13);
    border-radius:var(--r);text-align:center}
  .dks-stat b,.dks-why-stat b,.dks-why-stat strong{font-size:1.9rem;line-height:1;letter-spacing:-.02em}
  .dks-stat span,.dks-why-stat span{margin-top:.45rem;font-size:.78rem;line-height:1.35;color:#cdd9f0}
  .dks-why-stat span{min-height:2.7em;display:flex;align-items:flex-start;justify-content:center}
}

/* very narrow phones (≤360px): brand + 4 icons + burger don't fit on one row */
@media(max-width:360px){
  .dks-mainbar-in{padding-left:12px;padding-right:12px;gap:.15rem}
  .dks-actions .dks-ic{width:34px;height:34px}
  .dks-actions a[aria-label="WhatsApp"]{display:none}
  .dks-logo-img{height:30px!important}
}

@media(max-width:640px){
  /* cart: thumbnail + name on one row, qty and price on the next, remove pinned right */
  .dks-cart-item{grid-template-columns:64px minmax(0,1fr) auto;grid-template-areas:"thumb info remove" "thumb qty price";gap:.7rem .9rem;padding:1.1rem 0}
  .dks-ci-price{grid-area:price;justify-self:end;align-self:center;text-align:right}
  .dks-ci-per{display:block;font-size:.75rem;color:var(--muted)}
  .dks-cart-titlebar h1{font-size:1.5rem}
  .dks-cart{grid-template-columns:minmax(0,1fr);gap:0}
  .dks-cart-actions{flex-direction:column;align-items:stretch;gap:1rem;padding:1.3rem 0}
  .dks-coupon,.dks-coupon-row{width:100%}
  .dks-coupon-row{flex-direction:column;gap:.6rem}
  .dks-cart-actions .dks-coupon-row input.input-text,
  .dks-cart-actions .dks-btn-ghost{width:100%!important;min-width:0;flex:0 0 auto;height:48px}
  .dks-cart-actions .dks-btn-update{width:100%;justify-content:center;border:1.5px solid var(--line);border-radius:999px}
  /* promo code collapsed by default, like the checkout's coupon disclosure */
  .dks-coupon-toggle{display:flex;align-items:center;justify-content:space-between;gap:.75rem;width:100%;box-sizing:border-box;background:#fff;border:1px dashed #c3d3ee;border-radius:var(--r-sm);padding:.9rem 1rem;font-family:var(--font);font-size:.9rem;font-weight:700;color:var(--blue);cursor:pointer;text-align:left}
  .dks-coupon-toggle .bi-tag{margin-right:.35rem}
  .dks-coupon-toggle .bi-chevron-down{transition:transform .2s;color:var(--muted)}
  .dks-coupon.is-open .dks-coupon-toggle .bi-chevron-down{transform:rotate(180deg)}
  .dks-coupon-panel{display:none;padding-top:.8rem}
  .dks-coupon.is-open .dks-coupon-panel{display:block}
  .dks-cart-side{margin-top:1.4rem}
  /* back-to-shop sits below the summary, as the last thing on the page, centred */
  .dks-cart-back{order:3;justify-self:center;justify-content:center;margin-top:1.6rem}
}

/* =============================== SERVICIOS — tiers & plans ============= */
.dks-tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;align-items:stretch}
.dks-tier{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.8rem 1.6rem;display:flex;flex-direction:column}
.dks-tier--top{border-color:var(--blue);box-shadow:var(--sh-lg);transform:translateY(-6px)}
.dks-tier-badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--acc);color:#fff;font-size:.72rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:.3rem .9rem;border-radius:999px;box-shadow:0 4px 12px rgba(225,10,125,.3)}
.dks-tier-name{font-size:1.5rem;font-weight:900;letter-spacing:.06em;color:var(--blue);margin-bottom:1.1rem}
.dks-tier--top .dks-tier-name{color:var(--acc)}
.dks-tier-list{list-style:none;display:flex;flex-direction:column;gap:.65rem;margin:0 0 1.5rem;flex:1}
.dks-tier-list li{display:flex;align-items:flex-start;gap:.55rem;font-size:.9rem;color:var(--ink);line-height:1.35}
.dks-tier-list i{color:var(--green);font-size:.95rem;margin-top:.12rem;flex:0 0 auto}
.dks-tier-cta{display:block;text-align:center;background:var(--bg);color:var(--blue);border:1.5px solid var(--line);border-radius:999px;padding:.75rem 1rem;font-weight:700;font-size:.9rem;transition:.15s}
.dks-tier-cta:hover{background:var(--blue);color:#fff;border-color:var(--blue)}
.dks-tier--top .dks-tier-cta{background:var(--acc);color:#fff;border-color:var(--acc)}
.dks-tier--top .dks-tier-cta:hover{background:var(--acc-2);border-color:var(--acc-2)}
.dks-plans-sec{background:var(--bg)}
.dks-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.dks-plan{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.6rem;text-align:center;transition:.16s}
.dks-plan:hover{transform:translateY(-4px);box-shadow:var(--sh-md)}
.dks-plan-ic{width:56px;height:56px;margin:0 auto .9rem;border-radius:14px;background:linear-gradient(135deg,#1b3a7a,#12285a);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.5rem}
.dks-plan b{display:block;font-size:1.1rem;color:var(--ink);margin-bottom:.5rem}
.dks-plan p{color:var(--muted);font-size:.9rem;line-height:1.55}
.dks-plans-cta{text-align:center;margin-top:2rem}
@media(max-width:900px){
  .dks-tiers,.dks-plans{grid-template-columns:1fr}
  .dks-tier--top{transform:none}
}

/* =============================== POR QUÉ NOSOTROS ====================== */
.dks-porque .dks-svc-hero-in{max-width:820px}
.dks-why-stats{background:linear-gradient(135deg,#1b3a7a,#12285a);color:#fff}
.dks-why-stats-in{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;padding:2.2rem 22px;text-align:center}
.dks-why-stat b{display:block;font-size:2rem;font-weight:900;line-height:1;color:#fff}
.dks-why-stat span{display:block;margin-top:.35rem;font-size:.85rem;color:#c6d4ee}
.dks-why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
/* 4-card sections read tidier as a centred 2×2 than as an uneven 3+1 row */
.dks-why-grid.dks-why-grid--2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:940px;margin-inline:auto}
@media(max-width:640px){.dks-why-grid.dks-why-grid--2{grid-template-columns:1fr}}
.dks-why-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.7rem 1.5rem;transition:.16s}
.dks-why-card:hover{transform:translateY(-4px);box-shadow:var(--sh-md);border-color:#d4ddec}
.dks-why-ic{width:52px;height:52px;border-radius:13px;background:var(--sky);color:var(--blue);display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin-bottom:1rem}
.dks-why-card b{display:block;font-size:1.1rem;color:var(--ink);margin-bottom:.45rem}
.dks-why-card p{color:var(--muted);font-size:.92rem;line-height:1.55}
/* ---- Quiénes somos page (reuses .dks-svc-hero / .dks-why-* / .dks-contact) ---- */
.dks-qs-km{background:var(--bg)}
.dks-qs-prose{max-width:840px}
.dks-qs-prose .dks-sec-eyebrow{display:block}
.dks-qs-prose h2{margin:.15rem 0 1rem}
.dks-qs-prose p{color:var(--muted);line-height:1.72;font-size:1.05rem;margin:0 0 1.1rem}
.dks-qs-prose p:last-child{margin-bottom:0}
.dks-qs-note{max-width:900px;margin:2.2rem auto 0;text-align:center;color:var(--muted);line-height:1.7}

.dks-why-net{background:var(--bg)}
.dks-why-net-in{display:grid;grid-template-columns:1.4fr 1fr;gap:2.5rem;align-items:center}
.dks-why-net-tx h2{margin:.3rem 0 .8rem}
.dks-why-net-tx p{color:var(--muted);line-height:1.65;margin-bottom:1.4rem}
.dks-why-net-badges{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.dks-why-net-badges span{display:flex;align-items:center;gap:.5rem;background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);padding:.85rem 1rem;font-weight:700;font-size:.92rem;color:var(--ink);box-shadow:var(--sh)}
.dks-why-net-badges i{color:var(--green)}
.dks-why-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;counter-reset:step}
.dks-why-step{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.5rem 1.3rem;text-align:center}
.dks-why-step-n{position:absolute;top:-14px;left:50%;transform:translateX(-50%);width:30px;height:30px;border-radius:999px;background:var(--acc);color:#fff;font-weight:800;font-size:.9rem;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(225,10,125,.3)}
.dks-why-step-ic{width:52px;height:52px;margin:.6rem auto .9rem;border-radius:14px;background:linear-gradient(135deg,#1b3a7a,#12285a);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.35rem}
.dks-why-step b{display:block;font-size:1rem;color:var(--ink);margin-bottom:.4rem}
.dks-why-step p{color:var(--muted);font-size:.85rem;line-height:1.5}
@media(max-width:960px){.dks-why-grid,.dks-why-steps{grid-template-columns:1fr 1fr}.dks-why-net-in{grid-template-columns:1fr;gap:1.6rem}}
@media(max-width:640px){.dks-why-grid,.dks-why-steps{grid-template-columns:1fr}.dks-why-net-badges{grid-template-columns:1fr 1fr}}
/* .dks-why-stats-in shares the tile styling above (it uses .dks-why-stat, not .dks-stat) */
/* Hide WooCommerce's default ordering dropdown + result count (search results
   page shows them above our custom archive). We render our own sort tabs/count. */
.woocommerce-ordering,
.woocommerce-products-header,
body:not(.single-product) .woocommerce-result-count{display:none!important}
.dks-porque,.dks-servicios,.dks-cto,.dks-svcpage{overflow-x:clip}
/* service sub-pages (Nuestro Servicio, Click al ahorro, NETPRESS, …) */
.dks-svcpage h2{font-size:clamp(1.55rem,3vw,2.1rem);font-weight:800;letter-spacing:-.02em;color:var(--ink);margin:0 0 .5rem;line-height:1.15}
.dks-svc-split{display:grid;grid-template-columns:1.05fr .95fr;gap:2.6rem;align-items:center}
.dks-svc-split-tx h2{margin:.3rem 0 .8rem}
.dks-svc-split-tx p{color:var(--muted);line-height:1.65;margin:0}
.dks-svc-split-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.75rem}
.dks-svc-split-list li{display:flex;gap:.65rem;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);padding:.8rem 1rem;font-weight:600;font-size:.96rem;color:var(--ink);box-shadow:var(--sh)}
.dks-svc-split-list i{color:var(--green);margin-top:.15rem;flex:0 0 auto}
@media(max-width:900px){.dks-svc-split{grid-template-columns:1fr;gap:1.5rem}}

/* =============================== CONTACTO ============================= */
/* hero — same treatment as the services hero */
.dks-cto-hero{position:relative;overflow:hidden;color:#eaf1fc;text-align:center;background:radial-gradient(900px 520px at 85% -20%,rgba(225,10,125,.26),transparent 60%),radial-gradient(760px 520px at 8% 120%,rgba(87,140,230,.30),transparent 60%),linear-gradient(135deg,#12285a 0%,#1b3a7a 50%,#0d1c40 100%)}
.dks-cto-hero::before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 1px 1px,rgba(255,255,255,.10) 1px,transparent 0);background-size:24px 24px;opacity:.55;pointer-events:none}
.dks-cto-hero-in{position:relative;z-index:1;max-width:760px;margin:0 auto;padding:clamp(2.6rem,5.5vw,4.4rem) 22px}
.dks-cto-hero-in .dks-sec-eyebrow{display:inline-flex;align-items:center;gap:.45rem;background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.2);padding:.42rem .95rem;border-radius:999px;margin-bottom:1.2rem;text-transform:uppercase;letter-spacing:.06em}
.dks-cto-hero-in .dks-sec-eyebrow .bi{color:#ffd36b}
.dks-cto-hero h1{font-size:clamp(1.9rem,4.2vw,2.9rem);line-height:1.09;letter-spacing:-.03em;font-weight:800;color:#fff;margin:0 0 1rem}
.dks-cto-hero h1 span{background:linear-gradient(120deg,#8fbcff,#ff7bb5);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.dks-cto-hero p{font-size:1.05rem;line-height:1.62;color:#c3d3ee;max-width:60ch;margin:0 auto 1.7rem}
.dks-cto-hero .dks-hero-cta{justify-content:center}
.dks-cto-hero .dks-btn-primary{background:linear-gradient(120deg,var(--acc),var(--acc-2));box-shadow:0 12px 30px rgba(225,10,125,.42)}
/* contact channels */
.dks-cto-channels{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}
.dks-cto-card{display:flex;flex-direction:column;align-items:flex-start;gap:.25rem;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.5rem 1.4rem;text-decoration:none;transition:.16s}
a.dks-cto-card:hover{transform:translateY(-4px);box-shadow:var(--sh-md);border-color:#d4ddec}
.dks-cto-card-ic{width:50px;height:50px;border-radius:13px;background:var(--sky);color:var(--blue);display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin-bottom:.6rem;transition:.16s}
.dks-cto-card:first-child .dks-cto-card-ic{background:#e8f7ef;color:var(--green)}
a.dks-cto-card:hover .dks-cto-card-ic{background:var(--blue);color:#fff}
a.dks-cto-card:first-child:hover .dks-cto-card-ic{background:var(--green)}
.dks-cto-card-label{font-size:.76rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.dks-cto-card-value{font-size:1.05rem;color:var(--ink);font-weight:800;line-height:1.25;word-break:break-word}
.dks-cto-card-sub{font-size:.85rem;color:var(--muted);line-height:1.45;margin-top:.15rem}
/* location + map */
.dks-cto-loc{display:grid;grid-template-columns:1fr 1.1fr;gap:2.6rem;align-items:center}
.dks-cto-loc-info h2{margin:.3rem 0 1.3rem}
.dks-cto-list{list-style:none;margin:0 0 1.5rem;padding:0;display:flex;flex-direction:column;gap:1rem}
.dks-cto-list li{display:flex;gap:.9rem;align-items:flex-start}
.dks-cto-li-ic{flex:0 0 auto;width:42px;height:42px;border-radius:11px;background:var(--sky);color:var(--blue);display:flex;align-items:center;justify-content:center;font-size:1.1rem}
.dks-cto-list li>span:last-child{display:flex;flex-direction:column;gap:.12rem;color:var(--ink);font-size:.98rem;line-height:1.4;min-width:0}
.dks-cto-list b{font-size:.74rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.dks-cto-list a{color:var(--blue);font-weight:700;word-break:break-word}
.dks-cto-list a:hover{color:var(--acc)}
.dks-cto-social{display:flex;gap:.6rem;margin-bottom:1.5rem}
.dks-cto-social a{width:44px;height:44px;border-radius:50%;background:var(--sky);color:var(--blue);display:flex;align-items:center;justify-content:center;font-size:1.2rem;transition:.15s}
.dks-cto-social a:hover{background:var(--blue);color:#fff;transform:translateY(-2px)}
.dks-cto-directions{display:inline-flex;align-items:center;gap:.5rem}
.dks-cto-map{border-radius:var(--r);overflow:hidden;border:1px solid var(--line);box-shadow:var(--sh-md);min-height:360px;background:var(--bg)}
.dks-cto-map iframe{display:block;width:100%;height:100%;min-height:360px;border:0}
@media(max-width:900px){
  .dks-cto-channels{grid-template-columns:1fr 1fr}
  .dks-cto-loc{grid-template-columns:1fr;gap:1.6rem}
  .dks-cto-map{min-height:280px}
  .dks-cto-map iframe{min-height:280px}
}
@media(max-width:560px){
  .dks-cto-channels{grid-template-columns:1fr}
  .dks-cto-hero .dks-hero-cta{flex-direction:column;align-items:stretch}
}

/* =============================== MPS PAGE (contracts · compare · steps · faq) */
.dks-mps-ct-sec{background:var(--bg)}
.dks-mps-cts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem;align-items:stretch}
.dks-mps-ct{position:relative;min-width:0;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.9rem 1.6rem 1.6rem;display:flex;flex-direction:column}
.dks-mps-ct--top{border-color:var(--acc);box-shadow:var(--sh-lg)}
.dks-mps-ct-name{font-size:1.35rem;font-weight:900;letter-spacing:.02em;color:var(--blue)}
.dks-mps-ct--top .dks-mps-ct-name{color:var(--acc)}
.dks-mps-ct-tag{display:inline-block;align-self:flex-start;margin:.55rem 0 .9rem;background:var(--sky);color:var(--blue);border-radius:999px;padding:.32rem .8rem;font-size:.76rem;font-weight:700;letter-spacing:.02em}
.dks-mps-ct--top .dks-mps-ct-tag{background:#fdeaf4;color:var(--acc-2)}
.dks-mps-ct-tx{color:var(--muted);font-size:.94rem;line-height:1.6;margin:0 0 1.2rem}
.dks-mps-ct-adv{display:flex;gap:.6rem;align-items:flex-start;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-sm);padding:.8rem .95rem;margin:0 0 1.3rem;font-size:.88rem;line-height:1.5;color:var(--ink)}
.dks-mps-ct-adv i{color:var(--gold);margin-top:.12rem;flex:0 0 auto}
.dks-mps-extras{margin-top:1.6rem;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.5rem 1.6rem}
.dks-mps-extras > b{display:block;font-size:1.05rem;color:var(--ink);margin-bottom:1rem}
.dks-mps-extras ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem 1.4rem}
.dks-mps-extras li{display:flex;gap:.55rem;align-items:flex-start;min-width:0;font-size:.9rem;color:var(--muted);line-height:1.45}
.dks-mps-extras i{color:var(--blue);margin-top:.15rem;flex:0 0 auto}

/* "gestión tradicional vs MPS" — namespaced apart from the /comparar/ comparador,
   which owns the .dks-cmp-* family. */
.dks-vs{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);background:#fff}
.dks-vs-row{display:grid;grid-template-columns:1fr 1.35fr 1.35fr;gap:1.2rem;padding:1.05rem 1.4rem;border-top:1px solid var(--line)}
.dks-vs-row:first-child{border-top:0}
.dks-vs-head{background:var(--blue);color:#fff;font-weight:700;font-size:.9rem;letter-spacing:.01em}
.dks-vs-head span:last-child{color:#ffd0e7}
.dks-vs-row > span{min-width:0}
.dks-vs-c{font-weight:700;color:var(--ink);font-size:.94rem}
.dks-vs-a,.dks-vs-b{display:flex;gap:.55rem;align-items:flex-start;font-size:.92rem;line-height:1.5}
.dks-vs-a{color:var(--muted)}
.dks-vs-a i{color:var(--red);margin-top:.18rem;flex:0 0 auto}
.dks-vs-b{color:var(--ink);font-weight:600}
.dks-vs-b i{color:var(--green);margin-top:.18rem;flex:0 0 auto}

.dks-mps-steps-sec{background:var(--bg)}
.dks-mps-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem}
.dks-mps-step{position:relative;min-width:0;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.9rem 1.6rem;transition:.16s}
.dks-mps-step:hover{transform:translateY(-4px);box-shadow:var(--sh-md)}
.dks-mps-step-num{position:absolute;top:1.1rem;right:1.3rem;font-size:2.1rem;font-weight:900;color:var(--line);line-height:1}
.dks-mps-step-ic{width:52px;height:52px;margin-bottom:1rem;border-radius:14px;background:linear-gradient(135deg,var(--acc),var(--acc-2));color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.35rem}
.dks-mps-step b{display:block;font-size:1.1rem;color:var(--ink);margin-bottom:.5rem}
.dks-mps-step p{color:var(--muted);font-size:.92rem;line-height:1.6;margin:0}

.dks-faq{max-width:860px;margin:0 auto;display:flex;flex-direction:column;gap:.75rem}
.dks-faq-item{background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);box-shadow:var(--sh);overflow:hidden}
.dks-faq-item summary{display:flex;justify-content:space-between;align-items:center;gap:1rem;cursor:pointer;list-style:none;padding:1.05rem 1.3rem;font-weight:700;font-size:.98rem;color:var(--ink)}
.dks-faq-item summary::-webkit-details-marker{display:none}
.dks-faq-item summary i{color:var(--blue);transition:transform .18s;flex:0 0 auto}
.dks-faq-item[open] summary{color:var(--blue)}
.dks-faq-item[open] summary i{transform:rotate(180deg)}
.dks-faq-item p{margin:0;padding:0 1.3rem 1.2rem;color:var(--muted);font-size:.93rem;line-height:1.65}

@media(max-width:900px){
  .dks-mps-cts,.dks-mps-steps{grid-template-columns:minmax(0,1fr)}
  .dks-mps-extras ul{grid-template-columns:minmax(0,1fr)}
  .dks-vs-head{display:none}
  .dks-vs{border:0;box-shadow:none;background:transparent;display:flex;flex-direction:column;gap:1rem}
  .dks-vs-row{grid-template-columns:minmax(0,1fr);gap:.75rem;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.1rem 1.2rem}
  .dks-vs-a::before,.dks-vs-b::before{content:attr(data-label);position:absolute;top:0;left:0;font-size:.7rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
  .dks-vs-a,.dks-vs-b{position:relative;padding-top:1.35rem}
  .dks-vs-b::before{color:var(--acc)}
}
.dks-card-quote{font-size:.95rem;font-weight:700;color:var(--blue)}

/* =============================== MODALIDAD (alquiler / venta) =========== */
.dks-modes{display:grid;grid-template-columns:1fr 1fr;gap:.4rem;background:#eef2f8;border:1px solid var(--line);border-radius:999px;padding:.3rem;margin:0 0 1rem}
.dks-mode{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;border:0;background:none;border-radius:999px;padding:.6rem 1rem;font-family:var(--font);font-size:.92rem;font-weight:700;color:var(--muted);cursor:pointer;transition:.18s}
.dks-mode:hover{color:var(--ink)}
.dks-mode.on{background:var(--acc);color:#fff;box-shadow:0 6px 16px rgba(225,10,125,.28)}
.dks-mode[data-mode="venta"].on{background:var(--blue);box-shadow:0 6px 16px rgba(27,58,122,.28)}
.dks-mode.on .bi{color:#fff}
.dks-mode.on:hover{color:#fff}
.dks-pane[hidden]{display:none}
.dks-sale-perks{margin-top:.2rem}
.dks-quote{font-weight:700;color:var(--blue)}
.dks-cart-form .single_add_to_cart_button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;width:100%}

/* info affordances that open the MPS modal */
.dks-mps-i{display:inline-flex;align-items:center;gap:.35rem;border:0;background:none;padding:0;margin-left:.35rem;color:var(--blue);font-size:1rem;cursor:pointer;vertical-align:middle;font-family:var(--font)}
.dks-mps-i:hover{color:var(--acc)}
.dks-mps-i span{font-size:.85rem;font-weight:700}
.dks-linkbtn{border:0;background:none;padding:0;color:var(--blue);font-family:var(--font);font-size:inherit;font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.dks-linkbtn:hover{color:var(--acc)}

/* =============================== MODAL ================================= */
.dks-modal{position:fixed;inset:0;z-index:600;display:flex;align-items:center;justify-content:center;padding:1.2rem}
.dks-modal[hidden]{display:none}
.dks-modal-scrim{position:absolute;inset:0;background:rgba(8,16,34,.62);backdrop-filter:blur(3px)}
/* box-sizing: sin él el padding se suma al max-height y el panel acaba siendo más alto que
   la pantalla; al ir centrado se cortaba por arriba (se comía la X de cerrar). */
.dks-modal-box{position:relative;z-index:1;box-sizing:border-box;background:#fff;border-radius:var(--r);box-shadow:var(--sh-lg);width:min(860px,100%);max-height:min(90vh,90svh);overflow-y:auto;-webkit-overflow-scrolling:touch;padding:1.9rem 2.1rem 1.7rem;scrollbar-width:none}
.dks-modal-box::-webkit-scrollbar{width:0}
.dks-modal-x{position:absolute;top:.9rem;right:1rem;border:0;background:none;font-size:1.05rem;color:var(--muted);cursor:pointer;line-height:1}
.dks-modal-x:hover{color:var(--ink)}
.dks-modal-eyebrow{display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--blue)}
.dks-modal-box h2{font-size:1.55rem;font-weight:800;letter-spacing:-.02em;color:var(--ink);margin:.5rem 0 .6rem}
.dks-modal-sub{color:var(--muted);font-size:.95rem;line-height:1.6;margin:0 0 1.3rem}
.dks-modal-list{list-style:none;margin:0;padding:0;display:grid;gap:.85rem}
@media(min-width:720px){.dks-modal-list{grid-template-columns:1fr 1fr;gap:.9rem 1.4rem}}
.dks-modal-list li{display:flex;gap:.85rem;align-items:center}
.dks-modal-ic{flex:0 0 auto;width:38px;height:38px;border-radius:10px;background:#eaf1ff;color:var(--blue);display:flex;align-items:center;justify-content:center;font-size:1.05rem}
/* bootstrap-icons nudge their glyph with vertical-align:-.125em, which knocks it off
   centre inside a flex tile — neutralise it and let flex do the centring */
.dks-modal-ic .bi{display:flex;align-items:center;justify-content:center;width:100%;height:100%;line-height:1}
.dks-modal-ic .bi::before{display:block;line-height:1;vertical-align:0}
.dks-modal-list b{display:block;font-size:.95rem;color:var(--ink);margin-bottom:.15rem}
.dks-modal-list span{display:block;color:var(--muted);font-size:.9rem;line-height:1.55}
.dks-modal-cta{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.6rem;padding-top:1.3rem;border-top:1px solid var(--line)}
@media(max-width:640px){
  /* phones: the modal is the screen */
  .dks-modal{padding:0}
  .dks-modal-box{width:100%;height:100dvh;max-height:100dvh;border-radius:0;padding:1.5rem 1.2rem 1.4rem}
  .dks-modal-box h2{font-size:1.3rem}
  .dks-modal-cta .dks-btn-primary,.dks-modal-cta .dks-btn-line{width:100%;justify-content:center}
}

/* Modal de modalidades mezcladas: más estrecho que el de MPS, es sólo una decisión. */
.dks-mixbox{width:min(460px,100%);text-align:left}
.dks-mixbox .dks-modal-eyebrow{color:var(--gold)}
.dks-mixbox h2{font-size:1.25rem;margin:.55rem 0 .5rem}
.dks-mixbox h2 [data-mix-actual]{color:var(--acc);text-transform:capitalize}
.dks-mixbox .dks-modal-sub{margin-bottom:0;font-size:.92rem}
.dks-mixbox .dks-modal-cta{margin-top:1.3rem;padding-top:1.1rem}
.dks-mixbox .dks-btn-primary,.dks-mixbox .dks-btn-line{flex:1 1 auto;justify-content:center}
@media(max-width:640px){
  /* aquí no queremos pantalla completa: es un diálogo corto */
  .dks-mixmodal{padding:1.1rem}
  .dks-mixmodal .dks-modal-box{height:auto;max-height:86dvh;border-radius:var(--r)}
}

/* =============================== CART DRAWER =========================== */
.dks-drawer{position:fixed;inset:0;z-index:700}
.dks-drawer[hidden]{display:none}
.dks-drawer-scrim{position:absolute;inset:0;background:rgba(8,16,34,.5);opacity:0;transition:opacity .25s}
.dks-drawer.on .dks-drawer-scrim{opacity:1}
.dks-drawer-box{position:absolute;top:0;right:0;bottom:0;width:min(420px,100%);background:var(--card,#fbfcfe);box-shadow:var(--sh-lg);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .26s cubic-bezier(.32,.72,0,1)}
.dks-drawer.on .dks-drawer-box{transform:none}
.dks-drawer-busy{opacity:.55;pointer-events:none;transition:opacity .15s}
.dks-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:1.1rem 1.3rem;background:#fff;border-bottom:1px solid var(--line)}
.dks-drawer-head b{display:inline-flex;align-items:center;gap:.55rem;font-size:1.02rem;font-weight:800;color:var(--ink)}
.dks-drawer-head .bi{color:var(--blue)}
.dks-drawer-x{border:0;background:none;font-size:1.05rem;color:var(--muted);cursor:pointer;line-height:1}
.dks-drawer-x:hover{color:var(--ink)}
.dks-drawer-err{margin:.9rem 1.3rem 0;background:#fdecef;border:1px solid #f6c9d4;border-radius:var(--r-sm);padding:.7rem .85rem;color:#a3103c;font-size:.86rem;line-height:1.5}
.dks-drawer-err a{color:#a3103c;font-weight:700;text-decoration:underline}
.dks-drawer-body{flex:1;display:flex;flex-direction:column;min-height:0;overflow-y:auto;scrollbar-width:none}
.dks-drawer-body::-webkit-scrollbar{width:0}
.dks-drawer-mode{display:flex;align-items:center;gap:.5rem;margin:1rem 1.3rem .2rem;background:#eaf1ff;color:var(--blue);border-radius:999px;padding:.5rem .9rem;font-size:.82rem;font-weight:800}

.dks-drawer-items{list-style:none;margin:0;padding:.9rem 1.3rem;display:grid;gap:.8rem}
.dks-ditem{position:relative;display:grid;grid-template-columns:64px 1fr;gap:.85rem;background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);padding:.8rem;box-shadow:var(--sh)}
.dks-ditem-img img{width:64px;height:64px;object-fit:contain;border-radius:8px;background:#f3f6fb}

/* stand-in for a line that has no photo (the consumables request) — an icon, never the
   grey WooCommerce placeholder, which just looks like the image failed to load */
.dks-thumb-ic{box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:100%;height:100%;border-radius:var(--r-sm);background:var(--sky);color:var(--blue);font-size:1.25rem}
.dks-ditem-img .dks-thumb-ic{width:64px;height:64px;border-radius:8px}
.dks-ci-thumb .dks-thumb-ic{width:88px;height:88px;border:1px solid var(--line);font-size:1.6rem}
.dks-cmp-img .dks-thumb-ic{width:110px;height:110px;margin:0 auto;font-size:1.8rem}
@media(max-width:640px){
  .dks-ci-thumb .dks-thumb-ic{width:64px;height:64px;font-size:1.3rem}
  .dks-cmp-img .dks-thumb-ic{width:74px;height:74px;font-size:1.4rem}
}
.dks-ditem-in{min-width:0;display:flex;flex-direction:column;gap:.25rem}
.dks-ditem-name{font-weight:800;font-size:.92rem;color:var(--ink);line-height:1.3;padding-right:1.2rem}
.dks-ditem-name:hover{color:var(--blue)}
.dks-ditem-meta{font-size:.78rem;color:var(--muted)}
.dks-ditem-foot{display:flex;align-items:center;justify-content:space-between;margin-top:.35rem}
.dks-qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.dks-qty button{border:0;background:none;width:26px;height:26px;font-size:.95rem;color:var(--muted);cursor:pointer;line-height:1}
.dks-qty button:hover{background:#eef2f8;color:var(--ink)}
.dks-qty span{min-width:22px;text-align:center;font-size:.85rem;font-weight:700;color:var(--ink)}
.dks-ditem-price{font-size:.95rem;color:var(--ink)}
.dks-ditem-price small{color:var(--muted);font-size:.78rem;margin-left:.1rem}
.dks-ditem-x{position:absolute;top:.55rem;right:.6rem;border:0;background:none;color:#c3ccda;font-size:.82rem;cursor:pointer}
.dks-ditem-x:hover{color:var(--acc)}

.dks-drawer-foot{margin-top:auto;background:#fff;border-top:1px solid var(--line);padding:1.1rem 1.3rem 1.3rem}
.dks-drawer-total{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:.35rem}
.dks-drawer-total span{font-size:.9rem;font-weight:700;color:var(--muted)}
.dks-drawer-total b{font-size:1.3rem;font-weight:800;color:var(--ink)}
.dks-drawer-total small{font-size:.82rem;font-weight:600;color:var(--muted)}
.dks-drawer-note{font-size:.78rem;color:var(--muted);line-height:1.5;margin:0 0 .9rem}
.dks-drawer-foot .dks-btn-primary{display:flex;width:100%;box-sizing:border-box;justify-content:center;text-align:center;padding-left:.9rem;padding-right:.9rem;font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dks-drawer-link{display:block;text-align:center;margin-top:.7rem;font-size:.85rem;font-weight:700;color:var(--blue)}
.dks-drawer-link:hover{text-decoration:underline}

.dks-drawer-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.55rem;padding:2.5rem 1.5rem}
.dks-drawer-empty-ic{width:62px;height:62px;border-radius:50%;background:#eaf1ff;color:var(--blue);display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:.3rem}
.dks-drawer-empty b{font-size:1.05rem;color:var(--ink)}
.dks-drawer-empty p{color:var(--muted);font-size:.9rem;line-height:1.55;margin:0 0 .7rem;max-width:26ch}
@media(max-width:480px){.dks-drawer-box{width:100%}}

/* ---- modality pills on the shop cards: pink rents, blue sells ---------- */
.dks-card-modes{display:flex;flex-wrap:wrap;gap:.35rem;margin:.1rem 0 .55rem}
.dks-pill{display:inline-flex;align-items:center;gap:.3rem;border-radius:999px;padding:.24rem .6rem;font-size:.73rem;font-weight:800;letter-spacing:.01em;line-height:1.35}
.dks-pill .bi{font-size:.78rem}
.dks-pill--rent{background:#fdeaf4;color:var(--acc);border:1px solid #f8cfe4}
.dks-pill--sale{background:var(--sky);color:var(--blue);border:1px solid #cfe0f7}

/* =============================== PAY SCREEN ============================ */
.dks-bs{display:inline-flex;flex-direction:column;align-items:flex-start;gap:.05rem;margin:.3rem 0 0;padding:.3rem .55rem;background:#f1f5fa;border:1px solid var(--line);border-radius:8px;color:var(--ink);font-size:.82rem;font-weight:800;line-height:1.25;white-space:nowrap}
.dks-bs small{font-size:.64rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.dks-drawer-total .dks-bs,.dks-sum-total .dks-bs{align-items:flex-end}
.dks-ditem-price .dks-bs{padding:.2rem .4rem;font-size:.76rem}
.dks-pay-hint{color:var(--muted);font-size:.9rem;line-height:1.55;margin:0}

.dks-transfer{margin:.2rem 0 .4rem}
.dks-transfer-amount{background:linear-gradient(135deg,var(--blue),var(--blue-2));color:#fff;border-radius:var(--r);padding:1.2rem 1.4rem;margin-bottom:1.3rem}
.dks-transfer-lbl{display:block;font-size:.78rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;opacity:.75}
.dks-transfer-amount b{display:block;font-size:1.85rem;font-weight:800;letter-spacing:-.02em;margin:.15rem 0 .2rem}
.dks-transfer-amount small{display:block;font-size:.82rem;opacity:.8}
.dks-transfer-amount small .amount,.dks-transfer-amount small bdi{color:#fff}

.dks-transfer-step{display:flex;align-items:flex-start;gap:.7rem;margin:1.4rem 0 .8rem}
/* white disc, mode-coloured digit, dead-centred (line-height:26px fought the flex centring
   and pushed the number off the middle) */
.dks-step-n,.dks-transfer-step .dks-step-n{box-sizing:border-box;flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:#fff;border:1.5px solid var(--m-line);color:var(--m);display:inline-flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:800;line-height:1;text-align:center;font-family:var(--font)}
.dks-transfer-step b{display:block;font-size:.98rem;color:var(--ink)}
.dks-transfer-step span{display:block;color:var(--muted);font-size:.86rem;line-height:1.5}

/* ---- order summary on the pay screen ---------------------------------- */
.dks-pay-summary{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.3rem 1.4rem;margin-bottom:1.4rem}
.dks-pay-h{display:flex;align-items:center;justify-content:space-between;gap:.6rem;font-size:1.05rem;font-weight:800;color:var(--ink);margin:0 0 1rem}
.dks-pay-order{font-size:.82rem;font-weight:800;color:var(--m);background:var(--m-soft);border:1px solid var(--m-line);border-radius:999px;padding:.22rem .6rem}
.dks-pay-items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.dks-pay-item{display:grid;grid-template-columns:60px minmax(0,1fr) auto;gap:.9rem;align-items:center;padding:.9rem 0;border-bottom:1px solid var(--line)}
.dks-pay-thumb{position:relative;width:60px;height:60px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg);display:flex;align-items:center;justify-content:center}
.dks-pay-thumb img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;border-radius:var(--r-sm)}
.dks-pay-qty{position:absolute;top:-8px;right:-8px;min-width:22px;height:22px;padding:0 5px;box-sizing:border-box;border-radius:999px;background:var(--m);color:#fff;border:2px solid #fff;font-size:.72rem;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(var(--m-sh),.35)}
.dks-pay-tx{min-width:0;display:flex;flex-direction:column;gap:.1rem}
.dks-pay-name{font-size:.98rem;font-weight:700;color:var(--ink);line-height:1.3}
.dks-pay-line{font-size:1rem;font-weight:800;color:var(--ink);white-space:nowrap;text-align:right}
.dks-pay-totals{margin:1rem 0 0;padding:0}
.dks-pay-trow{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:.4rem 0;font-size:.94rem;color:var(--muted)}
.dks-pay-trow dt{margin:0;font-weight:600}
.dks-pay-trow dd{margin:0;font-weight:700;color:var(--ink);text-align:right}
.dks-pay-trow--total{border-top:1px solid var(--line);margin-top:.4rem;padding-top:.8rem;font-size:1.1rem}
.dks-pay-trow--total dt{font-weight:800;color:var(--ink)}
.dks-pay-trow--total dd{display:flex;flex-direction:column;align-items:flex-end;gap:.25rem;font-size:1.25rem;font-weight:800;color:var(--m)}

/* ---- pick a currency, then an account --------------------------------- */
.dks-curtabs{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:.55rem;margin-bottom:.9rem}
.dks-curtab{display:flex;flex-direction:column;align-items:flex-start;gap:.1rem;background:#fff;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:.7rem .85rem;font-family:var(--font);cursor:pointer;transition:.16s;text-align:left}
.dks-curtab:hover{border-color:#b9c6dc}
.dks-curtab.on{border-color:var(--m);background:var(--m-soft);box-shadow:0 0 0 3px rgba(var(--m-sh),.12)}
.dks-curtab-n{font-size:.78rem;font-weight:700;color:var(--muted)}
.dks-curtab.on .dks-curtab-n{color:var(--m)}
.dks-curtab-a{font-size:1rem;font-weight:800;color:var(--ink);line-height:1.25}
.dks-curtab-s{font-size:.7rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--muted)}

.dks-accts{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:.7rem}
/* The panel lives inside `#payment ul.payment_methods li`, whose `label` rule carries an
   id and so outranks any class selector here — including the [hidden] one. Hence the
   !important: without it, the currency tabs filter nothing and all seven accounts show. */
.dks-transfer .dks-acct{display:block!important;position:relative;cursor:pointer;font-weight:400!important;font-size:1rem!important;color:var(--ink)!important;margin:0!important}
.dks-transfer .dks-acct[hidden]{display:none!important}
.dks-acct input{position:absolute;opacity:0;pointer-events:none}
/* border-box or the padding is added to height:100% and the card overflows its grid row,
   dropping onto the step below it */
.dks-acct-in{box-sizing:border-box;display:block;background:#fff;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:.85rem .95rem;transition:.16s;height:100%}
.dks-acct:hover .dks-acct-in{border-color:#b9c6dc;box-shadow:var(--sh)}
.dks-acct.on .dks-acct-in{border-color:var(--m);box-shadow:0 0 0 3px rgba(var(--m-sh),.14)}
.dks-acct-top{display:flex;align-items:center;justify-content:space-between;gap:.4rem}
.dks-acct-bank{font-size:.95rem;font-weight:800;color:var(--ink)}
.dks-acct-tick{color:var(--m);font-size:1.05rem;opacity:0;transition:.16s}
.dks-acct.on .dks-acct-tick{opacity:1}
/* the account number is meant to be read digit by digit and typed into a banking app */
.dks-acct-num{display:block;margin:.45rem 0 .5rem;font-size:.95rem;font-weight:700;color:var(--ink);letter-spacing:.02em;font-variant-numeric:tabular-nums}
.dks-acct-foot{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.dks-acct-rif{color:var(--muted);font-size:.76rem;font-weight:600}
.dks-copy{display:inline-flex;align-items:center;gap:.3rem;border:1px solid var(--line);background:#fff;border-radius:999px;padding:.32rem .7rem;color:var(--m);font-family:var(--font);font-size:.76rem;font-weight:700;cursor:pointer;transition:.15s}
.dks-copy:hover{background:var(--m-soft);border-color:var(--m-line)}
.dks-copy.ok{color:#1b7a45;border-color:#bfe6cf;background:#eefbf3}

.dks-transfer-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}
.dks-transfer-grid .form-row-wide{grid-column:1 / -1}
.dks-transfer-grid label{display:block;font-size:.85rem;font-weight:700;color:var(--ink);margin-bottom:.35rem}
.dks-transfer-grid .input-text{width:100%;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:.7rem .85rem;font-family:var(--font);font-size:.92rem;background:#fff}
.dks-transfer-grid .input-text:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 3px rgba(27,58,122,.1)}
/* ---- date picker (ours, not the browser's) ----------------------------- */
.dks-date{position:relative}
.dks-date-field{display:flex;align-items:center;gap:.55rem;width:100%;box-sizing:border-box;background:#fff;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:.7rem .85rem;font-family:var(--font);font-size:.92rem;font-weight:600;color:var(--muted);cursor:pointer;transition:.15s;text-align:left}
.dks-date-field:hover{border-color:#b9c6dc}
.dks-date-field[aria-expanded="true"]{border-color:var(--m);box-shadow:0 0 0 3px rgba(var(--m-sh),.12)}
.dks-date-field .bi-calendar3{color:var(--m);font-size:1rem}
.dks-date-caret{margin-left:auto;color:var(--muted);font-size:.8rem;transition:.2s}
.dks-date-field[aria-expanded="true"] .dks-date-caret{transform:rotate(180deg)}
.dks-date.has-value .dks-date-field{color:var(--ink);font-weight:700}
.dks-cal{box-sizing:border-box;position:absolute;z-index:60;top:calc(100% + .4rem);left:0;width:min(300px,calc(100vw - 44px));background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-lg);padding:.8rem}
.dks-cal[hidden]{display:none}
.dks-cal-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.6rem}
.dks-cal-head b{font-size:.92rem;font-weight:800;color:var(--ink);text-transform:capitalize}
.dks-cal-nav{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);background:#fff;border-radius:8px;color:var(--ink);cursor:pointer;transition:.15s}
.dks-cal-nav:hover:not(:disabled){background:var(--m-soft);border-color:var(--m-line);color:var(--m)}
.dks-cal-nav:disabled{opacity:.35;cursor:not-allowed}
.dks-cal-dow,.dks-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.dks-cal-dow span{text-align:center;font-size:.7rem;font-weight:800;color:var(--muted);padding:.25rem 0}
/* 40px tall cells — a thumb has to be able to hit these */
.dks-cal-d{height:40px;display:flex;align-items:center;justify-content:center;border:0;background:none;border-radius:8px;font-family:var(--font);font-size:.86rem;font-weight:600;color:var(--ink);cursor:pointer;transition:.12s}
.dks-cal-d:hover:not(:disabled){background:var(--bg)}
.dks-cal-d:disabled{color:#c3ccda;cursor:not-allowed}
.dks-cal-d.now{box-shadow:inset 0 0 0 1.5px var(--m-line);color:var(--m);font-weight:800}
.dks-cal-d.on{background:var(--m);color:#fff;font-weight:800;box-shadow:none}
.dks-cal-foot{display:flex;gap:.4rem;margin-top:.6rem;padding-top:.6rem;border-top:1px solid var(--line)}
.dks-cal-quick{flex:1;border:1px solid var(--line);background:#fff;border-radius:999px;padding:.4rem .6rem;font-family:var(--font);font-size:.8rem;font-weight:700;color:var(--ink);cursor:pointer;transition:.15s}
.dks-cal-quick:hover{background:var(--m-soft);border-color:var(--m-line);color:var(--m)}

#dks_proof{position:absolute;opacity:0;width:0;height:0}
.dks-drop{display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;text-align:center;border:1.5px dashed #c3ccda;border-radius:var(--r-sm);background:#f7f9fc;padding:1.4rem 1rem;cursor:pointer;transition:.16s}
.dks-drop:hover{border-color:var(--acc);background:#fdf4f9}
.dks-drop .bi{font-size:1.5rem;color:var(--blue);margin-bottom:.2rem}
.dks-drop b{font-size:.9rem;color:var(--ink);font-weight:700}
.dks-drop span{font-size:.78rem;color:var(--muted);font-weight:600}
@media(max-width:640px){
  .dks-transfer-grid{grid-template-columns:1fr}
  .dks-accts{grid-template-columns:1fr}
  /* three currencies would be 3 cramped columns; stack the amount under the name instead */
  .dks-curtabs{grid-template-columns:1fr 1fr}
  .dks-pay-summary{padding:1.1rem 1rem}
  .dks-pay-item{grid-template-columns:52px minmax(0,1fr);grid-template-areas:"thumb tx" "line line";row-gap:.6rem}
  .dks-pay-thumb{grid-area:thumb;width:52px;height:52px}
  .dks-pay-tx{grid-area:tx}
  .dks-pay-line{grid-area:line;text-align:right}
  /* the field can be narrower than the popover, so anchor left and cap the width to the
     viewport — right:0 would push the calendar off the left edge of the screen */
  .dks-cal{left:0;right:auto;width:min(300px,calc(100vw - 40px))}
  /* the panel sits inside li > .payment_box > .form-row, whose paddings stack up and left
     it 228px wide on a 390px phone. Flatten them: the transfer panel IS the payment box. */
  .woocommerce-checkout #payment ul.payment_methods li,#payment ul.payment_methods li{padding:.75rem .8rem}
  .woocommerce-checkout #payment div.payment_box,#payment div.payment_box{padding:.7rem 0 .2rem;background:transparent!important;background-color:transparent!important}
  .dks-transfer .form-row{padding-left:0!important;padding-right:0!important}
  .dks-transfer-amount{padding:1rem 1.1rem}
  .dks-transfer-amount b{font-size:1.5rem;overflow-wrap:anywhere}
}
.dks-drawer-links{display:flex;align-items:center;justify-content:center;gap:.9rem;margin-top:.75rem}
.dks-drawer-links .dks-drawer-link{margin-top:0}
.dks-drawer-empty-btn{border:0;background:none;font-family:var(--font);font-size:.85rem;font-weight:700;color:var(--muted);cursor:pointer;padding:0}
.dks-drawer-empty-btn:hover{color:var(--acc);text-decoration:underline}

/* ---- modality colour coding: rental is pink, sale is blue ----------------
   Everything below paints from --m / --m-2 / --m-soft / --m-line / --m-sh, which the
   .dks-m-* class on <body> (and on the drawer's .dks-dm) swaps. Add a new accent here
   rather than a one-off `body.dks-m-venta …` override. */
.dks-quote{color:var(--m)}
.dks-drawer-mode,.dks-dm .dks-drawer-mode{background:var(--m-soft);color:var(--m)}
.dks-dm .dks-btn-primary,.dks-drawer-foot .dks-btn-primary{background:var(--m);background-image:none;box-shadow:0 6px 18px rgba(var(--m-sh),.28)}
.dks-dm .dks-btn-primary:hover,.dks-drawer-foot .dks-btn-primary:hover{background:var(--m-2)}
.dks-drawer-link,.dks-ditem-name:hover{color:var(--m)}
.dks-ditem-x:hover,.dks-drawer-empty-btn:hover{color:var(--m)}

/* checkout: the pay button, the step bar, the field focus ring and the payment radios */
body.dks-m-alquiler #place_order,body.dks-m-venta #place_order,
.woocommerce-checkout #place_order,.woocommerce #payment #place_order{background:var(--m)!important;box-shadow:0 6px 18px rgba(var(--m-sh),.28)!important}
.woocommerce-checkout #place_order:hover,.woocommerce #payment #place_order:hover{background:var(--m-2)!important}
body.dks-m-alquiler .dks-step.on,body.dks-m-venta .dks-step.on{color:var(--m)}
body.dks-m-alquiler .dks-step.on .dks-step-ic,body.dks-m-venta .dks-step.on .dks-step-ic{background:var(--m-soft);border-color:var(--m)}
body.dks-m-alquiler .dks-ro-toggle-l i,body.dks-m-venta .dks-ro-toggle-l i,
body.dks-m-alquiler .dks-ro-total,body.dks-m-venta .dks-ro-total{color:var(--m)}
body.dks-m-alquiler .dks-ro-qty,body.dks-m-venta .dks-ro-qty{background:var(--m);box-shadow:0 2px 6px rgba(var(--m-sh),.35)}
.woocommerce-checkout .required{color:var(--m)}
.woocommerce-checkout input.input-text:focus,.woocommerce-checkout textarea:focus,.woocommerce-checkout select:focus,
.dks-cart-actions .dks-coupon-row input.input-text:focus{border-color:var(--m)!important;box-shadow:0 0 0 4px rgba(var(--m-sh),.12)!important}
#payment ul.payment_methods li:has(input[type=radio]:checked){border-color:var(--m);background:var(--m-soft);box-shadow:0 0 0 3px rgba(var(--m-sh),.12)}
#payment ul.payment_methods li input[type=radio]{accent-color:var(--m)}
/* thank-you + pay screen */
body.dks-m-alquiler .dks-thanks-btn,body.dks-m-venta .dks-thanks-btn{background:var(--m)}
body.dks-m-alquiler .dks-thanks-btn:hover,body.dks-m-venta .dks-thanks-btn:hover{background:var(--m-2)}
body.dks-m-alquiler .dks-thanks-btn--ghost,body.dks-m-venta .dks-thanks-btn--ghost{background:#fff;color:var(--m)}
body.dks-m-alquiler .dks-thanks-btn--ghost:hover,body.dks-m-venta .dks-thanks-btn--ghost:hover{background:var(--m);color:#fff;border-color:var(--m)}
body.dks-m-alquiler .dks-transfer-amount,body.dks-m-venta .dks-transfer-amount{background:linear-gradient(135deg,var(--m),var(--m-2))}
body.dks-m-alquiler .dks-acct.on .dks-acct-in,body.dks-m-venta .dks-acct.on .dks-acct-in{border-color:var(--m);box-shadow:0 0 0 3px rgba(var(--m-sh),.14)}

/* ---- phone cart -----------------------------------------------------------
   Two rows inside the card: [thumb | name + chips | ×] then [qty | price]. The qty
   stepper and the price share the bottom row, so the name keeps the full width and the
   bolívar figure never has to fight the column for space. */
@media(max-width:640px){
  .dks-cart-item{grid-template-columns:64px minmax(0,1fr) 30px;grid-template-areas:"thumb info remove" "qty qty price";column-gap:.8rem;row-gap:.9rem;align-items:start}
  .dks-ci-info,.dks-ci-price,.dks-ci-qty{min-width:0}
  .dks-ci-name{overflow-wrap:normal;word-break:normal;hyphens:none;font-size:1rem;line-height:1.3}
  .dks-ci-chips{gap:.3rem}
  .dks-ci-chip{font-size:.72rem;padding:.2rem .5rem}
  .dks-ci-qty{grid-area:qty;justify-self:start;align-self:center}
  .dks-ci-qty .quantity,.dks-ci-qty .dks-qtybox{width:auto}
  .dks-ci-price{grid-area:price;align-self:center}
  .dks-ci-amt{font-size:1.05rem}
  .dks-bs-line{white-space:nowrap}
  .dks-bs{white-space:normal;text-align:right;align-items:flex-end}
  .dks-drawer-total .dks-bs{align-items:flex-end}
}

/* =============================== CONSUMIBLES (cotizador) ================ */
/* A quote builder, not a shop: the customer picks a type, names the machine and writes
   what they need; the line lands in the cart as "a cotizar" (venta = no payment). */
/* padding, not margin: WP zeroes the top margin of the first child of a flow layout */
.dks-consu{max-width:900px;margin:0 auto 3.5rem;padding:0 22px}
.dks-consu-hero{text-align:center;margin-bottom:2rem;padding:3.6rem 22px 0}
.dks-consu-eyebrow{display:inline-flex;align-items:center;gap:.4rem;background:var(--sky);color:var(--blue);border-radius:999px;padding:.3rem .8rem;font-size:.78rem;font-weight:800;letter-spacing:.02em}
.dks-consu-hero h1{font-size:clamp(1.6rem,3.4vw,2.2rem);font-weight:800;letter-spacing:-.02em;margin:.8rem 0 .6rem}
.dks-consu-hero p{color:var(--muted);font-size:1rem;line-height:1.6;max-width:56ch;margin:0 auto}
/* Hero con foto, a juego con el resto de secciones: se sale del contenedor con márgenes
   negativos para ir a sangre, y el texto pasa a blanco sobre el velo azul. */
.dks-consu-hero--bg{position:relative;overflow:hidden;margin:0 calc(50% - 50vw) 2.4rem;padding:clamp(2.8rem,6vw,4.2rem) 22px;color:#fff;background:#0d1c40}
.dks-consu-hero--bg::after{content:"";position:absolute;inset:0;z-index:0;background-image:var(--hero-img);background-size:cover;background-position:center}
.dks-consu-hero--bg::before{content:"";position:absolute;inset:0;z-index:1;
  background-image:linear-gradient(180deg,rgba(9,20,45,.86) 0%,rgba(12,26,58,.82) 55%,rgba(9,20,45,.9) 100%)}
.dks-consu-hero--bg > *{position:relative;z-index:2}
.dks-consu-hero--bg .dks-consu-eyebrow{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.22)}
.dks-consu-hero--bg h1{color:#fff}
.dks-consu-hero--bg p{color:#dbe5f6;text-shadow:0 1px 2px rgba(4,10,25,.45)}

.dks-consu-form{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.6rem 1.7rem}
.dks-consu-step{display:flex;align-items:flex-start;gap:.7rem;margin:0 0 .9rem}
.dks-consu-step:not(:first-child){margin-top:1.8rem}
.dks-consu-step b{display:block;font-size:1rem;color:var(--ink)}
.dks-consu-step span{display:block;color:var(--muted);font-size:.88rem;line-height:1.5}

.dks-consu-types{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:.7rem}
.dks-consu-type{position:relative;cursor:pointer}
.dks-consu-type input{position:absolute;opacity:0;pointer-events:none}
.dks-consu-type-in{box-sizing:border-box;display:flex;flex-direction:column;gap:.25rem;height:100%;background:#fff;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:.9rem 1rem;transition:.16s}
.dks-consu-type:hover .dks-consu-type-in{border-color:#b9c6dc;box-shadow:var(--sh)}
.dks-consu-type-in .bi{font-size:1.3rem;color:var(--m,var(--blue))}
/* Foto del consumible en lugar del icono: fondo suave para que recorte con el resto. */
.dks-consu-type-img{width:100%;height:120px;object-fit:contain;display:block;margin:-.2rem 0 .5rem;
  background:#fff;border:1px solid var(--line);border-radius:8px;padding:.3rem;box-sizing:border-box}
.dks-consu-type input:checked + .dks-consu-type-in .dks-consu-type-img{border-color:var(--m,var(--blue))}
.dks-consu-type-in b{font-size:.95rem;font-weight:800;color:var(--ink)}
.dks-consu-type-in > span{font-size:.8rem;color:var(--muted);line-height:1.45}
.dks-consu-type input:checked + .dks-consu-type-in{border-color:var(--m);background:var(--m-soft);box-shadow:0 0 0 3px rgba(var(--m-sh),.12)}

.dks-consu-grid{display:grid;grid-template-columns:1fr 140px;gap:1rem}
.dks-consu-row{margin:0}
.dks-consu-row--wide{grid-column:1 / -1}
.dks-consu-row label{display:block;font-size:.85rem;font-weight:700;color:var(--ink);margin-bottom:.35rem}
.dks-consu-input,.dks-consu-select{box-sizing:border-box;width:100%;border:1.5px solid var(--line);border-radius:var(--r-sm);padding:.7rem .9rem;font-family:var(--font);font-size:.92rem;background:#fff;color:var(--ink);resize:vertical}
.dks-consu-input:focus,.dks-consu-select:focus{outline:0;border-color:var(--m);box-shadow:0 0 0 3px rgba(var(--m-sh),.12)}
.dks-consu-add{width:100%;justify-content:center;margin-top:1.4rem;background:var(--m);background-image:none;box-shadow:0 6px 18px rgba(var(--m-sh),.28)}
.dks-consu-add:hover{background:var(--m-2)}
.dks-consu-foot{display:flex;align-items:center;justify-content:center;gap:.4rem;margin:.9rem 0 0;font-size:.82rem;color:var(--muted)}
.dks-consu-foot .bi{color:var(--green)}
/* the consumables page is not a cart page, so no body.dks-m-* class sets the accent —
   it is a quote, and quotes are blue */
.dks-consu{--m:var(--blue);--m-2:var(--blue-2);--m-soft:var(--sky);--m-line:#cfe0f7;--m-sh:27,58,122}

@media(max-width:640px){
  .dks-consu{padding:0 16px}
  .dks-consu-hero{padding:2.4rem 16px 0}
  .dks-consu-form{padding:1.2rem 1.1rem}
  .dks-consu-grid{grid-template-columns:1fr}
  .dks-consu-types{grid-template-columns:1fr}
}

/* =============================== COMPARADOR ============================= */
/* the toggle on each shop card */
.dks-card{position:relative}
.dks-cmp-btn{position:absolute;top:.7rem;right:.7rem;z-index:3;width:34px;height:34px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);background:#fff;border-radius:50%;color:var(--muted);font-size:.9rem;cursor:pointer;transition:.15s;box-shadow:var(--sh)}
.dks-cmp-btn:hover{border-color:var(--blue);color:var(--blue)}
.dks-cmp-btn.on{background:var(--blue);border-color:var(--blue);color:#fff}
.dks-cmp-btn.dks-cmp-full{animation:dks-shake .35s}
@keyframes dks-shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
/* the button on the product sheet */
.dks-extra-cmp{display:inline-flex;align-items:center;gap:.5rem;border:0;background:none;padding:0;font-family:var(--font);font-size:.9rem;font-weight:700;color:var(--blue);cursor:pointer}
.dks-extra-cmp:hover{text-decoration:underline}
.dks-extra-cmp.on{color:var(--acc)}
.dks-extra-cmp.dks-cmp-full{animation:dks-shake .35s}

/* the floating bar */
.dks-cmpbar{position:fixed;left:0;right:0;bottom:0;z-index:600;background:#fff;border-top:1px solid var(--line);box-shadow:0 -8px 30px rgba(20,35,70,.12)}
.dks-cmpbar[hidden]{display:none}
.dks-cmpbar-in{max-width:var(--ct);margin:0 auto;padding:.8rem 22px;display:flex;align-items:center;gap:1rem}
.dks-cmpbar-items{display:flex;align-items:center;gap:.6rem;flex:1;min-width:0;overflow-x:auto;scrollbar-width:none}
.dks-cmpbar-items::-webkit-scrollbar{height:0}
.dks-cmpbar-item{position:relative;display:flex;align-items:center;gap:.5rem;flex:0 0 auto;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:.35rem .8rem .35rem .35rem;max-width:230px}
.dks-cmpbar-item img{width:30px;height:30px;object-fit:contain;background:#fff;border-radius:50%;flex:0 0 auto}
.dks-cmpbar-item b{font-size:.82rem;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dks-cmpbar-item button{border:0;background:none;color:var(--muted);font-size:.7rem;cursor:pointer;padding:0 0 0 .1rem}
.dks-cmpbar-item button:hover{color:var(--acc)}
.dks-cmpbar-act{display:flex;align-items:center;gap:.8rem;flex:0 0 auto}
.dks-cmpbar-clear{border:0;background:none;font-family:var(--font);font-size:.85rem;font-weight:700;color:var(--muted);cursor:pointer}
.dks-cmpbar-clear:hover{color:var(--ink)}
.dks-cmpbar-go{white-space:nowrap}

/* the comparison table */
.dks-cmp{max-width:var(--ct);margin:0 auto 6rem;padding:3.6rem 22px 0}
.dks-cmp-head{margin-bottom:1.6rem}
.dks-cmp-head h1{font-size:clamp(1.6rem,3.2vw,2.1rem);font-weight:800;letter-spacing:-.02em;margin:0 0 .4rem}
.dks-cmp-head p{color:var(--muted);font-size:1rem;margin:0}
.dks-cmp-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:#fff;box-shadow:var(--sh)}
.dks-cmp-table{width:100%;border-collapse:collapse;font-size:.92rem;min-width:calc(200px + var(--cols,2) * 200px)}
.dks-cmp-table th,.dks-cmp-table td{text-align:left;padding:.85rem 1rem;border-bottom:1px solid var(--line);vertical-align:top}
.dks-cmp-table thead th{border-bottom:2px solid var(--line);vertical-align:top;background:#fff;position:sticky;top:0;z-index:2}
/* the corner has to freeze with the label column it sits above, or the two drift apart
   as soon as you scroll sideways */
.dks-cmp-corner{width:210px;font-size:.8rem;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:var(--muted);position:sticky;left:0;z-index:3;background:#fff;box-shadow:1px 0 0 var(--line)}
.dks-cmp-col{position:relative;width:200px;text-align:center!important}
.dks-cmp-x{position:absolute;top:.4rem;right:.4rem;border:0;background:none;color:#c3ccda;font-size:.8rem;cursor:pointer}
.dks-cmp-x:hover{color:var(--acc)}
.dks-cmp-img{display:block;margin:0 auto .5rem}
.dks-cmp-img img{width:110px;height:110px;object-fit:contain;mix-blend-mode:multiply}
.dks-cmp-name{display:block;font-size:.98rem;font-weight:800;color:var(--ink);line-height:1.3;margin-bottom:.4rem}
.dks-cmp-name:hover{color:var(--blue)}
.dks-cmp-col .dks-card-modes{justify-content:center;margin-bottom:.5rem}
.dks-cmp-cta{display:inline-flex;align-items:center;gap:.3rem;font-size:.82rem;font-weight:700;color:var(--blue)}
.dks-cmp-cta:hover{text-decoration:underline}
/* the row label column stays put while the machines scroll past it */
.dks-cmp-table tbody th{width:210px;font-weight:700;color:var(--ink);background:var(--bg);position:sticky;left:0;z-index:1;box-shadow:1px 0 0 var(--line)}
.dks-cmp-table tbody td{color:var(--muted);text-align:center}
.dks-cmp-table tbody tr:last-child th,.dks-cmp-table tbody tr:last-child td{border-bottom:0}
.dks-cmp-diff td{color:var(--ink);font-weight:600;background:#fcfdff}
.dks-cmp-diff th{background:var(--sky)}
.dks-cmp-na{color:#c3ccda}
.dks-cmp-legend{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:1rem;font-size:.85rem;color:var(--muted)}
.dks-cmp-legend .bi-dot{color:var(--blue);font-size:1.4rem;vertical-align:middle}
.dks-cmp-clear{border:1px solid var(--line);background:#fff;border-radius:999px;padding:.5rem 1.1rem;font-family:var(--font);font-size:.84rem;font-weight:700;color:var(--muted);cursor:pointer;transition:.15s}
.dks-cmp-clear:hover{border-color:var(--acc);color:var(--acc)}

.dks-cmp-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.6rem;padding:3.5rem 1.5rem;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh)}
.dks-cmp-empty-ic{width:64px;height:64px;border-radius:50%;background:var(--sky);color:var(--blue);display:flex;align-items:center;justify-content:center;font-size:1.5rem}
.dks-cmp-empty b{font-size:1.1rem;color:var(--ink)}
.dks-cmp-empty p{color:var(--muted);max-width:44ch;line-height:1.6;margin:0 0 .8rem}

@media(max-width:640px){
  .dks-cmp{padding:2.4rem 16px 0;margin-bottom:4rem}
  .dks-cmpbar-in{padding:.7rem 16px;gap:.6rem}
  .dks-cmpbar-item b{display:none}
  .dks-cmpbar-item{padding:.3rem .45rem;max-width:none}
  .dks-cmpbar-clear{display:none}
  .dks-cmp-corner,.dks-cmp-table tbody th{width:130px;font-size:.78rem}
  .dks-cmp-table{min-width:calc(130px + var(--cols,2) * 150px)}
  .dks-cmp-col{width:150px}
  .dks-cmp-img img{width:74px;height:74px}
  .dks-cmp-table th,.dks-cmp-table td{padding:.65rem .6rem;font-size:.84rem}
}

/* =============================== SOCIAL MEDIA PAGE (.dks-sm) ============ */
.dks-sm-band{background:var(--bg)}

/* Tarjetas de canal — el color de marca vive en --smc y pinta icono, borde y CTA. */
.dks-sm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.3rem}
.dks-sm-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.7rem 1.5rem;transition:.16s;color:inherit}
.dks-sm-card:hover{transform:translateY(-4px);box-shadow:var(--sh-md);border-color:color-mix(in srgb,var(--smc,var(--blue)) 45%,#fff)}
.dks-sm-card.is-soon{opacity:.72;box-shadow:none;background:#fcfdff}
.dks-sm-card.is-soon:hover{transform:none}
.dks-sm-ic{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.45rem;color:#fff;background:var(--smc,var(--blue));margin-bottom:1rem;box-shadow:0 8px 20px color-mix(in srgb,var(--smc,var(--blue)) 35%,transparent)}
.dks-sm-card b{display:block;font-size:1.1rem;color:var(--ink);margin-bottom:.4rem}
.dks-sm-card p{color:var(--muted);font-size:.92rem;line-height:1.55;margin:0 0 1rem;flex:1}
.dks-sm-card em{font-style:normal;font-weight:700;font-size:.9rem;color:var(--smc,var(--blue));display:inline-flex;align-items:center;gap:.4rem}
.dks-sm-card:hover em i{transform:translateX(3px)}
.dks-sm-card em i{transition:.15s}
.dks-sm-soon{color:var(--muted)!important;background:var(--line);border-radius:999px;padding:.25rem .7rem;font-size:.78rem;align-self:flex-start}
.dks-sm-yt{--smc:#ff0000}
.dks-sm-ig{--smc:#d6249f}
.dks-sm-ig .dks-sm-ic{background:linear-gradient(45deg,#f9ce34,#ee2a7b 45%,#6228d7)}
.dks-sm-fb{--smc:#1877f2}
.dks-sm-in{--smc:#0a66c2}
.dks-sm-wa{--smc:#25d366}

/* Videos de YouTube — la miniatura es un <button> que el JS cambia por el iframe. */
.dks-sm-videos{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem}
.dks-sm-video{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);overflow:hidden;display:flex;flex-direction:column}
.dks-sm-video:hover{box-shadow:var(--sh-md)}
.dks-sm-video .dks-sm-thumb,.dks-sm-video iframe{display:block;width:100%;aspect-ratio:16/9;border:0;padding:0;background:#0b1220;position:relative;cursor:pointer}
.dks-sm-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.dks-sm-play{position:absolute;inset:0;margin:auto;width:64px;height:64px;border-radius:50%;background:rgba(255,0,0,.92);color:#fff;display:flex;align-items:center;justify-content:center;font-size:2rem;box-shadow:0 8px 24px rgba(0,0,0,.35);transition:.16s}
.dks-sm-thumb:hover .dks-sm-play{transform:scale(1.08);background:#f00}
.dks-sm-vmeta{padding:1.1rem 1.2rem 1.3rem;display:flex;flex-direction:column;gap:.35rem;flex:1}
.dks-sm-vmeta b{font-size:1.02rem;color:var(--ink);line-height:1.35}
.dks-sm-vmeta p{color:var(--muted);font-size:.9rem;line-height:1.55;margin:0;flex:1}
.dks-sm-vmeta a{margin-top:.5rem;font-weight:700;font-size:.88rem;color:var(--blue);display:inline-flex;align-items:center;gap:.4rem}
.dks-sm-vmeta a:hover{color:var(--acc)}

/* Posts de Instagram — el iframe oficial trae su propio marco, sólo lo contenemos. */
.dks-sm-posts{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem}
.dks-sm-post{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);overflow:hidden}
.dks-sm-post iframe{display:block;width:100%;min-height:560px;border:0}
.dks-sm-more{text-align:center;margin:2.2rem 0 0}

@media(max-width:640px){
  .dks-sm-grid{grid-template-columns:1fr}
  .dks-sm-post iframe{min-height:520px}
}

/* Social Media: en escritorio vive en la franja azul; en el menú desplegable
   móvil aparece como un ítem más (la barra de menú ya no tiene sitio). */
.dks-menu > li.dks-menu-mob{display:none}
@media(max-width:1024px){.dks-menu > li.dks-menu-mob{display:flex}}
@media(max-width:720px){.dks-toplinks .dks-topsocial{display:none}}
/* 1025–1250px: aún es menú horizontal (el burger entra en 1024) pero 7 ítems +
   los iconos de acción no caben con el padding de escritorio → se compacta. */
@media(min-width:1025px) and (max-width:1250px){
  .dks-mainbar-in{gap:.6rem}
  .dks-brand{padding-right:.9rem}
  .dks-brand img,.dks-brand .custom-logo,.dks-logo-img{max-height:44px!important;height:auto!important;width:auto}
  .dks-menu > li > a{padding:.55rem .45rem;font-size:.86rem}
  .dks-ic{width:40px;font-size:1.05rem}
  .dks-ic-sm-hide{display:none} /* el WhatsApp flotante ya está en la franja azul */
}

/* ---- Sector gráfico: video ambiental + muestrario de aplicaciones ---- */
.dks-gvid-sec{background:var(--bg)}
.dks-gvid{max-width:980px;margin:0 auto;border-radius:20px;overflow:hidden;box-shadow:var(--sh-lg);background:#0b1220;aspect-ratio:16/9}
.dks-gvid iframe{display:block;width:100%;height:100%;border:0}
/* Self-hosted variant: the file lives in our own media library, so we can offer sound. */
.dks-gvid--self{position:relative}
.dks-gvid-v{display:block;width:100%;height:100%;object-fit:cover}
.dks-gvid-sound{position:absolute;right:14px;bottom:14px;z-index:2;width:42px;height:42px;border-radius:50%;border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.05rem;color:#fff;background:rgba(11,18,32,.55);box-shadow:0 4px 14px rgba(0,0,0,.3);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:.18s}
.dks-gvid-sound:hover{background:rgba(11,18,32,.85)}
.dks-gvid-more{text-align:center;margin:1.6rem 0 0}

.dks-gapp{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.1rem}
.dks-gapp-i{margin:0;position:relative;border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);background:#fff;aspect-ratio:1/1}
.dks-gapp-i img{width:100%;height:100%;object-fit:cover;display:block;transition:.35s}
.dks-gapp-i:hover img{transform:scale(1.05)}
.dks-gapp-i figcaption{position:absolute;left:0;right:0;bottom:0;padding:1.5rem .9rem .8rem;color:#fff;font-weight:700;font-size:.92rem;background:linear-gradient(180deg,transparent,rgba(8,14,30,.82))}
.dks-gapp-note{text-align:center;color:var(--muted);font-size:.9rem;margin:1.6rem 0 0}
@media(max-width:900px){.dks-gapp{grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}}
@media(max-width:640px){.dks-gapp{grid-template-columns:repeat(2,minmax(0,1fr))}.dks-gapp-i figcaption{font-size:.82rem;padding:1.2rem .7rem .6rem}}

/* ===================== PANEL DE GESTIÓN (/panel/) =====================
   Pantalla completa, tipo aplicación: barra propia arriba, lateral fijo y el contenido
   con su propio scroll. La plantilla page-panel.html no pinta cabecera ni pie del sitio. */
.dks-panel-app{max-width:none!important;margin:0!important;padding:0!important}
.dks-panel{--top:58px;background:var(--bg);min-height:100dvh;display:flex;flex-direction:column}
.dks-panel-top{position:sticky;top:0;z-index:40;height:var(--top);flex:0 0 auto;display:flex;align-items:center;
  gap:1rem;padding:0 1.1rem;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 1px 3px rgba(20,35,70,.05)}
.dks-panel-brand{display:flex;align-items:center;gap:.7rem;min-width:0}
.dks-panel-brand img,.dks-panel-brand svg{height:24px;width:auto;display:block}
.dks-panel-brand span{font-size:.66rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);
  background:var(--sky);border-radius:999px;padding:.2rem .55rem}
.dks-panel-topsearch{position:relative;flex:1 1 auto;max-width:380px;margin-left:.6rem}
.dks-panel-topsearch .bi{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);color:var(--muted);font-size:.9rem;pointer-events:none}
.dks-panel-topsearch input{width:100%;box-sizing:border-box;padding:.5rem .8rem .5rem 2.1rem;border:1px solid var(--line);
  border-radius:999px;background:var(--bg);font-family:var(--font);font-size:.88rem;color:var(--ink)}
.dks-panel-topsearch input:focus{outline:0;background:#fff;border-color:var(--blue);box-shadow:0 0 0 3px var(--sky)}
.dks-panel-topright{display:flex;align-items:center;gap:.5rem;margin-left:auto}
.dks-panel-icobtn{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:var(--muted);background:var(--bg);transition:.14s}
.dks-panel-icobtn:hover{background:var(--sky);color:var(--blue)}
.dks-panel-chip{display:flex;align-items:center;gap:.45rem;padding:.25rem .7rem .25rem .25rem;border-radius:999px;background:var(--bg)}
.dks-panel-chip b{font-size:.84rem;font-weight:700;color:var(--ink);white-space:nowrap}
.dks-panel-av.sm{width:26px;height:26px;font-size:.78rem}
.dks-panel-burger{display:none;background:none;border:0;color:var(--ink);font-size:1.35rem;cursor:pointer;padding:.2rem .3rem}
.dks-panel-in{flex:1 1 auto;min-height:0;display:grid;grid-template-columns:238px minmax(0,1fr)}
.dks-panel-side{background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;
  position:sticky;top:var(--top);height:calc(100dvh - var(--top));overflow-y:auto}
.dks-panel-me{display:flex;align-items:center;gap:.7rem;padding:1.05rem 1rem;border-bottom:1px solid var(--line)}
.dks-panel-av{flex:0 0 auto;width:38px;height:38px;border-radius:50%;background:var(--sky);color:var(--blue);display:flex;align-items:center;justify-content:center;font-weight:800}
.dks-panel-me b{display:block;font-size:.9rem;line-height:1.2;color:var(--ink)}
.dks-panel-me small{font-size:.74rem;color:var(--muted)}
.dks-panel-nav{display:flex;flex-direction:column;padding:.5rem;gap:.1rem}
.dks-panel-nav a{display:flex;align-items:center;gap:.65rem;padding:.62rem .8rem;border-radius:var(--r-sm);color:var(--ink);font-size:.92rem;font-weight:600;transition:.14s}
.dks-panel-nav a:hover{background:var(--bg)}
.dks-panel-nav a.on{background:var(--sky);color:var(--blue)}
.dks-panel-nav .bi{color:var(--muted);width:18px;text-align:center}
.dks-panel-nav a.on .bi{color:var(--blue)}
.dks-panel-nav .dks-panel-badge{margin-left:auto;background:var(--acc);color:#fff;border-radius:999px;font-size:.68rem;font-weight:800;padding:.1rem .42rem}
.dks-panel-out{margin-top:auto;display:flex;align-items:center;gap:.5rem;padding:.85rem 1.1rem;border-top:1px solid var(--line);color:var(--muted);font-size:.85rem;font-weight:600}
.dks-panel-out:hover{color:var(--blue)}
.dks-panel-main{min-width:0;overflow-y:auto;height:calc(100dvh - var(--top));padding:1.5rem 1.6rem 3rem}
.dks-panel-h1{font-size:1.6rem;font-weight:800;letter-spacing:-.02em;color:var(--ink);margin:.1rem 0 .3rem}
.dks-panel-h2{font-size:1.05rem;font-weight:800;color:var(--ink);margin:1.7rem 0 .7rem}
.dks-panel-sub{color:var(--muted);font-size:.92rem;margin:0 0 1.1rem}
.dks-panel-back{display:inline-flex;align-items:center;gap:.35rem;color:var(--muted);font-size:.85rem;font-weight:600;margin-bottom:.5rem}
.dks-panel-back:hover{color:var(--blue)}
.dks-panel-vacio{color:var(--muted);background:#fff;border:1px dashed var(--line);border-radius:var(--r);padding:1.6rem;text-align:center}
.dks-panel-flash{display:flex;align-items:center;gap:.5rem;border-radius:var(--r-sm);padding:.75rem 1rem;font-size:.9rem;font-weight:600;margin:0 0 1rem}
.dks-panel-flash.ok{background:#eefbf3;border:1px solid #bfe6cf;color:#146c40}
.dks-panel-flash.err{background:#fdeef2;border:1px solid #f3c2cf;color:#a11049}
/* tarjetas de resumen */
.dks-panel-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:.8rem;margin-bottom:.6rem}
.dks-panel-tile{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.05rem;box-shadow:var(--sh);transition:.16s}
.dks-panel-tile:hover{transform:translateY(-2px);box-shadow:var(--sh-md)}
.dks-panel-tile .bi{font-size:1.1rem;color:var(--blue)}
.dks-panel-tile b{display:block;font-size:1.75rem;font-weight:800;letter-spacing:-.02em;color:var(--ink);line-height:1.1;margin:.3rem 0 .1rem}
.dks-panel-tile span{font-size:.8rem;color:var(--muted)}
.dks-panel-tile.alerta{border-color:#f8cfe4;background:#fff8fb}
.dks-panel-tile.alerta .bi,.dks-panel-tile.alerta b{color:var(--acc)}
/* tablas */
.dks-panel-tabla-wrap{overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh)}
.dks-panel-tabla{width:100%;border-collapse:collapse;font-size:.9rem;min-width:560px}
.dks-panel-tabla th,.dks-panel-tabla td{padding:.7rem .9rem;text-align:left;border-bottom:1px solid var(--line);vertical-align:middle}
.dks-panel-tabla thead th{background:var(--bg);font-size:.72rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.dks-panel-tabla tbody th{font-weight:700;color:var(--ink)}
.dks-panel-tabla tbody th small{display:block;font-weight:500;font-size:.74rem;color:var(--muted)}
.dks-panel-tabla tbody tr:last-child th,.dks-panel-tabla tbody tr:last-child td{border-bottom:0}
.dks-panel-tabla tbody tr:hover{background:#fafbfe}
.dks-panel-tabla .right{text-align:right}
.dks-panel-mini img{width:44px;height:44px;object-fit:contain;display:block}
.dks-panel-link{display:inline-flex;align-items:center;gap:.3rem;color:var(--blue);font-weight:700;font-size:.85rem;background:none;border:0;cursor:pointer;font-family:var(--font);padding:0}
.dks-panel-link:hover{text-decoration:underline}
.dks-panel-link.rojo{color:var(--red)}
.dks-panel-pill{display:inline-block;padding:.2rem .55rem;border-radius:999px;font-size:.72rem;font-weight:800}
.dks-panel-pill.rosa{background:#fdeaf4;color:var(--acc)}
.dks-panel-pill.azul{background:var(--sky);color:var(--blue)}
.dks-panel-pill.gris{background:var(--bg);color:var(--muted)}
.dks-panel-estado{display:inline-block;padding:.2rem .55rem;border-radius:999px;font-size:.72rem;font-weight:700;background:var(--bg);color:var(--muted);white-space:nowrap}
.dks-panel-estado.est-cotizacion{background:var(--sky);color:var(--blue)}
.dks-panel-estado.est-por-verificar{background:#fff6e6;color:#9a6400}
.dks-panel-estado.est-pending{background:#fff6e6;color:#9a6400}
.dks-panel-estado.est-processing,.dks-panel-estado.est-completed,.dks-panel-estado.est-publish{background:#eefbf3;color:#146c40}
.dks-panel-estado.est-cancelled,.dks-panel-estado.est-draft{background:#fdeef2;color:#a11049}
/* fichas y formularios */
.dks-panel-cols{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:1.1rem;align-items:start}
.dks-panel-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1.2rem;margin-bottom:1.1rem}
.dks-panel-card h2{font-size:1rem;font-weight:800;color:var(--ink);margin:0 0 .8rem}
.dks-panel-card h2:not(:first-child){margin-top:1.4rem}
.dks-panel-dato{margin:0 0 .4rem;font-size:.9rem;color:var(--ink)}
.dks-panel-dato .bi{color:var(--muted);margin-right:.3rem}
.dks-panel-nota{margin:.8rem 0 0;padding:.7rem .85rem;background:var(--bg);border-radius:var(--r-sm);font-size:.86rem;color:var(--muted)}
.dks-panel-form label,.dks-panel-card label{display:block;font-size:.82rem;font-weight:700;color:var(--ink);margin-bottom:.9rem}
.dks-panel-form label small,.dks-panel-card label small{font-weight:500;color:var(--muted)}
.dks-panel-form input[type=text],.dks-panel-form input[type=email],.dks-panel-form input[type=password],.dks-panel-form input[type=file],.dks-panel-form textarea,.dks-panel-form select,
.dks-panel-card input[type=text],.dks-panel-card select,.dks-panel-buscar input,.dks-panel-buscar select{
  display:block;width:100%;box-sizing:border-box;margin-top:.3rem;padding:.6rem .75rem;border:1px solid var(--line);
  border-radius:var(--r-sm);font-family:var(--font);font-size:.92rem;color:var(--ink);background:#fff;font-weight:500}
.dks-panel-form textarea{resize:vertical}
.dks-panel-form input:focus,.dks-panel-form textarea:focus,.dks-panel-form select:focus,.dks-panel-card select:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 3px var(--sky)}
.dks-panel-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:0 1rem}
.dks-panel-check{display:flex!important;align-items:center;gap:.45rem;margin-top:1.55rem}
.dks-panel-check input{width:auto;margin:0}
.dks-panel-precio input{max-width:220px}
.dks-panel-tarifa input{min-width:82px;padding:.45rem .5rem;font-size:.86rem;text-align:right}
.dks-panel-tarifa .dks-panel-na{color:var(--line);text-align:center}
.dks-panel-form{padding-bottom:4.6rem}
/* barra de acción fija: blanca y a todo el ancho, para que no se lea como un botón
   flotando por encima del texto */
.dks-panel-guardar{position:sticky;bottom:0;z-index:6;margin:.4rem -1.6rem 0;padding:.85rem 1.6rem;
  background:#fff;border-top:1px solid var(--line);box-shadow:0 -4px 14px rgba(20,35,70,.06);
  display:flex;justify-content:flex-end}
.dks-panel-estadoform{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.dks-panel-estadoform select{max-width:220px;margin-top:0}
.dks-panel-buscar{display:flex;gap:.5rem;margin-bottom:.9rem;flex-wrap:wrap;align-items:center}
.dks-panel-buscar input,.dks-panel-buscar select{margin-top:0;width:auto;min-width:170px}
.dks-panel-buscar input[type=search]{min-width:230px}
/* casillas de categorías */
.dks-panel-cats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:.35rem .9rem;margin-bottom:.9rem}
.dks-panel-cats label{display:flex!important;align-items:center;gap:.45rem;font-weight:500;margin:0;font-size:.88rem}
.dks-panel-cats input{width:auto;margin:0}
.dks-panel-thumb{display:flex;align-items:center;gap:1rem;margin-bottom:.9rem}
.dks-panel-thumb img{width:76px;height:76px;object-fit:contain;border:1px solid var(--line);border-radius:var(--r-sm);background:#fff}
/* login */
.dks-panel--login{display:flex;align-items:center;justify-content:center;padding:3rem 1.2rem 4rem;min-height:100dvh}
.dks-panel-loginbox{width:min(400px,100%);background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-lg);padding:1.8rem}
.dks-panel-loginbox h1{font-size:1.5rem;font-weight:800;color:var(--ink);margin:.5rem 0 .2rem}
.dks-panel-loginsub{color:var(--muted);font-size:.9rem;margin:0 0 1.2rem}
.dks-panel-loginbox label{display:block;font-size:.82rem;font-weight:700;margin-bottom:.9rem}
.dks-panel-loginbox input[type=text],.dks-panel-loginbox input[type=password]{display:block;width:100%;box-sizing:border-box;margin-top:.3rem;padding:.65rem .8rem;border:1px solid var(--line);border-radius:var(--r-sm);font-family:var(--font);font-size:.95rem}
.dks-panel-rem{display:flex!important;align-items:center;gap:.45rem;font-weight:500!important;color:var(--muted)}
.dks-panel-rem input{width:auto}
.dks-panel-loginbox .dks-btn-primary{width:100%;justify-content:center;margin-top:.3rem}
.dks-panel-lost{display:block;text-align:center;margin-top:.9rem;font-size:.82rem;color:var(--muted)}
@media(max-width:900px){
  .dks-panel-burger{display:block}
  .dks-panel-topsearch,.dks-panel-chip b{display:none}
  .dks-panel-in{grid-template-columns:1fr}
  .dks-panel-side{position:fixed;top:var(--top);left:0;bottom:0;width:262px;z-index:45;transform:translateX(-100%);transition:transform .22s ease;box-shadow:var(--sh-lg)}
  .dks-panel-side.open{transform:none}
  .dks-panel-main{height:auto;padding:1.1rem 1rem 3rem}
  .dks-panel-guardar{margin-left:-1rem;margin-right:-1rem;padding-left:1rem;padding-right:1rem}
  .dks-panel-cols{grid-template-columns:1fr}
}
/* extras del panel: acciones en línea, contadores, notas y logo sobre fondo oscuro */
/* el contenedor va dentro de la celda: un td en flex se sale del flujo de la tabla */
.dks-panel-acciones{display:flex;align-items:center;justify-content:flex-end;gap:.85rem;white-space:nowrap}
.dks-panel-inline{display:inline}
.dks-panel-count{margin-left:auto;color:var(--muted);font-size:.82rem;font-weight:600}
.dks-panel-notas{list-style:none;margin:0 0 1rem;padding:0;display:grid;gap:.5rem}
.dks-panel-notas li{background:var(--bg);border-radius:var(--r-sm);padding:.6rem .8rem;font-size:.86rem;color:var(--ink)}
.dks-panel-notas li span{display:block;font-size:.72rem;color:var(--muted);margin-bottom:.2rem}
.dks-panel-notas li p{margin:0}
/* galería editable y bloque de actualización masiva */
.dks-panel-gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:.7rem;margin-bottom:1rem}
.dks-panel-galitem{margin:0;border:1px solid var(--line);border-radius:var(--r-sm);padding:.5rem;background:#fff}
.dks-panel-galitem img{width:100%;height:88px;object-fit:contain;display:block;margin-bottom:.4rem}
.dks-panel-galitem input[type=text]{width:100%;box-sizing:border-box;padding:.3rem .45rem;border:1px solid var(--line);border-radius:6px;font-size:.76rem;font-family:var(--font)}
.dks-panel-galrow{display:flex;align-items:center;gap:.4rem;margin-top:.35rem}
.dks-panel-galrow input[type=number]{width:52px;padding:.25rem .35rem;border:1px solid var(--line);border-radius:6px;font-size:.76rem;font-family:var(--font)}
.dks-panel-galrow label{display:flex!important;align-items:center;gap:.25rem;margin:0;font-size:.74rem;font-weight:600;color:var(--muted)}
.dks-panel-galrow input[type=checkbox]{width:auto;margin:0}
.dks-panel-acordeon{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);margin-bottom:1rem;overflow:hidden}
.dks-panel-acordeon>summary{cursor:pointer;padding:.85rem 1.1rem;font-weight:700;font-size:.92rem;color:var(--ink);list-style:none;display:flex;align-items:center;gap:.5rem}
.dks-panel-acordeon>summary::-webkit-details-marker{display:none}
.dks-panel-acordeon>summary:hover{background:var(--bg)}
.dks-panel-acordeon>summary .bi{color:var(--blue)}
.dks-panel-acordeon[open]>summary{border-bottom:1px solid var(--line)}
.dks-panel-masivo{padding:1.1rem!important}
.dks-panel-masivo code{background:var(--bg);padding:.05rem .3rem;border-radius:4px}

/* ---- Música ambiental: botón flotante discreto (ver dks_musica) ----
   Va abajo a la izquierda para no chocar con el icono de WhatsApp ni con el carrito. */
.dks-music{position:fixed;left:18px;bottom:18px;z-index:500}
.dks-music-btn{position:relative;width:46px;height:46px;border-radius:50%;border:1px solid var(--line);
  background:rgba(255,255,255,.94);box-shadow:var(--sh-md);color:var(--blue);cursor:pointer;
  display:flex;align-items:center;justify-content:center;font-size:1.05rem;transition:.18s;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.dks-music-btn:hover{background:#fff;box-shadow:var(--sh-lg);transform:translateY(-2px)}
.dks-music.on .dks-music-btn{background:var(--blue);border-color:var(--blue);color:#fff}
/* con la música puesta el icono deja paso a un ecualizador animado */
.dks-music-ico{display:block}
.dks-music.on .dks-music-ico{display:none}
.dks-music-eq{display:none;align-items:flex-end;gap:2px;height:16px}
.dks-music.on .dks-music-eq{display:flex}
.dks-music-eq i{display:block;width:3px;border-radius:2px;background:#fff;animation:dks-eq .9s ease-in-out infinite}
.dks-music-eq i:nth-child(1){height:6px;animation-delay:0s}
.dks-music-eq i:nth-child(2){height:14px;animation-delay:.15s}
.dks-music-eq i:nth-child(3){height:9px;animation-delay:.3s}
.dks-music-eq i:nth-child(4){height:12px;animation-delay:.45s}
@keyframes dks-eq{0%,100%{transform:scaleY(.45)}50%{transform:scaleY(1)}}
@media(prefers-reduced-motion:reduce){.dks-music-eq i{animation:none}}
@media(max-width:600px){.dks-music{left:12px;bottom:12px}.dks-music-btn{width:42px;height:42px}}