:root {
    color-scheme: light;
    --store-bg: #F5F4F0;
    --store-surface: #FFFFFF;
    --store-surface-soft: #E7EAEC;
    --store-text: #0B0D10;
    --store-muted: #5F6870;
    --store-line: rgba(11,13,16,.16);
    --store-accent: #29435D;
    --store-accent-soft: rgba(41,67,93,.12);
    --store-offers-symbol: #29435D;
    --store-radius: 14px;
    --stock-alert-bg: #FFF3D8;
    --stock-alert-text: #7A3C00;
    --stock-alert-border: rgba(122,60,0,.2);
}

:root[data-theme="dark"] {
    color-scheme: dark;
    --store-bg: #0B0D10;
    --store-surface: #14181D;
    --store-surface-soft: #1B2229;
    --store-text: #F5F4F0;
    --store-muted: #B6BDC4;
    --store-line: rgba(245,244,240,.12);
    --store-accent-soft: rgba(41,67,93,.3);
    --store-offers-symbol: #D6B47A;
    --stock-alert-bg: #3A2B17;
    --stock-alert-text: #FFD58A;
    --stock-alert-border: rgba(255,213,138,.3);
}

:root[data-theme="light"] {
    --store-bg: #F5F4F0;
    --store-surface: #FFFFFF;
    --store-surface-soft: #E7EAEC;
    --store-text: #0B0D10;
    --store-muted: #5F6870;
    --store-line: rgba(11,13,16,.16);
    --store-accent: #29435D;
    --store-accent-soft: rgba(41,67,93,.12);
    --store-offers-symbol: #29435D;
    --stock-alert-bg: #FFF3D8;
    --stock-alert-text: #7A3C00;
    --stock-alert-border: rgba(122,60,0,.2);
}

