/** Shopify CDN: Minification failed Line 957:8 Unexpected "{" Line 958:15 Expected ":" Line 1042:12 Unexpected "{" Line 1043:19 Expected ":" Line 1048:20 Expected identifier but found whitespace Line 1049:16 Unexpected "{" Line 1050:23 Expected ":" Line 1056:18 Expected identifier but found whitespace Line 1057:16 Unexpected "{" Line 1058:23 Expected ":" ... and 77 more hidden warnings **/ /* ========================================================================== MAIN CSS — Base para tema Shopify (main.css.liquid) - Reset moderno - Variables de color/typografía - Poppins (body, p, h4, a, span, buttons) / Antonio (h1–h3) - Links y foco accesibles - Dark mode y reduced motion - Utilidades (container, grid, helpers) ========================================================================== */ /* ----------------------------- 0) Tipografías ----------------------------- */ /* Las fuentes se cargan en theme.liquid con Google Fonts. Aquí solo referenciamos por variables. */ :root { --font-body: 'Poppins', -apple-system, Segoe UI, Roboto, Helvetica, Arial, system-ui, sans-serif; --font-heading: 'Antonio', -apple-system, Segoe UI, Roboto, Helvetica, Arial, system-ui, sans-serif; /* Escala tipográfica (fluida con clamp) */ --fs-300: clamp(0.88rem, 0.84rem + 0.20vw, 0.95rem); --fs-400: clamp(1.00rem, 0.96rem + 0.30vw, 1.125rem); --fs-500: clamp(1.15rem, 1.05rem + 0.60vw, 1.35rem); --fs-600: clamp(1.35rem, 1.15rem + 1.00vw, 1.75rem); --fs-700: clamp(1.62rem, 1.35rem + 1.40vw, 2.25rem); --fs-800: clamp(1.95rem, 1.60rem + 2.00vw, 3.00rem); --lh-tight: 1.15; --lh-base: 1.55; /* Colores base */ --bg: #ffffff; --text: #111318; --muted: #5f6572; /* Link y foco */ --link: #0e63ff; --link-hover: #0a4bd1; --focus: #8ab4ff; /* Bordes y sombras */ --border: #e6e8eb; --shadow-sm: 0 1px 2px rgba(0, 0, 0, .06); --shadow-md: 0 6px 16px rgba(0, 0, 0, .08); /* Layout */ --container-w: 1200px; --gutter: 1rem; --radius: 12px; } /* Dark mode manual (usa ) */ html[data-theme="dark"] { --bg: #0c0e12; --text: #e8eaed; --muted: #a2a8b4; --link: #8ab4ff; --link-hover: #a9c5ff; --border: #1c212a; --focus: #b8d0ff; } /* Auto-dark si el user prefiere esquema oscuro y no forzaste light */ @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { /* Puedes duplicar las vars de html[data-theme="dark"] si quieres auto-dark. */ } } /* Respeta reduced motion */ @media (prefers-reduced-motion: reduce) { * { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } } /* ----------------------------- 1) Reset / Normalización ----------------------------- */ *, *::before, *::after { box-sizing: border-box; } html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; } body, h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd { margin: 0; } ul[role='list'], ol[role='list'] { list-style: none; padding: 0; margin: 0; } img, picture, video, canvas, svg { display: block; max-width: 100%; } input, button, textarea, select { font: inherit; color: inherit; } button { border: 0; background: none; padding: 0; cursor: pointer; } :focus { outline: none; } :focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; } /* ----------------------------- 2) Base tipográfica y texto ----------------------------- */ body { font-family: var(--font-body); font-size: var(--fs-400); line-height: var(--lh-base); color: var(--text); background: var(--bg); text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* Antonio para headings principales */ h1, h2, h3 { font-family: var(--font-heading); line-height: var(--lh-tight); font-weight: 700; letter-spacing: -0.01em; color: var(--text); } /* Poppins para h4 y texto general */ h4, p, a, span, button, .btn, input, select, textarea { font-family: var(--font-body); } /* Escala rápida */ h1 { font-size: var(--fs-800); } h2 { font-size: var(--fs-700); } h3 { font-size: var(--fs-600); } h4 { font-size: var(--fs-500); font-weight: 600; } h5 { font-size: var(--fs-400); font-weight: 600; } h6 { font-size: var(--fs-300); text-transform: uppercase; letter-spacing: .04em; } p { margin-block: 0.75rem 1rem; } small, .text-sm { font-size: var(--fs-300); color: var(--muted); } strong { font-weight: 700; } em { font-style: italic; } a { color: var(--link); text-decoration: none; transition: color .18s ease, text-decoration-color .18s ease; } a:hover { color: var(--link-hover); text-decoration-color: currentColor; } a:active { opacity: .9; } a:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 4px; } h1 a, h2 a, h3 a { text-decoration: none; } h1 a:hover, h2 a:hover, h3 a:hover { text-decoration: underline; } .container { max-width: var(--container-w); margin-inline: auto; padding-inline: clamp(16px, 3vw, 32px); } .grid { display: grid; gap: clamp(12px, 2vw, 24px); } .grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } @media (max-width: 768px) { .grid--2, .grid--3 { grid-template-columns: 1fr; } } .button, .btn, a.button, a.btn, button.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .7rem 1.1rem; font-family: var(--font-body); font-weight: 600; line-height: 1; border-radius: var(--radius); border: 1px solid var(--border); background: var(--text); color: var(--bg); box-shadow: var(--shadow-sm); text-decoration: none; transition: transform .12s ease, box-shadow .18s ease, background .18s ease, color .18s ease; } .button:hover, .btn:hover { transform: translateY(-1px); box-shadow: var(--shadow-md); } .button:active, .btn:active { transform: translateY(0); box-shadow: var(--shadow-sm); } .btn--secondary { background: transparent; color: var(--text); border-color: var(--border); } label { display: block; font-weight: 600; margin-bottom: .35rem; } input[type="text"], input[type="email"], input[type="tel"], input[type="password"], input[type="search"], select, textarea { width: 100%; padding: .7rem .9rem; border: 1px solid var(--border); border-radius: var(--radius); background: #fff; color: var(--text); transition: border-color .18s ease, box-shadow .18s ease, background .18s ease; } html[data-theme="dark"] input, html[data-theme="dark"] select, html[data-theme="dark"] textarea { background: #0f131a; } input::placeholder, textarea::placeholder { color: var(--muted); } input:focus-visible, select:focus-visible, textarea:focus-visible { border-color: var(--focus); box-shadow: 0 0 0 3px color-mix(in oklab, var(--focus) 25%, transparent); } main { width: 100%; max-width: 1600px; margin: 0 auto; } table { width: 100%; border-collapse: collapse; font-size: var(--fs-300); } th, td { padding: .75rem; border-bottom: 1px solid var(--border); text-align: left; } thead th { font-weight: 700; } .hidden { display: none !important; } .visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 1px, 1px); white-space: nowrap; border: 0; } .center { text-align: center; } .mx-auto { margin-inline: auto; } .mt-0 { margin-top: 0 !important; } .mb-0 { margin-bottom: 0 !important; } .mt-1 { margin-top: .5rem !important; } .mb-1 { margin-bottom: .5rem !important; } .mt-2 { margin-top: 1rem !important; } .mb-2 { margin-bottom: 1rem !important; } .rounded { border-radius: var(--radius); } .shadow-sm { box-shadow: var(--shadow-sm); } .shadow-md { box-shadow: var(--shadow-md); } .font-body { font-family: var(--font-body) !important; } .font-heading { font-family: var(--font-heading) !important; } .rte p { margin-block: .75rem 1rem; } .rte a { text-decoration: underline; } .rte ul, .rte ol { margin: 0 0 1rem 1.25rem; } .rte blockquote { margin: 1rem 0; padding: .75rem 1rem; border-left: 3px solid var(--border); color: var(--muted); } .is-loading { pointer-events: none; opacity: .6; } [disabled] { pointer-events: none; opacity: .5; } /* Fin */ /*header-main-static-v1*/ .header-main-static-v1-1 { width: 90%; margin: 0 auto; border-radius: 50px; position: fixed; left: 50%; transform: translateX(-50%); top: 0; display: flex; justify-content: space-around; background-color: #fffbf0d6; backdrop-filter: blur(15px); padding: 10px 20px; z-index: 1001; margin-top: 15px; } .header-main-static-v1__left { width: 100%; display: flex; flex-direction: row; } .header-main-static-v1__center { width: 100%; display: flex; flex-direction: row; justify-content: center; align-items: center; position: absolute; top: 30px; } .header-main-static-v1__right { width: 100%; display: flex; flex-direction: row; justify-content: flex-end; align-items: center; } .header-main-static-v1__nav { width: 100%; display: flex; justify-content: flex-start; align-items: center; } .header-main-static-v1__nav li { margin-right: 17px; } .header-main-static-v1__nav li a { color: #000000; transition: .3s ease; font-size: 12px; } .header-main-static-v1__nav li a:hover { color: rgb(107, 99, 99); } .header-main-static-v1__logo-link { position: absolute; top: -10; transform: rotate(-5deg); } .header-main-static-v1__logo-link img { width: 130px; filter: drop-shadow(2px 2px 0px white); } .header-main-static-v1__search-icon, .header-main-static-v1__store-icon, .header-main-static-v1__login-icon { width: 25px; margin-left: 20px; transition: .3s ease; } .header-main-static-v1__search-icon:hover, .header-main-static-v1__store-icon:hover, .header-main-static-v1__login-icon:hover { opacity: 50%; } .header-main-static-v1__search-icon { width: 20px; margin-right: 20px; } .header-main-static-v1__search { display: flex; background-color: #ffffff; padding: 0 5px; border-radius: 50px; } .header-main-static-v1__search-input { background: unset !important; border: unset !important; font-size: 13px; } /*header-main-static-v1*/ /*main-section-1-v1*/ /* ===== MAIN SECTION 1 v1 — Desktop-first, escalado 1400x800 (7/4) ===== */ .main-section-1-v1 { position: relative; overflow: hidden; color: var(--ms1v1-text, #111); padding-top: 75px; } /* Altura proporcional al ancho: 1400:800 => 0.571428… Máx 800px, mínimo 480px para no colapsar en pantallas chicas de desktop */ .main-section-1-v1__inner { width: 100%; position: relative; display: flex; align-items: flex-end; height: clamp(438px, calc(100vw * 0.571428), 830px); /* background: red; // debug opcional */ } /* Las 3 capas ocupan todo el alto del inner */ .main-section-1-v1__text, .main-section-1-v1__overlay-media, .main-section-1-v1__slider { width: 100%; height: 98%; position: absolute; inset: 0; } /* Z-index y disposición */ .main-section-1-v1__text { z-index: 3; display: flex; justify-content: space-between; } .main-section-1-v1__overlay-media { z-index: 2; display: flex; align-items: center; justify-content: center; pointer-events: none; } .main-section-1-v1_courses { display: flex; } .main-section-1-v1_courses a img { transition: .3s ease; } .main-section-1-v1_courses a img:hover { filter: brightness(1.2); transform: scale(1.1); } .main-section-1-v1__slider { z-index: 1; overflow: hidden; } /* ================== PRIMER DIV (Títulos y párrafo) ================== */ /* Offsets convertidos a porcentaje de 1400x800 para que escalen */ .main-section-1-v1__head { position: absolute; display: flex; width: 100%; top: 8%; /* 80px de 800 */ justify-content: space-between; padding-inline: 3.57%; /* 50px de 1400 */ gap: 12px; } .aditional-hero { top: 32%; display: flex; flex-direction: column; } .aditional-hero a { display: flex; width: 120px; background-color: #d24614; padding: 10px; margin-top: 5px; border-radius: 5px; align-items: center; justify-content: center; color: #fffbf0; font-size: 15px; font-weight: 700; transition: .3s ease; } .main-section-1-v1__body { position: absolute; display: flex; width: 100%; bottom: 13.75%; /* 110px de 800 */ justify-content: space-between; padding-inline: 3.57%; gap: 12px; } .main-section-1-v1__nav { position: absolute; width: 100%; display: flex; justify-content: flex-end; bottom: 15.5%; /* 20px de 800 */ right: 7.857%; /* 110px de 1400 */ gap: 8px; } /* ================== SEGUNDO DIV (overlay global) ================== */ .main-section-1-v1__overlay-img { width: 100%; height: auto; object-fit: contain; /* evita desborde visual */ } /* ================== TERCER DIV (slider) ================== */ .main-section-1-v1__track { height: 100%; display: flex; transition: transform .6s ease; will-change: transform; } .main-section-1-v1__slide { position: relative; flex: 0 0 100%; height: 100%; overflow: hidden; } .main-section-1-v1__bg { position: absolute; inset: 0; background-size: cover; background-position: center; display: block !important; } /* Marco PNG sobre el fondo */ .main-section-1-v1__frame { position: absolute; inset: 0; display: flex; pointer-events: none; justify-content: center; align-items: center; } .main-section-1-v1__frame-img { width: 100%; height: 100%; object-fit: contain; } /* ================== Controles y navegación ================== */ .main-section-1-v1__ctrl { position: absolute; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; border-radius: 999px; border: 0; background: #fffbf0; box-shadow: 0 2px 10px rgba(0, 0, 0, .15); cursor: pointer; z-index: 5; filter: drop-shadow(2px 4px 0px black); font-size: 25px; transition: .2s ease; } .main-section-1-v1__ctrl:hover { background: #d44817; color: #ffffff; } .main-section-1-v1__ctrl--prev { left: 12px; } .main-section-1-v1__ctrl--next { right: 12px; } .main-section-1-v1__nav-btn { display: grid; place-items: center; width: 75px; height: 36px; border-radius: 999px; border: 0; background: transparent; cursor: pointer; } .main-section-1-v1__nav-thumb { width: 100%; height: 100%; object-fit: cover; border-radius: 999px; filter: brightness(3); transition: .3s ease; } .main-section-1-v1__nav-thumb:hover { filter: brightness(4); transform: scale(1.1); } .main-section-1-v1__nav-dot { width: 8px; height: 8px; border-radius: 999px; background: #111; opacity: .4; display: block; } .main-section-1-v1__nav-btn.is-active .main-section-1-v1__nav-dot { opacity: 1; } /* ================== Tipografía (con clamp para escalar) ================== */ .main-section-1-v1__h1 { width: 100%; margin: 0; line-height: .95; font-weight: 800; font-size: clamp(50px, 7.14vw, 100px); /* escalar vs viewport */ color: #fffbf1; filter: drop-shadow(4px 4px 0px #000000); text-transform: uppercase; display: flex; flex-direction: column; } .main-section-1-v1__h1 span { font-family: 'Antonio', system-ui, sans-serif; font-size: clamp(28px, 3.57vw, 50px); display: block; font-weight: 400; margin-left: 5px; } .main-section-1-v1__h2 { width: 70%; margin: 0; line-height: .95; font-weight: 800; font-size: clamp(50px, 7.14vw, 100px); color: #000; text-transform: uppercase; display: flex; flex-direction: column; } .main-section-1-v1__h2 span { font-family: 'Antonio', system-ui, sans-serif; font-size: clamp(28px, 3.57vw, 50px); margin-left: 5px; } .main-section-1-v1__p { margin: 0; opacity: .9; font-family: 'Antonio', system-ui, sans-serif; font-size: clamp(18px, 2.5vw, 35px); line-height: clamp(40px, 1.9vw, 45px); width: clamp(260px, 30%, 420px); /* ~30% de 1400 ≈ 420px */ } /* ================== Ajustes DOWN (solo max-width) ================== */ /* Nav un poco más adentro en pantallas medianas */ @media (max-width: 1200px) { .main-section-1-v1__nav { right: 5%; } } /* Reducir el ancho del H2 para evitar colisiones cerca de 1024px */ @media (max-width: 1024px) { .main-section-1-v1__h2 { width: 70%; } .main-section-1-v1__overlay-img { width: 100%; } } /* Evitar solapes cerca de 900px */ @media (max-width: 900px) { .main-section-1-v1__h2 { width: 70%; } .main-section-1-v1__p { width: clamp(240px, 36%, 420px); } } /* Modo “pre-mobile”: ocultamos flechas; mantén lo demás hasta que hagas la versión móvil */ @media (max-width: 767px) { .main-section-1-v1__ctrl { display: none; } .main-section-1-v1__overlay-img { width: 100%; } } /*main-section-1-v1*/ /*main-slider-v1.liquid*/ /* ===== Main Slider v1 — Styles ===== */ #main-slider-v1- { { section.id } } .main-slider-v1 { background: var(--ms1v1-bg, transparent); padding-block: var(--ms1v1-padY, 24px); overflow: hidden; } .main-slider-v1__viewport { overflow: hidden; } .main-slider-v1__track { display: flex; align-items: center; gap: var(--ms1v1-gap, 48px); will-change: transform; animation: main-slider-v1-scroll var(--ms1v1-speed, 25s) linear infinite; opacity: var(--ms1v1-opacity, 1); } .main-slider-v1__track.is-reverse { animation-name: main-slider-v1-scroll-rev; } .main-slider-v1__viewport.is-pausable:hover .main-slider-v1__track { animation-play-state: paused; } .main-slider-v1__item { flex: 0 0 auto; height: var(--ms1v1-h, 40px); display: flex; align-items: center; justify-content: center; min-width: max(120px, var(--ms1v1-h, 40px)); } .main-slider-v1__link { display: inline-flex; } .main-slider-v1__img { height: 100%; width: auto; object-fit: contain; filter: grayscale(var(--ms1v1-grayscale)) contrast(1) brightness(1); transition: transform .25s ease, filter .25s ease, opacity .25s ease; pointer-events: none; user-select: none; } .main-slider-v1__link:hover .main-slider-v1__img, .main-slider-v1__item:hover .main-slider-v1__img { transform: scale(1.04); filter: grayscale(0); } /* Animaciones (duplicamos la pista para un loop sin “saltos”) */ @keyframes main-slider-v1-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } } @keyframes main-slider-v1-scroll-rev { from { transform: translateX(-50%); } to { transform: translateX(0); } } /* Responsivo */ @media (max-width: 768px) { #main-slider-v1- { { section.id } } .main-slider-v1 { --ms1v1-gap: { { section.settings.gap | divided_by: 1.4 | round } } ; --ms1v1-h: { { section.settings.item_h | times: 0.8 | round } } ; } } /*main-slider-v1.liquid*/ /*main-titles-v1*/ #main-titles-v1- { { section.id } } { background: var(--bg); color: var(--text); } #main-titles-v1- { { section.id } } .main-titles-v1__inner { width: 100%; padding: var(--padY) 16px; display: grid; place-items: stretch; } @media (max-width: 749px) { #main-titles-v1- { { section.id } } .main-titles-v1__inner { padding: var(--padY-m) 16px; } } #main-titles-v1- { { section.id } } .main-titles-v1__inner--left { justify-items: start; text-align: left; } #main-titles-v1- { { section.id } } .main-titles-v1__inner--center { justify-items: center; text-align: center; } #main-titles-v1- { { section.id } } .main-titles-v1__inner--right { justify-items: end; text-align: right; } #main-titles-v1- { { section.id } } .main-titles-v1__wrap { display: grid; gap: var(--gap); width: 100%; } #main-titles-v1- { { section.id } } .main-titles-v1__wrap--contained { max-width: var(--maxW); } #main-titles-v1- { { section.id } } .main-titles-v1__title { line-height: 1.1; letter-spacing: -0.01em; margin: 0; } /* Tamaños fluidos del título según tag */ #main-titles-v1- { { section.id } } h1.main-titles-v1__title { font-size: clamp(28px, 4.2vw, 48px); } #main-titles-v1- { { section.id } } h2.main-titles-v1__title { font-size: clamp(80px, 3.6vw, 40px); } #main-titles-v1- { { section.id } } h3.main-titles-v1__title { font-size: clamp(20px, 3vw, 32px); } #main-titles-v1- { { section.id } } h4.main-titles-v1__title { font-size: clamp(18px, 2.4vw, 28px); } #main-titles-v1- { { section.id } } .main-titles-v1__subtitle { opacity: .9; margin: 0; font-size: clamp(14px, 1.6vw, 18px); } #main-titles-v1- { { section.id } } .main-titles-v1__divider { display: inline-block; height: 2px; width: 56px; background: currentColor; opacity: .25; border-radius: 2px; } #main-titles-v1- { { section.id } } .main-titles-v1__desc { font-size: clamp(14px, 1.6vw, 18px); opacity: .95; } /* Transformaciones de texto */ #main-titles-v1- { { section.id } } .tt-none { text-transform: none; } #main-titles-v1- { { section.id } } .tt-uppercase { text-transform: uppercase; letter-spacing: .06em; } #main-titles-v1- { { section.id } } .tt-capitalize { text-transform: capitalize; } /*main-titles-v1*/ /*product-slider-v5*/ .prodslider-v1-track { display: flex; gap: 16px; width: 100%; overflow: hidden; justify-content: center; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: none; cursor: grab; padding: 5px; } .prodslider-v1-track::-webkit-scrollbar { display: none; } .prodslider-v1-track.is-dragging { scroll-snap-type: none; cursor: grabbing; pointer-events: none; } .prodslider-v1-track.is-dragging, .prodslider-v1-track.is-dragging * { user-select: none !important; } .prodslider-v1-track.is-dragging .prodslider-v1-link { pointer-events: none; } .prodslider-v1-item { display: flex; flex-direction: column; align-items: stretch; border-radius: 10px; box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px; min-width: 300px; max-width: 300px; overflow: hidden; scroll-snap-align: start; flex: 0 0 auto; background-color: #ffffff; filter: drop-shadow(3px 3px 0px black); transition: .3s ease; } .prodslider-v1-item:hover { filter: drop-shadow(3px 3px 0px black) brightness(1.15); } .prodslider-v1-head { padding: 15px; min-height: 80px; } .prodslider-v1-title { text-align: center; font-size: 20px; } .prodslider-v1-title a { font-weight: 900; color: #000000; font-family: 'Antonio'; } .prodslider-v1-meta { width: 100%; overflow: hidden; background-color: #2c4135; padding: 5px 0; } .prodslider-v1-meta-track { display: flex; width: 140%; justify-content: space-around; gap: 0; will-change: transform; --meta-speed: 18s; animation: v1-meta-marquee var(--meta-speed) linear infinite; } .prodslider-v1-meta-seq { display: inline-flex; align-items: center; gap: 24px; padding-inline: 8px; } .prodslider-v1-media { position: relative; width: 100%; aspect-ratio: var(--ratio, 1 / 1); overflow: hidden; } .prodslider-v1-img { width: 100%; height: 100%; object-fit: contain; display: block; pointer-events: none; user-select: none; -webkit-user-drag: none; } .prodslider-v1-features { position: absolute; top: 5px; right: 5px; height: 65%; display: flex; flex-direction: column; align-content: flex-end; align-items: flex-end; justify-content: flex-start; } .prodslider-v1-feature { display: flex; flex-direction: column; align-items: center; justify-content: center; align-content: center; backdrop-filter: blur(15px); border-radius: 50px; overflow: hidden; width: 60px; height: 60px; border: solid 1px #2c4135; transition: .3s ease; } .prodslider-v1-feature:hover { width: 170px; background-color: #ffffff; } .prodslider-v1-feature-icon { width: 100%; height: 100%; max-width: 60px; position: absolute; display: block; transition: .3s ease; } .prodslider-v1-feature:hover .prodslider-v1-feature-icon { display: none; } .prodslider-v1-feature-label { font-size: 15px; display: none; color: #2c4135; transition: .3s ease; } .prodslider-v1-feature:hover .prodslider-v1-feature-label { display: block; } .prodslider-v1-meta-item { font-size: 12px; color: #ffffff; flex: 0 0 auto; white-space: nowrap; user-select: none; } .prodslider-v1-features--left { right: unset; left: 5px; align-items: flex-start; } .v1-feature2 { border: none; background-color: transparent; transition: .3s ease; } .v1-feature2:hover { transform: rotate(-25deg); width: auto; background-color: transparent; } .prodslider-v1-feature-icon2 { width: 100%; height: 100%; } @keyframes v1-meta-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } /* media pista (hay 2 secuencias) */ } @media (prefers-reduced-motion: reduce) { .prodslider-v1-meta-track { animation: none; transform: none; } } .prodslider-v1-desc { background-color: #2c4135; padding: 5px; margin-top: -80px; z-index: 1; display: none!important; } .prodslider-v1-desc-text { color: #ffffff; font-size: 12px; line-height: 15px; } .prodslider-v1-actions, .prodslider-v1-buy-form { width: 100%; display: flex; flex-direction: column; align-items: center; background-color: #ffffff; z-index: 1; } .prodslider-v1-pricing { width: 100%; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; padding-top: 10px; } .prodslider-v1-pricing span { font-size: 25px; } .prodslider-v1-btn { appearance: none; background: none; font-size: 16px; background-color: #ffffffad; backdrop-filter: blur(8px); padding: 15px 0; width: 95%; text-align: center; border-radius: 5px; border: 1px solid #2c4135; align-items: center; cursor: pointer; transition: .3s ease; margin: 10px 0; color: #000000; font-weight: 600; transition: .3s ease; } .prodslider-v1-btn:hover { background-color: #d44817; border: 1px solid #d44817; color: #ffffff; } .prodslider-v1-add-form { width: 100%; display: flex; flex-direction: column; align-items: center; } .prodslider-v1-btn .prodslider-v1-add { font-size: 16px; background-color: #ac7479; backdrop-filter: blur(8px); padding: 15px 0; width: 95%; text-align: center; border-radius: 50px; border: 1px solid #ac7479; align-items: center; cursor: pointer; transition: .3s ease; margin: 10px 0; color: #ffffff; font-weight: 600; } @media (pointer: coarse) { .prodslider-v1-track { touch-action: pan-y; overscroll-behavior-y: auto; overscroll-behavior-x: contain; } } /*product-slider-v5*/ /*main-marcas-container-v1*/ #main-marcas-v1- { { section.id } } { padding: clamp(16px, 3vw, 36px) 0; color: var(--fg, #111); } #main-marcas-v1- { { section.id } } .main-marcas-v1-inner { margin-inline: auto; padding: 50px; padding-top: 0; max-width: 1000px; } #main-marcas-v1- { { section.id } } .main-marcas-v1__header { margin-bottom: clamp(10px, 1.8vw, 18px); } #main-marcas-v1- { { section.id } } .main-marcas-v1__title { font-size: clamp(22px, 2.2vw, 28px); font-weight: 700; margin: 0 0 6px 0; color: var(--fg, #111); } #main-marcas-v1- { { section.id } } .main-marcas-v1-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap, 12px); } @media (max-width: 1100px) { #main-marcas-v1- { { section.id } } .main-marcas-v1-grid { grid-template-columns: repeat(3, 1fr); } } @media (max-width: 768px) { #main-marcas-v1- { { section.id } } .main-marcas-v1-grid { grid-template-columns: repeat(3, 1fr); } } @media (max-width: 520px) { #main-marcas-v1- { { section.id } } .main-marcas-v1-grid { grid-template-columns: repeat(2, 1fr); } } #main-marcas-v1- { { section.id } } .marca-card-v1 { display: grid; grid-template-rows: auto 1fr; align-items: center; justify-items: center; min-height: 120px; padding: clamp(14px, 2.4vw, 22px); background: var(--cardBg, #f8f9fa); border-radius: var(--radius, 14px); box-shadow: 0 1px 0 rgba(0, 0, 0, .06), 0 8px 24px rgba(0, 0, 0, .06); } #main-marcas-v1- { { section.id } } .marca-card-v1__num { font-weight: 700; font-size: clamp(18px, 2.2vw, 24px); margin: 2px 0 10px; letter-spacing: .5px; color: var(--fg, #111); } #main-marcas-v1- { { section.id } } .marca-card-v1__logo { width: 100%; max-width: 170px; object-fit: contain; { % if section.settings.gray_logo % } filter: grayscale(1) contrast(.85) opacity(.85); { % endif % } transition: filter .3s ease, opacity .3s ease, transform .3s ease; } #main-marcas-v1- { { section.id } } .marca-card-v1:hover .marca-card-v1__logo { { % if section.settings.gray_logo % } filter: grayscale(0) contrast(1) opacity(1); { % endif % } transform: translateY(-1px); } #main-marcas-v1- { { section.id } } .marca-card-v1__logo--placeholder { display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 40px; background: #e9ecef; color: var(--muted, #9aa0a6); border-radius: 8px; font-size: 12px; font-weight: 600; } #main-marcas-v1- { { section.id } } .marca-card-v1.is-counted .marca-card-v1__num { color: var(--fg, #111); } /*main-marcas-container-v1*/ /*main-section-best-sellers-v1*/ .main-section-best-sellers-v1__row { display: flex; justify-content: space-between; overflow-x: clip; } .main-section-best-sellers-v1__item-container { position: relative; width: 32.5%; } .icon-container-discount-bestseller { position: absolute; top: -40px; right: -25px; z-index: 2; transition: .3s ease; } .main-section-best-sellers-v1__item-container:hover .icon-container-discount-bestseller { transform: rotate(-17deg) scale(1.08); } .main-section-best-sellers-v1__item { width: 100%; position: relative; box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px; border-radius: 10px; overflow: hidden; transition: .3s ease; } .main-section-best-sellers-v1__item-container .main-section-best-sellers-v1__item:hover { filter: brightness(1.05); } .main-section-best-sellers-v1__content { background-color: #fffbf0; height: 130px; position: absolute; bottom: 0; width: 100%; padding: 10px; left: 0; display: flex; flex-direction: column; justify-content: space-between; } .main-section-best-sellers-v1__title { font-size: 25px; } .main-section-best-sellers-v1__cta { display: flex; width: 170px; background-color: #d24614; padding: 10px; margin-top: 5px; border-radius: 5px; align-items: center; justify-content: center; color: #fffbf0; font-size: 15px; font-weight: 700; transition: .3s ease; } .main-section-best-sellers-v1__cta:hover { filter: brightness(1.2); color: #fffbf0; } /*main-section-best-sellers-v1*/ /*comunidad-eventos-v1*/ .comunidad-eventos-v1 { padding: 80px 5%; color: #1b1a1a } .cev1-grid { display: grid; grid-template-columns: 1fr 2fr; gap: 40px; max-width: 1300px; margin: 0 auto } .cev1-left { display: flex; align-items: center } .cev1-title { font-family: Antonio, serif; font-size: 60px; line-height: 1.2; margin: 0 0 10px } .cev1-desc { font-family: Poppins, sans-serif; font-size: 18px; line-height: 1.55; margin: 0 0 0; max-width: 36ch } .cev1-right { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px } .cev1-item { position: relative; aspect-ratio: 1/1; background-size: cover; background-position: center; border: none; padding: 0; cursor: pointer; isolation: isolate; overflow: hidden; transition: transform .25s, filter .25s; display: block; text-decoration: none; } .cev1-item:focus-visible { outline: 2px solid #111; outline-offset: 2px } .cev1-item:hover { filter: brightness(.9); transform: translateY(-2px) } .cev1-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, .45) 100%); display: flex; align-items: flex-end; padding: 12px } .cev1-overlay-title { color: #fff; font-weight: 600; font-size: 14px; letter-spacing: .2px } .cev1-badge { position: absolute; top: 10px; left: 10px; background: #ffffff94; padding: 6px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; backdrop-filter: blur(10px); color: #111318; } .cev1-text { height: 500px; display: flex; flex-direction: column; align-items: center; justify-content: center; } @media (max-width: 980px) { .cev1-grid { grid-template-columns: 1fr; gap: 22px } .cev1-desc { max-width: none } } /*comunidad-eventos-v1*/ /*main-section-2-blocks-v1*/ .main-section-2-v1 { padding-block: var(--padY, 40px); } .main-section-2-v1-1 { display: grid; grid-template-columns: 1fr 1.5fr; align-items: stretch; } .ms2-col-left { display: flex; flex-direction: column; justify-content: space-between; gap: var(--gap, 16px); padding: 10px; } .main-section-2-v1__title { margin: 0; line-height: .9; letter-spacing: .5px; color: var(--titleColor, #111); font-size: clamp(40px, 11vw, 140px); text-transform: uppercase; font-weight: 900; } .main-section-2-v1__about h3 { margin: 0; text-transform: uppercase; letter-spacing: .5px; font-weight: 800; font-family: 'Antonio'; font-size: 35px; } .main-section-2-v1__about h3 span { font-family: 'Antonio'; font-size: 35px; margin-left: .35em; color: var(--accent, #ff5a30); } .main-section-2-v1__about p { margin: .5rem 0 0; color: var(--copyColor, #222); opacity: .95; } .ms2-topbar { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--gap, 16px); color: var(--copyColor, #222); opacity: .9; font-size: .95rem; } .ms2-topbar p { margin: 0; } .ms2-wrap { display: grid; gap: var(--gap, 16px); border-radius: 18px; padding: clamp(10px, 1.8vw, 16px); position: relative; } .ms2-banner { position: relative; overflow: hidden; border-radius: 14px; background: #0000; } .main-section-2-v1__track { display: flex; transition: transform .45s ease; will-change: transform; } .main-section-2-v1__slide { min-width: 100%; display: grid; grid-template-columns: 1fr; gap: 10px; padding: clamp(10px, 1.5vw, 16px); } .main-section-2-v1__media { width: 90%; margin: 0 auto; aspect-ratio: 16/9; overflow: hidden; border-radius: 10px; background: #ddd; } .main-section-2-v1__media img { width: 100%; height: 100%; object-fit: cover; display: block; } .ms2-copy { width: 90%; margin: 0 auto; color: var(--copyColor, #222); } .ms2-eyebrow { margin: .25rem 0 .25rem; text-transform: uppercase; letter-spacing: .08em; font-size: .78rem; opacity: .8; } .ms2-h4 { margin: .15rem 0 .25rem; font-size: clamp(20px, 2.2vw, 28px); line-height: 1.1; font-weight: 800; text-transform: uppercase; } .ms2-sub { margin: 0 0 .25rem; opacity: .9; font-size: clamp(14px, 1.4vw, 16px); } .main-section-2-v1__desc { line-height: 1.5; font-size: clamp(14px, 1.2vw, 16px); margin: .25rem 0 0; } .ms2-actions { display: flex; gap: 8px; margin-top: .6rem; } .ms2-btn { display: inline-flex; align-items: center; justify-content: center; padding: .6rem 1rem; border-radius: 999px; background: #111; color: #fff; font-weight: 700; font-size: 15px; text-decoration: none; transition: filter .2s ease; } .ms2-btn:hover { filter: brightness(1.2); color: white; } .ms2-btn--ghost { background: transparent; color: #111; border: 2px solid currentColor; } .ms2-controls { position: absolute; display: flex; justify-content: center; gap: 8px; width: 100%; top: 50%; transform: translateY(-50%); } .main-section-2-v1__btn { appearance: none; border: 0; background: #000000cc; color: #fff; width: 36px; height: 36px; border-radius: 999px; display: grid; place-items: center; cursor: pointer; font-size: 18px; line-height: 1; transition: transform .08s ease, opacity .2s; } .main-section-2-v1__btn:disabled { opacity: .4; cursor: default; } .main-section-2-v1__btn--prev, .main-section-2-v1__btn--next { position: absolute; top: 50%; transform: translateY(-50%); } .main-section-2-v1__btn--prev { left: 10px; } .main-section-2-v1__btn--next { right: 10px; } @media (max-width: 980px) { .main-section-2-v1-1 { grid-template-columns: 1fr; } .main-section-2-v1__title { font-size: clamp(40px, 12vw, 90px); } } /*main-section-2-blocks-v1*/ /*main-container-section-newsletter-destacado-v1*/ .main-container-section-newsletter-destacado-v1 { display: flex; justify-content: center; align-items: center; padding: clamp(36px, 6vw, 60px) 20px; background-position: center center; background-repeat: no-repeat; background-size: cover; } .container-of-newsletter { display: flex; flex-direction: row; justify-content: space-between; } .newsletter-destacado-v1-grid { display: flex; width: 100%; max-width: 1160px; margin: 0 auto; align-items: stretch; gap: clamp(16px, 3vw, 28px); flex-direction: column-reverse; } @media (min-width: 980px) { .newsletter-destacado-v1-grid { flex-direction: column-reverse; } } .aside-newsletter-destacado-v1 { /*flex: 1 1 40%;*/ width: 48.5%; display: flex; flex-direction: column; align-items: center; justify-content: center; background: rgba(255, 255, 255, .92); border: 1px solid rgba(47, 61, 47, .12); padding: clamp(20px, 3.5vw, 28px); color: #2f3d2f; box-shadow: 0 10px 24px rgba(0, 0, 0, .1); text-align: center; } .aside-newsletter-destacado-v1__title { font-family: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; font-weight: 700; font-size: 24px; text-transform: uppercase; margin: 0 0 8px; letter-spacing: .02em; } .aside-newsletter-destacado-v1__desc { font-size: 16px; line-height: 1.7; margin: 0 0 18px; opacity: .95; } .social-newsletter-destacado-v1 { display: flex; gap: 12px; list-style: none; padding: 0; margin: 8px 0 18px; } .social-newsletter-destacado-v1 a { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(47, 61, 47, .18); color: #000; background: #fff; transition: transform .12s ease, box-shadow .18s ease, border-color .18s ease, color .18s ease; } .social-newsletter-destacado-v1 a:hover { transform: translateY(-2px); border-color: #000; box-shadow: 0 8px 16px rgba(0, 0, 0, .12); } .social-newsletter-destacado-v1 a:focus-visible { outline: 3px solid rgba(122, 92, 255, .35); outline-offset: 2px; } .aside-newsletter-destacado-v1__legal { font-size: 14px; opacity: .8; margin: 6px 0 0; } .aside-newsletter-destacado-v1__legal a { color: inherit; text-decoration: underline; } .section-newsletter-destacado-v1 { /*flex: 1 1 60%;*/ background: #fff; padding: clamp(24px, 4vw, 40px) clamp(20px, 3vw, 30px); width: 48.5%; max-width: 580px; box-shadow: 0 10px 30px rgba(0, 0, 0, .1); } .formulario-newsletter-destacado-v1 { display: flex; flex-direction: column; } .titulo-newsletter-destacado-v1 { font-size: clamp(32px, 5vw, 50px); font-weight: 600; margin: 0 0 10px; text-align: left; width: 100%; } .subtitulo-newsletter-destacado-v1 { font-size: 18px; color: #000; margin: 0 0 26px; line-height: 1.6; border-bottom: 3px solid #000; padding-bottom: 12px; } .campo-newsletter-destacado-v1 { display: flex; flex-direction: column; margin-bottom: 18px; } .campo-newsletter-destacado-v1 label { font-size: 15px; font-weight: 600; color: #000; margin-bottom: 6px; } .campo-newsletter-destacado-v1 input { border: 1px solid #000; padding: 12px 12px; font-size: 14px; outline: none; color: #000; background: #fff; } .boton-newsletter-destacado-v1 { background: #000; color: #fff; border: none; padding: 12px 20px; font-weight: 700; cursor: pointer; align-self: flex-start; transition: opacity .2s ease; font-size: 17px; border-radius: 2px; text-decoration: none; display: inline-block; } .boton-newsletter-destacado-v1:hover { opacity: .9; } .formulario-newsletter-destacado-v1 .form__message { margin-top: 14px; font-size: 14px; } .formulario-newsletter-destacado-v1 .form__message.success { color: #1f7a1f; } .formulario-newsletter-destacado-v1 .form__message.error { color: #b00020; } .nota-newsletter-destacado-v1 { font-size: 14px; opacity: .85; margin: 0 0 14px; } /*main-container-section-newsletter-destacado-v1*/ /*main-section-2-v1*/ .main-section-2-v1 { padding-block: var(--padY, 40px); } .main-section-2-v1-1 { display: grid; grid-template-columns: 1fr 1.5fr; align-items: stretch; } .ms2-col-left { background-color: #d44817; display: flex; flex-direction: column; justify-content: space-between; gap: var(--gap, 16px); padding: 10px; } .main-section-2-v1__title { margin: 0; line-height: .9; letter-spacing: .5px; color: var(--titleColor, #111); font-size: clamp(40px, 11vw, 140px); text-transform: uppercase; font-weight: 900; } .main-section-2-v1__about h3 { margin: 0; text-transform: uppercase; letter-spacing: .5px; font-weight: 800; font-family: 'Antonio'; font-size: 35px; } .main-section-2-v1__about h3 span { font-family: 'Antonio'; font-size: 35px; margin-left: .35em; color: #fffbf0; } .main-section-2-v1__about p { margin: .5rem 0 0; color: var(--copyColor, #222); opacity: .95; } .ms2-col-right { display: grid; gap: var(--gap, 16px); background-color: #cfcbc0; padding: 10px; align-content: center; } .ms2-topbar { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--gap, 16px); color: var(--copyColor, #222); opacity: .9; font-size: .95rem; } .ms2-topbar p { margin: 0; } .ms2-wrap { display: grid; gap: var(--gap, 16px); border-radius: 18px; padding: clamp(10px, 1.8vw, 16px); position: relative; } .ms2-banner { position: relative; overflow: hidden; border-radius: 14px; } .main-section-2-v1__track { display: flex; transition: transform .45s ease; will-change: transform; } .main-section-2-v1__slide { min-width: 100%; display: grid; grid-template-columns: 1fr; gap: 10px; padding: clamp(10px, 1.5vw, 16px); } .main-section-2-v1__media { width: 90%; margin: 0 auto; aspect-ratio: 16/9; overflow: hidden; border-radius: 10px; background: #ddd; } .main-section-2-v1__media img { width: 100%; height: 100%; object-fit: cover; display: block; } .main-section-2-v1__desc { width: 90%; margin: 0 auto; color: var(--copyColor, #222); line-height: 1.5; font-size: clamp(14px, 1.2vw, 16px); } .main-section-2-v1__desc a { text-decoration: underline; font-weight: 700; color: #d44817; transition: .3s ease; } .main-section-2-v1__desc a:hover { filter: brightness(1.5); } .ms2-controls { position: absolute; display: flex; justify-content: center; gap: 8px; width: 100%; top: 50%; transform: translateY(-50%); } .main-section-2-v1__btn { appearance: none; border: 0; background: #000000cc; color: #fff; width: 36px; height: 36px; border-radius: 999px; display: grid; place-items: center; cursor: pointer; font-size: 18px; line-height: 1; transition: transform .08s ease, opacity .2s; } .main-section-2-v1__btn:hover {} .main-section-2-v1__btn:disabled { opacity: .4; cursor: default; } .main-section-2-v1__btn--prev, .main-section-2-v1__btn--next { position: absolute; top: 50%; transform: translateY(-50%); } .main-section-2-v1__btn--prev { left: 10px; } .main-section-2-v1__btn--next { right: 10px; } @media (max-width: 980px) { .main-section-2-v1-1 { grid-template-columns: 1fr; } .main-section-2-v1__title { font-size: clamp(40px, 12vw, 90px); } } /*main-section-2-v1*/ /*contacto-v1.liquid*/ /*Contacto V3*/ .main-container-section-contacto-v3 { display: flex; justify-content: center; align-items: center; padding: 50px 20px; /*background-image: url(/cdn/shop/files/Banner_Prueba_3.png?v=1759118495);*/ background-position: center center; +background-repeat: no-repeat; background-size: cover; } .section-contacto-v3 { background-color: white; padding: 40px 30px; max-width: 500px; width: 100%; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); } .formulario-contacto-v3 { display: flex; flex-direction: column; } .titulo-contacto-v3 { font-size: 50px; font-weight: 400; margin-bottom: 10px; text-align: left; } .subtitulo-contacto-v3 { font-size: 20px; color: rgb(0, 0, 0); margin-bottom: 30px; line-height: 1.6; border-bottom: 3px solidrgb(0, 0, 0); } .campo-formulario-v3 { display: flex; flex-direction: column; margin-bottom: 20px; } .campo-formulario-v3 label { font-size: 17px; font-weight: bold; color: rgb(0, 0, 0); margin-bottom: 5px; } .campo-formulario-v3 input, .campo-formulario-v3 textarea { border: 1px solidrgb(0, 0, 0); padding: 10px; font-size: 14px; outline: none; color: rgb(0, 0, 0); } .boton-contacto-v3 { background-color: rgb(0, 0, 0); color: white; border: none; padding: 12px 20px; font-weight: bold; cursor: pointer; align-self: flex-start; transition: background-color 0.3s ease; font-size: 17px; } .boton-contacto-v3:hover { background-color: rgb(0, 0, 0); } /* Mensajes de éxito o error */ .formulario-contacto-v3 .form__message { margin-top: 20px; font-size: 14px; color: green; } /* ===== Grid 2 columnas + aside ===== */ .contacto-v3-grid { display: flex; height: -webkit-fill-available; width: 100%; max-width: 1160px; /* controla ancho total del módulo */ margin: 0 auto; align-items: start; grid-template-columns: 1fr 2fr; /* móvil: stacked */ justify-content: center; } @media (min-width: 980px) { .contacto-v3-grid {} } /* Lateral */ .aside-contacto-v3 { height: 100%; width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; background: rgba(255, 255, 255, .92); border: 1px solid rgba(47, 61, 47, .12); padding: clamp(20px, 3.5vw, 28px); color: #2f3d2f; box-shadow: 0 10px 24px rgba(0, 0, 0, .1); } .aside-contacto-v3__title { font-family: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; font-weight: 600; font-size: 22px; text-transform: uppercase; margin: 0 0 8px; letter-spacing: .02em; } .aside-contacto-v3__address { font-style: normal; line-height: 1.6; margin: 0 0 22px; font-size: 15px; opacity: .9; } /* Redes */ .social-contacto-v3 { display: flex; gap: 12px; list-style: none; padding: 0; margin: 8px 0 18px; } .social-contacto-v3 a { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(47, 61, 47, .18); color: rgb(0, 0, 0); background: #fff; transition: transform .12s ease, box-shadow .18s ease, border-color .18s ease, color .18s ease; } .social-contacto-v3 a:hover { transform: translateY(-2px); border-color: rgb(0, 0, 0); box-shadow: 0 8px 16px rgba(0, 0, 0, .12); } .social-contacto-v3 a:focus-visible { outline: 3px solid rgba(122, 92, 255, .35); outline-offset: 2px; } /* Legal */ .aside-contacto-v3__legal { font-size: 15px; opacity: .8; margin: 6px 0 0; } .aside-contacto-v3__legal a { color: inherit; text-decoration: underline; } /*contacto-v1.liquid*/ /*footer-v1*/ .cg-footer { --bg: #1b1a1a; --text: #c9c9c9; --title: #ffffff; --rule: #2a2929; --btn: #a66a2b; --btnText: #fff; --input: #262626; --inputText: #e8e8e8; position: relative; z-index: 100 !important; } .cg-footer { background: var(--bg); color: var(--text); padding: 36px 20px 28px } .cg-footer a { color: var(--text); text-decoration: none } .cg-footer a:hover { opacity: .9 } .cg-footer__inner { max-width: 1180px; margin: 0 auto } .cg-footer__top { display: grid; grid-template-columns: 1fr 520px; align-items: center; gap: 24px } .cg-footer__brand { display: flex; align-items: center } .cg-footer__logo { height: 44px; width: auto } .cg-footer__brandname { color: var(--title); margin: 0; font-size: 20px; font-weight: 700 } .cg-footer__newsletter { justify-self: end } .cg-footer__nl-title { margin: 0 0 10px; color: var(--title); font-weight: 500 } .cg-nl-form { display: flex; gap: 10px } .cg-nl-input { flex: 1; min-width: 280px; height: 42px; border-radius: 24px; border: 1px solid transparent; background: var(--input); color: var(--inputText); padding: 0 16px; outline: none } .cg-nl-input::placeholder { color: #9e9e9e } .cg-nl-btn { height: 42px; padding: 0 18px; border-radius: 24px; background: var(--btn); color: var(--btnText); border: 0; cursor: pointer; font-weight: 600 } .cg-footer__rule { border: 0; height: 1px; background: var(--rule); margin: 22px 0 } .cg-footer__columns { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px } .cg-col__title { color: var(--title); font-weight: 600; margin: 0 0 12px; font-size: 16px } .cg-links { list-style: none; padding: 0; margin: 0 } .cg-links li { margin: 8px 0 } .cg-footer__bottom { margin-top: 24px } .cg-social__title { margin: 0 0 10px; color: var(--title); font-weight: 500 } .cg-social { display: flex; gap: 12px } .cg-social__btn { width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #3a3a3a; border-radius: 50% } .cg-copy { margin: 18px 0 0; font-size: 12px; color:rgba(157, 157, 157, 0) } /* Responsive */ @media (max-width: 1024px) { .cg-footer__top { grid-template-columns: 1fr } .cg-footer__newsletter { justify-self: start } } @media (max-width: 760px) { .cg-footer { padding: 28px 16px } .cg-nl-input { min-width: 0 } } @media (max-width: 480px) { .cg-nl-form { flex-direction: column } .cg-nl-btn { width: 100% } } /* A11y helper */ .visually-hidden { position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap } /*footer-v1*/ /*Privacy Policy*/ .shopify-policy__container { max-width: 55%; text-align: justify; padding: 155px 0; display: flex; flex-direction: column; justify-content: center; } .shopify-policy__container p { padding: 10px 0; text-align: justify; font-size: 17px; } .shopify-policy__container h1 { padding: 15px; } .shopify-policy__container h2 { padding: 15px; } /*Privacy Policy*/