:root { --container: 1240px; }
.container { width: min(calc(100% - 40px), var(--container)); margin-inline: auto; }
.utility-bar { padding: 0; background: var(--marassina-green-dark); color: #dfe9e1; font-size: 11px; }
.utility-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.utility-inner a { color: #fff; text-decoration: none; }
.site-header { position: sticky; top: 0; z-index: 100; background: rgba(248, 246, 240, .86); backdrop-filter: saturate(180%) blur(14px); -webkit-backdrop-filter: saturate(180%) blur(14px); border-bottom: 1px solid var(--marassina-border); transition: background .3s ease, border-color .3s ease; }
.header-main { min-height: 80px; display: flex; align-items: center; gap: 36px; transition: min-height .25s ease; }
.site-branding { display: flex; align-items: center; }
.site-title { color: var(--marassina-green); font-family: Georgia, serif; font-size: 28px; font-weight: 700; letter-spacing: -.04em; text-decoration: none; transition: color .3s ease; }
.site-title span { color: var(--marassina-pink); }
.custom-logo { max-height: 50px; width: auto; }
.desktop-navigation { display: flex; flex: 1 1 auto; align-items: center; gap: 28px; }
.desktop-navigation > ul, .desktop-navigation > .menu-primary-container > ul { display: flex; gap: 28px; padding: 0; margin: 0; list-style: none; }
.desktop-navigation > .menu-primary-container { display: block; }
.desktop-navigation a { color: var(--marassina-green); font-size: 12px; font-weight: 700; letter-spacing: .07em; text-decoration: none; text-transform: uppercase; transition: color .2s ease; }
.desktop-navigation a:hover { color: var(--marassina-pink); }
.header-tools { position: relative; display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-left: auto; }
.header-search-toggle { border: 0; background: transparent; font: inherit; cursor: pointer; }
.search-overlay { position: fixed; inset: 0; z-index: 200; display: flex; align-items: flex-start; justify-content: center; padding-top: min(220px, 18vh); padding-bottom: 60px; overflow-y: auto; background: rgba(248, 246, 240, .98); opacity: 0; visibility: hidden; transform: translateY(-10px); transition: opacity .22s ease, transform .22s ease, visibility .22s ease; }
html.search-open, html.search-open body { overflow: hidden; }
.search-overlay.is-open { opacity: 1; visibility: visible; transform: translateY(0); }
.search-overlay-close { position: absolute; top: 32px; right: max(24px, calc((100% - var(--container)) / 2)); width: 40px; height: 40px; border: 0; background: transparent; color: var(--marassina-green); font-size: 30px; line-height: 1; cursor: pointer; }
.search-overlay-inner { width: min(720px, calc(100% - 48px)); }
.search-overlay form { display: flex; align-items: center; gap: 16px; padding-bottom: 16px; border-bottom: 2px solid var(--marassina-green); }
.search-overlay input[type="search"] { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--marassina-green); font-family: Georgia, serif; font-size: clamp(22px, 4vw, 36px); }
.search-overlay input[type="search"]::placeholder { color: var(--marassina-muted); }
.search-overlay form button { flex: 0 0 auto; border: 0; background: transparent; color: var(--marassina-green); cursor: pointer; }
.search-overlay form button svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
.search-overlay-label { display: block; margin: 30px 0 14px; color: var(--marassina-muted); font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.search-overlay-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.search-overlay-chip { padding: 9px 18px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-pill); color: var(--marassina-green); font-size: 13px; text-decoration: none; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.search-overlay-chip:hover { background: var(--marassina-green); border-color: var(--marassina-green); color: #fff; }
.search-overlay-results:empty { display: none; }
.search-results-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 30px; }
.search-result-card { display: flex; flex-direction: column; gap: 8px; color: var(--marassina-green); text-decoration: none; }
.search-result-card img { width: 100%; aspect-ratio: 1; border-radius: 10px; object-fit: cover; background: var(--marassina-sand); }
.search-result-title { display: -webkit-box; overflow: hidden; font-size: 13px; font-weight: 600; line-height: 1.3; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.search-result-price { color: var(--marassina-pink); font-size: 12px; font-weight: 700; }
.search-results-more { display: inline-block; margin-top: 22px; color: var(--marassina-green); font-size: 12px; font-weight: 700; letter-spacing: .06em; text-decoration: underline; text-transform: uppercase; }
.search-results-empty { margin-top: 24px; color: var(--marassina-muted); font-size: 14px; }
.primary-navigation { display: none; }
.primary-navigation ul, .footer-bottom ul { display: flex; gap: 24px; padding: 0; margin: 0; list-style: none; }
.primary-navigation a, .footer-bottom a { color: var(--marassina-green); font-size: 12px; font-weight: 700; letter-spacing: .06em; text-decoration: none; text-transform: uppercase; }
.primary-navigation a:hover, .footer-bottom a:hover, .text-link:hover { color: var(--marassina-pink); }
.language-switcher { display: inline-flex; align-items: center; gap: 5px; }
.language-switcher a { padding: 5px 6px; border: 1px solid transparent; border-radius: var(--marassina-radius-pill); color: var(--marassina-muted); font-size: 9px; font-weight: 750; letter-spacing: .08em; text-decoration: none; transition: color .2s ease; }
.language-switcher a:hover, .language-switcher a.is-current { border-color: var(--marassina-pink); color: var(--marassina-pink); }
/* Reusable icon-button + hover tooltip. Use on any small icon control
   (header actions, future toolbar icons, etc.): wrap the icon in
   .icon-button-icon and add a .icon-tooltip span with the label. */
.icon-button { position: relative; display: grid; width: 40px; height: 40px; padding: 0; place-items: center; border-radius: 12px; color: var(--marassina-green); text-decoration: none; transition: background .2s ease, color .2s ease; }
.icon-button:hover, .icon-button:focus-visible { background: rgba(224,234,226,.65); color: var(--marassina-pink); }
.icon-button-icon { position: relative; display: grid; width: 25px; height: 25px; place-items: center; line-height: 1; }
.icon-button-icon svg { display: block; width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.55; }
.icon-tooltip { position: absolute; top: calc(100% + 8px); left: 50%; z-index: 5; padding: 6px 10px; transform: translateX(-50%) translateY(-4px); border-radius: 8px; background: var(--marassina-ink); color: #fff; font-family: inherit; font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .15s ease, transform .15s ease; }
.icon-button:hover .icon-tooltip, .icon-button:focus-visible .icon-tooltip { opacity: 1; transform: translateX(-50%) translateY(0); }
/* line-height:1 — without it the font's own ascent/descent metrics at this
   small size nudge the digit off the grid-centered position; min-width
   (rather than a fixed width) plus small horizontal padding keeps 2-digit
   counts (10+) from looking cramped/off-center too, since they're wider
   than the single-digit case this was tuned for. */
.cart-count { position: absolute; top: -7px; right: -9px; display: grid; min-width: 17px; height: 17px; padding: 0 3px; box-sizing: border-box; border-radius: 999px; background: var(--marassina-pink); color: #fff; place-items: center; font-size: 10px; line-height: 1; }
.menu-toggle { display: none; }

.has-transparent-header .site-header { position: fixed; inset-inline: 0; top: 0; z-index: 100; background: transparent; border-bottom-color: transparent; }
.admin-bar .site-header { top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 782px) { .admin-bar .site-header { top: var(--wp-admin--admin-bar--height, 46px); } }
@media (max-width: 600px) { .admin-bar .site-header { top: 0; } } /* WP's admin bar scrolls away on phones (position:absolute) */
.has-transparent-header.is-scrolled .site-header, .has-transparent-header.menu-is-open .site-header { background: rgba(248, 246, 240, .86); backdrop-filter: saturate(180%) blur(14px); -webkit-backdrop-filter: saturate(180%) blur(14px); border-bottom-color: var(--marassina-border); }
.is-scrolled .header-main { min-height: 60px; }
.has-transparent-header:not(.is-scrolled):not(.menu-is-open) .site-title,
.has-transparent-header:not(.is-scrolled):not(.menu-is-open) .desktop-navigation a,
.has-transparent-header:not(.is-scrolled):not(.menu-is-open) .header-action,
.has-transparent-header:not(.is-scrolled):not(.menu-is-open) .header-search-toggle { color: #fff; }
.has-transparent-header:not(.is-scrolled):not(.menu-is-open) .header-action:hover { background: rgba(255,255,255,.16); color: var(--marassina-pink); }
.has-transparent-header:not(.is-scrolled):not(.menu-is-open) .menu-toggle span:not(.screen-reader-text) { background: #fff; }
.nav-category-menu { position: relative; align-self: stretch; display: flex; align-items: center; }
.nav-category-trigger { display: inline-flex; align-items: center; gap: 11px; height: 42px; padding: 0 14px 0 12px; margin-left: -12px; border: 0; border-radius: 12px; background: transparent; color: var(--marassina-green); font: inherit; font-size: 12px; font-weight: 700; letter-spacing: .09em; line-height: 1; text-transform: uppercase; cursor: pointer; transition: color .2s ease, background .2s ease; }
.nav-category-trigger:hover, .nav-category-menu.is-open .nav-category-trigger { background: rgba(224,234,226,.65); color: var(--marassina-pink); }
.menu-burger { position: relative; display: block; flex: 0 0 auto; width: 18px; height: 14px; }
.menu-burger i { position: absolute; left: 0; display: block; width: 100%; height: 2px; border-radius: 2px; background: currentColor; transition: transform .22s ease, opacity .18s ease, top .22s ease; }
.menu-burger i:nth-child(1) { top: 0; }
.menu-burger i:nth-child(2) { top: 6px; width: 70%; }
.menu-burger i:nth-child(3) { top: 12px; }
.nav-category-menu.is-open .menu-burger i:nth-child(1) { top: 6px; transform: rotate(45deg); }
.nav-category-menu.is-open .menu-burger i:nth-child(2) { opacity: 0; }
.nav-category-menu.is-open .menu-burger i:nth-child(3) { top: 6px; transform: rotate(-45deg); }
.has-transparent-header:not(.is-scrolled):not(.menu-is-open) .nav-category-trigger { color: #fff; }
.category-mega-menu { position: absolute; top: 100%; left: 0; z-index: 20; display: grid; grid-template-columns: 150px 1fr; width: min(820px, calc(100vw - 40px)); max-height: min(620px, calc(100vh - 170px)); overflow-y: auto; padding: 20px; visibility: hidden; opacity: 0; background: #fff; border-top: 3px solid var(--marassina-pink); box-shadow: 0 18px 40px rgba(14,43,37,.18); transform: translateY(8px); transition: opacity .18s ease, transform .18s ease, visibility .18s ease; }
.nav-category-menu.is-open .category-mega-menu { visibility: visible; opacity: 1; transform: translateY(0); }
.category-mega-intro { display: flex; flex-direction: column; gap: 7px; padding-right: 20px; border-right: 1px solid var(--marassina-border); }
.category-mega-intro .eyebrow { margin-bottom: 0; }
.category-mega-intro strong { color: var(--marassina-green); font-family: Georgia, serif; font-size: 19px; font-weight: 400; line-height: 1.15; text-transform: none; }
.category-mega-intro a { color: var(--marassina-pink); font-size: 10px; letter-spacing: .05em; text-transform: uppercase; }
.category-mega-main { display: flex; flex-direction: column; gap: 16px; padding-left: 22px; min-width: 0; }
.category-mega-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; align-items: start; }
.category-mega-column { min-width: 0; }
.category-mega-title { display: flex; align-items: center; gap: 9px; margin-bottom: 7px; color: var(--marassina-green) !important; font-size: 13px !important; }
.category-mega-thumb { flex: 0 0 auto; width: 28px; height: 28px; border-radius: 7px; object-fit: cover; background: var(--marassina-sand); }
.category-mega-thumb-fallback { display: grid; place-items: center; background: var(--marassina-green-soft); color: var(--marassina-green); font-family: Georgia, serif; font-size: 12px; text-transform: uppercase; }
.category-mega-column ul { display: block; }
.category-mega-column li { margin: 4px 0; }
.category-mega-column li a { color: var(--marassina-muted) !important; font-size: 12px !important; font-weight: 400 !important; letter-spacing: 0 !important; text-transform: none !important; }
.category-mega-column li a:hover { color: var(--marassina-pink) !important; }
.category-mega-simple { padding-top: 14px; border-top: 1px solid var(--marassina-border); }
.category-mega-simple-label { display: block; margin-bottom: 9px; color: var(--marassina-muted); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.category-mega-simple-list { display: flex; flex-wrap: wrap; gap: 8px; }
.category-mega-simple-list a { padding: 6px 14px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-pill); color: var(--marassina-green); font-size: 12px; text-decoration: none; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.category-mega-simple-list a:hover { background: var(--marassina-green); border-color: var(--marassina-green); color: #fff; }
.nav-cart strong { display: inline-grid; min-width: 20px; height: 20px; margin-left: 6px; padding: 0 4px; box-sizing: border-box; border-radius: 999px; background: var(--marassina-pink); place-items: center; font-size: 10px; line-height: 1; }
.nav-actions { display: flex; align-items: center; gap: 18px; }
.nav-checkout { display: inline-flex; align-items: center; gap: 9px; min-height: 34px; padding: 0 15px; border: 1px solid rgba(255,255,255,.28); border-radius: var(--marassina-radius-pill); background: var(--marassina-pink); color: #fff !important; font-size: 10px !important; letter-spacing: .07em; transition: background .2s ease, transform .2s ease; }
.nav-checkout:hover { background: #fff; color: var(--marassina-green) !important; transform: translateY(-1px); }
.promo-bar { display: none; }
.announcement-bar { border-bottom: 1px solid rgba(23, 63, 53, .12); background: var(--ann-bg, var(--marassina-green)); color: var(--ann-color, #fff); font-size: var(--ann-size, 13px); font-weight: 500; line-height: 1.2; }
.announcement-viewport { width: 100%; overflow: hidden; }
.announcement-track { display: flex; width: max-content; min-width: 100%; will-change: transform; }
.announcement-group { display: flex; flex: 0 0 auto; }
.announcement-item { display: inline-flex; align-items: center; gap: .65em; min-height: var(--ann-height, 40px); padding: 0 clamp(20px, 3vw, 36px); color: inherit; white-space: nowrap; text-decoration: none; }
a.announcement-item:hover, a.announcement-item:focus-visible { text-decoration: underline; text-underline-offset: 3px; }
.announcement-icon { flex: 0 0 auto; width: 1.25em; height: 1.25em; color: var(--ann-icon, currentColor); vertical-align: 0; }
.announcement-bar.is-scrolling .announcement-track { animation: marassina-announcement-scroll var(--ann-duration, 40s) linear infinite var(--ann-direction, normal); }
.announcement-bar.is-scrolling.pause-on-hover:hover .announcement-track, .announcement-bar.is-scrolling:focus-within .announcement-track { animation-play-state: paused; }
.home-ticker-wrap { position: relative; margin-block: calc(-64px + (clamp(40px, 6vw, 72px) - 41px) / 2) calc((clamp(40px, 6vw, 72px) + 41px) / 2); }
.home-ticker { border-bottom: 0; font-weight: 600; }
.home-ticker .announcement-item { gap: .7em; padding-inline: clamp(24px, 3vw, 40px); }
.announcement-bar.is-static .announcement-track { width: 100%; justify-content: center; }
.announcement-bar.is-static .announcement-group { flex-wrap: wrap; justify-content: center; }
@keyframes marassina-announcement-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.site-main { min-height: 55vh; }
.hero { overflow: hidden; background: var(--marassina-green); color: #fff; }
.hero-grid { min-height: 570px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 40px; }
.hero h1, h1, h2, h3 { margin: 0 0 20px; color: var(--marassina-green); font-family: Georgia, serif; font-weight: 400; letter-spacing: -.04em; line-height: 1.05; }
.hero h1 { max-width: 540px; color: #fff; font-size: clamp(48px, 7vw, 92px); }
.hero-copy { max-width: 430px; color: #dfe9e1; font-size: 18px; }
.eyebrow { margin: 0 0 14px; color: var(--marassina-pink); font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.hero .eyebrow { color: #f0afcd; }
.button { display: inline-block; padding: 13px 22px; background: var(--marassina-green); color: #fff; border: 1px solid var(--marassina-green); border-radius: var(--marassina-radius-pill); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; transition: transform .2s ease, background .2s ease, box-shadow .2s ease; }
.button:hover { background: var(--marassina-green-dark); color: #fff; transform: translateY(-2px); }
.button-light { background: #fff; border-color: #fff; color: var(--marassina-green); }
.button-light:hover { background: var(--marassina-green-soft); color: var(--marassina-green); }
.hero-art { position: relative; min-height: 440px; }
.hero-product-stack { position: absolute; inset: 12px 0 0 35px; }
.hero-product-card { position: absolute; display: block; overflow: hidden; border: 8px solid rgba(255,255,255,.94); border-radius: 28px; background: #fff; box-shadow: 0 28px 60px rgba(4,24,19,.3); transition: transform .25s ease, box-shadow .25s ease; }
.hero-product-card:hover { z-index: 4; box-shadow: 0 34px 74px rgba(4,24,19,.38); }
.hero-product-card img { display: block; width: 100%; height: 100%; margin: 0; object-fit: cover; }
.hero-product-card-1 { top: 15px; right: 72px; z-index: 2; width: 290px; height: 350px; transform: rotate(3deg); }
.hero-product-card-1:hover { transform: rotate(1deg) translateY(-8px); }
.hero-product-card-2 { bottom: 6px; left: 4px; z-index: 3; width: 215px; height: 245px; transform: rotate(-7deg); }
.hero-product-card-2:hover { transform: rotate(-4deg) translateY(-8px); }
.hero-product-card-3 { right: 0; bottom: 8px; z-index: 1; width: 178px; height: 205px; transform: rotate(8deg); }
.hero-product-card-3:hover { transform: rotate(5deg) translateY(-8px); }
.hero-media { position: absolute; inset: 0; overflow: hidden; border-radius: var(--marassina-radius-lg); box-shadow: var(--marassina-shadow-hover); background: var(--marassina-green-dark); }
.hero-media-image { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; object-fit: cover; }
.hero-media-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .6s ease; }
.hero-media.has-video .hero-media-video { opacity: 1; }
.hero-media.has-video .hero-media-image { opacity: 0; transition: opacity .6s ease; }
.hero-fullbleed { position: relative; display: flex; align-items: flex-end; min-height: 100vh; min-height: 100dvh; color: #fff; }
.hero-fullbleed .hero-media { position: absolute; inset: 0; border-radius: 0; box-shadow: none; }
.hero-fullbleed .hero-scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14, 43, 37, .6) 0%, rgba(14, 43, 37, .08) 18%, rgba(14, 43, 37, 0) 45%, rgba(14, 43, 37, .42) 68%, rgba(14, 43, 37, .82) 100%); pointer-events: none; }
.hero-overlay-content { position: relative; z-index: 2; padding-block: 0 132px; }
.hero-overlay-content .eyebrow { color: #f0afcd; }
.hero-overlay-content h1 { max-width: 620px; color: #fff; font-size: clamp(44px, 6vw, 84px); }
.hero-overlay-content .hero-copy { max-width: 460px; color: #dfe9e1; }
.hero-orb { position: absolute; display: block; border-radius: 50%; }
.hero-orb-one { top: 8%; right: 8%; width: 360px; height: 360px; background: radial-gradient(circle at 35% 30%, #f8e1b7 0 8%, #d98962 45%, #b94762 100%); box-shadow: -25px 35px 0 rgba(255,255,255,.05); }
.hero-orb-two { bottom: 4%; left: 5%; width: 210px; height: 210px; border: 1px solid rgba(255,255,255,.35); background: rgba(255,255,255,.06); }
.hero-stamp { position: absolute; right: 9%; bottom: 10%; z-index: 5; display: grid; width: 100px; height: 100px; padding: 16px; border: 1px solid #fff; border-radius: 50%; background: rgba(23,63,53,.86); place-items: center; color: #fff; font-family: Georgia, serif; font-size: 16px; line-height: 1.1; text-align: center; transform: rotate(-12deg); }
.section { padding: 105px 0; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 34px; }
.section-heading h2, .editorial-band h2 { font-size: clamp(34px, 5vw, 58px); }
.home-products-heading { margin-bottom: 22px; }
.home-product-tabs { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0 0 32px; overflow-x: auto; scrollbar-width: none; }
.home-product-tabs::-webkit-scrollbar { display: none; }
.home-product-tab { flex: 0 0 auto; padding: 10px 16px; border: 1px solid transparent; border-radius: var(--marassina-radius-pill); background: transparent; color: var(--marassina-muted); cursor: pointer; font-size: 11px; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.home-product-tab:hover, .home-product-tab:focus-visible { border-color: var(--marassina-border); color: var(--marassina-green); outline: none; }
.home-product-tab.is-active { background: var(--marassina-green); color: #fff; }
.home-products-panel { min-height: 420px; }
.home-products-panel.products { display: grid !important; }
.home-products-panel ul.products { display: contents; }
.home-products-loading { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; width: 100%; }
.home-products-loading span { display: block; aspect-ratio: .82; border-radius: 12px; background: linear-gradient(100deg, rgba(224,234,226,.55) 20%, rgba(255,255,255,.85) 40%, rgba(224,234,226,.55) 60%); background-size: 220% 100%; animation: home-products-shimmer 1.2s linear infinite; }
@keyframes home-products-shimmer { to { background-position: -220% 0; } }
.home-products-panel li.product { animation: home-product-in .35s ease both; }
.home-products-more { display: flex; align-items: center; justify-content: center; gap: 10px; min-width: 210px; margin: 34px auto 0; padding: 12px 22px; border: 1px solid var(--marassina-green); border-radius: var(--marassina-radius-pill); background: transparent; color: var(--marassina-green); cursor: pointer; font-size: 11px; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; transition: background .2s ease, color .2s ease, transform .2s ease; }
.home-products-more:hover:not(:disabled) { background: var(--marassina-green); color: #fff; transform: translateY(-2px); }
.home-products-more:disabled { cursor: wait; opacity: .6; }
.home-products-more[hidden] { display: none; }
@keyframes home-product-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.text-link { color: var(--marassina-green); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }
.products { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: stretch; gap: 24px; padding: 0 !important; margin: 0 !important; }
.products::before, .products::after { display: none !important; }
.products li.product { position: relative; display: flex; flex-direction: column; float: none !important; width: auto !important; min-width: 0; height: 100%; padding: 14px 14px 18px; margin: 0 !important; border: 1px solid rgba(23,63,53,.07); border-radius: var(--marassina-radius-lg); background: #fff; box-shadow: 0 1px 2px rgba(23,63,53,.03); transition: transform .3s cubic-bezier(.22,1,.36,1), opacity .22s ease, box-shadow .3s cubic-bezier(.22,1,.36,1), border-color .3s ease; }
/* Card is a size container so the qty stepper can drop out when the card is too narrow to fit stepper + button on one row. */
.products li.product { container-type: inline-size; }
/* WC's ".woocommerce ul.products li.product { padding: 0 }" out-specifies the
   rule above, but only on pages wrapped in .woocommerce (shop, categories,
   related) — the homepage grid isn't, so cards looked different there. */
.woocommerce ul.products li.product { padding: 14px 14px 18px; }
.woocommerce ul.products li.product .onsale { top: 12px; left: 12px; right: auto; margin: 0; }
.products li.product .woocommerce-loop-product__title, .woocommerce ul.products li.product .woocommerce-loop-product__title { margin: 0 0 4px; }
.woocommerce ul.products li.product .loop-buy-row .button { margin-top: 0; }
.products li.product .loop-buy-row { display: flex; align-items: center; gap: 8px; margin-top: 20px; }
.products li.product .loop-buy-row .marassina-qty { order: 2; flex: 0 0 auto; height: 44px; }
.products li.product .loop-buy-row .marassina-qty button { width: 30px; }
.products li.product .loop-buy-row .marassina-qty input.qty { width: 28px; }
.products li.product .loop-buy-row .button { order: 1; flex: 1 1 0; width: auto; min-width: 0; margin-top: 0; padding: 0 10px; }
@container (max-width: 249px) { .products li.product .loop-buy-row .marassina-qty { display: none; } }
.woocommerce-cart .cart-collaterals .cross-sells li.product .loop-buy-row { display: none; }
.products li.product .product-thumb-frame { position: relative; display: block; flex: 0 0 auto; overflow: hidden; border-radius: 12px; background: var(--marassina-sand); box-shadow: 0 2px 4px rgba(23,63,53,.06), 0 8px 24px -14px rgba(23,63,53,.18); transition: box-shadow .3s cubic-bezier(.22,1,.36,1); }
.products li.product .product-thumb-frame img { display: block; width: 100%; height: auto; margin: 0 !important; transition: transform .5s cubic-bezier(.22,1,.36,1); }

/* Feature badge (tag icon + tag name) floating on the product image — see
   marassina_loop_feature_badge() in functions.php. Icon size/color are fixed
   here regardless of which of the ~19 curated icons an admin picks. */
.products li.product .product-feature-badge { position: absolute; z-index: 2; top: 50%; right: 10px; width: 96px; max-width: 40%; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 10px 12px; border-radius: 34px 10px 34px 10px; background: rgba(248,246,240,.94); box-shadow: 0 8px 22px rgba(23,63,53,.18); text-align: center; transform: translateY(-50%); }
.products li.product .product-feature-badge-icon { display: grid; place-items: center; color: var(--marassina-green); }
.products li.product .product-feature-badge-icon svg { width: 22px; height: 22px; }
.products li.product .product-feature-badge-icon .fa-icon { fill: var(--marassina-green); }
.products li.product .product-feature-badge-icon .news-doodle { opacity: 1; stroke-width: 2; }
.products li.product .product-feature-badge-label { display: -webkit-box; overflow: hidden; color: var(--marassina-green); font-size: 12.5px; font-weight: 500; line-height: 1.25; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.products li.product .product-feature-badge::after { content: ''; display: block; width: 28px; height: 2px; margin-top: 2px; border-radius: var(--marassina-radius-pill); background: var(--marassina-pink); }
@container (max-width: 249px) { .products li.product .product-feature-badge { right: 6px; width: 76px; padding: 10px 7px 9px; gap: 4px; border-radius: 26px 8px 26px 8px; } .products li.product .product-feature-badge-icon svg { width: 16px; height: 16px; } .products li.product .product-feature-badge-label { font-size: 10.5px; } .products li.product .product-feature-badge::after { width: 20px; } }

@media (hover: hover) {
  .products li.product:hover { border-color: rgba(23,63,53,.12); box-shadow: 0 20px 40px -20px rgba(23,63,53,.22); transform: translateY(-6px); }
  .products li.product:hover .product-thumb-frame { box-shadow: 0 2px 4px rgba(23,63,53,.08), 0 18px 40px -16px rgba(23,63,53,.32); }
  .products li.product:hover .product-thumb-frame img { transform: scale(1.05); }
}
.products li.product > a.woocommerce-LoopProduct-link { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; text-decoration: none; }
.products li.product a img { aspect-ratio: 1; margin: 0 0 2px !important; border-radius: 12px; object-fit: cover; background: var(--marassina-sand); }
.products li.product .loop-card-accent { display: block; width: 24px; height: 2px; margin: 16px 0 4px; border-radius: var(--marassina-radius-pill); background: var(--marassina-pink); }
.products li.product .woocommerce-loop-product__title { display: block; min-height: 2.6em; overflow: visible; padding: 6px 0 0 !important; color: var(--marassina-green); font-family: Georgia, serif; font-size: 17px !important; font-weight: 500; line-height: 1.3; }
.products li.product .price { min-height: 24px; margin: auto 0 0 !important; display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; color: var(--marassina-pink) !important; font-size: 20px !important; font-weight: 700 !important; }
.products li.product .price del { order: -1; color: var(--marassina-muted) !important; font-size: 13px !important; font-weight: 500 !important; opacity: .75; }
.products li.product .price del .woocommerce-Price-amount, .products li.product .price del bdi { color: inherit; }
.products li.product .price ins { font-weight: 700 !important; text-decoration: none; }
.products li.product .loop-card-excerpt { margin: 6px 0 0; min-height: 2.6em; color: var(--marassina-muted); font-size: 12px; line-height: 1.3; display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.products li.product:not(:has(.price))::after { content: ''; display: block; min-height: 24px; }
/* Own two-layer star rating (see marassina_loop_rating() in functions.php):
   a grey "track" row of 5 stars, with a gold "fill" row of the same 5 stars
   laid exactly on top and clipped to the rating's percentage width. No font
   dependency, so nothing to race/fail to load. */
/* .star-rating's own children are both position:absolute (out of flow), so
   the box needs an explicit width/height reserved for them — without it the
   box collapses to 0×0 and .loop-rating-count ends up overlapping the
   (invisible-width) stars instead of sitting right after them. Wrapping row
   also kills the stray inline-block gap above the stars (a baseline/
   line-height artifact of sitting the star box directly in normal flow). */
.products li.product .loop-rating-row { display: flex; align-items: center; gap: 6px; min-height: 18px; margin: 0 0 6px; line-height: 1; }
.products li.product .star-rating { position: relative; width: 74px; height: 14px; flex: 0 0 auto; }
/* WooCommerce's own core CSS still targets ".star-rating" with a
   font-icon ::before ("sssss"/"SSSSS" in its "WooCommerce" icon font) even
   though we build the loop stars ourselves from SVGs below — those two
   layers stack at the same position, and WC's version (its filled-star
   pseudo-element sets no color, so it inherits plain body-text ink) paints
   on top of our gold SVGs. Kill WC's glyphs here so only ours show. */
.products li.product .star-rating::before, .products li.product .star-rating span::before { content: none; }
/* WC core also gives every span inside .star-rating padding-top:1.5em (its
   trick to push the span's own text out of view) — that shoved our SVG
   stars 20px down, where overflow:hidden clipped them away entirely. */
.products li.product .star-rating span { float: none; padding-top: 0; }
.woocommerce .products li.product .star-rating { margin: 0; float: none; }
.products li.product .star-rating-track, .products li.product .star-rating-fill { position: absolute; top: 0; left: 0; display: flex; gap: 1px; overflow: hidden; white-space: nowrap; }
.products li.product .star-rating-fill { width: 0; }
.products li.product .star-rating .fa-icon { width: 14px; height: 14px; flex: 0 0 auto; }
.products li.product .star-rating-track .fa-icon { fill: var(--marassina-border); }
.products li.product .star-rating-fill .fa-icon { fill: #e5a51b; }
.products li.product .loop-rating-count { color: var(--marassina-muted); font-size: 12px; font-weight: 600; line-height: 1; }
.products li.product .button, .products li.product a.added_to_cart { display: flex !important; align-items: center !important; justify-content: center !important; gap: 5px; width: 100%; min-height: 44px; margin-top: 20px; padding: 0 14px; border: 1px solid var(--marassina-green); border-radius: var(--marassina-radius-pill); background: var(--marassina-green); color: #fff; font-size: 11px; font-weight: 750; letter-spacing: .065em; line-height: 1; white-space: nowrap; text-align: center; text-decoration: none; text-transform: uppercase; transition: background .2s ease, transform .2s ease, box-shadow .2s ease; }
.products li.product .button .fa-icon { width: 12px; height: 12px; flex: 0 0 auto; fill: currentColor; }
.products li.product .button:hover, .products li.product a.added_to_cart:hover { background: var(--marassina-pink); border-color: var(--marassina-pink); box-shadow: 0 10px 24px rgba(217,41,120,.2); color: #fff; transform: translateY(-1px); }
.products li.product .button.loading { position: relative; color: transparent !important; pointer-events: none; }
.products li.product .button.loading::after { content: ''; position: absolute; top: 50%; left: 50%; width: 16px; height: 16px; margin: -8px 0 0 -8px; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; animation: marassina-btn-spin .6s linear infinite; }
@keyframes marassina-btn-spin { to { transform: rotate(360deg); } }
.products li.product a.added_to_cart { display: none !important; }
.woocommerce nav.woocommerce-pagination { clear: both; margin: 42px 0 6px; text-align: center; }
.woocommerce nav.woocommerce-pagination ul,
.woocommerce nav.woocommerce-pagination ul li { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 0; margin: 0; border: 0 !important; list-style: none; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span { display: inline-flex; align-items: center; justify-content: center; min-width: 38px; height: 38px; padding: 0 11px; border: 1px solid var(--marassina-border) !important; border-radius: var(--marassina-radius-pill); background: transparent; color: var(--marassina-green); font-size: 12px; font-weight: 750; line-height: 1; text-decoration: none; transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease; }
.woocommerce nav.woocommerce-pagination ul li span.current { border-color: var(--marassina-pink) !important; background: var(--marassina-pink); color: #fff; }
.woocommerce nav.woocommerce-pagination ul li a:hover { border-color: var(--marassina-green) !important; background: var(--marassina-green); color: #fff; transform: translateY(-1px); }
.offers-section { padding-top: 0; padding-bottom: 56px; }
.offers-banner { position: relative; display: flex; align-items: center; min-height: 340px; overflow: hidden; border-radius: var(--marassina-radius-lg); background: var(--marassina-cream); box-shadow: var(--marassina-shadow); }
.offers-banner-media { position: absolute; inset: 0; }
.offers-banner-media img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; margin: 0; object-fit: cover; }
.offers-banner-scrim { position: absolute; inset: 0; background: linear-gradient(90deg, var(--marassina-cream) 0%, rgba(248,246,240,.95) 32%, rgba(248,246,240,.72) 48%, rgba(248,246,240,0) 66%); }
.offers-banner-content { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; max-width: 460px; padding: clamp(28px, 4vw, 44px); }
.offers-banner-content h2 { font-size: clamp(24px, 2.8vw, 34px); }
.offers-banner-content h2 span { display: block; }
.offers-heading-accent { color: var(--marassina-pink); }
.offers-copy { max-width: 380px; margin: 0; color: var(--marassina-muted); font-size: 14px; line-height: 1.5; }
.offers-banner-content .button { margin-top: 4px; padding: 11px 20px; }
.offers-features { display: flex; flex-wrap: wrap; gap: 10px 20px; padding: 0; margin: 16px 0 0; list-style: none; }
.offers-features li { display: flex; align-items: center; gap: 8px; color: var(--marassina-green); font-size: 11px; font-weight: 700; letter-spacing: .04em; }
.offers-feature-icon { display: grid; flex: none; width: 28px; height: 28px; border-radius: 50%; background: rgba(217,41,120,.1); place-items: center; }
.offers-feature-icon .fa-icon { width: 13px; height: 13px; color: var(--marassina-pink); }
.offers-badge { position: absolute; top: 26px; right: 26px; z-index: 2; display: grid; place-items: center; width: 86px; height: 86px; border-radius: 50%; border: 2px solid rgba(255,255,255,.9); background: radial-gradient(circle at 34% 28%, #ea4d96, var(--marassina-pink) 72%); color: #fff; box-shadow: 0 10px 22px rgba(150,15,75,.38), 0 0 0 6px rgba(255,255,255,.28); text-align: center; line-height: 1.15; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }
.offers-badge:hover { transform: scale(1.05); box-shadow: 0 12px 26px rgba(150,15,75,.44), 0 0 0 6px rgba(255,255,255,.36); }
.offers-badge span { font-size: 8px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.offers-badge strong { font-family: Georgia, serif; font-size: 20px; font-weight: 400; }
.offers-stamp { position: absolute; right: 26px; bottom: 18px; z-index: 2; color: var(--marassina-green); font-family: Georgia, serif; font-size: 13px; font-style: italic; text-shadow: 0 2px 14px rgba(255,255,255,.85), 0 0 4px rgba(255,255,255,.7); }
.news-section { position: relative; padding-top: 52px; overflow: hidden; }
.news-doodle { color: var(--marassina-green); opacity: .3; }
.home-heading-row, .news-heading-row { position: relative; margin-bottom: 44px; }
.home-heading, .news-heading { max-width: 560px; margin: 0 auto; text-align: center; }
.home-heading .eyebrow, .news-heading .eyebrow { text-align: center; }
.home-heading h2, .news-heading h2 { position: relative; margin-bottom: 20px; padding-bottom: 20px; }
.home-heading h2 { font-size: clamp(28px, 3.4vw, 40px); }
.home-heading h2::after, .news-heading h2::after { content: ''; position: absolute; bottom: 0; left: 50%; width: 46px; height: 3px; border-radius: var(--marassina-radius-pill); background: var(--marassina-pink); transform: translateX(-50%); }
.home-heading-link { position: absolute; right: 0; bottom: 6px; }
.home-heading-intro, .news-intro { margin: 0; color: var(--marassina-muted); font-size: 15px; }
.news-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.news-card { position: relative; display: flex; flex-direction: column; overflow: hidden; border-radius: var(--marassina-radius); background: #fff; box-shadow: var(--marassina-shadow); transition: transform .25s ease, box-shadow .25s ease; }
.news-card:hover { transform: translateY(-5px); box-shadow: var(--marassina-shadow-hover); }
.news-card-media { position: relative; display: block; aspect-ratio: 4/3; overflow: hidden; background: var(--marassina-sand); }
.news-card-media img { display: block; width: 100%; height: 100%; margin: 0; object-fit: cover; transition: transform .4s ease; }
.news-card:hover .news-card-media img { transform: scale(1.06); }
.news-card-media-fallback { display: block; width: 100%; height: 100%; background: linear-gradient(135deg, var(--marassina-green-soft), var(--marassina-sand)); }
.news-card-body { display: flex; flex-direction: column; align-items: flex-start; flex: 1; padding: 22px 24px 26px; }
.news-card-tag { margin-bottom: 10px; color: var(--marassina-muted); font-size: 10px; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; }
.news-card h3 { margin: 0 0 10px; font-size: 19px; line-height: 1.3; }
.news-card h3 a { color: var(--marassina-green); text-decoration: none; }
.news-card h3 a:hover { color: var(--marassina-pink); }
.news-card-excerpt { display: -webkit-box; overflow: hidden; margin: 0 0 16px; color: var(--marassina-muted); font-size: 14px; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.news-card .text-link { position: relative; z-index: 1; margin-top: auto; }
.news-doodle-card { position: absolute; right: 12px; bottom: 12px; width: 52px; height: 52px; }
.news-archive-link { display: flex; align-items: center; justify-content: center; gap: 8px; width: max-content; min-width: 240px; margin: 40px auto 0; padding: 13px 26px; border: 1px solid var(--marassina-green); border-radius: var(--marassina-radius-pill); color: var(--marassina-green); font-size: 11px; font-weight: 750; letter-spacing: .07em; text-decoration: none; text-align: center; text-transform: uppercase; transition: background .2s ease, color .2s ease, transform .2s ease; }
.news-archive-link:hover { background: var(--marassina-green); color: #fff; transform: translateY(-2px); }
.content-narrow { max-width: 850px; padding-block: 80px; }
.entry h1, .content-narrow > h1 { font-size: clamp(24px, 3vw, 32px); letter-spacing: -.03em; }
.entry-card { padding: 28px 0; border-bottom: 1px solid var(--marassina-border); }
/* Standard content pages (page.php wraps the_content() in .page-prose) */
.page-prose { margin-top: 28px; color: var(--marassina-ink); line-height: 1.75; }
.page-prose > :first-child { margin-top: 0; }
.page-prose h2, .page-prose h3, .page-prose h4 { margin: 2.2em 0 .6em; color: var(--marassina-green); font-family: Georgia, serif; font-weight: 400; letter-spacing: -.02em; line-height: 1.2; }
.page-prose h2 { font-size: clamp(22px, 2.6vw, 28px); }
.page-prose h3 { font-size: clamp(19px, 2.1vw, 23px); }
.page-prose h4 { font-size: 18px; }
.page-prose p, .page-prose ul, .page-prose ol { margin: 0 0 1.1em; }
.page-prose p:empty { display: none; }
.page-prose ul, .page-prose ol { padding-left: 1.3em; }
.page-prose li { margin-bottom: .4em; }
.page-prose a { color: var(--marassina-pink); text-underline-offset: 3px; }
.page-prose hr { margin: 2.5em 0; border: 0; border-top: 1px solid var(--marassina-border); }
.page-prose blockquote { margin: 2em 0; padding: 18px 24px; border-left: 3px solid var(--marassina-pink); border-radius: 0 var(--marassina-radius) var(--marassina-radius) 0; background: var(--marassina-sand); font-family: Georgia, serif; }
.page-prose blockquote > :last-child { margin-bottom: 0; }
.page-prose img, .page-prose svg { display: block; max-width: 100%; height: auto; }
.page-prose img { border-radius: var(--marassina-radius); }
.page-prose svg { width: 72px; margin: 0 0 32px; }
.page-prose table { width: 100%; margin: 0 0 1.5em; border-collapse: collapse; font-size: 15px; }
.page-prose th, .page-prose td { padding: 10px 12px; border-bottom: 1px solid var(--marassina-border); text-align: left; }
.page-prose .is-style-card { margin: 2em 0; padding: 24px 28px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius); background: #fff; }
.page-prose .is-style-card :first-child { margin-top: 0; }
.page-prose .is-style-card :last-child { margin-bottom: 0; }
.empty-state { text-align: center; }
.site-footer { --footer-bg: var(--marassina-green); --footer-text: #dfe9e1; --footer-accent: #f6c957; position: relative; margin-top: 80px; padding: 38px 0 0; background: var(--footer-bg); color: var(--footer-text); border-radius: 0; }
.site-footer::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 0; border-top: 2px solid var(--marassina-pink); border-radius: 0; opacity: .9; }
.footer-rating { padding-bottom: 34px; text-align: center; }
.footer-stars { display: block; color: #f6c957; font-size: 23px; letter-spacing: .1em; }
.footer-rating p { margin: 8px 0 0; color: #fff; font-size: 15px; }
.footer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 0; padding: 0 20px 55px; }
.footer-menu-panel { display: contents; }
.footer-menu-panel > ul { display: contents; padding: 0; margin: 0; list-style: none; }
.footer-menu-panel > ul > li { min-height: 180px; padding: 0 30px; border-right: 1px solid rgba(255,255,255,.15); }
.footer-menu-panel > ul > li > a { display: block; margin-bottom: 22px; color: var(--footer-accent); font-size: 14px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.footer-menu-panel .sub-menu { padding: 0; margin: 0; list-style: none; }
.footer-menu-panel .sub-menu li { margin: 0 0 9px; }
.footer-menu-panel .sub-menu a { color: #dfe9e1; font-size: 14px; text-decoration: none; }
.footer-menu-panel a:hover { color: #fff; }
.footer-column { min-height: 180px; padding: 0 30px; border-right: 1px solid rgba(255,255,255,.15); }
.footer-column-location { padding-left: 0; }
.footer-column-connect { padding-right: 0; border-right: 0; }
.footer-column-title { display: block; margin-bottom: 22px; color: var(--footer-accent); font-family: Arial, sans-serif; font-size: 14px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.footer-column p { margin: 0; line-height: 2.2; }
.footer-contact-list { display: flex; flex-direction: column; gap: 14px; padding: 0; margin: 0; list-style: none; }
.footer-contact { display: flex; align-items: center; gap: 10px; color: #dfe9e1; font-size: 14px; }
.footer-contact a { color: #dfe9e1; text-decoration: none; }
.footer-contact a:hover { color: #fff; }
.footer-contact span { display: inline-grid; flex: none; width: 26px; height: 26px; border-radius: 50%; background: #fff; color: var(--marassina-pink); place-items: center; font-size: 14px; line-height: 1; }
.footer-contact svg { width: 14px; height: 14px; fill: currentColor; stroke: none; }
.site-footer a { color: #dfe9e1; text-decoration: none; }
.site-footer a:hover { color: #fff; }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 0; border-top: 1px solid rgba(255,255,255,.2); font-size: 12px; }
.footer-bottom ul { justify-content: flex-end; }
@media (max-width: 480px) {
  .woocommerce nav.woocommerce-pagination ul { flex-wrap: wrap; gap: 6px; }
  .woocommerce nav.woocommerce-pagination ul li a,
  .woocommerce nav.woocommerce-pagination ul li span { min-width: 34px; height: 34px; padding: 0 9px; }
  .single-product .woocommerce-tabs ul.tabs { display: flex; width: 100%; flex-wrap: wrap; border-radius: 18px; }
  .single-product .woocommerce-tabs ul.tabs li { flex: 1 1 auto; }
  .single-product .woocommerce-tabs ul.tabs a { padding: 10px 11px; text-align: center; }
}
.woocommerce-breadcrumb { padding-top: 28px; color: var(--marassina-muted); font-size: 12px; }
.woocommerce-products-header { position: relative; margin: 34px 0 26px; padding: 30px 34px 28px; overflow: hidden; border: 1px solid rgba(23,63,53,.08); border-radius: 24px; background: linear-gradient(135deg, rgba(224,234,226,.72), rgba(255,255,255,.65) 65%); }
.woocommerce-products-header::after { content: ''; position: absolute; top: -70px; right: -45px; width: 190px; height: 190px; border: 1px solid rgba(217,41,120,.15); border-radius: 50%; box-shadow: 0 0 0 28px rgba(217,41,120,.035); pointer-events: none; }
.woocommerce-products-header h1 { margin: 0 0 20px; color: var(--marassina-green); font-size: clamp(32px, 3.2vw, 46px); letter-spacing: -.035em; line-height: 1.05; }
.shop-category-pills { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 30px; overflow-x: auto; scrollbar-width: none; }
.shop-category-pills::-webkit-scrollbar { display: none; }
.shop-category-pill { flex: 0 0 auto; padding: 10px 16px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-pill); background: #fff; color: var(--marassina-ink); font-size: 11px; font-weight: 750; letter-spacing: .07em; text-decoration: none; text-transform: uppercase; white-space: nowrap; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.shop-category-pill:hover { border-color: var(--marassina-green); color: var(--marassina-green); }
.shop-category-pill.is-active { border-color: var(--marassina-green); background: var(--marassina-green); color: #fff; }
.woocommerce-products-header .term-description { max-width: 960px; color: var(--marassina-ink); line-height: 1.65; }
.woocommerce-products-header .term-description p { margin: 0 0 12px; }
.woocommerce-products-header .term-description p:last-child { margin-bottom: 0; }
.tax-product_cat .woocommerce-products-header .term-description p:nth-of-type(n+3) { display: none; }
.woocommerce .site-main > .container { padding-bottom: 80px; }
.shop-layout.has-sidebar { display: grid; grid-template-columns: 275px minmax(0, 1fr); align-items: start; gap: 34px; }
.shop-layout.has-sidebar .products { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.shop-sidebar { position: sticky; top: 20px; max-height: calc(100vh - 40px); overflow-y: auto; padding: 22px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-lg); background: #fff; box-shadow: var(--marassina-shadow); }
.shop-sidebar .widget { padding-bottom: 22px; margin-bottom: 22px; border-bottom: 1px solid var(--marassina-border); }
.shop-sidebar .widget:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: 0; }
.shop-sidebar .widget-title { margin: 0 0 14px; color: var(--marassina-green); font-family: Georgia, serif; font-size: 17px; font-weight: 400; text-transform: none; letter-spacing: 0; }
.shop-sidebar ul { margin: 0; padding: 0; list-style: none; }
.shop-sidebar li { margin-bottom: 8px; font-size: 13px; }
.shop-sidebar li a { color: var(--marassina-ink); text-decoration: none; }
.shop-sidebar li a:hover { color: var(--marassina-green); }
.shop-sidebar .woocommerce-widget-layered-nav-list__item--chosen a, .shop-sidebar .chosen a { color: var(--marassina-pink); font-weight: 700; }
.shop-sidebar .price_slider { margin-bottom: 16px; }
.shop-sidebar .price_slider_amount { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.shop-sidebar .price_slider_amount .button { flex: 0 0 auto; padding: 8px 18px; border: 0; border-radius: var(--marassina-radius-pill); background: var(--marassina-green); color: #fff; font-size: 11px; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; cursor: pointer; }
.shop-sidebar .price_slider_amount .button:hover { background: var(--marassina-pink); }
.shop-sidebar .ui-slider { position: relative; height: 4px; margin: 20px 4px; border-radius: var(--marassina-radius-pill); background: var(--marassina-border); }
.shop-sidebar .ui-slider .ui-slider-range { position: absolute; top: 0; height: 100%; border-radius: var(--marassina-radius-pill); background: var(--marassina-green); }
.shop-sidebar .ui-slider .ui-slider-handle { position: absolute; top: 50%; width: 15px; height: 15px; border-radius: 50%; background: var(--marassina-green); box-shadow: 0 2px 6px rgba(23,63,53,.3); cursor: pointer; outline: none; transform: translate(-50%, -50%); }
.shop-sidebar .star-rating { color: #e5a51b; }
.shop-sidebar-ordering select { width: 100%; min-height: 42px; padding: 0 42px 0 16px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-pill); background: #fff; color: var(--marassina-ink); font-size: 13px; }
/* The active "Filtros" widget is WooCommerce's block-based Product Filters
   (Interactivity API) rather than the classic widgets — different class
   names (wc-block-product-filter-*), styled additively here so its own JS
   state-binding (data-wp-bind/data-wp-on) is left untouched. */
.shop-sidebar .wc-block-product-filters { width: 100%; }
.shop-sidebar .wp-block-heading { margin: 0 0 12px; color: var(--marassina-green); font-family: Georgia, serif; font-size: 17px; font-weight: 400; }
.shop-sidebar .wc-block-product-filter-checkbox-list__item { margin-bottom: 8px; }
.shop-sidebar .wc-block-product-filter-checkbox-list__label { display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 13px; color: var(--marassina-ink); }
.shop-sidebar .wc-block-product-filter-checkbox-list__input-wrapper { position: relative; display: grid; place-items: center; width: 16px; height: 16px; border: 1px solid var(--marassina-border); border-radius: 4px; background: #fff; flex: 0 0 auto; }
.shop-sidebar .wc-block-product-filter-checkbox-list__mark { position: static; width: 12px; height: 10px; padding: 0; color: var(--marassina-green); }
.shop-sidebar .wc-block-product-filter-checkbox-list__input { position: absolute; inset: 0; margin: 0; opacity: 0; cursor: pointer; }
.shop-sidebar .wc-block-product-filter-checkbox-list__input:checked ~ .wc-block-product-filter-checkbox-list__input-wrapper, .shop-sidebar span:has(> .wc-block-product-filter-checkbox-list__input:checked) { border-color: var(--marassina-green); }
.shop-sidebar .wc-block-product-filter-checkbox-list__stars-svg { color: #e5a51b; }
.shop-sidebar .wc-block-product-filter-checkbox-list__show-more-button { color: var(--marassina-green); font-size: 12px; font-weight: 700; text-decoration: underline; background: none; border: 0; cursor: pointer; padding: 0; }
.shop-sidebar .wc-block-product-filter-price-slider__content { padding-top: 4px; }
.shop-sidebar input[type="range"].min, .shop-sidebar input[type="range"].max { accent-color: var(--marassina-green); }
.shop-sidebar .wc-block-product-filter-price-slider__left, .shop-sidebar .wc-block-product-filter-price-slider__right { display: inline-flex; }
.shop-sidebar .wc-block-product-filter-price-slider__left input, .shop-sidebar .wc-block-product-filter-price-slider__right input { width: 70px; min-height: 36px; padding: 0 10px; border: 1px solid var(--marassina-border); border-radius: 8px; background: #fff; color: var(--marassina-ink); font-family: inherit; font-size: 12px; text-align: center; }
.shop-sidebar .wc-block-product-filters__apply { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding-inline: 22px; margin-top: 12px; border: 0; border-radius: var(--marassina-radius-pill); background: var(--marassina-green); color: #fff; font-size: 11px; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; cursor: pointer; }
.shop-sidebar .wc-block-product-filters__apply:hover { background: var(--marassina-pink); }
.shop-sidebar .wc-block-product-filter-removable-chips__items { display: flex; flex-wrap: wrap; gap: 8px; }
.shop-sidebar .wc-block-product-filter-clear-button .wp-block-button__link { display: inline-flex; align-items: center; justify-content: center; min-height: 36px; padding: 5px 18px !important; margin: 0; border: 1px solid var(--marassina-green) !important; border-radius: var(--marassina-radius-pill); background: transparent; color: var(--marassina-green); font-family: inherit; font-size: 11px !important; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; text-decoration: none !important; cursor: pointer; }
.shop-sidebar .wc-block-product-filter-clear-button .wp-block-button__link:hover { background: var(--marassina-green); color: #fff; }
@media (max-width: 900px) { .shop-layout.has-sidebar { grid-template-columns: 1fr; } .shop-sidebar { position: static; max-height: none; overflow-y: visible; } .shop-category-pills { display: none; } }
@media (max-width: 800px) { .shop-layout.has-sidebar .products { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .shop-layout.has-sidebar .products { grid-template-columns: 1fr; } }
.woocommerce-result-count, .woocommerce-ordering { margin-bottom: 20px; color: var(--marassina-muted); font-size: 13px; }
.woocommerce-ordering select { min-height: 42px; padding: 0 42px 0 16px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-pill); background: #fff; box-shadow: 0 5px 18px rgba(23,63,53,.045); color: var(--marassina-ink); }
.woocommerce ul.products { clear: both; margin-top: 0; }
.products li.product { overflow: visible; }
/* color: explicit + !important — this used to just inherit WooCommerce
   core's own ".woocommerce span.onsale{color:#fff}", which never applies on
   the homepage's product grid: that section sits outside any ".woocommerce"
   ancestor (it's hand-rolled, not a shortcode/block), so every core rule
   scoped that way silently skips it there, leaving the badge text in the
   page's ordinary (dark) text color instead of white. */
.products li.product .onsale { position: absolute; z-index: 3; top: 12px; left: 12px; right: auto; min-width: 0; min-height: 0; margin: 0; padding: 7px 11px; border-radius: var(--marassina-radius-pill); background: var(--marassina-pink); box-shadow: 0 6px 16px rgba(217,41,120,.22); color: #fff !important; font-size: 10px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; line-height: 1; display: inline-flex; align-items: center; gap: 5px; }
.products li.product .onsale .fa-icon { width: 10px; height: 10px; fill: currentColor; }
.single-product div.product { display: block; padding-block: 45px 90px; }
.single-product div.product .content-single-wrapper { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr); gap: 58px; align-items: start; }
.single-product div.product div.images, .single-product div.product div.summary { float: none; width: auto; margin: 0; }
.product-breadcrumbs { padding-top: 28px; color: var(--marassina-muted); font-size: 12px; }
.single-product div.product div.images { min-width: 0; }
.single-product div.product .content-single-wrapper { position: relative; }
.single-product div.product .content-single-wrapper > .onsale { position: absolute; z-index: 3; top: 16px; left: 16px; right: auto; min-width: 0; min-height: 0; margin: 0; padding: 8px 14px; border-radius: var(--marassina-radius-pill); background: var(--marassina-pink); box-shadow: 0 6px 16px rgba(217,41,120,.22); color: #fff !important; font-size: 11px; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; line-height: 1; display: inline-flex; align-items: center; gap: 6px; }
.single-product div.product .content-single-wrapper > .onsale .fa-icon { width: 11px; height: 11px; fill: currentColor; }
.single-product div.product div.images img { width: 100%; background: var(--marassina-sand); }
.single-product .flex-control-thumbs { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 10px !important; }
.single-product .flex-control-thumbs li { width: auto !important; margin: 0 !important; }
.single-product .flex-control-thumbs img { opacity: .65; cursor: pointer; }
.single-product .flex-control-thumbs .flex-active { opacity: 1; }
.single-product div.product div.summary { position: static; align-self: start; padding-top: 8px; }
/* Was Arial/600/up-to-54px — the one heading on the site not using the
   Georgia-serif/400-weight treatment everything else uses, which is what
   made it read so much heavier/bigger than the rest of the page. */
.single-product .product_title { margin-bottom: 18px; color: var(--marassina-green); font-family: Georgia, serif; font-size: clamp(26px, 2.6vw, 36px); font-weight: 400; letter-spacing: -.015em; line-height: 1.22; }
.single-product .summary .product_meta { padding-top: 22px; border-top: 1px solid var(--marassina-border); color: var(--marassina-muted); font-size: 12px; }
.single-product .summary .product_meta > span { display: block; margin: 7px 0; line-height: 1.55; }
.single-product .summary .product_meta a { color: var(--marassina-green); font-weight: 700; }
.single-product .woocommerce-product-rating { display: flex; align-items: center; gap: 8px; margin: 14px 0; }
.single-product .summary .star-rating { margin: 0; color: #e5a51b; font-size: 15px; }
.single-product .woocommerce-review-link { color: var(--marassina-muted); font-size: 13px; }
/* !important: WC core's own price color (div.product p.price, wrapped in a
   zero-specificity :where() that hides how strong it actually is) narrowly
   out-specifies this rule on the element-count tiebreaker once both are
   tied on class count — see the "olive price" note in project history. The
   same tiebreaker was silently winning on font-size/font-weight too, which
   is why the price rendered at WC core's 20px/700 instead of this rule's
   intended, more prominent size. */
.single-product .price { display: block; margin: 20px 0; color: var(--marassina-pink) !important; font-size: 30px !important; font-weight: 800 !important; }
/* !important: same WC core .stock color (#958e09, olive) as the price bug
   above — same :where()-hidden specificity trick. */
.single-product p.stock { margin-bottom: 0; color: var(--marassina-green) !important; font-size: 13px; font-weight: 700; }
.single-product .woocommerce-product-details__short-description { margin: 22px 0 28px; color: var(--marassina-ink); font-size: 16px; line-height: 1.65; }
.single-product form.cart { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.single-product form.cart > .clear { display: none; }
.single-product form.cart .tpt__tiered-pricing { flex: 0 0 100%; width: 100%; min-width: 0; margin-bottom: 4px; align-self: flex-start; }
.single-product .tpt__tiered-pricing .tiered-pricing-table { width: 100%; margin: 0; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius); border-spacing: 0; background: #fff; box-shadow: var(--marassina-shadow); overflow: hidden; font-size: 13px; }
.single-product .tpt__tiered-pricing .tiered-pricing-table th { padding: 11px 14px; border: 0; border-bottom: 1px solid var(--marassina-border); color: var(--marassina-muted); background: #f7f7f3; font-size: 10px; font-weight: 700; letter-spacing: .07em; text-align: left; text-transform: uppercase; }
.single-product .tpt__tiered-pricing .tiered-pricing-table th:not(:first-child), .single-product .tpt__tiered-pricing .tiered-pricing-table td:not(:first-child) { text-align: right; }
.single-product .tpt__tiered-pricing .tiered-pricing-table td { padding: 11px 14px; border: 0; border-bottom: 1px solid var(--marassina-border); color: var(--marassina-ink); font-size: 13px; }
.single-product .tpt__tiered-pricing .tiered-pricing-table tr:last-child td { border-bottom: 0; }
.single-product .tpt__tiered-pricing .tiered-pricing-table tr.tiered-pricing--active td { background: var(--marassina-pink); color: #fff; font-weight: 700; }
/* flex:1 1 <basis> with min-width:0 (rather than the old fixed
   width:280px + min-width:220px on each) — two buttons that both insist on
   >=220px plus the 64px quantity box need >=500px just to fit, which the
   .summary column doesn't reliably have (it can be as narrow as 360px per
   its minmax()); letting them share the row's remaining space is what
   actually keeps them side by side on desktop instead of wrapping. */
/* flex:0 1 auto — sized to each button's own content instead of forcing
   both to share the row equally, so "Añadir al carrito" isn't stretched
   with a lot of dead space either side of its (shorter) label. */
/* display:inline-flex + align-items:center — WC's own "added" checkmark
   (a ::after icon, content:"\e017") relies on vertical-align:bottom to sit
   level with the button label, but that only works in normal inline flow;
   without the button itself being a flex container, the fixed 50px height
   left the text+checkmark sitting on their own line-box baseline instead
   of centered in the full button, reading as "too high". Flex centers both
   the text and the icon the same way regardless of vertical-align. */
.single-product form.cart .single_add_to_cart_button, .single-product form.cart .whatsapp-consult-button { display: inline-flex; align-items: center; justify-content: center; flex: 0 1 auto; min-width: 0; width: auto; min-height: 50px; height: 50px; padding-inline: 24px; border: 0; border-radius: var(--marassina-radius-pill); background: var(--marassina-pink); box-shadow: 0 9px 22px rgba(217,41,120,.18); color: #fff; font-size: 12px; font-weight: 750; letter-spacing: .045em; white-space: nowrap; text-transform: uppercase; }
.single-product form.cart .single_add_to_cart_button:hover { background: var(--marassina-green); }
/* Secondary style: WhatsApp is a "consult before you buy" fallback, not a
   second checkout path — an outline button keeps "Añadir al carrito" the
   one clearly primary action instead of two identical pink buttons
   competing for attention. */
.single-product form.cart .whatsapp-consult-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; background: transparent; border: 1.5px solid var(--marassina-pink); box-shadow: none; color: var(--marassina-pink); text-decoration: none; transition: background .2s ease, color .2s ease; }
.single-product form.cart .whatsapp-consult-button svg { width: 17px; height: 17px; fill: var(--marassina-pink); flex: 0 0 auto; transition: fill .2s ease; }
.single-product form.cart .whatsapp-consult-button:hover { background: var(--marassina-pink); color: #fff; }
.single-product form.cart .whatsapp-consult-button:hover svg { fill: #fff; }
/* WC's own add-to-cart.js inserts this "Ver carrito de compras" link next
   to the button whenever `added_to_cart` fires (which our AJAX submit now
   does) — redundant here since the cart drawer opens on add-to-cart and the
   cart-count badge already give that feedback. */
.single-product form.cart .added_to_cart.wc-forward { display: none; }
.single-product .product-below-buttons-note { margin: 0 0 4px; color: var(--marassina-muted); font-size: 13px; line-height: 1.6; }
.single-product .product-below-buttons-note p { margin: 0 0 6px; }
.single-product .product-below-buttons-note a { color: var(--marassina-pink); text-decoration: underline; }
/* Below the point where two flex:1 buttons would start truncating their
   own label text, stack everything full-width instead — cleaner than
   letting them get squeezed. Matches the .quantity input's own size so
   the whole row still reads as one aligned block. */
@media (max-width: 560px) {
  .single-product form.cart { flex-direction: column; align-items: stretch; }
  .single-product form.cart .quantity { align-self: flex-start; }
  .single-product form.cart .single_add_to_cart_button, .single-product form.cart .whatsapp-consult-button { flex-basis: auto; width: 100%; }
  .single-product div.product { padding-block: 20px 48px; }
  .single-product div.product .content-single-wrapper { gap: 20px; }
  .single-product .product_title { margin-bottom: 8px; }
  .single-product .price { margin: 8px 0 10px; }
  .single-product .woocommerce-product-details__short-description { margin: 10px 0 12px; }
  .single-product p.stock { margin: 0 0 4px; }
  .single-product form.cart { margin: 8px 0 18px; }
  .single-product .summary .product_meta { padding-top: 14px; }
  .single-product .woocommerce-tabs { padding-top: 28px; }
}
.product-trust-panel { display: block; margin-top: 22px; padding: 18px 0 20px; border-top: 1px solid var(--marassina-border); }
.product-trust-panel ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 22px; padding: 0; margin: 0; list-style: none; }
.product-trust-panel li { display: flex; align-items: center; gap: 7px; margin: 0; color: var(--marassina-ink); font-size: 14.5px; font-weight: 500; line-height: 1.3; }
.product-trust-panel li .trust-icon { display: inline-flex; flex: 0 0 auto; color: var(--marassina-green); opacity: .75; }
.product-trust-panel li .trust-icon svg { width: 19px; height: 19px; }
.product-trust-panel .trust-text { display: block; }
.product-trust-panel .trust-note { display: block; margin-top: 3px; color: #6b6b60; font-size: 13.5px; font-weight: 400; line-height: 1.45; }
.product-trust-panel li { align-items: flex-start; }
.product-trust-panel li .trust-icon { margin-top: 1px; }
.product-trust-panel .trust-cards { display: block; height: 22px; width: auto; max-width: 100%; margin-top: 8px; }
.single-product .summary .product_meta a { color: var(--marassina-green); font-weight: 700; }
.single-product .woocommerce-product-rating { display: flex; align-items: center; gap: 8px; margin: 14px 0; }
.single-product .summary .star-rating { margin: 0; color: #e5a51b; font-size: 15px; }
.single-product .woocommerce-review-link { color: var(--marassina-muted); font-size: 13px; }
/* !important: WC core's own price color (div.product p.price, wrapped in a
   zero-specificity :where() that hides how strong it actually is) narrowly
   out-specifies this rule on the element-count tiebreaker once both are
   tied on class count — see the "olive price" note in project history. The
   same tiebreaker was silently winning on font-size/font-weight too, which
   is why the price rendered at WC core's 20px/700 instead of this rule's
   intended, more prominent size. */
.single-product .price { display: block; margin: 20px 0; color: var(--marassina-pink) !important; font-size: 30px !important; font-weight: 800 !important; }
/* !important: same WC core .stock color (#958e09, olive) as the price bug
   above — same :where()-hidden specificity trick. */
.single-product p.stock { margin-bottom: 0; color: var(--marassina-green) !important; font-size: 13px; font-weight: 700; }
.single-product .woocommerce-product-details__short-description { margin: 22px 0 28px; color: var(--marassina-ink); font-size: 16px; line-height: 1.65; }
.single-product form.cart { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.single-product form.cart > .clear { display: none; }
.single-product form.cart .tpt__tiered-pricing { flex: 0 0 100%; width: 100%; min-width: 0; margin-bottom: 4px; align-self: flex-start; }
.single-product .tpt__tiered-pricing .tiered-pricing-table { width: 100%; margin: 0; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius); border-spacing: 0; background: #fff; box-shadow: var(--marassina-shadow); overflow: hidden; font-size: 13px; }
.single-product .tpt__tiered-pricing .tiered-pricing-table th { padding: 11px 14px; border: 0; border-bottom: 1px solid var(--marassina-border); color: var(--marassina-muted); background: #f7f7f3; font-size: 10px; font-weight: 700; letter-spacing: .07em; text-align: left; text-transform: uppercase; }
.single-product .tpt__tiered-pricing .tiered-pricing-table th:not(:first-child), .single-product .tpt__tiered-pricing .tiered-pricing-table td:not(:first-child) { text-align: right; }
.single-product .tpt__tiered-pricing .tiered-pricing-table td { padding: 11px 14px; border: 0; border-bottom: 1px solid var(--marassina-border); color: var(--marassina-ink); font-size: 13px; }
.single-product .tpt__tiered-pricing .tiered-pricing-table tr:last-child td { border-bottom: 0; }
.single-product .tpt__tiered-pricing .tiered-pricing-table tr.tiered-pricing--active td { background: var(--marassina-pink); color: #fff; font-weight: 700; }
/* flex:1 1 <basis> with min-width:0 (rather than the old fixed
   width:280px + min-width:220px on each) — two buttons that both insist on
   >=220px plus the 64px quantity box need >=500px just to fit, which the
   .summary column doesn't reliably have (it can be as narrow as 360px per
   its minmax()); letting them share the row's remaining space is what
   actually keeps them side by side on desktop instead of wrapping. */
/* flex:0 1 auto — sized to each button's own content instead of forcing
   both to share the row equally, so "Añadir al carrito" isn't stretched
   with a lot of dead space either side of its (shorter) label. */
/* display:inline-flex + align-items:center — WC's own "added" checkmark
   (a ::after icon, content:"\e017") relies on vertical-align:bottom to sit
   level with the button label, but that only works in normal inline flow;
   without the button itself being a flex container, the fixed 50px height
   left the text+checkmark sitting on their own line-box baseline instead
   of centered in the full button, reading as "too high". Flex centers both
   the text and the icon the same way regardless of vertical-align. */
.single-product form.cart .single_add_to_cart_button, .single-product form.cart .whatsapp-consult-button { display: inline-flex; align-items: center; justify-content: center; flex: 0 1 auto; min-width: 0; width: auto; min-height: 50px; height: 50px; padding-inline: 24px; border: 0; border-radius: var(--marassina-radius-pill); background: var(--marassina-pink); box-shadow: 0 9px 22px rgba(217,41,120,.18); color: #fff; font-size: 12px; font-weight: 750; letter-spacing: .045em; white-space: nowrap; text-transform: uppercase; }
.single-product form.cart .single_add_to_cart_button:hover { background: var(--marassina-green); }
/* Secondary style: WhatsApp is a "consult before you buy" fallback, not a
   second checkout path — an outline button keeps "Añadir al carrito" the
   one clearly primary action instead of two identical pink buttons
   competing for attention. */
.single-product form.cart .whatsapp-consult-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; background: transparent; border: 1.5px solid var(--marassina-pink); box-shadow: none; color: var(--marassina-pink); text-decoration: none; transition: background .2s ease, color .2s ease; }
.single-product form.cart .whatsapp-consult-button svg { width: 17px; height: 17px; fill: var(--marassina-pink); flex: 0 0 auto; transition: fill .2s ease; }
.single-product form.cart .whatsapp-consult-button:hover { background: var(--marassina-pink); color: #fff; }
.single-product form.cart .whatsapp-consult-button:hover svg { fill: #fff; }
/* WC's own add-to-cart.js inserts this "Ver carrito de compras" link next
   to the button whenever `added_to_cart` fires (which our AJAX submit now
   does) — redundant here since the cart drawer opens on add-to-cart and the
   cart-count badge already give that feedback. */
.single-product form.cart .added_to_cart.wc-forward { display: none; }
.single-product .product-below-buttons-note { margin: 0 0 4px; color: var(--marassina-muted); font-size: 13px; line-height: 1.6; }
.single-product .product-below-buttons-note p { margin: 0 0 6px; }
.single-product .product-below-buttons-note a { color: var(--marassina-pink); text-decoration: underline; }
/* Below the point where two flex:1 buttons would start truncating their
   own label text, stack everything full-width instead — cleaner than
   letting them get squeezed. Matches the .quantity input's own size so
   the whole row still reads as one aligned block. */
@media (max-width: 560px) {
  .single-product form.cart { flex-direction: column; align-items: stretch; }
  .single-product form.cart .quantity { align-self: flex-start; }
  .single-product form.cart .single_add_to_cart_button, .single-product form.cart .whatsapp-consult-button { flex-basis: auto; width: 100%; }
  .single-product div.product { padding-block: 20px 48px; }
  .single-product div.product .content-single-wrapper { gap: 20px; }
  .single-product .product_title { margin-bottom: 8px; }
  .single-product .price { margin: 8px 0 10px; }
  .single-product .woocommerce-product-details__short-description { margin: 10px 0 12px; }
  .single-product p.stock { margin: 0 0 4px; }
  .single-product form.cart { margin: 8px 0 18px; }
  .single-product .summary .product_meta { padding-top: 14px; }
  .single-product .woocommerce-tabs { padding-top: 28px; }
}
.product-trust-panel { display: block; margin-top: 22px; padding: 18px 0 20px; border-top: 1px solid var(--marassina-border); }
.product-trust-panel ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 22px; padding: 0; margin: 0; list-style: none; }
.product-trust-panel li { display: flex; align-items: center; gap: 7px; margin: 0; color: var(--marassina-ink); font-size: 14.5px; font-weight: 500; line-height: 1.3; }
.product-trust-panel li .trust-icon { display: inline-flex; flex: 0 0 auto; color: var(--marassina-green); opacity: .75; }
.product-trust-panel li .trust-icon svg { width: 19px; height: 19px; }
.product-trust-panel .trust-text { display: block; }
.product-trust-panel .trust-note { display: block; margin-top: 3px; color: #6b6b60; font-size: 13.5px; font-weight: 400; line-height: 1.45; }
.product-trust-panel li { align-items: flex-start; }
.product-trust-panel li .trust-icon { margin-top: 1px; }
.product-trust-panel .trust-cards { display: block; height: 22px; width: auto; max-width: 100%; margin-top: 8px; }
.single-product .summary .product_meta a { color: var(--marassina-pink); }
.single-product .woocommerce-tabs { grid-column: 1 / -1; padding-top: 35px; border-top: 1px solid var(--marassina-border); }
.single-product .woocommerce-tabs ul.tabs { display: inline-flex; align-items: center; gap: 4px; padding: 5px !important; margin: 0 0 30px !important; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-pill); background: rgba(224,234,226,.55); }
.single-product .woocommerce-tabs ul.tabs::before, .single-product .woocommerce-tabs ul.tabs::after { display: none !important; }
.single-product .woocommerce-tabs ul.tabs li { margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: var(--marassina-radius-pill); background: transparent !important; }
.single-product .woocommerce-tabs ul.tabs li::before, .single-product .woocommerce-tabs ul.tabs li::after { display: none !important; }
/* display/padding !important: WC core's own ul.tabs li a rule
   (.woocommerce div.product .woocommerce-tabs ul.tabs li a) has one more
   class than this selector, which wins the specificity tie-break — its
   padding:.5em 0 (no horizontal padding) is what left the inactive tabs
   looking cramped together with no pill shape of their own. */
.single-product .woocommerce-tabs ul.tabs a { display: block !important; padding: 11px 17px !important; border-radius: var(--marassina-radius-pill); color: var(--marassina-muted) !important; font-size: 11px; font-weight: 750; letter-spacing: .065em; text-decoration: none; text-transform: uppercase; transition: background .2s ease, color .2s ease, box-shadow .2s ease; }
.single-product .woocommerce-tabs ul.tabs li.active a { background: var(--marassina-green); box-shadow: 0 5px 14px rgba(23,63,53,.16); color: #fff !important; }
.single-product .woocommerce-tabs ul.tabs li:not(.active) a:hover { background: rgba(255,255,255,.8); color: var(--marassina-green); }
.single-product .woocommerce-Tabs-panel { position: relative; max-width: none; margin: 0 !important; padding: 30px 34px 32px !important; overflow: hidden; border: 1px solid rgba(23,63,53,.08); border-radius: 24px; background: linear-gradient(135deg, rgba(224,234,226,.72), rgba(255,255,255,.65) 65%); color: var(--marassina-ink); }
.single-product .woocommerce-Tabs-panel::after { content: ''; position: absolute; top: -70px; right: -45px; width: 190px; height: 190px; border: 1px solid rgba(217,41,120,.15); border-radius: 50%; box-shadow: 0 0 0 28px rgba(217,41,120,.035); pointer-events: none; }
.single-product .woocommerce-Tabs-panel--additional_information::after { display: none; }
.single-product .woocommerce-Tabs-panel > * { position: relative; max-width: 820px; z-index: 1; }
.single-product .woocommerce-Tabs-panel h2 { margin: 0 0 24px; color: var(--marassina-green); font-family: Georgia, serif; font-size: clamp(30px, 3.6vw, 48px); letter-spacing: -.035em; line-height: 1.08; }
.single-product .woocommerce-Tabs-panel h3 { margin: 34px 0 12px; color: var(--marassina-green); font-family: Georgia, serif; font-size: 24px; }
.single-product .woocommerce-Tabs-panel p, .single-product .woocommerce-Tabs-panel li { line-height: 1.75; }
/* WC core's shop_attributes table is width:100% with a fixed 150px label
   column, so on a wide page the value column (and its dotted border-bottom)
   just trails off into mostly empty space for short values like "1000 g" —
   auto width keeps the table (and its row dividers) only as wide as the
   content actually needs. */
.single-product table.shop_attributes { width: auto; min-width: 320px; max-width: 100%; border: 1px solid var(--marassina-border); border-top: 1px solid var(--marassina-border); border-radius: var(--marassina-radius); border-spacing: 0; overflow: hidden; }
.single-product table.shop_attributes th { padding: 8px 16px; border-bottom: 1px solid var(--marassina-border); background: #f7f7f3; color: var(--marassina-ink); font-size: 13px; }
.single-product table.shop_attributes td { border-bottom: 1px solid var(--marassina-border); padding: 8px 16px; color: var(--marassina-muted); font-size: 13px; }
.single-product table.shop_attributes tr:last-child th, .single-product table.shop_attributes tr:last-child td { border-bottom: 0; }
.single-product table.shop_attributes tr:nth-child(2n) td, .single-product table.shop_attributes tr:nth-child(2n) th { background: transparent; }

/* Redundant with the "EVALUACIONES 0-9" tab pill right above this panel. */
.single-product .woocommerce-Reviews-title { display: none; }
/* WC core reserves margin-left:50px on each review's comment-text box for
   an avatar image — this theme doesn't render avatars (no img.avatar in
   the markup at all), so that space was just an unexplained gap pushing
   every review to the right for nothing. */
/* padding-left:0 — WC core resets this <ol>'s margin but not its padding,
   so the browser's own default list indent (~40px, still applied even with
   list-style:none) was shifting the whole review list right. */
.single-product #reviews #comments ol.commentlist { padding-left: 0; }
.single-product #reviews #comments ol.commentlist li .comment-text { max-width: 640px; margin-left: 0; border: 0; border-radius: var(--marassina-radius-lg); background: #fff; box-shadow: var(--marassina-shadow); }
/* The summary section's star-rating color only covered .summary .star-rating
   — the ones inside individual review comments use a different parent and
   were falling back to WC core's default (unstyled/dark) star color. */
.single-product #reviews .star-rating { color: #e5a51b; }
.single-product #review_form p.stars a { color: #e5a51b; }
.single-product #review_form #respond { margin-top: 24px; }
.single-product #review_form .comment-reply-title { display: block; margin-bottom: 16px; color: var(--marassina-green); font-family: Georgia, serif; font-size: 22px; }
.single-product #review_form .comment-form-rating, .single-product #review_form .comment-form-comment, .single-product #review_form .comment-form-author, .single-product #review_form .comment-form-email { margin: 0 0 16px; }
.single-product #review_form label { display: block; margin-bottom: 6px; color: var(--marassina-ink); font-size: 13px; font-weight: 700; }
.single-product #review_form input[type="text"], .single-product #review_form input[type="email"], .single-product #review_form textarea { width: 100%; padding: 12px 16px; border: 1px solid var(--marassina-border); border-radius: 8px; background: #fff; color: var(--marassina-ink); font-family: inherit; font-size: 14px; box-sizing: border-box; }
.single-product #review_form textarea { min-height: 130px; padding-top: 26px; resize: vertical; }
.single-product #review_form .form-submit { margin: 8px 0 0; }
.single-product #review_form .form-submit input#submit { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding-inline: 26px; border: 0; border-radius: var(--marassina-radius-pill); background: var(--marassina-green); color: #fff; font-size: 12px; font-weight: 750; letter-spacing: .045em; text-transform: uppercase; cursor: pointer; transition: background .2s ease; }
.single-product #review_form .form-submit input#submit:hover { background: var(--marassina-pink); }
.single-product .woocommerce-tabs, .single-product .related.products, .single-product .upsells.products { width: 100%; padding-top: 55px; clear: both; }
.single-product .related.products, .single-product .upsells.products { padding-top: 80px !important; }
.single-product .related.products, .single-product .upsells.products { display: block !important; }
.single-product .related.products ul.products, .single-product .upsells.products ul.products { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
@media (max-width: 1050px) { .single-product .related.products ul.products, .single-product .upsells.products ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 800px) { .single-product .related.products ul.products, .single-product .upsells.products ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 25px 14px; } }
@media (max-width: 480px) { .single-product .related.products ul.products, .single-product .upsells.products ul.products { grid-template-columns: 1fr; } }
.single-product .related.products > h2, .single-product .upsells.products > h2 { font-size: 34px; }
.woocommerce-message, .woocommerce-info, .woocommerce-error { position: relative; margin: 0 0 20px; padding: 16px 22px 16px 34px; border: 1px solid rgba(23,63,53,.08); border-radius: var(--marassina-radius); background: rgba(223,233,225,.72); color: var(--marassina-green); font-size: 14px; line-height: 1.5; list-style: none; transition: opacity .4s ease; }
.woocommerce-message.is-fading { opacity: 0; }
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before { content: ''; font-family: inherit; position: absolute; top: 16px; bottom: 16px; left: 16px; width: 3px; border-radius: var(--marassina-radius-pill); background: var(--marassina-pink); }
.woocommerce-message::after, .woocommerce-info::after, .woocommerce-error::after { content: none; }
.woocommerce-error { background: rgba(217,41,120,.07); }
.woocommerce-error li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin: 0; list-style: none; }
.woocommerce-error li + li { margin-top: 6px; }
/* The "cannot add that amount" notice appends a "View cart" button (WC core,
   class="button wc-forward") straight into the notice text — flex the <li>
   so it sits vertically centered at the end of the line instead of inline
   with the text (which left it riding low against the message's line-box). */
.woocommerce-error li a.button { flex: 0 0 auto; margin: 0; }
@media (max-width: 480px) {
  .woocommerce-error li a.button { flex: 1 1 100%; }
}
/* Reset the browser's default focus ring on click and replace it with a
   visible-only-for-keyboard one that matches the rest of the site. */
.woocommerce .return-to-shop .button:focus, .woocommerce a.button:focus { outline: 0; }
.woocommerce .return-to-shop .button:focus-visible, .woocommerce a.button:focus-visible { outline: 2px solid var(--marassina-green); outline-offset: 2px; }
.woocommerce-cart .cart-empty.woocommerce-info { display: flex; align-items: center; min-height: 58px; }
.woocommerce .return-to-shop .button, .woocommerce a.button { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 10px 18px; border: 1px solid var(--marassina-green); border-radius: var(--marassina-radius-pill); background: var(--marassina-green); color: #fff; font-size: 10px; font-weight: 700; letter-spacing: .07em; text-decoration: none; text-transform: uppercase; }
.woocommerce .return-to-shop .button:hover, .woocommerce a.button:hover { background: var(--marassina-pink); border-color: var(--marassina-pink); color: #fff; }
.marassina-order-steps { display: grid; grid-template-columns: repeat(3, 1fr); max-width: 820px; margin: 15px auto 55px; position: relative; }
.marassina-order-steps::before { content: ''; position: absolute; top: 17px; left: 14%; right: 14%; height: 1px; background: var(--marassina-border); }
.order-step { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 9px; color: var(--marassina-muted); text-align: center; }
.order-step span { display: grid; width: 34px; height: 34px; border: 1px solid var(--marassina-border); border-radius: 50%; background: var(--marassina-cream); place-items: center; font-size: 12px; }
.order-step strong { font-size: 12px; font-weight: 700; }
.order-step.is-current { color: var(--marassina-green); }
.order-step.is-current span { background: var(--marassina-green); border-color: var(--marassina-green); color: #fff; }
a.order-step { text-decoration: none; cursor: pointer; }
a.order-step:hover { color: var(--marassina-green); }
a.order-step:hover span { border-color: var(--marassina-green); }
a.order-step:hover strong { text-decoration: underline; text-underline-offset: 4px; }
.woocommerce-cart .site-main > .container, .woocommerce-checkout .site-main > .container { max-width: var(--container); padding-block: 65px 100px; }
.woocommerce-cart .site-main > .container.content-narrow { width: min(calc(100% - 40px), 1160px); max-width: 1160px; }
.woocommerce-cart .entry { width: 100%; }
.woocommerce-cart .entry-content, .woocommerce-cart .woocommerce { width: 100%; }
.woocommerce-cart .entry-content > h1, .woocommerce-checkout h1 { margin-bottom: 24px; color: var(--marassina-green); font-family: Georgia, serif; font-size: clamp(24px, 3vw, 32px); font-weight: 400; letter-spacing: -.03em; line-height: 1.1; }
.woocommerce-cart .return-to-shop { margin-top: 8px; }
.marassina-cart-layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(300px, .7fr); align-items: start; gap: 45px; }
.woocommerce-cart .marassina-cart-layout > .woocommerce-cart-form { grid-column: 1; }
.woocommerce-cart .marassina-cart-layout > .woocommerce-cart-form { padding: 6px 25px; background: #fff; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-lg); box-shadow: var(--marassina-shadow); }
.woocommerce-cart table.shop_table tr.cart_item:has(+ tr > td.actions) td, .woocommerce-cart table.shop_table tr.cart_item:last-child td { border-bottom: 0; }
.woocommerce-cart .marassina-cart-layout > .cart-collaterals { grid-column: 2; }
.woocommerce-cart-form { min-width: 0; }
.woocommerce-cart table.shop_table { width: 100%; margin: 0; border-collapse: collapse; border: 0; table-layout: fixed; }
.woocommerce-cart table.shop_table th { padding: 14px 10px; border-bottom: 1px solid var(--marassina-border); color: var(--marassina-muted); font-size: 11px; letter-spacing: .08em; text-align: left; text-transform: uppercase; }
.woocommerce-cart table.shop_table td { padding: 16px 10px; border-bottom: 1px solid var(--marassina-border); vertical-align: middle; }
.woocommerce-cart table.shop_table .product-remove { width: 30px; }
.woocommerce-cart table.shop_table .product-thumbnail { width: 100px; }
.woocommerce-cart table.shop_table .product-price { width: 90px; }
.woocommerce-cart table.shop_table .product-quantity { width: 120px; }
.woocommerce-cart table.shop_table .product-quantity, .woocommerce-cart table.shop_table th.product-quantity { text-align: center; }
/* A free-gift row has no editable stepper, just a plain "1" — dim it so it doesn't read as an input. */
.woocommerce-cart table.shop_table .cart_item:not(:has(.marassina-qty)) .product-quantity { color: var(--marassina-muted); font-size: 13px; }
/* Quantity edits auto-update the cart (theme.js) and coupons live on checkout only, so the actions row is hidden. The update button stays in the DOM because theme.js triggers it. */
.woocommerce-cart table.shop_table td.actions { display: none; }
/* Mobile cart: WC's stacked "label: value" table becomes one compact card row per item. */
@media (max-width: 768px) {
  .woocommerce-cart table.shop_table.cart, .woocommerce-cart table.shop_table.cart tbody { display: block; border: 0; }
  .woocommerce-cart table.shop_table.cart tr.cart_item { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; grid-template-areas: "thumb name remove" "thumb price price" "thumb qty sub"; align-items: center; gap: 6px 14px; padding: 16px 0; border-bottom: 1px solid var(--marassina-border); }
  .woocommerce-cart table.shop_table.cart tr.cart_item td { display: block; width: auto !important; padding: 0 !important; border: 0 !important; text-align: left !important; }
  .woocommerce-cart table.shop_table.cart tr.cart_item td::before { content: none !important; display: none !important; }
  .woocommerce-cart table.shop_table.cart td.product-thumbnail { display: block !important; grid-area: thumb; align-self: start; }
  .woocommerce-cart table.shop_table.cart .product-thumbnail img { width: 76px; height: 76px; }
  .woocommerce-cart table.shop_table.cart td.product-name { grid-area: name; align-self: end; }
  .woocommerce-cart table.shop_table.cart td.product-name a { font-size: 15px; }
  .woocommerce-cart table.shop_table.cart td.product-remove { grid-area: remove; align-self: start; justify-self: end; }
  .woocommerce-cart table.shop_table.cart td.product-price { grid-area: price; align-self: start; color: var(--marassina-muted); font-size: 13px; }
  .woocommerce-cart table.shop_table.cart td.product-quantity { grid-area: qty; }
  .woocommerce-cart table.shop_table.cart td.product-subtotal { grid-area: sub; text-align: right !important; font-weight: 650; }
  .woocommerce-cart .marassina-cart-layout > .woocommerce-cart-form { padding: 2px 16px 14px; }
  .woocommerce-cart table.shop_table.cart tr.cart_item:has(+ tr > td.actions) { border-bottom: 1px solid var(--marassina-border); }
  /* Small explicit "update" button on mobile as reassurance (quantity changes already auto-save; it is disabled when there is nothing to save). */
  .woocommerce-cart table.shop_table.cart td.actions { display: flex; justify-content: flex-end; padding: 14px 0 0 !important; border: 0 !important; background: transparent !important; line-height: normal; }
  .woocommerce-cart table.shop_table.cart td.actions::before { content: none !important; display: none !important; }
  .woocommerce-cart table.shop_table.cart td.actions .coupon { display: none; }
  .woocommerce-cart table.shop_table.cart td.actions > button { float: none; width: auto; min-height: 38px; margin: 0; padding: 0 20px; font-size: 10px; }
}
.woocommerce-cart table.shop_table .product-subtotal { width: 100px; }
.woocommerce-cart table.shop_table .product-name { width: auto; }
.woocommerce-cart table.shop_table .product-thumbnail img { display: block; width: 88px; height: 88px; border-radius: 12px; object-fit: cover; background: var(--marassina-sand); }
.woocommerce-cart table.shop_table .product-name a { color: var(--marassina-green); font-family: Georgia, serif; font-size: 17px; line-height: 1.35; text-decoration: none; }
.woocommerce-cart table.shop_table .product-remove a { position: relative; display: block; width: 22px; height: 22px; border: 1px solid var(--marassina-border); border-radius: 50%; background: transparent; color: transparent !important; font-size: 0; text-decoration: none; transition: background .2s ease, border-color .2s ease; }
.woocommerce-cart table.shop_table .product-remove a::before, .woocommerce-cart table.shop_table .product-remove a::after { content: ''; position: absolute; top: 50%; left: 50%; width: 9px; height: 1.5px; background: var(--marassina-muted); transition: background .2s ease; }
.woocommerce-cart table.shop_table .product-remove a::before { transform: translate(-50%, -50%) rotate(45deg); }
.woocommerce-cart table.shop_table .product-remove a::after { transform: translate(-50%, -50%) rotate(-45deg); }
.woocommerce-cart table.shop_table .product-remove a:hover { background: var(--marassina-pink) !important; border-color: var(--marassina-pink); }
.woocommerce-cart table.shop_table .product-remove a:hover::before, .woocommerce-cart table.shop_table .product-remove a:hover::after { background: #fff; }
.woocommerce-cart .actions { padding: 24px 0 !important; line-height: 46px; }
.woocommerce-cart .coupon { display: inline-flex; vertical-align: middle; flex-wrap: nowrap; gap: 10px; float: none; width: auto; max-width: 100%; }
.woocommerce-cart .coupon input { flex: 0 0 220px; width: 220px; min-width: 0; min-height: 46px; padding: 0 24px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-pill); background: #fff; color: var(--marassina-ink); font-family: inherit; font-size: 13px; line-height: 1.2; vertical-align: middle; }
.woocommerce-cart .coupon input::placeholder { color: var(--marassina-muted); font-family: inherit; }
.woocommerce-cart .coupon input:focus { outline: 0; border-color: var(--marassina-green); }
.woocommerce-cart .coupon button, .woocommerce-cart .actions > button { float: none; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; min-height: 46px; padding: 0 26px; border: 1px solid var(--marassina-green); border-radius: var(--marassina-radius-pill); background: transparent; color: var(--marassina-green); font-family: inherit; font-size: 11px; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; white-space: nowrap; cursor: pointer; transition: background .2s ease, color .2s ease; vertical-align: middle; }
.woocommerce-cart .actions > button { margin: 0 0 0 16px; }
.woocommerce-cart .coupon button:hover, .woocommerce-cart .actions > button:hover:not(:disabled) { background: var(--marassina-green); color: #fff; }
.woocommerce-cart .actions > button:disabled { opacity: .4; cursor: not-allowed; }
.woocommerce-cart .cart-collaterals { display: flex; float: none; width: auto; flex-direction: column; gap: 32px; }
.woocommerce-cart .cart-collaterals::before, .woocommerce-cart .cart-collaterals::after { display: none; }
.woocommerce-cart .cart-collaterals .cross-sells { float: none; clear: both; width: 100%; order: -1; }
.woocommerce-cart .cart-collaterals .cross-sells h2 { margin-bottom: 16px; color: var(--marassina-green); font-family: Georgia, serif; font-size: 22px; font-weight: 400; }
.woocommerce-cart .cart-collaterals .cross-sells ul.products { grid-template-columns: 1fr !important; gap: 16px; }
.woocommerce-cart .cart-collaterals .cross-sells li.product { min-height: 0; flex-direction: row; align-items: center; gap: 14px; padding-bottom: 0; }
.woocommerce-cart .cart-collaterals .cross-sells li.product > a.woocommerce-LoopProduct-link { flex-direction: row; align-items: center; gap: 14px; }
.woocommerce-cart .cart-collaterals .cross-sells li.product .product-thumb-frame { width: 64px; height: 64px; box-shadow: none; }
.woocommerce-cart .cart-collaterals .cross-sells li.product a img { width: 64px; height: 64px; flex: 0 0 auto; }
.woocommerce-cart .cart-collaterals .cross-sells li.product .woocommerce-loop-product__title { height: auto; min-height: 0; padding: 0 !important; font-size: 14px !important; -webkit-line-clamp: 2; }
.woocommerce-cart .cart-collaterals .cross-sells li.product .price { margin: 4px 0 0 !important; }
.woocommerce-cart .cart-collaterals .cross-sells li.product .button, .woocommerce-cart .cart-collaterals .cross-sells li.product .onsale { display: none; }
.woocommerce-cart .cart-collaterals .cart_totals { float: none; clear: both; width: 100%; order: 1; padding: 25px; background: #fff; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-lg); box-shadow: var(--marassina-shadow); }
.woocommerce-cart .cart_totals h2 { margin-bottom: 18px; font-size: 28px; }
.woocommerce-cart .wc-proceed-to-checkout { padding: 18px 0 0; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button, .woocommerce-checkout #place_order { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 50px; padding: 13px 20px; border: 0; border-radius: var(--marassina-radius-pill); background: var(--marassina-green); color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .06em; line-height: 1.2; text-align: center; text-transform: uppercase; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover, .woocommerce-checkout #place_order:hover { background: var(--marassina-pink); }
.woocommerce-checkout form.checkout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(430px, .95fr); align-items: start; column-gap: 45px; row-gap: 24px; }
.woocommerce-checkout form.checkout .col2-set { grid-column: 1; }
.woocommerce-checkout form.checkout .checkout-order-review { grid-column: 2; }
.woocommerce-checkout form.checkout #order_review_heading { margin: 0; padding: 25px 25px 12px; background: #fff; border: 1px solid var(--marassina-border); border-bottom: 0; border-radius: var(--marassina-radius-lg) var(--marassina-radius-lg) 0 0; font-family: Georgia, serif; font-size: 28px; }
.woocommerce-checkout form.checkout #order_review { padding: 0 25px 25px; background: #fff; border: 1px solid var(--marassina-border); border-top: 0; border-radius: 0 0 var(--marassina-radius-lg) var(--marassina-radius-lg); box-shadow: var(--marassina-shadow); }
.woocommerce-checkout form.checkout > .woocommerce-NoticeGroup-checkout, .woocommerce-checkout form.checkout > .woocommerce-NoticeGroup-updateOrderReview { grid-column: 1 / -1; margin-bottom: 24px; }
.woocommerce-checkout table.woocommerce-checkout-review-order-table { width: 100%; margin: 0 0 20px !important; border: 0 !important; border-radius: 0 !important; border-collapse: collapse !important; }
.woocommerce-checkout .woocommerce-checkout-review-order-table th, .woocommerce-checkout .woocommerce-checkout-review-order-table td { padding: 18px 0; border-bottom: 1px solid var(--marassina-border); font-size: 14px; vertical-align: middle; }
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name { font-size: 13px; line-height: 1.45; }
.woocommerce-checkout .woocommerce-checkout-review-order-table .marassina-product-name-row { display: flex; align-items: center; font-size: 0; }
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-total { padding-right: 16px; white-space: nowrap; vertical-align: middle; }
.woocommerce-checkout .woocommerce-checkout-review-order-table thead th.product-total { padding-right: 16px; }
.woocommerce-checkout .marassina-item-title { order: 1; flex: 1 1 auto; min-width: 0; font-size: 13px; }
.woocommerce-checkout .qty-tooltip { position: absolute; bottom: calc(100% + 8px); left: 50%; z-index: 5; width: max-content; max-width: 180px; padding: 6px 10px; transform: translateX(-50%); border-radius: 8px; background: var(--marassina-ink); color: #fff; font-size: 11px; line-height: 1.3; text-align: center; opacity: 0; pointer-events: none; transition: opacity .15s ease; }
.woocommerce-checkout .qty-tooltip::after { content: ''; position: absolute; top: 100%; left: 50%; width: 8px; height: 8px; margin-left: -4px; margin-top: -4px; background: var(--marassina-ink); transform: rotate(45deg); }
.woocommerce-checkout .marassina-qty-stepper.is-tooltip-visible .qty-tooltip { opacity: 1; }
.woocommerce-checkout .woocommerce-checkout-review-order-table .product-quantity { color: var(--marassina-muted); font-weight: 400; }
:is(.woocommerce-checkout, .woocommerce-cart) .woocommerce-checkout-review-order-totals { margin-top: 4px; }
:is(.woocommerce-checkout, .woocommerce-cart) .review-order-row { display: flex; align-items: center; justify-content: space-between; width: 100%; box-sizing: border-box; margin: 0 0 10px; padding: 14px 16px; border-radius: 10px; background: var(--marassina-cream); font-size: 14px; }
:is(.woocommerce-checkout, .woocommerce-cart) .review-order-row .amount { font-size: 14px; }
:is(.woocommerce-checkout, .woocommerce-cart) .review-order-row.order-total { background: var(--marassina-green-soft); }
/* Total row: amount big and right-aligned, the "(incluye S/ x IGV)" note on its own muted line below it. */
:is(.woocommerce-checkout, .woocommerce-cart) .review-order-row.order-total { align-items: baseline; gap: 12px; }
:is(.woocommerce-checkout, .woocommerce-cart) .review-order-row.order-total .review-order-row-value { text-align: right; }
:is(.woocommerce-checkout, .woocommerce-cart) .review-order-row.order-total .review-order-row-value strong .amount { font-size: 18px; }
:is(.woocommerce-checkout, .woocommerce-cart) .review-order-row.order-total .includes_tax { display: block; margin-top: 2px; color: var(--marassina-muted); font-size: 12px; font-weight: 400; line-height: 1.4; }
:is(.woocommerce-checkout, .woocommerce-cart) .review-order-row.order-total .includes_tax .amount { font-size: inherit; }
:is(.woocommerce-checkout, .woocommerce-cart) .review-order-row-label { font-size: 14px; font-weight: 700; color: var(--marassina-ink); }
:is(.woocommerce-checkout, .woocommerce-cart) .review-order-row.woocommerce-shipping-totals.shipping { display: block; padding: 16px; }
:is(.woocommerce-checkout, .woocommerce-cart) .review-order-row.woocommerce-shipping-totals.shipping .review-order-row-label { padding: 0 0 12px; text-align: left; }
:is(.woocommerce-checkout, .woocommerce-cart) .review-order-row.woocommerce-shipping-totals.shipping .review-order-row-value { text-align: left; }
:is(.woocommerce-checkout, .woocommerce-cart) .woocommerce-shipping-methods { list-style: none; width: 100%; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; box-sizing: border-box; }
:is(.woocommerce-checkout, .woocommerce-cart) .woocommerce-shipping-methods li { position: relative; display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px; width: 100%; box-sizing: border-box; padding: 16px 18px; border: 1px solid var(--marassina-border); border-radius: 10px; background: #fff; transition: border-color .2s ease, background .2s ease; }
:is(.woocommerce-checkout, .woocommerce-cart) .woocommerce-shipping-methods li:has(input:checked) { border-color: var(--marassina-green); background: var(--marassina-green-soft); }
:is(.woocommerce-checkout, .woocommerce-cart) .woocommerce-shipping-methods input[type="radio"] { flex: 0 0 auto; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--marassina-green); cursor: pointer; }
:is(.woocommerce-checkout, .woocommerce-cart) ul#shipping_method li input.shipping_method { margin: 2px 0 0; vertical-align: baseline; }
:is(.woocommerce-checkout, .woocommerce-cart) .woocommerce-shipping-methods label { display: block; flex: 1 1 0; min-width: 0; color: var(--marassina-ink); font-size: 14px; font-weight: 600; line-height: 1.4; cursor: pointer; }
/* Descriptions/logos added by Flexible Shipping ("Organiza tu recojo…", "Disponible para recojo…") sit on their own row under
   the method title, indented past the radio, in the muted small text used elsewhere in the card. */
:is(.woocommerce-checkout, .woocommerce-cart) .woocommerce-shipping-methods .shipping-method-description { flex: 1 1 100%; width: 100%; margin: -6px 0 0; padding-left: 30px; color: var(--marassina-muted); font-size: 13px; font-weight: 400; line-height: 1.5; }
:is(.woocommerce-checkout, .woocommerce-cart) .woocommerce-shipping-methods .shipping-method-logo { flex: 1 1 100%; margin: 0; padding-left: 30px; }
:is(.woocommerce-checkout, .woocommerce-cart) .sharff-method-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 4px 10px; }
:is(.woocommerce-checkout, .woocommerce-cart) .sharff-method-price { white-space: nowrap; flex: 0 0 auto; color: var(--marassina-pink); font-weight: 700; }
:is(.woocommerce-checkout, .woocommerce-cart) .sharff-method-title { flex: 1 1 auto; }
:is(.woocommerce-checkout, .woocommerce-cart) .sharff-weight-bar { display: block; height: 6px; margin-top: 10px; border-radius: var(--marassina-radius-pill); background: var(--marassina-sand); overflow: hidden; }
:is(.woocommerce-checkout, .woocommerce-cart) .sharff-weight-bar-fill { display: block; height: 100%; border-radius: var(--marassina-radius-pill); background: var(--marassina-green); }
:is(.woocommerce-checkout, .woocommerce-cart) .sharff-weight-note { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 10px; margin-top: 6px; color: var(--marassina-muted); font-size: 12px; font-weight: 400; line-height: 1.4; }
:is(.woocommerce-checkout, .woocommerce-cart) .sharff-weight-figures { flex: 0 0 auto; color: var(--marassina-ink); font-weight: 700; }
:is(.woocommerce-checkout, .woocommerce-cart) .woocommerce-shipping-methods .sharff-destination-point { position: relative; flex: 1 1 100%; width: 100%; margin: 14px 0 0; padding: 14px; border-radius: 8px; background: #fff; border: 1px solid var(--marassina-border); box-sizing: border-box; }
:is(.woocommerce-checkout, .woocommerce-cart) .woocommerce-shipping-methods li:has(input:checked) .sharff-destination-point { background: #fff; border-color: rgba(23,63,53,.18); }
:is(.woocommerce-checkout, .woocommerce-cart) .woocommerce-shipping-methods .sharff-destination-point label { color: var(--marassina-ink); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
:is(.woocommerce-checkout, .woocommerce-cart) .woocommerce-shipping-methods .sharff-destination-point-select { margin-top: 6px; }
.woocommerce-checkout .sharff-destination-point__hint { color: var(--marassina-muted); }
.woocommerce-checkout .sharff-destination-point__map-link { color: var(--marassina-green); }
.sharff-point-picker { position: relative; margin-top: 6px; }
.sharff-point-trigger { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 44px; padding: 0 10px 0 14px; border: 1px solid var(--marassina-border); border-radius: 8px; background: #fff; transition: border-color .2s ease; }
.sharff-point-trigger:has(.sharff-point-trigger-main:focus-visible) { border-color: var(--marassina-green); }
.sharff-point-trigger-main { flex: 1 1 auto; min-width: 0; padding: 0; border: 0; background: none; color: var(--marassina-ink); font-family: inherit; font-size: 14px; text-align: left; cursor: pointer; outline: none; }
.sharff-point-trigger-text { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sharff-point-clear { flex: 0 0 auto; display: grid; place-items: center; width: 22px; height: 22px; padding: 0; border: 0; border-radius: 50%; background: none; color: var(--marassina-muted); font-size: 16px; line-height: 1; cursor: pointer; transition: background .2s ease, color .2s ease; }
.sharff-point-clear:hover { background: var(--marassina-border); color: var(--marassina-ink); }
.sharff-point-trigger-icon { flex: 0 0 auto; width: 14px; height: 14px; color: var(--marassina-muted); pointer-events: none; }
.sharff-point-dropdown { position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 20; max-height: 220px; overflow-y: auto; margin: 0; padding: 4px; list-style: none; }
.sharff-point-dropdown .dropdown-item { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 10px; border-radius: 6px; line-height: 1.3; cursor: pointer; }
.sharff-point-option-text { flex: 1 1 auto; min-width: 0; font-size: 12px; }
.sharff-point-map-link { flex: 0 0 auto; color: var(--marassina-green); font-size: 11px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.sharff-point-map-link:hover { text-decoration: underline; }
.sharff-point-dropdown .dropdown-item:hover .sharff-point-map-link { color: #fff; }
.woocommerce-checkout .marassina-qty-stepper { margin-left: 6px; }
.woocommerce-checkout form .form-row label.woocommerce-form__label-for-checkbox { display: flex; align-items: center; gap: 8px; margin: 0; cursor: pointer; color: var(--marassina-ink); font-size: 13px; font-weight: 700; line-height: 1.5; }
.woocommerce-checkout form .form-row label.woocommerce-form__label-for-checkbox input[type="checkbox"] { margin: 0; }
.woocommerce-checkout .woocommerce-form__input-checkbox { flex: 0 0 auto; width: 20px; height: 20px; margin: 0; border: 1.5px solid #b9c3bd; border-radius: 6px; background: #fff center / 12px no-repeat; -webkit-appearance: none; appearance: none; cursor: pointer; transition: background-color .15s ease, border-color .15s ease; }
.woocommerce-checkout .woocommerce-form__input-checkbox:checked { border-color: var(--marassina-green); background-color: var(--marassina-green); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 12.5l5 5 10-11'/%3E%3C/svg%3E"); }
.woocommerce-checkout .woocommerce-form__input-checkbox:focus-visible { outline: 3px solid rgba(217, 41, 120, .32); outline-offset: 2px; }
/* Account creation: no wrapper card/padding, so the checkbox and the password
   field line up on the same left edge as every other checkout field. */
.woocommerce-checkout .woocommerce-account-fields { margin: 4px 0 0; padding: 0; background: none; }
.woocommerce-checkout .woocommerce-account-fields p.create-account { margin: 0 0 18px; }
.woocommerce-checkout .woocommerce-account-fields div.create-account { margin: 0; padding: 0; border: 0; background: none; }
/* Info tooltip ("i") next to the create-account checkbox. */
:root { --marassina-info: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4M12 8h.01'/%3E%3C/svg%3E"); }
.woocommerce-checkout .woocommerce-account-fields p.create-account { position: relative; display: flex; align-items: center; }
.woocommerce-checkout form .form-row.create-account label.woocommerce-form__label-for-checkbox { flex: 0 1 auto; }
/* Terms checkbox: text and required asterisk flow inline so the * sits right after the last word (flex gave it its own far-right item). */
.woocommerce-checkout form .woocommerce-terms-and-conditions-wrapper label.woocommerce-form__label-for-checkbox { position: relative; display: block; padding-left: 30px; }
.woocommerce-checkout form .woocommerce-terms-and-conditions-wrapper .woocommerce-form__input-checkbox { position: absolute; top: 2px; left: 0; margin: 0; }
.woocommerce-checkout form .woocommerce-terms-and-conditions-wrapper abbr.required { color: var(--marassina-pink); text-decoration: none; }
/* Password strength meter: WooCommerce's own #reg_password/#account_password/#password_1
   helper injects the same .woocommerce-password-strength markup and short/bad/good/strong
   classes on every page that has a "create a password" field — checkout account creation,
   the my-account register and edit-account forms, and the lost-password reset page — so one
   unscoped rule here restyles it consistently everywhere instead of just on checkout. */
.woocommerce-password-strength { margin: 10px 0 0; padding: 10px 14px; border: 1px solid transparent; border-radius: 8px; color: var(--marassina-ink); font-family: inherit; font-size: 12px; font-weight: 700; text-align: left; }
.woocommerce-password-strength.short { background: #fbe4ec; border-color: var(--marassina-pink); color: #9c1b53; }
.woocommerce-password-strength.bad { background: #fdece0; border-color: #e8935f; color: #8a4a1f; }
.woocommerce-password-strength.good { background: #fdf3d9; border-color: #e3b93a; color: #6b551b; }
.woocommerce-password-strength.strong { background: var(--marassina-green-soft); border-color: var(--marassina-green); color: var(--marassina-green); }
.woocommerce-password-hint { margin: 8px 0 0; color: var(--marassina-muted); font-size: 12px; line-height: 1.5; }
.info-tip { display: inline-flex; margin-left: 4px; }
.info-tip-button { display: grid; width: 32px; height: 32px; padding: 0; place-items: center; border: 0; border-radius: 50%; background: transparent; color: var(--marassina-muted); cursor: pointer; transition: color .2s ease, background-color .2s ease; }
.info-tip-button::before { content: ""; width: 18px; height: 18px; background: currentColor; -webkit-mask: var(--marassina-info) center / contain no-repeat; mask: var(--marassina-info) center / contain no-repeat; }
.info-tip-button:hover, .info-tip-button[aria-expanded="true"] { color: var(--marassina-green); background: rgba(23, 63, 53, .06); }
.info-tip-button:focus-visible { outline: 3px solid rgba(217, 41, 120, .32); }
.info-tip-bubble { position: absolute; top: calc(100% + 2px); left: 3px; z-index: 5; width: max-content; max-width: min(320px, 100%); padding: 10px 14px; border-radius: 10px; background: var(--marassina-ink); color: #fff; font-size: 12px; font-weight: 400; line-height: 1.5; box-shadow: var(--marassina-shadow); opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .15s ease, transform .15s ease, visibility .15s; pointer-events: none; }
.info-tip-button[aria-expanded="true"] + .info-tip-bubble { opacity: 1; visibility: visible; transform: none; }
@media (hover: hover) { .info-tip-button:hover + .info-tip-bubble { opacity: 1; visibility: visible; transform: none; } }
@media (prefers-reduced-motion: reduce) { .info-tip-bubble { transition: none; } }
.woocommerce-checkout .woocommerce-billing-fields h3, .woocommerce-checkout .woocommerce-additional-fields h3 { margin-bottom: 20px; font-size: 26px; }
.woocommerce-checkout form.checkout .col2-set { display: block; }
.woocommerce-checkout form.checkout .col2-set .col-1, .woocommerce-checkout form.checkout .col2-set .col-2 { float: none; width: 100%; }
.woocommerce-checkout form.checkout .col2-set .col-2 { margin-top: 30px; }
/* Taken out of document flow with position:absolute (not just display:none)
   so it can't leave reserved layout space no matter what else touches
   `display` on it — a plain display:none has, in the past, still left a
   gap here on this codebase for reasons never fully traced (possibly a
   WooCommerce Blocks CSS cascade-layer interaction). País is kept as a
   hidden input (defaults to Peru) only so WooCommerce's own address
   validation doesn't reject the form for a missing country — but
   woocommerce_form_field() still renders a full row + visible label for it
   regardless of the input's own type, so the whole row is hidden this way. */
.woocommerce-checkout #billing_state_field, .woocommerce-checkout #shipping_state_field,
.woocommerce-account #billing_state_field, .woocommerce-account #shipping_state_field,
.woocommerce-checkout #billing_country_field, .woocommerce-checkout #shipping_country_field,
.woocommerce-account #billing_country_field, .woocommerce-account #shipping_country_field {
  display: none !important;
  position: absolute !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
}
/* Nombre/Apellidos float side by side (WC core's plain .form-row-first/-last
   float+47%-width) but nothing here clears/contains that float on its
   parent, so an uncontained float can visually misplace what follows. */
.woocommerce-address-fields__field-wrapper::after,
.woocommerce-billing-fields__field-wrapper::after,
.woocommerce-shipping-fields__field-wrapper::after { content: ''; display: table; clear: both; }
.woocommerce-checkout form .form-row { margin: 0 0 18px; }
.woocommerce-checkout form .form-row label { display: block; margin-bottom: 6px; color: var(--marassina-ink); font-size: 12px; font-weight: 700; }
.woocommerce-checkout form .form-row label .required { color: var(--marassina-pink); text-decoration: none; }
.woocommerce form .input-text, .woocommerce form select, .woocommerce form textarea { width: 100%; min-height: 48px; padding: 0 16px !important; border: 1px solid var(--marassina-border) !important; border-radius: 8px !important; background: #fff; color: var(--marassina-ink); font-family: inherit; font-size: 14px; -webkit-appearance: none; appearance: none; }
.woocommerce form select { padding-right: 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2368736d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; background-size: 16px; }
.woocommerce form textarea.input-text { min-height: 90px; padding-top: 12px !important; padding-bottom: 12px !important; }
.woocommerce form .input-text:focus, .woocommerce form select:focus, .woocommerce form textarea:focus { outline: 0; border-color: var(--marassina-green) !important; box-shadow: 0 0 0 3px rgba(23,63,53,.08); }
.woocommerce .select2-container .select2-selection--single { display: flex; align-items: center; height: 48px; padding: 0 !important; border: 1px solid var(--marassina-border) !important; border-radius: 8px !important; background: #fff; }
.woocommerce .select2-container .select2-selection--single .select2-selection__rendered { flex: 1 1 auto; min-width: 0; padding-left: 16px; padding-right: 40px; color: var(--marassina-ink); font-family: inherit; font-size: 14px; line-height: normal; }
.woocommerce .select2-container .select2-selection--single .select2-selection__placeholder { color: var(--marassina-muted); }
.woocommerce .select2-container .select2-selection--single .select2-selection__arrow { top: 0; right: 6px; height: 46px; width: 34px; }
.woocommerce .select2-container .select2-selection--single .select2-selection__arrow b { border-color: var(--marassina-muted) transparent transparent transparent; border-width: 6px 5px 0 5px; }
.woocommerce .select2-container--open .select2-selection--single { border-color: var(--marassina-green) !important; border-radius: 8px !important; box-shadow: 0 0 0 3px rgba(23,63,53,.08); }
.select2-dropdown { border-color: var(--marassina-border); border-radius: 8px; overflow: hidden; font-family: inherit; font-size: 14px; }
.select2-search--dropdown .select2-search__field { border: 1px solid var(--marassina-border); border-radius: 8px; font-family: inherit; }
.select2-results__option { padding: 9px 16px; color: var(--marassina-ink) !important; }
.select2-container--default .select2-results__option[aria-selected="true"]:not(.select2-results__option--highlighted) { background: var(--marassina-green-soft) !important; color: var(--marassina-ink) !important; }
.select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--marassina-green) !important; color: #fff !important; }
#shipping_city, #billing_city { background-color: #fff !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2368736d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right 14px center !important; background-size: 16px !important; padding-right: 40px !important; border: 1px solid var(--marassina-border) !important; border-radius: 8px !important; }
#shipping_city:focus, #billing_city:focus { border-color: var(--marassina-green) !important; outline: 0 !important; box-shadow: 0 0 0 3px rgba(23,63,53,.08); }
/* The plugin's .district-clear-btn (the "x" for #billing_city/#shipping_city) sits at a fixed
   right:24px, which crowds the chevron we redraw at right:14px above — push it further left. */
.district-clear-btn { right: 32px !important; }
/* The "x" is position:absolute and needs the full-width field box as its positioning context. WooCommerce's
   .woocommerce-input-wrapper is an inline <span>; with a block-level textarea inside it collapses to an empty
   zero-width box at the left edge, which parked the "x" outside the field. Make it a block. */
#billing_city_field .woocommerce-input-wrapper, #shipping_city_field .woocommerce-input-wrapper { display: block; position: relative; }
.custom-dropdown { border: 1px solid var(--marassina-border) !important; border-radius: 8px !important; font-family: inherit; font-size: 14px; box-shadow: var(--marassina-shadow); }
.custom-dropdown .dropdown-item { padding: 9px 16px; color: var(--marassina-ink); }
.custom-dropdown .dropdown-item.is-selected { background: var(--marassina-green-soft); }
.custom-dropdown .dropdown-item:hover, .custom-dropdown .dropdown-item.is-active { background: var(--marassina-green) !important; color: #fff; }
.custom-dropdown .dropdown-item.is-active .sharff-point-map-link { color: #fff; }
.custom-dropdown .dropdown-header { position: sticky; top: 0; padding: 8px 16px; border-bottom: 1px solid var(--marassina-border); background: var(--marassina-cream); color: var(--marassina-muted); font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; cursor: default; }
.custom-dropdown .no-results { padding: 12px 16px; color: var(--marassina-ink); font-size: 13px; line-height: 1.5; text-align: center; cursor: default; }
.custom-dropdown .no-results-tip { display: block; margin-top: 2px; color: var(--marassina-muted); }
.woocommerce-checkout .checkout_coupon.woocommerce-form-coupon { display: flex; flex-wrap: nowrap; align-items: flex-start; gap: 10px; max-width: 420px; margin: 0 0 24px; }
.woocommerce-checkout .checkout_coupon .form-row { width: auto; float: none; margin: 0; }
.woocommerce-checkout .checkout_coupon .form-row-first { flex: 1 1 auto; min-width: 0; }
.woocommerce-checkout .checkout_coupon .form-row-last { flex: 0 0 auto; }
.woocommerce-checkout .checkout_coupon input.input-text { min-height: 46px; }
.woocommerce-checkout .checkout_coupon .button { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 26px; border: 1px solid var(--marassina-green) !important; border-radius: var(--marassina-radius-pill); background: transparent !important; color: var(--marassina-green) !important; font-family: inherit; font-size: 11px; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; white-space: nowrap; cursor: pointer; transition: background .2s ease, color .2s ease; }
.woocommerce-checkout .checkout_coupon .button:hover { background: var(--marassina-green) !important; color: #fff !important; }
.woocommerce-checkout #payment { margin-top: 20px; background: var(--marassina-green-soft); border-radius: var(--marassina-radius-lg); overflow: hidden; }
.woocommerce-checkout #payment ul.payment_methods { padding: 20px; border-bottom: 1px solid var(--marassina-border); }
.woocommerce-checkout #payment div.payment_box { background: #fff; border-radius: var(--marassina-radius); }
.woocommerce-checkout #payment div.payment_box::before { border-color: transparent transparent #fff !important; }
@media (max-width: 800px) { .container { width: min(calc(100% - 30px), var(--container)); } .utility-inner { justify-content: center; } .utility-inner span:first-child, .utility-inner a { display: none; } .header-main { min-height: 78px; grid-template-columns: 40px 1fr 70px; gap: 10px; } .site-branding { grid-column: 2; align-items: center; } .site-title { font-size: 26px; } .site-tagline, .header-search, .header-action .icon-tooltip { display: none; } .header-tools { grid-column: 3; gap: 12px; } .primary-navigation { position: absolute; top: 100%; left: 0; right: 0; display: none; padding: 20px; background: var(--marassina-cream); border-bottom: 1px solid var(--marassina-border); } .primary-navigation.is-open { display: block; } .primary-navigation ul { display: block; } .primary-navigation li { padding: 9px 0; } .menu-toggle { display: block; grid-column: 1; width: 24px; padding: 0; border: 0; background: transparent; } .menu-toggle span:not(.screen-reader-text) { display: block; width: 22px; height: 2px; margin: 4px 0; background: var(--marassina-green); } .desktop-navigation { overflow-x: auto; } .desktop-navigation ul { gap: 20px; white-space: nowrap; } .category-mega-menu { position: fixed; top: auto; left: 15px; right: 15px; width: auto; grid-template-columns: 1fr; max-height: 70vh; overflow-y: auto; } .category-mega-intro { padding: 0 0 18px; border-right: 0; border-bottom: 1px solid var(--marassina-border); } .category-mega-grid { grid-template-columns: repeat(2, 1fr); padding: 18px 0 0; } .nav-cart { display: none; } .announcement-item { min-height: 44px; padding-inline: 32px; } .announcement-item::after { margin-left: 32px; } .hero-grid, .single-product div.product .content-single-wrapper { grid-template-columns: 1fr; }
.offers-banner { display: block; min-height: 0; border-radius: var(--marassina-radius); }
.offers-banner-media { position: relative; inset: auto; height: 190px; }
.offers-banner-scrim { display: none; }
.offers-banner-content { position: static; max-width: none; padding: 24px 22px; }
.offers-badge { top: 20px; right: 20px; width: 68px; height: 68px; }
.offers-badge strong { font-size: 16px; }
.offers-stamp { right: 16px; bottom: 12px; font-size: 12px; }
.news-grid { grid-template-columns: 1fr; gap: 22px; } .home-heading-row { margin-bottom: 30px; } .home-heading-link { position: static; display: block; margin-top: 14px; text-align: center; } .news-archive-link { width: 100%; min-width: 0; } .news-doodle-card { width: 44px; height: 44px; } .hero-grid { min-height: auto; padding-block: 68px 38px; } .hero-art { min-height: 350px; } .hero-fullbleed { min-height: 100vh; min-height: 100dvh; align-items: flex-end; } .hero-overlay-content { padding-block: 0 40px; } .hero-product-stack { inset: 20px 0 0; max-width: 430px; margin-inline: auto; } .hero-product-card-1 { right: 30px; width: 225px; height: 270px; } .hero-product-card-2 { left: 12px; width: 165px; height: 190px; } .hero-product-card-3 { right: 4px; width: 140px; height: 160px; } .hero-orb-one { width: 260px; height: 260px; } .hero-orb-two { width: 160px; height: 160px; } .section { padding: 70px 0; } .offers-section { padding-bottom: 28px; } .news-section { padding-top: 28px; } .woocommerce-products-header { margin: 22px 0; padding: 24px 22px; border-radius: 18px; } .single-product .woocommerce-Tabs-panel { padding: 24px 22px !important; border-radius: 18px; } .products { grid-template-columns: repeat(2, 1fr); gap: 25px 14px; } .footer-grid { grid-template-columns: 1fr; padding-bottom: 35px; } .footer-menu-panel > ul > li { min-height: 0; padding: 22px 0; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.15); } .product-buy-notes { grid-template-columns: 1fr; gap: 8px; } }
@media (prefers-reduced-motion: reduce) { .products li.product:hover, .products li.product:hover .product-thumb-frame img { transform: none !important; } html { scroll-behavior: auto; } *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; } }
@media (prefers-reduced-motion: reduce) { .announcement-bar.is-scrolling .announcement-track { animation: none; width: 100%; justify-content: center; } .announcement-group { flex-wrap: wrap; justify-content: center; } .announcement-item.is-clone, .announcement-group.is-clone { display: none; } }
@media (max-width: 1050px) and (min-width: 801px) { .products { grid-template-columns: repeat(3, minmax(0, 1fr)); } .single-product div.product .content-single-wrapper { gap: 34px; } }
@media (max-width: 800px) { .utility-inner span:nth-child(2) { display: none; } .marassina-order-steps { margin: 15px auto 35px; } .order-step strong { font-size: 10px; } .marassina-cart-layout, .woocommerce-checkout form.checkout { grid-template-columns: minmax(0, 1fr); gap: 30px; } .woocommerce-cart .marassina-cart-layout > .woocommerce-cart-form, .woocommerce-cart .marassina-cart-layout > .cart-collaterals, .woocommerce-checkout form.checkout .col2-set, .woocommerce-checkout form.checkout .checkout-order-review, .woocommerce-checkout form.checkout > .woocommerce-NoticeGroup-checkout, .woocommerce-checkout form.checkout > .woocommerce-NoticeGroup-updateOrderReview { grid-column: 1; } .woocommerce-cart table.shop_table thead { display: none; } .woocommerce-cart table.shop_table td { padding: 12px 5px; } .woocommerce-cart table.shop_table .product-thumbnail { display: none; } }
@media (max-width: 800px) { .footer-grid { padding-inline: 0; } .footer-column, .footer-column:first-child, .footer-column:last-child { min-height: 0; padding: 22px 0; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.15); } .footer-column:last-child { border-bottom: 0; } .footer-bottom { display: block; } .footer-bottom span { display: block; margin-bottom: 8px; } }
@media (max-width: 800px) { .single-product div.product div.summary { position: static; padding-top: 0; } }
@media (max-width: 480px) { .product-trust-panel ul { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 480px) { .products { grid-template-columns: 1fr; } }
@media (max-width: 800px) {
  .desktop-navigation { display: none; }
  .nav-actions { display: none; }
  .site-header { z-index: 100; }
  .header-main { position: relative; }
  .primary-navigation { top: 100%; z-index: 40; width: 100%; max-height: calc(100vh - 130px); overflow-y: auto; box-shadow: 0 16px 28px rgba(14,43,37,.12); }
  .primary-navigation.is-open { display: block; }
  .primary-navigation ul { display: flex; flex-direction: column; gap: 0; }
  .primary-navigation li { border-bottom: 1px solid var(--marassina-border); }
  .primary-navigation li:last-child { border-bottom: 0; }
  .primary-navigation a { display: block; padding: 12px 0; }
  .menu-toggle { position: relative; z-index: 45; cursor: pointer; }
  .menu-toggle span:not(.screen-reader-text) { transition: transform .2s ease, opacity .2s ease; }
  .menu-is-open .menu-toggle span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .menu-is-open .menu-toggle span:nth-child(2) { opacity: 0; }
  .menu-is-open .menu-toggle span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
  .announcement-item { padding-inline: 30px; }
  .announcement-item::after { margin-left: 30px; }
}

/* ==== My Account ==== */

/* Generic form-row/label skin, previously checkout-only, extended so address
   edit / account details / login / register all match. */
.woocommerce-account form .form-row { margin: 0 0 18px; }
.woocommerce-account form .form-row label { display: block; margin-bottom: 6px; color: var(--marassina-ink); font-size: 12px; font-weight: 700; }
.woocommerce-account form .form-row .required { color: var(--marassina-pink); text-decoration: none; }
.woocommerce-account fieldset { margin: 24px 0 0; padding: 20px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius); }
.woocommerce-account fieldset legend { padding: 0 8px; margin-left: -8px; color: var(--marassina-green); font-family: Georgia, serif; font-size: 18px; }

/* Buttons: same pill treatment as a.button, but for the <button>/<input>
   elements WC uses for save-address / save-account / login / register. */
.woocommerce-account button.button, .woocommerce-account input.button {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 46px; padding: 0 26px; border: 1px solid var(--marassina-green);
  border-radius: var(--marassina-radius-pill); background: var(--marassina-green);
  color: #fff; font-family: inherit; font-size: 11px; font-weight: 750;
  letter-spacing: .07em; text-transform: uppercase; cursor: pointer;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.woocommerce-account button.button:hover, .woocommerce-account input.button:hover { background: var(--marassina-pink); border-color: var(--marassina-pink); transform: translateY(-1px); }

/* Nav + content two-column layout. Plain floats rather than a :has()-based
   grid on the parent, so it doesn't depend on that being supported/matched —
   the empty notices-wrapper div that's also a sibling here just collapses to
   0 height and doesn't need any special handling either way. */
.woocommerce-account .woocommerce::after { content: ''; display: table; clear: both; }
.woocommerce-account .woocommerce-MyAccount-navigation { float: left; width: 220px; margin-top: 6px; }
/* WC core CSS (woocommerce-layout.css) already floats this element right at
   68% width — that fights the margin-left approach (not enough room beside
   the nav float, so it wraps below instead), so both are explicitly reset
   here rather than just adding margin on top of them. display:flow-root
   gives this column its own block-formatting context: without it, any
   clear:both used ANYWHERE inside the form (WC core gives every
   .form-row-wide one) doesn't just clear the two floated name fields next
   to it — it clears the tall floated nav sidebar too, since a plain block
   box doesn't contain outside floats on its own. That's what was pushing
   Departamento ~90px further down than it should've been. */
.woocommerce-account .woocommerce-MyAccount-content { float: none; width: auto; margin-left: 252px; margin-top: 6px; display: flow-root; }

.woocommerce-MyAccount-navigation ul { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 0; list-style: none; }
.woocommerce-MyAccount-navigation-link a { display: block; padding: 11px 16px; border-radius: var(--marassina-radius); color: var(--marassina-ink); font-size: 13px; font-weight: 700; text-decoration: none; transition: background .2s ease, color .2s ease; }
.woocommerce-MyAccount-navigation-link a:hover { background: var(--marassina-green-soft); color: var(--marassina-green); }
.woocommerce-MyAccount-navigation-link.is-active a { background: var(--marassina-green); color: #fff; }
.woocommerce-MyAccount-navigation-link--customer-logout { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--marassina-border); }
.woocommerce-MyAccount-navigation-link--customer-logout a { color: var(--marassina-muted); }
.woocommerce-MyAccount-navigation-link--customer-logout a:hover { background: transparent; color: var(--marassina-pink); }

.woocommerce-MyAccount-content { padding: 28px; background: #fff; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-lg); box-shadow: var(--marassina-shadow); }
.woocommerce-MyAccount-content > p { margin: 0 0 14px; color: var(--marassina-ink); line-height: 1.65; }
.woocommerce-MyAccount-content a:not(.button) { color: var(--marassina-pink); text-decoration: underline; text-underline-offset: 2px; }

/* Address overview cards (Facturación / Envío). The edit link sits as a
   small pill in the card's top-right corner instead of squeezed into the
   title row, so the title gets its own breathing room. */
.woocommerce-Addresses { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; margin-top: 4px; }
.woocommerce-Address { position: relative; padding: 24px 130px 22px 22px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius); background: var(--marassina-cream); }
.woocommerce-Address-title { margin-bottom: 12px; }
.woocommerce-Address-title h2, .woocommerce-Address-title h3 { margin: 0; font-size: 18px; }
.woocommerce-Address-title .edit { position: absolute; top: 20px; right: 20px; padding: 7px 14px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-pill); background: #fff; color: var(--marassina-green); font-size: 9px; font-weight: 700; letter-spacing: .05em; text-align: center; text-decoration: none; text-transform: uppercase; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.woocommerce-Address-title .edit:hover { background: var(--marassina-green); border-color: var(--marassina-green); color: #fff; }
.woocommerce-Address address { color: var(--marassina-muted); font-style: normal; font-size: 14px; line-height: 1.6; }

@media (max-width: 480px) {
  .woocommerce-Address { padding: 50px 20px 20px; }
  .woocommerce-Address-title .edit { top: 16px; right: 16px; left: 16px; }
}

/* Orders table. */
.woocommerce-orders-table { border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius); overflow: hidden; border-spacing: 0; }
.woocommerce-orders-table__header { padding: 12px 16px; background: var(--marassina-green-soft); color: var(--marassina-green); font-size: 10px; font-weight: 750; letter-spacing: .07em; text-align: left; text-transform: uppercase; }
.woocommerce-orders-table__cell { padding: 14px 16px; border-top: 1px solid var(--marassina-border); font-size: 13px; }
.woocommerce-orders-table__cell-order-actions { display: flex; flex-wrap: wrap; gap: 8px; }
/* !important: needed to beat ".woocommerce a.button" (main.css:323) on
   specificity — two classes there (incl. the element selector) outweigh
   the two classes here, so the plain override was silently losing and this
   cell was rendering at the general button size, wrapping to 2 lines. */
.woocommerce-orders-table__cell-order-actions .button { min-height: 26px !important; padding: 0 12px !important; font-size: 9px !important; font-weight: 700 !important; letter-spacing: .04em !important; }
.woocommerce-orders-table__row--status-completed .woocommerce-orders-table__cell-order-status { color: var(--marassina-green); font-weight: 700; }
.woocommerce-orders-table__row--status-pending .woocommerce-orders-table__cell-order-status,
.woocommerce-orders-table__row--status-on-hold .woocommerce-orders-table__cell-order-status { color: var(--marassina-pink); font-weight: 700; }
.woocommerce-orders-table__row--status-cancelled .woocommerce-orders-table__cell-order-status { color: var(--marassina-muted); font-weight: 700; }

/* Login / Register. */
/* Flexbox rather than display:grid on #customer_login — grid hit the same
   kind of misplacement bug the nav/content layout did. Unlike that case,
   there are only ever exactly two known children here (.col-1/.col-2), so
   flex's own auto-placement ambiguity that grid ran into isn't a risk —
   and flex's align-items:stretch is what gets both cards the same height
   (Registro's extra privacy-notice paragraph made it taller than Iniciar
   sesión with plain floats, which don't stretch siblings to match). */
/* align-items:flex-start (not stretch) — stretching both cards to match
   whichever is taller just left dead space at the bottom of the shorter
   one; sizing each to its own content is more compact overall. */
/* WC core gives every .col2-set a legacy micro-clearfix: ::before/::after
   with content:" "; display:table — meant for the old float layout. Once
   this is flex, those pseudo-elements become real flex items themselves
   (a near-zero-width one before .col-1, one after .col-2), which is what
   was pushing "Iniciar sesión" 24px right (exactly the gap value) and
   throwing off the row's own height/alignment. Flex doesn't need a
   clearfix at all, so they're switched off outright. */
.woocommerce-account #customer_login.col2-set::before, .woocommerce-account #customer_login.col2-set::after { content: none; display: none; }
/* align-items: flex-start (not stretch) — the register card grows on its own as the
   password-strength meter appears/changes while typing; with stretch that dynamic height
   was forced onto the login card too, leaving it with an ever-changing empty gap below its
   button. Independent, content-sized cards avoid that reflow entirely. */
.woocommerce-account #customer_login.col2-set { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 24px; }
.woocommerce-account #customer_login .col-1, .woocommerce-account #customer_login .col-2 { box-sizing: border-box; float: none; width: auto; margin: 0; flex: 1 1 280px; display: flex; flex-direction: column; padding: 28px; background: #fff; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-lg); box-shadow: var(--marassina-shadow); }
.woocommerce-account #customer_login h2 { margin-bottom: 14px; font-size: 22px; }
/* Tighter than the 18px address-form default above — login/register are
   short, dense forms and felt loose/oversized at that spacing. */
.woocommerce-account #customer_login .form-row { margin-bottom: 12px; }
.woocommerce-account #customer_login .form-row label { margin-bottom: 4px; }
.woocommerce-account #customer_login p.form-row { margin-top: 4px; }
.woocommerce-account #customer_login .woocommerce-LostPassword { margin-top: 10px; }
.woocommerce-account #customer_login .col-1 form, .woocommerce-account #customer_login .col-2 form { display: flex; flex-direction: column; flex: 1; }
/* The privacy/legal copy on Registro shouldn't visually compete with the
   actual form fields above it. */
/* order:2 pulls this below the submit button (order:1, set further down) —
   the form is already a flex column (see .col-1/.col-2 form above), so
   reordering visually here doesn't need touching the template's markup. */
.woocommerce-account #customer_login .col-2 form > .woocommerce-privacy-policy-text { order: 2 !important; margin: 10px 0 0 !important; }
.woocommerce-account .woocommerce-privacy-policy-text { margin: 0 !important; }
.woocommerce-account .woocommerce-privacy-policy-text p { margin: 0 !important; color: var(--marassina-muted); font-size: 12px; line-height: 1.6; }
.woocommerce-account #customer_login wc-order-attribution-inputs { display: block; margin: 0; padding: 0; line-height: 0; }
/* The button's own row still carries the general 12px margin-bottom
   meant for spacing BETWEEN input rows — irrelevant once it's the last
   visible thing before the (now reordered) privacy text/checkbox. */
/* Both cards' button row goes to 0 margin-bottom, so "¿Perdiste tu
   contraseña?" (login) and the privacy text (register) — each margin-top:10px
   below their own button — land at the exact same height. Login's row was
   still picking up the general 12px .form-row margin-bottom that register's
   was already overridden to 0, so the two links/text sat 12px apart. */
.woocommerce-account #customer_login p.form-row:not(.form-row-wide) { margin-bottom: 0 !important; }
.woocommerce-account .woocommerce-privacy-policy-link { color: var(--marassina-muted); text-decoration: underline; }
.woocommerce-account .woocommerce-form-login__rememberme { align-items: center; }
/* :not(.form-row-wide) — plain ".form-row" as a selector matches ANY row,
   since WC's wide/first/last rows all carry "form-row" as one of several
   classes too. Without this exclusion, the flex-row treatment meant for
   just the checkbox+submit row was hijacking the Correo/Contraseña rows as
   well — their full-width input had nowhere to fit next to the label
   inside a row-direction flex box, so it wrapped onto its own line, and
   the row's own `gap` (not the intended label margin-bottom) ended up
   controlling the label-to-input spacing there instead. */
/* Login: this one row holds both the Recuérdame checkbox AND the submit
   button as siblings — column-reverse flips their visual order (button on
   top, checkbox below) without needing separate elements to reorder.
   Register: this row is button-only; order:1 (paired with the privacy
   text's order:2 above) puts it right after the password field instead of
   after the (now order:2) privacy paragraph. Both end up with the button
   directly after their last input field, so the two cards' buttons land
   at the same height without needing to force the cards to equal height. */
.woocommerce-account #customer_login .col-2 form > p.form-row:not(.form-row-wide) { order: 1; }
/* nowrap — flex-wrap left the checkbox+button pair free to wrap onto
   separate lines depending on available width, which was landing
   inconsistently; nowrap forces them onto one row every time. */
.woocommerce-account #customer_login p.form-row:not(.form-row-wide) { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 10px; }
/* nowrap on the row (above) forced the button to shrink to fit next to the
   checkbox, which broke its own text onto 2 lines — flex-shrink:0 +
   white-space:nowrap here guarantee the button keeps its natural size and
   never breaks internally; slightly tighter padding buys back the room
   the checkbox needs so both genuinely fit on one line at this card width. */
.woocommerce-account #customer_login p.form-row:not(.form-row-wide) button.button { order: -1; flex-shrink: 0; white-space: nowrap; padding: 0 18px; }
.woocommerce-account #customer_login p.form-row:not(.form-row-wide) .woocommerce-form-login__rememberme { flex-shrink: 1; min-width: 0; }

/* "¿Perdiste tu contraseña?" — same card treatment as the login/register
   pair, just a single centered column instead of two. */
.woocommerce-account form.woocommerce-ResetPassword { max-width: 480px; margin: 0; box-sizing: border-box; padding: 28px; background: #fff; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-lg); box-shadow: var(--marassina-shadow); }
.woocommerce-account form.woocommerce-ResetPassword > p:first-child { margin-top: 0; color: var(--marassina-muted); font-size: 14px; line-height: 1.6; }
.woocommerce-account form.woocommerce-ResetPassword .form-row-first { width: 100%; float: none; }
.woocommerce-form-login__rememberme { display: inline-flex !important; align-items: center; gap: 8px; margin-right: 16px; font-size: 13px; font-weight: 400 !important; }
.woocommerce-form-login__rememberme input { width: 16px; height: 16px; accent-color: var(--marassina-green); }
.woocommerce-LostPassword { margin-top: 14px; font-size: 12px; }

@media (max-width: 800px) {
  .woocommerce-account .woocommerce-MyAccount-navigation { float: none; width: auto; }
  .woocommerce-account .woocommerce-MyAccount-content { margin-left: 0; margin-top: 20px; }
  .woocommerce-MyAccount-navigation ul { flex-direction: row; flex-wrap: wrap; }
  .woocommerce-MyAccount-navigation-link a { padding: 9px 14px; }
  .woocommerce-MyAccount-content { padding: 20px; }
  /* WC's own smallscreen stylesheet already stacks .col-1/.col-2 to
     float:none;width:100% below 768px — just adding the gap between them
     that the side-by-side margin/float spacing doesn't give when stacked. */
  .woocommerce-account #customer_login .col-1 { margin-bottom: 20px; }
}

/* "Pagar por pedido" (order-pay, e.g. retrying/paying an existing order).
   Its own template (checkout/form-pay.php) renders a plain WC default
   table — the site's shop_table card treatment only covers .woocommerce-cart
   so far, so this table had no border/radius/shadow of its own. Narrower
   than the theme's usual 850px .content-narrow: unlike checkout, this is a
   single-column flow (no billing form beside it), so the full width just
   left the table/payment box looking overly stretched out. */
.woocommerce-order-pay .site-main .container.content-narrow { max-width: 620px; }
/* border-collapse:collapse fights border-radius/overflow:hidden on <table>
   — collapsed cell borders paint outside the box the radius clips to,
   leaving a sliver of the white background showing through at the
   corners (most visible against the green header). border-collapse:separate
   with 0 spacing avoids that entirely while looking identical otherwise. */
.woocommerce-order-pay table.shop_table { width: 100%; margin: 0 0 20px; border-collapse: separate; border-spacing: 0; background: #fff; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-lg); box-shadow: var(--marassina-shadow); overflow: hidden; }
.woocommerce-order-pay table.shop_table thead th { padding: 14px 18px; background: var(--marassina-green-soft); color: var(--marassina-green); font-size: 10px; font-weight: 750; letter-spacing: .07em; text-align: left; text-transform: uppercase; }
.woocommerce-order-pay table.shop_table tbody td { padding: 14px 18px; border-top: 1px solid var(--marassina-border); font-size: 14px; vertical-align: middle; }
.woocommerce-order-pay table.shop_table tfoot th, .woocommerce-order-pay table.shop_table tfoot td { padding: 12px 18px; border-top: 1px solid var(--marassina-border); font-size: 13px; font-weight: 400; text-align: left; }
.woocommerce-order-pay table.shop_table tfoot tr:last-of-type th, .woocommerce-order-pay table.shop_table tfoot tr:last-of-type td { font-weight: 700; color: var(--marassina-green); font-size: 15px; }
.woocommerce-order-pay table.shop_table .product-quantity, .woocommerce-order-pay table.shop_table .product-total { white-space: nowrap; }

@media (max-width: 600px) {
  .woocommerce-order-pay table.shop_table { font-size: 13px; }
  .woocommerce-order-pay table.shop_table thead th, .woocommerce-order-pay table.shop_table tbody td, .woocommerce-order-pay table.shop_table tfoot th, .woocommerce-order-pay table.shop_table tfoot td { padding: 10px 12px; }
  .woocommerce-order-pay table.shop_table .product-name { display: block; width: 100%; }
}

/* ==== Header: menu button, favorites badge ==== */

.nav-category-trigger-label { white-space: nowrap; }
button.icon-button { border: 0; background: transparent; font: inherit; cursor: pointer; }
.wishlist-count { position: absolute; top: -7px; right: -9px; display: grid; min-width: 17px; height: 17px; padding: 0 3px; box-sizing: border-box; border-radius: 999px; background: var(--marassina-pink); color: #fff; place-items: center; font-size: 10px; font-style: normal; line-height: 1; }
.wishlist-count[hidden] { display: none; }
.has-transparent-header:not(.is-scrolled):not(.menu-is-open) .nav-category-trigger:hover { background: rgba(255,255,255,.16); }

/* ==== Drawers: cart, favorites, account ==== */

html.drawer-open, html.drawer-open body { overflow: hidden; }
.marassina-drawer { position: fixed; inset: 0; z-index: 300; visibility: hidden; pointer-events: none; transition: visibility 0s linear .34s; }
.marassina-drawer.is-open { visibility: visible; pointer-events: auto; transition-delay: 0s; }
.admin-bar .marassina-drawer { top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 782px) { .admin-bar .marassina-drawer { top: var(--wp-admin--admin-bar--height, 46px); } }
@media (max-width: 600px) { .admin-bar .marassina-drawer { top: 0; } }
.drawer-backdrop { position: absolute; inset: 0; background: rgba(14, 43, 37, .46); opacity: 0; transition: opacity .3s ease; }
.marassina-drawer.is-open .drawer-backdrop { opacity: 1; }
.drawer-sheet { position: absolute; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; width: min(440px, 100%); background: #fff; box-shadow: -24px 0 60px rgba(14, 43, 37, .18); transform: translateX(100%); transition: transform .34s cubic-bezier(.22, .8, .24, 1); outline: 0; }
.marassina-drawer.is-open .drawer-sheet { transform: none; }
.drawer-panel { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; }
.drawer-panel[hidden] { display: none; }
.marassina-cart-inner, .marassina-wishlist-inner, .marassina-account-inner { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; transition: opacity .18s ease; }
.marassina-cart-inner.is-loading { opacity: .55; pointer-events: none; }

.drawer-icon { display: block; width: 18px; height: 18px; flex: 0 0 auto; fill: currentColor; stroke: none; }
.drawer-icon.is-solid { display: none; }
.drawer-head { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 20px 18px 26px; border-bottom: 1px solid var(--marassina-border); }
.drawer-title { margin: 0; color: var(--marassina-green); font-size: 24px; line-height: 1.15; letter-spacing: -.02em; }
.drawer-title-count { color: var(--marassina-muted); font-family: inherit; font-size: 15px; letter-spacing: 0; }
.drawer-close { display: grid; flex: 0 0 auto; width: 40px; height: 40px; margin-left: auto; padding: 0; place-items: center; border: 0; border-radius: 12px; background: transparent; color: var(--marassina-green); cursor: pointer; transition: background .2s ease, color .2s ease; }
.drawer-close:hover { background: rgba(224, 234, 226, .65); color: var(--marassina-pink); }
.drawer-close .drawer-icon { width: 20px; height: 20px; }
.drawer-body { flex: 1 1 auto; min-height: 0; padding: 4px 26px 24px; overflow-y: auto; overscroll-behavior: contain; }
.drawer-loading::after { content: ''; display: block; width: 26px; height: 26px; margin: 72px auto; border: 2px solid var(--marassina-border); border-top-color: var(--marassina-green); border-radius: 50%; animation: drawer-spin .7s linear infinite; }
@keyframes drawer-spin { to { transform: rotate(360deg); } }

/* Buttons shared by all panels */
.drawer-cta { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 52px; padding: 0 24px; border: 1px solid var(--marassina-green); border-radius: var(--marassina-radius-pill); background: var(--marassina-green); color: #fff; font-family: inherit; font-size: 12px; font-weight: 750; letter-spacing: .09em; line-height: 1; text-align: center; text-decoration: none; text-transform: uppercase; cursor: pointer; transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease; }
.drawer-cta:hover { background: var(--marassina-green-dark); border-color: var(--marassina-green-dark); color: #fff; transform: translateY(-1px); }
.drawer-cta[aria-disabled="true"], .drawer-cta:disabled { border-color: #e4e8e4; background: #e4e8e4; color: #9aa39e; transform: none; }
.drawer-cta[aria-disabled="true"] { cursor: not-allowed; }
.drawer-cta:disabled { cursor: progress; }
.drawer-link { display: block; margin-top: 14px; color: var(--marassina-green); font-size: 12px; font-weight: 700; letter-spacing: .07em; text-align: center; text-decoration: underline; text-underline-offset: 3px; text-transform: uppercase; }
.drawer-link:hover, .drawer-text-button:hover, .drawer-notice-action:hover, .drawer-login-hint button:hover { color: var(--marassina-pink); }
.drawer-text-button, .drawer-notice-action, .drawer-login-hint button { padding: 0; border: 0; background: none; color: var(--marassina-green); font: inherit; font-size: 13px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

/* Empty / logged-out states */
.drawer-state { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 32px 30px 72px; text-align: center; }
.drawer-state-icon { display: grid; width: 76px; height: 76px; margin-bottom: 22px; place-items: center; border-radius: 50%; background: var(--marassina-green-soft); color: var(--marassina-green); }
.drawer-state-icon .drawer-icon { width: 30px; height: 30px; }
.drawer-state h3 { margin: 0 0 8px; font-size: 26px; }
.drawer-state p { max-width: 30ch; margin: 0 0 26px; color: var(--marassina-muted); font-size: 14px; }
.drawer-state .drawer-cta { width: auto; min-width: 230px; }

/* Line items (cart + favorites) */
.drawer-items { margin: 0; padding: 0; list-style: none; }
.drawer-item { position: relative; display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; gap: 16px; padding: 20px 0; border-bottom: 1px solid var(--marassina-border); }
.drawer-item:last-child { border-bottom: 0; }
.drawer-item-thumb { display: block; width: 72px; height: 72px; overflow: hidden; border-radius: 10px; background: var(--marassina-sand); }
.drawer-item-thumb img { width: 100%; height: 100%; object-fit: cover; }
.drawer-item-info { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; min-width: 0; }
.drawer-item-title { display: -webkit-box; overflow: hidden; color: var(--marassina-green); font-family: Georgia, serif; font-size: 16px; font-weight: 500; line-height: 1.3; text-decoration: none; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
a.drawer-item-title:hover { color: var(--marassina-pink); }
.drawer-item-meta { color: var(--marassina-muted); font-size: 12px; line-height: 1.4; }
.drawer-item-badge { padding: 2px 9px; border-radius: var(--marassina-radius-pill); background: var(--marassina-green-soft); color: var(--marassina-green); font-size: 10px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.drawer-item-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; margin-top: 6px; }
.drawer-item-price { color: var(--marassina-pink); font-size: 14px; font-weight: 650; }
.drawer-item-price del { color: var(--marassina-muted); font-weight: 400; }
.drawer-item-price ins { text-decoration: none; }
.drawer-item-remove { display: grid; width: 32px; height: 32px; margin: -6px -6px 0 0; padding: 0; place-items: center; border: 0; border-radius: 10px; background: transparent; color: var(--marassina-muted); cursor: pointer; transition: background .2s ease, color .2s ease; }
.drawer-item-remove:hover { background: rgba(217, 41, 120, .08); color: var(--marassina-pink); }
.drawer-item-remove .drawer-icon { width: 16px; height: 16px; }
.drawer-item-remove.is-heart { color: var(--marassina-pink); }
.drawer-item-remove.is-heart .drawer-icon.is-outline, .wishlist-toggle.is-active .drawer-icon.is-outline { display: none; }
.drawer-item-remove.is-heart .drawer-icon.is-solid, .wishlist-toggle.is-active .drawer-icon.is-solid { display: block; }
.drawer-qty, .marassina-qty { display: inline-flex; align-items: center; height: 34px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-pill); }
.drawer-qty button, .marassina-qty button { display: grid; width: 32px; height: 100%; padding: 0; place-items: center; border: 0; border-radius: var(--marassina-radius-pill); background: transparent; color: var(--marassina-green); font-size: 16px; line-height: 1; cursor: pointer; transition: background .2s ease, color .2s ease; }
.drawer-qty button:hover:not(:disabled), .marassina-qty button:hover:not(:disabled) { background: var(--marassina-green-soft); }
.drawer-qty button:disabled, .marassina-qty button:disabled { color: #b7bfba; cursor: not-allowed; }
.drawer-qty-value, .marassina-qty input.qty { min-width: 22px; color: var(--marassina-ink); font-size: 13px; font-weight: 650; text-align: center; }
/* Shared pill stepper (WC quantity template override + checkout): input part. Sits under the drawer's .drawer-qty look so every stepper matches. */
.marassina-qty input.qty, .woocommerce form .marassina-qty input.qty { width: 34px; height: 100%; min-height: 0; font-family: inherit; margin: 0; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent; box-shadow: none !important; -moz-appearance: textfield; appearance: textfield; }
.marassina-qty input.qty::-webkit-outer-spin-button, .marassina-qty input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.marassina-qty input.qty:focus-visible, .woocommerce form .marassina-qty input.qty:focus-visible { outline: 2px solid var(--marassina-green); outline-offset: -2px; border-radius: var(--marassina-radius-pill) !important; }
.marassina-qty input.qty:disabled { opacity: .5; }
.marassina-qty button:focus-visible { outline: 2px solid var(--marassina-green); outline-offset: -2px; }
.woocommerce-checkout .marassina-qty-stepper { order: 2; position: relative; flex: 0 0 auto; }
/* Mobile checkout order summary: title gets its own full-width line, stepper + price sit beneath it. */
@media (max-width: 600px) {
  .woocommerce-checkout .woocommerce-checkout-review-order-table .marassina-product-name-row { flex-wrap: wrap; gap: 10px 0; }
  .woocommerce-checkout .marassina-item-title { flex: 1 1 100%; }
  .woocommerce-checkout .marassina-qty-stepper, .woocommerce-checkout .marassina-qty-stepper.marassina-qty { margin-left: 0; }
  .woocommerce-checkout .woocommerce-checkout-review-order-table td.product-total { vertical-align: bottom; }
}
.woocommerce-cart table.shop_table td.product-quantity .quantity { margin: 0; }
.single-product form.cart .marassina-qty { height: 46px; }
.single-product form.cart .marassina-qty input.qty { font-size: 14px; }
.drawer-qty-static { color: var(--marassina-muted); font-size: 13px; }
.drawer-mini-button { display: inline-flex; align-items: center; justify-content: center; min-height: 34px; padding: 0 16px; border: 1px solid var(--marassina-green); border-radius: var(--marassina-radius-pill); background: var(--marassina-green); color: #fff; font-size: 11px; font-weight: 750; letter-spacing: .07em; line-height: 1; text-decoration: none; text-transform: uppercase; transition: background .2s ease, color .2s ease; }
.drawer-mini-button:hover { background: var(--marassina-green-dark); color: #fff; }
.drawer-mini-button.is-ghost { background: transparent; color: var(--marassina-green); }
.drawer-mini-button.is-ghost:hover { background: var(--marassina-green); color: #fff; }
.drawer-mini-button.loading { opacity: .55; pointer-events: none; }
.drawer-panel a.added_to_cart { display: none; }
/* "Before you go" suggestions (cart drawer): scroll-snap carousel, one card per slide */
.woocommerce-checkout .drawer-suggest { margin: 0 0 16px; padding-top: 0; border-top: 0; }
.drawer-suggest { margin-top: 8px; padding-top: 20px; border-top: 1px solid var(--marassina-border); }
.drawer-suggest-title { margin: 0 0 12px; color: var(--marassina-green); font-family: Georgia, serif; font-size: 17px; font-weight: 500; }
.drawer-suggest-track { display: flex; margin: 0; padding: 0; overflow-x: auto; list-style: none; scroll-snap-type: x mandatory; scrollbar-width: none; gap: 12px; }
.drawer-suggest-track::-webkit-scrollbar { display: none; }
.drawer-suggest-card { display: grid; flex: 0 0 100%; grid-template-columns: 64px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 14px; border: 1px solid var(--marassina-border); border-radius: 14px; scroll-snap-align: start; }
.drawer-suggest-card .drawer-item-thumb { width: 64px; height: 64px; }
.drawer-suggest-nav { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; }
.drawer-suggest-dots { display: flex; gap: 6px; }
.drawer-suggest-dots i { width: 7px; height: 7px; border-radius: 50%; background: var(--marassina-border); transition: background .2s ease; }
.drawer-suggest-dots i.is-active { background: var(--marassina-green); }
.drawer-suggest-arrows { display: flex; gap: 4px; }
.drawer-suggest-arrows button { display: grid; width: 30px; height: 30px; padding: 0; place-items: center; border: 0; border-radius: 8px; background: transparent; color: var(--marassina-green); cursor: pointer; }
.drawer-suggest-arrows button:hover:not(:disabled) { background: var(--marassina-green-soft); }
.drawer-suggest-arrows button:disabled { color: #b7bfba; cursor: default; }
.drawer-suggest-arrows button .drawer-icon { width: 16px; height: 16px; }
.drawer-suggest-arrows button[data-suggest="1"] .drawer-icon { transform: scaleX(-1); }
@media (prefers-reduced-motion: no-preference) { .drawer-suggest-track { scroll-behavior: smooth; } }


/* Cart footer */
.drawer-foot { flex: 0 0 auto; max-height: 70%; padding: 20px 26px 24px; overflow-y: auto; border-top: 1px solid var(--marassina-border); background: #fff; }
.drawer-notice { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; margin-bottom: 14px; padding: 14px 16px; border-radius: var(--marassina-radius); background: rgba(217, 41, 120, .07); color: var(--marassina-pink); }
.drawer-notice div { display: flex; flex-direction: column; gap: 1px; color: var(--marassina-ink); font-size: 12px; line-height: 1.4; }
.drawer-notice strong { color: var(--marassina-ink); font-size: 13px; }
.drawer-payments { margin: 0 0 14px; padding: 0; border: 0; }
.drawer-payment { position: relative; display: flex; align-items: center; gap: 12px; margin-bottom: 8px; padding: 13px 16px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius); color: var(--marassina-green); cursor: pointer; transition: border-color .2s ease, background .2s ease; }
.drawer-payment:last-child { margin-bottom: 0; }
.drawer-payment.is-single { background: var(--marassina-cream); cursor: default; }
.drawer-payment input { position: absolute; opacity: 0; pointer-events: none; }
.drawer-payment-radio { flex: 0 0 auto; width: 18px; height: 18px; border: 1.5px solid #b9c3bd; border-radius: 50%; transition: border-color .2s ease, box-shadow .2s ease; }
.drawer-payment:has(input:checked) { border-color: var(--marassina-green); background: rgba(223, 233, 225, .4); }
.drawer-payment input:checked + .drawer-payment-radio { border-color: var(--marassina-green); box-shadow: inset 0 0 0 4px #fff, inset 0 0 0 9px var(--marassina-green); }
.drawer-payment input:focus-visible + .drawer-payment-radio { outline: 3px solid rgba(217, 41, 120, .32); outline-offset: 2px; }
.drawer-payment-text { display: flex; flex-direction: column; gap: 1px; }
.drawer-payment-text strong { color: var(--marassina-green); font-size: 14px; font-weight: 650; line-height: 1.3; }
.drawer-payment-text small { color: var(--marassina-muted); font-size: 12px; }
/* Compact payment line in the cart drawer */
.drawer-payments { margin: 0 0 10px; }
.drawer-payment { margin-bottom: 6px; padding: 8px 12px; gap: 10px; }
.drawer-payment.is-single { padding: 0; border: 0; background: transparent; gap: 8px; }
.drawer-payment.is-single .drawer-icon { width: 14px; height: 14px; }
.drawer-payment.is-single .drawer-payment-text { flex-direction: row; align-items: baseline; gap: 6px; }
.drawer-payment.is-single strong, .drawer-payment.is-single small { font-size: 12px; }
.drawer-payment-text strong { font-size: 13px; }

.drawer-terms { margin-bottom: 4px; }
.drawer-check { display: inline-flex; align-items: flex-start; gap: 10px; color: var(--marassina-ink); font-size: 13px; line-height: 1.45; cursor: pointer; }
.drawer-check input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.drawer-check-box { display: grid; flex: 0 0 auto; width: 18px; height: 18px; margin-top: 1px; place-items: center; border: 1.5px solid #b9c3bd; border-radius: 5px; background: #fff; color: transparent; transition: background .15s ease, border-color .15s ease, color .15s ease; }
.drawer-check-box .drawer-icon { width: 11px; height: 11px; }
.drawer-check input:checked + .drawer-check-box { border-color: var(--marassina-green); background: var(--marassina-green); color: #fff; }
.drawer-check input:focus-visible + .drawer-check-box { outline: 3px solid rgba(217, 41, 120, .32); outline-offset: 2px; }
.drawer-check a { color: var(--marassina-green); text-decoration: underline; text-underline-offset: 2px; }
.drawer-check a:hover { color: var(--marassina-pink); }
.drawer-hint { margin: 8px 0 0; color: var(--marassina-pink); font-size: 12px; font-weight: 600; }
.drawer-hint[hidden] { display: none; }
.drawer-total { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 16px 0 2px; }
.drawer-total dt { color: var(--marassina-green); font-family: Georgia, serif; font-size: 19px; }
.drawer-total dd { margin: 0; color: var(--marassina-green); font-size: 21px; font-weight: 700; letter-spacing: -.01em; }
.drawer-note { display: flex; align-items: center; gap: 8px; margin: 0 0 16px; color: var(--marassina-muted); font-size: 12px; }
.drawer-note .drawer-icon { width: 14px; height: 14px; }
.drawer-login-hint { margin: 16px 0 0; color: var(--marassina-muted); font-size: 13px; text-align: center; }

/* Account panel */
.drawer-head-account { padding-bottom: 0; }
.drawer-tabs { display: flex; flex: 1 1 auto; gap: 28px; }
.marassina-account-inner.is-forgot .drawer-tabs { visibility: hidden; }
.drawer-tabs button { margin-bottom: -1px; padding: 14px 2px 16px; border: 0; border-bottom: 2px solid transparent; background: none; color: var(--marassina-muted); font: inherit; font-size: 12px; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; cursor: pointer; transition: color .2s ease, border-color .2s ease; }
.drawer-tabs button:hover { color: var(--marassina-green); }
.drawer-tabs button[aria-selected="true"] { border-bottom-color: var(--marassina-green); color: var(--marassina-green); }
.drawer-head-account .drawer-close { align-self: flex-start; margin-top: 4px; margin-bottom: 8px; }
.marassina-account-inner .drawer-body { padding-top: 26px; }
.drawer-context { margin: 0 0 20px; padding: 12px 14px; border-radius: var(--marassina-radius); background: var(--marassina-green-soft); color: var(--marassina-green); font-size: 13px; font-weight: 600; line-height: 1.45; }
.drawer-context[hidden], .drawer-message[hidden], .drawer-field-error[hidden] { display: none; }
.drawer-form { display: flex; flex-direction: column; gap: 16px; }
.drawer-field-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.drawer-field label { display: block; margin-bottom: 6px; color: var(--marassina-ink); font-size: 12px; font-weight: 700; }
.drawer-field-control { position: relative; }
.drawer-field input { width: 100%; min-height: 48px; padding: 0 16px; border: 1px solid var(--marassina-border); border-radius: 8px; background: #fff; color: var(--marassina-ink); font-size: 15px; transition: border-color .2s ease, box-shadow .2s ease; }
.drawer-field input[type="password"], .drawer-field-control:has(.drawer-field-toggle) input { padding-right: 48px; }
.drawer-field input:focus { outline: 0; border-color: var(--marassina-green); box-shadow: 0 0 0 3px rgba(23, 63, 53, .08); }
.drawer-field.has-error input { border-color: var(--marassina-pink); }
.drawer-field.has-error input:focus { box-shadow: 0 0 0 3px rgba(217, 41, 120, .12); }
.drawer-field-error { margin: 6px 0 0; color: var(--marassina-pink); font-size: 12px; font-weight: 600; }
/* Show/hide-password eye: one look for the account drawer's own toggle and
   WooCommerce's injected .show-password-input (checkout, My Account, reset). */
:root {
  --marassina-eye: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
  --marassina-eye-off: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49'/%3E%3Cpath d='M14.084 14.158a3 3 0 0 1-4.242-4.242'/%3E%3Cpath d='M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143'/%3E%3Cpath d='m2 2 20 20'/%3E%3C/svg%3E");
}
.drawer-field-toggle,
.woocommerce form .password-input .show-password-input { position: absolute; top: 50%; right: 6px; display: grid; width: 38px; height: 38px; margin: 0; padding: 0; place-items: center; transform: translateY(-50%); border: 0; border-radius: 8px; background: transparent; color: var(--marassina-muted); cursor: pointer; -webkit-appearance: none; appearance: none; transition: color .2s ease, background-color .2s ease; }
.drawer-field-toggle::before,
.woocommerce form .password-input .show-password-input::before { content: ""; display: block; width: 20px; height: 20px; margin: 0; background: currentColor; -webkit-mask: var(--marassina-eye) center / contain no-repeat; mask: var(--marassina-eye) center / contain no-repeat; }
.drawer-field-toggle.is-shown::before,
.woocommerce form .password-input .show-password-input.display-password::before { -webkit-mask-image: var(--marassina-eye-off); mask-image: var(--marassina-eye-off); }
.drawer-field-toggle:hover, .drawer-field-toggle.is-shown,
.woocommerce form .password-input .show-password-input:hover, .woocommerce form .password-input .show-password-input.display-password { color: var(--marassina-green); }
.drawer-field-toggle:hover, .woocommerce form .password-input .show-password-input:hover { background: rgba(23, 63, 53, .06); }
.drawer-field-toggle:focus-visible, .woocommerce form .password-input .show-password-input:focus-visible { outline: 3px solid rgba(217, 41, 120, .32); outline-offset: 0; }
.woocommerce form .password-input { display: block; position: relative; width: 100%; }
.woocommerce form .password-input input { padding-right: 52px !important; }
.drawer-form-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: -2px 0 2px; }
.drawer-message { padding: 12px 14px; border-radius: var(--marassina-radius); font-size: 13px; font-weight: 600; line-height: 1.45; }
.drawer-message.is-error { background: rgba(217, 41, 120, .07); color: #a31b56; }
.drawer-message.is-success { background: var(--marassina-green-soft); color: var(--marassina-green); }
.drawer-privacy { color: var(--marassina-muted); font-size: 12px; line-height: 1.5; }
.drawer-privacy p { margin: 0; }
.drawer-privacy a { color: var(--marassina-green); text-decoration: underline; text-underline-offset: 2px; }
.drawer-honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.drawer-back { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 24px; padding: 0; border: 0; background: none; color: var(--marassina-green); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.drawer-back .drawer-icon { width: 14px; height: 14px; }
.drawer-back:hover { color: var(--marassina-pink); }
.drawer-view-title { margin: 0 0 10px; font-size: 28px; }
.drawer-view-text { margin: 0 0 24px; color: var(--marassina-muted); font-size: 14px; line-height: 1.6; }
.drawer-cta.is-loading { cursor: progress; }

/* Heart buttons */
.wishlist-toggle { display: grid; padding: 0; place-items: center; border: 0; background: rgba(255, 255, 255, .94); color: var(--marassina-green); cursor: pointer; transition: color .2s ease, transform .2s ease, background .2s ease, box-shadow .2s ease, opacity .2s ease; }
.wishlist-toggle:hover { color: var(--marassina-pink); }
.wishlist-toggle.is-active { color: var(--marassina-pink); }
.wishlist-toggle.is-active .drawer-icon { animation: heart-pop .32s ease; }
.wishlist-toggle.is-busy { opacity: .6; pointer-events: none; }
@keyframes heart-pop { 0% { transform: scale(.7); } 60% { transform: scale(1.22); } 100% { transform: scale(1); } }
.wishlist-toggle-loop { position: absolute; top: 10px; right: 10px; z-index: 3; width: 38px; height: 38px; border-radius: 50%; box-shadow: 0 2px 10px rgba(14, 43, 37, .14); }
.wishlist-toggle-loop:hover { transform: scale(1.07); }
.single-product div.product div.summary { position: relative; }
.single-product div.product div.summary .product_title { padding-right: 60px; }
.wishlist-toggle-single { position: absolute; top: 0; right: 0; z-index: 2; width: 46px; height: 46px; border: 1px solid var(--marassina-border); border-radius: 50%; background: #fff; }
.wishlist-toggle-single:hover { border-color: var(--marassina-pink); }
.wishlist-toggle-single .drawer-icon, .wishlist-toggle-loop .drawer-icon { width: 21px; height: 21px; }

@media (max-width: 800px) {
  /* Menu + logo left, icons right, everything on one vertical center line. */
  .header-main { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 4px; }
  .nav-category-menu { position: static; grid-column: 1; grid-row: 1; justify-self: start; align-self: center; }
  .menu-toggle { grid-column: 1; grid-row: 1; justify-self: start; }
  .nav-category-trigger { width: 40px; height: 40px; padding: 0; margin-left: -8px; justify-content: center; }
  .nav-category-trigger-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
  .site-branding { grid-column: 2; grid-row: 1; justify-self: start; margin: 0 0 0 6px; }
  .site-branding .custom-logo { max-height: 38px; }
  .header-tools { grid-column: 3; grid-row: 1; justify-self: end; gap: 0; margin-left: 0; }
  .header-tools .icon-button { width: 36px; }
  .category-mega-menu { position: absolute; top: 100%; left: -15px; right: -15px; width: auto; max-height: calc(100vh - 140px); padding: 20px 15px 24px; border-top-width: 2px; }
}
@media (max-width: 480px) {
  .drawer-head { padding: 16px 12px 14px 20px; }
  .drawer-title { font-size: 22px; }
  .drawer-body { padding-inline: 20px; }
  .drawer-foot { padding: 16px 20px 20px; }
  .drawer-field input { font-size: 16px; }
  .wishlist-toggle-loop { top: 24px; right: 24px; width: 34px; height: 34px; }
}

/* Mega menu polish: no bullets or underlines, aligned with the Menú button. */
.category-mega-menu { left: -12px; border-radius: 0 0 var(--marassina-radius) var(--marassina-radius); }
.category-mega-column ul { margin: 0; padding: 0; list-style: none; }
.category-mega-menu a { text-decoration: none; }
.category-mega-column li { margin: 0; }
.category-mega-column li a { display: block; padding: 5px 0; line-height: 1.35; transition: color .2s ease, transform .2s ease; }
.category-mega-column li a:hover { transform: translateX(3px); }
.category-mega-title { padding-bottom: 8px; }
.category-mega-intro a { font-weight: 700; }
.category-mega-intro a:hover { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 800px) { .category-mega-menu { left: -15px; } }

/* The last header icon's centered tooltip poked past the viewport edge and
   caused a horizontal scrollbar at ~1024px — right-align it instead. */
.header-tools .cart-link .icon-tooltip { left: auto; right: 0; transform: translateY(-4px); }
.header-tools .cart-link:hover .icon-tooltip, .header-tools .cart-link:focus-visible .icon-tooltip { transform: translateY(0); }

/* ==== Footer: payment methods + white language buttons ==== */

.footer-payments { display: flex; align-items: center; gap: 16px; margin-left: auto; margin-right: 56px; }
:where(.fa-icon) { display: inline-block; width: 1em; height: 1em; fill: currentColor; vertical-align: -.125em; }
.footer-payments-text { color: #fff; font-size: 13px; font-weight: 500; white-space: nowrap; }
/* The logos are dark-on-transparent, so they sit on a small white plate to stay legible on the green. */
.footer-payments-logos { display: block; padding: 6px 14px; border-radius: var(--marassina-radius-pill); background: #fff; }
.footer-payments img { display: block; width: auto; height: 26px; max-width: 100%; }
.site-footer .language-switcher a { padding: 6px 9px; border-color: transparent; color: #fff; font-size: 10px; }
.site-footer .language-switcher a:hover { border-color: rgba(255,255,255,.55); color: #fff; }
.site-footer .language-switcher a.is-current { border-color: #fff; color: #fff; }
@media (max-width: 800px) {
  .footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; row-gap: 16px; }
  .footer-bottom span { display: inline; margin-bottom: 0; }
  .footer-payments { order: 3; flex: 0 0 100%; flex-direction: column; gap: 10px; margin: 0; }
  .footer-payments-logos { max-width: 100%; }
}

/* Login: email first, then the password slides in. */
[data-auth-form="login"] { position: relative; }
[data-auth-form="login"][data-step="email"] [data-step-group="password"],
[data-auth-form="login"][data-step="password"] [data-step-group="email"] { display: none; }
[data-auth-form="login"][data-step="password"] [data-step-group="password"] { animation: drawer-step-in .28s cubic-bezier(.22, .8, .24, 1) both; }
@keyframes drawer-step-in { from { opacity: 0; transform: translateX(18px); } to { opacity: 1; transform: none; } }
.drawer-login-summary { display: flex; align-items: center; gap: 12px; padding: 10px 12px 10px 14px; border: 1px solid var(--marassina-border); border-radius: 8px; background: var(--marassina-cream); }
.drawer-login-summary-icon { display: grid; flex: 0 0 auto; width: 30px; height: 30px; place-items: center; border-radius: 50%; background: #fff; color: var(--marassina-green); }
.drawer-login-summary-icon .drawer-icon { width: 13px; height: 13px; }
.drawer-login-summary-email { flex: 1 1 auto; min-width: 0; overflow: hidden; color: var(--marassina-ink); font-size: 14px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.drawer-login-password { display: flex; flex-direction: column; gap: 16px; }

/* My Account login: same two-step flow as the header drawer (assets/js/login-steps.js). */
.marassina-two-step [hidden] { display: none !important; }
.marassina-login-summary { display: flex; align-items: center; gap: 12px; margin: 0 0 18px; padding: 10px 14px; border: 1px solid var(--marassina-border); border-radius: 8px; background: var(--marassina-cream); }
.marassina-login-summary-email { flex: 1 1 auto; min-width: 0; overflow: hidden; color: var(--marassina-ink); font-size: 14px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.marassina-login-summary button { padding: 0; border: 0; background: none; color: var(--marassina-green); font: inherit; font-size: 13px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.marassina-login-summary button:hover { color: var(--marassina-pink); }
.marassina-login-error { margin: -8px 0 16px; color: var(--marassina-pink); font-size: 12px; font-weight: 600; }
.marassina-login-step-in { animation: drawer-step-in .28s cubic-bezier(.22, .8, .24, 1) both; }

/* "Continue with Google" (Nextend Social Login) — shown on the email step only. */
.drawer-social { margin-top: 22px; }
.drawer-divider { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; color: var(--marassina-muted); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.drawer-divider::before, .drawer-divider::after { content: ''; flex: 1 1 auto; height: 1px; background: var(--marassina-border); }
.drawer-google { display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%; min-height: 50px; padding: 0 20px; border: 1px solid #dadce0; border-radius: var(--marassina-radius-pill); background: #fff; color: #3c4043; font-size: 14px; font-weight: 600; text-decoration: none; transition: background .2s ease, box-shadow .2s ease, border-color .2s ease; }
.drawer-google:hover { border-color: #c6c9cd; background: #f8f9fa; box-shadow: 0 1px 3px rgba(60, 64, 67, .18); color: #3c4043; }
.drawer-google-logo { width: 18px; height: 18px; flex: 0 0 auto; }
form[data-auth-form="login"][data-step="password"] + .drawer-social,
.marassina-two-step[data-step="password"] .nsl-container,
.marassina-two-step[data-step="password"] ~ .nsl-container { display: none; }

/* Follow/discount popup (inc/popup.php) — centered modal, shown once per session after a delay.
   Two columns (photo + content) at wider widths; single column with the photo hidden below 760px. */
.marassina-popup { position: fixed; inset: 0; z-index: 9000; display: flex; align-items: center; justify-content: center; padding: 20px; }
.marassina-popup[hidden] { display: none; }
.marassina-popup-backdrop { position: absolute; inset: 0; background: rgba(23, 40, 36, .6); animation: popup-fade-in .25s ease both; }
.marassina-popup-sheet { position: relative; z-index: 1; display: flex; width: 100%; max-width: 760px; max-height: calc(100vh - 40px); overflow: hidden; border-radius: var(--marassina-radius-lg); background: var(--marassina-cream); box-shadow: var(--marassina-shadow-hover); outline: 0; animation: popup-pop-in .3s cubic-bezier(.22, .8, .24, 1) both; }
.marassina-popup-close { position: absolute; top: 14px; right: 14px; z-index: 2; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border: 0; border-radius: 50%; background: #fff; color: var(--marassina-muted); cursor: pointer; box-shadow: 0 2px 6px rgba(23, 40, 36, .15); transition: transform .18s ease, background .18s ease, color .18s ease; }
.marassina-popup-close:hover { background: var(--marassina-pink); color: #fff; transform: scale(1.06); }
.marassina-popup-close .fa-icon { width: 11px; height: 11px; fill: currentColor; }
.marassina-popup-visual { flex: 0 0 33%; background-position: center; background-size: cover; background-repeat: no-repeat; }
.marassina-popup-content { flex: 1 1 auto; overflow-y: auto; padding: 38px 36px 8px; text-align: center; }
.marassina-popup-logo { display: flex; justify-content: center; margin-bottom: 2px; }
.marassina-popup-logo img { max-height: 48px; width: auto; }
.marassina-popup-tagline { margin: -2px 0 14px; color: var(--marassina-pink); font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.marassina-popup-title { position: relative; margin: 0 0 16px; padding-bottom: 14px; color: var(--marassina-green); font-family: Georgia, serif; font-size: 26px; font-weight: 400; letter-spacing: -.03em; line-height: 1.22; }
.marassina-popup-title::after { content: ''; position: absolute; bottom: 0; left: 50%; width: 46px; height: 3px; border-radius: var(--marassina-radius-pill); background: var(--marassina-pink); transform: translateX(-50%); }
.marassina-popup-body { margin: 0 auto 24px; max-width: 380px; color: var(--marassina-muted); font-size: 13.5px; line-height: 1.55; }
.marassina-popup-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 10px; }
.marassina-popup-btn { display: flex; align-items: center; justify-content: center; gap: 7px; min-width: 0; height: 42px; padding: 0 12px; border: 0; border-radius: var(--marassina-radius-pill); background: var(--marassina-pink); color: #fff; font-size: 11px; font-weight: 750; letter-spacing: .04em; text-decoration: none; text-transform: uppercase; white-space: nowrap; transition: filter .18s ease, transform .18s ease; }
.marassina-popup-btn:hover { filter: brightness(1.08); transform: translateY(-1px); color: #fff; }
.marassina-popup-btn .fa-icon { width: 13px; height: 13px; flex: 0 0 auto; fill: currentColor; }
.marassina-popup-btn-arrow { width: 9px !important; height: 9px !important; opacity: .8; }
.marassina-popup-btn--tiktok { background: #010101; }
.marassina-popup-btn--instagram { background: linear-gradient(135deg, #f9ce34, #ee2a7b 55%, #6228d7); }
.marassina-popup-btn--facebook-f { background: #1877f2; }
.marassina-popup-benefits { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px 10px; margin: 22px 0; padding: 16px; border-radius: var(--marassina-radius); background: var(--marassina-green-soft); }
.marassina-popup-benefit { display: flex; flex-direction: column; align-items: center; gap: 6px; color: var(--marassina-green); font-size: 11px; font-weight: 700; line-height: 1.3; }
.marassina-popup-benefit-icon { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: #fff; }
.marassina-popup-benefit-icon .fa-icon { width: 14px; height: 14px; fill: var(--marassina-pink); }
.marassina-popup-caption { margin: 0 0 22px; color: var(--marassina-muted); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.marassina-popup-actions-whatsapp { margin-top: 0; }
.marassina-popup-btn--whatsapp { height: 48px; background: var(--marassina-green); font-size: 12px; }
.marassina-popup-btn--whatsapp:hover { filter: brightness(1.12); }
.marassina-popup-btn--whatsapp .fa-icon:first-child { width: 16px; height: 16px; }
.marassina-popup-signature { margin: 10px 0 0; color: var(--marassina-muted); font-size: 11.5px; font-style: italic; text-align: center; }
@keyframes popup-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes popup-pop-in { from { opacity: 0; transform: translateY(12px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } }
@media (max-width: 760px) {
    .marassina-popup { padding: 12px; }
    .marassina-popup-visual { display: none; }
    .marassina-popup-content { padding: 26px 18px 6px; }
    .marassina-popup-logo img { max-height: 40px; }
    .marassina-popup-tagline { margin: -2px 0 10px; font-size: 10px; }
    .marassina-popup-title { margin-bottom: 12px; padding-bottom: 10px; font-size: 20px; }
    .marassina-popup-body { margin-bottom: 14px; font-size: 13px; }
    .marassina-popup-actions { gap: 7px; }
    .marassina-popup-btn { height: 38px; padding: 0 6px; gap: 5px; font-size: 9.5px; letter-spacing: .02em; }
    .marassina-popup-btn .fa-icon { width: 11px; height: 11px; }
    .marassina-popup-benefits, .marassina-popup-caption { display: none; }
    .marassina-popup-actions-whatsapp { margin-top: 10px; }
    .marassina-popup-signature { margin-top: 8px; }
    .marassina-popup-btn--whatsapp { height: 44px; font-size: 11px; }
}
@media (max-width: 300px) { .marassina-popup-actions { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .marassina-popup-backdrop, .marassina-popup-sheet { animation: none; } .marassina-popup-close:hover, .marassina-popup-btn:hover { transform: none; } }

/* Blog index / archives */
.news-archive-page { padding-top: 64px; padding-bottom: 90px; }
.news-heading h1 { position: relative; margin-bottom: 20px; padding-bottom: 20px; font-size: clamp(30px, 4vw, 44px); }
.news-heading h1::after { content: ''; position: absolute; bottom: 0; left: 50%; width: 46px; height: 3px; border-radius: var(--marassina-radius-pill); background: var(--marassina-pink); transform: translateX(-50%); }
.news-card h2 { margin: 0 0 10px; font-size: 19px; line-height: 1.3; }
.news-card h2 a { color: var(--marassina-green); text-decoration: none; }
.news-card h2 a:hover { color: var(--marassina-pink); }
.news-archive-page .pagination { margin-top: 48px; }
.news-archive-page .nav-links { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; }
.news-archive-page .page-numbers { display: grid; min-width: 42px; height: 42px; padding: 0 14px; place-items: center; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-pill); color: var(--marassina-green); font-size: 13px; font-weight: 700; text-decoration: none; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.news-archive-page a.page-numbers:hover, .news-archive-page .page-numbers.current { background: var(--marassina-green); border-color: var(--marassina-green); color: #fff; }
.news-archive-page .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
@media (max-width: 980px) and (min-width: 681px) { .news-grid-archive { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Article page */
.article-header { max-width: 820px; padding-top: 56px; text-align: center; }
.article-back { display: inline-block; margin-bottom: 28px; color: var(--marassina-muted); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }
.article-back:hover { color: var(--marassina-pink); }
.article-tag { display: block; margin: 0 auto 14px; color: var(--marassina-pink); font-size: 11px; font-weight: 750; letter-spacing: .16em; text-decoration: none; text-transform: uppercase; }
.article-header h1 { margin: 0 0 18px; color: var(--marassina-green); font-size: clamp(30px, 5vw, 48px); line-height: 1.12; }
.article-meta { margin: 0; color: var(--marassina-muted); font-size: 13px; }
.article-cover { max-width: 980px; margin-block: 38px 10px; }
.article-cover img { display: block; width: 100%; max-height: 520px; border-radius: 24px; object-fit: cover; box-shadow: var(--marassina-shadow); }
.article-body { width: min(calc(100% - 40px), 720px); margin: 0 auto; padding-block: 28px 20px; color: var(--marassina-ink); font-size: 17px; line-height: 1.8; }
.article-body > * { margin-block: 0 1.25em; }
.article-body > p:first-of-type { color: var(--marassina-green); font-size: 19px; line-height: 1.7; }
.article-body h2 { margin: 2em 0 .6em; padding-top: 1.1em; border-top: 1px solid var(--marassina-border); color: var(--marassina-green); font-size: clamp(24px, 3vw, 30px); line-height: 1.2; }
.article-body h3 { margin: 1.8em 0 .5em; color: var(--marassina-green); font-size: 20px; }
.article-body ul, .article-body ol { padding: 18px 24px 18px 42px; border-radius: 16px; background: rgba(224,234,226,.5); }
.article-body li { margin-block: .35em; padding-left: 4px; }
.article-body li::marker { color: var(--marassina-pink); }
.article-body a { color: var(--marassina-pink); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.article-body a:hover { color: var(--marassina-green); }
.article-body img { max-width: 100%; height: auto; border-radius: 16px; }
.article-body blockquote { margin-inline: 0; padding: 4px 0 4px 24px; border-left: 3px solid var(--marassina-pink); color: var(--marassina-green); font-family: Georgia, serif; font-size: 20px; font-style: italic; }
.article-body .wp-block-gallery { gap: 18px; margin-top: 2.2em; }
.article-body .wp-block-gallery .wp-block-image { padding: 16px 14px; border: 1px solid var(--marassina-border); border-radius: 16px; background: #fff; text-align: center; }
.article-body .wp-block-gallery figcaption { position: static; padding: 10px 0 0; background: none; color: var(--marassina-green); font-size: 13px; line-height: 1.4; }
.article-cta { display: flex; align-items: center; justify-content: space-between; gap: 24px; max-width: 720px; margin-block: 30px 20px; padding: 30px 34px; border-radius: 22px; background: var(--marassina-green-dark); color: #fff; }
.article-cta h2 { margin: 0 0 4px; color: #fff; font-size: 22px; }
.article-cta p { margin: 0; color: #dfe9e1; font-size: 14px; }
.article-cta .news-archive-link { flex: 0 0 auto; min-width: 0; margin: 0; border-color: #fff; background: #fff; }
.article-cta .news-archive-link:hover { background: transparent; color: #fff; }
.article-related { padding-top: 56px; padding-bottom: 80px; }
.article-related-title { margin-bottom: 30px; text-align: center; font-size: clamp(24px, 3vw, 32px); }
@media (max-width: 680px) { .article-header { padding-top: 34px; } .article-cover img { border-radius: 16px; } .article-body { font-size: 16px; } .article-cta { flex-direction: column; align-items: flex-start; padding: 26px 24px; } }
.article-body .wp-block-gallery.has-nested-images figure.wp-block-image { flex: 0 0 calc((100% - 36px) / 3); width: auto; margin: 0; }
.article-body .wp-block-gallery .wp-block-image img { width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; border-radius: 0; }
@media (max-width: 680px) { .article-body .wp-block-gallery.has-nested-images figure.wp-block-image { flex-basis: calc((100% - 18px) / 2); } }
.article-toc { margin-bottom: 2em; padding: 22px 26px; border: 1px solid var(--marassina-border); border-radius: 16px; background: #fff; font-size: 15px; line-height: 1.5; }
.article-toc-title { margin: 0 0 10px; color: var(--marassina-pink); font-size: 11px; font-weight: 750; letter-spacing: .16em; text-transform: uppercase; }
.article-toc ol { margin: 0; padding: 0 0 0 20px; background: none; }
.article-toc li { margin-block: .45em; }
.article-toc li::marker { color: var(--marassina-pink); font-weight: 700; }
.article-toc a { color: var(--marassina-green); text-decoration: none; }
.article-toc a:hover { color: var(--marassina-pink); }
.article-body h2 { scroll-margin-top: 110px; }
.article-share { display: inline-flex; align-items: center; gap: 10px; margin-top: 1.5em; padding: 12px 22px; border-radius: var(--marassina-radius-pill); background: #25d366; color: #fff !important; font-size: 13px; font-weight: 750; letter-spacing: .05em; text-decoration: none !important; text-transform: uppercase; transition: transform .2s ease, background .2s ease; }
.article-share:hover { background: #1ebe5b; transform: translateY(-2px); }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* Product tabs: centered tab bar and a centered reading column */
.single-product .woocommerce-tabs { text-align: center; }
.single-product .woocommerce-Tabs-panel { padding: 44px 34px 48px !important; text-align: left; }
.single-product .woocommerce-Tabs-panel > *, .single-product .woocommerce-Tabs-panel > h2, .single-product .woocommerce-Tabs-panel > h3 { margin-inline: auto; max-width: 780px; }
.single-product .woocommerce-Tabs-panel > h2:first-child { position: relative; margin-bottom: 34px; padding-bottom: 22px; text-align: center; font-size: clamp(28px, 3.2vw, 40px); }
.single-product .woocommerce-Tabs-panel > h2:first-child::after { content: ''; position: absolute; bottom: 0; left: 50%; width: 46px; height: 3px; border-radius: var(--marassina-radius-pill); background: var(--marassina-pink); transform: translateX(-50%); }
@media (max-width: 680px) { .single-product .woocommerce-Tabs-panel { padding: 30px 20px 34px !important; } }

/* Product FAQ accordion ([product_faq]) */
.single-product .woocommerce-Tabs-panel > .product-faq { margin-top: 56px; padding-top: 44px; border-top: 1px solid var(--marassina-border); }
.product-faq h2 { position: relative; margin: 0 0 8px; padding-bottom: 20px; text-align: center; font-size: clamp(24px, 2.8vw, 32px) !important; }
.product-faq h2::after { content: ''; position: absolute; bottom: 0; left: 50%; width: 46px; height: 3px; border-radius: var(--marassina-radius-pill); background: var(--marassina-pink); transform: translateX(-50%); }
.product-faq .faq-subtitle { margin: 14px 0 0; color: var(--marassina-muted); text-align: center; font-size: 14px; }
.product-faq .faq-list { display: grid; gap: 10px; margin-top: 30px; }
.product-faq details { border: 1px solid var(--marassina-border); border-radius: 14px; background: #fff; transition: border-color .2s ease, box-shadow .2s ease; }
.product-faq details:hover { border-color: rgba(217,41,120,.35); }
.product-faq details[open] { border-color: var(--marassina-green); box-shadow: var(--marassina-shadow); }
.product-faq summary { position: relative; display: block; padding: 16px 54px 16px 20px; color: var(--marassina-green); font-size: 15.5px; font-weight: 650; line-height: 1.4; cursor: pointer; list-style: none; }
.product-faq summary::-webkit-details-marker { display: none; }
.product-faq summary::after { content: '+'; position: absolute; top: 50%; right: 16px; display: grid; width: 26px; height: 26px; place-items: center; border-radius: 50%; background: var(--marassina-green-soft); color: var(--marassina-pink); font-size: 18px; line-height: 1; transform: translateY(-50%); transition: background .2s ease, color .2s ease; }
.product-faq details[open] summary::after { content: '−'; background: var(--marassina-pink); color: #fff; }
.product-faq details > div, .product-faq details > p { margin: 0; padding: 0 20px 18px; color: var(--marassina-ink); font-size: 15px; line-height: 1.7; }
.product-faq summary:focus-visible { outline: 2px solid var(--marassina-pink); outline-offset: 2px; border-radius: 14px; }

/* Product meta: quieter, tags collapsed to two lines */
.single-product .summary .product_meta { font-size: 11.5px; }
.single-product .summary .product_meta .tagged_as { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.single-product .summary .product_meta.tags-open .tagged_as { display: block; }
.single-product .summary .product_meta .tagged_as a { color: var(--marassina-muted); font-weight: 500; text-decoration: none; }
.single-product .summary .product_meta .tagged_as a:hover { color: var(--marassina-pink); text-decoration: underline; }
.product-tags-toggle { padding: 0; border: 0; background: none; color: var(--marassina-pink); font: inherit; font-size: 11px; font-weight: 700; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.product-tags-toggle[hidden] { display: none; }
.product-tags-toggle { display: block; margin-top: 6px; }
.product-share { display: flex; align-items: center; gap: 7px; margin-top: 16px; padding: 0; border: 0; background: none; color: var(--marassina-ink); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.product-share svg { width: 15px; height: 15px; }
.product-share:hover { color: var(--marassina-pink); }
.single-product .summary .product_meta { padding-bottom: 36px; }
.product-faq > details { margin-top: 10px; }
.product-faq > details:first-of-type { margin-top: 30px; }
.article-body .product-faq { margin-block: 2.5em; }
.product-faq .faq-subtitle::first-letter { text-transform: uppercase; }

/* Additional information: clean spec list */
.single-product .woocommerce-Tabs-panel--additional_information table.shop_attributes { width: 100%; min-width: 0; max-width: 780px; margin-inline: auto; border: 0; border-radius: 0; background: none; border-collapse: collapse; }
.single-product table.shop_attributes tr { border-bottom: 1px solid var(--marassina-border); }
.single-product table.shop_attributes tr:last-child { border-bottom: 0; }
.single-product table.shop_attributes th, .single-product table.shop_attributes td { padding: 16px 4px; border: 0; background: none !important; vertical-align: baseline; text-align: left; }
.single-product table.shop_attributes th { width: 38%; color: var(--marassina-muted); font-size: 11px; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.single-product table.shop_attributes td { color: var(--marassina-green); font-size: 15px; font-weight: 600; font-style: normal; }
.single-product table.shop_attributes td p { margin: 0; font-style: normal; }
@media (max-width: 680px) { .single-product table.shop_attributes th { width: 42%; } }

.single-product table.shop_attributes td a { color: var(--marassina-pink); text-decoration: none; }
.single-product table.shop_attributes td a:hover { text-decoration: underline; }

/* Reviews tab */
.single-product .woocommerce-noreviews { margin: 0 auto 14px; text-align: center; color: var(--marassina-muted); font-size: 15px; }
.single-product .woocommerce-verification-required { margin: 0 auto; max-width: 520px; padding: 14px 18px; border-radius: 14px; background: rgba(224,234,226,.6); color: var(--marassina-green); text-align: center; font-size: 13.5px; line-height: 1.5; }

/* Single product price: lighter serif to match the headings */
.single-product .summary .price { margin: 14px 0 18px; font-family: Georgia, serif; font-size: 32px !important; font-weight: 400 !important; letter-spacing: -.02em; line-height: 1.1; }
.single-product .summary .price .woocommerce-Price-currencySymbol { margin-right: 3px; font-size: .7em; font-weight: 400; letter-spacing: 0; vertical-align: baseline; opacity: .8; }
.single-product .summary .price del { color: var(--marassina-muted) !important; font-size: .55em; font-weight: 400 !important; opacity: .7; }
.single-product .summary .price ins { text-decoration: none; font-weight: 400 !important; }

/* FAQ: two independent columns on desktop (theme.js splits the list in halves; a card that opens only pushes down its own column) */
.product-faq .faq-col { display: grid; gap: 10px; align-content: start; }
@media (min-width: 960px) {
  .single-product .woocommerce-Tabs-panel > .product-faq { max-width: 1040px; }
  .product-faq .faq-list.is-split { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
}

/* Cart page: suggestions slider under the cart table, sidebar spans both rows */
.woocommerce-cart .marassina-cart-layout > .cart-suggest { grid-column: 1; min-width: 0; }
.woocommerce-cart .marassina-cart-layout > .cart-collaterals { grid-row: 1 / span 2; }
.cart-suggest .drawer-suggest { margin: 0; padding: 22px 25px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-lg); background: #fff; box-shadow: var(--marassina-shadow); }
.cart-suggest .drawer-suggest-title { font-size: 22px; font-weight: 400; }
.cart-suggest .drawer-suggest-card { flex-basis: calc((100% - 24px) / 3); grid-template-columns: 1fr; justify-items: start; gap: 10px; }
.cart-suggest .drawer-suggest-card .drawer-item-thumb { width: 100%; height: auto; aspect-ratio: 1; }
.cart-suggest .drawer-suggest-dots { visibility: hidden; }
@media (max-width: 800px) {
  .woocommerce-cart .marassina-cart-layout > .cart-collaterals { grid-row: auto; }
  .cart-suggest .drawer-suggest { padding: 18px 16px; }
  .cart-suggest .drawer-suggest-card { flex-basis: calc((100% - 12px) / 2); }
}
.woocommerce-cart .marassina-cart-layout { align-content: start; row-gap: 0; }
.woocommerce-cart .marassina-cart-layout > .cart-suggest { margin-top: 30px; }
@media (min-width: 801px) { .woocommerce-cart .marassina-cart-layout > .cart-collaterals { grid-row: 1 / span 20; } }

/* Checkout: tighter payment footer + suggestion block */
.woocommerce-checkout #payment div.payment_box { margin: 10px 0 0; }
.woocommerce-checkout #payment div.form-row.place-order { padding: 12px 16px 14px; margin: 0; }
.woocommerce-checkout #payment .woocommerce-privacy-policy-text p { margin: 0 0 10px; font-size: 13px; line-height: 1.5; }
.woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper { margin: 0; }
.woocommerce-checkout .drawer-suggest { margin: 0 0 12px; }
.woocommerce-checkout .drawer-suggest-title { margin: 0 0 8px; font-size: 15px; line-height: 1.2; }
.woocommerce-checkout .drawer-suggest-card { grid-template-columns: 52px minmax(0, 1fr) auto; gap: 12px; padding: 10px 12px; }
.woocommerce-checkout .drawer-suggest-card .drawer-item-thumb { width: 52px; height: 52px; }
.woocommerce-checkout .drawer-suggest-card .drawer-item-title { font-size: 14px; }
.woocommerce-checkout .drawer-suggest-nav { margin-top: 8px; }
@media (max-width: 480px) { .woocommerce-checkout .drawer-suggest-card .drawer-mini-button { padding: 0 12px; font-size: 10px; } }
@media (max-width: 800px) {
  .woocommerce-cart .marassina-cart-layout > .cart-suggest { margin-bottom: 30px; }
  .cart-suggest .drawer-mini-button { padding: 0 10px; font-size: 10px; white-space: nowrap; }
}
@media (max-width: 480px) {
  .woocommerce-checkout .drawer-suggest-card { grid-template-columns: 52px minmax(0, 1fr); align-items: start; }
  .woocommerce-checkout .drawer-suggest-card .drawer-item-thumb { grid-row: span 2; }
  .woocommerce-checkout .drawer-suggest-card .drawer-mini-button { grid-column: 2; justify-self: start; min-height: 30px; }
}

/* Checkout: white box with the title inside, dots + arrows below (like the reference) */
.woocommerce-checkout .drawer-suggest-box { padding: 12px 14px; border: 1px solid var(--marassina-border); border-radius: 12px; background: #fff; }
.woocommerce-checkout .drawer-suggest-title { margin: 0 0 10px; font-family: inherit; font-size: 14px; font-weight: 650; line-height: 1.3; color: var(--marassina-ink); }
.woocommerce-checkout .drawer-suggest-card { padding: 0; border: 0; border-radius: 0; background: none; }
.woocommerce-checkout .drawer-suggest-track { gap: 0; }
.woocommerce-checkout .drawer-suggest-nav { padding: 0 2px; }
@media (max-width: 800px) {
  .cart-suggest .drawer-suggest-card { flex-basis: 100%; min-width: 0; grid-template-columns: 64px minmax(0, 1fr) auto; justify-items: stretch; align-items: center; gap: 12px; padding: 12px; }
  .cart-suggest .drawer-suggest-card .drawer-item-thumb { width: 64px; height: 64px; aspect-ratio: auto; }
  .cart-suggest .drawer-suggest-dots { visibility: visible; }
  .cart-suggest .drawer-suggest-track { gap: 12px; }
}

/* Subtler subtotal in the cart drawer */
.drawer-total { margin: 12px 0 2px; }
.drawer-total dt { font-family: inherit; font-size: 14px; color: var(--marassina-muted); }
.drawer-total dd { font-size: 15px; font-weight: 600; letter-spacing: 0; }

/* Suggestion cards: smaller button, more (smaller) product text */
.drawer-suggest-card .drawer-item-title { font-size: 13px; line-height: 1.3; -webkit-line-clamp: 3; }
.drawer-suggest-card .drawer-item-price { font-size: 13px; }
.drawer-suggest-card .drawer-mini-button { min-height: 28px; padding: 0 11px; font-size: 9.5px; letter-spacing: .05em; white-space: nowrap; }

/* Compact drawer footer */
.drawer-foot { padding: 14px 20px 16px; }
.drawer-note { margin: 4px 0 10px; }

.drawer-foot .drawer-cta { gap: 8px; }
.drawer-foot .drawer-cta .drawer-icon { width: 15px; height: 15px; flex: 0 0 auto; }

.drawer-badges { display: block; width: auto; max-width: 100%; height: 20px; margin: 10px auto 0; }
/* Checkout terms: checkbox + text on one centred row */
.woocommerce-checkout form .woocommerce-terms-and-conditions-wrapper label.woocommerce-form__label-for-checkbox { display: flex; align-items: center; gap: 10px; padding-left: 0; }
.woocommerce-checkout form .woocommerce-terms-and-conditions-wrapper .woocommerce-form__input-checkbox { position: static; flex: 0 0 auto; margin: 0; }
.drawer-foot img.drawer-badges { width: auto; height: 20px; max-width: 100%; }

/* Drawer: grayscale badges, subtle add button, calmer checkout button */
.drawer-foot img.drawer-badges { filter: grayscale(1); opacity: .6; }
.drawer-suggest-card .drawer-mini-button { background: transparent; color: var(--marassina-green); border-color: var(--marassina-border); font-weight: 650; }
.drawer-suggest-card .drawer-mini-button:hover { background: var(--marassina-green); border-color: var(--marassina-green); color: #fff; }
.drawer-foot .drawer-cta { min-height: 48px; font-size: 13px; letter-spacing: .06em; }
.drawer-foot .drawer-cta .drawer-icon { width: 14px; height: 14px; opacity: .85; }

/* Checkout: hide the lone gateway box, lock + badges around the pay button */
.woocommerce-checkout #payment ul.wc_payment_methods:has(> li:only-child) { display: none; }
.woocommerce-checkout #payment #place_order { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.woocommerce-checkout #payment #place_order .drawer-icon { width: 15px; height: 15px; }
.woocommerce-checkout img.checkout-badges { width: auto; height: 22px; max-width: 100%; margin: 12px auto 0; }
.woocommerce-checkout form .woocommerce-terms-and-conditions-wrapper abbr.required { margin-left: -7px; }
.woocommerce-checkout #payment #place_order::before { content: ""; width: 14px; height: 14px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M400 224h-24v-72C376 68.2 307.8 0 224 0S72 68.2 72 152v72H48c-26.5 0-48 21.5-48 48v192c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V272c0-26.5-21.5-48-48-48zm-104 0H152v-72c0-39.7 32.3-72 72-72s72 32.3 72 72v72z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M400 224h-24v-72C376 68.2 307.8 0 224 0S72 68.2 72 152v72H48c-26.5 0-48 21.5-48 48v192c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V272c0-26.5-21.5-48-48-48zm-104 0H152v-72c0-39.7 32.3-72 72-72s72 32.3 72 72v72z'/%3E%3C/svg%3E") center / contain no-repeat; }
.woocommerce-checkout form .woocommerce-terms-and-conditions-wrapper label.woocommerce-form__label-for-checkbox { gap: 0; justify-content: flex-start; }
.woocommerce-checkout form .woocommerce-terms-and-conditions-wrapper .woocommerce-form__input-checkbox { margin-right: 10px; }
.woocommerce-checkout form .woocommerce-terms-and-conditions-wrapper .woocommerce-terms-and-conditions-checkbox-text { flex: 0 1 auto; }
.woocommerce-checkout form .woocommerce-terms-and-conditions-wrapper abbr.required { margin-left: 0; }
.woocommerce-checkout form .woocommerce-terms-and-conditions-wrapper .woocommerce-form__input-checkbox { margin: 0 12px 0 0 !important; }
.woocommerce-checkout form .woocommerce-terms-and-conditions-wrapper abbr.required { display: none; }
.woocommerce-checkout form .woocommerce-terms-and-conditions-wrapper .woocommerce-terms-and-conditions-checkbox-text::after { content: " *"; color: var(--marassina-pink); }
.woocommerce-checkout #payment .woocommerce-privacy-policy-text p { font-size: 12px; color: var(--marassina-muted); margin: 0 0 8px; }

.woocommerce-checkout form.checkout #order_review_heading { padding-bottom: 20px; }
.checkout-secure-text { margin: 10px 0 0; color: var(--marassina-muted); font-size: 12px; line-height: 1.45; text-align: center; }
.woocommerce-checkout img.checkout-badges { height: 30px; margin-top: 20px; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover, .woocommerce-checkout #place_order:hover { background: color-mix(in srgb, var(--marassina-green) 80%, #fff); }
.woocommerce-checkout img.checkout-badges { margin-top: 30px; }
.woocommerce-checkout .drawer-suggest { margin-bottom: 14px; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover, .woocommerce-checkout #place_order:hover { background: color-mix(in srgb, var(--marassina-green) 78%, #000); }
.woocommerce-checkout #payment #place_order { margin-bottom: 26px; }
/* Checkout: terms sit plainly under the totals, no grey card around the pay area */
.woocommerce-checkout #payment { background: transparent; border-radius: 0; margin-top: 8px; }
.woocommerce-checkout #payment div.form-row.place-order { padding: 12px 0 0; }
.woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper { margin-bottom: 14px; }

/* Checkout grid lives on .checkout-layout so the coupon notice can sit under the billing column */
.woocommerce-checkout .checkout-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(430px, .95fr); align-items: start; column-gap: 45px; row-gap: 0; }
.woocommerce-checkout .checkout-layout > form.checkout { display: contents; }
.woocommerce-checkout .checkout-layout .woocommerce-NoticeGroup { grid-column: 1 / -1; grid-row: 1; margin-bottom: 24px; }
.woocommerce-checkout .checkout-layout .col2-set { grid-column: 1; grid-row: 2; }
.woocommerce-checkout .checkout-layout .checkout-order-review { grid-column: 2; grid-row: 2 / span 3; }
.woocommerce-checkout .checkout-layout > .woocommerce-form-coupon-toggle { grid-column: 1; grid-row: 3; margin-top: 24px; }
.woocommerce-checkout .checkout-layout > .woocommerce-form-coupon-toggle .woocommerce-info { margin: 0; }
.woocommerce-checkout .checkout-layout > .checkout_coupon { grid-column: 1; grid-row: 4; margin: 16px 0 0; }
@media (max-width: 800px) {
  .woocommerce-checkout .checkout-layout { grid-template-columns: minmax(0, 1fr); }
  .woocommerce-checkout .checkout-layout > * , .woocommerce-checkout .checkout-layout .col2-set, .woocommerce-checkout .checkout-layout .checkout-order-review { grid-column: 1; grid-row: auto; }
  .woocommerce-checkout .checkout-layout .col2-set { order: 1; }
  .woocommerce-checkout .checkout-layout > .woocommerce-form-coupon-toggle { order: 2; margin: 20px 0 0; }
  .woocommerce-checkout .checkout-layout > .checkout_coupon { order: 3; }
  .woocommerce-checkout .checkout-layout .checkout-order-review { order: 4; margin-top: 30px; }
}

/* Coupon: plain row in the style of "¿Crea una cuenta?" */
.woocommerce-checkout .checkout-layout > .woocommerce-form-coupon-toggle { margin-top: 14px; }
.woocommerce-checkout .checkout-layout > .woocommerce-form-coupon-toggle .woocommerce-info { padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; color: var(--marassina-ink); font-size: 13px; font-weight: 700; line-height: 1.4; }
.woocommerce-checkout .checkout-layout > .woocommerce-form-coupon-toggle .woocommerce-info::before { display: none; }
.woocommerce-checkout .checkout-layout > .woocommerce-form-coupon-toggle .showcoupon { font-weight: 700; text-decoration: underline; }
.woocommerce-checkout .checkout-layout > .checkout_coupon.woocommerce-form-coupon { margin: 12px 0 0; padding: 0; border: 0; border-radius: 0; background: none; max-width: 420px; gap: 8px; }
.woocommerce-checkout .checkout-layout > .checkout_coupon .form-row { padding: 0; }
.woocommerce-checkout .checkout-layout > .checkout_coupon input.input-text { min-height: 42px; }
.woocommerce-checkout .checkout-layout > .checkout_coupon .button { min-height: 42px; padding: 0 18px; font-size: 11px; }
.woocommerce-checkout .checkout-layout > .checkout_coupon .coupon-clear, .woocommerce-checkout .checkout-layout > .checkout_coupon p:empty { display: none; }
.woocommerce-checkout .checkout-layout > .woocommerce-form-coupon-toggle, .woocommerce-checkout .checkout-layout > .checkout_coupon.woocommerce-form-coupon { padding-left: 3px; }
@media (min-width: 801px) { .woocommerce-checkout .checkout-layout > .woocommerce-form-coupon-toggle { margin-top: -28px; } }
@media (min-width: 801px) { .woocommerce-checkout .checkout-layout > .woocommerce-form-coupon-toggle { margin-top: -10px; } }
@media (min-width: 801px) {
  .woocommerce-checkout .checkout-layout { grid-template-rows: auto auto auto auto 1fr; }
  .woocommerce-checkout .checkout-layout .checkout-order-review { grid-row: 2 / span 4; }
  .woocommerce-checkout .checkout-layout > .woocommerce-form-coupon-toggle { margin-top: 6px; }
}
.drawer-suggest a.added_to_cart { display: none !important; }

.woocommerce-checkout .cart_item.is-removing { opacity: .4; pointer-events: none; transition: opacity .2s ease; }

/* The hidden category mega menu is wider than the viewport at ~800-1000px: clip it in the header so the page never scrolls sideways. */
.site-header { overflow-x: clip; }

/* Cart: free-gift progress (compact card at the top of the cart form). */
.gift-progress { margin: 14px 0 6px; padding: 12px 14px 10px; background: var(--marassina-green-soft); border-radius: var(--marassina-radius); font-size: 13px; line-height: 1.35; }
.gift-progress-message { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; color: var(--marassina-ink); }
.gift-progress-message svg { flex: 0 0 auto; color: var(--marassina-pink); }
.gift-progress-message strong { font-weight: 700; }
.gift-progress-bar { position: relative; height: 6px; margin: 0 6px 10px; background: rgba(255,255,255,.9); border-radius: 999px; }
.gift-progress-bar > span { display: block; height: 100%; background: var(--marassina-green); border-radius: inherit; transition: width .35s ease; }
.gift-progress-tiers { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 0; padding: 0; list-style: none; color: var(--marassina-muted); font-size: 12px; }
.gift-progress-tiers li { min-width: 0; }
.gift-progress-tiers b { color: inherit; font-weight: 700; }
@media (prefers-reduced-motion: reduce) { .gift-progress-bar > span { transition: none; } }

/* Gift progress, compact variant (header cart drawer + checkout). */
.gift-progress--compact { margin: 0 0 12px; padding: 9px 12px 10px; font-size: 12px; }
.gift-progress--compact .gift-progress-message { gap: 7px; margin-bottom: 7px; }
.gift-progress--compact .gift-progress-message svg { width: 16px; height: 16px; }
.gift-progress--compact .gift-progress-bar { height: 5px; margin: 0 0 7px; }
.gift-progress--compact .gift-progress-tiers { font-size: 11px; }
.gift-progress--compact:not(:has(.gift-progress-bar)) .gift-progress-message { margin-bottom: 0; }
.gift-progress--compact.is-complete { padding-block: 8px; }

.gift-progress.is-complete .gift-progress-message { justify-content: center; margin: 0; text-align: center; }
.gift-progress.is-complete { padding-block: 12px; }
.gift-progress--compact.is-complete { padding-block: 9px; }
/* Compact "you got it" card wraps onto two lines: keep the icon and text left-aligned, icon vertically centred. */
.gift-progress--compact.is-complete .gift-progress-message { justify-content: flex-start; align-items: center; gap: 10px; text-align: left; }
.gift-progress--compact.is-complete .gift-progress-message svg { width: 18px; height: 18px; }

/* Mobile checkout order lines, compact: full-width title, then stepper (left) + price (right). */
@media (max-width: 600px) {
  .woocommerce-checkout table.woocommerce-checkout-review-order-table, .woocommerce-checkout .woocommerce-checkout-review-order-table tbody { display: block; }
  .woocommerce-checkout .woocommerce-checkout-review-order-table tr.cart_item { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 6px 12px; padding: 12px 0; border-bottom: 1px solid var(--marassina-border); }
  .woocommerce-checkout .woocommerce-checkout-review-order-table tr.cart_item > td { display: block; padding: 0; border: 0; }
  .woocommerce-checkout .woocommerce-checkout-review-order-table tr.cart_item > td.product-name { display: contents; }
  .woocommerce-checkout .woocommerce-checkout-review-order-table tr.cart_item .marassina-product-name-row { display: contents; }
  .woocommerce-checkout .marassina-item-title { grid-column: 1 / -1; grid-row: 1; font-size: 13px; line-height: 1.35; }
  .woocommerce-checkout .marassina-qty-stepper { grid-column: 1; grid-row: 2; height: 32px; justify-self: start; }
  .woocommerce-checkout .woocommerce-checkout-review-order-table .product-quantity { grid-column: 1; grid-row: 2; }
  .woocommerce-checkout .woocommerce-checkout-review-order-table tr.cart_item > td.product-total { grid-column: 2; grid-row: 2; padding: 0; text-align: right; }
}

/* Mobile cart page, compact: no separate unit-price line (the line total sits beside the stepper), smaller thumbnail and padding. */
@media (max-width: 768px) {
  .woocommerce-cart table.shop_table.cart tr.cart_item { grid-template-columns: 64px minmax(0, 1fr) auto; grid-template-areas: "thumb name remove" "thumb qty sub"; gap: 8px 12px; padding: 12px 0; }
  .woocommerce-cart table.shop_table.cart .product-thumbnail img { width: 64px; height: 64px; border-radius: 10px; }
  .woocommerce-cart table.shop_table.cart td.product-name { align-self: start; }
  .woocommerce-cart table.shop_table.cart td.product-name a { font-size: 14px; line-height: 1.3; }
  .woocommerce-cart table.shop_table.cart td.product-price { display: none !important; }
  .woocommerce-cart table.shop_table.cart td.product-quantity { align-self: end; }
  .woocommerce-cart table.shop_table.cart td.product-subtotal { align-self: end; font-size: 14px; }
  .woocommerce-cart table.shop_table.cart .marassina-qty { height: 32px; }
}
/* Mobile checkout: keep the terms line on one row (smaller type scales with the viewport). */
@media (max-width: 600px) {
  .woocommerce-checkout form .woocommerce-terms-and-conditions-wrapper .woocommerce-terms-and-conditions-checkbox-text { font-size: clamp(10.5px, 3vw, 13px); white-space: nowrap; }
  .woocommerce-checkout form .woocommerce-terms-and-conditions-wrapper .woocommerce-form__input-checkbox { margin-right: 8px; }
}
@media (max-width: 340px) { .woocommerce-checkout form .woocommerce-terms-and-conditions-wrapper .woocommerce-terms-and-conditions-checkbox-text { white-space: normal; } }

/* Mobile category menu: full page below the header (not a floating 70% sheet), page behind it locked. */
@media (max-width: 800px) {
  .category-mega-menu { height: calc(100vh - var(--mega-top, 83px)); height: calc(100dvh - var(--mega-top, 83px)); max-height: none; padding: 22px 20px calc(28px + env(safe-area-inset-bottom)); border-radius: 0; overflow-y: auto; overscroll-behavior: contain; box-shadow: none; transform: none; }
  html:has(.nav-category-menu.is-open) { overflow: hidden; }
}

/* Checkout order lines: thumbnail + unit price are mobile-only extras. */
.woocommerce-checkout .marassina-item-thumb, .woocommerce-checkout .marassina-unit-price { display: none; }
@media (max-width: 600px) {
  .woocommerce-checkout .woocommerce-checkout-review-order-table tr.cart_item { grid-template-columns: 60px minmax(0, 1fr) auto; gap: 4px 12px; padding: 12px 0; }
  .woocommerce-checkout .marassina-item-thumb { display: block; grid-column: 1; grid-row: 1 / span 3; align-self: start; width: 60px; height: 60px; overflow: hidden; border-radius: 10px; background: var(--marassina-sand); }
  .woocommerce-checkout .marassina-item-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
  .woocommerce-checkout .marassina-item-title { grid-column: 2 / -1; grid-row: 1; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: 13px; line-height: 1.3; }
  .woocommerce-checkout .marassina-unit-price { display: block; grid-column: 2 / -1; grid-row: 2; color: var(--marassina-muted); font-size: 12px; line-height: 1.2; }
  .woocommerce-checkout .marassina-qty-stepper { grid-column: 2; grid-row: 3; margin-top: 4px; }
  .woocommerce-checkout .woocommerce-checkout-review-order-table .product-quantity { grid-column: 2; grid-row: 3; }
  .woocommerce-checkout .woocommerce-checkout-review-order-table tr.cart_item > td.product-total { grid-column: 3; grid-row: 3; align-self: end; font-weight: 650; }
}
@media (max-width: 600px) {
  .woocommerce-checkout .woocommerce-checkout-review-order-table tr.cart_item:not(:has(.marassina-qty-stepper)) > td.product-total { grid-row: 2; align-self: start; }
}

/* Checkout "Agrega a tu pedido", mobile: tighter rows around the add button. */
@media (max-width: 480px) {
  .woocommerce-checkout .drawer-suggest-card { grid-template-rows: auto auto; row-gap: 6px; }
  .woocommerce-checkout .drawer-suggest-card .drawer-item-info { margin: 0; }
  .woocommerce-checkout .drawer-suggest-card .drawer-item-title { -webkit-line-clamp: 2; }
  .woocommerce-checkout .drawer-suggest-card .drawer-mini-button { min-height: 28px; }
  .woocommerce-checkout .drawer-suggest-box { padding-block: 10px; }
  .woocommerce-checkout .drawer-suggest-nav { margin-top: 4px; }
}

/* Checkout mobile: room under the carousel arrows so a tap on them never lands on "Pagar ahora". */
@media (max-width: 480px) {
  .woocommerce-checkout .drawer-suggest { margin-bottom: 26px; }
  .woocommerce-checkout .drawer-suggest-arrows button { width: 36px; height: 36px; }
}

/* Mobile cart + checkout headings: one clear hierarchy (page title > section titles), less air above the title. */
@media (max-width: 600px) {
  :is(.woocommerce-checkout, .woocommerce-cart) .container.content-narrow { padding-top: 28px; }
  :is(.woocommerce-checkout, .woocommerce-cart) main h1 { margin-bottom: 14px; font-size: 26px; line-height: 1.15; }
  :is(.woocommerce-checkout, .woocommerce-cart) .marassina-order-steps { margin: 6px auto 24px; }
  .woocommerce-checkout form.checkout h3 { margin-bottom: 14px; font-size: 20px; line-height: 1.2; }
  .woocommerce-checkout form.checkout #order_review_heading { padding: 20px 25px 8px; font-size: 20px; }
}
@media (max-width: 600px) { :is(.woocommerce-checkout, .woocommerce-cart) main h1 { text-align: center; } }

/* The suggestion carousel's off-screen cards must never widen the page (it scrolled sideways on mobile checkout). */
.drawer-suggest-box, .cart-suggest .drawer-suggest { contain: paint; }

/* Footer: configurable blocks (inc/footer.php) */
.footer-column:last-child, .footer-menu-panel > ul > li:last-child { border-right: 0; }
.footer-column-location { padding-left: 0; }
.footer-lines { line-height: 1.5; }
.footer-contact { align-items: flex-start; }
.footer-trust { border-top: 1px solid rgba(255,255,255,.15); }
.footer-trust ul { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px 28px; padding: 20px 0; margin: 0; list-style: none; font-size: 14px; }
.footer-trust li { display: flex; align-items: center; gap: 10px; }
.footer-trust li span { display: inline-grid; color: var(--footer-accent); font-size: 18px; }
.footer-extras { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; padding-block: 22px; border-top: 1px solid rgba(255,255,255,.15); }
.footer-extras .footer-payments { margin: 0; }
.footer-claims { display: flex; align-items: center; gap: 14px; padding: 12px 18px; border: 1px solid rgba(255,255,255,.25); border-radius: 14px; color: inherit; }
a.footer-claims:hover { border-color: #fff; }
.footer-claims-icon { display: inline-grid; font-size: 24px; color: var(--footer-accent); }
.footer-claims strong { display: block; font-size: 13px; letter-spacing: .05em; text-transform: uppercase; color: #fff; }
.footer-claims small { display: block; margin-top: 2px; font-size: 12px; opacity: .8; }
.footer-legal small { display: block; margin-top: 4px; opacity: .75; }
.footer-bottom .footer-legal-links { margin-left: auto; }
.footer-bottom .footer-legal-links a { color: inherit; font-weight: 400; letter-spacing: 0; text-transform: none; font-size: 12px; }
.footer-bottom .footer-legal-links a:hover { color: #fff; }
@media (max-width: 800px) {
  .footer-bottom { flex-direction: column; align-items: flex-start; }
  .footer-bottom .footer-legal-links { margin-left: 0; flex-wrap: wrap; gap: 8px 18px; }
  .footer-trust ul { flex-direction: column; }
  .footer-extras { flex-direction: column; align-items: flex-start; }
}

/* Footer: brand + review, B2B strip, compact complaints book */
.footer-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 28px 56px; padding-bottom: 38px; }
.footer-brand { max-width: 380px; }
.footer-brand .custom-logo { display: block; width: auto; max-width: 190px; height: auto; max-height: 56px; }
.footer-brand-name { color: #fff; font-family: Georgia, serif; font-size: 30px; font-weight: 700; letter-spacing: -.04em; }
.footer-brand p { margin: 12px 0 0; color: #fff; font-size: 15px; line-height: 1.5; }
.footer-review { position: relative; flex: 1 1 380px; max-width: 620px; margin: 0; padding: 22px 28px 20px 32px; border: 1px solid rgba(255,255,255,.18); border-left: 3px solid var(--footer-accent); border-radius: 16px; background: rgba(255,255,255,.05); }
.footer-review-stars { display: flex; align-items: center; gap: 4px; color: var(--footer-accent); font-size: 18px; }
.footer-review-stars b { margin-left: 8px; color: #fff; font-size: 14px; letter-spacing: .02em; }
.footer-review blockquote { margin: 12px 0 0; color: #fff; font-family: Georgia, serif; font-size: 19px; font-style: italic; line-height: 1.45; }
.footer-review blockquote::before { content: '\201C'; margin-right: 2px; color: var(--footer-accent); font-size: 1.3em; line-height: 0; }
.footer-review blockquote::after { content: '\201D'; color: var(--footer-accent); }
.footer-review figcaption { margin-top: 10px; font-size: 13px; opacity: .8; }
.footer-b2b { border-top: 1px solid rgba(255,255,255,.15); }
.footer-b2b .container { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 18px; padding-block: 22px; }
.footer-b2b-icon { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: rgba(255,255,255,.1); color: var(--footer-accent); font-size: 20px; }
.footer-b2b-copy { flex: 1 1 260px; }
.footer-b2b-copy strong { display: block; color: #fff; font-size: 16px; }
.footer-b2b-copy span { display: block; margin-top: 2px; font-size: 14px; opacity: .85; }
.site-footer a.footer-b2b-button { display: inline-flex; align-items: center; gap: 8px; padding: 11px 20px; border-radius: 999px; background: var(--marassina-pink); color: #fff; font-size: 13px; font-weight: 700; }
.site-footer a.footer-b2b-button:hover { background: #fff; color: var(--marassina-pink); }
.footer-claims { gap: 9px; padding: 8px 14px; border-radius: 999px; font-size: 12px; }
.footer-claims-icon { font-size: 15px; }
.footer-claims strong { display: inline; font-size: 12px; letter-spacing: .04em; }
.footer-claims small { display: none; }
.footer-claims > span:last-child { display: flex; align-items: baseline; gap: 10px; }
.footer-claims small:not(:empty) { display: inline; margin: 0; }
@media (max-width: 800px) { .footer-top { flex-direction: column; align-items: flex-start; } .footer-review { flex-basis: auto; width: 100%; } }

/* Footer bottom: payments + complaints book + legal in one block */
.footer-bottom { display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 0; }
.footer-bottom-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; padding: 18px 0; }
.footer-bottom-extras { padding-bottom: 18px; border-bottom: 1px solid rgba(255,255,255,.12); }
.footer-bottom-extras .footer-payments { margin: 0; }
@media (max-width: 800px) { .footer-bottom { display: flex; } .footer-bottom-row { flex-direction: column; align-items: flex-start; } }
.footer-bottom-extras .footer-payments { order: 0; flex: 0 1 auto; flex-direction: row; flex-wrap: wrap; }

/* Footer: round social buttons */
.footer-social { display: flex; flex-wrap: wrap; gap: 10px; }
.site-footer .footer-social a { display: inline-grid; place-items: center; width: 40px; height: 40px; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; background: rgba(255,255,255,.07); color: #fff; font-size: 16px; transition: background .2s, border-color .2s, transform .2s; }
.site-footer .footer-social a:hover { border-color: var(--marassina-pink); background: var(--marassina-pink); transform: translateY(-2px); }
.site-footer .footer-social a.is-whatsapp { border-color: #3d8f55; background: #25603a; }
.site-footer .footer-social a.is-whatsapp:hover { border-color: #25d366; background: #25d366; }
.footer-social-links { margin-top: 20px; }
@media (prefers-reduced-motion: reduce) { .site-footer .footer-social a { transition: none; } .site-footer .footer-social a:hover { transform: none; } }

/* Footer: review band + phone support card */
.footer-top { padding-bottom: 26px; }
.footer-proof { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 22px 40px; margin-bottom: 38px; padding-block: 24px; border-block: 1px solid rgba(255,255,255,.12); }
.footer-proof .footer-review { flex: 1 1 360px; max-width: none; padding: 0; border: 0; border-radius: 0; background: none; }
.footer-proof .footer-review-stars { gap: 6px; font-size: 22px; }
.footer-proof .footer-review-stars b { margin-left: 10px; font-size: 18px; letter-spacing: .04em; }
.footer-proof .footer-review blockquote { margin-top: 8px; font-size: 18px; opacity: .92; }
.footer-proof .footer-review blockquote::before, .footer-proof .footer-review blockquote::after { color: inherit; font-size: 1em; line-height: 1; }
.footer-proof .footer-review figcaption { margin-top: 6px; }
.site-footer a.footer-support { display: flex; align-items: center; gap: 16px; padding: 14px 24px 14px 16px; border: 1px solid rgba(255,255,255,.16); border-radius: 18px; background: rgba(255,255,255,.06); color: #fff; transition: border-color .2s, background .2s; }
.site-footer a.footer-support:hover { border-color: #5bd58a; background: rgba(255,255,255,.1); }
.footer-support-icon { display: inline-grid; flex: none; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: #25603a; color: #5bd58a; font-size: 20px; }
.footer-support small { display: block; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; opacity: .7; }
.footer-support strong { display: block; margin-top: 2px; font-size: 22px; letter-spacing: .01em; }
.footer-support em { display: block; margin-top: 2px; font-size: 12px; font-style: normal; opacity: .75; }
@media (max-width: 800px) { .footer-proof { flex-direction: column; align-items: stretch; } .footer-support { align-self: stretch; } }
@media (max-width: 800px) { .footer-proof .footer-review { flex: 0 0 auto; } }

/* Payments + complaints book: last row of the footer */
.footer-bottom-extras { padding-top: 18px; padding-bottom: 22px; border-top: 1px solid rgba(255,255,255,.12); border-bottom: 0; }
@media (max-width: 800px) {
  .footer-bottom-extras { align-items: stretch; gap: 14px; }
  .footer-bottom-extras .footer-payments { flex-direction: column; align-items: flex-start; gap: 10px; width: 100%; }
  .footer-bottom-extras .footer-payments-logos { max-width: 100%; overflow: hidden; }
  .footer-bottom-extras .footer-payments img { max-width: 100%; height: auto; max-height: 26px; }
  .footer-bottom-extras .footer-claims { justify-content: center; width: 100%; }
}

/* Footer bottom, combined: [payments + complaints book ... language] / [copyright ... legal links] */
.footer-bottom { border-top: 1px solid rgba(255,255,255,.15); }
.footer-bottom-main { padding: 22px 0 14px; }
.footer-bottom-legal { padding: 0 0 22px; font-size: 12px; opacity: .85; }
.footer-bottom .footer-bottom-extras { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; padding: 0; border: 0; }
.footer-bottom-extras .footer-payments { flex: 0 1 auto; width: auto; }
.footer-bottom-extras .footer-claims { width: auto; }
@media (max-width: 800px) {
  .footer-bottom-main, .footer-bottom-legal { flex-direction: column; align-items: stretch; gap: 14px; }
  .footer-bottom-main .footer-bottom-extras { flex-direction: column; align-items: stretch; }
  .footer-bottom-main .language-switcher { align-self: flex-start; }
  .footer-bottom-legal { align-items: flex-start; padding-bottom: 26px; }
}

/* Footer top: brand | review | phone card on one row */
.footer-top { display: grid; grid-template-columns: minmax(0, 260px) minmax(0, 1fr) auto; align-items: center; gap: 24px 44px; margin-bottom: 38px; padding-block: 26px; border-bottom: 1px solid rgba(255,255,255,.12); }
.footer-top > :only-child { grid-column: 1 / -1; }
.footer-top .footer-brand { max-width: none; }
.footer-top .footer-brand p { margin-top: 10px; font-size: 14px; }
.footer-top .footer-review { flex: none; min-width: 0; padding: 0 0 0 44px; border-left: 1px solid rgba(255,255,255,.12); }
.footer-top .footer-review blockquote { font-size: 17px; }
.footer-top > .footer-brand + .footer-support { grid-column: 3; }
@media (max-width: 1100px) { .footer-top { grid-template-columns: 1fr auto; } .footer-top .footer-review { grid-column: 1 / -1; grid-row: 2; padding: 20px 0 0; border-left: 0; border-top: 1px solid rgba(255,255,255,.12); } }
@media (max-width: 800px) { .footer-top { grid-template-columns: 1fr; } .footer-top > .footer-brand + .footer-support, .footer-top .footer-support { grid-column: 1; grid-row: auto; } .footer-top .footer-review { grid-row: auto; } }
.footer-top .footer-review { background: none; border-radius: 0; border-top: 0; border-right: 0; border-bottom: 0; border-left: 1px solid rgba(255,255,255,.12); padding: 0 0 0 44px; }
@media (max-width: 1100px) { .footer-top .footer-review { border-left: 0; border-top: 1px solid rgba(255,255,255,.12); padding: 20px 0 0; } }

/* Phone support card: quieter type, in line with the footer columns */
.site-footer a.footer-support { gap: 14px; padding: 12px 20px 12px 14px; border-radius: 14px; }
.footer-support-icon { width: 40px; height: 40px; font-size: 17px; }
.footer-support small { font-size: 11px; letter-spacing: .08em; }
.footer-support strong { margin-top: 1px; font-size: 15px; font-weight: 600; letter-spacing: .02em; }

/* Footer: clean white icons (stars stay gold) */
.site-footer .footer-contact > span { width: 22px; height: 22px; background: none; color: #fff; font-size: 16px; }
.footer-trust li span, .footer-claims-icon, .footer-b2b-icon, .footer-support-icon { color: #fff; }
.footer-support-icon { background: rgba(255,255,255,.1); }

/* Footer bottom, single row: copyright | payments + complaints book + language */
.footer-bottom { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 28px; padding: 22px 0; border-top: 1px solid rgba(255,255,255,.15); }
.footer-bottom .footer-bottom-extras { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 14px 22px; }
.footer-bottom .footer-legal { font-size: 12px; opacity: .85; }
@media (max-width: 800px) {
  .footer-bottom { flex-direction: column; align-items: stretch; }
  .footer-bottom .footer-legal { order: 2; }
  .footer-bottom .footer-bottom-extras { flex-direction: column; align-items: stretch; justify-content: flex-start; }
  .footer-bottom .language-switcher { align-self: flex-start; }
}

/* Review: tidy stars + rating line above the quote */
.footer-top .footer-review-stars { display: flex; align-items: center; gap: 3px; margin: 0 0 10px; font-size: 16px; line-height: 1; }
.footer-top .footer-review-stars .fa-icon { width: 1em; height: 1em; vertical-align: 0; }
.footer-top .footer-review-stars b { margin-left: 10px; padding-left: 12px; border-left: 1px solid rgba(255,255,255,.25); color: #fff; font-size: 13px; font-weight: 600; letter-spacing: .06em; line-height: 1; }
.footer-top .footer-review blockquote { margin: 0; font-size: 17px; line-height: 1.5; opacity: .95; }
.footer-top .footer-review blockquote::before, .footer-top .footer-review blockquote::after { color: var(--footer-accent); font-size: 1.15em; line-height: 0; vertical-align: -.1em; }

/* Footer top: crisp stars, lighter type, white logo, compact brand */
.footer-top .footer-review-stars { gap: 4px; margin-bottom: 9px; }
.footer-star { display: block; width: 15px; height: 15px; fill: var(--footer-accent); stroke: var(--footer-accent); stroke-width: 1; stroke-linejoin: miter; }
.footer-top .footer-review-stars b { margin-left: 8px; padding-left: 12px; font-size: 12px; font-weight: 500; letter-spacing: .08em; opacity: .9; }
.footer-top .footer-review blockquote { font-size: 16px; font-weight: 400; line-height: 1.55; opacity: .88; }
.footer-top .footer-brand { align-self: center; }
.footer-top .footer-brand .custom-logo { max-height: 42px; filter: brightness(0) invert(1); }
.footer-top .footer-brand p { margin-top: 8px; font-size: 13px; line-height: 1.5; font-weight: 400; opacity: .88; }

/* Header logo: theme green (white while the header is transparent over the hero) */
.site-header .custom-logo { filter: url(#marassina-logo-green); }
.has-transparent-header:not(.is-scrolled):not(.menu-is-open) .site-header .custom-logo { filter: brightness(0) invert(1); }

/* Footer: WhatsApp button in brand green */
.site-footer .footer-social a.is-whatsapp { border-color: #25d366; background: #25d366; color: #fff; font-size: 20px; }
.site-footer .footer-social a.is-whatsapp:hover { border-color: #1ebe5b; background: #1ebe5b; }

/* Footer social: same colour for every button; centre glyphs whose path is 448 wide in a 512 box */
.site-footer .footer-social a.is-whatsapp { border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.07); font-size: 18px; }
.site-footer .footer-social a.is-whatsapp:hover { border-color: var(--marassina-pink); background: var(--marassina-pink); }
.footer-social .fa-instagram, .footer-social .fa-tiktok, .footer-social .fa-whatsapp { transform: translateX(.0625em); }
.footer-support-icon .fa-whatsapp { transform: translateX(.0625em); font-size: 1.1em; }

/* Footer bottom: copyright + small legal links; lighter payments text; logos without plate */
.footer-bottom .footer-legal { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 18px; }
.footer-bottom .footer-legal small { flex: 0 0 100%; margin: 0; }
.footer-bottom .footer-legal-links { display: flex; flex-wrap: wrap; gap: 4px 16px; padding: 0; margin: 0; list-style: none; }
.footer-bottom .footer-legal-links a { color: inherit; font-size: 12px; font-weight: 400; letter-spacing: 0; text-transform: none; opacity: .85; }
.footer-bottom .footer-legal-links a:hover { opacity: 1; color: #fff; }
.footer-bottom .footer-payments-text { color: inherit; font-size: 12px; font-weight: 400; opacity: .85; }
.footer-bottom .footer-payments-logos { padding: 0; border-radius: 0; background: none; }
.footer-bottom .footer-payments img { height: 22px; filter: grayscale(1) invert(1) brightness(1.15); opacity: .9; }
.footer-bottom .footer-payments img { height: 26px; opacity: 1; }
.footer-bottom .footer-claims { gap: 7px; padding: 5px 11px; border-color: rgba(255,255,255,.2); }
.footer-bottom .footer-claims-icon { font-size: 12px; }
.footer-bottom .footer-claims strong { font-size: 10px; font-weight: 600; letter-spacing: .05em; }
@media (max-width: 800px) { .footer-bottom .footer-claims { align-self: flex-start; width: auto; } }

/* Footer on mobile: centred top band, B2B strip and bottom bar */
@media (max-width: 800px) {
  .footer-top { justify-items: center; text-align: center; }
  .footer-top .footer-brand { display: flex; flex-direction: column; align-items: center; }
  .footer-top .footer-brand .custom-logo-link { display: block; margin-inline: auto; }
  .footer-top .footer-review { width: 100%; }
  .footer-top .footer-review-stars { justify-content: center; }
  .footer-top .footer-support { width: 100%; justify-content: center; text-align: left; }
  .footer-b2b .container { flex-direction: column; align-items: center; text-align: center; }
  .footer-b2b-copy { flex: 0 0 auto; }
  .footer-bottom { align-items: center; text-align: center; }
  .footer-bottom .footer-legal { justify-content: center; }
  .footer-bottom .footer-legal-links { justify-content: center; }
  .footer-bottom .footer-bottom-extras { align-items: center; justify-content: center; }
  .footer-bottom .footer-payments { align-items: center; }
  .footer-bottom .footer-claims { align-self: center; }
  .footer-bottom .language-switcher { align-self: center; }
}

/* Footer top: bigger logo, transparent margins of the logo file trimmed, less air above */
.site-footer { padding-top: 22px; }
.footer-top { padding-block: 18px 22px; }
.footer-top .footer-brand .custom-logo { width: auto; height: 64px; max-height: none; max-width: none; margin: -6.5px 0 -5px; }
.footer-top .footer-brand p { margin-top: 12px; }

/* B2B button: white, green on hover */
.site-footer a.footer-b2b-button { border: 1px solid #fff; background: #fff; color: var(--marassina-green); transition: background .2s, color .2s, border-color .2s; }
.site-footer a.footer-b2b-button:hover, .site-footer a.footer-b2b-button:focus-visible { border-color: #2f7a63; background: #2f7a63; color: #fff; }
@media (prefers-reduced-motion: reduce) { .site-footer a.footer-b2b-button { transition: none; } }

/* Footer columns: flush with the container on both sides (same edges as the top band, trust strip and B2B) */
.footer-grid { grid-template-columns: repeat(4, auto); justify-content: space-between; padding-inline: 0; }
.footer-grid > .footer-column-location { padding-left: 0; }
.footer-grid > .footer-column-connect { padding-right: 0; }
.footer-menu-panel > ul > li:last-child { border-right: 1px solid rgba(255,255,255,.15); }
.footer-grid > :last-child, .footer-menu-panel > ul > li:last-child:is(:last-child) { }
@media (max-width: 1000px) { .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; } .footer-grid .footer-column, .footer-menu-panel > ul > li { min-height: 0; padding: 22px 24px 22px 0; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.12); } .footer-grid .footer-column-connect { padding-right: 0; } }
@media (max-width: 800px) { .footer-grid { grid-template-columns: 1fr; } .footer-grid .footer-column, .footer-menu-panel > ul > li { padding: 22px 0; } }
@media (min-width: 1001px) { .footer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) auto; justify-content: stretch; } .footer-grid .footer-column-connect { padding-left: 40px; } }

/* Tablet polish */
.footer-top .footer-review { max-width: none; }
@media (max-width: 1000px) {
  .footer-grid .footer-column, .footer-menu-panel > ul > li, .footer-menu-panel > ul > li:last-child { border-right: 0; }
  .footer-grid { padding-bottom: 20px; }
}
@media (max-width: 900px) { .footer-trust ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 24px; } }
@media (max-width: 560px) { .footer-trust ul { grid-template-columns: 1fr; } }
@media (min-width: 601px) and (max-width: 800px) { .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .footer-grid .footer-column, .footer-menu-panel > ul > li { padding: 22px 24px 22px 0; } }

/* Libro de Reclamaciones */
.claims-book { max-width: 760px; margin: 0 auto; }
.claims-provider { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-bottom: 26px; padding: 16px 20px; border: 1px solid var(--marassina-border); border-radius: 14px; background: var(--marassina-sand, #f3efe6); font-size: 14px; }
.claims-provider strong { flex: 0 0 100%; color: var(--marassina-green); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.claims-form fieldset { min-width: 0; margin: 0 0 26px; padding: 0; border: 0; }
.claims-form legend { margin-bottom: 14px; padding: 0; color: var(--marassina-green); font-family: Georgia, serif; font-size: 22px; }
.claims-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.claims-field { margin: 0 0 16px; }
.claims-field label { display: block; margin-bottom: 6px; color: var(--marassina-ink, #222); font-size: 13px; font-weight: 600; }
.claims-field abbr { color: var(--marassina-pink); text-decoration: none; }
.claims-field input, .claims-field select, .claims-field textarea { width: 100%; padding: 12px 14px; border: 1px solid var(--marassina-border); border-radius: 10px; background: #fff; color: inherit; font: inherit; font-size: 15px; }
.claims-field input:focus, .claims-field select:focus, .claims-field textarea:focus { border-color: var(--marassina-green); outline: 2px solid rgba(23,63,53,.18); }
.claims-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.claims-check { margin: 4px 0 14px; font-size: 14px; }
.claims-check input { margin-right: 8px; }
.claims-legal { margin: 0 0 22px; color: var(--marassina-muted); font-size: 12.5px; line-height: 1.55; }
.claims-submit { min-width: 220px; }
.claims-notice { max-width: 760px; margin: 0 auto 24px; padding: 14px 18px; border-radius: 12px; font-size: 15px; }
.claims-notice.is-ok { background: #e4f3ea; color: #174d2d; }
.claims-notice.is-error { background: #fbe9ea; color: #8a1f2b; }
@media (max-width: 600px) { .claims-row { grid-template-columns: 1fr; } .claims-submit { width: 100%; } }

/* No double rule above the trust strip on tablet/mobile: the last grid row carries no bottom border */
@media (max-width: 1000px) {
  .footer-grid .footer-column-connect, .footer-menu-panel > ul > li:last-child { border-bottom: 0; }
  .footer-grid { padding-bottom: 8px; }
}

/* Footer brand block (desktop/tablet): logo flush left with the tagline, block nudged up */
@media (min-width: 801px) {
  .footer-top .footer-brand { transform: translateY(-6px); }
  .footer-top .footer-brand .custom-logo { margin-left: -8px; }
  .footer-top .footer-brand p { margin-top: 8px; }
}

/* 404 */
.not-found { padding: 64px 0 40px; }
.not-found-art { position: relative; display: grid; place-items: center; width: 180px; height: 180px; margin: 0 auto 28px; }
.not-found-badge { display: grid; place-items: center; width: 132px; height: 132px; border-radius: 50%; background: var(--marassina-green-soft); color: var(--marassina-green); box-shadow: inset 0 0 0 6px #fff, var(--marassina-shadow); animation: nf-float 3.4s ease-in-out infinite; }
.not-found-logo { width: 56%; height: auto; }
.not-found-leaf { position: absolute; width: 30px; height: 30px; color: var(--marassina-green); opacity: .85; transform-origin: 50% 90%; }
.not-found-leaf--a { top: 6px; right: 14px; animation: nf-drift 4.2s ease-in-out infinite; }
.not-found-leaf--b { bottom: 14px; left: 6px; width: 22px; height: 22px; animation: nf-drift 5s ease-in-out -1.5s infinite reverse; }
.not-found h1 { margin: 0 0 10px; }
.not-found-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 24px; }
.button-outline { background: transparent; color: var(--marassina-green); }
.button-outline:hover { background: var(--marassina-green-soft); color: var(--marassina-green); }
.not-found-code { margin: 26px 0 0; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--marassina-muted); opacity: .7; }
.not-found-timer { display: inline-flex; align-items: center; gap: 10px; margin-top: 30px; padding: 8px 8px 8px 14px; background: #fff; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-pill); font-size: 14px; color: var(--marassina-muted); }
.not-found-timer[hidden] { display: none; }
.not-found-timer strong { color: var(--marassina-green); font-variant-numeric: tabular-nums; }
.not-found-ring { width: 24px; height: 24px; transform: rotate(-90deg); }
.not-found-ring circle { fill: none; stroke-width: 3.5; }
.ring-bg { stroke: var(--marassina-green-soft); }
.ring-fg { stroke: var(--marassina-pink); stroke-linecap: round; stroke-dasharray: 100.53; stroke-dashoffset: 0; }
.is-running .ring-fg { animation: nf-ring var(--nf-seconds, 10s) linear forwards; }
.not-found-stay { padding: 7px 14px; border: 0; border-radius: var(--marassina-radius-pill); background: var(--marassina-sand); color: var(--marassina-green); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; transition: background .2s ease; }
.not-found-stay:hover { background: var(--marassina-green-soft); }
.not-found-stay:focus-visible { outline: 2px solid var(--marassina-pink); outline-offset: 2px; }
@keyframes nf-ring { to { stroke-dashoffset: 100.53; } }
@keyframes nf-float { 50% { transform: translateY(-8px); } }
@keyframes nf-drift { 0%, 100% { transform: translate(0, 0) rotate(-12deg); } 50% { transform: translate(6px, -12px) rotate(14deg); } }
@media (prefers-reduced-motion: reduce) { .not-found-badge, .not-found-leaf { animation: none; } }
@media (max-width: 480px) { .not-found { padding-top: 44px; } .not-found-timer { flex-wrap: wrap; justify-content: center; border-radius: var(--marassina-radius); padding: 12px 14px; } }

/* Product gallery lightbox (PhotoSwipe): clearly visible prev/next arrows */
button.pswp__button--arrow--left::before,
button.pswp__button--arrow--right::before {
	top: 26px; width: 48px; height: 48px; border-radius: 50%;
	background: #fff !important; background-image: none !important;
	box-shadow: 0 2px 10px rgba(0, 0, 0, .35);
	transition: transform .15s ease;
}
button.pswp__button--arrow--left::before { left: 10px; }
button.pswp__button--arrow--right::before { right: 10px; }
button.pswp__button--arrow--left::after,
button.pswp__button--arrow--right::after {
	content: ''; position: absolute; top: 44px; width: 12px; height: 12px;
	border: solid var(--marassina-green); border-width: 0 0 3px 3px;
}
button.pswp__button--arrow--left::after { left: 30px; transform: rotate(45deg); }
button.pswp__button--arrow--right::after { right: 30px; transform: rotate(-135deg); }
button.pswp__button--arrow--left:hover::before,
button.pswp__button--arrow--right:hover::before { transform: scale(1.08); }
button.pswp__button--arrow--left:focus-visible::before,
button.pswp__button--arrow--right:focus-visible::before { outline: 2px solid var(--marassina-pink); outline-offset: 2px; }

/* Show the arrows on touch screens too (PhotoSwipe hides them by default), smaller on phones */
.pswp--touch button.pswp__button--arrow--left,
.pswp--touch button.pswp__button--arrow--right { display: block !important; visibility: visible !important; }
@media (max-width: 800px) {
	button.pswp__button--arrow--left,
	button.pswp__button--arrow--right { width: 56px; height: 80px; margin-top: -40px; }
	button.pswp__button--arrow--left::before,
	button.pswp__button--arrow--right::before { top: 22px; width: 36px; height: 36px; }
	button.pswp__button--arrow--left::before { left: 6px; }
	button.pswp__button--arrow--right::before { right: 6px; }
	button.pswp__button--arrow--left::after,
	button.pswp__button--arrow--right::after { top: 35px; width: 9px; height: 9px; border-width: 0 0 2.5px 2.5px; }
	button.pswp__button--arrow--left::after { left: 21px; }
	button.pswp__button--arrow--right::after { right: 21px; }
}

@media (max-width: 560px) {
  .single-product .woocommerce-tabs ul.tabs { display: flex; flex-wrap: nowrap; justify-content: flex-start; gap: 2px; width: 100%; margin: 0 0 18px !important; padding: 4px !important; overflow-x: auto; scrollbar-width: none; }
  .single-product .woocommerce-tabs ul.tabs::-webkit-scrollbar { display: none; }
  .single-product .woocommerce-tabs ul.tabs li { flex: 1 0 auto; }
  .single-product .woocommerce-tabs ul.tabs a { padding: 9px 10px !important; font-size: 10px; letter-spacing: .03em; white-space: nowrap; }
}

@media (max-width: 560px) {
  .single-product .woocommerce-product-details__short-description { margin-bottom: 6px; }
  .single-product .woocommerce-product-details__short-description > :last-child { margin-bottom: 0; }
}

@media (max-width: 560px) {
  .content-narrow { padding-block: 28px 44px; }
}

.home-product-tabs-wrap { position: relative; }
.home-tabs-arrow { display: none; }
@media (max-width: 700px) {
  .home-product-tabs-wrap .home-product-tabs { justify-content: flex-start; padding-inline: 4px; }
  .home-tabs-arrow { position: absolute; z-index: 2; top: 0; bottom: 32px; display: grid; width: 36px; padding: 0; place-items: center; border: 0; color: var(--marassina-green); cursor: pointer; }
  .home-tabs-arrow[hidden] { display: none; }
  .home-tabs-arrow.is-prev { left: -4px; background: linear-gradient(90deg, #f8f6f0 55%, transparent); justify-items: start; padding-left: 4px; }
  .home-tabs-arrow.is-next { right: -4px; background: linear-gradient(270deg, #f8f6f0 55%, transparent); justify-items: end; padding-right: 4px; }
}

@media (max-width: 800px) {
  .home-ticker-wrap { margin-block: -12px; }
}

/* Offers banner: same shadow/hover language as .news-card, plus a bottom shade on the photo */
.offers-banner { box-shadow: var(--marassina-shadow); transition: transform .25s ease, box-shadow .25s ease; }
.offers-banner:hover { transform: translateY(-3px); box-shadow: var(--marassina-shadow-hover); }
.offers-banner-media::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(14, 43, 37, 0) 55%, rgba(14, 43, 37, .5) 100%), linear-gradient(270deg, rgba(14, 43, 37, .18), rgba(14, 43, 37, 0) 30%); }
.offers-banner-media img { transition: transform .4s ease; }
.offers-banner:hover .offers-banner-media img { transform: scale(1.06); }
@media (min-width: 801px) { .offers-stamp { color: #fff; text-shadow: 0 1px 10px rgba(0, 0, 0, .55); } }
@media (max-width: 800px) { .offers-banner-media::after { background: linear-gradient(180deg, rgba(14, 43, 37, 0) 60%, rgba(14, 43, 37, .38) 100%); } }
@media (prefers-reduced-motion: reduce) { .offers-banner, .offers-banner:hover { transform: none; } .offers-banner:hover .offers-banner-media img { transform: none; } }

/* Subtle resting shadows (homepage) */
.offers-banner-content .button { box-shadow: 0 6px 16px -4px rgba(23, 63, 53, .35); }
.offers-banner-content .button:hover { box-shadow: 0 10px 22px -4px rgba(23, 63, 53, .4); }
.offers-feature-icon { background: #fff; box-shadow: 0 2px 8px rgba(217, 41, 120, .18), 0 0 0 1px rgba(217, 41, 120, .08); }
.home-product-tab.is-active { box-shadow: 0 6px 14px -4px rgba(23, 63, 53, .35); }
.home-products .products li.product { box-shadow: 0 1px 2px rgba(23, 63, 53, .04), 0 8px 24px -12px rgba(23, 63, 53, .16); }
.home-products .products li.product:hover { box-shadow: 0 20px 40px -20px rgba(23, 63, 53, .22); }

/* Blog sidebar */
.news-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 40px; align-items: start; }
.news-layout .news-grid-archive { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.news-sidebar { position: sticky; top: 110px; display: grid; gap: 20px; }
.news-sidebar-box { padding: 24px; border-radius: var(--marassina-radius); background: #fff; box-shadow: var(--marassina-shadow); }
.news-sidebar-title { margin: 0 0 14px; color: var(--marassina-pink); font-family: inherit; font-size: 11px; font-weight: 750; letter-spacing: .16em; text-transform: uppercase; }
.news-sidebar-search { display: flex; gap: 8px; padding: 12px; }
.news-sidebar-search input[type=search] { flex: 1; min-width: 0; padding: 10px 14px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-pill); background: transparent; font: inherit; font-size: 14px; }
.news-sidebar-search button { flex: 0 0 42px; border: 0; border-radius: 50%; background: var(--marassina-green); color: #fff; font-size: 16px; cursor: pointer; transition: background .2s ease; }
.news-sidebar-search button:hover { background: var(--marassina-pink); }
.news-sidebar-cats { margin: 0; padding: 0; list-style: none; }
.news-sidebar-cats li + li { border-top: 1px solid var(--marassina-border); }
.news-sidebar-cats a { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; color: var(--marassina-green); font-size: 14px; text-decoration: none; }
.news-sidebar-cats a:hover, .news-sidebar-cats .is-current a { color: var(--marassina-pink); }
.news-sidebar-cats em { color: var(--marassina-muted); font-size: 12px; font-style: normal; }
.news-sidebar-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.news-sidebar-tags a { padding: 6px 12px; border-radius: var(--marassina-radius-pill); background: var(--marassina-green-soft); color: var(--marassina-green); font-size: 12px; text-decoration: none; transition: background .2s ease, color .2s ease; }
.news-sidebar-tags a:hover, .news-sidebar-tags a.is-current { background: var(--marassina-green); color: #fff; }
@media (max-width: 980px) { .news-layout { grid-template-columns: 1fr; } .news-sidebar { position: static; } .news-layout .news-grid-archive { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) { .news-layout .news-grid-archive { grid-template-columns: 1fr; } }

/* Article page with sidebar */
.article-layout { display: grid; grid-template-columns: minmax(0, 720px) 300px; justify-content: center; gap: 48px; align-items: start; max-width: 1140px; }
.article-layout .article-body { width: auto; margin: 0; }
.article-layout .news-sidebar { margin-top: 28px; }
@media (max-width: 980px) { .article-layout { grid-template-columns: minmax(0, 720px); gap: 20px; } .article-layout .article-body { width: auto; } }

/* Trust strip now sits at the very top of the footer */
.site-footer { padding-top: 0; }
.footer-trust { margin-bottom: 8px; border-top: 0; border-bottom: 1px solid rgba(255,255,255,.15); }
.footer-trust ul { padding-block: 18px; }

/* Menu popup: large category photos (size set in the Customizer → Menu popup). */
.category-mega-menu { --mega-photo-h: 150px; width: min(980px, calc(100vw - 40px)); }
.category-mega-menu[data-image-size="small"] { --mega-photo-h: 90px; }
.category-mega-menu[data-image-size="medium"] { --mega-photo-h: 125px; }
.category-mega-menu[data-image-size="large"] { --mega-photo-h: 175px; }
.category-mega-photo-link { display: block; margin-bottom: 10px; overflow: hidden; border-radius: 12px; background: var(--marassina-sand); }
.category-mega-photo { display: block; width: 100%; height: var(--mega-photo-h); object-fit: cover; transition: transform .35s ease; }
.category-mega-photo-link:hover .category-mega-photo { transform: scale(1.05); }
.category-mega-photo.category-mega-thumb-fallback { display: grid; place-items: center; font-size: 34px; } /* .category-mega-photo's display:block would otherwise stick the letter in the corner */
.category-mega-title { font-size: 14px !important; font-weight: 700; }
@media (max-width: 800px) { .category-mega-menu { width: auto; } .category-mega-menu[data-image-size="large"] { --mega-photo-h: 120px; } .category-mega-menu[data-image-size="medium"] { --mega-photo-h: 100px; } }
@media (prefers-reduced-motion: reduce) { .category-mega-photo { transition: none; } }
.category-mega-menu .category-mega-photo-link .category-mega-photo { height: var(--mega-photo-h); aspect-ratio: auto; }
.category-mega-menu .category-mega-title { margin-bottom: 4px; }

/* Empty cart */
.woocommerce-cart .wc-empty-cart-message, .woocommerce-cart .return-to-shop { display: none; }
.woocommerce-cart:has(.cart-empty-hero) .content-narrow { max-width: var(--container); }
.cart-empty-hero { display: flex; align-items: center; justify-content: center; gap: clamp(24px, 5vw, 64px); padding: clamp(28px, 5vw, 52px); border-radius: var(--marassina-radius-lg); background: linear-gradient(135deg, var(--marassina-green-soft), var(--marassina-cream)); box-shadow: var(--marassina-shadow); }
.cart-empty-art { position: relative; display: grid; place-items: center; flex: none; width: 150px; height: 150px; border-radius: 50%; background: #fff; color: var(--marassina-green); box-shadow: var(--marassina-shadow), inset 0 0 0 6px var(--marassina-green-soft); animation: nf-float 3.4s ease-in-out infinite; }
.cart-empty-icon { width: 58px; height: 58px; }
.cart-empty-leaf { position: absolute; top: 4px; right: 6px; width: 28px; height: 28px; color: var(--marassina-green); animation: nf-drift 4.2s ease-in-out infinite; }
.cart-empty-copy h2 { margin: 0 0 8px; font-size: clamp(24px, 3vw, 32px); }
.cart-empty-copy p { max-width: 380px; margin: 0 0 20px; color: var(--marassina-muted); }
.cart-empty-section { margin-top: 44px; }
.cart-empty-heading { margin: 0 0 18px; font-size: clamp(20px, 2.2vw, 26px); }
.cart-empty-cats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.cart-empty-cat { position: relative; display: flex; align-items: center; min-height: 120px; overflow: hidden; padding: 0 0 0 20px; border-radius: var(--marassina-radius); background: #fff; box-shadow: var(--marassina-shadow); color: var(--marassina-green); text-decoration: none; transition: transform .25s ease, box-shadow .25s ease; }
.cart-empty-cat:hover { transform: translateY(-4px); box-shadow: var(--marassina-shadow-hover); color: var(--marassina-pink); }
.cart-empty-cat-name { position: relative; z-index: 1; max-width: 62%; font-family: Georgia, serif; font-size: 18px; line-height: 1.2; letter-spacing: -.02em; }
.cart-empty-cat img { position: absolute; top: 0; right: 0; width: 42%; height: 100%; margin: 0; object-fit: cover; transition: transform .4s ease; -webkit-mask-image: linear-gradient(90deg, transparent, #000 45%); mask-image: linear-gradient(90deg, transparent, #000 45%); }
.cart-empty-cat:hover img { transform: scale(1.06); }
.cart-empty-section .products { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px) { .cart-empty-cats, .cart-empty-section .products { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .cart-empty-hero { flex-direction: column; text-align: center; } .cart-empty-copy p { margin-inline: auto; } .cart-empty-art { width: 120px; height: 120px; } .cart-empty-cat { min-height: 96px; padding-left: 14px; } .cart-empty-cat-name { font-size: 16px; } }
@media (prefers-reduced-motion: reduce) { .cart-empty-art, .cart-empty-leaf { animation: none; } }

/* Cart page: edits show instantly, saving happens in the background */
.woocommerce-cart .blockUI.blockOverlay { display: none !important; }
.woocommerce-cart-form .cart_item.is-removing { display: none; }
.cart-collaterals { transition: opacity .2s ease; }
.cart-collaterals.is-refreshing { opacity: .55; pointer-events: none; }
.marassina-cart-inner [data-cart-key].is-removing { opacity: .35; transform: scale(.98); transition: opacity .15s ease, transform .15s ease; pointer-events: none; }

/* Menu popup carousel: every category is a slide, arrows page through them. */
.category-mega-carousel { position: relative; min-width: 0; }
.category-mega-menu .category-mega-grid { display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; overscroll-behavior-x: contain; padding: 0; }
.category-mega-grid::-webkit-scrollbar { display: none; }
.category-mega-menu .category-mega-column { flex: 0 0 calc((100% - 40px) / 3); scroll-snap-align: start; }
.category-mega-all { display: inline-block; margin-top: 2px; color: var(--marassina-pink) !important; font-size: 12px !important; font-weight: 700 !important; text-transform: none !important; letter-spacing: 0 !important; }
.category-mega-arrow { position: absolute; top: 50%; margin-top: -20px; z-index: 2; display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; background: #fff; color: var(--marassina-green); box-shadow: 0 4px 14px rgba(14,43,37,.22); cursor: pointer; transition: background .2s ease, color .2s ease, transform .2s ease; }
.category-mega-arrow[hidden] { display: none; }
.category-mega-arrow:hover { background: var(--marassina-pink); color: #fff; transform: scale(1.06); }
.category-mega-arrow.is-prev { left: -14px; }
.category-mega-arrow.is-next { right: -14px; }
@media (max-width: 800px) { .category-mega-menu .category-mega-column { flex-basis: calc((100% - 14px) / 2); } .category-mega-menu .category-mega-grid { gap: 14px; } .category-mega-arrow.is-prev { left: -6px; } .category-mega-arrow.is-next { right: -6px; } }
@media (prefers-reduced-motion: reduce) { .category-mega-menu .category-mega-grid { scroll-behavior: auto; } }

/* Chips become slides one by one: a pending column stays hidden until the arrow reveals it. */
.category-mega-menu .category-mega-column.is-pending { display: none; }
.category-mega-simple-list a { transition: opacity .25s ease, transform .25s ease, background .2s ease, color .2s ease, border-color .2s ease; }
.category-mega-simple-list a.is-leaving { opacity: 0; transform: scale(.85); }
.category-mega-simple.is-empty { display: none; }

/* Mobile menu: plain accordion list with small thumbnails + category filter (desktop keeps the photo carousel). */
.category-mobile { display: none; }
@media (max-width: 800px) {
  .category-mega-intro, .category-mega-main { display: none; }
  .category-mega-menu { display: block; }
  .category-mobile { display: block; }
  .category-mobile-search input { width: 100%; height: 42px; padding: 0 16px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-pill); background: #fff; font-size: 16px; }
  .category-mobile-all { display: block; margin: 12px 2px 6px; color: var(--marassina-pink); font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
  .category-mobile-list { margin: 0; padding: 0; list-style: none; }
  .cm-item { border-bottom: 1px solid var(--marassina-border); }
  .cm-item[hidden] { display: none; }
  .cm-row { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 52px; padding: 6px 2px; border: 0; background: none; color: var(--marassina-green); font: inherit; font-size: 15px; font-weight: 600; line-height: 1.3; text-align: left; text-decoration: none; cursor: pointer; }
  .cm-thumb { flex: 0 0 36px; width: 36px; height: 36px; border-radius: 50%; object-fit: cover; background: var(--marassina-sand); }
  .cm-thumb-fallback { display: grid; place-items: center; color: var(--marassina-green); font-family: Georgia, serif; text-transform: uppercase; }
  .cm-name { flex: 1; }
  .cm-chevron { flex: 0 0 auto; color: var(--marassina-muted); transition: transform .2s ease; }
  .cm-row[aria-expanded="true"] .cm-chevron { transform: rotate(90deg); }
  .cm-sub { padding: 0 0 8px 48px; }
  .cm-sub[hidden], .cm-sub-link[hidden], .category-mobile-empty[hidden] { display: none; }
  .cm-sub a { display: block; padding: 7px 0; color: var(--marassina-muted); font-size: 14px; text-decoration: none; }
  .cm-sub .cm-sub-all { color: var(--marassina-pink); font-weight: 700; }
  .category-mobile-empty { padding: 18px 2px; }
  .category-mobile-empty a { color: var(--marassina-pink); font-weight: 700; }
}
@media (prefers-reduced-motion: reduce) { .cm-chevron { transition: none; } }
@media (max-width: 800px) {
  .cm-links-list { margin: 0; padding: 0; list-style: none; }
  .cm-links-list a { display: flex; align-items: center; min-height: 44px; padding: 4px 2px; border-bottom: 1px solid var(--marassina-border); color: var(--marassina-green); font-size: 15px; font-weight: 600; text-decoration: none; }
  .cm-links:last-of-type { margin-top: 6px; }
  .category-mobile.is-filtering .cm-links { display: none; }
  .category-mobile .language-switcher { display: flex; gap: 10px; padding: 18px 2px 8px; }
  .category-mobile .language-switcher a { padding: 6px 14px; border: 1px solid var(--marassina-border); border-radius: var(--marassina-radius-pill); color: var(--marassina-green); font-size: 12px; font-weight: 700; text-decoration: none; }
  .category-mobile .language-switcher a.is-current { background: var(--marassina-green); border-color: var(--marassina-green); color: #fff; }
}
@media (max-width: 800px) { .cm-links-list a { gap: 14px; min-height: 62px; } .cm-links-list .cm-name { flex: 1; } }
@media (max-width: 800px) { .cm-icon { display: grid; place-items: center; background: var(--marassina-green-soft); color: var(--marassina-green); } .cm-icon svg { display: block; } }

/* Mobile: left-aligned top band, tighter gap above the first column */
@media (max-width: 800px) {
  .footer-top { justify-items: stretch; text-align: left; margin-bottom: 0; padding-block: 20px; }
  .footer-top .footer-brand { align-items: flex-start; }
  .footer-top .footer-brand .custom-logo-link { margin-inline: 0; }
  .footer-top .footer-brand .custom-logo { margin-left: -8px; }
  .footer-top .footer-review-stars { justify-content: flex-start; }
  .footer-grid { padding-top: 0; }
  .footer-grid > :first-child { padding-top: 20px; }
}

/* Mobile: B2B strip and bottom bar left-aligned like the rest */
@media (max-width: 800px) {
  .footer-b2b .container { flex-direction: column; align-items: flex-start; text-align: left; gap: 12px; padding-block: 20px; }
  .footer-b2b-copy { flex: 0 0 auto; }
  .footer-bottom { align-items: stretch; text-align: left; }
  .footer-bottom .footer-legal, .footer-bottom .footer-legal-links { justify-content: flex-start; }
  .footer-bottom .footer-bottom-extras { align-items: flex-start; justify-content: flex-start; }
  .footer-bottom .footer-payments { align-items: flex-start; }
  .footer-bottom .footer-claims, .footer-bottom .language-switcher { align-self: flex-start; }
}

/* Mobile B2B: title next to the handshake icon, text and button below */
@media (max-width: 800px) {
  .footer-b2b .container { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 12px 14px; }
  .footer-b2b-copy { display: contents; }
  .footer-b2b-icon { grid-column: 1; grid-row: 1; width: 40px; height: 40px; font-size: 18px; }
  .footer-b2b-copy strong { grid-column: 2; grid-row: 1; }
  .footer-b2b-copy span { grid-column: 1 / -1; grid-row: 2; margin: 0; }
  .footer-b2b .footer-b2b-button { grid-column: 1 / -1; grid-row: 3; justify-self: start; }
}
/* Popular products under a category without subcategories (desktop carousel). */
.category-mega-products { display: grid; gap: 10px; margin: 2px 0 10px; padding: 0; list-style: none; }
.category-mega-product { display: flex; align-items: center; gap: 12px; color: var(--marassina-green); text-decoration: none; }
.category-mega-product-img { flex: 0 0 56px; width: 56px; height: 56px; border-radius: 10px; object-fit: cover; background: var(--marassina-sand); }
.category-mega-product-text { display: grid; gap: 2px; min-width: 0; }
.category-mega-product-name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: 13px; font-weight: 600; line-height: 1.3; }
.category-mega-product-price { color: var(--marassina-pink); font-size: 12px; font-weight: 700; }
.category-mega-product-price del { color: var(--marassina-muted); font-weight: 400; }
.category-mega-product-price ins { text-decoration: none; }
.category-mega-product:hover .category-mega-product-name { color: var(--marassina-pink); }
.category-mega-column .category-mega-products li { margin: 0; }
.category-mega-column .category-mega-products a.category-mega-product { display: flex !important; align-items: center; gap: 12px; padding: 0 !important; color: var(--marassina-green) !important; font-size: 13px !important; font-weight: 600 !important; transform: none; }
.category-mega-column .category-mega-products a.category-mega-product:hover .category-mega-product-name { color: var(--marassina-pink); }
.category-mega-column .category-mega-product-img { display: block; flex: 0 0 52px; width: 52px; height: 52px; }
.category-mega-column .category-mega-products { gap: 8px; }
.category-mega-column ul.category-mega-products { display: grid; gap: 14px; margin: 4px 0 12px; }

/* Photo slider inside a category column (category photo + subcategory photos). */
.category-mega-slider { position: relative; }
.category-mega-slider .cm-slides { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; overscroll-behavior-x: contain; }
.category-mega-slider .cm-slides::-webkit-scrollbar { display: none; }
.category-mega-menu .category-mega-slider .cm-slide { position: relative; display: block; flex: 0 0 100%; scroll-snap-align: start; text-decoration: none; }
.cm-slide-label { position: absolute; left: 10px; bottom: 10px; max-width: calc(100% - 20px); padding: 4px 10px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.92); color: var(--marassina-green); font-size: 11px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.cm-slide-arrow { position: absolute; top: 50%; z-index: 2; display: grid; place-items: center; width: 28px; height: 28px; margin-top: -14px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.88); color: var(--marassina-green); box-shadow: 0 1px 6px rgba(14,43,37,.2); cursor: pointer; opacity: 0; transition: opacity .2s ease, background .2s ease; }
.cm-slide-arrow[hidden] { display: none; }
.cm-slide-arrow.is-prev { left: 8px; }
.cm-slide-arrow.is-next { right: 8px; }
.category-mega-slider:hover .cm-slide-arrow, .category-mega-slider:focus-within .cm-slide-arrow { opacity: 1; }
.cm-slide-arrow:hover { background: #fff; }
@media (hover: none) { .cm-slide-arrow { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .category-mega-slider .cm-slides { scroll-behavior: auto; } .cm-slide-arrow { transition: none; } }

/* Main carousel arrows sit in their own gutters, vertically centred, so they never cover text. */
.category-mega-carousel { padding-inline: 26px; margin-inline: -6px; }
.category-mega-arrow { width: 34px; height: 34px; margin-top: -17px; }
.category-mega-arrow.is-prev { left: -4px; }
.category-mega-arrow.is-next { right: -4px; }
@media (max-width: 800px) { .category-mega-carousel { padding-inline: 0; margin-inline: 0; } }

/* My Account login/register: drop WooCommerce's second border+padding on the forms (the cards
   already carry one). The Google button (.drawer-social, see inc/drawers.php) sits at the end of
   each form; the order values keep it below the submit row and "¿Perdiste tu contraseña?". */
.woocommerce-account #customer_login form.woocommerce-form { padding: 0; border: 0; border-radius: 0; margin: 0; }
.woocommerce-account #customer_login form .woocommerce-LostPassword { order: 2; }
.woocommerce-account #customer_login form .drawer-social { order: 3; margin-top: 18px; }
.marassina-two-step[data-step="password"] .drawer-social { display: none; }