/* Theme Name: Hoodies Land Theme URI: https://websites.reinahouse.digital/templates/hoodie-01 Author: REINA HOUSE DIGITAL Author URI: https://www.reinahouse.digital Description: A bold streetwear block theme for hoodie and apparel brands: full-screen hero slider, huge titles, a grey marquee, shop by colour with scrolling bands on every photo, bestsellers, a lookbook, campaign banner, reviews, journal, contact page with an enquiry form, FAQ page and a full WooCommerce shop. Retina-ready in black, white and grey. Requires at least: 6.5 Tested up to: 7.1 Requires PHP: 7.4 Version: 1.0.0 License: GNU General Public License v2 or later License URI: https://www.gnu.org/licenses/gpl-2.0.html Text Domain: hoodies-land Tags: e-commerce, block-patterns, full-site-editing, one-column, custom-colors, editor-style, blog */ /* ========================================================================== Hoodies Land: clean, bright and botanical. White and warm cream, black type and neutral beige accents. Very large Inter Tight titles with Instrument Serif italic accent words, rounded pill buttons, scrolling bands on the photos. Retina: photos are supplied at two or more times their displayed size, rules are drawn as 1px hairlines and every icon is vector. ========================================================================== */ :root { --hl-grey: #D4D4D4; --hl-ink2: #111111; --hl-gold: #D4D4D4; --hl-black: #111111; --hl-ink: #1C1A17; --hl-white: #FFFFFF; --hl-cream: #F5F5F5; --hl-sand: #EBEBEB; --hl-line: #E5E5E5; --hl-line-dark: rgba(255, 255, 255, .16); --hl-serif: var(--wp--preset--font-family--serif); --hl-sans: var(--wp--preset--font-family--sans); --hl-cond: var(--wp--preset--font-family--condensed); --hl-ease: cubic-bezier(.2, .7, .1, 1); } html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; } body { background: var(--hl-white); } ::selection { background: var(--hl-grey); color: #fff; } img { image-rendering: auto; } a { text-underline-offset: .2em; text-decoration-thickness: 1px; } :where(.wp-site-blocks) > * { margin-block-start: 0; } .wp-site-blocks > main { margin-top: 0; } /* accent words: Noto Serif Display Extra Condensed, as in Pro Wig Store's titles */ h1 em, h2 em, h3 em, .hl-title em { font-family: var(--hl-cond); font-style: normal; font-weight: 500; font-stretch: 62.5%; font-variation-settings: 'wdth' 62.5; color: var(--hl-ink2); letter-spacing: -.01em; font-size: 1.3em; line-height: .9; } /* ---------- type helpers ---------- */ .is-style-kicker, .hl-kicker { font-family: var(--hl-sans) !important; font-size: .74rem !important; font-weight: 600 !important; letter-spacing: .3em !important; text-transform: uppercase; color: var(--hl-grey); margin-bottom: 1rem !important; } .is-style-kicker::before { content: ""; display: inline-block; width: 26px; height: 1px; margin: 0 .9em .28em 0; background: currentColor; vertical-align: middle; } .has-text-align-center.is-style-kicker::after { content: ""; display: inline-block; width: 26px; height: 1px; margin: 0 0 .28em .9em; background: currentColor; vertical-align: middle; } .hl-sans { display: block; font-family: var(--hl-sans); font-weight: 700; font-style: normal; text-transform: uppercase; letter-spacing: -.035em; line-height: .9; } .hl-display { font-size: clamp(3rem, 9vw, 8.6rem) !important; line-height: .92 !important; letter-spacing: -.03em; margin: 0; } .hl-display .hl-sans { font-size: .62em; letter-spacing: -.045em; } .hl-lead { font-size: clamp(1.05rem, 1.4vw, 1.22rem) !important; line-height: 1.7; max-width: 34rem; } .hl-title { margin-bottom: clamp(2rem, 4vw, 3.4rem) !important; } .hl-title h2 { margin: 0; } .hl-title .hl-lead { margin: 1.1rem auto 0; } .hl-title.is-left { text-align: left; } .hl-split-title { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1.2rem 3rem; } .hl-split-title > * { margin: 0 !important; } .hl-split-title .hl-lead { max-width: 26rem; } .hl-hairline { border-top: 1px solid var(--hl-line); } .hl-num { font-family: var(--hl-serif); font-style: italic; color: var(--hl-grey); font-size: 1.2rem; } /* ---------- buttons ---------- */ .wp-block-button__link { transition: background .35s var(--hl-ease), color .35s var(--hl-ease), border-color .35s var(--hl-ease), transform .35s var(--hl-ease); } .wp-block-button__link:hover { transform: translateY(-2px); } .wp-block-button.is-style-outline > .wp-block-button__link { background: transparent; color: var(--hl-black); border: 1px solid var(--hl-black); padding: calc(1.1rem - 1px) calc(2.2rem - 1px); } .wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--hl-black); color: #fff; } .wp-block-button.is-style-beige > .wp-block-button__link { background: var(--hl-grey); color: #fff; } .wp-block-button.is-style-beige > .wp-block-button__link:hover { background: var(--hl-black); } .wp-block-button.is-style-light > .wp-block-button__link { background: #fff; color: var(--hl-black); } .wp-block-button.is-style-light > .wp-block-button__link:hover { background: var(--hl-grey); color: #fff; } .wp-block-button.is-style-ghost-light > .wp-block-button__link { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, .6); padding: calc(1.1rem - 1px) calc(2.2rem - 1px); } .wp-block-button.is-style-ghost-light > .wp-block-button__link:hover { background: #fff; color: var(--hl-black); } .wp-block-button.is-style-link > .wp-block-button__link { background: none; color: var(--hl-black); padding: .4rem 0; border-bottom: 1px solid var(--hl-grey); } .wp-block-button.is-style-link > .wp-block-button__link::after { content: " →"; color: var(--hl-grey); } /* ---------- announcement bar + header ---------- */ .hl-topbar { background: var(--hl-black); color: #fff; text-align: center; font-size: .72rem; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; } .hl-topbar p { margin: 0; } .hl-topbar p::before, .hl-topbar p::after { content: "✦"; color: var(--hl-gold); margin: 0 1em; font-size: .9em; } .hl-header { position: sticky; top: 0; z-index: 50; background: rgba(255, 255, 255, .94); -webkit-backdrop-filter: saturate(160%) blur(14px); backdrop-filter: saturate(160%) blur(14px); border-bottom: 1px solid var(--hl-line); } .admin-bar .hl-header { top: 32px; } .hl-header-row { display: grid !important; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem; } .hl-header-row > .hl-nav { justify-self: start; } .hl-header-row > .hl-brand { justify-self: center; text-align: center; } .hl-header-row > .hl-header-tools { justify-self: end; } .hl-logo { margin: 0 !important; line-height: 1; } .hl-logo a { text-decoration: none; color: var(--hl-black); display: inline-flex; align-items: baseline; gap: .35em; white-space: nowrap; } .hl-logo b { font-family: var(--hl-sans); font-weight: 700; font-size: clamp(1.05rem, 1.6vw, 1.32rem); letter-spacing: .32em; margin-right: -.32em; } .hl-logo i { font-family: var(--hl-serif); font-style: italic; font-weight: 500; font-size: clamp(1.3rem, 2vw, 1.65rem); color: var(--hl-grey); letter-spacing: 0; } .hl-logo-sub { margin: .3rem 0 0 !important; font-size: .58rem !important; letter-spacing: .42em; text-transform: uppercase; color: var(--hl-black); } .hl-nav .wp-block-navigation__container { flex-wrap: nowrap !important; } .hl-nav .wp-block-navigation-item__content { white-space: nowrap; font-size: .74rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; position: relative; } .hl-nav .wp-block-navigation-item__content::after { content: ""; position: absolute; left: 0; right: 0; bottom: -6px; height: 1px; background: var(--hl-grey); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--hl-ease); } .hl-nav .wp-block-navigation-item__content:hover::after { transform: scaleX(1); } .hl-nav .wp-block-navigation-item__content:hover { color: var(--hl-grey); } .hl-header-tools { gap: 1rem !important; } .hl-btn-sm .wp-block-button__link { padding: .85rem 1.3rem !important; font-size: .66rem !important; background: var(--hl-grey); } .hl-btn-sm .wp-block-button__link:hover { background: var(--hl-black); } .rh-drawer .hl-logo a, .rh-drawer .hl-logo b { color: #fff; } /* ---------- marquee ---------- */ .hl-marquee { overflow: hidden; white-space: nowrap; border-block: 1px solid var(--hl-black); } .hl-marquee-track { display: flex !important; flex-wrap: nowrap !important; gap: 0 !important; width: max-content; } .hl-marquee.is-ready .hl-marquee-track { animation: hl-marquee 10s linear infinite; } .hl-marquee:hover .hl-marquee-track { animation-play-state: paused; } .hl-marquee p { margin: 0 !important; font-family: var(--hl-serif); font-size: clamp(1.5rem, 2.6vw, 2.3rem); font-weight: 500; font-style: italic; line-height: 1.2; padding: 0 .1em; } .hl-marquee p:nth-child(even) { font-family: var(--hl-sans); font-style: normal; font-size: clamp(.95rem, 1.4vw, 1.2rem); font-weight: 700; letter-spacing: .26em; text-transform: uppercase; align-self: center; } .hl-marquee p::after { content: "✦"; font-family: var(--hl-sans); font-style: normal; font-size: .7em; color: var(--hl-gold); margin: 0 1.1em; vertical-align: .15em; } @keyframes hl-marquee { to { transform: translateX(-50%); } } /* ---------- shop by category ---------- */ .hl-textures { display: grid !important; grid-template-columns: repeat(5, 1fr); gap: clamp(.8rem, 1.4vw, 1.4rem) !important; } .hl-texture { position: relative; margin: 0 !important; overflow: hidden; } .hl-texture .wp-block-image { margin: 0; overflow: hidden; } .hl-texture img { width: 100%; aspect-ratio: 3 / 4.4; object-fit: cover; object-position: 50% 14%; display: block; transition: transform 1.2s var(--hl-ease), filter .6s; } .hl-texture:hover img { transform: scale(1.06); } .hl-texture > p { margin: 0 !important; } .hl-texture-num { position: absolute; top: 1rem; left: 1rem; z-index: 2; font-family: var(--hl-serif); font-style: italic; color: #fff; font-size: 1.1rem; mix-blend-mode: difference; } .hl-texture-name { margin-top: 1rem !important; font-family: var(--hl-serif); font-size: clamp(1.4rem, 2vw, 1.9rem); line-height: 1.1; } .hl-texture-name a { text-decoration: none; color: var(--hl-black); background: linear-gradient(var(--hl-grey), var(--hl-grey)) 0 100% / 0 1px no-repeat; transition: background-size .5s var(--hl-ease), color .3s; } .hl-texture:hover .hl-texture-name a { background-size: 100% 1px; color: var(--hl-grey); } .hl-texture-name a::after { content: ""; position: absolute; inset: 0; z-index: 3; } .hl-texture-meta { font-size: .7rem !important; letter-spacing: .2em; text-transform: uppercase; font-weight: 600; margin-top: .3rem !important; } @media (max-width: 1024px) { .hl-textures { display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-right: calc(-1 * var(--wp--preset--spacing--40)); padding-right: var(--wp--preset--spacing--40); } .hl-textures::-webkit-scrollbar { display: none; } .hl-texture { flex: 0 0 min(64vw, 300px); scroll-snap-align: start; } } /* ---------- before / after ---------- */ .hl-compare { position: relative; margin: 0 !important; overflow: hidden; user-select: none; -webkit-user-select: none; touch-action: pan-y; background: var(--hl-cream); --pos: 50%; } .hl-compare > .wp-block-image { margin: 0 !important; } .hl-compare img { display: block; width: 100%; aspect-ratio: var(--hl-ratio, 4 / 5); object-fit: cover; object-position: 50% 12%; pointer-events: none; -webkit-user-drag: none; } .hl-compare.is-ready { cursor: ew-resize; } .hl-compare.is-ready > .hl-after { position: absolute !important; inset: 0; clip-path: inset(0 0 0 var(--pos)); } .hl-compare.is-ready > .hl-after img { height: 100%; } .hl-compare-line { position: absolute; top: 0; bottom: 0; left: var(--pos); width: 2px; margin-left: -1px; background: #fff; z-index: 4; pointer-events: none; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .1); } .hl-compare-handle { position: absolute; top: 50%; left: var(--pos); z-index: 5; width: 64px; height: 64px; margin: -32px 0 0 -32px; border-radius: 50%; background: var(--hl-grey); color: #fff; display: grid; place-items: center; cursor: grab; box-shadow: 0 0 0 6px rgba(255, 255, 255, .35), 0 14px 30px -10px rgba(0, 0, 0, .5); transition: transform .3s var(--hl-ease), background .3s; } .hl-compare-handle svg { width: 30px; height: 30px; } .hl-compare-handle:hover, .hl-compare.is-dragging .hl-compare-handle { transform: scale(1.08); background: var(--hl-black); } .hl-compare.is-dragging .hl-compare-handle { cursor: grabbing; } .hl-compare-handle:focus-visible { outline: 2px solid #fff; outline-offset: 4px; } .hl-compare-label { position: absolute; top: 1.2rem; z-index: 3; padding: .45rem .8rem; background: rgba(10, 10, 10, .82); color: #fff; font-size: .64rem; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; pointer-events: none; transition: opacity .3s; } .hl-compare-label.is-before { left: 1.2rem; } .hl-compare-label.is-after { right: 1.2rem; background: var(--hl-grey); } .hl-compare-hint { position: absolute; left: 50%; bottom: 1.2rem; z-index: 3; transform: translateX(-50%); color: #fff; font-size: .64rem; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; text-shadow: 0 1px 8px rgba(0, 0, 0, .5); pointer-events: none; transition: opacity .4s; white-space: nowrap; } .hl-compare.was-moved .hl-compare-hint { opacity: 0; } .hl-compare-wide { --hl-ratio: 4 / 5; } .hl-ba { gap: clamp(2rem, 5vw, 5rem) !important; } .hl-ba-steps { counter-reset: s; list-style: none; padding: 0; margin: 2rem 0 !important; border-top: 1px solid var(--hl-line); } .hl-ba-steps li { counter-increment: s; display: flex; gap: 1.2rem; align-items: baseline; padding: 1rem 0; border-bottom: 1px solid var(--hl-line); } .hl-ba-steps li::before { content: "0" counter(s); font-family: var(--hl-serif); font-style: italic; color: var(--hl-grey); font-size: 1.15rem; } .hl-caption { font-size: .78rem !important; letter-spacing: .16em; text-transform: uppercase; font-weight: 600; margin-top: 1rem !important; display: flex; justify-content: space-between; gap: 1rem; } .hl-caption em { font-family: var(--hl-serif); font-size: 1.15rem; letter-spacing: 0; text-transform: none; font-weight: 500; color: var(--hl-grey); } .hl-trans-grid { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: clamp(1rem, 2.4vw, 2.2rem) !important; } .hl-trans-grid > * { margin: 0 !important; } @media (max-width: 900px) { .hl-trans-grid { grid-template-columns: 1fr; max-width: 560px; margin-inline: auto !important; } } /* ---------- ritual band ---------- */ .hl-custom .wp-block-columns { gap: clamp(2rem, 6vw, 6rem) !important; } .hl-frame { position: relative; margin: 0 !important; } .hl-frame::before { content: ""; position: absolute; inset: 1.4rem -1.4rem -1.4rem 1.4rem; border: 1px solid var(--hl-grey); z-index: 0; pointer-events: none; } .hl-frame img { position: relative; z-index: 1; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 15%; display: block; } .hl-steps { display: grid !important; grid-template-columns: repeat(2, 1fr); gap: 0 !important; margin: 2.2rem 0 !important; border-top: 1px solid currentColor; border-left: 1px solid currentColor; } .has-contrast-background-color .hl-steps, .has-black-background-color .hl-steps { border-color: var(--hl-line-dark); } .hl-step { padding: 1.4rem 1.4rem 1.2rem; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; } .has-contrast-background-color .hl-step { border-color: var(--hl-line-dark); } .hl-steps > * { margin: 0 !important; } .hl-step > * { margin: 0 !important; } .hl-step h3 { font-size: 1.45rem !important; margin: .4rem 0 .3rem !important; } .hl-step p:last-child { font-size: .92rem; line-height: 1.6; opacity: .86; } .hl-steps-4 { grid-template-columns: repeat(4, 1fr); } @media (max-width: 900px) { .hl-steps-4 { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 520px) { .hl-steps, .hl-steps-4 { grid-template-columns: 1fr; } } /* ---------- quality features ---------- */ .hl-features { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 0 !important; border-top: 1px solid var(--hl-line); } .hl-feature { padding: clamp(1.6rem, 3vw, 2.6rem) clamp(1rem, 2.4vw, 2.2rem); border-bottom: 1px solid var(--hl-line); transition: background .4s; margin: 0 !important; } .hl-feature:not(:nth-child(3n)) { border-right: 1px solid var(--hl-line); } .hl-feature:hover { background: var(--hl-cream); } .hl-feature > * { margin: 0 !important; } .hl-feature h3 { font-size: clamp(1.5rem, 2.2vw, 1.95rem) !important; margin: .9rem 0 .5rem !important; } .hl-icon { display: block; width: 44px; height: 44px; color: var(--hl-grey); } .hl-icon svg { width: 100%; height: 100%; display: block; } @media (max-width: 781px) { .hl-features { grid-template-columns: 1fr; } .hl-feature { border-right: 0 !important; } } @media (min-width: 782px) and (max-width: 1024px) { .hl-features { grid-template-columns: repeat(2, 1fr); } .hl-feature:not(:nth-child(3n)) { border-right: 0; } .hl-feature:nth-child(odd) { border-right: 1px solid var(--hl-line); } } /* ---------- reviews ---------- */ .hl-reviews { text-align: center; } .hl-stars { color: var(--hl-gold); letter-spacing: .3em; font-size: .95rem !important; margin-bottom: 1.4rem !important; } .hl-quotes .wp-block-quote { margin: 0 auto; max-width: 980px; border: 0; padding: 0; } .hl-quotes .wp-block-quote p { font-family: var(--hl-serif); font-weight: 500; font-size: clamp(1.7rem, 3.6vw, 3.1rem); line-height: 1.18; letter-spacing: -.01em; } .hl-quotes cite { display: block; margin-top: 1.6rem; font-style: normal; font-size: .72rem; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; } .hl-quotes cite::before { content: ""; display: block; width: 36px; height: 1px; background: var(--hl-gold); margin: 0 auto 1.1rem; } .hl-js .hl-quotes.is-ready { display: grid; } .hl-js .hl-quotes.is-ready .wp-block-quote { grid-area: 1 / 1; opacity: 0; transform: translateY(18px); transition: opacity .8s var(--hl-ease), transform .8s var(--hl-ease); pointer-events: none; } .hl-js .hl-quotes.is-ready .wp-block-quote.is-active { opacity: 1; transform: none; pointer-events: auto; } .hl-quote-nav { display: flex; justify-content: center; gap: .6rem; margin-top: 2.4rem; } .hl-quote-nav button { width: 44px; height: 44px; border-radius: 50%; border: 1px solid currentColor; background: none; color: inherit; cursor: pointer; font-size: 1rem; transition: background .3s, color .3s, border-color .3s; } .hl-quote-nav button:hover { background: var(--hl-grey); border-color: var(--hl-grey); color: #fff; } .hl-quote-nav span { align-self: center; min-width: 4.5em; font-size: .72rem; letter-spacing: .24em; font-weight: 600; } /* ---------- gram grid ---------- */ .hl-gram { display: grid !important; grid-template-columns: repeat(6, 1fr); gap: 4px !important; } .hl-gram .wp-block-image { margin: 0 !important; position: relative; overflow: hidden; } .hl-gram img { width: 100%; aspect-ratio: 1; object-fit: cover; object-position: 50% 18%; display: block; transition: transform 1s var(--hl-ease); } .hl-gram .wp-block-image::after { content: "♥"; position: absolute; inset: 0; display: grid; place-items: center; background: rgba(190, 190, 190, .78); color: #fff; font-size: 1.4rem; opacity: 0; transition: opacity .4s; pointer-events: none; } .hl-gram .wp-block-image:hover::after { opacity: 1; } .hl-gram .wp-block-image:hover img { transform: scale(1.06); } @media (max-width: 781px) { .hl-gram { grid-template-columns: repeat(3, 1fr); } } /* ---------- journal ---------- */ .hl-journal .wp-block-post-featured-image { overflow: hidden; margin-bottom: 1.2rem; } .hl-journal .wp-block-post-featured-image img { transition: transform 1.1s var(--hl-ease); } .hl-journal li:hover .wp-block-post-featured-image img { transform: scale(1.05); } .hl-journal .wp-block-post-date { font-size: .7rem; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--hl-grey); } .hl-journal .wp-block-post-title { font-size: clamp(1.45rem, 2vw, 1.85rem) !important; margin: .5rem 0 !important; } .hl-journal .wp-block-post-title a { text-decoration: none; } .hl-journal .wp-block-post-title a:hover { color: var(--hl-grey); } /* ---------- newsletter ---------- */ .hl-newsletter h2 { margin-top: 0; margin-bottom: 1rem; } .hl-newsletter h2 em, .hl-newsletter .is-style-kicker { color: #fff !important; } .hl-nl-form { display: flex; max-width: 560px; margin: 2rem auto 0; border-bottom: 1px solid #fff; } .hl-nl-form input { flex: 1; min-width: 0; background: transparent; border: 0; color: #fff; font: inherit; font-size: 1.05rem; padding: 1rem 0; outline: none; } .hl-nl-form input::placeholder { color: rgba(255, 255, 255, .85); } .hl-nl-form button { background: none; border: 0; color: #fff; font: 600 .74rem var(--hl-sans); letter-spacing: .26em; text-transform: uppercase; cursor: pointer; padding: 0 0 0 1rem; } .hl-nl-form button:hover { color: var(--hl-black); } .hl-nl-done { display: none; margin-top: 1.2rem; font-family: var(--hl-serif); font-style: italic; font-size: 1.4rem; } .hl-nl-form.is-done { display: none; } .hl-nl-form.is-done + .hl-nl-done { display: block; } /* ---------- page heads, about, contact ---------- */ .hl-page-head h1 { margin: .2rem 0 1.4rem; } .hl-page-head .hl-lead { margin: 0; } .hl-page-head { border-bottom: 1px solid var(--hl-line); } .hl-about-hero img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; } .hl-tri { display: grid !important; grid-template-columns: 1fr 1.25fr 1fr; gap: clamp(.6rem, 1.4vw, 1.2rem) !important; align-items: end; } .hl-tri .wp-block-image { margin: 0 !important; } .hl-tri img { width: 100%; object-fit: cover; object-position: 50% 15%; display: block; aspect-ratio: 3 / 4; } .hl-tri .wp-block-image:nth-child(2) img { aspect-ratio: 3 / 4.4; } .hl-tri .wp-block-image:nth-child(1) { margin-bottom: 3rem !important; } @media (max-width: 600px) { .hl-tri { grid-template-columns: 1fr 1fr; } .hl-tri .wp-block-image:nth-child(3) { display: none; } .hl-tri .wp-block-image:nth-child(1) { margin-bottom: 0 !important; } } .hl-story-cols { columns: 2 22rem; column-gap: clamp(2rem, 5vw, 4.5rem); } .hl-story-cols p { break-inside: avoid; } .hl-dropcap::first-letter { float: left; font-family: var(--hl-serif); font-size: 5.2em; line-height: .78; padding: .08em .12em 0 0; color: var(--hl-grey); } .hl-pullquote { text-align: center; border: 0 !important; margin: clamp(2.5rem, 6vw, 5rem) auto !important; max-width: 900px; padding: 0 !important; } .hl-pullquote p { font-family: var(--hl-serif); font-style: italic; font-size: clamp(1.8rem, 4vw, 3.2rem); line-height: 1.15; } .hl-pullquote cite { font-style: normal; font-size: .72rem; letter-spacing: .3em; text-transform: uppercase; font-weight: 600; color: var(--hl-grey); } .hl-stats { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 0 !important; border-top: 1px solid var(--hl-line-dark); } .hl-stats > * { margin: 0 !important; padding: 1.6rem 1.2rem 0 0; } .hl-stats > * + * { padding-left: 1.4rem; border-left: 1px solid var(--hl-line-dark); } .hl-stats strong { display: block; font-family: var(--hl-serif); font-weight: 500; font-size: clamp(2.6rem, 5vw, 4.6rem); line-height: 1; } .hl-stats span { font-size: .7rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; opacity: .9; } @media (max-width: 781px) { .hl-stats { grid-template-columns: repeat(2, 1fr); } .hl-stats > :nth-child(3) { border-left: 0; padding-left: 0; } } .hl-contact-card { border-top: 1px solid var(--hl-black); padding-top: 1.2rem; } .hl-contact-card > * { margin: 0 0 .4rem !important; } .hl-contact-card h3 { font-size: 1.6rem !important; margin-bottom: .6rem !important; } .hl-faq .wp-block-details { border-bottom: 1px solid var(--hl-line); padding: 1.3rem 0; } .hl-faq .wp-block-details:first-child { border-top: 1px solid var(--hl-line); } .hl-faq summary { font-family: var(--hl-serif); font-size: clamp(1.3rem, 2vw, 1.65rem); cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 1rem; } .hl-faq summary::-webkit-details-marker { display: none; } .hl-faq summary::after { content: "+"; font-family: var(--hl-sans); font-weight: 300; font-size: 1.6rem; line-height: 1; color: var(--hl-grey); transition: transform .3s; } .hl-faq details[open] summary::after { transform: rotate(45deg); } .hl-faq details p { margin: .9rem 0 0; max-width: 44rem; } /* ---------- forms ---------- */ .hl-request { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: clamp(2rem, 5vw, 4.5rem); align-items: start; } .hl-form fieldset { border: 0; padding: 0 0 clamp(2rem, 4vw, 3rem); margin: 0 0 clamp(2rem, 4vw, 3rem); border-bottom: 1px solid var(--hl-line); min-width: 0; } .hl-form legend { display: flex; align-items: baseline; gap: 1rem; padding: 0; margin-bottom: 1.6rem; font-family: var(--hl-serif); font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 1.1; } .hl-form legend span { font-family: var(--hl-serif); font-style: italic; color: var(--hl-grey); font-size: .62em; } .hl-field { margin-bottom: 1.4rem; position: relative; } .hl-field > label, .hl-field-label { display: block; font-size: .7rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; margin-bottom: .7rem; } .hl-field > label small, .hl-field-label small { letter-spacing: .06em; text-transform: none; font-weight: 400; font-size: .78rem; } .hl-form input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=range]), .hl-form select, .hl-form textarea { width: 100%; box-sizing: border-box; padding: 1rem 1.1rem; border: 1px solid #CFC8C0; border-radius: 0; background: #fff; color: var(--hl-black); font: 400 1rem/1.4 var(--hl-sans); transition: border-color .25s, box-shadow .25s; -webkit-appearance: none; appearance: none; } .hl-form select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23111111' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 1.1rem center; padding-right: 2.6rem; } .hl-form input:focus, .hl-form select:focus, .hl-form textarea:focus { outline: none; border-color: var(--hl-black); box-shadow: 0 0 0 3px rgba(190, 190, 190, .12); } .hl-two { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.2rem; } .hl-three { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 1rem; } @media (max-width: 600px) { .hl-two, .hl-three { grid-template-columns: 1fr; } } .hl-chips { display: flex; flex-wrap: wrap; gap: .5rem; } .hl-chips label { position: relative; cursor: pointer; } .hl-chips input { position: absolute; opacity: 0; inset: 0; cursor: pointer; } .hl-chips span { display: inline-block; padding: .78rem 1.15rem; border: 1px solid #CFC8C0; font-size: .86rem; transition: border-color .2s, background .2s, color .2s; } .hl-chips label:hover span { border-color: var(--hl-black); } .hl-chips input:checked + span { background: var(--hl-black); border-color: var(--hl-black); color: #fff; } .hl-chips input:focus-visible + span { outline: 2px solid var(--hl-grey); outline-offset: 2px; } .hl-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .6rem; } .hl-cards label { position: relative; cursor: pointer; display: block; } .hl-cards input { position: absolute; opacity: 0; inset: 0; cursor: pointer; } .hl-cards span { display: block; height: 100%; box-sizing: border-box; padding: 1rem 1rem .9rem; border: 1px solid #CFC8C0; transition: border-color .2s, box-shadow .2s; } .hl-cards b { display: block; font-family: var(--hl-serif); font-weight: 500; font-size: 1.3rem; line-height: 1.1; margin-bottom: .25rem; } .hl-cards small { font-size: .78rem; line-height: 1.45; display: block; } .hl-cards label:hover span { border-color: var(--hl-black); } .hl-cards input:checked + span { border-color: var(--hl-grey); box-shadow: inset 0 0 0 1px var(--hl-grey); } .hl-cards input:checked + span b::after { content: " ✓"; color: var(--hl-grey); font-family: var(--hl-sans); font-size: .8em; } .hl-cards input:focus-visible + span { outline: 2px solid var(--hl-grey); outline-offset: 2px; } .hl-check { display: flex; gap: .7rem; align-items: flex-start; font-size: .94rem; cursor: pointer; margin-bottom: .6rem; } .hl-check input { width: 18px; height: 18px; accent-color: var(--hl-grey); margin-top: .15rem; flex: 0 0 auto; } .hl-range { display: flex; align-items: center; gap: 1rem; } .hl-range input[type=range] { flex: 1; accent-color: var(--hl-grey); } .hl-range output { min-width: 3.4em; font-family: var(--hl-serif); font-size: 1.6rem; color: var(--hl-grey); } .hl-upload { display: block; border: 1px dashed #B9B1A8; padding: 1.6rem; text-align: center; cursor: pointer; transition: border-color .2s, background .2s; } .hl-upload:hover, .hl-upload.is-over { border-color: var(--hl-grey); background: var(--hl-cream); } .hl-upload input { position: absolute; width: 1px; height: 1px; opacity: 0; } .hl-upload b { display: block; font-family: var(--hl-serif); font-weight: 500; font-size: 1.3rem; } .hl-upload small { font-size: .8rem; } .hl-upload-list { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .8rem; } .hl-upload-list img { width: 64px; height: 64px; object-fit: cover; } .hl-field .error { display: none; color: var(--hl-grey); font-size: .8rem; margin-top: .4rem; } .hl-field.invalid .error { display: block; } .hl-field.invalid input, .hl-field.invalid select, .hl-field.invalid .hl-chips span, .hl-field.invalid .hl-cards span { border-color: var(--hl-grey) !important; } .hl-submit { display: inline-flex; align-items: center; gap: .8rem; padding: 1.25rem 2.6rem; background: var(--hl-grey); color: #fff; border: 0; cursor: pointer; font: 600 .76rem var(--hl-sans); letter-spacing: .26em; text-transform: uppercase; transition: background .3s, transform .3s; } .hl-submit:hover { background: var(--hl-black); transform: translateY(-2px); } .hl-submit[disabled] { opacity: .6; cursor: progress; } .hl-form-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 2rem; } .hl-form-foot p { margin: 0; font-size: .85rem; max-width: 26rem; } .hl-summary { position: sticky; top: 120px; background: var(--hl-black); color: #fff; padding: clamp(1.6rem, 3vw, 2.4rem); } .hl-summary h3 { font-size: 2rem !important; margin: 0 0 .3rem; color: #fff; } .hl-summary > p { font-size: .88rem; margin: 0 0 1.4rem; opacity: .9; } .hl-summary dl { margin: 0; display: grid; grid-template-columns: auto 1fr; border-top: 1px solid var(--hl-line-dark); } .hl-summary dt, .hl-summary dd { margin: 0; padding: .78rem 0; border-bottom: 1px solid var(--hl-line-dark); font-size: .84rem; } .hl-summary dt { font-size: .64rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; padding-right: 1rem; display: flex; align-items: center; } .hl-summary dd { text-align: right; font-family: var(--hl-serif); font-size: 1.12rem; } .hl-summary dd.is-empty { opacity: .45; font-family: var(--hl-sans); font-size: .82rem; } .hl-summary-est { display: flex; justify-content: space-between; align-items: baseline; margin-top: 1.4rem; } .hl-summary-est span { font-size: .64rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; } .hl-summary-est strong { font-family: var(--hl-serif); font-weight: 500; font-size: 2rem; color: #fff; } .hl-summary-note { font-size: .78rem !important; margin-top: .9rem !important; opacity: .85; } @media (max-width: 1000px) { .hl-request { grid-template-columns: 1fr; } .hl-summary { position: static; order: -1; } } .hl-modal { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; padding: 20px; background: rgba(10, 10, 10, .6); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); } .hl-modal[hidden] { display: none; } .hl-modal-card { position: relative; max-width: 480px; background: #fff; padding: clamp(2rem, 5vw, 3.2rem); text-align: center; border-top: 4px solid var(--hl-grey); animation: hl-pop .5s var(--hl-ease); } .hl-modal-card h3 { font-size: 2.4rem !important; margin: .4rem 0 .8rem; } .hl-modal-card p { margin: 0 0 1.6rem; } @keyframes hl-pop { from { opacity: 0; transform: translateY(20px) scale(.98); } to { opacity: 1; transform: none; } } /* ---------- footer ---------- */ .hl-footer a { color: inherit; text-decoration: none; } .hl-footer a:hover { color: var(--hl-gold); } .hl-footer h4 { font-family: var(--hl-sans) !important; font-size: .7rem !important; font-weight: 600 !important; letter-spacing: .26em; text-transform: uppercase; margin-bottom: 1.2rem; color: #fff; } .hl-footer p { margin: 0 0 .55rem; font-size: .95rem; } .hl-footer-big { font-family: var(--hl-serif); font-size: clamp(2.6rem, 8vw, 7.4rem) !important; line-height: .95; letter-spacing: -.02em; margin: 0 0 clamp(2rem, 5vw, 4rem) !important; } .hl-footer-big em { color: var(--hl-gold) !important; } .hl-footer-bottom { border-top: 1px solid var(--hl-line-dark); padding-top: 1.4rem; margin-top: clamp(2rem, 5vw, 4rem) !important; } .hl-footer-bottom p { font-size: .8rem !important; letter-spacing: .08em; } .hl-pay { display: flex; gap: .5rem; flex-wrap: wrap; } .hl-pay span { border: 1px solid var(--hl-line-dark); padding: .3rem .55rem; font-size: .62rem; font-weight: 600; letter-spacing: .14em; } /* ---------- reveal on scroll ---------- */ .hl-js .hl-reveal { opacity: 0; transform: translateY(34px); transition: opacity 1s var(--hl-ease), transform 1s var(--hl-ease); } .hl-js .hl-reveal.in { opacity: 1; transform: none; } @media (prefers-reduced-motion: reduce) { .hl-js .hl-reveal { opacity: 1; transform: none; transition: none; } .hl-badge svg, .hl-marquee.is-ready .hl-marquee-track, .hl-video-play span::before { animation: none; } } /* ---------- product card bands (homepage) ---------- */ .hl-shop .wc-block-components-product-image, .hl-shop .wc-block-product .wp-block-woocommerce-product-image { position: relative; overflow: hidden; } .hl-card-marquee { position: absolute; left: 0; right: 0; bottom: 12px; z-index: 3; overflow: hidden; pointer-events: none; padding: 7px 0; background: rgba(10, 10, 10, .8); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); color: #fff; } .hl-card-marquee.is-sale { background: rgba(190, 190, 190, .94); } .hl-card-marquee__track { display: flex; width: max-content; animation: hl-card-marquee 19s linear infinite; } .hl-card-marquee__track span, .hl-card-marquee__track i { flex: 0 0 auto; font-family: var(--hl-sans); font-style: normal; font-size: .64rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; white-space: nowrap; line-height: 1.2; } .hl-card-marquee__track i { padding: 0 .9em; color: var(--hl-gold); } .hl-card-marquee.is-sale .hl-card-marquee__track i { color: #fff; } .wc-block-product:hover .hl-card-marquee__track { animation-duration: 10s; } .hl-card-marquee.is-static .hl-card-marquee__track { animation: none; } @keyframes hl-card-marquee { to { transform: translateX(-50%); } } .hl-shop .wc-block-product .wp-block-post-title a:hover, .hl-shop .wc-block-product:hover .wp-block-post-title a { color: var(--hl-grey) !important; } /* ---------- small screens ---------- */ @media (max-width: 781px) { .hl-split-title { display: block; } .hl-split-title .hl-lead { margin-top: 1rem !important; } .hl-topbar p::before, .hl-topbar p::after { margin: 0 .5em; } .hl-topbar { font-size: .62rem; letter-spacing: .14em; } } /* ---------- campaign banner ---------- */ .hl-campaign { color: #fff; padding: clamp(1.5rem, 5vw, 4.5rem) var(--wp--preset--spacing--40) !important; } .hl-campaign::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10, 10, 10, .62) 0%, rgba(10, 10, 10, .2) 45%, rgba(10, 10, 10, 0) 70%); pointer-events: none; } .hl-campaign .wp-block-cover__inner-container { position: relative; z-index: 2; } .hl-campaign-card { max-width: 40rem; } .hl-campaign-card .is-style-kicker { color: #fff; } .hl-campaign-card h2 { color: #fff; margin: 0 0 1.2rem; } .hl-campaign-card h2 em { color: #fff; } .hl-campaign-card .hl-lead { color: #fff; } @media (max-width: 781px) { .hl-campaign::after { background: linear-gradient(0deg, rgba(10, 10, 10, .72) 0%, rgba(10, 10, 10, .15) 60%); } .hl-campaign img { object-position: 30% 35% !important; } } .hl-story-img { margin: clamp(2rem, 5vw, 4rem) 0 0 !important; } .hl-story-img img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; } @media (max-width: 781px) { .hl-display { font-size: clamp(3.1rem, 14vw, 4.2rem) !important; } .hl-logo-sub { display: none; } .hl-video-meta b { display: none; } .hl-video-meta { justify-content: flex-end; } } @media (max-width: 1200px) and (min-width: 1025px) { .hl-nav .wp-block-navigation__container { gap: 1.3rem !important; } .hl-nav .wp-block-navigation-item__content { letter-spacing: .12em; } } section:has(> .hl-textures) { overflow-x: clip; } @media (max-width: 781px) { .hl-frame::before { inset: .8rem -.6rem -.8rem .8rem; } } .hl-field > label.hl-check { display: flex; font-size: .95rem; font-weight: 400; letter-spacing: 0; text-transform: none; margin-bottom: .6rem; } .hl-range input[type=range] { height: 2px; } /* WooCommerce adds an account icon after the menu: keep the three-column header (menu | logo | tools) intact */ .hl-header-row > .wp-block-woocommerce-customer-account { display: none !important; } .hl-account { display: inline-grid; place-items: center; width: 44px; height: 44px; color: var(--hl-black); } .hl-account svg { width: 26px; height: 26px; } .hl-account:hover { color: var(--hl-grey); } /* Elementor: keep overlays under the text and absolute pieces positioned against their section */ .hl-campaign > :not(.wp-block-cover__image-background):not(.wp-block-cover__background) { position: relative; z-index: 2; } .hl-hero-media > .elementor-widget-html, .hl-hero-media > .elementor-widget-text-editor:has(.hl-hero-label) { position: static !important; margin: 0 !important; } .hl-hero-media.e-con { position: relative; } .hl-hero-media > .elementor-widget-image.hl-hero-inset { position: absolute !important; } /* ---------- full-screen hero slider ---------- */ .hl-slider { position: relative; overflow: hidden; background: var(--hl-black); } .hl-slider > .hl-slide { margin: 0 !important; color: #fff; padding: clamp(5rem, 10vh, 8rem) var(--wp--preset--spacing--40) clamp(5rem, 12vh, 8rem) !important; min-height: calc(100vh - 110px) !important; } .hl-slide::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10, 10, 10, .68) 0%, rgba(10, 10, 10, .28) 48%, rgba(10, 10, 10, 0) 72%); pointer-events: none; } .hl-slide .wp-block-cover__inner-container { position: relative; z-index: 2; } .hl-slide-card { max-width: 44rem; } .hl-slide-card .is-style-kicker { color: #fff; } .hl-slide-card .hl-display { color: #fff; margin: 0 0 1.4rem !important; } .hl-slide-card .hl-display em { display: block; color: #fff; } .hl-slide-card .hl-lead { color: #fff; margin-bottom: 1.8rem; } .hl-js .hl-slider.is-ready { display: grid; } .hl-js .hl-slider.is-ready > .hl-slide { grid-area: 1 / 1; opacity: 0; visibility: hidden; transition: opacity 1.1s ease, visibility 1.1s; } .hl-js .hl-slider.is-ready > .hl-slide.is-active { opacity: 1; visibility: visible; z-index: 1; } .hl-js .hl-slider > .hl-slide:first-child:not(.is-seen) { opacity: 1; visibility: visible; } .hl-js .hl-slider.is-ready > .hl-slide > .wp-block-cover__image-background { transform: scale(1.06); transition: transform 7.5s ease-out; } .hl-js .hl-slider.is-ready > .hl-slide.is-active > .wp-block-cover__image-background { transform: scale(1); } .hl-js .hl-slider.is-ready > .hl-slide .hl-slide-card > * { opacity: 0; transform: translateY(24px); transition: opacity .8s ease .3s, transform .8s ease .3s; } .hl-js .hl-slider.is-ready > .hl-slide.is-active .hl-slide-card > * { opacity: 1; transform: none; } .hl-slider-ui { position: absolute; z-index: 5; right: clamp(1.25rem, 4vw, 3.5rem); bottom: clamp(2rem, 6vh, 4rem); display: flex; align-items: center; gap: .9rem; color: #fff; font-weight: 600; letter-spacing: .14em; font-size: .78rem; } .hl-slider-ui button { font: inherit; cursor: pointer; } .hl-slider-prev, .hl-slider-next { width: 52px; height: 52px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .7); background: transparent; color: inherit; font-size: 1.1rem !important; letter-spacing: 0; transition: background .3s, border-color .3s; } .hl-slider-prev:hover, .hl-slider-next:hover { background: var(--hl-grey); border-color: var(--hl-grey); } .hl-slider-count { min-width: 4.2em; text-align: center; } .hl-slider-dots { display: flex; gap: .45rem; margin-right: .4rem; } .hl-slider-dots button { width: 10px; height: 10px; padding: 0; border: 0; border-radius: 999px; background: rgba(255, 255, 255, .5); transition: width .4s, background .4s; } .hl-slider-dots button.is-active { width: 30px; background: var(--hl-gold); } .hl-slider-progress { position: absolute; z-index: 5; left: 0; bottom: 0; width: 100%; height: 3px; background: rgba(255, 255, 255, .2); } .hl-slider-progress span { display: block; height: 100%; width: 0; background: var(--hl-gold); } @media (max-width: 781px) { .hl-slider > .hl-slide { min-height: 88vh !important; padding-bottom: 7rem !important; } .hl-slide::after { background: linear-gradient(0deg, rgba(10, 10, 10, .78) 0%, rgba(10, 10, 10, .2) 62%); } .hl-slider-ui { left: var(--wp--preset--spacing--40); right: auto; bottom: 1.5rem; } .hl-slider-count { display: none; } .hl-slide .wp-block-buttons { flex-direction: column; align-items: flex-start; } } @media (prefers-reduced-motion: reduce) { .hl-js .hl-slider.is-ready > .hl-slide, .hl-js .hl-slider.is-ready > .hl-slide * { transition: none !important; } } /* reviews title on the dark band */ .hl-reviews .hl-title h2, .hl-reviews .hl-title .hl-lead { color: #fff; } .hl-reviews .hl-title em { color: var(--hl-gold); } .hl-contact-form { background: #fff; padding: clamp(1.5rem, 3vw, 2.6rem); } @media (max-width: 600px) { .hl-page-head .hl-display { font-size: 2.7rem !important; } } .hl-contact-form { position: relative; } /* ========================================================================== Naturis layer: big clean titles, pill buttons, beige accents ========================================================================== */ body { background: #fff; color: var(--hl-black); } h1, h2, h3, h4, .hl-display { font-family: var(--hl-sans); font-weight: 600; letter-spacing: -.045em; } h1, h2 { text-wrap: balance; } .hl-display { font-size: clamp(3.2rem, 10vw, 9.6rem) !important; line-height: .9 !important; letter-spacing: -.055em !important; } .hl-display em, h1 em, h2 em { letter-spacing: -.01em; padding-right: .02em; } ::selection { background: var(--hl-grey); color: var(--hl-black); } /* kicker: a small beige dot instead of a rule */ .is-style-kicker, .hl-kicker { color: var(--hl-black) !important; letter-spacing: .24em !important; } .is-style-kicker::before { width: 8px !important; height: 8px !important; border-radius: 50%; background: var(--hl-grey) !important; margin: 0 .8em .12em 0 !important; } .has-text-align-center.is-style-kicker::after { width: 8px !important; height: 8px !important; border-radius: 50%; background: var(--hl-grey) !important; margin: 0 0 .12em .8em !important; } .has-contrast-background-color .is-style-kicker, .hl-reviews .is-style-kicker { color: #fff !important; } /* pill buttons */ .wp-block-button__link, .hl-submit, .hl-nl-form button { border-radius: 999px !important; } .wp-block-button__link { padding: 1.05rem 2.1rem !important; } .wp-block-button__link:hover { background: var(--hl-grey); color: var(--hl-black); } .wp-block-button.is-style-outline > .wp-block-button__link { padding: calc(1.05rem - 1px) calc(2.1rem - 1px) !important; } .wp-block-button.is-style-beige > .wp-block-button__link { background: var(--hl-grey); color: var(--hl-black); } .wp-block-button.is-style-beige > .wp-block-button__link:hover { background: var(--hl-black); color: #fff; } .wp-block-button.is-style-light > .wp-block-button__link:hover { background: var(--hl-grey); color: var(--hl-black); } .wp-block-button.is-style-link > .wp-block-button__link { border-radius: 0 !important; padding: .4rem 0 !important; border-bottom-color: var(--hl-black); } .wp-block-button.is-style-link > .wp-block-button__link::after { color: var(--hl-grey); } .wp-block-button.is-style-link > .wp-block-button__link:hover { background: none; color: var(--hl-grey); } .hl-submit { background: var(--hl-black); } .hl-submit:hover { background: var(--hl-grey); color: var(--hl-black); } /* header: logo left, menu centred, tools right */ .hl-topbar { background: var(--hl-grey); color: var(--hl-black); font-weight: 600; } .hl-topbar p::before, .hl-topbar p::after { color: var(--hl-black); content: "✺"; } .hl-header { background: rgba(255, 255, 255, .94); } .hl-header-row { grid-template-columns: auto 1fr auto !important; } .hl-header-row > .hl-brand { justify-self: start; text-align: left; } .hl-header-row > .hl-nav { justify-self: center; } .hl-logo a { gap: .28em; } .hl-logo b { font-family: var(--hl-sans); font-weight: 700; font-size: clamp(1.25rem, 1.9vw, 1.6rem); letter-spacing: .14em; margin-right: 0; } .hl-logo i { font-family: var(--hl-serif); font-style: italic; font-weight: 400; font-size: clamp(1.35rem, 2vw, 1.7rem); color: var(--hl-grey); } .hl-logo-sub { letter-spacing: .36em; } .hl-nav .wp-block-navigation-item__content { letter-spacing: .12em; font-weight: 600; } .hl-nav .wp-block-navigation-item__content::after { height: 2px; background: var(--hl-grey); } .hl-nav .wp-block-navigation-item__content:hover { color: var(--hl-black); } .hl-btn-sm .wp-block-button__link { background: var(--hl-black) !important; color: #fff !important; padding: .8rem 1.3rem !important; } .hl-btn-sm .wp-block-button__link:hover { background: var(--hl-grey) !important; color: var(--hl-black) !important; } .hl-account:hover { color: var(--hl-grey); } /* hero slider on light still lifes: black text, no dark overlay */ .hl-slider { background: var(--hl-cream); } .hl-slider > .hl-slide { color: var(--hl-black); } .hl-slide::after { display: none; } .hl-slide-card .is-style-kicker, .hl-slide-card .hl-display, .hl-slide-card .hl-display em, .hl-slide-card .hl-lead { color: var(--hl-black) !important; } .hl-slide-card .hl-display em { color: var(--hl-black) !important; } .hl-slide.is-cream .hl-display em, .hl-slide.is-sand .hl-display em { color: var(--hl-grey) !important; } .hl-slide-card { max-width: 46rem; } .hl-slider-ui { color: var(--hl-black); } .hl-slider-prev, .hl-slider-next { border-color: rgba(17, 17, 17, .5); } .hl-slider-prev:hover, .hl-slider-next:hover { background: var(--hl-black); border-color: var(--hl-black); color: #fff; } .hl-slider-dots button { background: rgba(17, 17, 17, .3); } .hl-slider-dots button.is-active { background: var(--hl-black); } .hl-slider-progress { background: rgba(17, 17, 17, .12); } .hl-slider-progress span { background: var(--hl-black); } /* marquee: a beige band with huge words */ .hl-marquee { background: var(--hl-grey); border: 0; } .hl-marquee p { font-family: var(--hl-sans); font-style: normal; font-weight: 600; font-size: clamp(2rem, 4.2vw, 3.8rem); letter-spacing: -.04em; line-height: 1.15; } .hl-marquee p:nth-child(even) { font-family: var(--hl-cond); font-style: normal; font-weight: 500; font-stretch: 62.5%; font-variation-settings: 'wdth' 62.5; font-size: clamp(2.5rem, 5.2vw, 4.8rem); line-height: 1; letter-spacing: -.01em; text-transform: none; } .hl-marquee p::after { content: "✺"; color: var(--hl-black); font-size: .55em; margin: 0 .7em; vertical-align: .2em; } .hl-marquee.is-dark { background: var(--hl-black); color: #fff; } .hl-marquee.is-dark p::after { color: var(--hl-grey); } /* shop by category: rounded tiles, each with a band */ .hl-texture .wp-block-image { border-radius: 22px; position: relative; } .hl-texture img { object-position: 50% 60%; border-radius: 22px; } .hl-texture-num { font-family: var(--hl-sans); font-style: normal; font-weight: 600; font-size: .78rem; letter-spacing: .2em; color: var(--hl-black); mix-blend-mode: normal; background: #fff; border-radius: 999px; padding: .35rem .7rem; } .hl-texture-name { font-family: var(--hl-sans); font-weight: 600; letter-spacing: -.03em; } .hl-texture-name a { background-image: linear-gradient(var(--hl-grey), var(--hl-grey)); } .hl-texture:hover .hl-texture-name a { color: var(--hl-black); background-size: 100% 2px; } /* bands that scroll across photos (category tiles, product cards, campaign) */ .hl-card-marquee { background: rgba(17, 17, 17, .86); } .hl-card-marquee.is-beige { background: var(--hl-grey); color: var(--hl-black); } .hl-card-marquee.is-beige .hl-card-marquee__track i { color: var(--hl-black); } .hl-card-marquee.is-sale { background: var(--hl-grey); color: var(--hl-black); } .hl-card-marquee__track i { color: var(--hl-gold); } .hl-texture .hl-card-marquee { bottom: 16px; border-radius: 0; } .hl-band { position: absolute; left: 0; right: 0; z-index: 3; overflow: hidden; pointer-events: none; } .hl-campaign .hl-card-marquee { top: clamp(1.2rem, 4vw, 3rem); bottom: auto; padding: 12px 0; transform: rotate(-2deg) scale(1.04); } .hl-campaign .hl-card-marquee__track span { font-size: .9rem; } .hl-shop .wc-block-components-product-image img, .rh-woo .wc-block-components-product-image img { border-radius: 18px; } .hl-shop .wc-block-components-product-image { border-radius: 18px; } /* philosophy / ingredients split */ .hl-philo .wp-block-columns { gap: clamp(2rem, 6vw, 6rem) !important; } .hl-philo-img img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 999px 999px 24px 24px; display: block; } .hl-ingredients { display: grid !important; grid-template-columns: 1fr 1fr; gap: 0 !important; margin: 2rem 0 !important; border-top: 1px solid var(--hl-line); } .hl-ingredient { padding: 1.3rem 1.2rem 1.2rem 0; border-bottom: 1px solid var(--hl-line); margin: 0 !important; } .hl-ingredient:nth-child(odd) { border-right: 1px solid var(--hl-line); } .hl-ingredient:nth-child(even) { padding-left: 1.4rem; } .hl-ingredient > * { margin: 0 !important; } .hl-ingredient h3 { font-size: 1.35rem !important; letter-spacing: -.03em; margin: .1rem 0 .25rem !important; } .hl-ingredient p { font-size: .92rem; line-height: 1.55; } .hl-ingredient .hl-num { font-family: var(--hl-serif); font-style: italic; color: var(--hl-grey); font-size: 1.15rem; } @media (max-width: 600px) { .hl-ingredients { grid-template-columns: 1fr; } .hl-ingredient:nth-child(odd) { border-right: 0; } .hl-ingredient:nth-child(even) { padding-left: 0; } } /* ritual band */ .hl-frame::before { border-color: var(--hl-grey); border-radius: 26px; } .hl-frame img { border-radius: 24px; } .hl-num { font-family: var(--hl-serif); color: var(--hl-grey); } .hl-steps { border-radius: 0; } .hl-step h3 { letter-spacing: -.03em; } /* features: icon chips */ .hl-icon { width: 58px; height: 58px; border-radius: 50%; background: var(--hl-grey); color: var(--hl-black); padding: 13px; } .hl-feature h3 { letter-spacing: -.035em; font-size: clamp(1.4rem, 2vw, 1.75rem) !important; } .hl-feature:hover { background: var(--hl-cream); } /* reviews */ .hl-quotes .wp-block-quote p { font-family: var(--hl-sans); font-weight: 500; letter-spacing: -.035em; line-height: 1.12; } .hl-quotes cite::before { background: var(--hl-grey); } .hl-stars { color: var(--hl-gold); } .hl-quote-nav button:hover { background: var(--hl-grey); border-color: var(--hl-grey); color: var(--hl-black); } .hl-reviews .hl-title em { color: var(--hl-gold); } /* social grid */ .hl-gram { gap: 10px !important; } .hl-gram .wp-block-image { border-radius: 16px; } .hl-gram .wp-block-image::after { content: "✺"; background: rgba(190, 190, 190, .82); color: var(--hl-black); } /* journal */ .hl-journal .wp-block-post-featured-image, .hl-journal .wp-block-post-featured-image img { border-radius: 18px; } .hl-journal .wp-block-post-date { color: var(--hl-black); } .hl-journal .wp-block-post-date::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--hl-grey); margin-right: .6em; vertical-align: .1em; } .hl-journal .wp-block-post-title { font-family: var(--hl-sans); font-weight: 600; letter-spacing: -.035em; } .hl-journal .wp-block-post-title a:hover { color: var(--hl-grey); } /* newsletter on beige */ .hl-newsletter, .hl-newsletter h2, .hl-newsletter p { color: var(--hl-black) !important; } .hl-newsletter h2 em { color: #fff !important; } .hl-newsletter .is-style-kicker { color: var(--hl-black) !important; } .hl-newsletter .is-style-kicker::before, .hl-newsletter .is-style-kicker::after { background: var(--hl-black) !important; } .hl-nl-form { border: 0; background: #fff; border-radius: 999px; padding: .35rem .35rem .35rem 1.4rem; } .hl-nl-form input { color: var(--hl-black); } .hl-nl-form input::placeholder { color: #6f675b; } .hl-nl-form button { background: var(--hl-black); color: #fff; padding: 0 1.5rem; } .hl-nl-form button:hover { background: var(--hl-black); color: var(--hl-gold); } /* page heads, about, contact, faq */ .hl-page-head { border-bottom: 0; background: var(--hl-cream); } .hl-tri img { border-radius: 22px; } .hl-tri .wp-block-image:nth-child(2) img { border-radius: 999px 999px 22px 22px; } .hl-story-img img { border-radius: 24px; } .hl-dropcap::first-letter { font-family: var(--hl-serif); color: var(--hl-grey); } .hl-pullquote p { font-family: var(--hl-serif); } .hl-pullquote cite { color: var(--hl-black); } .hl-stats strong { font-family: var(--hl-sans); font-weight: 600; letter-spacing: -.05em; color: var(--hl-gold); } .hl-contact-card { border-top: 2px solid var(--hl-black); } .hl-contact-card h3 { letter-spacing: -.035em; } .hl-contact-img img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 24px; display: block; } .hl-contact-form { border-radius: 24px; } .hl-form input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=range]), .hl-form select, .hl-form textarea { border-radius: 14px; } .hl-chips span { border-radius: 999px; } .hl-chips input:checked + span { background: var(--hl-grey); border-color: var(--hl-grey); color: var(--hl-black); } .hl-modal-card { border-top-color: var(--hl-grey); border-radius: 24px; } .hl-faq summary { font-family: var(--hl-sans); font-weight: 600; letter-spacing: -.03em; } .hl-faq summary::after { color: var(--hl-black); width: 2.2rem; height: 2.2rem; border-radius: 50%; background: var(--hl-grey); display: grid; place-items: center; font-size: 1.3rem; flex: 0 0 auto; } .hl-faq-group { margin-top: clamp(2.5rem, 5vw, 4rem) !important; } .hl-faq-group:first-child { margin-top: 0 !important; } .hl-faq-group > h2 { font-size: clamp(1.8rem, 3vw, 2.6rem) !important; margin-bottom: 1.2rem !important; } /* footer */ .hl-footer a:hover { color: var(--hl-gold); } .hl-footer-big { font-family: var(--hl-sans); font-weight: 600; letter-spacing: -.055em; font-size: clamp(3rem, 10vw, 9.6rem) !important; line-height: .88; } .hl-footer-big em { color: var(--hl-gold) !important; } .hl-footer .hl-logo a, .hl-footer .hl-logo b { color: #fff; } .rh-drawer .hl-logo i { color: var(--hl-gold); } /* campaign banner: dark text box over the light still life */ .hl-campaign { color: var(--hl-black); background: #D4D4D4; } .hl-campaign::after { display: none; } .hl-campaign-card .is-style-kicker, .hl-campaign-card h2, .hl-campaign-card .hl-lead { color: var(--hl-black) !important; } .hl-campaign-card h2 em { color: #fff !important; } .hl-campaign-card { max-width: 34rem; } .wp-block-button__link { white-space: nowrap; } /* phones: the still life on top, the words below on a solid colour (never text over products) */ @media (max-width: 781px) { .hl-slider > .hl-slide { min-height: 0 !important; padding-top: calc(46vh + 1.6rem) !important; padding-bottom: 6.2rem !important; background: var(--hl-slide-bg, #F5F5F5); align-items: flex-start; } .hl-slide.is-beige { --hl-slide-bg: #D4D4D4; } .hl-slide.is-sand { --hl-slide-bg: #EBEBEB; } .hl-slide > .wp-block-cover__image-background { height: 46vh !important; bottom: auto !important; object-position: 100% 18% !important; } .hl-slide::after { display: none !important; } .hl-slide-card .hl-display { font-size: clamp(2.9rem, 13vw, 3.8rem) !important; } .hl-slide .wp-block-buttons { flex-direction: row; flex-wrap: wrap; } .hl-campaign { min-height: 0 !important; padding-top: calc(42vh + 1.6rem) !important; } .hl-campaign > .wp-block-cover__image-background { height: 42vh !important; bottom: auto !important; object-position: 100% 50% !important; } .hl-campaign .hl-card-marquee { top: calc(42vh - 3.2rem); bottom: auto; } } .hl-slide-card .hl-display { font-size: clamp(3.2rem, 8.2vw, 8.4rem) !important; } .hl-campaign > .hl-card-marquee { position: absolute !important; z-index: 3; } @media (min-width: 782px) { .hl-campaign { padding-top: clamp(6rem, 9vw, 8rem) !important; } } /* neutral beige: accents that are text use the deeper taupe */ .hl-num, .hl-ingredient .hl-num, .hl-dropcap::first-letter, .hl-ba-steps li::before, .hl-logo i, .hl-caption em, .hl-form legend span, .hl-range output { color: var(--hl-ink2) !important; } .hl-slide.is-cream .hl-display em, .hl-slide.is-sand .hl-display em { color: var(--hl-ink2) !important; } .hl-newsletter h2 em, .hl-campaign-card h2 em { color: #111111 !important; } .hl-journal .wp-block-post-title a:hover, .hl-texture:hover .hl-texture-name a { color: var(--hl-ink2); } .wp-block-button.is-style-link > .wp-block-button__link:hover { color: var(--hl-ink2); } .hl-footer .hl-logo i, .rh-drawer .hl-logo i { color: #D4D4D4 !important; } /* founder (the model portraits live only here) */ .hl-founder .wp-block-columns { gap: clamp(2rem, 6vw, 6rem) !important; } .hl-founder-img { margin: 0 !important; } .hl-founder-img img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 15%; border-radius: 999px 999px 24px 24px; display: block; } .hl-founder-quote { font-size: clamp(1.2rem, 1.8vw, 1.45rem) !important; line-height: 1.55; } .hl-signature { font-family: var(--hl-cond); font-stretch: 62.5%; font-variation-settings: 'wdth' 62.5; font-weight: 500; font-size: 2rem !important; color: var(--hl-ink2); margin-top: 1.2rem !important; } .hl-founder-strip { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: clamp(.6rem, 1.4vw, 1.2rem) !important; margin-top: clamp(2.5rem, 5vw, 4rem) !important; } .hl-founder-strip .wp-block-image { margin: 0 !important; } .hl-founder-strip img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 15%; border-radius: 18px; display: block; } @media (max-width: 781px) { .hl-founder-strip { grid-template-columns: repeat(2, 1fr); } } /* ========================================================================== Hoodies Land layer: black and white, neutral grey accents ========================================================================== */ :root { --hl-y: #D4D4D4; } ::selection { background: var(--hl-y); color: #111; } /* accent words: black on a grey marker on light sections, light grey on black ones */ h1 em, h2 em, h3 em, .hl-title em { color: #111 !important; background: linear-gradient(transparent 56%, var(--hl-y) 56%, var(--hl-y) 94%, transparent 94%); padding: 0 .08em; -webkit-box-decoration-break: clone; box-decoration-break: clone; } .has-contrast-background-color h1 em, .has-contrast-background-color h2 em, .hl-footer-big em, .hl-reviews h2 em, .hl-stats em, .hl-reviews .hl-title em { color: var(--hl-y) !important; background: none; } .hl-newsletter h2 em, .hl-campaign-card h2 em, .hl-slide.is-beige .hl-display em { color: #111 !important; background: linear-gradient(transparent 56%, #fff 56%, #fff 94%, transparent 94%); } .hl-slide.is-cream .hl-display em, .hl-slide.is-sand .hl-display em { color: #111 !important; } .hl-logo i { font-family: var(--hl-sans); font-style: normal; font-weight: 800; color: #111 !important; background: var(--hl-y); padding: .08em .32em .12em; letter-spacing: .1em; font-size: clamp(.9rem, 1.2vw, 1.05rem); text-transform: uppercase; } .hl-footer .hl-logo i, .rh-drawer .hl-logo i { color: #111 !important; background: var(--hl-y); } .hl-num, .hl-ingredient .hl-num, .hl-dropcap::first-letter, .hl-ba-steps li::before, .hl-signature { color: #111 !important; } .hl-icon { background: var(--hl-y); color: #111; } .hl-topbar { background: #111; color: #fff; } .hl-topbar p::before, .hl-topbar p::after { color: var(--hl-y); } .hl-marquee { background: var(--hl-y); color: #111; } .hl-stars, .hl-stats strong { color: var(--hl-y) !important; } .hl-journal .wp-block-post-title a:hover, .hl-texture:hover .hl-texture-name a, .wp-block-button.is-style-link > .wp-block-button__link:hover { color: #111; background-color: transparent; } .hl-texture-name a { background-image: linear-gradient(var(--hl-y), var(--hl-y)); } .hl-texture:hover .hl-texture-name a { background-size: 100% 6px; } .hl-texture img, .hl-shop .wc-block-components-product-image img { object-position: 50% 30%; } .hl-gram .wp-block-image::after { background: rgba(190, 190, 190, .85); color: #111; } /* lookbook: the model shots */ .hl-lookbook { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: clamp(.6rem, 1.4vw, 1.2rem) !important; } .hl-lookbook .wp-block-image { margin: 0 !important; position: relative; overflow: hidden; border-radius: 18px; } .hl-lookbook img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 20%; display: block; transition: transform 1s var(--hl-ease); } .hl-lookbook .wp-block-image:hover img { transform: scale(1.05); } .hl-lookbook figcaption { position: absolute; left: .8rem; bottom: .8rem; margin: 0; background: #111; color: #fff; font-size: .7rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; padding: .45rem .75rem; border-radius: 999px; } @media (max-width: 781px) { .hl-lookbook { grid-template-columns: repeat(2, 1fr); } } /* neutral grey: on black sections the accent words are light grey */ .has-contrast-background-color h1 em, .has-contrast-background-color h2 em, .hl-footer-big em, .hl-reviews h2 em, .hl-stats em, .hl-reviews .hl-title em, .hl-stars, .hl-stats strong { color: #BDBDBD !important; } .hl-topbar p::before, .hl-topbar p::after { color: #BDBDBD; } /* Menu drawer colours and type */ :root { --rh-d-bg: #111111; --rh-d-fg: #FFFFFF; --rh-d-soft: rgba(255, 255, 255, .82); --rh-d-line: rgba(255, 255, 255, .14); --rh-d-accent: #D4D4D4; --rh-d-burger: #111111; --rh-d-backdrop: rgba(17, 17, 17, .55); --rh-d-head-font: var(--wp--preset--font-family--sans); --rh-d-head-weight: 600; --rh-d-head-transform: none; --rh-d-head-size: clamp(2rem, 7.5vw, 2.6rem); --rh-d-head-ls: -.04em; --rh-d-body-font: var(--wp--preset--font-family--sans); --rh-d-btn-bg: #D4D4D4; --rh-d-btn-fg: #111111; --rh-d-btn-hover-bg: #FFFFFF; --rh-d-btn-radius: 999px; } /* ========================================================================== Off-canvas menu drawer (phones and tablets, up to 1024px) The drawer is an ordinary group in the Header template part, so its links, button, contact details and social icons are edited in the Site Editor. Each theme sets the --rh-d-* colours and fonts at the top of its stylesheet. ========================================================================== */ .wp-site-blocks .rh-drawer { display: none; } .rh-burger { display: none; } @media (max-width: 1024px) { .rh-js .rh-hide-tablet { display: none !important; } .rh-js .rh-burger { display: inline-flex; } } @media (max-width: 599px) { .rh-js .rh-hide-phone { display: none !important; } } .rh-burger { align-items: center; justify-content: center; flex: 0 0 auto; width: 46px; height: 46px; margin: 0 -8px 0 0; padding: 0; background: transparent; border: 0; border-radius: 50%; color: var(--rh-d-burger, currentColor); cursor: pointer; -webkit-tap-highlight-color: transparent; } .rh-burger:focus-visible { outline: 2px solid var(--rh-d-accent, currentColor); outline-offset: 2px; } .rh-burger-lines { position: relative; display: block; width: 26px; height: 14px; } .rh-burger-lines::before, .rh-burger-lines::after { content: ""; position: absolute; right: 0; height: 2px; border-radius: 2px; background: currentColor; transition: width .3s ease; } .rh-burger-lines::before { top: 0; width: 26px; } .rh-burger-lines::after { bottom: 0; width: 17px; } .rh-burger:hover .rh-burger-lines::after { width: 26px; } /* The panel */ .rh-drawer.rh-ready { position: fixed; top: 0; right: 0; bottom: 0; z-index: 100000; display: flex; flex-direction: column; width: min(460px, 100%); max-width: 100%; height: 100%; height: 100dvh; margin: 0 !important; padding: 18px clamp(24px, 6vw, 44px) 34px !important; background: var(--rh-d-bg, #fff); color: var(--rh-d-fg, #111); overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; box-shadow: -24px 0 70px rgba(0, 0, 0, .22); transform: translateX(104%); visibility: hidden; transition: transform .5s cubic-bezier(.22, .8, .2, 1), visibility 0s linear .5s; font-family: var(--rh-d-body-font, inherit); } .rh-drawer.rh-ready.is-open { transform: none; visibility: visible; transition: transform .5s cubic-bezier(.22, .8, .2, 1); } .rh-drawer.rh-ready > * { margin-block: 0 !important; max-width: none !important; } .rh-drawer a { color: inherit; } .rh-drawer-backdrop { position: fixed; inset: 0; z-index: 99999; background: var(--rh-d-backdrop, rgba(12, 8, 10, .52)); opacity: 0; visibility: hidden; transition: opacity .4s ease, visibility 0s linear .4s; -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); } .rh-drawer-backdrop.is-open { opacity: 1; visibility: visible; transition: opacity .4s ease; } html.rh-drawer-open, html.rh-drawer-open body { overflow: hidden; } /* Head: logo + close */ .rh-drawer-head { display: flex !important; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 16px; border-bottom: 1px solid var(--rh-d-line, rgba(0, 0, 0, .12)); } .rh-drawer-head > *:not(.rh-drawer-close) { margin: 0 !important; } .rh-drawer-brand { min-width: 0; text-align: left !important; } .rh-drawer-brand > * { margin: 0 !important; text-align: left !important; justify-self: auto !important; } .rh-drawer-brand a { color: var(--rh-d-fg, inherit) !important; } .rh-drawer-close { flex: 0 0 auto; display: inline-grid; place-items: center; width: 46px; height: 46px; padding: 0; border: 1px solid var(--rh-d-line, rgba(0, 0, 0, .15)); border-radius: 50%; background: transparent; color: var(--rh-d-fg, inherit); cursor: pointer; transition: background .25s, color .25s, border-color .25s; } .rh-drawer-close:hover { background: var(--rh-d-fg, #111); color: var(--rh-d-bg, #fff); border-color: var(--rh-d-fg, #111); } .rh-drawer-close:focus-visible { outline: 2px solid var(--rh-d-accent, currentColor); outline-offset: 2px; } .rh-drawer-close svg { width: 18px; height: 18px; } /* Links */ .rh-drawer .rh-drawer-nav { display: block; margin-top: 10px !important; } .rh-drawer .rh-drawer-nav .wp-block-navigation__container { display: flex; flex-direction: column; align-items: stretch !important; gap: 0 !important; width: 100%; } .rh-drawer .rh-drawer-nav .wp-block-navigation-item { display: block; width: 100%; border-bottom: 1px solid var(--rh-d-line, rgba(0, 0, 0, .12)); } .rh-drawer .rh-drawer-nav .wp-block-navigation-item__content { display: flex !important; align-items: center; justify-content: space-between; gap: 12px; width: 100%; padding: .62em 0 !important; text-decoration: none; color: var(--rh-d-fg, inherit) !important; font-family: var(--rh-d-head-font, inherit) !important; font-weight: var(--rh-d-head-weight, 500) !important; font-size: var(--rh-d-head-size, clamp(1.6rem, 6.4vw, 2.1rem)) !important; line-height: 1.1 !important; letter-spacing: var(--rh-d-head-ls, -.01em) !important; text-transform: var(--rh-d-head-transform, none) !important; font-style: var(--rh-d-head-style, normal); transition: color .25s, padding .3s; } .rh-drawer .rh-drawer-nav .wp-block-navigation-item__content::before, .rh-drawer .rh-drawer-nav .wp-block-navigation-item__content::after { display: none !important; } .rh-drawer .rh-drawer-nav .wp-block-navigation-item__label::after { display: none !important; } .rh-drawer .rh-drawer-nav .wp-block-navigation-item__content .wp-block-navigation-item__label { position: static; } .rh-drawer .rh-drawer-nav .wp-block-navigation-item__content .rh-arrow { flex: 0 0 auto; font-family: var(--rh-d-body-font, inherit); font-size: 1.05rem; font-style: normal; font-weight: 400; letter-spacing: 0; text-transform: none; opacity: .38; transform: translateX(-6px); transition: opacity .25s, transform .3s, color .25s; } .rh-drawer .rh-drawer-nav .wp-block-navigation-item__content:hover, .rh-drawer .rh-drawer-nav .current-menu-item > .wp-block-navigation-item__content, .rh-drawer .rh-drawer-nav .wp-block-navigation-item__content[aria-current] { color: var(--rh-d-accent, inherit) !important; } .rh-drawer .rh-drawer-nav .wp-block-navigation-item__content:hover .rh-arrow, .rh-drawer .rh-drawer-nav .wp-block-navigation-item__content[aria-current] .rh-arrow { opacity: 1; transform: none; color: var(--rh-d-accent, inherit); } /* Staggered entrance */ .rh-drawer.rh-ready .rh-drawer-nav .wp-block-navigation-item, .rh-drawer.rh-ready .rh-drawer-reveal { opacity: 0; transform: translateX(22px); transition: opacity .45s ease, transform .55s cubic-bezier(.22, .8, .2, 1); transition-delay: calc(var(--rh-i, 0) * 55ms + 120ms); } .rh-drawer.rh-ready.is-open .rh-drawer-nav .wp-block-navigation-item, .rh-drawer.rh-ready.is-open .rh-drawer-reveal { opacity: 1; transform: none; } @media (prefers-reduced-motion: reduce) { .rh-drawer.rh-ready, .rh-drawer-backdrop, .rh-drawer.rh-ready .rh-drawer-nav .wp-block-navigation-item, .rh-drawer.rh-ready .rh-drawer-reveal { transition: none !important; } } /* Call to action */ .rh-drawer .rh-drawer-cta { margin-top: 26px !important; width: 100%; } .rh-drawer .rh-drawer-cta .wp-block-button { width: 100%; margin: 0; } .rh-drawer .rh-drawer-cta .wp-block-button__link { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 54px; box-sizing: border-box; background: var(--rh-d-btn-bg, #111) !important; color: var(--rh-d-btn-fg, #fff) !important; border: 0 !important; border-radius: var(--rh-d-btn-radius, 999px) !important; box-shadow: none !important; } .rh-drawer .rh-drawer-cta .wp-block-button__link:hover { background: var(--rh-d-btn-hover-bg, var(--rh-d-btn-bg, #111)) !important; color: var(--rh-d-btn-hover-fg, var(--rh-d-btn-fg, #fff)) !important; } /* Contact details */ .rh-drawer .rh-drawer-contact { display: grid !important; grid-template-columns: 1fr 1fr; gap: 20px 22px; margin-top: auto !important; padding-top: 30px !important; } .rh-drawer .rh-drawer-contact::before { content: ""; grid-column: 1 / -1; height: 1px; margin-bottom: 2px; background: var(--rh-d-line, rgba(0, 0, 0, .12)); } .rh-drawer .rh-drawer-item { min-width: 0; margin: 0 !important; } .rh-drawer .rh-drawer-item.is-wide { grid-column: 1 / -1; } .rh-drawer .rh-drawer-item > * { margin: 0 !important; } .rh-drawer .rh-drawer-label { margin-bottom: 6px !important; font-family: var(--rh-d-body-font, inherit) !important; font-size: .68rem !important; font-weight: 600 !important; font-style: normal !important; letter-spacing: .2em !important; text-transform: uppercase !important; color: var(--rh-d-accent, inherit) !important; line-height: 1.4 !important; } .rh-drawer .rh-drawer-item p:not(.rh-drawer-label) { font-family: var(--rh-d-body-font, inherit) !important; font-size: .92rem !important; line-height: 1.6 !important; color: var(--rh-d-soft, inherit) !important; overflow-wrap: anywhere; } .rh-drawer .rh-drawer-item a { text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .3s; color: var(--rh-d-fg, inherit) !important; } .rh-drawer .rh-drawer-item a:hover { background-size: 100% 1px; } @media (max-width: 359px) { .rh-drawer .rh-drawer-contact { grid-template-columns: 1fr; } } /* Social icons */ .rh-drawer .rh-drawer-social { display: flex; flex-wrap: wrap; gap: 10px !important; margin-top: 24px !important; padding: 0; } .rh-drawer .rh-drawer-social .wp-social-link { margin: 0 !important; background: transparent !important; color: var(--rh-d-fg, inherit) !important; } .rh-drawer .rh-drawer-social .wp-social-link a { display: grid; place-items: center; width: 42px; height: 42px; padding: 0 !important; border-radius: 50%; border: 1px solid var(--rh-d-line, rgba(0, 0, 0, .15)); color: inherit !important; transition: background .25s, color .25s, border-color .25s; } .rh-drawer .rh-drawer-social .wp-social-link a:hover { background: var(--rh-d-accent, #111); border-color: var(--rh-d-accent, #111); color: var(--rh-d-bg, #fff) !important; } .rh-drawer .rh-drawer-social .wp-social-link svg { width: 18px; height: 18px; fill: currentColor; } .rh-drawer .rh-drawer-note { margin-top: 18px !important; font-size: .78rem !important; letter-spacing: .04em; color: var(--rh-d-soft, inherit) !important; opacity: .85; } /* In the Site Editor the drawer shows as a plain panel under the header so it can be edited */ .editor-styles-wrapper .rh-drawer { margin-top: 24px; padding: 28px; background: var(--rh-d-bg, #fff); color: var(--rh-d-fg, #111); border-radius: 12px; } .editor-styles-wrapper .rh-drawer::before { content: "Mobile & tablet menu drawer"; display: block; margin-bottom: 12px; font: 600 11px/1.4 system-ui, sans-serif; letter-spacing: .12em; text-transform: uppercase; opacity: .6; } /* RH-TOTOP: back-to-top arrow (appears after scrolling down) */ .rh-totop { position: fixed; right: clamp(14px, 2.4vw, 28px); bottom: clamp(14px, 2.4vw, 28px); z-index: 9990; width: 48px; height: 48px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; cursor: pointer; background: var(--rh-d-bg, #111); color: var(--rh-d-fg, #fff); box-shadow: 0 10px 26px -10px rgba(0, 0, 0, .45); opacity: 0; visibility: hidden; transform: translateY(12px); transition: opacity .3s ease, transform .3s ease, visibility .3s, background .25s, color .25s; } .rh-totop.is-shown { opacity: 1; visibility: visible; transform: none; } .rh-totop:hover, .rh-totop:focus-visible { background: var(--rh-d-accent, #c00); color: var(--rh-d-bg, #111); } .rh-totop:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; } .rh-totop svg { width: 20px; height: 20px; } .rh-totop.is-raised { bottom: 84px; } .rh-drawer-open .rh-totop { opacity: 0; visibility: hidden; } @media (prefers-reduced-motion: reduce) { .rh-totop { transition: none; } } @media print { .rh-totop { display: none; } } /* WooCommerce colours and type */ :root { --rh-w-fg: #111111; --rh-w-bg: #FFFFFF; --rh-w-soft: #F5F5F5; --rh-w-line: #E5E5E5; --rh-w-accent: #111111; --rh-w-star: #D4D4D4; --rh-w-field-bg: #FFFFFF; --rh-w-head-font: var(--wp--preset--font-family--sans); --rh-w-head-weight: 600; --rh-w-body-font: var(--wp--preset--font-family--sans); --rh-w-display-font: var(--wp--preset--font-family--sans); --rh-w-display-weight: 600; --rh-w-display-transform: none; --rh-w-display-ls: -.05em; --rh-w-title-size: clamp(3rem, 8vw, 6.4rem); --rh-w-product-title-size: clamp(2.2rem, 3.8vw, 3.4rem); --rh-w-card-font: var(--wp--preset--font-family--sans); --rh-w-card-size: 1.2rem; --rh-w-card-weight: 600; --rh-w-btn-bg: #111111; --rh-w-btn-fg: #FFFFFF; --rh-w-btn-hover-bg: #D4D4D4; --rh-w-btn-hover-fg: #111111; --rh-w-radius: 999px; --rh-w-field-radius: 14px; --rh-w-img-radius: 18px; --rh-w-img-ratio: 4/5; --rh-w-sale-bg: #D4D4D4; --rh-w-sticky-top: 120px; } /* ========================================================================== WooCommerce: shop, product, bag, checkout and account pages. Every colour, font and corner comes from the --rh-w-* properties that each theme sets at the top of its stylesheet. ========================================================================== */ .rh-woo { --rh-w-gap: clamp(24px, 4vw, 64px); padding-bottom: clamp(48px, 7vw, 100px); } .rh-woo :where(h1, h2, h3, h4) { font-family: var(--rh-w-head-font); font-weight: var(--rh-w-head-weight, 500); text-transform: var(--rh-w-head-transform, none); letter-spacing: var(--rh-w-head-ls, -.01em); } .rh-woo-kicker { margin: 0 0 .6rem !important; font-family: var(--rh-w-body-font); font-size: .72rem !important; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--rh-w-accent); } .rh-woo .woocommerce-Price-amount { font-variant-numeric: lining-nums; } /* Top row: breadcrumbs + notices */ .rh-woo-top { padding-top: clamp(18px, 3vw, 34px); } .rh-woo .wc-block-breadcrumbs, .rh-woo .woocommerce-breadcrumb { margin: 0 0 8px; font-size: .74rem !important; letter-spacing: .14em; text-transform: uppercase; color: var(--rh-w-fg); } .rh-woo .woocommerce-breadcrumb a { color: var(--rh-w-fg); text-decoration: none; opacity: .7; } .rh-woo .woocommerce-breadcrumb a:hover { opacity: 1; color: var(--rh-w-accent); } /* Notices */ .rh-woo .wc-block-components-notice-banner, .woocommerce-message, .woocommerce-info, .woocommerce-error { border-radius: var(--rh-w-field-radius, 0) !important; border: 1px solid var(--rh-w-fg) !important; background: var(--rh-w-bg) !important; color: var(--rh-w-fg) !important; font-size: .92rem; padding: 14px 18px !important; box-shadow: none !important; } .rh-woo .wc-block-components-notice-banner.is-success { border-left: 4px solid var(--rh-w-accent) !important; } .rh-woo .wc-block-components-notice-banner.is-error { border-left: 4px solid #B3261E !important; } .rh-woo .wc-block-components-notice-banner > svg { background: var(--rh-w-accent) !important; fill: var(--rh-w-bg) !important; border-radius: 50%; } .rh-woo .wc-block-components-notice-banner .wc-forward, .rh-woo .wc-block-components-notice-banner__content .button { float: none !important; margin-left: 10px; color: var(--rh-w-fg) !important; background: none !important; padding: 0 !important; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--rh-w-accent); } /* Shared button look for every WooCommerce button */ .rh-woo :is(.single_add_to_cart_button, .wc-block-components-product-button__button, .wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button, .woocommerce-button, .button.alt, .wc-block-components-button:not(.is-link):not(.wc-block-components-totals-coupon__button)), .wc-block-mini-cart__footer-actions .wc-block-components-button:not(.is-link), .woocommerce-account .woocommerce .button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; padding: 14px 28px !important; background: var(--rh-w-btn-bg) !important; color: var(--rh-w-btn-fg) !important; border: 1px solid var(--rh-w-btn-bg) !important; border-radius: var(--rh-w-radius, 0) !important; box-shadow: none !important; cursor: pointer; font-family: var(--rh-w-body-font) !important; font-size: .8rem !important; font-weight: 600 !important; letter-spacing: var(--rh-w-btn-ls, .16em) !important; text-transform: var(--rh-w-btn-transform, uppercase) !important; line-height: 1.2 !important; text-decoration: none !important; transition: background .25s, color .25s, border-color .25s, transform .15s; } .rh-woo :is(.single_add_to_cart_button, .wc-block-components-product-button__button, .wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button, .woocommerce-button, .button.alt, .wc-block-components-button:not(.is-link):not(.wc-block-components-totals-coupon__button)):hover, .wc-block-mini-cart__footer-actions .wc-block-components-button:not(.is-link):hover, .woocommerce-account .woocommerce .button:hover { background: var(--rh-w-btn-hover-bg) !important; border-color: var(--rh-w-btn-hover-bg) !important; color: var(--rh-w-btn-hover-fg, var(--rh-w-btn-fg)) !important; } .rh-woo :is(.single_add_to_cart_button, .wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button):active { transform: scale(.985); } .rh-woo .single_add_to_cart_button.disabled { opacity: .45 !important; cursor: not-allowed; } /* Form fields */ .rh-woo :is(input[type=text], input[type=email], input[type=tel], input[type=number], input[type=password], input[type=search], select, textarea), .woocommerce-account .woocommerce :is(input[type=text], input[type=email], input[type=password], input[type=tel], select, textarea) { border: 1px solid var(--rh-w-field-line, var(--rh-w-fg)) !important; border-radius: var(--rh-w-field-radius, 0) !important; background: var(--rh-w-field-bg, var(--rh-w-bg)) !important; color: var(--rh-w-fg) !important; font-family: var(--rh-w-body-font) !important; box-shadow: none !important; } .rh-woo :is(input, select, textarea):focus { outline: 2px solid var(--rh-w-accent) !important; outline-offset: 1px; } /* ---------- Shop / category pages ---------- */ .rh-shop-head { padding: clamp(10px, 2vw, 22px) 0 clamp(18px, 3vw, 30px); } .rh-shop-head .rh-shop-title, .rh-woo .rh-shop-title { margin: 0 !important; font-family: var(--rh-w-display-font, var(--rh-w-head-font)) !important; font-weight: var(--rh-w-display-weight, var(--rh-w-head-weight, 500)) !important; font-size: var(--rh-w-title-size, clamp(2.4rem, 6vw, 4.6rem)) !important; line-height: 1 !important; text-transform: var(--rh-w-display-transform, var(--rh-w-head-transform, none)) !important; letter-spacing: var(--rh-w-display-ls, -.02em) !important; } .rh-shop-head .wp-block-term-description { max-width: 60ch; margin-top: 14px; } .rh-shop-head .wp-block-term-description p { margin: 0; } .rh-shop-toolbar { align-items: center; gap: 12px; margin-top: 0 !important; margin-bottom: clamp(20px, 3vw, 34px) !important; padding: 12px 0; border-top: 1px solid var(--rh-w-line); border-bottom: 1px solid var(--rh-w-line); } .rh-shop-toolbar > * { margin: 0 !important; } .rh-shop-toolbar .woocommerce-result-count { margin: 0; font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; } .rh-shop-toolbar .woocommerce-ordering { margin: 0; } .rh-shop-toolbar .woocommerce-ordering select { min-height: 42px; padding: 8px 38px 8px 14px !important; font-size: .82rem; letter-spacing: .04em; appearance: none; -webkit-appearance: none; background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%) !important; background-position: calc(100% - 18px) 50%, calc(100% - 13px) 50% !important; background-size: 5px 5px !important; background-repeat: no-repeat !important; } /* Product cards */ .rh-woo .wc-block-product-template { gap: clamp(28px, 3vw, 44px) clamp(14px, 2vw, 28px) !important; margin: 0; padding: 0; } .rh-woo .wc-block-product { position: relative; display: flex; flex-direction: column; margin: 0 !important; text-align: inherit; } .rh-woo .wc-block-product > * { margin-block: 0 !important; } .rh-woo .wc-block-components-product-image { position: relative; margin: 0 0 14px !important; overflow: hidden; border-radius: var(--rh-w-img-radius, 0); background: var(--rh-w-soft); } .rh-woo .wc-block-components-product-image img { width: 100%; height: auto !important; aspect-ratio: var(--rh-w-img-ratio, 3/4); object-fit: cover; transition: transform .9s cubic-bezier(.2, .7, .2, 1); } .rh-woo .wc-block-product:hover .wc-block-components-product-image img { transform: scale(1.045); } .rh-woo .wc-block-product .wp-block-post-title { margin: 0 0 4px !important; font-family: var(--rh-w-card-font, var(--rh-w-head-font)) !important; font-size: var(--rh-w-card-size, 1.2rem) !important; font-weight: var(--rh-w-card-weight, var(--rh-w-head-weight, 500)) !important; line-height: 1.25 !important; text-transform: var(--rh-w-card-transform, none) !important; letter-spacing: var(--rh-w-card-ls, 0) !important; } .rh-woo .wc-block-product .wp-block-post-title a { color: var(--rh-w-fg); text-decoration: none; } .rh-woo .wc-block-product .wp-block-post-title a:hover { color: var(--rh-w-accent); } .rh-woo .wc-block-product .wc-block-components-product-price { margin: 0 !important; font-family: var(--rh-w-body-font); font-size: .95rem !important; letter-spacing: .02em; color: var(--rh-w-fg); } .rh-woo .wc-block-components-product-price del { opacity: .55; margin-right: 6px; } .rh-woo .wc-block-components-product-price ins { text-decoration: none; color: var(--rh-w-accent); font-weight: 600; } .rh-woo .wc-block-product .wp-block-woocommerce-product-button { margin-top: 14px !important; } .rh-woo .wc-block-product .wc-block-components-product-button__button { width: 100%; min-height: 46px; padding: 10px 16px !important; font-size: .72rem !important; background: transparent !important; color: var(--rh-w-fg) !important; border-color: var(--rh-w-fg) !important; } .rh-woo .wc-block-product .wc-block-components-product-button__button:hover { background: var(--rh-w-fg) !important; color: var(--rh-w-bg) !important; border-color: var(--rh-w-fg) !important; } .rh-woo .wc-block-components-product-button .added_to_cart { display: block; margin-top: 8px; font-size: .8rem; text-align: center; color: var(--rh-w-fg); text-decoration: underline; text-decoration-color: var(--rh-w-accent); text-underline-offset: 3px; } .rh-woo .wc-block-components-product-sale-badge, .rh-woo .onsale { position: absolute; top: 12px !important; left: 12px !important; right: auto !important; z-index: 2; margin: 0 !important; padding: 6px 10px !important; border: 0 !important; border-radius: var(--rh-w-badge-radius, 0) !important; background: var(--rh-w-sale-bg, var(--rh-w-accent)) !important; color: var(--rh-w-sale-fg, #fff) !important; font-family: var(--rh-w-body-font); font-size: .66rem !important; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; line-height: 1.2; min-height: 0; min-width: 0; } .rh-woo .wp-block-query-pagination { margin-top: clamp(30px, 4vw, 54px) !important; gap: 6px; font-size: .9rem; } .rh-woo .wp-block-query-pagination a, .rh-woo .wp-block-query-pagination .current { display: inline-grid; place-items: center; min-width: 42px; height: 42px; padding: 0 10px; border: 1px solid var(--rh-w-line); border-radius: var(--rh-w-radius, 0); color: var(--rh-w-fg); text-decoration: none; } .rh-woo .wp-block-query-pagination .current { background: var(--rh-w-fg); color: var(--rh-w-bg); border-color: var(--rh-w-fg); } @media (max-width: 781px) { .rh-woo .wc-block-product-template.wc-block-product-template__responsive, .rh-woo .wc-block-product-template { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } .rh-woo .wc-block-product .wp-block-post-title { font-size: calc(var(--rh-w-card-size, 1.2rem) * .88) !important; } } /* ---------- Single product ---------- */ .rh-product { gap: var(--rh-w-gap) !important; margin-top: 10px !important; margin-bottom: clamp(40px, 6vw, 90px) !important; align-items: flex-start !important; } .rh-product-media { flex-basis: 58% !important; min-width: 0; } .rh-product-info { flex-basis: 42% !important; min-width: 0; position: sticky; top: var(--rh-w-sticky-top, 110px); } .rh-product-info > * { margin-block: 0 !important; } .rh-woo .woocommerce-product-gallery { position: relative; margin: 0 !important; width: 100% !important; float: none !important; opacity: 1 !important; } .rh-woo .woocommerce-product-gallery__image img { width: 100%; height: auto; border-radius: var(--rh-w-img-radius, 0); background: var(--rh-w-soft); } .rh-woo .woocommerce-product-gallery .flex-viewport { border-radius: var(--rh-w-img-radius, 0); } .rh-woo .woocommerce-product-gallery .flex-control-thumbs { display: grid !important; grid-template-columns: repeat(5, 1fr); gap: 10px; margin: 12px 0 0 !important; padding: 0 !important; list-style: none; } .rh-woo .woocommerce-product-gallery .flex-control-thumbs li { width: auto !important; float: none !important; margin: 0 !important; } .rh-woo .woocommerce-product-gallery .flex-control-thumbs img { aspect-ratio: 1; object-fit: cover; border-radius: var(--rh-w-img-radius, 0); opacity: .55; cursor: pointer; transition: opacity .25s; border: 1px solid transparent; } .rh-woo .woocommerce-product-gallery .flex-control-thumbs img.flex-active, .rh-woo .woocommerce-product-gallery .flex-control-thumbs img:hover { opacity: 1; border-color: var(--rh-w-fg); } .rh-woo .woocommerce-product-gallery__trigger { position: absolute; top: 16px; right: 16px; z-index: 5; display: grid !important; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--rh-w-bg) !important; color: transparent; font-size: 0; box-shadow: 0 4px 18px rgba(0, 0, 0, .12); } .rh-woo .woocommerce-product-gallery__trigger::before { content: ""; width: 16px; height: 16px; border: 1.6px solid var(--rh-w-fg); border-radius: 50%; position: absolute; top: 12px; left: 12px; } .rh-woo .woocommerce-product-gallery__trigger::after { content: ""; width: 7px; height: 1.6px; background: var(--rh-w-fg); position: absolute; top: 30px; left: 26px; transform: rotate(45deg); } .rh-woo .woocommerce-product-gallery__trigger img { display: none !important; } .rh-product-info .rh-product-cats { margin-bottom: 12px !important; } .rh-product-info .rh-product-cats a { color: inherit; text-decoration: none; } .rh-product-info .rh-product-title { margin-bottom: 12px !important; font-family: var(--rh-w-display-font, var(--rh-w-head-font)) !important; font-weight: var(--rh-w-display-weight, var(--rh-w-head-weight, 500)) !important; font-size: var(--rh-w-product-title-size, clamp(2rem, 3.6vw, 3.2rem)) !important; line-height: 1.04 !important; text-transform: var(--rh-w-display-transform, none) !important; letter-spacing: var(--rh-w-display-ls, -.02em) !important; } .rh-product-info .wc-block-components-product-rating { margin-bottom: 14px !important; font-size: .85rem; } .rh-product-info .wc-block-components-product-rating__stars { color: var(--rh-w-star, var(--rh-w-accent)); } .rh-product-info .wc-block-components-product-rating__reviews_count a, .rh-product-info .woocommerce-review-link { color: var(--rh-w-fg); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--rh-w-line); } .rh-product-info .rh-product-price, .rh-product-info .wc-block-components-product-price { margin-bottom: 18px !important; font-family: var(--rh-w-price-font, var(--rh-w-body-font)); font-size: 1.45rem !important; letter-spacing: .01em; } .rh-product-info .rh-product-excerpt { margin-bottom: 22px !important; padding-bottom: 22px; border-bottom: 1px solid var(--rh-w-line); } .rh-product-info .rh-product-excerpt p { margin: 0; font-size: 1rem; line-height: 1.7; } .rh-product-info .wp-block-post-excerpt__more-text { display: none; } /* Add to bag form */ .rh-woo .wp-block-woocommerce-add-to-cart-form form.cart { display: flex; flex-wrap: wrap; gap: 12px; margin: 0 0 22px !important; } .rh-woo .wp-block-woocommerce-add-to-cart-form form.variations_form { display: block; } .rh-woo table.variations { width: 100%; margin: 0 0 16px !important; border: 0; border-collapse: collapse; } .rh-woo table.variations tr { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; } .rh-woo table.variations th, .rh-woo table.variations td { display: block; padding: 0 !important; border: 0; text-align: left; line-height: 1.3; } .rh-woo table.variations th label { font-size: .74rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; } .rh-woo table.variations select { width: 100%; min-height: 52px; padding: 12px 44px 12px 16px !important; font-size: 1rem; appearance: none; -webkit-appearance: none; background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%) !important; background-position: calc(100% - 22px) 50%, calc(100% - 16px) 50% !important; background-size: 6px 6px !important; background-repeat: no-repeat !important; } .rh-woo .rh-size-pills { display: flex; flex-wrap: wrap; gap: 8px; } .rh-woo .rh-size-pills button { min-width: 54px; height: 48px; padding: 0 14px; border: 1px solid var(--rh-w-line); border-radius: var(--rh-w-radius, 0); background: var(--rh-w-bg); color: var(--rh-w-fg); font: 500 .9rem var(--rh-w-body-font); letter-spacing: .06em; cursor: pointer; transition: border-color .2s, background .2s, color .2s; } .rh-woo .rh-size-pills button:hover { border-color: var(--rh-w-fg); } .rh-woo .rh-size-pills button[aria-pressed=true] { background: var(--rh-w-fg); color: var(--rh-w-bg); border-color: var(--rh-w-fg); } .rh-woo .rh-size-pills button:disabled { opacity: .35; text-decoration: line-through; cursor: not-allowed; } .rh-woo .rh-size-pills + select { position: absolute !important; width: 1px !important; height: 1px !important; opacity: 0; pointer-events: none; } .rh-woo .reset_variations { display: inline-block; margin-top: 4px; font-size: .78rem; color: var(--rh-w-fg); text-decoration: underline; text-underline-offset: 3px; } .rh-woo .single_variation_wrap .woocommerce-variation { margin-bottom: 12px; } .rh-woo .single_variation_wrap .woocommerce-variation-price { font-size: 1.15rem; } .rh-woo .woocommerce-variation-availability p.stock { margin: 0; font-size: .85rem; } .rh-woo .woocommerce-variation-add-to-cart, .rh-woo form.cart:not(.variations_form) { display: flex !important; gap: 12px; align-items: stretch; } .rh-woo .quantity { display: flex; align-items: stretch; } .rh-woo .quantity .qty { width: 76px !important; min-height: 52px; padding: 8px !important; text-align: center; font-size: 1rem; -moz-appearance: textfield; } .rh-woo .single_add_to_cart_button { flex: 1 1 auto; min-height: 54px; } .rh-woo p.stock.out-of-stock { color: #B3261E; font-weight: 600; } /* Perks + meta */ .rh-product-perks { list-style: none; margin: 0 0 22px !important; padding: 18px 0 0 !important; border-top: 1px solid var(--rh-w-line); display: grid; gap: 10px; } .rh-product-perks li { position: relative; padding-left: 26px; font-size: .9rem; line-height: 1.45; } .rh-product-perks li::before { content: ""; position: absolute; left: 2px; top: .35em; width: 12px; height: 7px; border-left: 1.6px solid var(--rh-w-accent); border-bottom: 1.6px solid var(--rh-w-accent); transform: rotate(-45deg); } .rh-woo .wp-block-woocommerce-product-meta { font-size: .78rem; letter-spacing: .06em; } .rh-woo .wp-block-woocommerce-product-meta .wp-block-group { display: flex; flex-wrap: wrap; gap: 6px 18px; } .rh-woo .wp-block-woocommerce-product-meta > .wp-block-group > * { margin: 0 !important; } .rh-woo .wp-block-woocommerce-product-meta a { color: var(--rh-w-fg); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--rh-w-line); } /* Details tabs */ .rh-woo .rh-product-details, .rh-woo .wp-block-woocommerce-product-details { margin-bottom: clamp(50px, 7vw, 100px) !important; } .rh-woo .woocommerce-tabs ul.tabs, .rh-woo .wc-tabs { display: flex; flex-wrap: wrap; gap: 0 clamp(18px, 3vw, 40px); margin: 0 0 30px !important; padding: 0 !important; border-bottom: 1px solid var(--rh-w-line); list-style: none; } .rh-woo .woocommerce-tabs ul.tabs::before, .rh-woo .woocommerce-tabs ul.tabs::after { display: none !important; } .rh-woo .woocommerce-tabs ul.tabs li { margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; border-radius: 0 !important; } .rh-woo .woocommerce-tabs ul.tabs li::before, .rh-woo .woocommerce-tabs ul.tabs li::after { display: none !important; } .rh-woo .woocommerce-tabs ul.tabs li a { display: block; padding: 14px 0 !important; margin-bottom: -1px; border-bottom: 2px solid transparent; color: var(--rh-w-fg) !important; text-decoration: none; font-family: var(--rh-w-body-font); font-size: .78rem; font-weight: 600 !important; letter-spacing: .18em; text-transform: uppercase; opacity: .6; transition: opacity .2s, border-color .2s; } .rh-woo .woocommerce-tabs ul.tabs li.active a, .rh-woo .woocommerce-tabs ul.tabs li a:hover { opacity: 1; border-bottom-color: var(--rh-w-accent); } .rh-woo .woocommerce-Tabs-panel { max-width: 780px; font-size: 1rem; line-height: 1.75; } .rh-woo .woocommerce-Tabs-panel > h2:first-child { display: none; } .rh-woo .woocommerce-Tabs-panel h3 { margin: 28px 0 8px; font-size: 1.15rem; } .rh-woo .woocommerce-Tabs-panel ul { padding-left: 1.1em; } .rh-woo .woocommerce-product-attributes { width: 100%; border-collapse: collapse; border-top: 1px solid var(--rh-w-line); } .rh-woo .woocommerce-product-attributes th, .rh-woo .woocommerce-product-attributes td { padding: 14px 0 !important; border: 0 !important; border-bottom: 1px solid var(--rh-w-line) !important; text-align: left; font-weight: 400; background: none !important; } .rh-woo .woocommerce-product-attributes th { width: 34%; font-size: .78rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; } .rh-woo .woocommerce-product-attributes td p { margin: 0; font-style: normal; } /* Reviews */ .rh-woo #reviews .commentlist { list-style: none; margin: 0; padding: 0; } .rh-woo #reviews .commentlist li { padding: 18px 0; border-bottom: 1px solid var(--rh-w-line); } .rh-woo #reviews .commentlist li img.avatar { display: none; } .rh-woo #reviews .comment-text { margin: 0 !important; padding: 0 !important; border: 0 !important; } .rh-woo #reviews .star-rating, .rh-woo .star-rating { color: var(--rh-w-star, var(--rh-w-accent)); } .rh-woo #reviews .meta { font-size: .85rem; } .rh-woo #review_form_wrapper { margin-top: 26px; padding: 24px; border: 1px solid var(--rh-w-line); border-radius: var(--rh-w-card-radius, 0); } .rh-woo #review_form .comment-reply-title { font-family: var(--rh-w-head-font); font-size: 1.3rem; } .rh-woo #review_form p.stars a { color: var(--rh-w-star, var(--rh-w-accent)); } .rh-woo #review_form .form-submit input { background: var(--rh-w-btn-bg); color: var(--rh-w-btn-fg); border: 0; border-radius: var(--rh-w-radius, 0); padding: 14px 26px; font: 600 .8rem var(--rh-w-body-font); letter-spacing: .16em; text-transform: uppercase; cursor: pointer; } /* Related */ .rh-related { padding-top: clamp(30px, 5vw, 60px); border-top: 1px solid var(--rh-w-line); } .rh-related > .wp-block-heading { margin: 0 0 clamp(20px, 3vw, 36px) !important; font-size: var(--rh-w-section-size, clamp(1.8rem, 3.4vw, 2.8rem)) !important; } @media (max-width: 900px) { .rh-product { flex-wrap: wrap !important; } .rh-product-media, .rh-product-info { flex-basis: 100% !important; } .rh-product-info { position: static; } .rh-woo .woocommerce-product-gallery .flex-control-thumbs { grid-template-columns: repeat(5, 1fr); gap: 8px; } } @media (max-width: 600px) { .rh-woo .woocommerce-product-gallery { margin-inline: calc(var(--wp--style--root--padding-left, 20px) * -1) !important; width: calc(100% + var(--wp--style--root--padding-left, 20px) * 2) !important; } .rh-woo .woocommerce-product-gallery__image img { border-radius: 0; } .rh-woo .woocommerce-product-gallery .flex-control-thumbs { padding-inline: var(--wp--style--root--padding-left, 20px) !important; } .rh-woo .woocommerce-tabs ul.tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; } .rh-woo .woocommerce-tabs ul.tabs li { flex: 0 0 auto; } } /* ---------- Bag (cart block) ---------- */ .rh-woo .wp-block-woocommerce-cart { margin-top: 0 !important; } .rh-woo .wc-block-cart { gap: var(--rh-w-gap); } .rh-woo table.wc-block-cart-items { border-collapse: collapse; } .rh-woo .wc-block-cart-items__header { font-size: .72rem !important; letter-spacing: .2em; text-transform: uppercase; border-bottom: 1px solid var(--rh-w-fg) !important; } .rh-woo .wc-block-cart-items__header th { padding-bottom: 12px !important; font-weight: 600 !important; } .rh-woo .wc-block-cart-items__row { border-bottom: 1px solid var(--rh-w-line) !important; } .rh-woo .wc-block-cart-items__row > td { padding-top: 22px !important; padding-bottom: 22px !important; } .rh-woo .wc-block-cart-item__image img { width: 100% !important; aspect-ratio: var(--rh-w-img-ratio, 3/4); object-fit: cover; border-radius: var(--rh-w-img-radius, 0); } .rh-woo .wc-block-cart.is-large .wc-block-cart-items td.wc-block-cart-item__image { width: 110px !important; padding-right: 20px !important; } .rh-woo .wc-block-cart:not(.is-large) .wc-block-cart-item__image img { aspect-ratio: 3/4; } .rh-woo .wc-block-components-product-name { font-family: var(--rh-w-card-font, var(--rh-w-head-font)); font-size: 1.15rem !important; font-weight: var(--rh-w-card-weight, var(--rh-w-head-weight, 500)) !important; text-transform: var(--rh-w-card-transform, none); letter-spacing: var(--rh-w-card-ls, 0); color: var(--rh-w-fg) !important; text-decoration: none !important; line-height: 1.25 !important; } .rh-woo .wc-block-components-product-metadata, .rh-woo .wc-block-components-product-details { font-size: .82rem !important; } .rh-woo .wc-block-components-product-details__name { font-weight: 600; } .rh-woo .wc-block-components-quantity-selector { border: 1px solid var(--rh-w-line) !important; border-radius: var(--rh-w-field-radius, 0) !important; } .rh-woo .wc-block-components-quantity-selector::after { display: none !important; } .rh-woo .wc-block-components-quantity-selector input { border: 0 !important; } .rh-woo .wc-block-cart-item__remove-link { color: var(--rh-w-fg) !important; font-size: .78rem !important; text-decoration: underline !important; text-underline-offset: 3px; text-decoration-color: var(--rh-w-accent) !important; } .rh-woo .wc-block-cart__sidebar, .rh-woo .wc-block-checkout__sidebar { align-self: flex-start; } .rh-woo .wp-block-woocommerce-cart-totals-block, .rh-woo .wc-block-cart__totals-title { } .rh-woo .wc-block-cart .wc-block-cart__totals-title { margin: 0 !important; padding: 0 0 12px !important; border-bottom: 1px solid var(--rh-w-fg); font-family: var(--rh-w-body-font) !important; font-size: .74rem !important; font-weight: 600 !important; letter-spacing: .2em !important; text-transform: uppercase !important; text-align: left !important; } .rh-woo .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-block, .rh-woo .wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-block { padding: clamp(20px, 2.4vw, 30px) !important; background: var(--rh-w-soft) !important; border: 1px solid var(--rh-w-summary-line, var(--rh-w-soft)) !important; border-radius: var(--rh-w-card-radius, 0) !important; } .rh-woo .wc-block-components-totals-wrapper { border-top: 1px solid var(--rh-w-line) !important; padding: 14px 0 !important; } .rh-woo .wc-block-components-totals-wrapper:first-child { border-top: 0 !important; } .rh-woo .wc-block-components-totals-item__label, .rh-woo .wc-block-components-totals-item__value { font-size: .95rem; } .rh-woo .wc-block-components-totals-footer-item .wc-block-components-totals-item__label, .rh-woo .wc-block-components-totals-footer-item .wc-block-components-totals-item__value { font-family: var(--rh-w-price-font, var(--rh-w-head-font)); font-size: 1.35rem !important; font-weight: var(--rh-w-head-weight, 500) !important; } .rh-woo .wc-block-components-panel__button { font-size: .9rem !important; } .rh-woo .wc-block-cart__submit-container { padding: 0 !important; } .rh-woo .wc-block-cart__submit-button { width: 100%; min-height: 58px; } .rh-woo .wc-block-cart__payment-options { display: none; } .rh-woo .wp-block-woocommerce-empty-cart-block { padding: clamp(30px, 6vw, 70px) 0; text-align: center; } .rh-woo .wc-block-cart__empty-cart__title { font-family: var(--rh-w-head-font); font-size: clamp(1.6rem, 3vw, 2.4rem) !important; } .rh-woo .wc-block-cart__empty-cart__title.with-empty-cart-icon::before { background-color: var(--rh-w-accent) !important; } .rh-woo .wp-block-woocommerce-empty-cart-block .wp-block-separator { max-width: 80px; margin-inline: auto; border-color: var(--rh-w-line); } .rh-woo .wp-block-woocommerce-empty-cart-block .wp-block-heading:not(.wc-block-cart__empty-cart__title) { font-size: 1.4rem; } /* ---------- Checkout ---------- */ .rh-checkout-header { padding: 18px clamp(20px, 4vw, 48px) !important; border-bottom: 1px solid var(--rh-w-line); background: var(--rh-w-bg); align-items: center !important; gap: 14px; } .rh-checkout-header > * { margin: 0 !important; } .rh-checkout-brand { flex: 1 1 auto; } .rh-checkout-brand > * { margin: 0 !important; } .rh-checkout-back a, .rh-checkout-secure { font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; color: var(--rh-w-fg); text-decoration: none; white-space: nowrap; } .rh-checkout-back a:hover { color: var(--rh-w-accent); } .rh-checkout-secure { display: inline-flex; align-items: center; gap: 8px; padding-left: 16px; border-left: 1px solid var(--rh-w-line); } .rh-checkout-secure::before { content: ""; width: 12px; height: 9px; border: 1.5px solid var(--rh-w-accent); border-radius: 2px; box-shadow: 0 -5px 0 -2.5px var(--rh-w-bg), 0 -5px 0 -1px var(--rh-w-accent); margin-top: 3px; } .rh-checkout-footer { padding: 26px 20px !important; border-top: 1px solid var(--rh-w-line); text-align: center; } .rh-checkout-footer p { margin: 0 auto; font-size: .82rem; } @media (max-width: 600px) { .rh-checkout-back { display: none; } .rh-checkout-secure { border-left: 0; padding-left: 0; } } .rh-woo-checkout { padding-top: clamp(24px, 4vw, 54px); } .rh-woo .wc-block-checkout { gap: var(--rh-w-gap); } .rh-woo .wc-block-components-checkout-step { margin-bottom: 30px !important; } .rh-woo .wc-block-components-checkout-step__heading { margin-bottom: 14px !important; } .rh-woo .wc-block-components-checkout-step__title { font-family: var(--rh-w-head-font) !important; font-size: 1.35rem !important; font-weight: var(--rh-w-head-weight, 500) !important; text-transform: var(--rh-w-head-transform, none); letter-spacing: var(--rh-w-head-ls, -.01em); } .rh-woo .wc-block-components-checkout-step__container::after { display: none !important; } .rh-woo .wc-block-components-checkout-step::after { display: none !important; } .rh-woo .wc-block-components-checkout-step { padding-left: 0 !important; } .rh-woo .wc-block-components-checkout-step__heading-content { font-size: .82rem; } .rh-woo .wc-block-components-text-input input, .rh-woo .wc-block-components-combobox .components-combobox-control input, .rh-woo .wc-blocks-components-select .wc-blocks-components-select__select, .rh-woo .wc-block-components-textarea, .rh-woo .wc-block-components-address-form textarea { border: 1px solid var(--rh-w-field-line, var(--rh-w-fg)) !important; border-radius: var(--rh-w-field-radius, 0) !important; background: var(--rh-w-field-bg, var(--rh-w-bg)) !important; color: var(--rh-w-fg) !important; box-shadow: none !important; font-family: var(--rh-w-body-font) !important; } .rh-woo .wc-block-components-text-input input:focus, .rh-woo .wc-blocks-components-select .wc-blocks-components-select__select:focus { border-color: var(--rh-w-accent) !important; outline: 1px solid var(--rh-w-accent) !important; } .rh-woo .wc-block-components-text-input label, .rh-woo .wc-blocks-components-select__label { color: var(--rh-w-fg) !important; opacity: .75; } .rh-woo .wc-block-components-text-input.has-error input { border-color: #B3261E !important; } .rh-woo .wc-block-components-validation-error { color: #B3261E !important; } .rh-woo .wc-block-components-radio-control__option, .rh-woo .wc-block-components-radio-control-accordion-option { border-color: var(--rh-w-line) !important; border-radius: var(--rh-w-field-radius, 0) !important; } .rh-woo .wc-block-components-radio-control__input:checked { border-color: var(--rh-w-accent) !important; } .rh-woo .wc-block-components-radio-control__input:checked::before { background: var(--rh-w-accent) !important; } .rh-woo .wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox] { border-color: var(--rh-w-fg) !important; border-radius: var(--rh-w-field-radius, 0) !important; } .rh-woo .wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox]:checked { background: var(--rh-w-accent) !important; border-color: var(--rh-w-accent) !important; } .rh-woo .wc-block-components-checkbox .wc-block-components-checkbox__mark { fill: #fff !important; } .rh-woo .wc-block-components-checkout-place-order-button { width: 100%; min-height: 60px; font-size: .86rem !important; } .rh-woo .wc-block-checkout__actions_row { gap: 18px; flex-wrap: wrap-reverse; } .rh-woo .wc-block-components-checkout-return-to-cart-button { color: var(--rh-w-fg) !important; font-size: .82rem; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--rh-w-accent); } .rh-woo .wc-block-checkout__terms { font-size: .8rem; } .rh-woo .wc-block-components-order-summary-item__image img { border-radius: var(--rh-w-img-radius, 0); aspect-ratio: 1; object-fit: cover; } .rh-woo .wc-block-components-order-summary-item__quantity { background: var(--rh-w-fg) !important; color: var(--rh-w-bg) !important; border: 0 !important; box-shadow: none !important; } .rh-woo .wc-block-components-order-summary .wc-block-components-panel__button, .rh-woo .wc-block-components-checkout-order-summary__title-text { font-family: var(--rh-w-body-font) !important; font-size: .74rem !important; font-weight: 600 !important; letter-spacing: .2em; text-transform: uppercase; } .rh-woo a { text-underline-offset: 3px; } @media (max-width: 699px) { .rh-woo .wc-block-components-checkout-order-summary__title { background: var(--rh-w-soft); padding: 14px 16px !important; } } /* ---------- Order received ---------- */ .rh-woo-confirmation .rh-shop-head { padding-top: clamp(30px, 5vw, 60px); } .rh-woo .wc-block-order-confirmation-status p { font-size: 1.05rem; } .rh-woo .wc-block-order-confirmation-summary ul { display: flex; flex-wrap: wrap; gap: 0; margin: 24px 0 0 !important; padding: 0 !important; border: 1px solid var(--rh-w-line) !important; list-style: none; } .rh-woo .wc-block-order-confirmation-summary-list-item { flex: 1 1 180px; padding: 16px 20px !important; border-right: 1px solid var(--rh-w-line) !important; } .rh-woo .wc-block-order-confirmation-summary-list-item__key { display: block; font-size: .7rem; font-weight: 600 !important; letter-spacing: .18em; text-transform: uppercase; margin-bottom: 4px; } .rh-woo .wc-block-order-confirmation-totals table { border-collapse: collapse; width: 100%; } .rh-woo .wc-block-order-confirmation-totals :is(th, td) { padding: 14px 0 !important; border-bottom: 1px solid var(--rh-w-line) !important; text-align: left; } .rh-woo .wc-block-order-confirmation-totals tfoot tr:last-child :is(th, td) { font-family: var(--rh-w-head-font); font-size: 1.25rem; } .rh-woo-confirmation h3.wp-block-heading { margin-top: 40px !important; font-size: 1.35rem; } /* ---------- Header mini-cart button + drawer ---------- */ .rh-mini-cart { display: inline-flex; } .rh-mini-cart .wc-block-mini-cart__button { position: relative; display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0 !important; color: var(--rh-w-icon, currentColor) !important; border-radius: 50%; } .rh-mini-cart .wc-block-mini-cart__button:hover { opacity: .75; } .rh-mini-cart .wc-block-mini-cart__icon { width: 24px; height: 24px; } .rh-mini-cart .wc-block-mini-cart__badge { top: 4px !important; right: 2px !important; left: auto !important; min-width: 18px; height: 18px; padding: 0 4px; margin: 0 !important; border: 0 !important; border-radius: 999px; background: var(--rh-w-accent) !important; color: #fff !important; font: 600 .66rem/18px var(--rh-w-body-font); transform: none !important; } .wc-block-mini-cart__drawer .components-modal__content, .wc-block-components-drawer { background: var(--rh-w-bg) !important; color: var(--rh-w-fg); font-family: var(--rh-w-body-font); } .wc-block-components-drawer__screen-overlay { background: rgba(0, 0, 0, .45) !important; } .wc-block-mini-cart__title { font-family: var(--rh-w-head-font) !important; font-weight: var(--rh-w-head-weight, 500) !important; font-size: 1.5rem !important; text-transform: var(--rh-w-head-transform, none); letter-spacing: var(--rh-w-head-ls, -.01em); margin: 24px 24px 8px !important; } .wc-block-mini-cart__items { padding: 0 24px !important; } .wc-block-mini-cart__items .wc-block-cart-items__row { padding: 16px 0 !important; border-bottom: 1px solid var(--rh-w-line); } .wc-block-mini-cart__items .wc-block-cart-item__image img { aspect-ratio: var(--rh-w-img-ratio, 3/4); object-fit: cover; border-radius: var(--rh-w-img-radius, 0); } .wc-block-mini-cart__items .wc-block-components-product-name { font-family: var(--rh-w-card-font, var(--rh-w-head-font)); font-weight: var(--rh-w-card-weight, 500); color: var(--rh-w-fg) !important; text-decoration: none; text-transform: var(--rh-w-card-transform, none); } .wc-block-mini-cart__footer { padding: 20px 24px 24px !important; border-top: 1px solid var(--rh-w-fg); } .wc-block-mini-cart__footer::after { display: none !important; } .wc-block-mini-cart__footer-actions { gap: 10px !important; } .wc-block-mini-cart__footer-actions .wc-block-components-button { flex: 1 1 0; min-height: 52px; border-radius: var(--rh-w-radius, 0) !important; font-family: var(--rh-w-body-font) !important; font-size: .74rem !important; font-weight: 600 !important; letter-spacing: .14em; text-transform: uppercase; } .wc-block-mini-cart__footer-actions .wc-block-mini-cart__footer-cart.wc-block-components-button { background: transparent !important; color: var(--rh-w-fg) !important; border: 1px solid var(--rh-w-fg) !important; } .wc-block-mini-cart__footer-actions .wc-block-mini-cart__footer-cart.wc-block-components-button:hover { background: var(--rh-w-fg) !important; color: var(--rh-w-bg) !important; } .wc-block-mini-cart__footer-actions .wc-block-mini-cart__footer-checkout { background: var(--rh-w-btn-bg) !important; color: var(--rh-w-btn-fg) !important; border: 1px solid var(--rh-w-btn-bg) !important; } .wc-block-mini-cart__footer-actions .wc-block-mini-cart__footer-checkout:hover { background: var(--rh-w-btn-hover-bg) !important; border-color: var(--rh-w-btn-hover-bg) !important; color: var(--rh-w-btn-hover-fg, var(--rh-w-btn-fg)) !important; } .wc-block-mini-cart__empty-cart-wrapper { padding: 40px 24px !important; text-align: center; } .wc-block-mini-cart__empty-cart-wrapper .wp-block-button__link { border-radius: var(--rh-w-radius, 0) !important; } /* ---------- My account (classic) ---------- */ .woocommerce-account .woocommerce { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: var(--rh-w-gap, 48px); align-items: start; } .woocommerce-account .woocommerce > :only-child, .woocommerce-account .woocommerce > .woocommerce-notices-wrapper:first-child + * { grid-column: 1 / -1; } .woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rh-w-fg); } .woocommerce-account .woocommerce-MyAccount-navigation li a { display: block; padding: 13px 0; border-bottom: 1px solid var(--rh-w-line); color: var(--rh-w-fg); text-decoration: none; font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; } .woocommerce-account .woocommerce-MyAccount-navigation li.is-active a, .woocommerce-account .woocommerce-MyAccount-navigation li a:hover { color: var(--rh-w-accent); } .woocommerce-account .woocommerce form .form-row { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; } .woocommerce-account .woocommerce form .form-row input.input-text { min-height: 50px; padding: 12px 14px; } .woocommerce-account .u-columns { display: grid; grid-template-columns: 1fr 1fr; gap: var(--rh-w-gap, 48px); } .woocommerce-account .u-columns > div { width: auto !important; float: none !important; padding: clamp(20px, 3vw, 34px); border: 1px solid var(--rh-w-line); } .woocommerce-account .woocommerce h2 { font-family: var(--rh-w-head-font); font-size: 1.6rem; } @media (max-width: 781px) { .woocommerce-account .woocommerce, .woocommerce-account .u-columns { grid-template-columns: 1fr; } } /* Grid columns (explicit, so wide gaps never drop a column) and full-width gallery */ @media (min-width: 782px) { .rh-woo .wc-block-product-template.columns-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } .rh-woo .wc-block-product-template.columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } .rh-woo .wc-block-product-template.columns-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; } .rh-woo .wc-block-product-template.columns-5 { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; } } @media (min-width: 782px) and (max-width: 1100px) { .rh-woo .wc-block-product-template:is(.columns-4, .columns-5) { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } } .rh-woo .wp-block-woocommerce-product-image-gallery { max-width: none !important; width: 100% !important; } .rh-woo .woocommerce-product-gallery .flex-control-thumbs li img { width: 100%; } /* Homepage featured-products section */ .rh-shop-feature { padding-top: clamp(56px, 8vw, 110px) !important; padding-bottom: clamp(56px, 8vw, 110px) !important; } .rh-shop-feature-head { margin-bottom: clamp(24px, 3.4vw, 44px) !important; text-align: center; } .rh-shop-feature-head > * { margin-block: 0 !important; } .rh-shop-feature-head .wp-block-heading { margin-top: .4rem !important; } .rh-shop-feature-cta { margin-top: clamp(28px, 4vw, 48px) !important; } .rh-related:not(:has(.wc-block-product)) { display: none; } /* Card buttons line up even when titles wrap */ .rh-woo .wc-block-product .wp-block-woocommerce-product-button { margin-top: auto !important; padding-top: 14px; } @media (max-width: 480px) { .rh-checkout-secure { font-size: 0 !important; gap: 0; } .rh-checkout-header { padding-inline: 16px !important; } .rh-woo .wc-block-product .wc-block-components-product-button__button { letter-spacing: .06em !important; font-size: .68rem !important; padding-inline: 10px !important; } } /* Small phones: the menu drawer already links to the account, so the header keeps just bag + menu */ @media (max-width: 480px) { .rh-header-tools .wp-block-woocommerce-customer-account { display: none !important; } .rh-header-tools { gap: .3rem !important; } .rh-header-tools .rh-mini-cart .wc-block-mini-cart__button { width: 40px; } } /* Header bag: larger icon and count */ .rh-mini-cart .wc-block-mini-cart__button { width: 54px !important; height: 54px !important; } .rh-mini-cart .wc-block-mini-cart__icon, .rh-mini-cart .wc-block-mini-cart__button .wc-block-mini-cart__icon { width: 38px !important; height: 38px !important; } .rh-mini-cart .wc-block-mini-cart__badge { top: 3px !important; right: -1px !important; min-width: 21px !important; height: 21px !important; padding: 0 5px !important; font-size: .72rem !important; line-height: 21px !important; } @media (max-width: 480px) { .rh-header-tools .rh-mini-cart .wc-block-mini-cart__button, .rh-mini-cart .wc-block-mini-cart__button { width: 48px !important; height: 48px !important; } .rh-mini-cart .wc-block-mini-cart__icon, .rh-mini-cart .wc-block-mini-cart__button .wc-block-mini-cart__icon { width: 34px !important; height: 34px !important; } } /* RH-ELEMENTOR-CSS START */ /* Elementor pages: full width, no theme gaps around the Elementor content */ .rh-elementor-main, .rh-elementor-main > .wp-block-post-content { margin: 0 !important; padding: 0 !important; max-width: none !important; } .rh-elementor-main > .wp-block-post-content > .elementor { margin: 0; } .wp-site-blocks > .rh-elementor-main { margin-block-start: 0 !important; } .elementor-page .wp-site-blocks > * + * { margin-block-start: 0; } /* Elementor widgets wear the theme's look by default. Low specificity (:where) so anything you set in Elementor's own Style tab still wins. Colours and fonts come from the theme's --rh-w-* properties. */ :where(.elementor) .elementor-button { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 15px 30px; background: var(--rh-w-btn-bg); color: var(--rh-w-btn-fg); border: 1px solid var(--rh-w-btn-bg); border-radius: var(--rh-w-radius, 0); font-family: var(--rh-w-body-font); font-size: .8rem; font-weight: 600; letter-spacing: var(--rh-w-btn-ls, .14em); text-transform: var(--rh-w-btn-transform, uppercase); line-height: 1.2; transition: background .25s, color .25s, border-color .25s; } :where(.elementor) .elementor-button:hover, :where(.elementor) .elementor-button:focus { background: var(--rh-w-btn-hover-bg); border-color: var(--rh-w-btn-hover-bg); color: var(--rh-w-btn-hover-fg, var(--rh-w-btn-fg)); } :where(.elementor) :is(h1, h2, h3, h4, h5, h6).elementor-heading-title { margin: 0; } :where(.elementor) .elementor-widget-text-editor > :last-child, :where(.elementor) .elementor-widget-text-editor p:last-child { margin-bottom: 0; } :where(.elementor) a { color: inherit; } :where(.elementor) .elementor-widget-divider { --divider-color: var(--rh-w-line); } :where(.elementor) .elementor-icon-list-icon i, :where(.elementor) .elementor-icon-list-icon svg { color: var(--rh-w-accent); fill: var(--rh-w-accent); } :where(.elementor) .elementor-star-rating { color: var(--rh-w-star, var(--rh-w-accent)); } :where(.elementor) .elementor-accordion .elementor-tab-title, :where(.elementor) .e-n-accordion-item-title { border-color: var(--rh-w-line); color: var(--rh-w-fg); font-family: var(--rh-w-head-font); } :where(.elementor) .elementor-tab-title.elementor-active, :where(.elementor) .e-n-tab-title[aria-selected=true] { color: var(--rh-w-accent); } :where(.elementor) .elementor-testimonial-content { font-family: var(--rh-w-head-font); font-size: 1.3rem; line-height: 1.5; } :where(.elementor) .elementor-counter-number-wrapper { font-family: var(--rh-w-display-font, var(--rh-w-head-font)); color: var(--rh-w-fg); } :where(.elementor) .elementor-field-group :is(input, textarea, select), :where(.elementor) .elementor-field-textual { border: 1px solid var(--rh-w-field-line, var(--rh-w-fg)); border-radius: var(--rh-w-field-radius, 0); background: var(--rh-w-field-bg, var(--rh-w-bg)); color: var(--rh-w-fg); font-family: var(--rh-w-body-font); } :where(.elementor) .elementor-image img { border-radius: inherit; } /* WooCommerce product grids placed with Elementor's Shortcode widget ([products …]) */ :where(.elementor) .woocommerce ul.products { display: grid; grid-template-columns: repeat(var(--rh-el-cols, 4), minmax(0, 1fr)); gap: clamp(24px, 3vw, 40px) clamp(14px, 2vw, 26px); margin: 0; padding: 0; } :where(.elementor) .woocommerce ul.products::before, :where(.elementor) .woocommerce ul.products::after { display: none; } :where(.elementor) .woocommerce ul.products li.product { width: auto !important; margin: 0 !important; float: none !important; display: flex; flex-direction: column; text-align: center; } :where(.elementor) .woocommerce ul.products li.product img { width: 100%; aspect-ratio: var(--rh-w-img-ratio, 4/5); object-fit: cover; border-radius: var(--rh-w-img-radius, 0); margin: 0 0 14px !important; } :where(.elementor) .woocommerce ul.products li.product .woocommerce-loop-product__title { font-family: var(--rh-w-card-font, var(--rh-w-head-font)); font-size: var(--rh-w-card-size, 1.2rem) !important; font-weight: var(--rh-w-card-weight, 500); text-transform: var(--rh-w-card-transform, none); color: var(--rh-w-fg); padding: 0 !important; margin: 0 0 4px !important; } :where(.elementor) .woocommerce ul.products li.product .price { color: var(--rh-w-fg) !important; font-size: .95rem !important; margin-bottom: 0 !important; } :where(.elementor) .woocommerce ul.products li.product .price ins { color: var(--rh-w-accent); text-decoration: none; } :where(.elementor) .woocommerce ul.products li.product .button { margin-top: auto !important; display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 10px 16px !important; border: 1px solid var(--rh-w-btn-bg) !important; border-radius: var(--rh-w-radius, 0) !important; background: var(--rh-w-btn-bg) !important; color: var(--rh-w-btn-fg) !important; font: 600 .72rem var(--rh-w-body-font) !important; letter-spacing: var(--rh-w-btn-ls, .14em); text-transform: var(--rh-w-btn-transform, uppercase); } :where(.elementor) .woocommerce ul.products li.product .button:hover { background: var(--rh-w-btn-hover-bg) !important; border-color: var(--rh-w-btn-hover-bg) !important; color: var(--rh-w-btn-hover-fg, var(--rh-w-btn-fg)) !important; } :where(.elementor) .woocommerce span.onsale { top: 12px; left: 12px; right: auto; min-width: 0; min-height: 0; padding: 6px 10px; line-height: 1.2; border-radius: var(--rh-w-badge-radius, 0); background: var(--rh-w-sale-bg, var(--rh-w-accent)); color: #fff; font: 600 .66rem var(--rh-w-body-font); letter-spacing: .18em; text-transform: uppercase; } @media (max-width: 767px) { :where(.elementor) .woocommerce ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); } } /* ---- Theme page designs rebuilt in Elementor: same widths, padding and spacing as the block pages ---- */ .elementor .e-con { --padding-top: 0; --padding-right: 0; --padding-bottom: 0; --padding-left: 0; --container-default-padding-top: 0; --container-default-padding-right: 0; --container-default-padding-bottom: 0; --container-default-padding-left: 0; } .elementor .rh-el-c > :not(.alignfull):not(.alignwide):not(.alignleft):not(.alignright) { width: 100%; max-width: var(--wp--style--global--content-size); margin-left: auto !important; margin-right: auto !important; } .elementor .rh-el-c > .alignwide { width: 100%; max-width: var(--wp--style--global--wide-size); margin-left: auto !important; margin-right: auto !important; } .elementor .rh-el-c > .alignfull { width: 100%; max-width: none; } .elementor .rh-el-gp { padding-left: var(--wp--style--root--padding-left) !important; padding-right: var(--wp--style--root--padding-right) !important; } .elementor .rh-el-gp > .alignfull { width: auto; margin-left: calc(var(--wp--style--root--padding-left) * -1) !important; margin-right: calc(var(--wp--style--root--padding-right) * -1) !important; } .elementor .e-con.alignfull { max-width: none; } .elementor .elementor-widget-text-editor > :first-child { margin-top: 0; } .elementor .elementor-widget-text-editor > :last-child { margin-bottom: 0; } .elementor .elementor-widget-text-editor > p:only-child, .elementor .elementor-widget-text-editor > :is(ul, ol, blockquote):only-child { margin: 0; } .elementor .elementor-widget-heading:is([class*="-font-size"]) .elementor-heading-title { font-size: inherit; } .elementor .elementor-widget-heading:is([class*="-color"]) .elementor-heading-title { color: inherit; } :where(.elementor .elementor-widget-image) img { width: 100%; height: auto; } .elementor .elementor-widget-image.wp-block-image { margin: 0; } .elementor .elementor-widget-button.wp-block-button { width: auto; flex: 0 0 auto; } .elementor .rh-el-dynamic { width: 100%; } .elementor .rh-el-dynamic .elementor-shortcode > :first-child { margin-top: 0; } /* FAQ: Elementor Toggle widgets start neutral; the theme's own FAQ styles are mapped onto them below */ .rh-el-details .elementor-toggle-item { border: 0; } .rh-el-details .elementor-tab-title { padding: 0; border: 0; font-weight: inherit; line-height: inherit; color: inherit; cursor: pointer; } .rh-el-details .elementor-tab-title .elementor-toggle-title { color: inherit; } .rh-el-details .elementor-toggle-icon { display: none !important; } .rh-el-details .elementor-tab-content { padding: 0; border: 0; color: inherit; } .elementor .rh-el-cover { position: relative; overflow: hidden; } /* Inside the Elementor editor the theme's scroll reveals, slider and marquee are shown static, so every slide and section can be selected and edited (the live page keeps all animations). */ .elementor-editor-active [class*="-reveal"] { opacity: 1 !important; transform: none !important; } .elementor-editor-active .e-con[class*="-slider"]:not([class*="-slider-"]) { display: flex !important; flex-direction: column !important; gap: 4px; } .elementor-editor-active [class*="-slider"] > [class*="-slide"] { opacity: 1 !important; visibility: visible !important; grid-area: auto !important; } .elementor-editor-active [class*="-slide"] [class*="-slide-content"] > * { opacity: 1 !important; transform: none !important; } .elementor-editor-active [class*="-slide-img"] img { transform: none !important; } .elementor-editor-active [class*="-marquee-track"] { animation: none !important; transform: none !important; flex-wrap: wrap !important; justify-content: center; width: auto !important; } .elementor-editor-active [class*="-marquee"] [aria-hidden="true"] { display: none !important; } .elementor .rh-el-nowrap > .elementor-widget { min-width: auto !important; flex-shrink: 0; } .e-con[class*="slider-quotes"].is-ready > .elementor-widget-text-editor { grid-area: 1 / 1; } /* Theme styles re-targeted to Elementor headings and buttons (generated) */ .e-con.is-style-kicker, .e-con.hl-kicker {margin-bottom: 1rem !important} .e-con.is-style-kicker::before {display: inline-block;width: 26px;height: 1px;margin: 0 .9em .28em 0} .has-text-align-center.is-style-kicker .elementor-heading-title::after {content: ""; display: inline-block; width: 26px; height: 1px; margin: 0 0 .28em .9em; background: currentColor; vertical-align: middle;} .e-con.hl-sans {display: block} .hl-display .elementor-heading-title {font-size: clamp(3rem, 9vw, 8.6rem) !important; line-height: .92 !important; letter-spacing: -.03em; margin: 0;} .e-con.hl-display {margin: 0} .e-con.hl-lead {max-width: 34rem} .e-con.hl-title {margin-bottom: clamp(2rem, 4vw, 3.4rem) !important} .hl-title .e-con.hl-lead {margin: 1.1rem auto 0} .e-con.hl-split-title {display: flex;flex-wrap: wrap;align-items: flex-end;justify-content: space-between;gap: 1.2rem 3rem} .e-con.hl-split-title {--flex-direction: row; flex-direction: row;} .hl-split-title .e-con.hl-lead {max-width: 26rem} .elementor-button {transition: background .35s var(--hl-ease), color .35s var(--hl-ease), border-color .35s var(--hl-ease), transform .35s var(--hl-ease);} .elementor-button:hover {transform: translateY(-2px);} .elementor-widget-button.wp-block-button.is-style-outline .elementor-button {background: transparent; color: var(--hl-black); border: 1px solid var(--hl-black); padding: calc(1.1rem - 1px) calc(2.2rem - 1px);} .elementor-widget-button.wp-block-button.is-style-outline .elementor-button:hover {background: var(--hl-black); color: #fff;} .elementor-widget-button.wp-block-button.is-style-beige .elementor-button {background: var(--hl-grey); color: #fff;} .elementor-widget-button.wp-block-button.is-style-beige .elementor-button:hover {background: var(--hl-black);} .elementor-widget-button.wp-block-button.is-style-light .elementor-button {background: #fff; color: var(--hl-black);} .elementor-widget-button.wp-block-button.is-style-light .elementor-button:hover {background: var(--hl-grey); color: #fff;} .elementor-widget-button.wp-block-button.is-style-ghost-light .elementor-button {background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, .6); padding: calc(1.1rem - 1px) calc(2.2rem - 1px);} .elementor-widget-button.wp-block-button.is-style-ghost-light .elementor-button:hover {background: #fff; color: var(--hl-black);} .elementor-widget-button.wp-block-button.is-style-link .elementor-button {background: none; color: var(--hl-black); padding: .4rem 0; border-bottom: 1px solid var(--hl-grey);} .elementor-widget-button.wp-block-button.is-style-link .elementor-button::after {content: " →"; color: var(--hl-grey);} .e-con.hl-header {position: sticky;top: 0} .admin-bar .e-con.hl-header {top: 32px} .e-con.hl-header-row {display: grid !important;grid-template-columns: 1fr auto 1fr;align-items: center;gap: 1rem} .hl-header-row > .e-con.hl-nav {justify-self: start} .hl-header-row > .e-con.hl-brand {justify-self: center} .hl-header-row > .e-con.hl-header-tools {justify-self: end} .e-con.hl-logo {margin: 0 !important} .e-con.hl-logo-sub {margin: .3rem 0 0 !important} .hl-nav .e-con.wp-block-navigation__container {flex-wrap: nowrap !important} .hl-nav .e-con.wp-block-navigation-item__content {position: relative} .hl-nav .e-con.wp-block-navigation-item__content::after {position: absolute;left: 0;right: 0;bottom: -6px;height: 1px} .e-con.hl-header-tools {gap: 1rem !important} .hl-btn-sm .elementor-button {padding: .85rem 1.3rem !important; font-size: .66rem !important; background: var(--hl-grey);} .hl-btn-sm .elementor-button:hover {background: var(--hl-black);} .e-con.hl-marquee {overflow: hidden} .e-con.hl-marquee-track {display: flex !important;flex-wrap: nowrap !important;gap: 0 !important;width: max-content} .e-con.hl-marquee-track {--flex-direction: row; flex-direction: row;} .hl-marquee .elementor-widget-text-editor:nth-child(even) > p {font-family: var(--hl-sans); font-style: normal; font-size: clamp(.95rem, 1.4vw, 1.2rem); font-weight: 700; letter-spacing: .26em; text-transform: uppercase; align-self: center;} .e-con.hl-textures {display: grid !important;grid-template-columns: repeat(5, 1fr);gap: clamp(.8rem, 1.4vw, 1.4rem) !important} .e-con.hl-texture {position: relative;margin: 0 !important;overflow: hidden} .e-con.hl-texture-num {position: absolute;top: 1rem;left: 1rem} .e-con.hl-texture-name {margin-top: 1rem !important} .e-con.hl-texture-meta {margin-top: .3rem !important} @media (max-width: 1024px) { .e-con.hl-textures {display: flex !important;overflow-x: auto;margin-right: calc(-1 * var(--wp--preset--spacing--40));padding-right: var(--wp--preset--spacing--40)} .e-con.hl-textures {--flex-direction: row; flex-direction: row;} .e-con.hl-textures::-webkit-scrollbar {display: none} .e-con.hl-texture {flex: 0 0 min(64vw, 300px)} } .e-con.hl-compare {position: relative;margin: 0 !important;overflow: hidden} .hl-compare.is-ready > .e-con.hl-after {position: absolute !important;inset: 0} .e-con.hl-compare-line {position: absolute;top: 0;bottom: 0;left: var(--pos);width: 2px;margin-left: -1px} .e-con.hl-compare-handle {position: absolute;top: 50%;left: var(--pos);width: 64px;height: 64px;margin: -32px 0 0 -32px;display: grid} .e-con.hl-compare-label {position: absolute;top: 1.2rem;padding: .45rem .8rem} .e-con.hl-compare-label.is-before {left: 1.2rem} .e-con.hl-compare-label.is-after {right: 1.2rem} .e-con.hl-compare-hint {position: absolute;left: 50%;bottom: 1.2rem} .e-con.hl-ba {gap: clamp(2rem, 5vw, 5rem) !important} .e-con.hl-ba-steps {padding: 0;margin: 2rem 0 !important} .e-con.hl-caption {margin-top: 1rem !important;display: flex;justify-content: space-between;gap: 1rem} .e-con.hl-caption {--flex-direction: row; flex-direction: row;} .e-con.hl-trans-grid {display: grid !important;grid-template-columns: repeat(3, 1fr);gap: clamp(1rem, 2.4vw, 2.2rem) !important} @media (max-width: 900px) { .e-con.hl-trans-grid {grid-template-columns: 1fr;max-width: 560px;margin-inline: auto !important} } .hl-custom .e-con.wp-block-columns {gap: clamp(2rem, 6vw, 6rem) !important} .e-con.hl-frame {position: relative;margin: 0 !important} .e-con.hl-frame::before {position: absolute;inset: 1.4rem -1.4rem -1.4rem 1.4rem} .e-con.hl-steps {display: grid !important;grid-template-columns: repeat(2, 1fr);gap: 0 !important;margin: 2.2rem 0 !important} .e-con.hl-step {padding: 1.4rem 1.4rem 1.2rem} .hl-step .elementor-widget-text-editor:last-child > p {font-size: .92rem; line-height: 1.6; opacity: .86;} .e-con.hl-steps-4 {grid-template-columns: repeat(4, 1fr)} @media (max-width: 900px) { .e-con.hl-steps-4 {grid-template-columns: repeat(2, 1fr)} } @media (max-width: 520px) { .e-con.hl-steps, .e-con.hl-steps-4 {grid-template-columns: 1fr} } .e-con.hl-features {display: grid !important;grid-template-columns: repeat(3, 1fr);gap: 0 !important} .e-con.hl-feature {padding: clamp(1.6rem, 3vw, 2.6rem) clamp(1rem, 2.4vw, 2.2rem);margin: 0 !important} .e-con.hl-icon {display: block;width: 44px;height: 44px} @media (max-width: 781px) { .e-con.hl-features {grid-template-columns: 1fr} } @media (min-width: 782px) and (max-width: 1024px) { .e-con.hl-features {grid-template-columns: repeat(2, 1fr)} } .e-con.hl-stars {margin-bottom: 1.4rem !important} .hl-js .e-con.hl-quotes.is-ready {display: grid} .e-con.hl-quote-nav {display: flex;justify-content: center;gap: .6rem;margin-top: 2.4rem} .e-con.hl-quote-nav {--flex-direction: row; flex-direction: row;} .e-con.hl-gram {display: grid !important;grid-template-columns: repeat(6, 1fr);gap: 4px !important} @media (max-width: 781px) { .e-con.hl-gram {grid-template-columns: repeat(3, 1fr)} } .hl-journal .e-con.wp-block-post-featured-image {overflow: hidden;margin-bottom: 1.2rem} .hl-journal .e-con.wp-block-post-title {margin: .5rem 0 !important} .e-con.hl-nl-form {display: flex;max-width: 560px;margin: 2rem auto 0} .e-con.hl-nl-form {--flex-direction: row; flex-direction: row;} .e-con.hl-nl-done {display: none;margin-top: 1.2rem} .e-con.hl-nl-form.is-done {display: none} .hl-nl-form.is-done + .e-con.hl-nl-done {display: block} .hl-page-head .e-con.hl-lead {margin: 0} .e-con.hl-tri {display: grid !important;grid-template-columns: 1fr 1.25fr 1fr;gap: clamp(.6rem, 1.4vw, 1.2rem) !important;align-items: end} @media (max-width: 600px) { .e-con.hl-tri {grid-template-columns: 1fr 1fr} } .e-con.hl-story-cols {column-gap: clamp(2rem, 5vw, 4.5rem)} .e-con.hl-story-cols {display: block;} .e-con.hl-story-cols > .elementor-widget + .elementor-widget {margin-top: var(--row-gap, 1.4rem);} .e-con.hl-story-cols > .elementor-widget {break-inside: avoid;} .e-con.hl-dropcap::first-letter {padding: .08em .12em 0 0} .e-con.hl-pullquote {margin: clamp(2.5rem, 6vw, 5rem) auto !important;max-width: 900px;padding: 0 !important} .e-con.hl-stats {display: grid !important;grid-template-columns: repeat(4, 1fr);gap: 0 !important} @media (max-width: 781px) { .e-con.hl-stats {grid-template-columns: repeat(2, 1fr)} } .e-con.hl-contact-card {padding-top: 1.2rem} .elementor .hl-faq .rh-el-details .elementor-toggle-item {border-bottom: 1px solid var(--hl-line); padding: 1.3rem 0;} .hl-faq .e-con.wp-block-details {padding: 1.3rem 0} .elementor .hl-faq .rh-el-details .elementor-toggle-item:first-child {border-top: 1px solid var(--hl-line);} .elementor .hl-faq .elementor-tab-title {font-family: var(--hl-serif); font-size: clamp(1.3rem, 2vw, 1.65rem); cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 1rem;} .elementor .hl-faq .elementor-tab-title::-webkit-details-marker {display: none;} .elementor .hl-faq .elementor-tab-title::after {content: "+"; font-family: var(--hl-sans); font-weight: 300; font-size: 1.6rem; line-height: 1; color: var(--hl-grey); transition: transform .3s;} .elementor .hl-faq .elementor-toggle-item:has(> .elementor-tab-title.elementor-active) .elementor-tab-title::after {transform: rotate(45deg);} .elementor .hl-faq .elementor-toggle-item .elementor-tab-content p {margin: .9rem 0 0; max-width: 44rem;} .e-con.hl-request {display: grid;grid-template-columns: minmax(0, 1fr) 360px;gap: clamp(2rem, 5vw, 4.5rem);align-items: start} .e-con.hl-field {margin-bottom: 1.4rem;position: relative} .e-con.hl-field-label {display: block;margin-bottom: .7rem} .e-con.hl-two {display: grid;grid-template-columns: 1fr 1fr;gap: 0 1.2rem} .e-con.hl-three {display: grid;grid-template-columns: repeat(3, 1fr);gap: 0 1rem} @media (max-width: 600px) { .e-con.hl-two, .e-con.hl-three {grid-template-columns: 1fr} } .e-con.hl-chips {display: flex;flex-wrap: wrap;gap: .5rem} .e-con.hl-chips {--flex-direction: row; flex-direction: row;} .e-con.hl-cards {display: grid;grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));gap: .6rem} .e-con.hl-check {display: flex;gap: .7rem;align-items: flex-start;margin-bottom: .6rem} .e-con.hl-check {--flex-direction: row; flex-direction: row;} .e-con.hl-range {display: flex;align-items: center;gap: 1rem} .e-con.hl-range {--flex-direction: row; flex-direction: row;} .e-con.hl-upload {display: block;padding: 1.6rem} .e-con.hl-upload-list {display: flex;flex-wrap: wrap;gap: .5rem;margin-top: .8rem} .e-con.hl-upload-list {--flex-direction: row; flex-direction: row;} .hl-field .e-con.error {display: none;margin-top: .4rem} .hl-field.invalid .e-con.error {display: block} .e-con.hl-submit {display: inline-flex;align-items: center;gap: .8rem;padding: 1.25rem 2.6rem} .e-con.hl-submit {--flex-direction: row; flex-direction: row;} .e-con.hl-form-foot {display: flex;flex-wrap: wrap;align-items: center;gap: 1rem 2rem} .e-con.hl-form-foot {--flex-direction: row; flex-direction: row;} .e-con.hl-summary {position: sticky;top: 120px;padding: clamp(1.6rem, 3vw, 2.4rem)} .e-con.hl-summary-est {display: flex;justify-content: space-between;align-items: baseline;margin-top: 1.4rem} .e-con.hl-summary-est {--flex-direction: row; flex-direction: row;} .e-con.hl-summary-note {margin-top: .9rem !important} @media (max-width: 1000px) { .e-con.hl-request {grid-template-columns: 1fr} .e-con.hl-summary {position: static;order: -1} } .e-con.hl-modal {position: fixed;inset: 0;display: grid;padding: 20px} .e-con.hl-modal[hidden] {display: none} .e-con.hl-modal-card {position: relative;max-width: 480px;padding: clamp(2rem, 5vw, 3.2rem)} .e-con.hl-footer-big {margin: 0 0 clamp(2rem, 5vw, 4rem) !important} .e-con.hl-footer-bottom {padding-top: 1.4rem;margin-top: clamp(2rem, 5vw, 4rem) !important} .e-con.hl-pay {display: flex;gap: .5rem;flex-wrap: wrap} .e-con.hl-pay {--flex-direction: row; flex-direction: row;} .hl-shop .e-con.wc-block-components-product-image, .hl-shop .wc-block-product .e-con.wp-block-woocommerce-product-image {position: relative;overflow: hidden} .e-con.hl-card-marquee {position: absolute;left: 0;right: 0;bottom: 12px;overflow: hidden;padding: 7px 0} .e-con.hl-card-marquee__track {display: flex;width: max-content} .e-con.hl-card-marquee__track {--flex-direction: row; flex-direction: row;} @media (max-width: 781px) { .e-con.hl-split-title {display: block} .hl-split-title .e-con.hl-lead {margin-top: 1rem !important} } .e-con.hl-campaign {padding: clamp(1.5rem, 5vw, 4.5rem) var(--wp--preset--spacing--40) !important} .e-con.hl-campaign::after {position: absolute;inset: 0} .hl-campaign .e-con.wp-block-cover__inner-container {position: relative} .e-con.hl-campaign-card {max-width: 40rem} .e-con.hl-story-img {margin: clamp(2rem, 5vw, 4rem) 0 0 !important} @media (max-width: 781px) { .hl-display .elementor-heading-title {font-size: clamp(3.1rem, 14vw, 4.2rem) !important;} .e-con.hl-logo-sub {display: none} .e-con.hl-video-meta {justify-content: flex-end} } @media (max-width: 1200px) and (min-width: 1025px) { .hl-nav .e-con.wp-block-navigation__container {gap: 1.3rem !important} } section:has(> .e-con.hl-textures) {overflow-x: clip} @media (max-width: 781px) { .e-con.hl-frame::before {inset: .8rem -.6rem -.8rem .8rem} } .hl-header-row > .e-con.wp-block-woocommerce-customer-account {display: none !important} .e-con.hl-account {display: inline-grid;width: 44px;height: 44px} .e-con.hl-hero-media.e-con {position: relative} .e-con.hl-slider {position: relative;overflow: hidden} .hl-slider > .e-con.hl-slide {margin: 0 !important;padding: clamp(5rem, 10vh, 8rem) var(--wp--preset--spacing--40) clamp(5rem, 12vh, 8rem) !important;min-height: calc(100vh - 110px) !important} .e-con.hl-slide::after {position: absolute;inset: 0} .hl-slide .e-con.wp-block-cover__inner-container {position: relative} .e-con.hl-slide-card {max-width: 44rem} .hl-slide-card .hl-display .elementor-heading-title {color: #fff; margin: 0 0 1.4rem !important;} .hl-slide-card .e-con.hl-display {margin: 0 0 1.4rem !important} .hl-slide-card .e-con.hl-lead {margin-bottom: 1.8rem} .hl-js .e-con.hl-slider.is-ready {display: grid} .hl-js .hl-slider.is-ready > .e-con.hl-slide {grid-area: 1 / 1} .e-con.hl-slider-ui {position: absolute;right: clamp(1.25rem, 4vw, 3.5rem);bottom: clamp(2rem, 6vh, 4rem);display: flex;align-items: center;gap: .9rem} .e-con.hl-slider-ui {--flex-direction: row; flex-direction: row;} .e-con.hl-slider-prev, .e-con.hl-slider-next {width: 52px;height: 52px} .e-con.hl-slider-count {min-width: 4.2em} .e-con.hl-slider-dots {display: flex;gap: .45rem;margin-right: .4rem} .e-con.hl-slider-dots {--flex-direction: row; flex-direction: row;} .e-con.hl-slider-progress {position: absolute;left: 0;bottom: 0;width: 100%;height: 3px} @media (max-width: 781px) { .hl-slider > .e-con.hl-slide {min-height: 88vh !important;padding-bottom: 7rem !important} .e-con.hl-slider-ui {left: var(--wp--preset--spacing--40);right: auto;bottom: 1.5rem} .e-con.hl-slider-count {display: none} } .e-con.hl-contact-form {padding: clamp(1.5rem, 3vw, 2.6rem)} @media (max-width: 600px) { .hl-page-head .hl-display .elementor-heading-title {font-size: 2.7rem !important;} } .e-con.hl-contact-form {position: relative} .hl-display .elementor-heading-title {font-family: var(--hl-sans); font-weight: 600; letter-spacing: -.045em;} .hl-display .elementor-heading-title {font-size: clamp(3.2rem, 10vw, 9.6rem) !important; line-height: .9 !important; letter-spacing: -.055em !important;} .e-con.is-style-kicker::before {width: 8px !important;height: 8px !important;margin: 0 .8em .12em 0 !important} .has-text-align-center.is-style-kicker .elementor-heading-title::after {width: 8px !important; height: 8px !important; border-radius: 50%; background: var(--hl-grey) !important; margin: 0 0 .12em .8em !important;} .elementor-button {border-radius: 999px !important;} .elementor-button {padding: 1.05rem 2.1rem !important;} .elementor-button:hover {background: var(--hl-grey); color: var(--hl-black);} .elementor-widget-button.wp-block-button.is-style-outline .elementor-button {padding: calc(1.05rem - 1px) calc(2.1rem - 1px) !important;} .elementor-widget-button.wp-block-button.is-style-beige .elementor-button {background: var(--hl-grey); color: var(--hl-black);} .elementor-widget-button.wp-block-button.is-style-beige .elementor-button:hover {background: var(--hl-black); color: #fff;} .elementor-widget-button.wp-block-button.is-style-light .elementor-button:hover {background: var(--hl-grey); color: var(--hl-black);} .elementor-widget-button.wp-block-button.is-style-link .elementor-button {border-radius: 0 !important; padding: .4rem 0 !important; border-bottom-color: var(--hl-black);} .elementor-widget-button.wp-block-button.is-style-link .elementor-button::after {color: var(--hl-grey);} .elementor-widget-button.wp-block-button.is-style-link .elementor-button:hover {background: none; color: var(--hl-grey);} .e-con.hl-header-row {grid-template-columns: auto 1fr auto !important} .hl-header-row > .e-con.hl-brand {justify-self: start} .hl-header-row > .e-con.hl-nav {justify-self: center} .hl-nav .e-con.wp-block-navigation-item__content::after {height: 2px} .hl-btn-sm .elementor-button {background: var(--hl-black) !important; color: #fff !important; padding: .8rem 1.3rem !important;} .hl-btn-sm .elementor-button:hover {background: var(--hl-grey) !important; color: var(--hl-black) !important;} .e-con.hl-slide::after {display: none} .hl-slide-card .hl-display .elementor-heading-title {color: var(--hl-black) !important;} .e-con.hl-slide-card {max-width: 46rem} .hl-marquee .elementor-widget-text-editor:nth-child(even) > p {font-family: var(--hl-cond); font-style: normal; font-weight: 500; font-stretch: 62.5%; font-variation-settings: 'wdth' 62.5; font-size: clamp(2.5rem, 5.2vw, 4.8rem); line-height: 1; letter-spacing: -.01em; text-transform: none;} .e-con.hl-texture-num {padding: .35rem .7rem} .hl-texture .e-con.hl-card-marquee {bottom: 16px} .e-con.hl-band {position: absolute;left: 0;right: 0;overflow: hidden} .hl-campaign .e-con.hl-card-marquee {top: clamp(1.2rem, 4vw, 3rem);bottom: auto;padding: 12px 0} .hl-philo .e-con.wp-block-columns {gap: clamp(2rem, 6vw, 6rem) !important} .e-con.hl-ingredients {display: grid !important;grid-template-columns: 1fr 1fr;gap: 0 !important;margin: 2rem 0 !important} .e-con.hl-ingredient {padding: 1.3rem 1.2rem 1.2rem 0;margin: 0 !important} .e-con.hl-ingredient:nth-child(even) {padding-left: 1.4rem} @media (max-width: 600px) { .e-con.hl-ingredients {grid-template-columns: 1fr} .e-con.hl-ingredient:nth-child(even) {padding-left: 0} } .e-con.hl-icon {width: 58px;height: 58px;padding: 13px} .e-con.hl-gram {gap: 10px !important} .hl-journal .e-con.wp-block-post-date::before {display: inline-block;width: 8px;height: 8px;margin-right: .6em} .e-con.hl-nl-form {padding: .35rem .35rem .35rem 1.4rem} .elementor .hl-faq .elementor-tab-title {font-family: var(--hl-sans); font-weight: 600; letter-spacing: -.03em;} .elementor .hl-faq .elementor-tab-title::after {color: var(--hl-black); width: 2.2rem; height: 2.2rem; border-radius: 50%; background: var(--hl-grey); display: grid; place-items: center; font-size: 1.3rem; flex: 0 0 auto;} .e-con.hl-faq-group {margin-top: clamp(2.5rem, 5vw, 4rem) !important} .e-con.hl-faq-group:first-child {margin-top: 0 !important} .e-con.hl-campaign::after {display: none} .e-con.hl-campaign-card {max-width: 34rem} .elementor-button {white-space: nowrap;} @media (max-width: 781px) { .hl-slider > .e-con.hl-slide {min-height: 0 !important;padding-top: calc(46vh + 1.6rem) !important;padding-bottom: 6.2rem !important;align-items: flex-start} .hl-slide > .e-con.wp-block-cover__image-background {height: 46vh !important;bottom: auto !important} .e-con.hl-slide::after {display: none !important} .hl-slide-card .hl-display .elementor-heading-title {font-size: clamp(2.9rem, 13vw, 3.8rem) !important;} .e-con.hl-campaign {min-height: 0 !important;padding-top: calc(42vh + 1.6rem) !important} .hl-campaign > .e-con.wp-block-cover__image-background {height: 42vh !important;bottom: auto !important} .hl-campaign .e-con.hl-card-marquee {top: calc(42vh - 3.2rem);bottom: auto} } .hl-slide-card .hl-display .elementor-heading-title {font-size: clamp(3.2rem, 8.2vw, 8.4rem) !important;} .hl-campaign > .e-con.hl-card-marquee {position: absolute !important} @media (min-width: 782px) { .e-con.hl-campaign {padding-top: clamp(6rem, 9vw, 8rem) !important} } .elementor-widget-button.wp-block-button.is-style-link .elementor-button:hover {color: var(--hl-ink2);} .hl-founder .e-con.wp-block-columns {gap: clamp(2rem, 6vw, 6rem) !important} .e-con.hl-founder-img {margin: 0 !important} .e-con.hl-signature {margin-top: 1.2rem !important} .e-con.hl-founder-strip {display: grid !important;grid-template-columns: repeat(4, 1fr);gap: clamp(.6rem, 1.4vw, 1.2rem) !important;margin-top: clamp(2.5rem, 5vw, 4rem) !important} @media (max-width: 781px) { .e-con.hl-founder-strip {grid-template-columns: repeat(2, 1fr)} } .elementor-widget-button.wp-block-button.is-style-link .elementor-button:hover {color: #111; background-color: transparent;} .e-con.hl-lookbook {display: grid !important;grid-template-columns: repeat(4, 1fr);gap: clamp(.6rem, 1.4vw, 1.2rem) !important} @media (max-width: 781px) { .e-con.hl-lookbook {grid-template-columns: repeat(2, 1fr)} } .wp-site-blocks .e-con.rh-drawer {display: none} .e-con.rh-burger {display: none} @media (max-width: 1024px) { .rh-js .e-con.rh-hide-tablet {display: none !important} .rh-js .e-con.rh-burger {display: inline-flex} .rh-js .e-con.rh-burger {--flex-direction: row; flex-direction: row;} } @media (max-width: 599px) { .rh-js .e-con.rh-hide-phone {display: none !important} } .e-con.rh-burger {align-items: center;justify-content: center;flex: 0 0 auto;width: 46px;height: 46px;margin: 0 -8px 0 0;padding: 0} .e-con.rh-burger-lines {position: relative;display: block;width: 26px;height: 14px} .e-con.rh-burger-lines::before, .e-con.rh-burger-lines::after {position: absolute;right: 0;height: 2px} .e-con.rh-burger-lines::before {top: 0;width: 26px} .e-con.rh-burger-lines::after {bottom: 0;width: 17px} .rh-burger:hover .e-con.rh-burger-lines::after {width: 26px} .e-con.rh-drawer.rh-ready {position: fixed;top: 0;right: 0;bottom: 0;display: flex;flex-direction: column;width: min(460px, 100%);max-width: 100%;height: 100%;height: 100dvh;margin: 0 !important;padding: 18px clamp(24px, 6vw, 44px) 34px !important;overflow-y: auto} .e-con.rh-drawer-backdrop {position: fixed;inset: 0} .e-con.rh-drawer-head {display: flex !important;align-items: center;justify-content: space-between;gap: 16px;padding-bottom: 16px} .e-con.rh-drawer-head {--flex-direction: row; flex-direction: row;} .e-con.rh-drawer-brand {min-width: 0} .e-con.rh-drawer-close {flex: 0 0 auto;display: inline-grid;width: 46px;height: 46px;padding: 0} .rh-drawer .e-con.rh-drawer-nav {display: block;margin-top: 10px !important} .rh-drawer .rh-drawer-nav .e-con.wp-block-navigation__container {display: flex;flex-direction: column;align-items: stretch !important;gap: 0 !important;width: 100%} .rh-drawer .rh-drawer-nav .e-con.wp-block-navigation-item {display: block;width: 100%} .rh-drawer .rh-drawer-nav .e-con.wp-block-navigation-item__content {display: flex !important;align-items: center;justify-content: space-between;gap: 12px;width: 100%;padding: .62em 0 !important} .rh-drawer .rh-drawer-nav .e-con.wp-block-navigation-item__content {--flex-direction: row; flex-direction: row;} .rh-drawer .rh-drawer-nav .e-con.wp-block-navigation-item__content::before, .rh-drawer .rh-drawer-nav .e-con.wp-block-navigation-item__content::after {display: none !important} .rh-drawer .rh-drawer-nav .e-con.wp-block-navigation-item__label::after {display: none !important} .rh-drawer .rh-drawer-nav .wp-block-navigation-item__content .e-con.wp-block-navigation-item__label {position: static} .rh-drawer .rh-drawer-nav .wp-block-navigation-item__content .e-con.rh-arrow {flex: 0 0 auto} .rh-drawer .e-con.rh-drawer-cta {margin-top: 26px !important;width: 100%} .rh-drawer .rh-drawer-cta .elementor-button {display: flex; align-items: center; justify-content: center; width: 100%; min-height: 54px; box-sizing: border-box; background: var(--rh-d-btn-bg, #111) !important; color: var(--rh-d-btn-fg, #fff) !important; border: 0 !important; border-radius: var(--rh-d-btn-radius, 999px) !important; box-shadow: none !important;} .rh-drawer .rh-drawer-cta .e-con.wp-block-button__link {--flex-direction: row; flex-direction: row;} .rh-drawer .rh-drawer-cta .elementor-button:hover {background: var(--rh-d-btn-hover-bg, var(--rh-d-btn-bg, #111)) !important; color: var(--rh-d-btn-hover-fg, var(--rh-d-btn-fg, #fff)) !important;} .rh-drawer .e-con.rh-drawer-contact {display: grid !important;grid-template-columns: 1fr 1fr;gap: 20px 22px;margin-top: auto !important;padding-top: 30px !important} .rh-drawer .e-con.rh-drawer-contact::before {grid-column: 1 / -1;height: 1px;margin-bottom: 2px} .rh-drawer .e-con.rh-drawer-item {min-width: 0;margin: 0 !important} .rh-drawer .e-con.rh-drawer-item.is-wide {grid-column: 1 / -1} .rh-drawer .e-con.rh-drawer-label {margin-bottom: 6px !important} .rh-drawer .rh-drawer-item .elementor-widget-text-editor:not(.rh-drawer-label) > p {font-family: var(--rh-d-body-font, inherit) !important; font-size: .92rem !important; line-height: 1.6 !important; color: var(--rh-d-soft, inherit) !important; overflow-wrap: anywhere;} @media (max-width: 359px) { .rh-drawer .e-con.rh-drawer-contact {grid-template-columns: 1fr} } .rh-drawer .e-con.rh-drawer-social {display: flex;flex-wrap: wrap;gap: 10px !important;margin-top: 24px !important;padding: 0} .rh-drawer .e-con.rh-drawer-social {--flex-direction: row; flex-direction: row;} .rh-drawer .rh-drawer-social .e-con.wp-social-link {margin: 0 !important} .rh-drawer .e-con.rh-drawer-note {margin-top: 18px !important} .editor-styles-wrapper .e-con.rh-drawer {margin-top: 24px;padding: 28px} .editor-styles-wrapper .e-con.rh-drawer::before {display: block;margin-bottom: 12px} .e-con.rh-totop {position: fixed;right: clamp(14px, 2.4vw, 28px);bottom: clamp(14px, 2.4vw, 28px);width: 48px;height: 48px;display: grid;padding: 0} .e-con.rh-totop.is-raised {bottom: 84px} @media print { .e-con.rh-totop {display: none} } .e-con.rh-woo {padding-bottom: clamp(48px, 7vw, 100px)} .e-con.rh-woo-kicker {margin: 0 0 .6rem !important} .e-con.rh-woo-top {padding-top: clamp(18px, 3vw, 34px)} .rh-woo .e-con.wc-block-breadcrumbs, .rh-woo .e-con.woocommerce-breadcrumb {margin: 0 0 8px} .rh-woo .e-con.wc-block-components-notice-banner, .e-con.woocommerce-message, .e-con.woocommerce-info, .e-con.woocommerce-error {padding: 14px 18px !important} .rh-woo .wc-block-components-notice-banner .e-con.wc-forward, .rh-woo .wc-block-components-notice-banner__content .e-con.button {margin-left: 10px;padding: 0 !important} .e-con.wc-block-components-product-button__button, .e-con.wc-block-cart__submit-button, .e-con.wc-block-components-checkout-place-order-button, .e-con.woocommerce-button, .e-con.button.alt, .e-con.wc-block-components-button:not(.is-link):not(.wc-block-components-totals-coupon__button)), .wc-block-mini-cart__footer-actions .e-con.wc-block-components-button:not(.is-link), .woocommerce-account .woocommerce .e-con.button {display: inline-flex;align-items: center;justify-content: center;gap: 8px;min-height: 52px;padding: 14px 28px !important} .e-con.wc-block-components-product-button__button, .e-con.wc-block-cart__submit-button, .e-con.wc-block-components-checkout-place-order-button, .e-con.woocommerce-button, .e-con.button.alt, .woocommerce-account .woocommerce .e-con.button {--flex-direction: row; flex-direction: row;} .e-con.rh-shop-head {padding: clamp(10px, 2vw, 22px) 0 clamp(18px, 3vw, 30px)} .rh-shop-head .e-con.rh-shop-title, .rh-woo .e-con.rh-shop-title {margin: 0 !important} .rh-shop-head .e-con.wp-block-term-description {max-width: 60ch;margin-top: 14px} .e-con.rh-shop-toolbar {align-items: center;gap: 12px;margin-top: 0 !important;margin-bottom: clamp(20px, 3vw, 34px) !important;padding: 12px 0} .rh-shop-toolbar .e-con.woocommerce-result-count {margin: 0} .rh-shop-toolbar .e-con.woocommerce-ordering {margin: 0} .rh-woo .e-con.wc-block-product-template {gap: clamp(28px, 3vw, 44px) clamp(14px, 2vw, 28px) !important;margin: 0;padding: 0} .rh-woo .e-con.wc-block-product {position: relative;display: flex;flex-direction: column;margin: 0 !important} .rh-woo .e-con.wc-block-components-product-image {position: relative;margin: 0 0 14px !important;overflow: hidden} .rh-woo .wc-block-product .e-con.wp-block-post-title {margin: 0 0 4px !important} .rh-woo .wc-block-product .e-con.wc-block-components-product-price {margin: 0 !important} .rh-woo .wc-block-product .e-con.wp-block-woocommerce-product-button {margin-top: 14px !important} .rh-woo .wc-block-product .e-con.wc-block-components-product-button__button {width: 100%;min-height: 46px;padding: 10px 16px !important} .rh-woo .wc-block-components-product-button .e-con.added_to_cart {display: block;margin-top: 8px} .rh-woo .e-con.wc-block-components-product-sale-badge, .rh-woo .e-con.onsale {position: absolute;top: 12px !important;left: 12px !important;right: auto !important;margin: 0 !important;padding: 6px 10px !important;min-height: 0;min-width: 0} .rh-woo .e-con.wp-block-query-pagination {margin-top: clamp(30px, 4vw, 54px) !important;gap: 6px} .rh-woo .wp-block-query-pagination .e-con.current {display: inline-grid;min-width: 42px;height: 42px;padding: 0 10px} @media (max-width: 781px) { .rh-woo .e-con.wc-block-product-template.wc-block-product-template__responsive, .rh-woo .e-con.wc-block-product-template {grid-template-columns: repeat(2, minmax(0, 1fr)) !important} } .e-con.rh-product {gap: var(--rh-w-gap) !important;margin-top: 10px !important;margin-bottom: clamp(40px, 6vw, 90px) !important;align-items: flex-start !important} .e-con.rh-product-media {flex-basis: 58% !important;min-width: 0} .e-con.rh-product-info {flex-basis: 42% !important;min-width: 0;position: sticky;top: var(--rh-w-sticky-top, 110px)} .rh-woo .e-con.woocommerce-product-gallery {position: relative;margin: 0 !important;width: 100% !important} .rh-woo .woocommerce-product-gallery .e-con.flex-control-thumbs {display: grid !important;grid-template-columns: repeat(5, 1fr);gap: 10px;margin: 12px 0 0 !important;padding: 0 !important} .rh-woo .e-con.woocommerce-product-gallery__trigger {position: absolute;top: 16px;right: 16px;display: grid !important;width: 44px;height: 44px} .rh-woo .e-con.woocommerce-product-gallery__trigger::before {width: 16px;height: 16px;position: absolute;top: 12px;left: 12px} .rh-woo .e-con.woocommerce-product-gallery__trigger::after {width: 7px;height: 1.6px;position: absolute;top: 30px;left: 26px} .rh-product-info .e-con.rh-product-cats {margin-bottom: 12px !important} .rh-product-info .e-con.rh-product-title {margin-bottom: 12px !important} .rh-product-info .e-con.wc-block-components-product-rating {margin-bottom: 14px !important} .rh-product-info .e-con.rh-product-price, .rh-product-info .e-con.wc-block-components-product-price {margin-bottom: 18px !important} .rh-product-info .e-con.rh-product-excerpt {margin-bottom: 22px !important;padding-bottom: 22px} .rh-product-info .e-con.wp-block-post-excerpt__more-text {display: none} .rh-woo .e-con.rh-size-pills {display: flex;flex-wrap: wrap;gap: 8px} .rh-woo .e-con.rh-size-pills {--flex-direction: row; flex-direction: row;} .rh-woo .e-con.reset_variations {display: inline-block;margin-top: 4px} .rh-woo .single_variation_wrap .e-con.woocommerce-variation {margin-bottom: 12px} .rh-woo .e-con.woocommerce-variation-add-to-cart {display: flex !important;gap: 12px;align-items: stretch} .rh-woo .e-con.woocommerce-variation-add-to-cart {--flex-direction: row; flex-direction: row;} .rh-woo .e-con.quantity {display: flex;align-items: stretch} .rh-woo .e-con.quantity {--flex-direction: row; flex-direction: row;} .rh-woo .quantity .e-con.qty {width: 76px !important;min-height: 52px;padding: 8px !important} .rh-woo .e-con.single_add_to_cart_button {flex: 1 1 auto;min-height: 54px} .e-con.rh-product-perks {margin: 0 0 22px !important;padding: 18px 0 0 !important;display: grid;gap: 10px} .rh-woo .wp-block-woocommerce-product-meta .e-con.wp-block-group {display: flex;flex-wrap: wrap;gap: 6px 18px} .rh-woo .wp-block-woocommerce-product-meta .e-con.wp-block-group {--flex-direction: row; flex-direction: row;} .rh-woo .e-con.rh-product-details, .rh-woo .e-con.wp-block-woocommerce-product-details {margin-bottom: clamp(50px, 7vw, 100px) !important} .rh-woo .e-con.wc-tabs {display: flex;flex-wrap: wrap;gap: 0 clamp(18px, 3vw, 40px);margin: 0 0 30px !important;padding: 0 !important} .rh-woo .e-con.wc-tabs {--flex-direction: row; flex-direction: row;} .rh-woo .e-con.woocommerce-Tabs-panel {max-width: 780px} .rh-woo .e-con.woocommerce-product-attributes {width: 100%} .rh-woo #reviews .e-con.commentlist {margin: 0;padding: 0} .rh-woo #reviews .e-con.comment-text {margin: 0 !important;padding: 0 !important} .e-con.rh-related {padding-top: clamp(30px, 5vw, 60px)} @media (max-width: 900px) { .e-con.rh-product {flex-wrap: wrap !important} .e-con.rh-product-media, .e-con.rh-product-info {flex-basis: 100% !important} .e-con.rh-product-info {position: static} .rh-woo .woocommerce-product-gallery .e-con.flex-control-thumbs {grid-template-columns: repeat(5, 1fr);gap: 8px} } @media (max-width: 600px) { .rh-woo .e-con.woocommerce-product-gallery {margin-inline: calc(var(--wp--style--root--padding-left, 20px) * -1) !important;width: calc(100% + var(--wp--style--root--padding-left, 20px) * 2) !important} .rh-woo .woocommerce-product-gallery .e-con.flex-control-thumbs {padding-inline: var(--wp--style--root--padding-left, 20px) !important} } .rh-woo .e-con.wp-block-woocommerce-cart {margin-top: 0 !important} .rh-woo .e-con.wc-block-cart {gap: var(--rh-w-gap)} .rh-woo .e-con.wc-block-components-quantity-selector::after {display: none !important} .rh-woo .e-con.wc-block-cart__sidebar, .rh-woo .e-con.wc-block-checkout__sidebar {align-self: flex-start} .rh-woo .wc-block-cart .e-con.wc-block-cart__totals-title {margin: 0 !important;padding: 0 0 12px !important} .rh-woo .wc-block-cart__sidebar .e-con.wp-block-woocommerce-cart-order-summary-block, .rh-woo .wc-block-checkout__sidebar .e-con.wp-block-woocommerce-checkout-order-summary-block {padding: clamp(20px, 2.4vw, 30px) !important} .rh-woo .e-con.wc-block-components-totals-wrapper {padding: 14px 0 !important} .rh-woo .e-con.wc-block-cart__submit-container {padding: 0 !important} .rh-woo .e-con.wc-block-cart__submit-button {width: 100%;min-height: 58px} .rh-woo .e-con.wc-block-cart__payment-options {display: none} .rh-woo .e-con.wp-block-woocommerce-empty-cart-block {padding: clamp(30px, 6vw, 70px) 0} .rh-woo .wp-block-woocommerce-empty-cart-block .e-con.wp-block-separator {max-width: 80px;margin-inline: auto} .e-con.rh-checkout-header {padding: 18px clamp(20px, 4vw, 48px) !important;align-items: center !important;gap: 14px} .e-con.rh-checkout-brand {flex: 1 1 auto} .e-con.rh-checkout-secure {display: inline-flex;align-items: center;gap: 8px;padding-left: 16px} .e-con.rh-checkout-secure {--flex-direction: row; flex-direction: row;} .e-con.rh-checkout-secure::before {width: 12px;height: 9px;margin-top: 3px} .e-con.rh-checkout-footer {padding: 26px 20px !important} @media (max-width: 600px) { .e-con.rh-checkout-back {display: none} .e-con.rh-checkout-secure {padding-left: 0} } .e-con.rh-woo-checkout {padding-top: clamp(24px, 4vw, 54px)} .rh-woo .e-con.wc-block-checkout {gap: var(--rh-w-gap)} .rh-woo .e-con.wc-block-components-checkout-step {margin-bottom: 30px !important} .rh-woo .e-con.wc-block-components-checkout-step__heading {margin-bottom: 14px !important} .rh-woo .e-con.wc-block-components-checkout-step__container::after {display: none !important} .rh-woo .e-con.wc-block-components-checkout-step::after {display: none !important} .rh-woo .e-con.wc-block-components-checkout-step {padding-left: 0 !important} .rh-woo .e-con.wc-block-components-checkout-place-order-button {width: 100%;min-height: 60px} .rh-woo .e-con.wc-block-checkout__actions_row {gap: 18px;flex-wrap: wrap-reverse} @media (max-width: 699px) { .rh-woo .e-con.wc-block-components-checkout-order-summary__title {padding: 14px 16px !important} } .rh-woo-confirmation .e-con.rh-shop-head {padding-top: clamp(30px, 5vw, 60px)} .rh-woo .e-con.wc-block-order-confirmation-summary-list-item {flex: 1 1 180px;padding: 16px 20px !important} .rh-woo .e-con.wc-block-order-confirmation-summary-list-item__key {display: block;margin-bottom: 4px} .e-con.rh-mini-cart {display: inline-flex} .e-con.rh-mini-cart {--flex-direction: row; flex-direction: row;} .rh-mini-cart .e-con.wc-block-mini-cart__button {position: relative;display: inline-grid;width: 44px;height: 44px;padding: 0 !important} .rh-mini-cart .e-con.wc-block-mini-cart__icon {width: 24px;height: 24px} .rh-mini-cart .e-con.wc-block-mini-cart__badge {top: 4px !important;right: 2px !important;left: auto !important;min-width: 18px;height: 18px;padding: 0 4px;margin: 0 !important} .e-con.wc-block-mini-cart__title {margin: 24px 24px 8px !important} .e-con.wc-block-mini-cart__items {padding: 0 24px !important} .wc-block-mini-cart__items .e-con.wc-block-cart-items__row {padding: 16px 0 !important} .e-con.wc-block-mini-cart__footer {padding: 20px 24px 24px !important} .e-con.wc-block-mini-cart__footer::after {display: none !important} .e-con.wc-block-mini-cart__footer-actions {gap: 10px !important} .wc-block-mini-cart__footer-actions .e-con.wc-block-components-button {flex: 1 1 0;min-height: 52px} .e-con.wc-block-mini-cart__empty-cart-wrapper {padding: 40px 24px !important} .wc-block-mini-cart__empty-cart-wrapper .elementor-button {border-radius: var(--rh-w-radius, 0) !important;} .woocommerce-account .e-con.woocommerce {display: grid;grid-template-columns: 230px minmax(0, 1fr);gap: var(--rh-w-gap, 48px);align-items: start} .woocommerce-account .woocommerce form .e-con.form-row {display: flex;flex-direction: column;gap: 6px;margin-bottom: 16px} .woocommerce-account .e-con.u-columns {display: grid;grid-template-columns: 1fr 1fr;gap: var(--rh-w-gap, 48px)} @media (max-width: 781px) { .woocommerce-account .e-con.woocommerce, .woocommerce-account .e-con.u-columns {grid-template-columns: 1fr} } @media (min-width: 782px) { .rh-woo .e-con.wc-block-product-template.columns-2 {grid-template-columns: repeat(2, minmax(0, 1fr)) !important} .rh-woo .e-con.wc-block-product-template.columns-3 {grid-template-columns: repeat(3, minmax(0, 1fr)) !important} .rh-woo .e-con.wc-block-product-template.columns-4 {grid-template-columns: repeat(4, minmax(0, 1fr)) !important} .rh-woo .e-con.wc-block-product-template.columns-5 {grid-template-columns: repeat(5, minmax(0, 1fr)) !important} } @media (min-width: 782px) and (max-width: 1100px) { .rh-woo .e-con.wc-block-product-template:is(.columns-4, .e-con.columns-5) {grid-template-columns: repeat(3, minmax(0, 1fr)) !important} } .rh-woo .e-con.wp-block-woocommerce-product-image-gallery {max-width: none !important;width: 100% !important} .e-con.rh-shop-feature {padding-top: clamp(56px, 8vw, 110px) !important;padding-bottom: clamp(56px, 8vw, 110px) !important} .e-con.rh-shop-feature-head {margin-bottom: clamp(24px, 3.4vw, 44px) !important} .e-con.rh-shop-feature-cta {margin-top: clamp(28px, 4vw, 48px) !important} .e-con.rh-related:not(:has(.wc-block-product)) {display: none} .rh-woo .wc-block-product .e-con.wp-block-woocommerce-product-button {margin-top: auto !important;padding-top: 14px} @media (max-width: 480px) { .e-con.rh-checkout-secure {gap: 0} .e-con.rh-checkout-header {padding-inline: 16px !important} .rh-woo .wc-block-product .e-con.wc-block-components-product-button__button {padding-inline: 10px !important} } @media (max-width: 480px) { .rh-header-tools .e-con.wp-block-woocommerce-customer-account {display: none !important} .e-con.rh-header-tools {gap: .3rem !important} .rh-header-tools .rh-mini-cart .e-con.wc-block-mini-cart__button {width: 40px} } .rh-mini-cart .e-con.wc-block-mini-cart__button {width: 54px !important;height: 54px !important} .rh-mini-cart .e-con.wc-block-mini-cart__icon, .rh-mini-cart .wc-block-mini-cart__button .e-con.wc-block-mini-cart__icon {width: 38px !important;height: 38px !important} .rh-mini-cart .e-con.wc-block-mini-cart__badge {top: 3px !important;right: -1px !important;min-width: 21px !important;height: 21px !important;padding: 0 5px !important} @media (max-width: 480px) { .rh-header-tools .rh-mini-cart .e-con.wc-block-mini-cart__button, .rh-mini-cart .e-con.wc-block-mini-cart__button {width: 48px !important;height: 48px !important} .rh-mini-cart .e-con.wc-block-mini-cart__icon, .rh-mini-cart .wc-block-mini-cart__button .e-con.wc-block-mini-cart__icon {width: 34px !important;height: 34px !important} } /* RH-ELEMENTOR-CSS END */