/* ARVICA storefront */ :root { color-scheme: only light; --a-brown: #7b4a52; --a-gold: #c8a27a; --a-wine: #a3485a; --a-ink: #2a1a1f; --a-tint: #fbf1ee; --a-line: #efdfd9; --a-white: #fff; --a-radius: 14px; --a-shadow: 0 10px 30px rgba(42, 26, 31, .08); --a-serif: "Cormorant", Georgia, serif; --a-sans: "Lato", system-ui, sans-serif; --a-ease: cubic-bezier(.2, .7, .2, 1); } /* Parent wrappers use overflow:hidden, which breaks the sticky header; clip keeps the same clipping */ html.js, html, body.arvica, body.arvica .wrapper, body.arvica .inner-wrapper { overflow: visible !important; overflow-x: clip !important; } /* Explicit backgrounds stop Chrome's forced dark mode from darkening the page canvas */ html, body.arvica #main { background: var(--a-white); } body.arvica { background: var(--a-white); color: var(--a-ink); font-family: var(--a-sans); font-size: 16px; line-height: 1.65; } body.arvica h1, body.arvica h2, body.arvica h3 { font-family: var(--a-serif); color: var(--a-ink); font-weight: 600; line-height: 1.15; letter-spacing: .01em; text-transform: none; } body.arvica a { color: inherit; } body.arvica :focus-visible { outline: 2px solid var(--a-wine); outline-offset: 3px; } .a-wrap { width: min(1180px, 100% - 32px); margin-inline: auto; } .a-narrow { width: min(820px, 100% - 32px); } .a-full { width: 100%; } .a-center { text-align: center; margin-top: 40px; } .screen-reader-text:focus { position: fixed; top: 8px; left: 8px; z-index: 9999; background: #fff; padding: 8px 14px; clip: auto; width: auto; height: auto; } /* Buttons */ .a-btn, body.arvica .button, body.arvica button.single_add_to_cart_button, body.arvica .checkout-button, body.arvica #place_order { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 12px 28px; border-radius: 999px; border: 1px solid var(--a-brown); font: 700 13px/1 var(--a-sans); letter-spacing: .12em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: background .25s var(--a-ease), color .25s var(--a-ease), border-color .25s var(--a-ease), transform .25s var(--a-ease); } .a-btn--solid, body.arvica .button, body.arvica button.single_add_to_cart_button, body.arvica .checkout-button, body.arvica #place_order { background: var(--a-brown); color: #fff !important; } .a-btn--solid:hover, body.arvica .button:hover, body.arvica button.single_add_to_cart_button:hover, body.arvica .checkout-button:hover, body.arvica #place_order:hover { background: var(--a-wine); border-color: var(--a-wine); } .a-btn--ghost { background: transparent; color: var(--a-brown); } .a-btn--ghost:hover { background: var(--a-brown); color: #fff; } .a-btn--gold { background: var(--a-gold); border-color: var(--a-gold); color: #fff; } .a-btn--gold:hover { background: var(--a-wine); border-color: var(--a-wine); } .a-btn:active { transform: translateY(1px); } .a-btn.loading, .button.loading { opacity: .6; pointer-events: none; } .a-btn.added::after { content: "✓"; } body.arvica a.added_to_cart { display: none; } /* Header */ .a-header { position: sticky; top: 0; z-index: 100; background: rgba(255, 255, 255, .94); backdrop-filter: blur(10px); border-bottom: 1px solid transparent; transition: box-shadow .3s, border-color .3s; } .admin-bar .a-header { top: 32px; } .a-header.is-scrolled { border-color: var(--a-line); box-shadow: 0 4px 20px rgba(42, 26, 31, .06); } .a-header__inner { width: min(1240px, 100% - 32px); margin-inline: auto; min-height: 84px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; } .a-header__logo img { max-height: 58px; width: auto; display: block; } .a-wordmark { font: 700 28px var(--a-serif); letter-spacing: .1em; text-decoration: none; } .a-nav__list { display: flex; gap: 36px; list-style: none; margin: 0; padding: 0; } .a-nav__list a { position: relative; display: block; padding: 8px 0; font: 700 13px var(--a-sans); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; color: var(--a-ink); } .a-nav__list a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 2px; height: 1px; background: var(--a-gold); transform: scaleX(0); transition: transform .3s var(--a-ease); } .a-nav__list a:hover::after, .a-nav__list .current-menu-item > a::after, .a-nav__list .current_page_item > a::after { transform: scaleX(1); } .a-nav__list .current-menu-item > a { color: var(--a-wine); } .a-header__icons { display: flex; justify-content: flex-end; align-items: center; gap: 6px; } .a-icon { position: relative; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: var(--a-ink); transition: background .2s; } .a-icon:hover { background: var(--a-tint); } .a-icon i { font-size: 19px; } .arvica-cart-count { position: absolute; top: 4px; right: 2px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--a-wine); color: #fff; font: 700 11px/18px var(--a-sans); text-align: center; } .a-burger { display: none; width: 44px; height: 44px; border: 0; background: none; color: var(--a-ink); font-size: 22px; cursor: pointer; } .a-burger .fa-xmark, .a-burger[aria-expanded="true"] .fa-bars { display: none; } .a-burger[aria-expanded="true"] .fa-xmark { display: inline-block; } @media (max-width: 960px) { .a-header__inner { grid-template-columns: auto 1fr; min-height: 70px; } .a-header__logo img { max-height: 46px; } .a-burger { display: block; } .a-nav { position: fixed; inset: 70px 0 auto 0; background: #fff; border-bottom: 1px solid var(--a-line); box-shadow: var(--a-shadow); max-height: 0; overflow: hidden; visibility: hidden; transition: max-height .35s var(--a-ease), visibility .35s; } .admin-bar .a-nav { top: 116px; } .a-nav.is-open { max-height: 80vh; visibility: visible; } .a-nav__list { flex-direction: column; gap: 0; padding: 8px 16px 16px; } .a-nav__list a { padding: 14px 4px; border-bottom: 1px solid var(--a-line); } .a-nav__list a::after { display: none; } } @media (max-width: 782px) { .admin-bar .a-header { top: 46px; } .admin-bar .a-nav { top: 116px; } } /* Parent layouts float their content; contain it so the footer stays below */ body.arvica #main, body.arvica #header-wrapper { float: none !important; width: 100%; } body.arvica #main, body.arvica #main > .container { display: flow-root; } .a-footer { clear: both; } /* Parent page-title banner on shop/product/cart pages */ .a-pagehead { background: var(--a-tint); } /* Sections */ .a-section { padding: clamp(56px, 8vw, 104px) 0; } .a-section--tint { background: var(--a-tint); } .a-section--dark { background: var(--a-wine); color: #f6efe8; } body.arvica .a-section--dark h2 { color: #fff; } .a-section--dark .a-eyebrow { color: var(--a-gold); } .a-head { text-align: center; max-width: 640px; margin: 0 auto 48px; } .a-head h2, .a-split__text h2 { font-size: clamp(32px, 4vw, 48px); margin: 0; } .a-eyebrow { margin: 0 0 12px; font: 700 12px var(--a-sans); letter-spacing: .24em; text-transform: uppercase; color: var(--a-gold); } /* Hero slider */ .a-hero { position: relative; height: clamp(520px, 78vh, 760px); overflow: hidden; background: #f6e6e2; isolation: isolate; touch-action: pan-y; } .a-slide { position: absolute; inset: 0; display: grid; align-items: center; opacity: 0; visibility: hidden; transition: opacity 1.1s var(--a-ease), visibility 0s linear 1.1s; } .a-slide.is-active { opacity: 1; visibility: visible; z-index: 1; transition: opacity 1.1s var(--a-ease), visibility 0s; } .a-slide__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.08); transition: transform 7s linear; will-change: transform; } .a-slide.is-active .a-slide__img { transform: scale(1); } .a-slide::before { content: ""; position: absolute; inset: 0; z-index: 0; background: linear-gradient(90deg, rgba(251, 241, 238, .92) 0%, rgba(251, 241, 238, .55) 38%, rgba(251, 241, 238, 0) 62%); } .a-slide--dim::before { background: linear-gradient(90deg, rgba(251, 241, 238, .96) 0%, rgba(251, 241, 238, .8) 42%, rgba(251, 241, 238, 0) 70%); } .a-hero__content { position: relative; z-index: 2; padding-block: 56px; padding-left: clamp(0px, 3vw, 40px); } .a-hero__content > * { max-width: 520px; opacity: 0; transform: translateY(24px); transition: opacity .7s var(--a-ease), transform .7s var(--a-ease); } .a-slide.is-active .a-hero__content > * { opacity: 1; transform: none; } .a-slide.is-active .a-hero__content > :nth-child(1) { transition-delay: .35s; } .a-slide.is-active .a-hero__content > :nth-child(2) { transition-delay: .5s; } .a-slide.is-active .a-hero__content > :nth-child(3) { transition-delay: .65s; } .a-slide.is-active .a-hero__content > :nth-child(4) { transition-delay: .8s; } .a-hero__title { font-size: clamp(36px, 4.6vw, 64px); margin: 0 0 18px; } .a-hero__text { font-size: clamp(16px, 1.4vw, 18px); color: var(--a-brown); margin: 0 0 32px; } .a-hero__cta { display: flex; flex-wrap: wrap; gap: 14px; } .a-hero__arrow { position: absolute; top: 50%; z-index: 3; width: 52px; height: 52px; margin-top: -26px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .85); color: var(--a-ink); font-size: 16px; cursor: pointer; box-shadow: var(--a-shadow); opacity: 0; transition: opacity .3s, background .2s, color .2s, transform .2s; } .a-hero__arrow--prev { left: 24px; } .a-hero__arrow--next { right: 24px; } .a-hero:hover .a-hero__arrow, .a-hero__arrow:focus-visible { opacity: 1; } .a-hero__arrow:hover { background: var(--a-brown); color: #fff; } .a-hero__dots { position: absolute; left: 0; right: 0; bottom: 28px; z-index: 3; display: flex; justify-content: center; gap: 10px; } .a-hero__dot { width: 44px; height: 24px; padding: 0; border: 0; background: none; cursor: pointer; display: grid; place-items: center; } .a-hero__dot span { display: block; width: 100%; height: 3px; border-radius: 3px; background: rgba(123, 74, 82, .25); overflow: hidden; position: relative; } .a-hero__dot span::after { content: ""; position: absolute; inset: 0; background: var(--a-brown); transform: scaleX(0); transform-origin: left; } .a-hero__dot.is-active span::after { animation: a-progress var(--a-delay, 6s) linear forwards; } .a-hero.is-paused .a-hero__dot.is-active span::after { animation-play-state: paused; } @keyframes a-progress { to { transform: scaleX(1); } } @media (max-width: 1024px) { .a-hero { height: auto; min-height: 640px; height: 92svh; max-height: 760px; } .a-slide { align-items: end; } .a-slide__img { object-position: 70% 20% !important; } .a-slide::before, .a-slide--dim::before { background: linear-gradient(to top, rgba(251, 241, 238, .98) 42%, rgba(251, 241, 238, .55) 62%, rgba(251, 241, 238, 0) 82%); } .a-hero__content { padding: 0 0 80px; text-align: left; } .a-hero__title { font-size: clamp(32px, 9vw, 42px); margin-bottom: 12px; } .a-hero__text { margin-bottom: 22px; } .a-hero__cta .a-btn { flex: 1 1 140px; padding-inline: 16px; } .a-hero__arrow { display: none; } .a-hero__dots { bottom: 24px; } } /* Grids */ .a-grid { display: grid; gap: 28px; } .a-grid--products { grid-template-columns: repeat(auto-fit, minmax(260px, 340px)); justify-content: center; } .a-grid--cats { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); max-width: 1000px; margin-inline: auto; } .a-grid--why { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); } .a-grid--2 { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); } .a-grid--reviews { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); } /* Product card */ .a-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--a-line); border-radius: var(--a-radius); overflow: hidden; transition: box-shadow .3s var(--a-ease), transform .3s var(--a-ease); } .a-card:hover { box-shadow: var(--a-shadow); transform: translateY(-4px); } .a-card__media { position: relative; display: block; aspect-ratio: 1; background: var(--a-tint); overflow: hidden; } .a-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--a-ease); } .a-card:hover .a-card__media img { transform: scale(1.04); } .a-badge { position: absolute; top: 14px; left: 14px; z-index: 1; padding: 6px 12px; border-radius: 999px; background: var(--a-wine); color: #fff; font: 700 11px var(--a-sans); letter-spacing: .12em; text-transform: uppercase; } .a-card__body { display: flex; flex-direction: column; gap: 6px; padding: 22px; flex: 1; } .a-card__cat { margin: 0; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--a-gold); } .a-card__title { margin: 0; font-size: 24px; } .a-card__title a { text-decoration: none; } .a-card__price { margin: 0; font-size: 18px; font-weight: 700; color: var(--a-wine); } .a-card__price del { color: #a3878d; font-weight: 400; margin-right: 6px; } .a-card__price ins { text-decoration: none; } .a-card__stock { margin: 0; font-size: 13px; } .a-card__stock.in { color: #3d7a3a; } .a-card__stock.out { color: var(--a-wine); } .a-card__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: auto; padding-top: 14px; } .a-card__actions .a-btn { padding-inline: 10px; font-size: 11px; } /* Category card */ .a-cat { position: relative; display: block; aspect-ratio: 4 / 3; border-radius: var(--a-radius); overflow: hidden; text-decoration: none; } .a-cat img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--a-ease); } .a-cat:hover img { transform: scale(1.05); } .a-cat__label { position: absolute; left: 16px; right: 16px; bottom: 16px; display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; background: rgba(255, 255, 255, .94); border-radius: 10px; } .a-cat__label strong { font: 600 24px var(--a-serif); } .a-cat__label em { font-style: normal; font-size: 13px; color: var(--a-brown); } /* Split */ .a-split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 6vw, 80px); align-items: center; } .a-split--rev .a-split__media { order: 2; } .a-split__media img { width: 100%; height: auto; border-radius: var(--a-radius); display: block; } .a-split__text p { margin: 18px 0 28px; } @media (max-width: 860px) { .a-split { grid-template-columns: 1fr; } .a-split--rev .a-split__media { order: 0; } } .a-chips { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; padding: 0; margin: 0; } .a-chips li { padding: 8px 16px; border: 1px solid rgba(255, 255, 255, .35); border-radius: 999px; font-size: 14px; } /* Reviews */ .a-review { margin: 0; padding: 28px; background: #fff; border: 1px solid var(--a-line); border-radius: var(--a-radius); } .a-stars { color: var(--a-gold); letter-spacing: 2px; } .a-review blockquote { margin: 12px 0 18px; font: 500 20px/1.5 var(--a-serif); } .a-review figcaption { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 14px; } .a-verified { color: #3d7a3a; } .a-empty { text-align: center; padding: 40px 24px; border: 1px dashed var(--a-line); border-radius: var(--a-radius); } .a-empty p { margin: 0 0 18px; font: 500 22px var(--a-serif); } /* Why */ .a-why { padding: 30px; background: #fff; border-radius: var(--a-radius); border: 1px solid var(--a-line); } .a-why > i { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--a-tint); color: var(--a-gold); font-size: 22px; } .a-why h3 { font-size: 24px; margin: 14px 0 8px; } .a-why p { margin: 0; color: var(--a-brown); } /* Accordion */ .a-accordion { display: grid; gap: 12px; } .a-acc { background: #fff; border: 1px solid var(--a-line); border-radius: 12px; } .a-acc summary { position: relative; list-style: none; cursor: pointer; padding: 20px 56px 20px 24px; font: 600 21px var(--a-serif); } .a-acc summary::-webkit-details-marker { display: none; } .a-acc summary::after { content: "\2b"; position: absolute; right: 24px; top: 50%; transform: translateY(-50%); font: 900 16px "Font Awesome 6 Free"; color: var(--a-gold); transition: transform .3s; } .a-acc[open] summary::after { transform: translateY(-50%) rotate(45deg); } .a-acc__body { padding: 0 24px 20px; color: var(--a-brown); } .a-acc__body p:first-child { margin-top: 0; } .a-acc__body h2 { display: none; } /* Page banner */ .a-banner { padding: clamp(56px, 9vw, 110px) 0; background: var(--a-tint); text-align: center; } .a-banner h1 { font-size: clamp(40px, 5vw, 64px); margin: 0; } /* Contact */ .a-contact { display: grid; grid-template-columns: 1fr 2fr; gap: 40px; } .a-contact__info { display: grid; gap: 20px; align-content: start; } .a-contact__form { padding: clamp(24px, 4vw, 44px); background: var(--a-tint); border-radius: var(--a-radius); } .a-contact__form h2 { margin-top: 0; font-size: 34px; } .a-contact__form input:not([type=submit]), .a-contact__form textarea, body.arvica .woocommerce form .input-text, body.arvica .woocommerce select { width: 100%; padding: 14px 16px; border: 1px solid var(--a-line); border-radius: 10px; background: #fff; font: inherit; } .a-contact__form input[type=submit] { background: var(--a-brown); color: #fff; border: 0; border-radius: 999px; padding: 14px 32px; font: 700 13px var(--a-sans); letter-spacing: .12em; text-transform: uppercase; cursor: pointer; } @media (max-width: 860px) { .a-contact { grid-template-columns: 1fr; } } /* WooCommerce notices */ body.arvica .woocommerce-message, body.arvica .woocommerce-info { border-radius: 12px; } body.arvica .woocommerce-message .button, body.arvica .woocommerce-info .button { min-height: 40px; padding: 10px 20px; margin-left: 12px; } /* Single product */ body.single-product .product .summary .price { color: var(--a-wine); font-size: 26px; font-weight: 700; } body.single-product form.cart { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; } body.single-product form.cart .arvica-buy-now { flex: 1 1 160px; } body.arvica .quantity { display: inline-flex !important; align-items: center; height: 48px; border: 1px solid var(--a-line); border-radius: 999px; background: #fff; overflow: hidden; } body.arvica .quantity input.qty { width: 48px !important; height: 46px; border: 0 !important; background: transparent !important; color: var(--a-ink) !important; text-align: center; font: 700 16px var(--a-sans); -moz-appearance: textfield; } body.arvica .quantity input.qty::-webkit-inner-spin-button { -webkit-appearance: none; } body.arvica .quantity .minus, body.arvica .quantity .plus { width: 40px; height: 46px; border: 0; background: transparent; color: var(--a-ink); font-size: 18px; cursor: pointer; } body.arvica .quantity .minus:hover, body.arvica .quantity .plus:hover { background: var(--a-tint); } body.single-product form.cart .single_add_to_cart_button { flex: 1 1 160px; } .a-assure { list-style: none; padding: 18px 0 0; margin: 18px 0 0; border-top: 1px solid var(--a-line); display: grid; gap: 8px; font-size: 14px; } .a-assure i { width: 22px; color: var(--a-gold); } .a-product-accordion { clear: both; max-width: 900px; margin: 56px auto; } body.single-product .woocommerce-product-gallery img { border-radius: var(--a-radius); } body.single-product .product_title { font-size: clamp(30px, 3.4vw, 46px) !important; line-height: 1.15 !important; } @media (max-width: 767px) { body.single-product div.product .woocommerce-product-gallery, body.single-product div.product .images, body.single-product div.product .summary { width: 100% !important; max-width: 100% !important; float: none !important; margin: 0 0 24px !important; padding: 0 !important; } body.single-product div.product { display: block !important; } } /* Footer */ .a-footer { background: var(--a-ink); color: #e7d3cd; padding: 72px 0 0; margin-top: 0; } .a-footer a { color: #e7d3cd; text-decoration: none; transition: color .2s; } .a-footer a:hover { color: var(--a-gold); } .a-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 40px; } .a-footer .custom-logo { max-height: 60px; width: auto; filter: brightness(0) invert(1); } .a-footer__tag { max-width: 280px; } .a-footer__h { color: #fff !important; font-size: 22px !important; margin: 0 0 16px; } .a-footer__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; } .a-footer__bottom { margin-top: 56px; padding: 24px 0; border-top: 1px solid rgba(255, 255, 255, .12); font-size: 13px; text-align: center; } @media (max-width: 860px) { .a-footer__grid { grid-template-columns: 1fr 1fr; } } @media (max-width: 520px) { .a-footer__grid { grid-template-columns: 1fr; } } /* Reveal */ .js .a-reveal { opacity: 0; transform: translateY(18px); transition: opacity .8s var(--a-ease), transform .8s var(--a-ease); } .js .a-reveal.is-in { opacity: 1; transform: none; } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; } .js .a-reveal { opacity: 1; transform: none; } } /* Before & after gallery */ .a-ba__track { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(240px, calc((100% - 60px) / 4)); gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 4px; } .a-ba__track::-webkit-scrollbar { display: none; } .a-ba__item { margin: 0; scroll-snap-align: start; border-radius: var(--a-radius); overflow: hidden; background: #fff; box-shadow: var(--a-shadow); } .a-ba__item img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; } .a-ba__nav { display: flex; justify-content: center; gap: 12px; margin-top: 28px; } .a-ba__btn { width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--a-brown); background: #fff; color: var(--a-brown); cursor: pointer; transition: background .2s, color .2s; } .a-ba__btn:hover { background: var(--a-brown); color: #fff; } .a-ba__note { margin: 18px 0 0; text-align: center; font-size: 13px; color: var(--a-brown); } @media (max-width: 760px) { .a-ba__track { grid-auto-columns: 78%; } } /* Restored Elementor sections sit edge to edge between our sections */ .a-el { clear: both; } /* Original footer, polished */ .a-site-footer { clear: both; border-top: 1px solid var(--a-line); } .a-site-footer .elementor-top-section { background: linear-gradient(180deg, #fbf1ee 0%, var(--a-tint) 100%) !important; padding-top: clamp(40px, 6vw, 72px) !important; } .a-site-footer .elementor-widget-wdt-logo img { max-height: 70px; width: auto; } .a-site-footer .elementor-widget-text-editor { color: var(--a-brown); line-height: 1.7; } .a-site-footer .elementor-widget-text-editor a { color: var(--a-wine); text-decoration: none; border-bottom: 1px solid transparent; transition: border-color .2s; } .a-site-footer .elementor-widget-text-editor a:hover { border-color: var(--a-wine); } .a-site-footer .elementor-icon-list-item a, .a-site-footer .elementor-icon-list-text { color: var(--a-ink) !important; transition: color .2s; } .a-site-footer .elementor-icon-list-item a:hover .elementor-icon-list-text { color: var(--a-wine) !important; } .a-site-footer .elementor-social-icon { width: 44px; height: 44px; display: inline-grid !important; place-items: center; background: var(--a-brown) !important; border-radius: 50%; transition: background .25s, transform .25s; } .a-site-footer .elementor-social-icon:hover { background: var(--a-wine) !important; transform: translateY(-3px); } .a-site-footer .elementor-social-icon i, .a-site-footer .elementor-social-icon svg { color: #fff !important; fill: #fff !important; font-size: 18px; } .a-site-footer hr, .a-site-footer .elementor-divider-separator { border-color: var(--a-line) !important; } /* ===== Single product: balanced layout ===== */ body.single-product #main > .container { width: min(1180px, 100% - 32px); max-width: none; margin-inline: auto; padding: 0; } body.single-product #primary { width: 100% !important; float: none !important; padding: clamp(32px, 5vw, 64px) 0 0 !important; margin: 0 !important; } body.single-product div.product { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: clamp(32px, 5vw, 72px); align-items: start; } body.single-product div.product > * { grid-column: 1 / -1; min-width: 0; } body.single-product div.product > .woocommerce-product-gallery { grid-column: 1; grid-row: 1; position: sticky; top: 108px; } body.single-product div.product > .summary { grid-column: 2; grid-row: 1; } body.single-product div.product .woocommerce-product-gallery, body.single-product div.product .summary { width: 100% !important; max-width: none !important; float: none !important; margin: 0 !important; padding: 0 !important; } /* Gallery */ body.single-product .woocommerce-product-gallery { opacity: 1 !important; } body.single-product .woocommerce-product-gallery .flex-viewport, body.single-product .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:only-child { border-radius: var(--a-radius); overflow: hidden; background: var(--a-tint); } body.single-product .woocommerce-product-gallery__image img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 0 !important; } body.single-product .woocommerce-product-gallery .flex-control-thumbs { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 14px 0 0 !important; padding: 0; list-style: none; } body.single-product .woocommerce-product-gallery .flex-control-thumbs li { width: auto !important; float: none !important; margin: 0 !important; } body.single-product .woocommerce-product-gallery .flex-control-thumbs img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 10px; border: 2px solid transparent; opacity: .65; cursor: pointer; transition: opacity .2s, border-color .2s; } body.single-product .woocommerce-product-gallery .flex-control-thumbs img:hover, body.single-product .woocommerce-product-gallery .flex-control-thumbs img.flex-active { opacity: 1; border-color: var(--a-gold); } body.single-product .woocommerce-product-gallery__trigger { top: 14px !important; right: 14px !important; width: 42px; height: 42px; border-radius: 50%; background: #fff; box-shadow: var(--a-shadow); display: grid !important; place-items: center; font-size: 0; z-index: 5; } body.single-product .woocommerce-product-gallery__trigger::before { content: "\f00e"; font: 900 16px "Font Awesome 6 Free"; color: var(--a-ink); position: static; border: 0; width: auto; height: auto; } body.single-product .woocommerce-product-gallery__trigger::after { display: none; } body.single-product .woocommerce-product-gallery .wdt-product-label, body.single-product .woocommerce-product-gallery [class*="pin"] { display: none !important; } /* Summary rhythm */ body.single-product .summary > * { margin-top: 0 !important; margin-bottom: 22px !important; } body.single-product .summary .product_title { margin-bottom: 12px !important; } body.single-product .summary .woocommerce-product-details__short-description p { margin: 0; line-height: 1.75; color: var(--a-brown); } body.single-product .summary form.cart { margin-bottom: 14px !important; padding: 22px 0; border-top: 1px solid var(--a-line); border-bottom: 1px solid var(--a-line); } body.single-product .summary .tinv-wraper { margin: 0 0 18px !important; } body.single-product .summary .tinv-wraper a { min-height: 0 !important; padding: 0 !important; background: none !important; border: 0 !important; color: var(--a-brown) !important; font-size: 13px !important; letter-spacing: .1em; } body.single-product .summary .product_meta { display: grid; gap: 6px; font-size: 14px; } body.single-product .summary .product_meta > span { display: block; } body.single-product .a-assure { margin-top: 0 !important; } /* Description / tabs */ .a-product-accordion { max-width: none; margin: clamp(48px, 7vw, 88px) 0 0; } .a-acc__body, .a-acc__body p, .a-acc__body li { line-height: 1.7 !important; } .a-acc__body p { margin: 0 0 12px !important; } .a-acc__body ul { margin: 0 0 16px; padding-left: 20px; } .a-acc__body li { margin: 0 0 4px !important; padding: 0 !important; } .a-acc__body table.shop_attributes { width: 100%; border-collapse: collapse; } .a-acc__body table.shop_attributes th, .a-acc__body table.shop_attributes td { padding: 12px 0; border-bottom: 1px solid var(--a-line); text-align: left; } /* Related products */ body.single-product .related.products { margin-top: clamp(56px, 8vw, 96px); } body.single-product .related.products > h2 { text-align: center; font-size: clamp(30px, 4vw, 44px); margin-bottom: 32px; } @media (max-width: 900px) { body.single-product div.product { grid-template-columns: 1fr; } body.single-product div.product > .woocommerce-product-gallery, body.single-product div.product > .summary { grid-column: 1; grid-row: auto; position: static; } body.single-product div.product > .woocommerce-product-gallery { margin-bottom: 28px !important; } } @media (max-width: 520px) { body.single-product form.cart .single_add_to_cart_button, body.single-product form.cart .arvica-buy-now { flex: 1 1 100%; } body.single-product .quantity { width: 100%; justify-content: space-between; } } .a-acc__body .a-desc-h { margin: 22px 0 10px; font: 700 12px var(--a-sans); letter-spacing: .18em; color: var(--a-wine); } .a-acc__body .a-desc-h:first-child { margin-top: 0; } body.single-product .woocommerce-product-gallery .featured-tag { display: none !important; } /* Gallery thumbnails: one swipeable row at every size */ body.single-product .woocommerce-product-gallery .flex-control-thumbs { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - 36px) / 4); overflow-x: auto; scrollbar-width: none; } body.single-product .woocommerce-product-gallery .flex-control-thumbs::-webkit-scrollbar { display: none; } body.single-product .woocommerce-product-gallery { height: auto !important; } /* Shop listing */ .a-shop { padding-top: clamp(32px, 5vw, 56px); } .a-filter { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: 28px; } .a-filter a { padding: 10px 22px; border: 1px solid var(--a-line); border-radius: 999px; text-decoration: none; font: 700 12px var(--a-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--a-brown); transition: all .2s; } .a-filter a:hover, .a-filter a.is-active { background: var(--a-brown); border-color: var(--a-brown); color: #fff; } .a-shop__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 28px; padding-bottom: 18px; border-bottom: 1px solid var(--a-line); } .a-shop__bar .woocommerce-result-count { margin: 0; color: var(--a-brown); font-size: 14px; } .a-shop__bar .woocommerce-ordering { margin: 0; } .a-shop__bar select { min-height: 44px; padding: 8px 40px 8px 16px; border: 1px solid var(--a-line); border-radius: 999px; background-color: #fff; font: inherit; } .a-grid--shop { justify-content: start; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); } @media (max-width: 600px) { .a-grid--shop, .a-grid--products { grid-template-columns: 1fr 1fr; gap: 14px; } .a-card__body { padding: 14px; } .a-card__title { font-size: 18px; } .a-card__price { font-size: 15px; } .a-card__actions { grid-template-columns: 1fr; gap: 8px; } .a-card__actions .a-btn { min-height: 40px; font-size: 10px; letter-spacing: .08em; } .a-shop__bar { justify-content: center; } } /* WooCommerce forces position:relative on the gallery; make the sticky offset apply only on desktop */ @media (min-width: 901px) { body.single-product div.product > .woocommerce-product-gallery { position: sticky !important; top: 108px !important; } } @media (max-width: 900px) { body.single-product div.product > .woocommerce-product-gallery { position: relative !important; top: auto !important; } } /* Slide with a square product photo: image on the right half, fading into the background */ .a-slide--half { background: linear-gradient(120deg, #fbefec 0%, #f3e1dc 100%); } .a-slide--half::before { display: none; } @media (min-width: 1025px) { .a-slide--half .a-slide__img { left: auto; right: 0; width: 58%; -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 28%); mask-image: linear-gradient(90deg, transparent 0%, #000 28%); } } /* Hero layering + reset parent button styles on slider controls */ .a-slide__img { z-index: 0; } .a-slide::before { z-index: 1; } body.arvica .a-hero__dot, body.arvica .a-hero__arrow { min-height: 0; padding: 0; text-transform: none; letter-spacing: 0; line-height: 1; } body.arvica .a-hero__dot { background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 0; } body.arvica .a-hero__arrow { border: 0 !important; } @media (max-width: 1024px) { .a-hero__content { max-width: 640px; margin-inline: 16px; } .a-hero__cta .a-btn { font-size: 12px; letter-spacing: .08em; white-space: nowrap; } } @media (min-width: 761px) and (max-width: 1024px) { .a-hero { min-height: 600px; height: 70vh; } .a-slide__img { object-position: 70% center !important; } } @media (max-width: 1024px) { .a-slide--half::before { display: block; } } @media (max-width: 1024px) { .a-slide::before, .a-slide--dim::before, .a-slide--half::before { background: linear-gradient(to top, rgba(251, 241, 238, .98) 48%, rgba(251, 241, 238, .7) 64%, rgba(251, 241, 238, 0) 84%); } } /* Hero headings: always two lines */ .a-hero__content > .a-hero__title { max-width: 660px; font-size: clamp(34px, 3.7vw, 56px); line-height: 1.12; text-wrap: balance; } @media (max-width: 1024px) { .a-hero__content > .a-hero__title { max-width: 600px; font-size: clamp(26px, 5.2vw, 44px); } } @media (max-width: 760px) { .a-hero__content > .a-hero__title { font-size: clamp(24px, 7.2vw, 32px); } } /* Slider progress bars: white track, black fill */ .a-hero__dot span { height: 4px; background: rgba(255, 255, 255, .95); box-shadow: 0 0 0 1px rgba(0, 0, 0, .18); } .a-hero__dot span::after { background: #000; } .a-hero__arrow { display: none !important; } /* ===== CTA banner + marquee ===== */ .a-cta { position: relative; overflow: hidden; isolation: isolate; min-height: clamp(560px, 82vh, 860px); display: flex; flex-direction: column; justify-content: center; color: #fff; background: #2a1a1f; } .a-cta__bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center; transform: scale(1.05); transition: transform 8s var(--a-ease); } .a-cta:hover .a-cta__bg { transform: scale(1); } .a-cta::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(42, 22, 30, .55) 0%, rgba(42, 22, 30, .62) 55%, rgba(42, 22, 30, .78) 100%); } .a-cta__inner { text-align: center; padding: clamp(80px, 10vw, 120px) 0 clamp(120px, 14vw, 170px); } .a-cta__eyebrow { display: inline-block; margin: 0 0 clamp(28px, 4vw, 48px); padding-bottom: 4px; border-bottom: 1px solid currentColor; font: 700 clamp(13px, 1.2vw, 16px) var(--a-sans); letter-spacing: .14em; text-transform: uppercase; color: #fff; } body.arvica .a-cta__title { max-width: 820px; margin: 0 auto 26px; color: #fff; font-family: var(--a-sans); font-weight: 700; font-size: clamp(36px, 5.4vw, 72px); line-height: 1.12; letter-spacing: -.01em; text-wrap: balance; text-shadow: 0 2px 24px rgba(0, 0, 0, .25); } .a-cta__text { max-width: 560px; margin: 0 auto clamp(32px, 4vw, 48px); font-size: clamp(16px, 1.5vw, 20px); line-height: 1.6; color: rgba(255, 255, 255, .92); text-wrap: balance; } .a-cta__btn { display: inline-flex; align-items: center; justify-content: center; min-width: 230px; min-height: 62px; padding: 16px 40px; background: var(--a-gold); color: #fff !important; font: 700 15px var(--a-sans); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; border-radius: 2px; box-shadow: 0 10px 30px rgba(0, 0, 0, .25); transition: background .25s, transform .25s, box-shadow .25s; } .a-cta__btn:hover { background: #fff; color: var(--a-ink) !important; transform: translateY(-2px); box-shadow: 0 14px 34px rgba(0, 0, 0, .3); } .a-marquee { position: absolute; left: 0; right: 0; bottom: clamp(20px, 3vw, 36px); overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); } .a-marquee__track { display: flex; width: max-content; animation: a-marquee 38s linear infinite; } .a-marquee:hover .a-marquee__track { animation-play-state: paused; } .a-marquee__group { display: flex; align-items: center; flex-shrink: 0; } .a-marquee span { padding: 0 clamp(20px, 2.6vw, 44px); white-space: nowrap; font: 700 clamp(24px, 3.4vw, 48px) / 1.2 var(--a-sans); color: #fff; letter-spacing: -.01em; } .a-marquee i { font-size: clamp(9px, 1vw, 14px); color: #fff; } @keyframes a-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } } @media (prefers-reduced-motion: reduce) { .a-marquee__track { animation: none; } } @media (max-width: 600px) { .a-cta { min-height: 560px; } .a-cta__inner { padding: 72px 0 120px; } .a-cta__btn { width: 100%; max-width: 320px; min-height: 56px; } .a-marquee__track { animation-duration: 26s; } } /* ===== Signature products: alternating split rows ===== */ .a-sig { padding-top: clamp(56px, 8vw, 104px); } .a-sig__head { margin-bottom: clamp(32px, 5vw, 56px); } .a-sig__row { display: grid; grid-template-columns: 64fr 36fr; align-items: center; min-height: clamp(420px, 42vw, 720px); background: #fff; } .a-sig__row + .a-sig__row { margin-top: 0; } .a-sig__media { display: block; height: 100%; min-height: inherit; overflow: hidden; background: var(--a-tint); } .a-sig__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--a-ease); } .a-sig__row:hover .a-sig__media img { transform: scale(1.04); } .a-sig__text { padding: clamp(32px, 5vw, 80px) clamp(24px, 4.5vw, 72px); } body.arvica .a-sig__title { margin: 0 0 22px; font-family: var(--a-sans); font-weight: 700; font-size: clamp(34px, 3.6vw, 58px); line-height: 1.1; letter-spacing: -.015em; color: var(--a-wine); text-wrap: balance; } .a-sig__title a { text-decoration: none; } .a-sig__meta { margin: 0 0 14px; font-size: clamp(16px, 1.25vw, 19px); color: #9a7f86; } .a-sig__meta del { opacity: .6; margin-right: 6px; } .a-sig__meta ins { text-decoration: none; } .a-sig__desc { margin: 0 0 clamp(26px, 3vw, 36px); font-size: clamp(16px, 1.3vw, 19px); line-height: 1.65; color: var(--a-ink); } .a-sig__btn { display: inline-flex; align-items: center; justify-content: center; min-width: min(100%, 340px); min-height: 60px; padding: 16px 32px; background: var(--a-gold); color: var(--a-ink) !important; font: 700 15px var(--a-sans); letter-spacing: .12em; text-transform: uppercase; text-decoration: none; transition: background .25s, color .25s, transform .25s; } .a-sig__btn:hover { background: var(--a-wine); color: #fff !important; transform: translateY(-2px); } /* Mirrored row */ .a-sig__row--rev { grid-template-columns: 36fr 64fr; } .a-sig__row--rev .a-sig__media { order: 2; } @media (max-width: 900px) { .a-sig__row, .a-sig__row--rev { grid-template-columns: 1fr; min-height: 0; } .a-sig__row--rev .a-sig__media { order: 0; } .a-sig__media { aspect-ratio: 4 / 3; height: auto; min-height: 0; } .a-sig__text { padding: 32px 16px 48px; } .a-sig__btn { width: 100%; } } /* ===== Before / after comparison ===== */ .a-compare { display: grid; grid-template-columns: 1fr 1fr; align-items: center; background: #f6e9e6; background: linear-gradient(135deg, #f6e9e6, #ecd8d3); } .a-compare__text { padding: clamp(40px, 6vw, 96px) clamp(16px, 5vw, 80px); } body.arvica .a-compare__text h2 { margin: 0 0 20px; font-size: clamp(34px, 4.2vw, 60px); } .a-compare__text > p:not(.a-eyebrow) { margin: 0 0 18px; max-width: 560px; color: var(--a-ink); line-height: 1.7; } .a-compare__list { list-style: none; margin: 0 0 32px; padding: 0; display: grid; gap: 10px; } .a-compare__list li { display: flex; align-items: center; gap: 12px; } .a-compare__list i { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--a-brown); color: #fff; font-size: 11px; flex-shrink: 0; } .a-compare__media { position: relative; height: 100%; min-height: clamp(380px, 46vw, 760px); overflow: hidden; user-select: none; touch-action: pan-y; } .a-compare__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; } .a-compare__img--before { clip-path: inset(0 calc(100% - var(--pos)) 0 0); } .a-compare__media::after { content: ""; position: absolute; top: 0; bottom: 0; left: var(--pos); width: 2px; margin-left: -1px; background: #fff; box-shadow: 0 0 12px rgba(0, 0, 0, .25); pointer-events: none; } .a-compare__handle { position: absolute; top: 50%; left: var(--pos); z-index: 2; display: grid; place-items: center; width: 64px; height: 64px; margin: -32px 0 0 -32px; border-radius: 50%; background: #fff; color: var(--a-ink); font-size: 18px; box-shadow: 0 6px 24px rgba(0, 0, 0, .25); pointer-events: none; transition: transform .2s; } .a-compare__media:hover .a-compare__handle, .a-compare__range:focus-visible ~ .a-compare__handle { transform: scale(1.08); } .a-compare__range:focus-visible + .a-compare__handle, .a-compare__media:focus-within .a-compare__handle { outline: 3px solid var(--a-gold); outline-offset: 3px; } .a-compare__label { position: absolute; top: 50%; z-index: 1; font: 700 14px var(--a-sans); letter-spacing: .3em; text-transform: uppercase; color: #fff; writing-mode: vertical-rl; transform: translateY(-50%); text-shadow: 0 1px 8px rgba(0, 0, 0, .35); pointer-events: none; } .a-compare__label--before { left: 22px; } .a-compare__label--after { right: 22px; } .a-compare__range { position: absolute; inset: 0; z-index: 3; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; -webkit-appearance: none; appearance: none; } .a-compare__range::-webkit-slider-thumb { -webkit-appearance: none; width: 64px; height: 100vh; } .a-compare__range::-moz-range-thumb { width: 64px; height: 100vh; border: 0; } @media (max-width: 900px) { .a-compare { grid-template-columns: 1fr; } .a-compare__media { order: -1; height: auto; min-height: 0; aspect-ratio: 1; } .a-compare__handle { width: 52px; height: 52px; margin: -26px 0 0 -26px; } .a-compare__text .a-btn { width: 100%; } } /* Product card: second image on hover */ .a-card__media .a-card__hover { position: absolute; inset: 0; opacity: 0; transition: opacity .6s var(--a-ease), transform .8s var(--a-ease); } .a-card:hover .a-card__media .a-card__hover, .a-card__media:focus-visible .a-card__hover { opacity: 1; } @media (hover: none) { .a-card__media .a-card__hover { display: none; } } /* ===== Customer photos marquee ===== */ .a-ugc { padding: clamp(64px, 9vw, 112px) 0; background: radial-gradient(120% 80% at 50% 0%, #fdf5f2 0%, var(--a-tint) 60%, #f3e2de 100%); overflow: hidden; } .a-ugc__head { margin-bottom: clamp(36px, 5vw, 56px); padding-inline: 16px; } .a-ugc__sub { margin: 14px auto 0; max-width: 520px; color: var(--a-brown); } .a-ugc__viewport { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); } .a-ugc__track { display: flex; width: max-content; animation: a-marquee 60s linear infinite; } .a-ugc__viewport:hover .a-ugc__track, .a-ugc__viewport:focus-within .a-ugc__track { animation-play-state: paused; } .a-ugc__group { display: flex; gap: clamp(14px, 1.6vw, 24px); margin: 0; padding: 12px 0 24px clamp(14px, 1.6vw, 24px); list-style: none; } .a-ugc__card { flex: 0 0 auto; width: clamp(200px, 19vw, 280px); } .a-ugc__card a { position: relative; display: block; aspect-ratio: 9 / 15; border-radius: 20px; overflow: hidden; background: #f1ddd8; box-shadow: 0 14px 40px rgba(42, 26, 31, .14); transition: transform .45s var(--a-ease), box-shadow .45s var(--a-ease); } .a-ugc__card a::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 55%, rgba(30, 22, 16, .55) 100%); pointer-events: none; } .a-ugc__card img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--a-ease); } .a-ugc__card a:hover, .a-ugc__card a:focus-visible { transform: translateY(-8px); box-shadow: 0 24px 50px rgba(42, 26, 31, .22); } .a-ugc__card a:hover img { transform: scale(1.05); } .a-ugc__tag { position: absolute; left: 12px; right: 12px; bottom: 12px; z-index: 1; display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-radius: 999px; background: rgba(255, 255, 255, .92); backdrop-filter: blur(6px); color: var(--a-ink); font: 700 12px var(--a-sans); letter-spacing: .04em; } .a-ugc__tag > i:first-child { color: var(--a-gold); } .a-ugc__go { margin-left: auto; font-size: 11px; color: var(--a-wine); transition: transform .25s; } .a-ugc__card a:hover .a-ugc__go { transform: translateX(3px); } @media (max-width: 600px) { .a-ugc__track { animation-duration: 45s; } .a-ugc__card { width: 62vw; } } /* ===== Product cards v2 ===== */ .a-grid--products { grid-template-columns: repeat(auto-fit, minmax(280px, 440px)); gap: clamp(20px, 3vw, 36px); } .a-card { border: 0; border-radius: 22px; background: #fff; box-shadow: 0 2px 0 var(--a-line), 0 18px 40px rgba(42, 26, 31, .07); transition: box-shadow .4s var(--a-ease), transform .4s var(--a-ease); } .a-card:hover { transform: translateY(-6px); box-shadow: 0 2px 0 var(--a-line), 0 28px 60px rgba(42, 26, 31, .14); } .a-card__media { margin: 10px 10px 0; border-radius: 16px; aspect-ratio: 1; } .a-card__media img { transition: transform .9s var(--a-ease), opacity .6s var(--a-ease); } .a-card:hover .a-card__media img { transform: scale(1.06); } .a-badge { top: 14px; left: 14px; padding: 7px 14px; background: rgba(255, 255, 255, .95); color: var(--a-wine); font-size: 10px; letter-spacing: .16em; box-shadow: 0 4px 14px rgba(0, 0, 0, .12); z-index: 2; } .a-card__peek { position: absolute; left: 50%; bottom: 16px; z-index: 2; display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 999px; background: rgba(42, 26, 31, .82); backdrop-filter: blur(6px); color: #fff; font: 700 11px var(--a-sans); letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; opacity: 0; transform: translate(-50%, 10px); transition: opacity .35s var(--a-ease), transform .35s var(--a-ease); } .a-card:hover .a-card__peek, .a-card__media:focus-visible .a-card__peek { opacity: 1; transform: translate(-50%, 0); } .a-card__body { gap: 8px; padding: 22px 24px 24px; } .a-card__top { display: flex; justify-content: space-between; align-items: center; gap: 10px; } .a-card__cat { font-weight: 700; font-size: 11px; letter-spacing: .18em; } .a-card__stock { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; } .a-card__stock::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; } body.arvica .a-card__title { margin: 4px 0 0; font-family: var(--a-sans); font-weight: 700; font-size: clamp(19px, 1.6vw, 23px); line-height: 1.25; letter-spacing: -.005em; color: var(--a-ink); } .a-card__title a:hover { color: var(--a-wine); } .a-card__price { font-size: 20px; } .a-card__actions { display: flex; gap: 10px; padding-top: 16px; } .a-card__actions .a-btn { flex: 1; min-height: 50px; gap: 10px; font-size: 12px; padding-inline: 18px; } .a-card__actions .a-btn i { font-size: 14px; } .a-card__view { flex: 0 0 50px; display: grid; place-items: center; height: 50px; border: 1px solid var(--a-line); border-radius: 50%; color: var(--a-ink); text-decoration: none; transition: background .25s, color .25s, border-color .25s, transform .25s; } .a-card__view:hover { background: var(--a-wine); border-color: var(--a-wine); color: #fff; transform: rotate(-45deg); } @media (hover: none) { .a-card__peek { display: none; } } @media (max-width: 600px) { .a-card { border-radius: 16px; } .a-card__media { margin: 6px 6px 0; border-radius: 12px; } .a-card__body { padding: 14px; } .a-card__top { flex-direction: column; align-items: flex-start; gap: 4px; } body.arvica .a-card__title { font-size: 16px; } .a-card__price { font-size: 16px; } .a-card__actions .a-btn { min-height: 44px; font-size: 10px; padding-inline: 10px; gap: 6px; } .a-card__view { flex-basis: 44px; height: 44px; } .a-badge { font-size: 9px; padding: 5px 10px; } } /* ===== Product feature (Skin Polish) ===== */ .a-feature { position: relative; padding: clamp(64px, 9vw, 120px) 0; background: linear-gradient(135deg, #341c24 0%, #5a2f3a 55%, #a3485a 130%); color: #f6e7e6; overflow: hidden; isolation: isolate; } .a-feature::before { content: ""; position: absolute; width: 60vw; height: 60vw; max-width: 760px; max-height: 760px; left: -12vw; top: 50%; transform: translateY(-50%); border-radius: 50%; background: radial-gradient(circle, rgba(200, 162, 122, .28), rgba(200, 162, 122, 0) 68%); z-index: -1; } .a-feature__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(36px, 6vw, 96px); align-items: center; } .a-feature__media { position: relative; } .a-feature__media img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 28px 28px 200px 28px; box-shadow: 0 40px 80px rgba(0, 0, 0, .35); } .a-feature__badge { position: absolute; left: -14px; bottom: 36px; display: inline-flex; align-items: center; gap: 10px; padding: 14px 22px; border-radius: 999px; background: #fff; color: var(--a-ink); font: 700 12px var(--a-sans); letter-spacing: .14em; text-transform: uppercase; box-shadow: 0 16px 36px rgba(0, 0, 0, .25); } .a-feature__badge i { color: var(--a-gold); } .a-feature .a-eyebrow { color: var(--a-gold); } body.arvica .a-feature h2 { margin: 0 0 18px; color: #fff; font-size: clamp(34px, 4.2vw, 60px); } .a-feature__lead { margin: 0 0 clamp(28px, 3.5vw, 40px); max-width: 560px; font-size: clamp(16px, 1.3vw, 18px); line-height: 1.7; color: rgba(246, 231, 230, .85); } .a-feature__list { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 0 0 clamp(30px, 4vw, 44px); padding: 0; list-style: none; } .a-feature__list li { display: flex; gap: 14px; align-items: flex-start; padding: 18px; border: 1px solid rgba(255, 255, 255, .1); border-radius: 16px; background: rgba(255, 255, 255, .04); transition: background .3s, border-color .3s, transform .3s; } .a-feature__list li:hover { background: rgba(255, 255, 255, .08); border-color: rgba(200, 162, 122, .45); transform: translateY(-3px); } .a-feature__icon { flex: 0 0 44px; display: grid; place-items: center; height: 44px; border-radius: 12px; background: rgba(200, 162, 122, .16); color: var(--a-gold); font-size: 17px; } .a-feature__list strong { display: block; margin-bottom: 4px; color: #fff; font-size: 15px; } .a-feature__list li span:last-child { font-size: 13.5px; line-height: 1.55; color: rgba(246, 231, 230, .72); } .a-feature__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; } .a-feature .a-btn--solid { background: var(--a-gold); border-color: var(--a-gold); color: var(--a-ink) !important; } .a-feature .a-btn--solid:hover { background: #fff; border-color: #fff; } .a-feature__contact { display: inline-flex; align-items: center; gap: 12px; color: #fff; text-decoration: none; } .a-feature__contact i { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: rgba(255, 255, 255, .08); color: var(--a-gold); transition: background .25s, color .25s; } .a-feature__contact:hover i { background: var(--a-gold); color: var(--a-ink); } .a-feature__contact small { display: block; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(246, 231, 230, .6); } .a-feature__contact span { font-weight: 700; font-size: 15px; } @media (max-width: 960px) { .a-feature__grid { grid-template-columns: 1fr; } .a-feature__media { max-width: 520px; margin-inline: auto; width: 100%; } .a-feature__media img { border-radius: 24px 24px 120px 24px; } .a-feature__badge { left: 12px; bottom: 20px; } } @media (max-width: 560px) { .a-feature__list { grid-template-columns: 1fr; } .a-feature__actions .a-btn { width: 100%; } } /* ===== Customer photos: swipeable slider ===== */ .a-ugc__slider { position: relative; } .a-ugc__viewport { display: flex; gap: clamp(14px, 1.6vw, 24px); margin: 0; padding: 12px max(16px, calc((100vw - 1180px) / 2)) 28px; list-style: none; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: max(16px, calc((100vw - 1180px) / 2)); scrollbar-width: none; cursor: grab; -webkit-mask-image: none; mask-image: none; } .a-ugc__viewport::-webkit-scrollbar { display: none; } .a-ugc__viewport.is-dragging { cursor: grabbing; scroll-snap-type: none; scroll-behavior: auto; } .a-ugc__viewport.is-dragging a { pointer-events: none; } .a-ugc__viewport:focus-visible { outline: 2px solid var(--a-wine); outline-offset: -2px; } .a-ugc__card { scroll-snap-align: start; user-select: none; } .a-ugc__card img { -webkit-user-drag: none; } .a-ugc__tag > i:first-child { color: var(--a-gold); font-size: 11px; } .a-ugc__nav { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 14px; padding-inline: 16px; } .a-ugc__btn { display: grid; place-items: center; width: 48px; height: 48px; padding: 0; border: 1px solid var(--a-brown); border-radius: 50%; background: #fff; color: var(--a-brown); cursor: pointer; transition: background .2s, color .2s, transform .2s; } .a-ugc__btn:hover { background: var(--a-brown); color: #fff; } .a-ugc__bar { width: min(240px, 40vw); height: 3px; border-radius: 3px; background: rgba(123, 74, 82, .18); overflow: hidden; } .a-ugc__bar span { display: block; height: 100%; background: var(--a-ink); transform-origin: left; transform: scaleX(.08); transition: transform .3s var(--a-ease); } @media (max-width: 600px) { .a-ugc__card { width: 68vw; } } /* Elementor: our section widgets run edge to edge */ .elementor-widget[class*="elementor-widget-arvica-"] > .elementor-widget-container { margin: 0; padding: 0; } .elementor-section:has(> .elementor-container .elementor-widget[class*="elementor-widget-arvica-"]) > .elementor-container { max-width: none; } /* Customer photos: no arrows / progress bar */ .a-ugc__nav { display: none !important; } /* Signature rows: separate the products and swap to a second image on hover */ .a-sig__row + .a-sig__row { margin-top: clamp(48px, 7vw, 104px); } .a-sig__media { position: relative; } .a-sig__media .a-sig__hover { position: absolute; inset: 0; opacity: 0; transition: opacity .7s var(--a-ease), transform 1.2s var(--a-ease); } .a-sig__row:hover .a-sig__media .a-sig__hover { opacity: 1; } @media (hover: none) { .a-sig__media .a-sig__hover { display: none; } } @media (max-width: 900px) { .a-sig__row + .a-sig__row { margin-top: 24px; } } /* Hover swap only when the image itself is hovered */ .a-sig__row:hover .a-sig__media .a-sig__hover { opacity: 0; } .a-sig__row:hover .a-sig__media img { transform: none; } .a-sig__media:hover .a-sig__hover, .a-sig__media:focus-visible .a-sig__hover { opacity: 1 !important; } .a-sig__media:hover img { transform: scale(1.04) !important; } .a-card:hover .a-card__media .a-card__hover { opacity: 0; } .a-card:hover .a-card__media img { transform: none; } .a-card__media:hover .a-card__hover, .a-card__media:focus-visible .a-card__hover { opacity: 1 !important; } .a-card__media:hover img { transform: scale(1.06) !important; } .a-card:hover .a-card__peek { opacity: 0; transform: translate(-50%, 10px); } .a-card__media:hover .a-card__peek { opacity: 1; transform: translate(-50%, 0); } .a-ba__nav { display: none !important; } /* ===================== Product page v2 ===================== */ body.single-product #main > .container { width: 100% !important; max-width: none !important; padding: 0 !important; } body.single-product #primary { padding: 0 !important; } body.single-product div.a-pdp { display: block !important; } .a-pdp__crumbs { padding: 22px 0 18px; } .a-pdp__crumbs .woocommerce-breadcrumb { margin: 0; font-size: 13px; color: #9a7f86; } .a-pdp__crumbs .woocommerce-breadcrumb a { color: #9a7f86; text-decoration: none; } .a-pdp__crumbs .woocommerce-breadcrumb a:hover { color: var(--a-wine); } .a-pdp__crumbs .woocommerce-breadcrumb i { margin: 0 10px; font-size: 9px; opacity: .6; } .a-pdp__top { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(32px, 4.5vw, 72px); align-items: start; padding-bottom: clamp(56px, 8vw, 96px); } /* Gallery grid */ .a-pdp-gallery__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; } .a-pdp-gallery__item { position: relative; display: block; padding: 0; border: 0; border-radius: 18px; overflow: hidden; background: var(--a-tint); cursor: zoom-in; aspect-ratio: 1; } .a-pdp-gallery__item:first-child { grid-column: 1 / -1; } .a-pdp-gallery[data-count="2"] .a-pdp-gallery__item:nth-child(2) { grid-column: 1 / -1; } .a-pdp-gallery__item img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--a-ease); } .a-pdp-gallery__item:hover img { transform: scale(1.04); } .a-pdp-gallery__zoom { position: absolute; right: 14px; bottom: 14px; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: rgba(255, 255, 255, .92); color: var(--a-ink); box-shadow: var(--a-shadow); opacity: 0; transform: translateY(6px); transition: opacity .3s, transform .3s; } .a-pdp-gallery__item:hover .a-pdp-gallery__zoom, .a-pdp-gallery__item:focus-visible .a-pdp-gallery__zoom { opacity: 1; transform: none; } .a-pdp-gallery__dots { display: none; } /* Summary (sticky buy box) */ .a-pdp__summary { position: sticky; top: 104px; } body.single-product .a-pdp__summary > * { margin: 0 0 18px !important; } body.single-product .a-pdp__summary .product_title { font-family: var(--a-sans) !important; font-weight: 700 !important; font-size: clamp(28px, 2.6vw, 40px) !important; line-height: 1.15 !important; letter-spacing: -.01em; color: var(--a-ink); text-transform: none; margin-bottom: 10px !important; } body.single-product .a-pdp__summary .woocommerce-product-rating { display: flex; align-items: center; gap: 8px; font-size: 14px; } body.single-product .a-pdp__summary .price { display: flex; align-items: baseline; gap: 10px; font-size: 26px !important; font-weight: 700; color: var(--a-wine) !important; } body.single-product .a-pdp__summary .price del { font-size: 18px; color: #a3878d; font-weight: 400; } body.single-product .a-pdp__summary .price ins { text-decoration: none; } body.single-product .a-pdp__summary .woocommerce-product-details__short-description { padding-bottom: 20px; border-bottom: 1px solid var(--a-line); } body.single-product .a-pdp__summary .woocommerce-product-details__short-description p { color: var(--a-brown); line-height: 1.75; } body.single-product .a-pdp__summary form.cart { display: grid !important; grid-template-columns: auto 1fr; gap: 12px !important; padding: 0 !important; border: 0 !important; margin-bottom: 10px !important; } body.single-product .a-pdp__summary form.cart .quantity { grid-column: 1; } body.single-product .a-pdp__summary form.cart .single_add_to_cart_button { grid-column: 2; width: 100%; min-height: 52px; border-radius: 999px; } body.single-product .a-pdp__summary form.cart .arvica-buy-now { grid-column: 1 / -1; width: 100%; min-height: 52px; border-radius: 999px; background: transparent; border: 1.5px solid var(--a-ink); color: var(--a-ink) !important; } body.single-product .a-pdp__summary form.cart .arvica-buy-now:hover { background: var(--a-ink); color: #fff !important; } body.single-product .a-pdp__summary .tinv-wraper { margin: 0 0 18px !important; } body.single-product .a-pdp__summary .compare, body.single-product .a-pdp__summary .yith-wcqv-button { display: none !important; } body.single-product .a-pdp__summary .product_meta { display: flex !important; flex-wrap: wrap; gap: 6px 22px; font-size: 13px; color: #9a7f86; } body.single-product .a-pdp__summary .product_meta a { color: var(--a-ink); } /* Trust row */ body.single-product .a-pdp__summary .a-assure { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 0 !important; border: 0; } body.single-product .a-pdp__summary .a-assure li { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 14px 8px; border: 1px solid var(--a-line); border-radius: 14px; text-align: center; font-size: 12px; line-height: 1.35; } body.single-product .a-pdp__summary .a-assure li i { width: auto; font-size: 18px; color: var(--a-gold); } body.single-product .a-pdp__summary .a-assure a { color: var(--a-ink); text-decoration: none; } /* Accordions in the summary */ .a-pdp-acc { gap: 0; border-top: 1px solid var(--a-line); } .a-pdp-acc .a-acc { border: 0; border-bottom: 1px solid var(--a-line); border-radius: 0; background: transparent; } .a-pdp-acc .a-acc summary { padding: 18px 40px 18px 0; font: 700 13px var(--a-sans); letter-spacing: .14em; text-transform: uppercase; } .a-pdp-acc .a-acc summary::after { right: 4px; } .a-pdp-acc .a-acc__body { padding: 0 0 20px; font-size: 15px; } .a-pdp-acc .a-acc__body a { color: var(--a-wine); } /* Perfect for */ .a-perfect { padding: clamp(56px, 8vw, 96px) 0; background: linear-gradient(180deg, #fbefec, var(--a-tint)); } body.arvica .a-perfect__title { display: flex; align-items: center; gap: 24px; margin: 0 0 clamp(36px, 5vw, 56px); font-family: var(--a-sans); font-size: clamp(24px, 2.4vw, 32px); font-weight: 700; text-align: center; } .a-perfect__title::before, .a-perfect__title::after { content: ""; flex: 1; height: 1px; background: rgba(42, 26, 31, .25); } .a-perfect__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: clamp(20px, 3vw, 40px); margin: 0; padding: 0; list-style: none; } .a-perfect__list li { display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; font-weight: 700; font-size: 16px; line-height: 1.35; color: var(--a-ink); } .a-perfect__icon { display: grid; place-items: center; width: 92px; height: 92px; border-radius: 50%; background: #fff; border: 2px solid var(--a-wine); color: var(--a-wine); font-size: 30px; box-shadow: 0 10px 30px rgba(163, 72, 90, .12); transition: transform .3s var(--a-ease), background .3s, color .3s; } .a-perfect__list li:hover .a-perfect__icon { transform: translateY(-4px); background: var(--a-wine); color: #fff; } /* Reviews */ .a-reviews { padding: clamp(56px, 8vw, 96px) 0; } .a-reviews__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px; padding-bottom: 24px; border-bottom: 1px solid var(--a-line); } body.arvica .a-reviews__head h2 { margin: 0 0 10px; font-family: var(--a-sans); font-weight: 700; font-size: clamp(26px, 2.6vw, 36px); } .a-reviews__score { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 0; color: var(--a-brown); } .a-reviews__score strong { font-size: 30px; color: var(--a-ink); } .a-stars { display: inline-flex; gap: 3px; color: var(--a-gold); font-size: 15px; letter-spacing: 0; } .a-reviews__score--empty .a-stars { color: #e3cfc9; } .a-reviews__write { gap: 10px; } .a-reviews__form { margin-top: 28px; padding: clamp(22px, 3vw, 36px); border-radius: 20px; background: var(--a-tint); } .a-reviews__form .comment-reply-title { display: block; margin: 0 0 18px; font: 700 22px var(--a-sans); } .a-reviews__form form { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; } .a-reviews__form .comment-form-rating, .a-reviews__form .comment-form-comment, .a-reviews__form .form-submit, .a-reviews__form .comment-form-cookies-consent, .a-reviews__form .comment-notes { grid-column: 1 / -1; } .a-reviews__form label { display: block; margin-bottom: 6px; font-weight: 700; font-size: 13px; } .a-reviews__form input[type=text], .a-reviews__form input[type=email], .a-reviews__form textarea, .a-reviews__form select { width: 100%; padding: 14px 16px; border: 1px solid var(--a-line); border-radius: 12px; background: #fff; font: inherit; } .a-reviews__form p.stars a { color: var(--a-gold); } .a-reviews__note { margin-top: 18px; color: var(--a-brown); } .a-reviews__photos { margin-top: 32px; } .a-reviews__photos h3 { margin: 0 0 14px; font: 700 13px var(--a-sans); letter-spacing: .16em; text-transform: uppercase; color: var(--a-brown); } .a-reviews__photos ul { display: flex; gap: 12px; margin: 0; padding: 0 0 6px; list-style: none; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; } .a-reviews__photos li { flex: 0 0 auto; scroll-snap-align: start; } .a-reviews__photo { display: block; width: clamp(130px, 13vw, 170px); aspect-ratio: 3 / 4; padding: 0; border: 0; border-radius: 14px; overflow: hidden; cursor: zoom-in; background: var(--a-tint); } .a-reviews__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--a-ease); } .a-reviews__photo:hover img { transform: scale(1.06); } .a-reviews__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 18px; margin-top: 32px; } .a-review-card { padding: 22px; border: 1px solid var(--a-line); border-radius: 18px; background: #fff; } .a-review-card header { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 12px 0 10px; font-size: 14px; } .a-review-card time { margin-left: auto; font-size: 12px; color: #9a7f86; } .a-review-card p { margin: 0; line-height: 1.65; color: var(--a-ink); } .a-verified-badge { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: 999px; background: #e7f3e6; color: #2f6b2c; font-size: 11px; font-weight: 700; } .a-related { background: var(--a-tint); } /* Sticky add-to-cart bar */ .a-stickybar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; background: rgba(255, 255, 255, .97); backdrop-filter: blur(10px); border-top: 1px solid var(--a-line); box-shadow: 0 -10px 30px rgba(42, 26, 31, .08); transform: translateY(110%); transition: transform .35s var(--a-ease); } .a-stickybar.is-visible { transform: none; } .a-stickybar__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 0; } .a-stickybar__product { display: flex; align-items: center; gap: 14px; min-width: 0; } .a-stickybar__product img { width: 52px; height: 52px; border-radius: 10px; object-fit: cover; } .a-stickybar__product strong { display: block; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .a-stickybar__product span { font-size: 14px; font-weight: 700; color: var(--a-wine); } .a-stickybar__btn { gap: 10px; min-height: 48px; flex-shrink: 0; } /* Lightbox */ .a-lightbox { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; background: rgba(26, 14, 19, .92); } .a-lightbox[hidden] { display: none; } .a-lightbox__img { max-width: min(92vw, 1100px); max-height: 86vh; object-fit: contain; border-radius: 10px; } .a-lightbox__close, .a-lightbox__nav { position: absolute; display: grid; place-items: center; width: 52px; height: 52px; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .12); color: #fff; font-size: 20px; cursor: pointer; transition: background .2s; } .a-lightbox__close:hover, .a-lightbox__nav:hover { background: rgba(255, 255, 255, .25); } .a-lightbox__close { top: 18px; right: 18px; } .a-lightbox__nav[data-dir="-1"] { left: 18px; } .a-lightbox__nav[data-dir="1"] { right: 18px; } .a-lightbox__count { position: absolute; bottom: 18px; left: 50%; transform: translateX(-50%); color: rgba(255, 255, 255, .8); font-size: 13px; letter-spacing: .1em; } @media (max-width: 960px) { .a-pdp__top { grid-template-columns: 1fr; } .a-pdp__summary { position: static; } .a-pdp-gallery { margin-inline: -16px; } .a-pdp-gallery__grid { display: flex; gap: 0; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; } .a-pdp-gallery__grid::-webkit-scrollbar { display: none; } .a-pdp-gallery__item, .a-pdp-gallery__item:first-child { flex: 0 0 100%; border-radius: 0; aspect-ratio: 1; scroll-snap-align: center; } .a-pdp-gallery__dots { display: flex; justify-content: center; gap: 6px; margin-top: 12px; } .a-pdp-gallery__dots span { width: 7px; height: 7px; border-radius: 50%; background: #e3cfc9; transition: width .3s, background .3s; } .a-pdp-gallery__dots span.is-active { width: 22px; border-radius: 4px; background: var(--a-ink); } .a-pdp-gallery__zoom { opacity: 1; transform: none; } } @media (max-width: 600px) { .a-reviews__form form { grid-template-columns: 1fr; } .a-reviews__head .a-reviews__write { width: 100%; } .a-stickybar__product strong { font-size: 13px; } .a-stickybar__btn { padding-inline: 16px; font-size: 11px; } .a-perfect__list { grid-template-columns: 1fr 1fr; } .a-perfect__icon { width: 76px; height: 76px; font-size: 24px; } .a-perfect__list li { font-size: 14px; } } /* Parent theme styles every