/* Boutique: presentation only. The catalog and commerce data keep their source. */
body { background: var(--store-background, #fffafc); }
[hidden], .category[hidden], [data-category][hidden] { display: none !important; }
:root { --boutique-line: #e9dfe3; --boutique-muted: #756971; }
.compactShowcase .heroSlides { background: #f4edf0; }
.compactShowcase .heroSlide { padding: 0; background: #f4edf0; }
.realCategoryPhoto img { position: static !important; width: 100% !important; height: 100% !important; object-fit: cover !important; transform: none !important; }
#categorias[aria-busy="true"] .categoryGrid { display: none !important; }
#categorias[aria-busy="true"]::after { content: "Cargando categorías…"; display: block; padding: 30px 0; color: var(--boutique-muted); font-size: 12px; }
button, a, input, select { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible { outline: 3px solid var(--pink); outline-offset: 4px; }
svg.shopIcon { width: 22px; height: 22px; display: block; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.header { height: 78px !important; padding: 0 max(28px, calc((100vw - 1280px) / 2)) !important; gap: 22px; box-shadow: 0 1px 0 var(--boutique-line); }
.header .storefrontBrand { flex: 0 0 auto; }
.header .nav { margin: 0 auto; gap: 26px; }
.header .nav > a, .categoryMenu > button { font-size: 12px; font-weight: 600; }
.header .actions { gap: 4px; }
.header .iconButton { display: grid; place-items: center; width: 40px; height: 42px; color: var(--ink); }
.header #cartCount { font-size: 9px; width: 16px; height: 16px; top: 1px; right: 0; }
.header .menu { display: none; }
.header .searchPanel.show { position: absolute; right: 0; top: 50px; width: min(440px, calc(100vw - 40px)); height: 48px; overflow: visible; padding: 0; margin: 0; }
.header .searchPanel input { height: 48px; border-radius: 12px; box-shadow: 0 12px 28px #35192315; }
.header .searchPanel button { top: 9px; }
.searchSuggestions { border-radius: 12px; margin-top: 5px; }
.announcement { margin: 0 !important; background: #f6edf1 !important; color: #653949 !important; min-height: 34px; padding: 18px 24px !important; font-size: 12px; line-height: 1.6; letter-spacing: .01em; }
.categoryMenuPanel { top: 78px !important; border-top: 1px solid var(--boutique-line); }
.megaPrimary { min-width: 210px; }
.megaContent { display: none; }
.categoryMenuPanel { width: min(340px, calc(100vw - 32px)) !important; left: auto !important; right: auto; padding: 22px !important; border-radius: 0 0 16px 16px; }
.megaPrimary > a { padding: 11px 0; }
.compactShowcase { display: block !important; width: min(calc(100% - 56px), 1280px) !important; max-width: 1280px !important; height: auto !important; min-height: 0 !important; margin: 102px auto 0 !important; padding: 0 !important; background: transparent; }
.compactShowcase .showcaseRail, .compactShowcase .spark { display: none !important; }
.compactShowcase .heroImage.heroCarousel { width: 100% !important; height: 420px !important; min-height: 0 !important; margin: 0 !important; aspect-ratio: auto !important; border-radius: 20px !important; box-shadow: none !important; background: #f3e8ec !important; }
.compactShowcase .heroImage.heroCarousel .heroSlides { left: 44% !important; }
.compactShowcase .heroImage.heroCarousel .heroSlide { width: 100% !important; height: 100% !important; border-radius: 0 !important; object-fit: cover !important; object-position: 50% 50% !important; }
.compactShowcase .heroImage.heroCarousel .heroSlide[src*="exhibition-fashion"] { object-position: 50% 8% !important; }
.compactShowcase .heroImage.heroCarousel .heroSlide[src*="exhibition-bag"] { object-position: 50% 80% !important; }
.compactShowcase .heroImage.heroCarousel .heroSlide[src*="exhibition-sunglasses"] { object-position: 50% 30% !important; }
.compactShowcase .heroImage.heroCarousel .heroSlide[src*="exhibition-style"] { object-position: 50% 30% !important; }
.realCategoryPhoto img[src*="exhibition-fashion"] { object-position: 50% 25% !important; }
.compactShowcase .showcaseCaption { position: relative; display: flex; flex-direction: column; justify-content: center; left: auto; bottom: auto; right: auto; width: 44%; max-width: none !important; height: 100%; padding: 38px 40px !important; background: transparent; border-radius: 0; box-shadow: none; backdrop-filter: none; }
.showcaseCaption .eyebrow { font: 700 10px/1.5 var(--store-body, Arial, sans-serif); letter-spacing: .18em; color: #94415e; margin: 0 0 18px; }
.showcaseCaption h1 { font: 500 clamp(36px, 4vw, 56px)/1.07 var(--store-heading, Georgia, serif) !important; letter-spacing: -.04em; margin: 0 0 18px; text-wrap: balance; }
.showcaseCaption .heroLead { font: 400 14px/1.7 var(--store-body, Arial, sans-serif); color: #69515d; max-width: 300px; margin: 0 0 24px; }
.showcaseCaption > a { align-self: flex-start; display: inline-flex; align-items: center; gap: 24px; background: var(--ink); color: white; padding: 14px 20px; border-radius: 8px; font: 600 12px/1.4 var(--store-body, Arial, sans-serif); }
.showcaseCaption .heroLocation { margin: 18px 0 0; color: #79636d; font: 400 10px/1.6 var(--store-body, Arial, sans-serif); }
.compactShowcase .heroArrow { top: auto; bottom: 18px; translate: none; width: 36px; height: 36px; font-size: 24px; box-shadow: none; }
.compactShowcase .heroPrev { left: auto; right: 62px; }
.compactShowcase .heroNext { right: 18px; }
.compactShowcase .heroDots { left: 72%; right: auto; bottom: 26px; translate: -50% 0; padding: 5px 8px; }
.categories, .new, .recentlyViewed { padding: 40px max(28px, calc((100vw - 1280px) / 2)) !important; }
.categories { padding-top: 32px !important; padding-bottom: 30px !important; }
.sectionHeading { margin-bottom: 24px; align-items: center; }
.sectionHeading .eyebrow { font-size: 9px; letter-spacing: .17em; margin-bottom: 8px; color: #94415e; }
.sectionHeading h2, .categories .sectionHeading h2 { font: 500 clamp(25px, 2.6vw, 34px)/1.2 var(--store-heading, Georgia, serif); letter-spacing: -.025em; }
.sectionHeading > a { font-size: 11px; font-weight: 600; }
.categories .categoryGrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px; overflow: visible; padding: 0; }
.categories .category { display: flex; flex-direction: row; gap: 15px; align-items: center; text-align: left; padding: 12px 16px; background: white; border: 1px solid var(--boutique-line); border-radius: 12px; box-shadow: none; min-height: 88px; transition: border-color .2s, transform .2s; }
.categories .category:hover { transform: translateY(-2px); border-color: #c68aa3; }
.categories .categoryVisual { width: 58px; flex: 0 0 58px; box-shadow: none; }
.categories .category h3 { font: 600 12px/1.4 var(--store-body, Arial, sans-serif); margin: 0; }
.new { background: #fff !important; border-top: 1px solid var(--boutique-line); }
.premiumTools { border: 0; border-top: 1px solid var(--boutique-line); border-bottom: 1px solid var(--boutique-line); border-radius: 0; padding: 16px 0; margin: 0 0 24px; box-shadow: none; }
.premiumFilters { gap: 14px; }
.premiumFilters label { min-width: 138px; font-size: 9px; font-weight: 600; letter-spacing: .03em; }
.premiumFilters select { font-size: 12px; border-radius: 8px; }
.premiumResult { padding-bottom: 14px; font-size: 11px; }
.commerceTools { margin: 0 0 22px; }
.commerceTools .flash { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; background: #f9f1f4 !important; color: #69354a !important; padding: 12px 16px !important; border: 0; border-radius: 8px; box-shadow: none; }
.commerceTools .flash > span { font-size: 10px; letter-spacing: .06em; color: #94415e; }
.commerceTools .flash > b { font-size: 12px; }
.commerceTools .flash > small { display: none !important; }
.productGrid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 20px; align-items: stretch; }
.productGrid > .product { display: flex; flex-direction: column; padding: 0 !important; border: 1px solid #eee7ea; border-radius: 12px !important; background: #fff; box-shadow: none !important; overflow: hidden; min-width: 0; }
.productGrid > .product:hover { transform: translateY(-2px) !important; box-shadow: 0 8px 24px #3519230c !important; }
.product .productImage { aspect-ratio: 4/5 !important; height: auto !important; margin: 0 !important; width: 100%; border-radius: 0 !important; background: #f8f6f7; }
.productImage img { height: 100% !important; width: 100%; border-radius: 0 !important; }
.productImage .heart { top: 10px; right: 10px; width: 34px; height: 34px; font-size: 23px; background: #ffffffec; box-shadow: none; }
.product .productMeta { display: flex; flex: 1; flex-direction: column; align-items: flex-start; padding: 14px 14px 12px; gap: 0; }
.productMeta > small { font: 400 10px/1.4 var(--store-body, Arial, sans-serif); color: var(--boutique-muted); margin: 0 0 7px; }
.product .productMeta h3 { font: 500 15px/1.4 var(--store-body, Arial, sans-serif) !important; letter-spacing: 0; margin: 0 0 9px !important; min-height: 42px; width: 100%; }
.product .productMeta p { font: 600 15px/1.4 var(--store-body, Arial, sans-serif); margin: 0 0 9px; color: var(--ink); }
.product .productMeta p s { font-size: 11px; color: #84767d; font-weight: 400; }
.product .productMeta > span { font: 400 10px/1.4 var(--store-body, Arial, sans-serif); color: #72636b; margin-top: auto; padding-top: 8px; }
.productSwatches { margin: 0 0 8px; }
.productCardActions { grid-template-columns: 1fr !important; gap: 5px; padding: 0 14px 14px !important; }
.productCardActions button { min-height: 42px; font-size: 12px; border-radius: 7px; }
.productCardActions .add { background: var(--ink) !important; border-color: var(--ink) !important; color: #fff !important; }
.productCardActions .buyNow { min-height: 32px; background: transparent !important; border-color: transparent !important; color: #775663 !important; box-shadow: none !important; font-size: 10px; font-weight: 500; }
.productCardActions .add.added { background: #266447 !important; border-color: #266447 !important; }
.product .discountBadge { background: #9f365c !important; font-weight: 600 !important; }
.product .lowStockBadge { background: #fffdf9; color: #68564b; font-weight: 500; box-shadow: none; }
.loadMore { margin: 30px auto 0; min-height: 44px; padding: 12px 28px; border: 1px solid #d4c7ce; border-radius: 8px; font: 600 12px var(--store-body, Arial, sans-serif); }
.promise { grid-template-columns: repeat(3, 1fr); background: #f5ecef; color: var(--ink); padding: 32px max(28px, calc((100vw - 1280px) / 2)); gap: 24px; border-block: 1px solid var(--boutique-line); }
.promise span { font-size: 23px; color: #984a68; margin-bottom: 8px; }
.promise b { font: 600 14px var(--store-body, Arial, sans-serif); }
.promise p { margin-top: 8px; font-size: 11px; color: #72636b; opacity: 1; }
.footer { padding: 48px max(28px, calc((100vw - 1280px) / 2)) 24px; background: #fff; grid-template-columns: 1.5fr 1fr 1fr 1.3fr; gap: 28px; }
.footer p, .footer a { font-size: 12px; line-height: 1.8; }
.footer > div > b { display: block; margin-bottom: 15px; font-size: 12px; }
.footerSocial, .footerContact { color: #91425f; }
.footerBottom { grid-column: 1/-1; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-top: 12px; padding-top: 22px; border-top: 1px solid var(--boutique-line); color: #81737b; font-size: 10px; }
.floatingAssistants { right: 18px; bottom: 18px; z-index: 160; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
#helpToggle { display: flex; align-items: center; gap: 9px; min-height: 42px; padding: 8px 14px; border: 1px solid #ded0d6; border-radius: 999px; background: #fff; color: #653949; box-shadow: 0 4px 18px #35192310; font: 600 12px var(--store-body, Arial, sans-serif); cursor: pointer; }
#helpToggle > span:first-child { display: grid; place-items: center; width: 22px; height: 22px; border: 1px solid #caa1b3; border-radius: 50%; font-size: 14px; }
.supportOptions { order: -1; display: flex; align-items: center; gap: 12px; padding: 12px 16px; border: 1px solid var(--boutique-line); border-radius: 14px; background: #fff; box-shadow: 0 10px 35px #3519231a; }
.supportOptions .chatbotButton { animation: none; width: 52px; height: 60px; min-height: 0; }
.supportOptions .chuliMascot { width: 42px; height: 48px; }
.supportOptions .whatsapp { width: 46px; height: 46px; box-shadow: none; }
.chatbotPanel { bottom: 78px; }
body:has(.drawer.show, .quickView.show, .accountModal.show, .checkoutModal.show, .orderView.show, .filtersOpen) .floatingAssistants { visibility: hidden; }
body.filtersOpen .floatingAssistants { visibility: hidden; }
.quickCard, .infoCard, .accountCard { border-radius: 16px; }
.quickActions button { box-shadow: none !important; }
.drawer .cartSummary { border-radius: 12px; box-shadow: none; }
.mobileShopNav { border-top: 1px solid var(--boutique-line); box-shadow: 0 -3px 18px #35192307; }
@media (min-width: 801px) and (max-width: 1100px) {
  .header { padding-inline: 24px !important; gap: 12px; }
  .header .nav { gap: 14px; }
  .header .storefrontWordmark strong { font-size: 22px; }
  .header .iconButton { width: 34px; }
  .productGrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .compactShowcase .showcaseCaption { padding-inline: 28px !important; }
  .premiumFilters label { min-width: 120px; }
}
@media (max-width: 800px) {
  .header { height: 64px !important; padding-inline: 14px !important; gap: 8px; }
  .header .menu { display: grid !important; width: 28px; }
  .header .storefrontBrand { margin-right: auto; }
  .header .actions { gap: 1px; }
  .header .iconButton { width: 34px; }
  .header .actions #searchBtn { display: grid !important; }
  .header .actions #favoriteBtn, .header #ordersBtn, .header .moreMenu { display: none !important; }
  .header .nav { margin: 0; padding: 22px; top: 64px; }
  .header .nav.open { gap: 20px; align-items: stretch; }
  .categoryMenuPanel { position: static !important; width: 100% !important; box-shadow: none; padding: 12px 0 !important; border: 0; }
  .announcement { margin-top: 64px; padding: 8px 16px; font-size: 10px; line-height: 1.5; }
  .header .searchPanel.show { position: fixed; top: 70px; left: 12px; right: 12px; width: auto; max-width: none; }
  .searchSuggestions { left: 0; right: 0; max-width: 100%; }
  .compactShowcase { width: calc(100% - 28px) !important; margin-top: 78px !important; }
  .compactShowcase .heroImage.heroCarousel { height: 350px !important; }
  .compactShowcase .showcaseCaption { padding: 26px !important; }
  .showcaseCaption h1 { font-size: 34px !important; }
  .showcaseCaption .heroLead { font-size: 12px; }
  .categories, .new, .recentlyViewed { padding: 28px 16px !important; }
  .categories .categoryGrid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; grid-auto-flow: row; grid-auto-columns: auto; overflow: visible; gap: 9px; }
  .categories .category { padding: 9px; min-height: 72px; gap: 9px; }
  .categories .categoryVisual { width: 45px; height: 45px; flex-basis: 45px; }
  .categories .category h3 { font-size: 11px; }
  .sectionHeading h2, .categories .sectionHeading h2 { font-size: 27px; }
  .productGrid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 18px 12px; }
  .product .productMeta { padding: 11px 10px 8px; }
  .product .productMeta h3 { font-size: 12px !important; min-height: 34px; margin-bottom: 7px !important; }
  .product .productMeta > small { font-size: 9px; }
  .product .productMeta p { font-size: 14px; }
  .product .productMeta > span { font-size: 9px; }
  .productCardActions { padding: 0 10px 10px !important; }
  .productCardActions button { min-height: 42px; font-size: 11px; }
  .productCardActions .buyNow { min-height: 28px; }
  .sectionHeading { margin-bottom: 20px; }
  .new > .sectionHeading { align-items: end; }
  .new > .sectionHeading > a { display: none; }
  .commerceTools .flash { gap: 5px; padding: 10px 12px !important; }
  .premiumTools { border-radius: 16px 16px 0 0; }
  .promise { padding: 25px 16px; grid-template-columns: 1fr; gap: 20px; text-align: left; }
  .promise > div { display: grid; grid-template-columns: 30px 1fr; column-gap: 12px; }
  .promise span { grid-row: 1/3; margin: 0; }
  .promise p { margin: 5px 0 0; }
  .footer { padding: 32px 20px 100px; grid-template-columns: 1fr 1fr; gap: 25px 20px; }
  .footer > div:first-child, .footer > div:nth-child(4) { grid-column: 1/-1; }
  .footerBottom { margin-top: 0; }
  .floatingAssistants { bottom: calc(78px + env(safe-area-inset-bottom)); right: 10px; }
  #helpToggle { min-height: 38px; padding: 7px 10px; gap: 6px; font-size: 10px; }
  #helpToggle > span:first-child { width: 18px; height: 18px; font-size: 12px; }
  .chatbotPanel { bottom: calc(125px + env(safe-area-inset-bottom)); }
  .drawer { padding-bottom: calc(90px + env(safe-area-inset-bottom)); }
}
@media (max-width: 520px) {
  .compactShowcase .heroImage.heroCarousel { height: 378px !important; border-radius: 14px !important; }
  .compactShowcase .heroImage.heroCarousel .heroSlides { left: 0 !important; bottom: 166px !important; }
  .compactShowcase .heroImage.heroCarousel .heroSlide { object-position: 50% 38% !important; }
  .compactShowcase .showcaseCaption { position: absolute; inset: auto 0 0; width: 100%; height: 166px; padding: 18px 20px !important; display: block; background: #f3e8ec; }
  .showcaseCaption .eyebrow { margin-bottom: 7px; font-size: 8px; }
  .showcaseCaption h1 { font-size: 29px !important; margin-bottom: 10px; }
  .showcaseCaption h1 br { display: none; }
  .showcaseCaption .heroLead, .showcaseCaption .heroLocation { display: none; }
  .showcaseCaption > a { padding: 10px 14px; font-size: 11px; gap: 18px; }
  .compactShowcase .heroArrow { bottom: 182px; width: 30px; height: 30px; }
  .compactShowcase .heroPrev { right: 54px; }
  .compactShowcase .heroNext { right: 16px; }
  .compactShowcase .heroDots { left: 18px; bottom: 190px; translate: none; }
}
@media (prefers-reduced-motion: reduce) { .productGrid > .product, .categories .category { transition: none; } }
@media (max-width: 700px) {
  .mobileShopNav { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
  #helpToggle { display: none; }
  .mobileShopNav .mobileHelp .shopIcon { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.7; }
}
@media (max-width: 360px) { .showcaseCaption h1 { font-size: 26px !important; } .header .storefrontWordmark strong { font-size: 18px; } }