:root { --bg-primary:var(--store-bg); --bg-secondary:var(--store-surface-soft); --bg-tertiary:var(--store-surface); --bg-card:var(--store-surface); --text-primary:var(--store-text); --text-secondary:var(--store-muted); --text-dark:var(--store-text); --text-light:#F5F4F0; --border-color:var(--store-line); --color-primary:var(--store-bg); --color-secondary:var(--store-surface-soft); --color-accent:var(--store-accent); --accent:var(--store-accent); --accent-hover:#1D3348; }
:root[data-theme="dark"] { --accent-hover:#3B5F80; }
:root[data-theme="light"] { --accent-hover:#1D3348; --text-dark:#0B0D10; --color-primary:#0B0D10; }

html { scroll-behavior: smooth; overflow-x: hidden; }
body { background: var(--store-bg); color: var(--store-text); transition: background-color .2s ease,color .2s ease; }
.main-header { background: var(--store-bg); background: color-mix(in srgb, var(--store-bg) 94%, transparent); border-bottom: 1px solid var(--store-line); box-shadow: 0 8px 28px rgba(0,0,0,.12); backdrop-filter: blur(14px); }
.header-top { min-height: 68px; padding: .55rem 1rem; grid-template-columns: auto minmax(0,1fr) auto; }
.header-brand { display: flex; align-items: center; min-width: 0; grid-column: 2; grid-row: 1; justify-self: start; transform: none; }
.header-brand a { display:block; max-width:100%; overflow:hidden; color:var(--store-text); font-family:"Montserrat",sans-serif; font-size:calc(clamp(.82rem,2vw,1.05rem) + 2px); font-weight:600; letter-spacing:.08em; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }
.header-logo { position: static; grid-column: 1; grid-row: 1; transform: none; justify-self: start; }
.header-logo .header-brand-mark { display: block; width: 108px; height: 44px; max-width: 24vw; color: var(--store-text); }
.pacto-mark use { fill: currentColor; }
.header-actions { justify-self: end; gap: .25rem; }
.icon-btn { width: 40px; height: 40px; color: var(--store-text); border-radius: 50%; }
.icon-btn:hover,.icon-btn:focus-visible { background: var(--store-accent-soft); color: var(--store-accent); outline: none; }
.icon-btn i { font-size: 1.22rem !important; }
.cart-count { top: 2px; right: 0; width: 17px; height: 17px; background: var(--store-accent); color: #fff; font-size: .64rem; }
.theme-toggle i { display: inline-block; }
.header-search.mobile-search-bar { padding: 0 .9rem .7rem; }
.header-search.mobile-search-bar.active { display: flex; }
.header-search.mobile-search-bar input { min-height: 40px; border: 1px solid var(--store-line); border-radius: 999px; background: var(--store-surface); color: var(--store-text); }
.header-search.mobile-search-bar input::placeholder { color: var(--store-muted); }
#search-clear { border: 0; background: transparent; color: var(--store-muted); cursor: pointer; }

.hero { height: clamp(390px, 72vw, 680px); min-height: 390px; max-height: 78vh; background: radial-gradient(circle at 78% 26%, rgba(41,67,93,.42), transparent 34%), linear-gradient(135deg,#0B0D10,#18222C 62%,#29435D); }
.hero-image { object-fit: cover; object-position: center; }
.hero-image-missing { display: none; }
.hero-overlay { background: linear-gradient(90deg,rgba(0,0,0,.72),rgba(0,0,0,.18) 70%,rgba(0,0,0,.38)); }
.hero-content { left: 0; right: 0; top: auto; bottom: 10%; transform: none; width: 100%; max-width: none; padding: 0 clamp(20px,5vw,64px); text-align: center; }
#hero-typing-text { max-width: 900px; margin-inline: auto; font-family:"Montserrat",sans-serif; font-size: clamp(2rem,5.8vw,4.8rem); font-weight:600; line-height:1.08; letter-spacing:.015em; text-align:center; text-wrap:balance; }

.catalog-section { padding: clamp(2.75rem,7vw,6rem) 0; background: var(--store-bg); }
.section-header { margin-bottom: 1.75rem; text-align: left; }
.section-title { color: var(--store-text); font-size: clamp(1.55rem,4vw,2.4rem); letter-spacing: .15em; }
.section-subtitle { color: var(--store-muted); font-size: .8rem; letter-spacing: .16em; }
.filters { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .6rem; justify-content: stretch; margin-bottom: 2rem; }
.catalog-offers-status { grid-column: 1 / -1; padding: .35rem .2rem; color: var(--store-muted); font-size: .8rem; letter-spacing: normal; text-align: center; text-transform: none; }
.catalog-offers-status button { margin-left: .35rem; padding: 0; border: 0; background: none; color: var(--store-accent); font: inherit; text-decoration: underline; cursor: pointer; }
.filter-btn { min-height: 86px; padding: .8rem .65rem; border: 1px solid var(--store-line); border-radius: var(--store-radius); background: transparent; color: var(--store-text); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; transition: transform .2s ease,border-color .2s ease,background .2s ease; }
.filter-btn:hover,.filter-btn:focus-visible,.filter-btn.active { transform: translateY(-2px); border-color: var(--store-accent); background: transparent; outline: none; box-shadow:inset 0 -2px 0 var(--store-accent); }
.filter-btn.active { color: var(--store-accent); }
.filter-btn[data-filter="Remeras"]::before { background: linear-gradient(145deg,#bd8354,#33231c); }
.filter-btn[data-filter="Camperas"]::before { background: linear-gradient(145deg,#5b635c,#1d2520); }
.filter-btn[data-filter="Jeans"]::before { background: linear-gradient(145deg,#416078,#1a2936); }
.filter-btn[data-filter="Camisas"]::before { background: linear-gradient(145deg,#d8d0bd,#77705f); }
.filter-btn[data-filter="Calzado"]::before { background: linear-gradient(145deg,#7d6c5b,#26211d); }
.filter-btn[data-filter="Accesorios"]::before { background: linear-gradient(145deg,#b08d50,#332918); }
.filter-btn[data-filter="Ofertas"]::before { background: linear-gradient(145deg,var(--store-accent),#0B0D10); }
.product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.product-card { border: 1px solid var(--store-line); border-radius: var(--store-radius); background: var(--store-surface); box-shadow: 0 8px 24px rgba(0,0,0,.1); }
.product-card--sold-out { border: 2px solid var(--store-muted); cursor: not-allowed; }
.product-card--sold-out:hover { transform: none; border-color: var(--store-muted); box-shadow: 0 8px 24px rgba(0,0,0,.1); }
.product-card.product-card--sold-out:hover .card-image { transform: none; }
.product-card.product-card--sold-out:hover .card-image-back { opacity: 0; }
.card-image-container { position: relative; aspect-ratio: 3 / 4; width: 100%; padding: 0; background: transparent; --card-image-inset-top: 0px; --card-image-inset-inline: 0px; overflow: hidden; border-radius: 12px; }
.product-status-badge { position: absolute; top: .85rem; right: .85rem; z-index: 2; padding: .45rem .65rem; border-radius: 4px; background: #222; color: #fff; font-size: .7rem; font-weight: 700; letter-spacing: .08em; }
.cart-item--sold-out { opacity: .72; }
.card-image { width: 100%; height: 100%; object-fit: cover; object-position: center; border-radius: 12px; display: block; }
.card-image-back { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; border-radius: 12px; display: block; }
html[data-stock-visibility="hidden"] .stock-urgency-card { display: none; }
.catalog-restored .product-card:hover .card-image-back { opacity: 0 !important; }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .product-card:hover { transform: translateY(-5px); border-color: var(--store-accent); box-shadow: 0 14px 30px rgba(0,0,0,.16); }
    .product-card:hover .card-image { transform: scale(1.05); }
    .product-card:hover .card-image-back { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
    .product-card, .card-image, .card-image-back { transition: none; }
}
.card-info { padding: .9rem; gap: .55rem; }
.card-category { color: var(--store-accent); font-size: .65rem; letter-spacing: .12em; }
.stock-urgency { display: block; width: fit-content; margin-top: .55rem; padding: .5rem .7rem; border: 1px solid var(--stock-alert-border); border-radius: 8px; background: var(--stock-alert-bg); color: var(--stock-alert-text); font-size: .8rem; font-weight: 700; line-height: 1.4; }
.stock-urgency-card { margin-top: 0; padding: .35rem .5rem; font-size: .66rem; }
.card-title { color: var(--store-text); font-size: .92rem; letter-spacing: .04em; }
.card-rating { color: var(--store-muted); }
.card-price { color: var(--store-accent); font-size: 1.05rem; }
.card-price-old { color: var(--store-muted); }
.card-buy-button { min-width: 0; padding: .72rem .75rem; background: var(--store-accent); color: #fff; font-size: .68rem; letter-spacing: .1em; }
.card-buy-button:hover { background: var(--store-text); color: var(--store-bg); }
.product-badge { top: 12px; left: 12px; padding: .35rem .6rem; background: var(--store-bg); font-size: .6rem; }
.catalog-pagination { display:flex; align-items:center; justify-content:center; gap:.45rem; margin:2rem auto 0; }
.catalog-page-list { display:flex; align-items:center; gap:.35rem; }
.catalog-page-btn { display:inline-grid; place-items:center; min-width:40px; min-height:40px; padding:.45rem .7rem; border:1px solid var(--store-line); border-radius:999px; background:transparent; color:var(--store-text); cursor:pointer; font-weight:700; }
.catalog-page-btn:hover,.catalog-page-btn:focus-visible,.catalog-page-btn.active { border-color:var(--store-accent); background:var(--store-accent-soft); color:var(--store-accent); outline:none; }
.catalog-page-btn:disabled { opacity:.4; cursor:not-allowed; }

.main-footer { padding: 3rem 1rem 1.25rem; background: var(--store-surface); color: var(--store-text); border-top: 1px solid var(--store-line); }
.footer-content { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.5rem; max-width: 1120px; }
.footer-column h4 { color: var(--store-text); font-size: .7rem; letter-spacing: .14em; }
.footer-column p,.footer-column a { color: var(--store-muted); font-size: .82rem; line-height: 1.7; }
.main-footer .footer-contact-value,
.main-footer .footer-contact-value:visited { color: var(--store-muted); }
.main-footer .footer-contact-value:hover,
.main-footer .footer-contact-value:focus-visible { color: var(--store-text); }
.main-footer .footer-contact-value:focus-visible { outline: 2px solid var(--store-text); outline-offset: 3px; border-radius: 2px; }
.main-footer .footer-contact-value i,
.main-footer .footer-contact-value svg { color: currentColor; }
.main-footer .footer-contact-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .85rem; }
.main-footer .footer-contact-value.footer-contact-action,
.main-footer .footer-contact-value.footer-contact-action:visited,
.main-footer .footer-contact-value.footer-contact-action:hover,
.main-footer .footer-contact-value.footer-contact-action:focus-visible {
    display: inline-flex;
    box-sizing: border-box;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.4);
    border-radius: 50%;
    color: #fff;
    font-size: 1rem;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 3px 8px rgba(0,0,0,.22);
    transition: filter .18s ease, transform .18s ease, box-shadow .18s ease;
}
.main-footer .footer-contact-value.footer-contact-action i {
    display: grid;
    width: 1em;
    height: 1em;
    place-items: center;
    color: #fff;
    font-size: 1.5rem;
}
.main-footer .footer-contact-value.footer-contact-action--whatsapp { background: #0B7A3B; }
.main-footer .footer-contact-value.footer-contact-action--instagram {
    background: linear-gradient(135deg,#6633bd 0%,#c13584 38%,#e1306c 62%,#f77737 82%,#feda75 100%);
}
.main-footer .footer-contact-value.footer-contact-action:hover { filter: brightness(.94); transform: translateY(-2px); box-shadow: 0 5px 12px rgba(0,0,0,.25); }
.main-footer .footer-contact-value.footer-contact-action:focus-visible {
    outline: 3px solid var(--store-text);
    outline-offset: 3px;
}
.main-footer .footer-contact-value.footer-contact-action:active { transform: translateY(0); }
.product-detail .detail-grid {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
    gap: clamp(1.5rem, 4vw, 3rem);
}
.detail-media .main-image-wrap { min-height: 0; }
.detail-media #main-product-image {
    display: block;
    width: 100%;
    height: min(68vh, 640px);
    max-height: 640px;
    object-fit: contain;
}
.footer-bottom { border-top-color: var(--store-line); color: var(--store-muted); font-size: .75rem; }
.modal-overlay { background: rgba(0,0,0,.72); }
.modal { border: 1px solid var(--store-line); border-radius: var(--store-radius); background: var(--store-surface); color: var(--store-text); }
.modal-header { border-bottom-color: var(--store-line); }
.modal-footer { border-top-color: var(--store-line); }
input,textarea,select,button { color:var(--store-text); }
input::placeholder,textarea::placeholder { color:var(--store-muted); opacity:1; }
select option { background:var(--store-surface); color:var(--store-text); }
.filters { display:flex; justify-content:flex-start; overflow-x:auto; gap:.8rem; padding:.15rem .1rem .8rem; margin-bottom:2rem; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.filters::-webkit-scrollbar { display:none; }
.filter-btn { position:relative; display:flex; flex:0 0 118px; flex-direction:column; align-items:center; justify-content:flex-end; min-height:148px; padding:0 0 .75rem; overflow:hidden; border-radius:10px; scroll-snap-align:start; text-align:center; }
.category-image { display:block; width:78px; height:78px; margin:0 auto .7rem; border-radius:50%; object-fit:cover; background:var(--store-surface-soft); border:1px solid var(--store-line); }
.category-image--offers { padding:15px; color:var(--store-offers-symbol); object-fit:contain; }
.category-image--brand { padding:16px; object-fit:contain; background:transparent; color:var(--store-text); }
.category-image-fallback { position:relative; background:var(--store-surface-soft); }
.category-image-fallback::after { content:none; }
.filter-btn::before,.filter-btn::after { content:none; display:none; }
.filter-btn > span:last-child { width:100%; padding:0 .7rem; font-size:.68rem; font-weight:600; text-align:center; }
.category-image-preview { display:grid; place-items:center; min-height:150px; overflow:hidden; border:1px solid var(--admin-border, var(--store-line)); border-radius:8px; background:var(--store-surface-soft); color:var(--store-muted); text-align:center; }
.category-image-preview img { width:100%; height:150px; object-fit:cover; }
.theme-toggle { border:1px solid var(--store-line); color:var(--store-text); }
.filter-btn > span:last-child { color:var(--store-text); }
.filter-btn.active > span:last-child { color:var(--store-accent); }
.modal h2,.modal h3,.modal p,.modal label,.modal span,.modal strong { color:var(--store-text); }
.modal-close { color:var(--store-text); }
.modal input,.modal textarea,.modal select { border:1px solid var(--store-line); background:var(--store-surface-soft); color:var(--store-text); }
.modal input::placeholder,.modal textarea::placeholder { color:var(--store-muted); opacity:1; }
.cart-item,.cart-summary { background:var(--store-surface); color:var(--store-text); border-color:var(--store-line); }
.checkout-modal { max-height:min(90vh,820px); }
.checkout-body { max-height:calc(90vh - 96px); overflow-y:auto; }
.checkout-modal h3,.checkout-modal h4 { color:var(--store-text); }
.checkout-modal input[type="text"],.checkout-modal input[type="email"],.checkout-modal input[type="tel"] { width:100% !important; max-width:100%; min-height:46px; box-sizing:border-box; border:1px solid var(--store-line) !important; border-radius:10px !important; background:var(--store-surface-soft) !important; color:var(--store-text) !important; }
.checkout-modal input::placeholder { color:var(--store-muted) !important; opacity:1; }
.checkout-modal input[type="radio"] { width:18px !important; min-width:18px; min-height:18px; accent-color:var(--store-accent); }
.checkout-modal label { color:var(--store-text); line-height:1.45; }
.checkout-controls { display:flex; flex-wrap:wrap; align-items:center; }
.checkout-controls .btn { min-height:44px; flex:1 1 140px; }
.checkout-errors { color:var(--store-accent) !important; }

@media (min-width:768px) { .header-top{min-height:74px;padding:.65rem 1.5rem} .header-logo{justify-self:start} .header-logo .header-brand-mark{width:138px;max-width:18vw;height:48px} .header-brand{padding-left:.85rem} .header-search.mobile-search-bar{display:flex;position:absolute;top:50%;left:50%;width:min(38vw,420px);padding:0;transform:translate(-50%,-50%)} .header-actions{margin-left:auto} .hero-content{bottom:12%} .product-grid{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (min-width:1100px) { .filters{justify-content:center; overflow:visible} .product-grid{grid-template-columns:repeat(4,minmax(0,1fr))} .hero{height:min(700px,72vh)} }
@media (min-width:768px) and (max-width:1023px) { .product-detail .detail-grid{grid-template-columns:minmax(0,1fr);gap:1.25rem} .product-detail .detail-media #main-product-image{height:min(55vh,480px);max-height:480px} }
@media (max-width:767px) { .container{padding-left:1rem;padding-right:1rem} .header-top{grid-template-columns:auto minmax(0,1fr) auto;gap:.45rem} .header-logo{grid-column:1} .header-brand{grid-column:2;padding-left:.15rem} .header-brand a{font-size:calc(.78rem + 2px);letter-spacing:.06em} .header-actions{grid-column:3} .hero{aspect-ratio:4/5;min-height:380px;max-height:620px} .hero-content{bottom:9%;padding-inline:1rem} #hero-typing-text{font-size:clamp(1.8rem,7.2vw,2.8rem);line-height:1.08;letter-spacing:.01em} .filters{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:.75rem;justify-content:flex-start;padding:.15rem .1rem .8rem;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none} .filters::-webkit-scrollbar{display:none} .filter-btn{flex:0 0 104px;min-height:126px;padding:.45rem .35rem;scroll-snap-align:start} .category-image{width:72px;height:72px} .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem} .product-card{min-width:0} .card-image-container{padding:0;overflow:hidden;border-radius:12px} .card-image{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:center;border-radius:12px;display:block} .product-detail .detail-grid{grid-template-columns:minmax(0,1fr);gap:.85rem;padding:1rem 0 2.5rem} .detail-media .main-image-wrap{min-height:0;max-height:none;overflow:visible} .product-detail .detail-media #main-product-image{height:min(42vh,360px);max-height:360px;touch-action:pan-y} .footer-content{grid-template-columns:1fr;gap:1.5rem} .footer-contact-actions{gap:.7rem} .main-footer .footer-contact-value.footer-contact-action,.main-footer .footer-contact-value.footer-contact-action:visited,.main-footer .footer-contact-value.footer-contact-action:hover,.main-footer .footer-contact-value.footer-contact-action:focus-visible{flex-basis:39px;width:39px;height:39px} .main-footer .footer-contact-value.footer-contact-action i{font-size:1.39rem} .catalog-pagination{margin-top:1.5rem;gap:.3rem} .catalog-page-list{gap:.25rem} .catalog-page-btn{min-width:36px;min-height:36px;padding:.35rem .55rem} .checkout-body{max-height:calc(100dvh - 150px)} .checkout-controls .btn{flex-basis:100%} }
@media (max-width:360px) { .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem} .filters{grid-template-columns:repeat(2,minmax(0,1fr))} .header-logo .header-brand-mark{width:86px;max-width:24vw} .header-brand a{font-size:calc(.7rem + 2px);letter-spacing:.06em} .icon-btn{width:36px;height:36px} }