#order-open,.buy-box button,.order-link,#keep-shopping,#leave-offer {font:inherit;font-weight:700;cursor:pointer;border:0;background:#4b147c;color:white;border-radius:12px;padding:10px 14px}
#order-open {position:fixed;z-index:15;bottom:max(18px,env(safe-area-inset-bottom));left:18px;display:flex;align-items:center;gap:10px;box-shadow:0 3px 15px #39145a45}
#order-count {background:white;color:#4b147c;border-radius:20px;min-width:25px;padding:2px 6px}
.buy-box {margin:10px 0;display:grid;gap:5px;color:#4b147c;font-weight:700}
.buy-box select,.buy-box>span {font:inherit;font-size:14px;min-width:0;width:100%;padding:6px 4px;text-transform:capitalize}
.buy-box select {border:1px solid #dacde6;border-radius:8px;background:white;color:#401566}
.buy-box button,.order-link {font-size:14px}
.steps {display:flex;align-items:center;justify-content:space-between;gap:3px;color:#4b147c;background:#f4eef9;border-radius:10px}
.steps button {border:0;border-radius:10px;min-width:32px;padding:8px;color:white;background:#4b147c;font:inherit;font-weight:bold;cursor:pointer}
.steps strong {font-size:13px;text-align:center}
#order-panel {border:0;border-radius:20px;width:min(510px,94vw);max-height:88dvh;padding:22px;color:#321844;box-sizing:border-box;background:white;overflow:auto}
#order-panel::backdrop {background:#21132d99}
.order-head,#order-lines li {display:flex;align-items:center;justify-content:space-between;gap:12px}
.order-head h2 {margin:0;color:#4b147c}
#order-close {border:0;border-radius:50%;width:38px;height:38px;cursor:pointer;font:inherit}
#order-lines {list-style:none;padding:0;margin:16px 0}
#order-lines li {padding:12px 0;border-bottom:1px solid #e5ddec;font-weight:600}
#order-lines .steps {flex-shrink:0}
#order-form,#order-form label {display:grid;gap:6px}
#order-form {gap:12px}
#order-form label {font-weight:650}
#order-form input {width:100%;box-sizing:border-box;border:1px solid #cabed2;border-radius:9px;padding:10px;font:inherit}
#keep-shopping:disabled {opacity:.5}
#offer-scope {background:#faf6ff;padding:14px;border-radius:12px;margin:8px 0}
#offer-scope p {margin:0 0 10px}
#offer-scope[hidden] {display:none}
.offer-actions {flex-wrap:wrap}
.offer-artwork.store-link {display:block;padding:0}
footer {padding-bottom:80px}
.catalog-toolbar {position:sticky;top:0;z-index:16;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px clamp(12px,3vw,48px);background:#fff;border-bottom:1px solid #e2d8e9}
.toolbar-brand {display:flex;align-items:center;gap:8px;color:#471579;text-decoration:none;font-size:19px}
.toolbar-brand img {object-fit:contain}
.catalog-toolbar .search {flex:1;max-width:760px;min-width:0;background:#fbf8fc}
.catalog-toolbar .search input {padding:11px 0}
.catalog-toolbar #order-open {position:static;box-shadow:none;white-space:nowrap}
#result-title {scroll-margin-top:80px}
@media(max-width:650px){
 .catalog-toolbar {gap:7px;padding:8px}
 .toolbar-brand strong {display:none}
 .toolbar-brand img {width:25px;height:30px}
 .catalog-toolbar .search {padding:0 8px;gap:4px}
 .catalog-toolbar .search svg {width:16px}
 .catalog-toolbar #order-open {padding:9px 8px;font-size:13px;gap:5px}
 #order-count {min-width:20px}
}
.order-item {display:flex;align-items:center;gap:10px;min-width:0;overflow-wrap:anywhere}
.order-item img {object-fit:contain;flex:none}
.catalog-price {display:grid;gap:2px;margin:6px 0 12px;text-align:left}
.catalog-price small,.catalog-price span {font:400 12px/1.3 Arial,sans-serif;color:#684d75}
.catalog-price strong {color:#401664;font-size:clamp(18px,2vw,24px)}
#grid:not(.offers-grid) .card-body {display:flex;flex-direction:column}
#grid:not(.offers-grid) .card-body .prices,#grid:not(.offers-grid) .product-foot,#grid:not(.offers-grid) .card-body>.flag,#grid:not(.offers-grid) .promotion-notice {display:none}
#grid:not(.offers-grid) .compact-open {display:block;order:9;background:transparent;color:#542482;border:0;padding:8px;font:600 13px/1.3 Arial;cursor:pointer}
#grid:not(.offers-grid) .buy-box {margin-top:auto}
#grid:not(.offers-grid) .buy-box>button {min-height:42px}
@media(max-width:650px){
 #grid:not(.offers-grid){grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 #grid:not(.offers-grid) .photo{height:139px}
 #grid:not(.offers-grid) .photo img{height:123px}
 #grid:not(.offers-grid) .card-body{padding:9px 10px 12px}
 #grid:not(.offers-grid) .name-button{font-size:15px;min-height:36px}
 #grid:not(.offers-grid) .compact-open{margin-top:0}
 #order-lines li {align-items:flex-start;flex-wrap:wrap}
}
@media(max-width:600px){#order-panel {width:100%;max-width:100%;max-height:100dvh;margin:auto 0 0;border-radius:20px 20px 0 0;padding:18px 16px max(22px,env(safe-area-inset-bottom))}.buy-box button {padding:8px 4px}.steps strong {font-size:12px}}

/* Storefront, campaign posters and shopping rail. */
:root {--ink:#391454;--deep:#481076;--lilac:#f4eef9;--line:#e8dfed}
body {background:#faf9fc;color:var(--ink)}
.visually-hidden {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.catalog-toolbar {padding:14px max(3vw,18px);gap:30px;border:0}
.toolbar-brand {font-size:24px;letter-spacing:-1.5px}
.catalog-toolbar .search {border:1px solid #dcd5e4;border-radius:24px;box-shadow:none;padding-inline:16px}
.catalog-toolbar #order-open {border-radius:24px;padding:9px 17px}
.basket-icon {width:23px;height:23px;flex:none}
.shop-nav {background:white;display:flex;align-items:center;gap:14px;padding:7px max(3vw,18px) 10px;border-bottom:1px solid var(--line);overflow:auto;scrollbar-width:thin}
.shop-nav .tabs {display:flex;flex:none;gap:6px;padding:0;margin:0;background:none;border:0;box-shadow:none;width:auto}
.shop-nav button,.shop-nav #categories button {border:0;border-radius:22px;background:transparent;color:#48265f;padding:8px 10px;font:650 13px/1.2 Arial;white-space:nowrap;cursor:pointer;width:auto;min-width:auto;min-height:32px;box-shadow:none}
.shop-nav .tabs button.active,.shop-nav button:hover {background:#f2e9f8;color:var(--deep)}
.shop-nav .tabs span {display:none}
.shop-nav #categories {display:flex;flex:none;gap:3px;align-items:center;padding:0;margin:0}
.shop-nav #categories button[aria-pressed=true] {color:var(--deep);text-decoration:underline;text-underline-offset:5px}
main.wrap.store-layout {max-width:1580px;padding:20px max(2.5vw,12px) 0;margin:auto;display:grid;grid-template-columns:minmax(0,1fr);gap:22px}
.catalog-main {min-width:0}
.campaign {position:relative;overflow:hidden;isolation:isolate;border-radius:20px;background:#ffdc86;--hero-ink:#421666;color:var(--hero-ink)}
.campaign[data-theme=milka] {background:#e6d0fa;--hero-ink:#411261}
#campaign-slide {position:relative;display:flex;align-items:stretch;min-height:clamp(240px,23vw,345px);overflow:hidden}
.campaign-copy {position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;width:51%;padding:26px 0 44px clamp(20px,4vw,70px)}
.campaign-copy>span {font:700 12px/1.15 Arial;text-transform:uppercase;letter-spacing:.13em}
.campaign-copy h2 {font-family:'Lilita One','Arial Black',Arial,sans-serif;font-size:clamp(40px,5.7vw,92px);line-height:.96;letter-spacing:-.04em;color:var(--hero-ink);margin:12px 0}
.campaign-copy p {font-size:clamp(14px,1.2vw,18px);line-height:1.35;max-width:36ch;margin:0}
.campaign-action {margin:16px 0 0;border:none;border-radius:22px;background:var(--deep);color:white;font:700 14px Arial;padding:12px 20px;cursor:pointer}
.campaign-action b {margin-left:8px}
.campaign-art {position:absolute;inset:0 0 0 50%;isolation:isolate;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 55% 115%,#ff8c1e 0 55%,transparent 55.3%)}
.campaign[data-theme=milka] .campaign-art {background:radial-gradient(ellipse at 55% 115%,#ac79d2 0 55%,transparent 55.3%)}
.campaign-art img {width:auto;height:85%;max-width:44%;object-fit:contain;transform:rotate(-9deg);border-radius:6px;filter:drop-shadow(2px 8px 8px #31114338)}
.campaign-art img+img {height:88%;margin-left:-5%;transform:rotate(8deg) translateY(1%)}
.season-banner {display:block;width:100%;padding:0;border:0;cursor:pointer;background:#fff6e9}
.season-banner img {width:100%;height:clamp(240px,23vw,345px);object-fit:contain;display:block}
.campaign-pager {position:absolute;z-index:3;bottom:8px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:5px;padding:0 6px;border-radius:20px;background:#fffffff2}
.campaign-pager button,.shelf-head button {background:transparent;border:0;cursor:pointer;color:var(--deep);font:700 22px Arial;min-width:25px}
.campaign-pager .slide-dot {min-width:15px;height:24px;padding:0;position:relative}
.slide-dot::after {content:'';display:block;width:7px;height:7px;border-radius:7px;background:#cab2d8;margin:auto}
.slide-dot[aria-pressed=true]::after {width:15px;background:var(--deep)}
.flyer-shelf {margin:20px 0;min-width:0;scroll-margin-top:85px}
.shelf-head,.shelf-head>div {display:flex;align-items:center;justify-content:space-between;gap:6px}
.shelf-head {margin-bottom:9px}
.shelf-head h2,.result-heading h2 {font:800 clamp(21px,2vw,32px)/1.1 Arial;letter-spacing:-.045em;color:var(--ink);margin:0}
.shelf-head button {border:1px solid #dfd3e7;border-radius:50%;width:32px;height:32px;line-height:1;background:white}
.flyer-track {display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 24px)/3);gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.flyer-tile {scroll-snap-align:start;position:relative;isolation:isolate;display:flex;gap:12px;align-items:center;text-align:left;width:100%;height:145px;overflow:hidden;border:0;border-radius:14px;padding:10px 14px;background:#492075;color:white;cursor:pointer;text-decoration:none;font:inherit}
.flyer-tile:nth-child(3n+2) {background:#f3ce75;color:#361642}
.flyer-tile:nth-child(3n) {background:#dfc6f5;color:#371152}
.shelf-art {display:block;flex:none;width:34%;height:100%;position:relative;transform:rotate(-5deg);filter:drop-shadow(0 3px 4px #200b332b)}
.shelf-art .priced-flyer {background:transparent;width:100%;height:100%;margin:0}
.shelf-art img {width:100%;height:100%;object-fit:contain;display:block}
.shelf-copy {display:flex;flex-direction:column;gap:10px;min-width:0}
.shelf-copy strong {font:800 clamp(15px,1.38vw,23px)/1.08 Arial;letter-spacing:-.035em}
.shelf-copy>span {font:700 12px Arial}
#grid>.flyer-shelf {grid-column:1/-1;margin:14px 0 20px;padding:16px;background:#f1e7fa;border-radius:16px}
.flyer-shelf.tienda .flyer-tile {background:white;color:var(--deep)}
.store-layout .controls {padding:0}
.store-layout .filter-row {display:flex;justify-content:flex-end;margin:12px 0 0}
.store-layout .result-heading {margin:8px 0}
.price-info {font-size:12px;color:#594667;margin:0 0 12px}
.price-info summary {cursor:pointer;width:fit-content}
#grid .card {border:1px solid var(--line);border-radius:15px;box-shadow:none;background:white}
#grid .card:hover {border-color:#c9afd9}
#grid:not(.offers-grid) .photo {background:white}
#order-panel[open] {border:1px solid var(--line);border-radius:17px;background:white;color:var(--ink);padding:20px;margin:0;max-height:calc(100dvh - 98px)}
.order-head {padding-bottom:14px;border-bottom:1px solid var(--line)}
.order-head h2 {font:800 25px Arial;letter-spacing:-.05em}
#order-lines:empty {display:none}
#empty-basket:not([hidden]) {display:grid;justify-items:center;text-align:center;gap:9px;padding:32px 4px;color:var(--deep)}
#empty-basket .basket-icon {background:#f3eaf9;width:64px;height:64px;padding:12px;border-radius:20px;box-sizing:border-box}
#empty-basket p {font-size:13px;margin:0;color:#604971}
#order-form label {font-size:13px}
#order-lines li {flex-wrap:wrap}
@media(min-width:1100px){
 .cart-docked main.store-layout {grid-template-columns:minmax(0,1fr) clamp(245px,20vw,310px)}
 #order-panel[open] {position:sticky;inset:auto;top:83px;align-self:start;width:100%;max-width:none}
 .cart-docked #grid {grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:1099px){
 #order-panel[open] {position:fixed;inset:0 0 0 auto;width:min(395px,94vw);height:100dvh;max-height:100dvh;border-radius:18px 0 0 18px;margin:0;padding-top:24px}
}
@media(max-width:730px){
 main.wrap.store-layout {padding:12px 10px 0}
 .catalog-toolbar {padding:9px 10px;gap:8px}
 .catalog-toolbar #order-open {padding:8px}
 .catalog-toolbar #order-open .basket-icon {width:17px}
 .shop-nav {gap:4px;padding:4px 8px 7px}
 .shop-nav button {font-size:12px}
 #campaign-slide {min-height:210px}
 .campaign-copy {width:54%;padding:17px 0 30px 15px}
 .campaign-copy h2 {font-size:clamp(33px,8vw,50px)}
 .campaign-copy>span {font-size:10px}
 .campaign-copy p {font-size:12px}
 .campaign-action {font-size:12px;margin-top:10px;padding:9px 12px}
 .campaign-art {left:54%}
 .campaign-art img {max-width:56%;height:73%}
 .campaign-art img+img {max-width:61%;margin-left:-17%;height:77%}
 .flyer-track {grid-auto-columns:min(270px,77%);gap:9px}
 .flyer-tile {height:115px}
 .flyer-shelf {margin:16px 0}
 .season-banner img {height:235px}
}
@media(prefers-reduced-motion:no-preference){.campaign-copy,.campaign-art img {animation:campaign-in .24s ease-out}@keyframes campaign-in{from{opacity:.55}to{opacity:1}}}
.shelf-art {display:grid;place-items:center}
.poster-thumb {display:block;height:100%;max-width:100%;aspect-ratio:160/250;background-image:url("assets/miniaturas-keuken.webp");background-size:700% 600%;border-radius:3px}
.shelf-copy small {font-size:13px;line-height:1.18}
.keuken .flyer-tile:nth-child(-n+3) .shelf-copy strong {font-size:clamp(24px,2.6vw,42px);letter-spacing:-.055em}
.keuken .flyer-tile:nth-child(2) {background:#48236e;color:white}
.keuken .flyer-tile:first-child {background:#f9ce79;color:#40185e}
.keuken .flyer-tile:nth-child(3) {background:#e3c8f5;color:#40185e}
.campaign-art img:only-child {max-width:90%;height:90%;transform:rotate(7deg);filter:drop-shadow(7px 10px 0 #58206d30)}
.campaign-art::before {content:'';position:absolute;width:70%;height:145%;left:22%;top:7%;z-index:-1;border:14px solid #ffffff45;border-radius:50%;transform:rotate(36deg)}
.result-options {display:flex;align-items:center;gap:12px}
.store-layout .result-options .filter-row {margin:0}
.store-layout .result-heading {gap:8px;flex-wrap:wrap}
.store-layout .price-info {margin:4px 0 14px}
@media(max-width:600px){.result-options {gap:6px}.result-options .channel {font-size:0}.result-options .channel select {font-size:12px}.result-options #count{font-size:12px}}