/* Moyo Alquimia — shared visual language. The original stylesheet stays intact. */
:root {
    color-scheme: light;
    --moyo-bg: #dce6e9;
    --moyo-panel: #e7eef0;
    --moyo-panel-alt: #cbdce1;
    --moyo-text: #183946;
    --moyo-muted: #395966;
    --moyo-faint: #415c67;
    --moyo-accent: #126777;
    --moyo-accent-hover: #0d5160;
    --moyo-accent-soft: #c7dce1;
    --moyo-button-text: #ffffff;
    --moyo-line: rgba(31, 74, 89, .19);
    --moyo-nav: rgba(220, 230, 233, .96);
    --moyo-hero: radial-gradient(ellipse at 82% 40%, #c0d6dc 0%, transparent 65%), #dce6e9;
    --moyo-contact: linear-gradient(115deg, #c7dce1, #dce6e9);
    --moyo-shadow: 0 18px 55px #173e5017;
    --moyo-grid: rgba(31, 74, 89, .03);
    --moyo-number: rgba(31, 74, 89, .09);
    --moyo-software: #1e5e75;
    --moyo-wellness: #355f33;
    --moyo-craft: #654d83;
    --moyo-digital: #7c461b;
    --primary-color: var(--moyo-accent);
    --primary-gradient: linear-gradient(115deg, #126777, #1b7d8d);
}
body.dark-mode {
    color-scheme: dark;
    --moyo-bg: #0c1b1c;
    --moyo-panel: #14292a;
    --moyo-panel-alt: #102324;
    --moyo-text: #e6f1eb;
    --moyo-muted: #afc4be;
    --moyo-faint: #9db8b0;
    --moyo-accent: #86d4bd;
    --moyo-accent-hover: #ace6d4;
    --moyo-accent-soft: #1e3934;
    --moyo-button-text: #102d28;
    --moyo-line: rgba(177, 216, 203, .17);
    --moyo-nav: rgba(12, 27, 28, .96);
    --moyo-hero: radial-gradient(ellipse at 82% 40%, #244a405c, transparent 65%), #0c1b1c;
    --moyo-contact: linear-gradient(115deg, #18372f, #172c29);
    --moyo-shadow: 0 18px 55px #00000030;
    --moyo-grid: rgba(177, 216, 203, .035);
    --moyo-number: rgba(177, 216, 203, .09);
    --moyo-software: #8bc5dc;
    --moyo-wellness: #b4d89a;
    --moyo-craft: #c9b3e0;
    --moyo-digital: #edbb87;
    --primary-color: var(--moyo-accent);
    --primary-gradient: linear-gradient(115deg, #86d4bd, #a0dfcd);
}
body { font-size: 1.0625rem; background: var(--moyo-bg); color: var(--moyo-text); color-scheme: light; }
body.dark-mode { background: var(--moyo-bg); color: var(--moyo-text); color-scheme: dark; }
body::before, body::after { display: none; }
body .section, body.dark-mode .section { background: var(--moyo-bg); }
.section::before, .section::after { display: none; }
.bg-white, .card, .modal-content, body.dark-mode .card { background: var(--moyo-panel) !important; color: var(--moyo-text); border-color: var(--moyo-line); }
.bg-light { background: var(--moyo-panel-alt) !important; }
.text-muted { color: var(--moyo-muted) !important; }
.text-primary { color: var(--moyo-accent) !important; }
.text-dark { color: var(--moyo-text) !important; }
.form-control, .form-select { background: var(--moyo-panel); color: var(--moyo-text); border-color: var(--moyo-line); }
.form-control::placeholder { color: var(--moyo-muted); opacity: 1; }
.form-control:focus, .form-select:focus { background: var(--moyo-panel); color: var(--moyo-text); border-color: var(--moyo-accent); box-shadow: 0 0 0 3px var(--moyo-accent-soft); }
body .hero-section { background: var(--moyo-hero); color: var(--moyo-text); }
.hero-section::before, .hero-section::after { display: none; }
.hero-section .hero-title { background: none; -webkit-text-fill-color: initial; color: var(--moyo-text); text-shadow: none; }
.hero-section .hero-subtitle, .hero-section .breadcrumb-item, .hero-section .breadcrumb-item a, .hero-section .breadcrumb-item::before { color: var(--moyo-muted); text-shadow: none; }
body .navbar, body.dark-mode .navbar { min-height: var(--navbar-height); background: var(--moyo-nav) !important; border: 0; border-bottom: 1px solid var(--moyo-line); box-shadow: none; transition: background-color .2s, border-color .2s; }
.navbar::before { display: none; }
.navbar .navbar-brand { background: none; -webkit-text-fill-color: initial; color: var(--moyo-text); font-size: 1.35rem; letter-spacing: -.7px; text-shadow: none; }
.navbar .navbar-brand > i { color: var(--moyo-accent); font-size: 1.1rem; }
.navbar .navbar-brand:hover { transform: none; color: var(--moyo-accent); }
.navbar .nav-link { font-size: .9375rem; font-weight: 500; color: var(--moyo-muted) !important; }
.navbar .nav-link.active, .navbar .nav-link:hover { color: var(--moyo-accent) !important; }
.navbar .nav-link > i:not(.fa-shopping-cart) { display: none; }
.navbar .nav-link::after { background: var(--moyo-accent); }
.navbar .dropdown-toggle::after { background: none; }
.navbar .dropdown-menu { border: 1px solid var(--moyo-line) !important; background: var(--moyo-panel); padding: .65rem; border-radius: 12px; }
.navbar .dropdown-item { color: var(--moyo-text); font-size: .9375rem; border-radius: 6px; }
.navbar .dropdown-item:hover, .navbar .dropdown-item:focus { background: var(--moyo-accent-soft); color: var(--moyo-accent); }
.navbar .btn-outline-light { border-color: var(--moyo-line); border-radius: 50%; width: 34px; height: 34px; padding: 0; }
.navbar [data-theme-toggle] { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: auto; min-height: 36px; padding: 0 12px; border-radius: 20px; color: var(--moyo-text); background: var(--moyo-panel); border-color: var(--moyo-line); font-size: .875rem; }
.navbar [data-theme-toggle]:hover { background: var(--moyo-accent-soft); color: var(--moyo-accent); }
.navbar-toggler { border-color: var(--moyo-line) !important; }
.navbar-toggler-icon { filter: brightness(0) opacity(.65); }
.dark-mode .navbar-toggler-icon { filter: none; }
.navbar .mobile-action-link { color: var(--moyo-text); }
.navbar-collapse.show, .navbar-collapse.collapsing { background: var(--moyo-panel); }
.btn-primary, .btn-primary.active { background: var(--primary-gradient); color: var(--moyo-button-text); border-color: var(--moyo-accent); }
.btn-primary:hover, .btn-primary:focus { background: var(--moyo-accent-hover); border-color: var(--moyo-accent-hover); color: var(--moyo-button-text); }
.btn-outline-primary { color: var(--moyo-accent); border-color: var(--moyo-accent); }
.btn-outline-primary:hover { background: var(--moyo-accent); border-color: var(--moyo-accent); color: var(--moyo-button-text); }
.whatsapp-float { width: 52px; height: 52px; font-size: 1.5rem; animation: none; background: #1c7755; box-shadow: 0 6px 24px #0003; }
body > footer.bg-dark { background: var(--moyo-bg) !important; color: var(--moyo-text) !important; border-top: 1px solid var(--moyo-line); box-shadow: none; }
body > footer .social-links a { background: var(--moyo-accent-soft); color: var(--moyo-accent); box-shadow: none; }
body > footer::before, body > footer::after { display: none; }
body > footer h5, body > footer h6 { color: var(--moyo-text); }
body > footer .text-muted { color: var(--moyo-muted) !important; font-size: .875rem; }
body > footer a { text-decoration: none; }
body > footer a:hover { color: var(--moyo-accent) !important; }
body > footer .footer-web-contact { color: var(--moyo-muted); font-size: .75rem; line-height: 1.6; }
body > footer .footer-web-contact a { display: inline-block; padding: 6px 2px; color: var(--moyo-accent); text-decoration: underline; text-underline-offset: 3px; }
body > footer .footer-web-contact a:focus-visible { outline: 2px solid var(--moyo-accent); outline-offset: 3px; border-radius: 2px; }
body > .site-footer { margin-top: 48px; padding: 36px 0 20px; }
.site-footer .footer-main { row-gap: 24px; }
.site-footer .footer-brand { margin-bottom: 0 !important; }
.site-footer .footer-group summary { color: var(--moyo-text); font-size: .9375rem; font-weight: 700; list-style: none; margin-bottom: 12px; }
.site-footer .footer-group summary::-webkit-details-marker { display: none; }
.site-footer .footer-group ul, .site-footer .footer-contact ul { margin-bottom: 0; }
.site-footer .footer-group a { display: inline-block; padding: 4px 0; line-height: 1.5; }
.site-footer .footer-contact { font-size: .875rem; overflow-wrap: anywhere; }
.site-footer .footer-contact li { padding: 4px 0; }
.site-footer .footer-divider { margin: 28px 0 16px; border-color: var(--moyo-line); opacity: 1; }
@media (max-width: 767px) {
    body > .site-footer { margin-top: 28px; padding-top: 28px; }
    .site-footer .footer-main { row-gap: 0; }
    .site-footer .footer-brand { padding-bottom: 20px; }
    .site-footer .social-links { display: flex; gap: 8px; }
    .site-footer .social-links a { width: 44px; height: 44px; margin: 0; }
    .site-footer .footer-group { border-top: 1px solid var(--moyo-line); }
    .site-footer .footer-group summary { display: flex; justify-content: space-between; align-items: center; min-height: 48px; margin: 0; cursor: pointer; }
    .site-footer .footer-group summary::after { content: '+'; color: var(--moyo-accent); font-size: 1.25rem; font-weight: 400; }
    .site-footer .footer-group[open] summary::after { content: '−'; }
    .site-footer .footer-group ul { padding-bottom: 12px; }
    .site-footer .footer-group a { min-height: 36px; padding: 7px 0; }
    .site-footer .footer-contact { padding-top: 20px; border-top: 1px solid var(--moyo-line); }
    .site-footer .footer-contact h6 { margin-bottom: 8px !important; }
    .site-footer .footer-contact a { display: inline-block; padding: 4px 0; }
    .site-footer .footer-divider { margin-top: 20px; }
}

/* The home page deliberately uses its own layout and no legacy animation hooks. */
body.experience-home { background: var(--moyo-bg); color: var(--moyo-text); font-family: Inter, sans-serif; }
.experience-home::before, .experience-home::after { display: none; }
.experience-home .container { max-width: 1280px; padding-left: 36px; padding-right: 36px; }
.experience-home h1, .experience-home h2, .experience-home h3 { font-family: 'Space Grotesk', Inter, sans-serif; }
.experience-home a { text-decoration: none; }
.experience-home :focus-visible { outline: 2px solid var(--moyo-accent); outline-offset: 5px; }
.experience-hero { position: relative; overflow: hidden; background: var(--moyo-hero); }
.experience-grid { position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(var(--moyo-grid) 1px, transparent 1px), linear-gradient(90deg, var(--moyo-grid) 1px, transparent 1px); background-size: 76px 76px; mask-image: linear-gradient(90deg, transparent, #000); }
.experience-hero-layout { display: grid; grid-template-columns: 1.05fr 1fr; gap: 40px; align-items: center; padding: 38px 0 28px; }
.experience-intro { position: relative; z-index: 1; }
.experience-eyebrow { display: flex; align-items: center; gap: 10px; font-size: .75rem; font-weight: 600; letter-spacing: 1.5px; color: var(--moyo-accent); margin: 0 0 28px; line-height: 1.8; }
.status-dot { display: inline-block; flex: 0 0 6px; width: 6px; height: 6px; background: var(--moyo-accent); border-radius: 50%; box-shadow: 0 0 12px var(--moyo-line); }
.experience-intro h1 { font-size: clamp(3rem, 4.8vw, 4.25rem); font-weight: 500; line-height: 1.09; letter-spacing: -2.8px; margin: 0 0 28px; }
.experience-intro h1 span { display: inline-block; color: var(--moyo-accent); }
.experience-lead { font-size: 1.125rem; line-height: 1.9; max-width: 490px; color: var(--moyo-muted); margin-bottom: 33px; }
.experience-actions { display: flex; align-items: center; gap: 23px; flex-wrap: wrap; }
.experience-button { display: inline-flex; align-items: center; justify-content: center; gap: 20px; min-height: 53px; padding: 14px 22px; border-radius: 7px; font-size: .9375rem; font-weight: 700; line-height: 1.5; transition: background .2s, transform .2s, box-shadow .2s; }
.experience-button-primary { background: var(--moyo-accent); color: var(--moyo-button-text); border: 1px solid var(--moyo-accent); }
.experience-button-primary:hover { background: var(--moyo-accent-hover); color: var(--moyo-button-text); transform: translateY(-2px); box-shadow: 0 5px 25px var(--moyo-line); }
.experience-text-link { display: inline-flex; align-items: center; gap: 15px; font-size: .9375rem; color: var(--moyo-text); padding: 12px 0; }
.experience-text-link:hover { color: var(--moyo-accent); }
.experience-text-link span { font-size: 1.25rem; }
.experience-signature { display: flex; align-items: center; gap: 12px; margin-top: 26px; color: var(--moyo-faint); font-size: .75rem; }
.signature-line { width: 28px; height: 1px; background: var(--moyo-accent); }
.signature-coordinate { margin-left: auto; font-size: .75rem; letter-spacing: 1px; padding-right: 20px; }
.experience-showcase { --category-accent: var(--moyo-accent); min-width: 0; position: relative; }
.experience-showcase[data-category="software-personalizado"] { --category-accent: var(--moyo-software); }
.experience-showcase[data-category="aceites-esenciales"] { --category-accent: var(--moyo-wellness); }
.experience-showcase[data-category="figuras-yeso"] { --category-accent: var(--moyo-craft); }
.brand-visual { position: relative; width: min(100%, 340px); margin: 0 auto 18px; transform: perspective(1000px) rotateX(var(--tilt-y, 0deg)) rotateY(var(--tilt-x, 0deg)); transition: transform .4s ease-out; }
.brand-visual::before { content: ''; position: absolute; inset: 12%; border-radius: 50%; background: var(--moyo-accent); opacity: .14; filter: blur(55px); z-index: -1; }
.brand-visual img { display: block; width: 100%; height: auto; border: 1px solid var(--moyo-line); border-radius: 22px; box-shadow: var(--moyo-shadow); }
.category-preview { display: grid; grid-template-columns: 37px 1fr 30px; gap: 13px; align-items: center; padding: 19px; border: 1px solid var(--moyo-line); border-radius: 11px; background: var(--moyo-panel); min-height: 125px; }
.category-preview-icon { display: grid; place-items: center; width: 37px; height: 42px; border: 1px solid var(--moyo-line); border-radius: 9px; color: var(--category-accent); }
.category-preview-kicker { color: var(--moyo-faint); font-size: .75rem; letter-spacing: 1.8px; }
.category-preview h2 { font-size: 1.125rem; margin: 4px 0 5px; color: var(--moyo-text); }
.category-preview p { font-size: .9375rem; line-height: 1.65; color: var(--moyo-muted); margin: 0; }
.category-preview > a { color: var(--category-accent); border-radius: 50%; display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid var(--moyo-line); font-size: .875rem; }
.category-preview > a:hover { background: var(--moyo-accent-soft); }
.category-selectors { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px; margin-top: 15px; }
.category-selector { background: transparent; color: var(--moyo-muted); padding: 8px 10px; border-radius: 5px; border: 1px solid transparent; font-size: .8125rem; display: flex; align-items: center; gap: 6px; min-width: 0; transition: color .2s, border-color .2s, background .2s; }
.category-selector i { flex-shrink: 0; }
.category-selector span { min-width: 0; }
.category-selector[aria-pressed="true"] { color: var(--category-accent); border-color: var(--moyo-line); background: var(--moyo-accent-soft); }
.category-selector:hover { color: var(--moyo-accent); background: var(--moyo-accent-soft); }
.experience-hero-bottom { display: flex; justify-content: space-between; gap: 20px; border-top: 1px solid var(--moyo-line); padding: 23px 0; color: var(--moyo-faint); font-size: .75rem; letter-spacing: 1.6px; }
.experience-hero-bottom a { color: var(--moyo-muted); }
.experience-hero-bottom i { margin-left: 10px; color: var(--moyo-accent); }
.experience-categories, .experience-featured, .experience-how { padding: 64px 0; }
.experience-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 32px; margin-bottom: 42px; }
.experience-section-heading .experience-eyebrow { margin-bottom: 17px; }
.experience-section-heading h2 { font-size: clamp(1.9rem, 3.1vw, 2.65rem); line-height: 1.2; font-weight: 500; letter-spacing: -1.6px; margin: 0; }
.experience-section-heading h2 span { color: var(--moyo-muted); }
.experience-section-heading > p { color: var(--moyo-muted); font-size: 1rem; line-height: 1.8; margin: 0 0 3px; }
.categories-mosaic { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.category-tile { --tile-accent: var(--moyo-digital); display: grid; grid-template-columns: minmax(0, 1fr) 136px; grid-template-rows: auto 1fr; gap: 14px 20px; min-height: 220px; padding: 22px; border-radius: 14px; position: relative; overflow: hidden; color: var(--moyo-text); background: var(--moyo-panel); border: 1px solid var(--moyo-line); transition: border-color .25s, transform .25s; }
.category-tile:nth-child(4n + 2), .category-tile:nth-child(4n + 3) { background-color: var(--moyo-panel); }
.category-tile-software-personalizado { --tile-accent: var(--moyo-software); }
.category-tile-aceites-esenciales { --tile-accent: var(--moyo-wellness); }
.category-tile-figuras-yeso { --tile-accent: var(--moyo-craft); }
.category-tile:hover { color: var(--moyo-text); border-color: var(--tile-accent); transform: translateY(-4px); }
.category-tile-top { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 8px; position: relative; z-index: 1; color: var(--moyo-faint); font-size: .75rem; letter-spacing: .8px; text-transform: uppercase; }
.category-tile-arrow { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--moyo-line); border-radius: 50%; color: var(--tile-accent); font-size: 1.1rem; }
.category-media { grid-column: 2; grid-row: 2; align-self: center; position: relative; z-index: 1; aspect-ratio: 1; display: grid; place-items: center; padding: 8px; background: var(--moyo-panel-alt); border: 1px solid var(--moyo-line); border-radius: 12px; overflow: hidden; }
.category-media img { width: 100%; height: 100%; object-fit: contain; min-height: 0; transition: transform .3s; }
.category-media > i { color: var(--tile-accent); font-size: 2rem; }
.category-tile:hover .category-media img { transform: scale(1.035); }
.category-tile-content { grid-column: 1; grid-row: 2; align-self: center; position: relative; z-index: 1; min-width: 0; }
.category-tile h3 { font-size: 1.4rem; line-height: 1.25; letter-spacing: -.5px; margin: 0 0 8px; }
.category-tile p { font-size: .9375rem; line-height: 1.55; color: var(--moyo-muted); margin-bottom: 12px; }
.category-tile-cta { display: inline-flex; gap: 12px; align-items: center; color: var(--tile-accent); font-size: .875rem; font-weight: 600; }
.category-tile-cta i { font-size: .75rem; transition: transform .2s; }
.category-tile:hover .category-tile-cta i { transform: translateX(5px); }
.experience-featured { background: var(--moyo-panel-alt); color: var(--moyo-text); }
.experience-featured .experience-eyebrow { color: var(--moyo-accent); }
.experience-featured .experience-section-heading h2 span { color: var(--moyo-muted); }
.experience-featured .experience-text-link { color: var(--moyo-text); border-bottom: 1px solid var(--moyo-line); }
.experience-product-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 20px; }
.discovery-card { min-width: 0; display: flex; flex-direction: column; background: var(--moyo-panel); border: 1px solid var(--moyo-line); border-radius: 12px; overflow: hidden; }
.discovery-image { display: block; position: relative; background: var(--moyo-panel-alt); border-bottom: 1px solid var(--moyo-line); padding: 10px; overflow: hidden; aspect-ratio: 1; }
.discovery-image img { width: 100%; height: 100%; object-fit: contain; transition: transform .5s; mix-blend-mode: normal; }
.discovery-image:hover img { transform: scale(1.04); }
.discovery-image-arrow { position: absolute; right: 12px; top: 12px; display: grid; place-items: center; background: #fffd; border: 1px solid #fffa; width: 30px; height: 30px; border-radius: 50%; color: #193d39; }
.discovery-discount { position: absolute; left: 12px; top: 12px; font-size: .75rem; font-weight: 600; padding: 5px 9px; background: #192c25; color: #e0ecda; border-radius: 4px; }
.discovery-body { padding: 14px; display: flex; flex-direction: column; flex: 1; }
.discovery-body h3 { font-size: 1.0625rem; line-height: 1.4; margin: 0 0 12px; font-weight: 600; min-height: 2.8em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.discovery-body h3 a { color: inherit; }
.discovery-body h3 a:hover { text-decoration: underline; }
.discovery-bottom { display: grid; gap: 12px; margin-top: auto; }
.discovery-price { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; font-size: 1.35rem; font-weight: 700; color: var(--moyo-accent); }
.discovery-price del { font-size: .875rem; color: var(--moyo-faint); font-weight: 400; }
.discovery-add { border-radius: 8px; border: 1px solid var(--moyo-accent); background: var(--moyo-accent); color: var(--moyo-button-text); width: 100%; min-height: 44px; padding: 10px 8px; display: flex; align-items: center; justify-content: center; gap: 8px; font: 600 .875rem/1.3 Inter, sans-serif; transition: background .2s, color .2s; }
.discovery-add:hover { background: var(--moyo-accent-hover); color: var(--moyo-button-text); border-color: var(--moyo-accent-hover); }
.discovery-add:disabled { opacity: .6; cursor: wait; }
.experience-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--moyo-line); }
.experience-steps article { position: relative; padding: 35px 36px 5px 0; }
.experience-steps article + article { border-left: 1px solid var(--moyo-line); padding-left: 36px; }
.experience-steps article > span { position: absolute; right: 24px; top: 25px; font: 400 3rem 'Space Grotesk', sans-serif; color: var(--moyo-number); }
.experience-steps article > i { color: var(--moyo-accent); font-size: 1.2rem; margin-bottom: 24px; }
.experience-steps h3 { font-size: 1.1rem; margin-bottom: 14px; }
.experience-steps p { font-size: 1rem; color: var(--moyo-muted); line-height: 1.9; margin-bottom: 0; }
.experience-contact { padding-bottom: 32px; }
.experience-contact-panel { display: flex; justify-content: space-between; align-items: center; gap: 40px; padding: 54px; border: 1px solid var(--moyo-line); border-radius: 15px; background: var(--moyo-contact); overflow: hidden; position: relative; }
.experience-contact-panel > div, .experience-contact-panel > a { position: relative; z-index: 1; }
.experience-contact-panel .experience-eyebrow { font-size: .75rem; letter-spacing: 1.4px; }
.experience-contact-panel h2 { font-size: clamp(2.5rem, 4.4vw, 4rem); line-height: 1.05; letter-spacing: -2px; margin-bottom: 24px; }
.experience-contact-panel h2 span { color: var(--moyo-accent); }
.experience-contact-panel p:not(.experience-eyebrow) { font-size: 1rem; color: var(--moyo-muted); line-height: 1.8; margin-bottom: 0; }
.experience-contact-panel .experience-button { flex-shrink: 0; }
.contact-orbit { position: absolute; width: 430px; height: 430px; right: -80px; top: -50px; border: 1px solid var(--moyo-line); border-radius: 50%; box-shadow: 0 0 0 60px var(--moyo-grid), 0 0 0 120px var(--moyo-grid); }
.experience-home .notification { color: #142334; }
/* Catalog surfaces follow the same palette, while keeping their existing behavior. */
body.catalog-page, body.product-page { background: var(--moyo-panel-alt); }
.catalog-page::before, .catalog-page::after, .product-page::before, .product-page::after { display: none; }
.catalog-page .hero-section { min-height: 0; padding: 78px 0 65px; }
.catalog-page .hero-title { background: none; -webkit-text-fill-color: initial; color: var(--moyo-text); font-size: clamp(2rem, 4vw, 3.2rem); font-weight: 600; letter-spacing: -1.5px; text-shadow: none; }
.catalog-page .hero-title .text-warning { color: var(--moyo-accent) !important; }
.catalog-page .catalog-search-form .input-group { flex-wrap: nowrap; border: 1px solid var(--moyo-line); border-radius: 9px; overflow: hidden; }
.catalog-page .catalog-search-form input { min-width: 0; background: var(--moyo-panel); border-radius: 0 !important; padding: 14px 18px !important; font-size: 1rem; box-shadow: none !important; }
.catalog-page .catalog-search-form button { border-radius: 0 !important; background: var(--moyo-accent); color: var(--moyo-button-text); border: 0; font-size: .875rem; box-shadow: none; }
.catalog-page .section { background: var(--moyo-panel-alt) !important; padding-top: 44px; border-radius: 0; }
.catalog-page .section::before, .catalog-page .section::after { display: none; }
.catalog-page [data-aos] { opacity: 1 !important; transform: none !important; transition: none !important; }
.catalog-page .catalog-filter-shell .btn { box-shadow: none; border-radius: 6px; font-size: .875rem; }
.catalog-page .catalog-filter-shell h5 { font-size: 1rem; }
.catalog-page .hero-section, .product-page .hero-section { background: var(--moyo-hero); border-radius: 0; box-shadow: none; }
.catalog-page .hero-section::before, .catalog-page .hero-section::after, .catalog-page .particles { display: none; }
.catalog-page .product-card, .product-page .product-card { border-radius: 12px; box-shadow: 0 3px 12px #0a16200a; backdrop-filter: none; }
.catalog-page .product-card, .product-page .product-card, body.dark-mode .product-card { background: var(--moyo-panel); color: var(--moyo-text); border-color: var(--moyo-line); }
.product-card .card-title { color: var(--moyo-text); }
.product-card .card-text { color: var(--moyo-muted); }
.catalog-filter-shell { background: var(--moyo-panel) !important; color: var(--moyo-text); }
.catalog-page .catalog-category-badge { background: var(--moyo-accent-soft); color: var(--moyo-text); border: 1px solid var(--moyo-line); opacity: 1; white-space: normal; line-height: 1.4; }
.catalog-page #grid-view.active, .catalog-page #list-view.active { background: var(--moyo-accent); border-color: var(--moyo-accent); color: var(--moyo-button-text); box-shadow: none; }
.catalog-page #grid-view, .catalog-page #list-view { min-height: 44px; transform: none !important; box-shadow: none; }
.catalog-page .product-card::before, .catalog-page .product-card::after { display: none; }
.catalog-page .product-overlay { background: #0c1b1c66; }
.catalog-page .product-image { background: var(--moyo-panel-alt); padding: 8px; height: 176px; flex-shrink: 0; }
.catalog-page .product-card .card-body { padding: 12px; gap: 8px; }
.catalog-page .product-card .card-body > .mb-2 { margin-bottom: 0 !important; }
.catalog-page .product-card .catalog-category-badge { font-size: .75rem; padding: 4px 8px; }
.catalog-page .product-card .card-title { font-size: 1rem; line-height: 1.35; min-height: 2.7em; margin-bottom: 0 !important; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.catalog-page .product-card .card-title a { color: inherit; text-decoration: none; }
.catalog-page .product-card .card-title a:hover { color: var(--moyo-accent); text-decoration: underline; text-underline-offset: 3px; }
.catalog-page .catalog-card-price .price { font-size: 1.2rem; line-height: 1.4; }
.catalog-page .catalog-card-actions { display: grid; gap: 6px; margin-top: auto; }
.catalog-page .catalog-card-actions .btn { min-height: 40px; padding: 8px 10px; font-size: .875rem; line-height: 1.3; white-space: nowrap; }
.catalog-page .catalog-card-actions > .d-flex { gap: 6px !important; }
.catalog-page .catalog-card-actions .btn-outline-primary { width: 44px; flex: 0 0 44px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
.catalog-page .catalog-card-actions .btn-outline-primary i { margin: 0 !important; }
@media (max-width: 575px) {
    .catalog-page .product-image { height: 136px; padding: 6px; }
    .catalog-page .product-card .card-body { padding: 10px; gap: 7px; }
    .catalog-page .product-card .card-title { font-size: .875rem; }
    .catalog-page .catalog-card-price .price { font-size: 1.1rem; }
    .catalog-page .catalog-card-actions .btn { min-height: 44px; padding: 8px 6px; font-size: .8125rem; }
    .catalog-page .catalog-whatsapp-label { display: none; }
    .catalog-page .catalog-card-actions .btn-success i { margin: 0 !important; font-size: 1rem; }
}
.catalog-page .product-card:hover .product-image img { transform: scale(1.04); }
.catalog-page .catalog-filter-shell { box-shadow: none !important; border-radius: 12px; }
@media (max-width: 1199px) {
    .experience-hero-layout { gap: 26px; }
    .experience-intro h1 { letter-spacing: -2.5px; }
    .experience-actions { gap: 14px; }
    .experience-showcase .category-selector { font-size: .8125rem; padding: 7px; }
    .category-tile { grid-template-columns: minmax(0, 1fr) 112px; gap: 12px; padding: 20px; }
}
@media (max-width: 991px) {
    .navbar .theme-label { display: none; }
    .navbar [data-theme-toggle] { width: 36px; padding: 0; }
    .experience-home .container { padding-left: 28px; padding-right: 28px; }
    .experience-hero-layout { grid-template-columns: 1fr; padding-top: 34px; gap: 26px; }
    .experience-intro { max-width: 600px; }
    .experience-intro h1 { font-size: clamp(3rem, 7.5vw, 4.5rem); }
    .experience-showcase { width: 100%; max-width: 560px; margin: 0 auto; }
    .experience-signature { margin-top: 32px; }
    .signature-coordinate { margin-left: 30px; }
    .experience-hero-bottom > span:last-child { display: none; }
    .experience-categories, .experience-featured, .experience-how { padding: 52px 0; }
    .categories-mosaic { grid-template-columns: 1fr 1fr; }
    .category-tile { padding: 18px; grid-template-columns: minmax(0, 1fr) 88px; }
    .category-tile h3 { font-size: 1.25rem; }
    .experience-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .experience-contact-panel { padding: 35px; flex-wrap: wrap; }
    .experience-steps article { padding-right: 20px; }
    .experience-steps article + article { padding-left: 20px; }
}
@media (max-width: 575px) {
    .brand-visual { max-width: 260px; margin-bottom: 16px; }
    .brand-visual img { border-radius: 18px; }
    .experience-home .container { padding-left: 21px; padding-right: 21px; }
    .experience-home .navbar-brand { font-size: 1.15rem; }
    .experience-intro h1 { font-size: clamp(2.7rem, 10.7vw, 3.6rem); letter-spacing: -2px; line-height: 1.12; }
    .experience-eyebrow { font-size: .75rem; letter-spacing: 1.2px; margin-bottom: 16px; }
    .experience-hero-layout { padding-top: 26px; padding-bottom: 22px; gap: 20px; }
    .experience-lead { font-size: 1rem; line-height: 1.75; margin-bottom: 20px; }
    .experience-actions { align-items: center; flex-direction: row; gap: 12px; }
    .experience-actions .experience-button { padding: 12px; gap: 12px; }
    .experience-actions .experience-text-link { font-size: .875rem; gap: 8px; }
    .experience-button { font-size: .875rem; min-height: 51px; }
    .experience-signature { display: none; }
    .signature-coordinate { display: none; }
    .category-preview { padding: 12px; gap: 10px; min-height: 0; }
    .category-preview p { display: none; }
    .category-preview h2 { font-size: 1rem; }
    .category-preview p { font-size: .9375rem; }
    .category-selectors { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
    .category-selector { min-height: 42px; justify-content: center; }
    .experience-hero-bottom { display: none; }
    .experience-hero-bottom > span { max-width: 140px; }
    .experience-categories, .experience-featured, .experience-how { padding: 30px 0; }
    .experience-section-heading { display: block; margin-bottom: 20px; }
    .experience-section-heading h2 { font-size: 1.8rem; letter-spacing: -.8px; }
    .experience-section-heading > p, .experience-section-heading > a { margin-top: 12px; }
    .experience-section-heading > p { font-size: .9375rem; line-height: 1.6; }
    .categories-mosaic { grid-template-columns: 1fr; gap: 10px; }
    .category-tile { min-height: 0; padding: 16px; grid-template-columns: minmax(0, 1fr) 88px; grid-template-rows: 1fr; gap: 12px; }
    .category-tile-top { display: none; }
    .category-tile-content, .category-media { grid-row: 1; }
    .category-media { padding: 5px; }
    .category-tile h3 { font-size: 1.125rem; letter-spacing: -.3px; margin-bottom: 6px; }
    .category-tile p { font-size: .875rem; line-height: 1.5; margin-bottom: 8px; }
    .category-tile-cta { font-size: .8125rem; gap: 8px; }
    .experience-product-grid { gap: 14px 12px; }
    .discovery-body { padding: 12px 10px; }
    .discovery-body h3 { font-size: .9375rem; margin-bottom: 10px; }
    .discovery-price { font-size: 1.2rem; gap: 4px; }
    .discovery-price del { font-size: .75rem; }
    .discovery-add { font-size: .8125rem; }
    .discovery-image-arrow { width: 27px; height: 27px; right: 8px; top: 8px; font-size: .875rem; }
    .discovery-discount { left: 8px; top: 8px; padding: 4px 6px; font-size: .75rem; }
    .experience-steps { grid-template-columns: 1fr; }
    .experience-steps article, .experience-steps article + article { padding: 16px 0 16px 40px; border-left: 0; border-bottom: 1px solid var(--moyo-line); }
    .experience-steps article > i { position: absolute; top: 18px; left: 0; margin: 0; font-size: 1.1rem; }
    .experience-steps article > span { display: none; }
    .experience-steps h3 { font-size: 1rem; margin-bottom: 6px; }
    .experience-steps p { max-width: none; font-size: .9375rem; line-height: 1.6; }
    .experience-contact { padding-bottom: 24px; }
    .experience-contact-panel { padding: 24px 20px; gap: 20px; }
    .experience-contact-panel .experience-eyebrow { font-size: .75rem; letter-spacing: 1px; align-items: baseline; }
    .experience-contact-panel h2 { font-size: 2.35rem; letter-spacing: -1px; margin-bottom: 16px; }
    .experience-contact-panel p:not(.experience-eyebrow) { font-size: .9375rem; line-height: 1.65; }
    .experience-contact-panel .experience-button { width: 100%; gap: 13px; }
}
@media (min-width: 768px) and (max-width: 991px) {
    .experience-hero-layout { grid-template-columns: 1fr 1fr; gap: 24px; }
    .experience-intro h1 { font-size: clamp(2.5rem, 5vw, 3rem); }
    .experience-lead { font-size: 1rem; }
    .brand-visual { max-width: 300px; }
    .category-preview { min-height: 0; }
    .category-preview p { display: none; }
    .category-selectors { display: grid; grid-template-columns: 1fr 1fr; }
}
@media (prefers-reduced-motion: reduce) {
    .brand-visual { transform: none !important; }
    .experience-home *, .experience-home *::before, .experience-home *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* Product-first motion: decorative layers never intercept a link or a control. */
.reading-progress { position: fixed; inset: 0 0 auto; height: 3px; z-index: 1100; pointer-events: none; }
.reading-progress span { display: block; height: 100%; background: var(--moyo-accent); transform: scaleX(0); transform-origin: left; }
.experience-home .experience-grid { animation: grid-drift 35s linear infinite; }
.brand-visual { animation: brand-hover 7s ease-in-out infinite; }
.brand-visual::after { content: ''; pointer-events: none; position: absolute; inset: -8px; border: 1px solid var(--moyo-line); border-radius: 28px; border-top-color: var(--moyo-accent); border-bottom-color: var(--moyo-accent); opacity: .45; }
.brand-chip { position: absolute; z-index: 2; display: inline-flex; gap: 9px; align-items: center; padding: 12px 16px; border: 1px solid var(--moyo-line); border-radius: 12px; font-size: .8125rem; background: var(--moyo-nav); box-shadow: var(--moyo-shadow); color: var(--moyo-text); backdrop-filter: blur(14px); pointer-events: none; }
.brand-chip i { color: var(--moyo-accent); }
.brand-chip-top { left: -30px; top: 30px; animation: brand-hover 8s ease-in-out infinite reverse; }
.brand-chip-bottom { right: -28px; bottom: 26px; animation: brand-hover 6s ease-in-out infinite; }
.brand-scan { position: absolute; z-index: 1; inset: 0; overflow: hidden; border-radius: 22px; pointer-events: none; }
.brand-scan::after { content: ''; position: absolute; top: -15%; left: 0; width: 100%; height: 12%; background: linear-gradient(transparent, #b7f1d91a, transparent); animation: brand-scan 9s linear infinite; }
.category-tile::after { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: 0; background: radial-gradient(280px circle at var(--pointer-x, 50%) var(--pointer-y, 50%), var(--moyo-accent-soft), transparent 75%); transition: opacity .3s; }
.category-tile:hover::after { opacity: .65; }
.category-preview.preview-changing { animation: preview-change .3s ease-out; }
.reveal-enter { animation: content-enter .6s both cubic-bezier(.2, .6, .3, 1); }
.product-spotlight { padding: 24px 0 64px; }
.spotlight-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 19px; }
.spotlight-heading .experience-eyebrow { margin: 0; }
.spotlight-heading > a { font-size: .9375rem; color: var(--moyo-muted); text-decoration: none; }
.spotlight-heading > a span { margin-left: 14px; color: var(--moyo-accent); }
.spotlight-frame { border: 1px solid var(--moyo-line); border-radius: 22px; overflow: hidden; background: var(--moyo-panel); box-shadow: var(--moyo-shadow); }
.spotlight-slide { display: grid; grid-template-columns: 1fr 1.15fr; min-height: 360px; }
.spotlight-slide[hidden], .spotlight-controls[hidden] { display: none; }
.spotlight-slide:not([hidden]) .spotlight-copy { animation: content-enter .4s ease-out; }
.spotlight-image { position: relative; display: grid; place-items: center; overflow: hidden; min-height: 350px; background: var(--moyo-panel-alt); isolation: isolate; }
.spotlight-image-grid { position: absolute; inset: 0; background-image: linear-gradient(var(--moyo-line) 1px, transparent 1px), linear-gradient(90deg, var(--moyo-line) 1px, transparent 1px); background-size: 45px 45px; opacity: .4; mask-image: radial-gradient(circle, #000, transparent 70%); }
.spotlight-image::after { content: ''; position: absolute; width: 300px; height: 300px; border: 1px solid var(--moyo-line); border-radius: 50%; box-shadow: 0 0 0 28px var(--moyo-grid), 0 0 0 56px var(--moyo-grid); z-index: -1; }
.spotlight-image img { position: relative; z-index: 1; width: 76%; height: 300px; object-fit: contain; border-radius: 12px; transition: transform .5s ease; filter: drop-shadow(0 16px 20px #102d2815); }
.spotlight-image:hover img { transform: translateY(-5px) scale(1.035); }
.spotlight-image-tag { position: absolute; bottom: 18px; left: 22px; color: var(--moyo-faint); font-size: .75rem; letter-spacing: 1.4px; }
.spotlight-image-tag i { margin-right: 8px; }
.spotlight-copy { padding: 35px 44px 25px; align-self: center; }
.spotlight-badge { display: inline-flex; gap: 8px; align-items: center; background: var(--moyo-accent-soft); color: var(--moyo-accent); border: 1px solid var(--moyo-line); padding: 7px 11px; border-radius: 24px; font-size: .8125rem; margin-bottom: 19px; }
.spotlight-category { display: block; font-size: .75rem; letter-spacing: 1.3px; color: var(--moyo-muted); text-transform: uppercase; margin-bottom: 8px; }
.spotlight-copy h2 { font: 500 clamp(1.4rem, 2.7vw, 2.3rem)/1.2 'Space Grotesk', sans-serif; letter-spacing: -1px; margin-bottom: 13px; overflow-wrap: anywhere; }
.spotlight-copy h2 a { color: var(--moyo-text); text-decoration: none; }
.spotlight-description { color: var(--moyo-muted); font-size: 1rem; line-height: 1.65; margin-bottom: 16px; }
.spotlight-price { display: flex; align-items: center; gap: 12px; color: var(--moyo-text); font: 500 1.9rem 'Space Grotesk', sans-serif; margin-bottom: 19px; }
.spotlight-price del { font: 400 .875rem Inter, sans-serif; color: var(--moyo-faint); }
.spotlight-price small { font: 600 .75rem Inter, sans-serif; background: var(--moyo-accent-soft); color: var(--moyo-accent); padding: 6px 8px; border-radius: 5px; }
.spotlight-actions { display: flex; gap: 12px; align-items: center; }
.spotlight-cart { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 9px; border: 1px solid var(--moyo-line); background: var(--moyo-panel); color: var(--moyo-accent); transition: background .2s; }
.spotlight-cart:hover { background: var(--moyo-accent-soft); }
.spotlight-cart:disabled { opacity: .65; }
.spotlight-note { font-size: .75rem; color: var(--moyo-faint); margin: 14px 0 0; }
.spotlight-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 15px; border-top: 1px solid var(--moyo-line); padding: 12px 24px; }
.spotlight-dots { display: flex; gap: 3px; }
.spotlight-dots button { width: 32px; height: 32px; display: grid; place-items: center; background: transparent; border: 0; padding: 0; border-radius: 50%; }
.spotlight-dots button[hidden] { display: none; }
.spotlight-dots button span { display: block; width: 6px; height: 6px; border-radius: 5px; background: var(--moyo-faint); opacity: .4; transition: width .25s, opacity .25s; }
.spotlight-dots button[aria-current="true"] span { width: 21px; background: var(--moyo-accent); opacity: 1; }
.spotlight-navigation { display: flex; align-items: center; gap: 8px; }
.spotlight-navigation > span { font-size: .75rem; color: var(--moyo-faint); margin-right: 12px; font-variant-numeric: tabular-nums; }
.spotlight-navigation button { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--moyo-line); border-radius: 50%; background: var(--moyo-panel); color: var(--moyo-accent); font-size: .75rem; }
.spotlight-navigation button[hidden] { display: none; }
.spotlight-navigation button:hover { background: var(--moyo-accent-soft); }
@keyframes grid-drift { to { background-position: 76px 76px; } }
@keyframes brand-hover { 0%, 100% { translate: 0 0; } 50% { translate: 0 -7px; } }
@keyframes brand-scan { 0%, 20% { translate: 0 0; } 80%, 100% { translate: 0 1000%; } }
@keyframes content-enter { from { opacity: .15; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
@keyframes preview-change { from { opacity: .5; translate: 0 5px; } to { opacity: 1; translate: 0 0; } }
@media (max-width: 991px) {
    .spotlight-copy { padding: 28px; }
    .spotlight-image img { height: 260px; }
    .spotlight-image { min-height: 300px; }
}
@media (max-width: 575px) {
    .brand-chip { display: none; }
    .brand-chip { padding: 9px 11px; font-size: .75rem; }
    .brand-chip-top { left: -6px; top: 21px; }
    .brand-chip-bottom { right: -5px; bottom: 21px; }
    .product-spotlight { padding-top: 16px; padding-bottom: 40px; }
    .spotlight-frame { border-radius: 16px; }
    .spotlight-slide { grid-template-columns: 1fr; }
    .spotlight-image { min-height: 255px; }
    .spotlight-image img { height: 215px; width: 78%; }
    .spotlight-image::after { width: 200px; height: 200px; }
    .spotlight-image-tag { left: 17px; bottom: 12px; font-size: .75rem; }
    .spotlight-copy { padding: 24px; }
    .spotlight-copy h2 { font-size: 1.7rem; }
    .spotlight-badge { margin-bottom: 15px; }
    .spotlight-controls { padding: 12px; gap: 9px; display: grid; grid-template-columns: 1fr; }
    .spotlight-dots { justify-content: center; flex-wrap: wrap; }
    .spotlight-navigation { justify-content: center; }
    .spotlight-navigation { gap: 5px; }
    .spotlight-navigation > span { margin-right: 4px; font-size: .75rem; }
    .spotlight-dots button { width: 26px; }
}
@media (prefers-reduced-motion: reduce) {
    .experience-home .experience-grid, .brand-visual, .brand-chip, .brand-scan::after, .reveal-enter, .spotlight-slide:not([hidden]) .spotlight-copy { animation: none !important; translate: none !important; }
    .brand-scan { display: none; }
}

.product-promotion { position: fixed; z-index: 1040; bottom: 22px; left: 22px; width: 360px; border: 1px solid var(--moyo-line); border-left: 3px solid var(--moyo-accent); border-radius: 14px; background: var(--moyo-panel); color: var(--moyo-text); box-shadow: 0 12px 45px #102d2833; animation: promotion-enter .3s ease-out; }
.product-promotion[hidden] { display: none; }
.product-promotion-link { padding: 16px 40px 16px 12px; display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; align-items: center; text-decoration: none; color: inherit; border-radius: inherit; }
.product-promotion-link:hover { color: inherit; background: var(--moyo-grid); }
.product-promotion-link > img { width: 64px; height: 80px; padding: 4px; object-fit: contain; border: 1px solid var(--moyo-line); border-radius: 8px; background: var(--moyo-panel-alt); }
.product-promotion-copy { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.product-promotion-status { display: flex; align-items: center; gap: 6px; color: var(--moyo-accent); font-size: .75rem; font-weight: 600; }
.product-promotion-copy strong { font-size: .9375rem; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.product-promotion-bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 4px 10px; margin-top: 3px; }
.product-promotion-price { color: var(--moyo-accent); font-size: 1.125rem; font-weight: 700; }
.product-promotion-cta { color: var(--moyo-accent); font-size: .75rem; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.product-promotion-note { font-size: .75rem; color: var(--moyo-muted); line-height: 1.5; }
.product-promotion-close { position: absolute; z-index: 1; top: 0; right: 0; width: 44px; height: 44px; display: grid; place-items: center; border: 0; background: transparent; color: var(--moyo-muted); border-radius: 12px; font-size: .875rem; cursor: pointer; }
.product-promotion-close:hover { background: var(--moyo-accent-soft); color: var(--moyo-text); }
@keyframes promotion-enter { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 575px) {
    .product-promotion { left: 12px; bottom: calc(154px + env(safe-area-inset-bottom, 0px)); width: calc(100% - 24px); max-width: 352px; }
}
@media (prefers-reduced-motion: reduce) {
    .product-promotion { animation: none; }
}
