@charset 'UTF-8';
:root { --color-primary:              #0e3b2f;
--color-primary-container:    #285245;
--color-on-primary:           #ffffff;
--color-on-primary-container: #97c4b3;
--color-primary-fixed:        #bfecdb;
--color-primary-fixed-dim:    #a3d0bf;
--color-inverse-primary:      #a3d0bf;
--color-secondary:            #765a00;
--color-gold-leaf:            #D4AF37;
--color-secondary-container:  #ffd56b;
--color-on-secondary:         #ffffff;
--color-secondary-fixed-dim:  #eac25a;
--color-tertiary:             #313533;
--color-tertiary-container:   #484b4a;
--color-background:           #fcf9f8;
--color-surface:              #fcf9f8;
--color-surface-dim:          #dcd9d9;
--color-surface-bright:       #fcf9f8;
--color-surface-container-lowest: #ffffff;
--color-surface-container-low:    #f6f3f2;
--color-surface-container:        #f0eded;
--color-surface-container-high:   #eae7e7;
--color-surface-container-highest:#e5e2e1;
--color-surface-variant:          #e5e2e1;
--color-on-surface:           #1c1b1b;
--color-on-surface-variant:   #414845;
--color-on-background:        #1c1b1b;
--color-outline:              #717975;
--color-outline-variant:      #c0c8c3;
--color-inverse-surface:      #313030;
--color-inverse-on-surface:   #f3f0ef;
--color-error:                #ba1a1a;
--color-error-container:      #ffdad6; --font-headline: 'Playfair Display', sans-serif;
--font-body:     'Inter', sans-serif;
--text-headline-xl: clamp(32px, 4vw, 48px);
--text-headline-lg: clamp(24px, 3vw, 32px);
--text-headline-md: 24px;
--text-body-lg:     18px;
--text-body-md:     16px;
--text-label-sm:    12px; --space-unit:          8px;
--space-gutter:        24px;
--space-margin-desk:   64px;
--space-margin-mob:    20px;
--container-max:       1280px; --radius-sm:   4px;
--radius-md:   8px;
--radius-lg:   12px;
--radius-xl:   16px;
--radius-full: 9999px; --shadow-float: 0px 4px 20px rgba(40, 82, 69, 0.05);
} *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
font-family: var(--font-body);
font-size: var(--text-body-md);
line-height: 1.6;
color: var(--color-on-background);
background-color: var(--color-background);
-webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
a  { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }
input, textarea { font-family: inherit; } .headline-xl {
font-family: var(--font-headline);
font-size: var(--text-headline-xl);
font-weight: 700;
line-height: 1.1;
letter-spacing: -0.02em;
color: var(--color-primary);
}
.headline-lg {
font-family: var(--font-headline);
font-size: var(--text-headline-lg);
font-weight: 600;
line-height: 1.2;
letter-spacing: -0.01em;
color: var(--color-primary);
}
.headline-md {
font-family: var(--font-headline);
font-size: var(--text-headline-md);
font-weight: 600;
line-height: 1.3;
color: var(--color-primary);
}
.label-sm {
font-family: var(--font-body);
font-size: var(--text-label-sm);
font-weight: 600;
line-height: 1;
letter-spacing: 0.05em;
text-transform: uppercase;
}
.body-lg { font-size: var(--text-body-lg); line-height: 1.6; }
.body-md { font-size: var(--text-body-md); line-height: 1.6; } .container {
width: 100%;
max-width: var(--container-max);
margin-inline: auto;
padding-inline: var(--space-margin-desk);
}
@media (max-width: 768px) {
.container { padding-inline: var(--space-margin-mob); }
.on-checkout-layout {
display: block !important;}
} .btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 14px 32px;
border-radius: var(--radius-md);
font-size: var(--text-body-md);
font-weight: 600;
transition: all 0.3s ease;
cursor: pointer;
}
.btn-primary {
background: var(--color-primary);
color: var(--color-on-primary);
border: 2px solid var(--color-primary);
}
.btn-primary:hover { opacity: 0.88; transform: translateY(-1px); }
.btn-secondary {
background: transparent;
color: var(--color-primary);
border: 2px solid var(--color-primary);
}
.btn-secondary:hover {
background: rgba(14, 59, 47, 0.05);
transform: translateY(-1px);
} .site-header {
position: sticky;
top: 0;
z-index: 100;
background: var(--color-surface);
border-bottom: 1px solid var(--color-outline-variant);
box-shadow: var(--shadow-float);
}
.nav-inner {
display: flex;
align-items: center;
justify-content: space-between;
padding-block: 16px;
}
.site-logo {
font-family: var(--font-headline);
font-size: var(--text-headline-md);
font-weight: 700;
color: var(--color-primary);
letter-spacing: -0.02em;
}
img.mainlogo {
width: 130px;
}
img.mainlogo2 {
width: 150px;
}
.nav-menu {
display: flex;
gap: 32px;
}
.nav-menu a {
font-size: var(--text-body-md);
font-weight: 500;
color: var(--color-on-surface-variant);
transition: color 0.2s;
position: relative;
padding-bottom: 4px;
}
.nav-menu a:hover,
.nav-menu a.active {
color: var(--color-secondary);
}
.nav-menu a.active::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 2px;
background: var(--color-secondary);
border-radius: 2px;
}
.nav-actions {
display: flex;
align-items: center;
gap: 24px;
}
.nav-search {
display: flex;
align-items: center;
gap: 8px;
background: var(--color-surface-container);
padding: 8px 16px;
border-radius: var(--radius-lg);
border: 1px solid var(--color-outline-variant);
}
.nav-search input {
background: transparent;
border: none;
outline: none;
font-size: var(--text-body-md);
color: var(--color-on-surface);
width: 160px;
}
.nav-search input::placeholder { color: rgba(65, 72, 69, 0.5); }
.nav-icons { display: flex; gap: 16px; }
.nav-icon-btn {
background: none;
border: none;
cursor: pointer;
color: var(--color-primary);
padding: 4px;
transition: opacity 0.2s;
}
.nav-icon-btn:hover { opacity: 0.7; } .nav-toggle {
display: none;
background: none;
border: none;
cursor: pointer;
color: var(--color-primary);
}
.mobile-menu {
display: none;
position: fixed;
inset: 0;
background: var(--color-surface);
z-index: 200;
padding: 80px var(--space-margin-mob) 40px;
flex-direction: column;
gap: 32px; 
}
.mobile-menu.is-open { display: flex; }
.mobile-menu a {
font-family: var(--font-headline);
font-size: 19px;
font-weight: 600;
color: var(--color-primary);
line-height: 43px;
border-bottom: 1px solid;
}
.mobile-menu-close {
position: absolute;
top: 20px;
right: 20px;
background: none;
border: none;
cursor: pointer;
color: var(--color-primary);
}
@media (max-width: 768px) {
.nav-menu, .nav-search { display: none; }
.nav-toggle { display: flex; }
} .hero-section {
position: relative;
width: 100%;
min-height: 870px;
overflow: hidden;
display: flex;
align-items: center;
}
.hero-bg {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
object-position: left;
}
.hero-overlay {
position: absolute;
inset: 0;
background: linear-gradient(180deg, rgba(252,249,248,0) 0%, rgba(252,249,248,0.6) 100%);
}
.hero-content {
position: relative;
z-index: 2;
max-width: 640px;
padding-block: 120px;
}
.hero-eyebrow {
color: var(--color-secondary);
margin-bottom: 16px;
display: block;
}
.hero-title { margin-bottom: 24px; }
.hero-body {
color: var(--color-on-surface-variant);
margin-bottom: 32px;
max-width: 520px;
}
.hero-ctas {
display: flex;
gap: 16px;
flex-wrap: wrap;
}
@media (max-width: 768px) {
.hero-section { min-height: 600px; }
.hero-content { padding-block: 80px; }
} .values-section {
padding-block: 96px;
}
.values-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: var(--space-gutter);
}
.value-card {
padding: 32px;
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-lg);
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
transition: border-color 0.3s;
}
.value-card:hover { border-color: var(--color-primary); }
.value-icon {
width: 64px;
height: 64px;
background: var(--color-primary-fixed);
border-radius: var(--radius-full);
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 24px;
flex-shrink: 0;
}
.value-icon .material-symbols-outlined {
font-size: 28px;
color: var(--color-primary);
}
.value-title {
margin-bottom: 12px;
}
.value-body {
color: var(--color-on-surface-variant);
}
@media (max-width: 900px) { .values-grid { grid-template-columns: 1fr; } } .ingredients-section {
background: var(--color-surface-container);
padding-block: 96px;
}
.section-header {
display: flex;
justify-content: space-between;
align-items: flex-end;
margin-bottom: 48px;
gap: 24px;
}
.section-header-left { max-width: 480px; }
.section-eyebrow {
color: var(--color-secondary);
margin-bottom: 16px;
display: block;
}
.section-link {
font-size: var(--text-label-sm);
font-weight: 600;
letter-spacing: 0.05em;
text-transform: uppercase;
color: var(--color-primary);
text-decoration: underline;
text-underline-offset: 4px;
transition: color 0.2s;
white-space: nowrap;
}
.section-link:hover { color: var(--color-secondary); }
.ingredients-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: var(--space-gutter);
}
.ingredient-card {
background: var(--color-surface);
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
overflow: hidden;
}
.ingredient-img-wrap {
height: 320px;
overflow: hidden;
}
.ingredient-img-wrap img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.7s ease;
}
.ingredient-card:hover .ingredient-img-wrap img { transform: scale(1.05); }
.ingredient-body { padding: 32px; }
.ingredient-title { margin-bottom: 16px; }
.ingredient-desc {
color: var(--color-on-surface-variant);
margin-bottom: 24px;
}
.ingredient-features { display: flex; flex-direction: column; gap: 12px; }
.ingredient-feature {
display: flex;
align-items: center;
gap: 8px;
font-size: var(--text-label-sm);
font-weight: 600;
color: var(--color-primary);
letter-spacing: 0.05em;
text-transform: uppercase;
}
.ingredient-feature .material-symbols-outlined { font-size: 16px; }
@media (max-width: 768px) {
.ingredients-grid { grid-template-columns: 1fr; }
.section-header { flex-direction: column; align-items: flex-start; }
} .ritual-section { padding-block: 96px; overflow: hidden; }
.ritual-header {
text-align: center;
margin-bottom: 48px;
}
.ritual-strip {
display: flex;
gap: 16px;
overflow-x: auto;
padding-bottom: 24px;
padding-inline: 16px;
scrollbar-width: none;
}
.ritual-strip::-webkit-scrollbar { display: none; }
.ritual-item {
flex: none;
width: 288px;
height: 288px;
border-radius: var(--radius-lg);
overflow: hidden;
position: relative;
cursor: pointer;
}
.ritual-item img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.4s ease;
}
.ritual-item:hover img { transform: scale(1.05); }
.ritual-item-overlay {
position: absolute;
inset: 0;
background: rgba(14, 59, 47, 0.2);
opacity: 0;
display: flex;
align-items: center;
justify-content: center;
transition: opacity 0.3s;
}
.ritual-item:hover .ritual-item-overlay { opacity: 1; }
.ritual-item-overlay .material-symbols-outlined {
font-size: 32px;
color: #fff;
} .site-footer {
background: var(--color-surface-container-highest);
}
.footer-top {
display: grid;
grid-template-columns: 2fr 1fr 1.5fr;
gap: var(--space-gutter);
padding-block: 64px;
}
.footer-brand-name {
font-family: var(--font-headline);
font-size: var(--text-headline-md);
font-weight: 700;
color: var(--color-primary);
margin-bottom: 24px;
}
.footer-brand-desc {
color: var(--color-on-surface-variant);
max-width: 280px;
margin-bottom: 24px;
}
.footer-social { display: flex; gap: 16px; }
.footer-social button {
color: var(--color-primary);
transition: color 0.2s;
}
.footer-social button:hover { color: var(--color-secondary); }
.footer-col-title {
font-size: var(--text-label-sm);
font-weight: 600;
letter-spacing: 0.05em;
text-transform: uppercase;
color: var(--color-primary);
margin-bottom: 16px;
}
.footer-links { display: flex; flex-direction: column; gap: 12px; }
.footer-links a {
font-size: var(--text-body-md);
color: var(--color-on-surface-variant);
transition: color 0.2s;
}
.footer-links a:hover { color: var(--color-secondary); }
.footer-newsletter-desc {
color: var(--color-on-surface-variant);
margin-bottom: 16px;
}
.newsletter-form {
display: flex;
border-bottom: 1px solid var(--color-primary);
padding-bottom: 8px;
}
.newsletter-form input {
background: transparent;
border: none;
outline: none;
flex: 1;
font-size: var(--text-body-md);
color: var(--color-on-surface);
}
.newsletter-form input::placeholder { color: rgba(65,72,69,0.4); }
.newsletter-form button {
font-weight: 700;
color: var(--color-primary);
font-size: var(--text-body-md);
transition: color 0.2s;
}
.newsletter-form button:hover { color: var(--color-secondary); }
.footer-bottom {
border-top: 1px solid var(--color-outline-variant);
padding-block: 32px;
text-align: center;
}
.footer-bottom p {
font-size: var(--text-body-md);
color: rgba(65,72,69,0.7);
}
@media (max-width: 900px) {
.footer-top { grid-template-columns: 1fr; }
} .material-symbols-outlined {
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
vertical-align: middle;
} .visually-hidden {
position: absolute;
width: 1px; height: 1px;
overflow: hidden;
clip: rect(0,0,0,0);
white-space: nowrap;
}
.section-eyebrow-wrap { margin-bottom: 16px; display: block; }  .about-hero,
.about-story,
.about-science,
.about-flagship,
.about-testimonials,
.about-newsletter {
opacity: 0;
transform: translateY(20px);
transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}
.about-hero.is-visible,
.about-story.is-visible,
.about-science.is-visible,
.about-flagship.is-visible,
.about-testimonials.is-visible,
.about-newsletter.is-visible {
opacity: 1;
transform: none;
} .about-hero {
position: relative;
min-height: 80vh;
display: flex;
align-items: center;
overflow: hidden;
background: var(--color-surface);
}
.about-hero__bg {
position: absolute;
inset: 0;
z-index: 0;
}
.about-hero__bg img {
width: 100%;
height: 100%;
object-fit: cover;
}
.about-hero__overlay {
position: absolute;
inset: 0;
background: linear-gradient(to right, var(--color-surface) 35%, rgba(252,249,248,.55) 65%, transparent 100%);
}
.about-hero__inner {
position: relative;
z-index: 1;
padding-block: 96px;
}
.about-hero__content { max-width: 600px; }
.about-hero__eyebrow {
color: var(--color-primary-container);
display: block;
margin-bottom: 16px;
letter-spacing: 0.12em;
}
.about-hero__headline { margin-bottom: 24px; }
.about-hero__body {
color: var(--color-on-surface-variant);
margin-bottom: 40px;
max-width: 480px;
}
.about-hero__ctas {
display: flex;
gap: 16px;
flex-wrap: wrap;
}
@media (max-width: 768px) {
.about-hero { min-height: 620px; }
.about-hero__inner { padding-block: 72px; }
.about-hero__overlay {
background: linear-gradient(to bottom, rgba(252,249,248,.85) 0%, rgba(252,249,248,.6) 100%);
}
} .about-story {
padding-block: 96px;
}
.about-story__header {
text-align: center;
margin-bottom: 56px;
}
.about-story__section-title { margin-bottom: 16px; }
.about-story__divider {
width: 96px;
height: 4px;
background: var(--color-secondary);
border-radius: var(--radius-full);
margin-inline: auto;
} .about-story__bento {
display: grid;
grid-template-columns: 7fr 5fr;
gap: 32px;
align-items: start;
} .about-story__narrative {
background: var(--color-surface-container-low);
border: 1px solid var(--color-surface-variant);
border-radius: var(--radius-xl);
padding: 48px;
}
.about-story__badge {
color: var(--color-secondary);
display: block;
margin-bottom: 16px;
font-weight: 700;
}
.about-story__headline { margin-bottom: 24px; }
.about-story__body {
color: var(--color-on-surface-variant);
margin-bottom: 16px;
}
.about-story__body:last-child { margin-bottom: 0; } .about-story__stats-col {
display: flex;
flex-direction: column;
gap: 16px;
}
.about-story__stats {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
}
.about-story__stat {
border-radius: var(--radius-xl);
padding: 32px 24px;
display: flex;
flex-direction: column;
justify-content: center;
}
.about-story__stat--primary {
background: var(--color-primary-container);
color: var(--color-on-primary);
}
.about-story__stat--secondary {
background: var(--color-secondary-container);
color: var(--color-on-secondary-fixed);
}
.about-story__stat-number {
font-family: var(--font-headline);
font-size: 36px;
font-weight: 700;
line-height: 1;
margin-bottom: 8px;
display: block;
}
.about-story__stat-label { opacity: 0.8; } .about-story__panel {
position: relative;
height: 192px;
border-radius: var(--radius-xl);
overflow: hidden;
}
.about-story__panel img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.7s ease;
}
.about-story__panel:hover img { transform: scale(1.05); }
.about-story__panel-placeholder {
width: 100%;
height: 100%;
background: var(--color-primary-fixed);
display: flex;
align-items: center;
justify-content: center;
}
.about-story__panel-placeholder .material-symbols-outlined {
font-size: 48px;
color: var(--color-primary);
opacity: 0.35;
}
.about-story__panel-caption {
position: absolute;
inset: 0;
background: rgba(14, 59, 47, 0.25);
display: flex;
align-items: flex-end;
padding: 24px;
}
.about-story__panel-caption .headline-md { color: #fff; }
@media (max-width: 900px) {
.about-story__bento {
grid-template-columns: 1fr;
}
.about-story__narrative { padding: 32px 24px; }
} .about-science {
background: var(--color-primary-container);
color: var(--color-on-primary);
padding-block: 96px;
overflow: hidden;
}
.about-science__inner {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 80px;
align-items: center;
} .about-science__headline {
color: var(--color-on-primary);
margin-bottom: 24px;
}
.about-science__body {
color: var(--color-on-primary-container);
margin-bottom: 48px;
} .about-science__ingredients {
display: flex;
flex-direction: column;
gap: 32px;
}
.about-science__ingredient {
display: flex;
align-items: flex-start;
gap: 16px;
}
.about-science__ing-icon {
flex-shrink: 0;
width: 48px;
height: 48px;
background: rgba(191, 236, 219, 0.2);
border-radius: var(--radius-lg);
display: flex;
align-items: center;
justify-content: center;
color: var(--color-primary-fixed);
}
.about-science__ing-icon .material-symbols-outlined { font-size: 22px; }
.about-science__ing-title {
color: #fff;
margin-bottom: 6px;
}
.about-science__ing-desc { color: var(--color-on-primary-container); } .about-science__visual { position: relative; }
.about-science__img-wrap {
aspect-ratio: 1 / 1;
border-radius: var(--radius-xl);
overflow: hidden;
border: 8px solid rgba(14, 59, 47, 0.3);
transform: rotate(3deg);
transition: transform 0.5s ease;
}
.about-science__img-wrap:hover { transform: rotate(0deg); }
.about-science__img-wrap img {
width: 100%;
height: 100%;
object-fit: cover;
}
.about-science__img-placeholder {
width: 100%;
height: 100%;
background: var(--color-primary);
display: flex;
align-items: center;
justify-content: center;
aspect-ratio: 1 / 1;
}
.about-science__img-placeholder .material-symbols-outlined {
font-size: 80px;
color: var(--color-on-primary-container);
opacity: 0.3;
} .about-science__quote-card {
position: absolute;
bottom: -32px;
left: -32px;
background: rgba(255, 255, 255, 0.75);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid rgba(40, 82, 69, 0.12);
border-radius: var(--radius-xl);
padding: 24px 28px;
max-width: 280px;
}
.about-science__quote-card p {
color: var(--color-primary);
font-weight: 600;
font-style: italic;
line-height: 1.5;
}
@media (max-width: 1024px) {
.about-science__inner {
grid-template-columns: 1fr;
gap: 56px;
}
.about-science__img-wrap { transform: none; }
.about-science__quote-card {
position: static;
margin-top: 24px;
max-width: 100%;
}
} .about-flagship {
padding-block: 96px;
} .about-flagship__header {
text-align: center;
max-width: 720px;
margin-inline: auto;
margin-bottom: 56px;
}
.about-flagship__eyebrow {
color: var(--color-secondary);
display: block;
margin-bottom: 16px;
font-weight: 700;
letter-spacing: 0.1em;
}
.about-flagship__headline {
margin-bottom: 24px;
}
.about-flagship__intro {
color: var(--color-on-surface-variant);
} .about-flagship__card {
background: var(--color-surface-container-lowest);
border: 1px solid var(--color-surface-variant);
border-radius: 24px;
padding: 56px;
overflow: hidden;
box-shadow: var(--shadow-float);
}
.about-flagship__card-inner {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 48px;
align-items: center;
} .about-flagship__sub-headline { margin-bottom: 24px; }
.about-flagship__features {
display: flex;
flex-direction: column;
gap: 16px;
margin-bottom: 40px;
}
.about-flagship__feature {
display: flex;
align-items: center;
gap: 12px;
font-size: var(--text-body-md);
color: var(--color-on-surface);
}
.about-flagship__feature .material-symbols-outlined {
color: var(--color-secondary);
font-size: 20px;
flex-shrink: 0;
} .about-flagship__product { display: flex; justify-content: center; }
.about-flagship__product-circle {
position: relative;
width: min(420px, 100%);
aspect-ratio: 1 / 1;
background: var(--color-surface-container-low);
border-radius: var(--radius-full);
display: flex;
align-items: center;
justify-content: center;
padding: 32px;
}
.about-flagship__product-circle img {
width: 100%;
height: 100%;
object-fit: contain;
filter: drop-shadow(0 16px 48px rgba(40,82,69,0.2));
}
.about-flagship__product-placeholder {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
}
.about-flagship__product-placeholder .material-symbols-outlined {
font-size: 96px;
color: var(--color-primary);
opacity: 0.2;
}
.about-flagship__badge {
position: absolute;
top: 16px;
right: 16px;
background: var(--color-secondary-container);
color: var(--color-on-secondary-fixed);
padding: 8px 16px;
border-radius: var(--radius-full);
}
@media (max-width: 900px) {
.about-flagship__card { padding: 32px 24px; }
.about-flagship__card-inner {
grid-template-columns: 1fr;
}
.about-flagship__product { order: -1; }
.about-flagship__product-circle { width: min(320px, 85vw); }
} .about-testimonials {
background: var(--color-surface-container-low);
padding-block: 96px;
}
.about-testimonials__headline {
text-align: center;
margin-bottom: 56px;
}
.about-testimonials__grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
}
.about-testimonials__card {
background: rgba(255, 255, 255, 0.7);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid rgba(40, 82, 69, 0.1);
border-left: 4px solid var(--color-secondary);
border-radius: var(--radius-xl);
padding: 32px;
display: flex;
flex-direction: column;
gap: 16px;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.about-testimonials__card:hover {
transform: translateY(-4px);
box-shadow: 0 12px 40px rgba(40, 82, 69, 0.08);
} .about-testimonials__stars {
display: flex;
gap: 4px;
}
.about-testimonials__star {
font-size: 16px;
color: var(--color-surface-variant);
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 20;
}
.about-testimonials__star--filled {
color: var(--color-secondary);
font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 20;
} .about-testimonials__quote {
font-style: italic;
color: var(--color-on-surface-variant);
flex: 1;
} .about-testimonials__author {
display: flex;
align-items: center;
gap: 16px;
padding-top: 8px;
border-top: 1px solid var(--color-surface-variant);
}
.about-testimonials__avatar {
width: 48px;
height: 48px;
border-radius: var(--radius-full);
background: var(--color-primary-fixed);
overflow: hidden;
flex-shrink: 0;
}
.about-testimonials__avatar img {
width: 100%;
height: 100%;
object-fit: cover;
}
.about-testimonials__name {
font-weight: 700;
color: var(--color-primary);
font-size: var(--text-body-md);
}
.about-testimonials__role {
color: var(--color-on-surface-variant);
opacity: 0.7;
margin-top: 4px;
}
@media (max-width: 900px) {
.about-testimonials__grid {
grid-template-columns: 1fr;
max-width: 520px;
margin-inline: auto;
}
} .about-newsletter {
padding-block: 96px;
}
.about-newsletter__card {
background: var(--color-primary-container);
border-radius: 24px;
padding: 80px 64px;
position: relative;
overflow: hidden;
text-align: center;
} .about-newsletter__deco {
position: absolute;
top: 0;
right: 0;
width: 256px;
height: 256px;
background: rgba(255, 255, 255, 0.05);
border-radius: var(--radius-full);
transform: translate(33%, -33%);
pointer-events: none;
}
.about-newsletter__content {
position: relative;
z-index: 1;
max-width: 600px;
margin-inline: auto;
}
.about-newsletter__headline {
color: var(--color-on-primary);
margin-bottom: 24px;
}
.about-newsletter__body {
color: var(--color-on-primary);
opacity: 0.8;
margin-bottom: 40px;
} .about-newsletter__form {
display: flex;
gap: 16px;
max-width: 500px;
margin-inline: auto;
}
.about-newsletter__input {
flex: 1;
padding: 16px 24px;
border-radius: var(--radius-lg);
background: rgba(255, 255, 255, 0.12);
border: 1px solid rgba(255, 255, 255, 0.25);
color: #fff;
font-size: var(--text-body-md);
transition: border-color 0.2s, background 0.2s;
outline: none;
}
.about-newsletter__input::placeholder { color: rgba(255,255,255,0.5); }
.about-newsletter__input:focus {
border-color: var(--color-secondary-container);
background: rgba(255,255,255,0.18);
}
.about-newsletter__btn {
background: var(--color-secondary-container);
color: var(--color-on-secondary-fixed);
border: none;
white-space: nowrap;
font-weight: 700;
padding: 16px 32px;
border-radius: var(--radius-lg);
transition: filter 0.2s, transform 0.2s;
}
.about-newsletter__btn:hover {
filter: brightness(1.08);
transform: translateY(-1px);
}
@media (max-width: 768px) {
.about-newsletter__card { padding: 48px 24px; }
.about-newsletter__form { flex-direction: column; }
.about-newsletter__btn { width: 100%; justify-content: center; }
.hero-bg {
object-position: left !important;
}
}  .contact-hero {
padding-block: 80px 56px;
background: var(--color-surface-container-low);
border-bottom: 1px solid var(--color-outline-variant);
}
.contact-hero__inner {
max-width: 720px;
}
.contact-hero__eyebrow {
display: inline-block;
color: var(--color-secondary);
margin-bottom: 16px;
}
.contact-hero__headline {
margin-bottom: 24px;
}
.contact-hero__body {
color: var(--color-on-surface-variant);
max-width: 540px;
}
.contact-hero__divider {
width: 56px;
height: 3px;
background: var(--color-secondary);
border-radius: var(--radius-full);
margin-top: 40px;
} .contact-form-block {
padding-block: 96px;
}
.contact-form-block__grid {
display: grid;
grid-template-columns: 1fr 1.6fr;
gap: 64px;
align-items: start;
} .contact-form-block__panel {
position: sticky;
top: 96px;
}
.contact-form-block__panel-inner {
background: var(--color-primary-container);
border-radius: 24px;
padding: 56px 40px;
position: relative;
overflow: hidden;
min-height: 420px;
display: flex;
flex-direction: column;
justify-content: center;
gap: 32px;
}
.contact-form-block__panel-icon {
width: 64px;
height: 64px;
background: rgba(255,255,255,0.1);
border-radius: var(--radius-lg);
display: flex;
align-items: center;
justify-content: center;
}
.contact-form-block__panel-icon .material-symbols-outlined {
font-size: 32px;
color: var(--color-on-primary);
font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 48;
}
.contact-form-block__panel-quote {
font-family: var(--font-headline);
font-size: clamp(20px, 2vw, 26px);
font-weight: 600;
line-height: 1.4;
color: var(--color-on-primary);
font-style: italic;
border: none;
}
.contact-form-block__panel-deco {
position: absolute;
width: 200px;
height: 200px;
background: rgba(255,255,255,0.06);
border-radius: var(--radius-full);
bottom: -60px;
right: -60px;
pointer-events: none;
}
.contact-form-block__panel-deco--2 {
width: 120px;
height: 120px;
background: rgba(255,255,255,0.04);
top: -40px;
left: -40px;
right: auto;
bottom: auto;
} .contact-form-block__form-wrap {
padding: 56px;
background: var(--color-surface-container-lowest);
border: 1px solid var(--color-outline-variant);
border-radius: 24px;
box-shadow: var(--shadow-float);
}
.contact-form-block__heading {
margin-bottom: 12px;
}
.contact-form-block__subheading {
color: var(--color-on-surface-variant);
margin-bottom: 40px;
} .contact-form-block__cf7 .wpcf7-form,
.contact-form-block__cf7 form {
display: flex;
flex-direction: column;
gap: 24px;
}
.contact-form-block__cf7 p {
margin: 0;
display: flex;
flex-direction: column;
gap: 8px;
}
.contact-form-block__cf7 label {
font-size: var(--text-label-sm);
font-weight: 600;
letter-spacing: 0.05em;
text-transform: uppercase;
color: var(--color-on-surface);
}
.contact-form-block__cf7 input[type="text"],
.contact-form-block__cf7 input[type="email"],
.contact-form-block__cf7 input[type="tel"],
.contact-form-block__cf7 input[type="url"],
.contact-form-block__cf7 textarea,
.contact-form-block__cf7 select {
width: 100%;
padding: 14px 20px;
border: 1.5px solid var(--color-outline-variant);
border-radius: var(--radius-md);
background: var(--color-surface-container-low);
color: var(--color-on-surface);
font-family: var(--font-body);
font-size: var(--text-body-md);
transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
outline: none;
}
.contact-form-block__cf7 input[type="text"]:focus,
.contact-form-block__cf7 input[type="email"]:focus,
.contact-form-block__cf7 input[type="tel"]:focus,
.contact-form-block__cf7 input[type="url"]:focus,
.contact-form-block__cf7 textarea:focus,
.contact-form-block__cf7 select:focus {
border-color: var(--color-primary);
background: var(--color-surface-container-lowest);
box-shadow: 0 0 0 3px rgba(14, 59, 47, 0.08);
}
.contact-form-block__cf7 textarea { resize: vertical; min-height: 140px; }
.contact-form-block__cf7 input[type="submit"] {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 16px 40px;
background: var(--color-primary);
color: var(--color-on-primary);
border: 2px solid var(--color-primary);
border-radius: var(--radius-md);
font-family: var(--font-body);
font-size: var(--text-body-md);
font-weight: 600;
cursor: pointer;
transition: opacity 0.2s, transform 0.2s;
align-self: flex-start;
}
.contact-form-block__cf7 input[type="submit"]:hover {
opacity: 0.88;
transform: translateY(-1px);
}
.contact-form-block__cf7 .wpcf7-not-valid-tip {
color: var(--color-error);
font-size: var(--text-label-sm);
margin-top: 4px;
}
.contact-form-block__cf7 .wpcf7-response-output {
padding: 16px 20px;
border-radius: var(--radius-md);
font-size: var(--text-body-md);
border: 1.5px solid var(--color-outline-variant);
margin-top: 8px;
}
.contact-form-block__cf7 .wpcf7-mail-sent-ok {
background: var(--color-primary-fixed);
border-color: var(--color-primary);
color: var(--color-primary);
}
.contact-form-block__cf7 .wpcf7-validation-errors,
.contact-form-block__cf7 .wpcf7-mail-sent-ng,
.contact-form-block__cf7 .wpcf7-spam-blocked {
background: var(--color-error-container);
border-color: var(--color-error);
color: var(--color-error);
}
.contact-form-block__cf7 span.wpcf7-not-valid-tip {
display: block;
}
@media (max-width: 900px) {
.contact-form-block__grid {
grid-template-columns: 1fr;
}
.contact-form-block__panel { position: static; }
.contact-form-block__panel-inner { min-height: auto; }
.contact-form-block__form-wrap { padding: 32px 24px; }
} .contact-info {
padding-block: 80px;
background: var(--color-surface-container-low);
border-top: 1px solid var(--color-outline-variant);
}
.contact-info__grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
}
.contact-info__card {
display: flex;
align-items: flex-start;
gap: 20px;
padding: 32px;
background: var(--color-surface-container-lowest);
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.contact-info__card:hover {
transform: translateY(-3px);
box-shadow: 0 8px 32px rgba(14,59,47,0.07);
}
.contact-info__icon-wrap {
width: 48px;
height: 48px;
flex-shrink: 0;
background: var(--color-primary-fixed);
border-radius: var(--radius-lg);
display: flex;
align-items: center;
justify-content: center;
}
.contact-info__icon-wrap .material-symbols-outlined {
font-size: 22px;
color: var(--color-primary);
}
.contact-info__text {
display: flex;
flex-direction: column;
gap: 6px;
}
.contact-info__label {
color: var(--color-secondary);
display: block;
}
.contact-info__value {
color: var(--color-on-surface);
font-weight: 500;
}
a.contact-info__value:hover { color: var(--color-primary); text-decoration: underline; }
@media (max-width: 900px) {
.contact-info__grid { grid-template-columns: 1fr; max-width: 480px; }
} .on-page-header {
padding-block: 0px 28px;
border-bottom: 1px solid var(--color-outline-variant);
margin-bottom: 16px;
}
.on-page-header__eyebrow {
display: block;
color: var(--color-secondary);
margin-bottom: 12px;
}
.on-page-header__headline { } .on-single-product { padding-bottom: 96px;     margin-top: 30px; }
.on-single-product .woocommerce-breadcrumb {
padding-block: 24px;
font-size: var(--text-label-sm);
color: var(--color-on-surface-variant);
letter-spacing: 0.04em;
}
.on-single-product .woocommerce-breadcrumb a { color: var(--color-on-surface-variant); }
.on-single-product .woocommerce-breadcrumb a:hover { color: var(--color-primary); } .single-product div.product {
display: block !important;
float: none !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
}
.single-product div.product .woocommerce-product-gallery,
.single-product div.product .woocommerce-product-gallery--with-images,
.single-product div.product .woocommerce-product-gallery--is-init,
.single-product div.product .summary,
.single-product div.product .entry-summary {
float: none !important;
clear: none !important;
width: auto !important;
max-width: none !important;
margin: 0 !important;
padding: 0 !important;
} .on-product-layout { padding-top: 40px; }
.on-product-hero {
display: grid;
grid-template-columns: 7fr 5fr;
gap: 64px;
align-items: start;
margin-bottom: 80px;
} .on-product-gallery {
min-width: 0; width: 100%; }
.on-product-summary {
min-width: 0;
width: 100%;
position: sticky;
top: 100px;
align-self: start;
} .wpgs-for .slick-arrow::before, .wpgs-nav .slick-prev::before, .wpgs-nav .slick-next::before {
color: #ffffff !important;
}  .on-product-gallery ol.flex-control-nav.flex-control-thumbs {
display: flex;
gap: 10px;
margin-top: 14px;
padding: 0;
list-style: none;
flex-wrap: wrap;
}
.on-product-gallery ol.flex-control-nav.flex-control-thumbs li {
flex: 0 0 auto;
}
.on-product-gallery ol.flex-control-nav.flex-control-thumbs li img {
width: 76px;
height: 92px;
object-fit: cover;
border-radius: var(--radius-md);
border: 2px solid var(--color-outline-variant);
cursor: pointer;
transition: border-color 0.2s, transform 0.2s;
display: block;
}
.on-product-gallery ol.flex-control-nav.flex-control-thumbs li img:hover {
border-color: var(--color-primary-container);
transform: translateY(-2px);
}
.on-product-gallery ol.flex-control-nav.flex-control-thumbs li img.flex-active {
border-color: var(--color-primary);
} .on-product-gallery .onsale {
position: absolute;
background: var(--color-secondary-container);
color: var(--color-secondary);
font-size: var(--text-label-sm);
font-weight: 700;
letter-spacing: 0.05em;
text-transform: uppercase;
padding: 6px 14px;
border-radius: var(--radius-full);
top: 16px;
left: 16px;
min-width: auto;
min-height: auto;
line-height: 1;
z-index: 10;
} .on-product-summary .product_title {
font-family: var(--font-headline);
font-size: clamp(44px, 6vw, 56px);
font-weight: 700;
line-height: 1.05;
letter-spacing: -0.02em;
color: var(--color-primary);
margin-bottom: 18px;
}
.on-product-summary .product_title a {
color: inherit;
}
.on-product-summary .product-rating-static,
.on-product-summary .woocommerce-product-rating {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 20px;
}
.on-product-summary .product-rating-static__stars,
.on-product-summary .star-rating {
color: var(--color-gold-leaf);
font-size: 14px;
display: flex;
gap: 2px;
}
.on-product-summary .product-rating-static {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 24px;
}
.on-product-summary .product-rating-static .label-sm {
color: var(--color-on-surface-variant);
letter-spacing: 0.04em;
}
.on-product-summary .woocommerce-review-link {
font-size: var(--text-body-md);
color: var(--color-on-surface-variant);
}
.on-product-summary .price {
display: flex;
align-items: baseline;
gap: 16px;
font-family: var(--font-headline);
font-size: var(--text-headline-md);
color: var(--color-primary);
font-weight: 700;
margin-bottom: 28px;
}
.on-product-summary .price del { opacity: 0.45; font-size: 0.8em; margin-right: 8px; }
.on-product-summary .price ins { text-decoration: none; }
.on-product-summary .woocommerce-product-details__short-description {
color: var(--color-on-surface-variant);
font-size: var(--text-body-lg);
line-height: 1.7;
margin-bottom: 36px;
padding-bottom: 36px;
border-bottom: 1px solid var(--color-outline-variant);
}
.on-product-summary .single_add_to_cart_button + .single_add_to_cart_button {
margin-top: 16px;
}
.on-product-tabs-section .woocommerce-Tabs-panel {
padding: 0;
}
.on-product-tabs-section .woocommerce-Tabs-panel .on-product-reviews-grid {
margin-top: 0;
} .on-product-summary form.cart {
display: flex;
flex-wrap: wrap;
gap: 16px;
margin-bottom: 28px;
align-items: flex-start;
}
.on-product-summary .quantity {
display: flex;
align-items: center;
gap: 0;
border: 1.5px solid var(--color-outline-variant);
border-radius: var(--radius-lg);
overflow: hidden;
width: fit-content;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
margin:0px !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs{
padding: 0px !important;
}
.on-product-summary .quantity .qty {
min-width: 72px;
text-align: center;
border: none;
background: transparent;
font-size: var(--text-body-lg);
font-weight: 600;
color: var(--color-on-surface);
padding: 20px 16px;
appearance: none;
-moz-appearance: textfield;
outline: none;
}
.on-product-summary .quantity .qty::-webkit-inner-spin-button { display: none; }
.on-product-summary .quantity .minus,
.on-product-summary .quantity .plus,
.on-product-summary .quantity button {
font-size: 20px;
padding: 0 18px;
color: var(--color-primary);
border: none;
background: transparent;
}
.on-product-summary .single_add_to_cart_button,
.on-product-summary .single_add_to_cart_button.buy-now {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
padding: 18px 40px;
border-radius: var(--radius-md);
font-family: var(--font-body);
font-size: var(--text-body-md);
font-weight: 600;
cursor: pointer;
transition: opacity 0.25s, transform 0.25s;
min-height: 62px;
}
.on-product-summary .single_add_to_cart_button {
background: var(--color-surface-container-lowest);
color: var(--color-primary);
border: 2px solid var(--color-primary);
min-width: 240px;
width: auto;
}
.on-product-summary .single_add_to_cart_button.buy-now {
background: var(--color-primary);
color: var(--color-on-primary);
border: 2px solid var(--color-primary);
width: 100%;
}
.on-product-summary .single_add_to_cart_button.button.alt {
box-shadow: none;
}
.on-product-summary .single_add_to_cart_button:hover,
.on-product-summary .single_add_to_cart_button.buy-now:hover {
opacity: 0.88;
transform: translateY(-1px);
}
.on-product-summary .single_add_to_cart_button.loading { opacity: 0.6; pointer-events: none; }
.on-product-summary .single_add_to_cart_button.added::after {
content: '';
display: inline-block;
width: 16px;
height: 16px;
border: 2px solid rgba(255,255,255,0.5);
border-top-color: #fff;
border-radius: 50%;
animation: spin 0.6s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } } .on-product-detail-highlights {
display: grid;
grid-template-columns: 1fr 360px;
gap: 32px;
margin-bottom: 80px;
}
.on-product-detail-features,
.on-product-detail-highlights__aside {
display: flex;
flex-direction: column;
}
.on-product-detail-features {
background: var(--color-surface-container-low);
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
padding: 40px;
box-shadow: var(--shadow-float);
}
.on-product-detail-heading {
font-family: var(--font-headline);
font-size: clamp(26px, 3vw, 36px);
line-height: 1.1;
font-weight: 700;
color: var(--color-primary);
margin-bottom: 28px;
letter-spacing: -0.02em;
}
.on-product-detail-heading::before {
content: '';
display: block;
width: 56px;
height: 4px;
background: var(--color-primary);
margin-bottom: 16px;
border-radius: var(--radius-sm);
}
.on-product-detail-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 20px;
}
.on-product-detail-feature {
display: flex;
gap: 16px;
}
.on-product-detail-feature__icon {
width: 44px;
min-width: 44px;
height: 44px;
border-radius: var(--radius-full);
background: var(--color-secondary-container);
color: var(--color-secondary);
display: grid;
place-items: center;
}
.on-product-detail-feature__title {
font-family: var(--font-headline);
font-size: var(--text-body-md);
font-weight: 700;
margin-bottom: 6px;
color: var(--color-primary);
}
.on-product-detail-feature__text {
color: var(--color-on-surface-variant);
line-height: 1.7;
}
.on-product-detail-highlights__aside {
justify-content: center;
}
.on-product-ingredient-highlight {
background: var(--color-primary);
color: #ffffff;
border-radius: var(--radius-xl);
padding: 40px;
display: flex;
flex-direction: column;
gap: 20px;
}
.on-product-ingredient-highlight__icon {
width: 48px;
height: 48px;
border-radius: var(--radius-full);
border: 1px solid rgba(255,255,255,0.25);
display: grid;
place-items: center;
color: var(--color-gold-leaf);
}
.on-product-ingredient-highlight__title {
font-family: var(--font-headline);
font-size: var(--text-headline-md);
line-height: 1.1;
}
.on-product-ingredient-highlight__text {
color: rgba(255,255,255,0.85);
line-height: 1.8;
}
.on-product-ingredient-highlight__label {
display: inline-flex;
align-items: center;
padding: 10px 16px;
border-radius: var(--radius-full);
background: rgba(255,255,255,0.12);
color: #ffffff;
letter-spacing: 0.12em;
text-transform: uppercase;
font-size: var(--text-label-sm);
font-weight: 700;
}
.on-product-reviews-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 20px;
margin-top: 32px;
}
.on-product-review-card {
background: var(--color-surface-container-lowest);
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
padding: 28px;
display: flex;
flex-direction: column;
gap: 18px;
transition: transform 0.2s ease, border-color 0.2s ease;
}
.on-product-review-card:hover {
transform: translateY(-2px);
border-color: var(--color-primary);
}
.on-product-review-card__stars {
display: flex;
gap: 4px;
color: var(--color-gold-leaf);
}
.on-product-review-card__copy {
color: var(--color-on-surface-variant);
line-height: 1.8;
}
.on-product-review-card__meta {
display: flex;
flex-direction: column;
gap: 6px;
color: var(--color-on-surface);
}
.on-product-review-card__meta .label-md {
font-weight: 700;
}
.on-product-review-card__meta .label-sm {
color: var(--color-on-surface-variant);
}
.on-product-testimonials {
display: none;
}
@media (max-width: 1000px) {
.on-product-detail-highlights { grid-template-columns: 1fr; }
.on-product-detail-grid { grid-template-columns: 1fr; }
.on-product-testimonials__grid { grid-template-columns: 1fr; }
} .on-product-summary .product_meta {
display: flex;
flex-direction: column;
gap: 12px;
padding-top: 28px;
border-top: 1px solid var(--color-outline-variant);
}
.on-product-summary .product_meta span.sku_wrapper,
.on-product-summary .product_meta span.posted_in,
.on-product-summary .product_meta span.tagged_as {
font-size: var(--text-label-sm);
color: var(--color-on-surface-variant);
letter-spacing: 0.04em;
}
.on-product-summary .product_meta a:hover { color: var(--color-primary); } .on-product-tabs-section .woocommerce-tabs {
margin-bottom: 80px;
}
.on-product-tabs-section .woocommerce-tabs ul.tabs {
display: flex;
gap: 0;
border-bottom: 2px solid var(--color-outline-variant);
margin-bottom: 48px;
padding: 0;
list-style: none;
}
.on-product-tabs-section .woocommerce-tabs ul.tabs li {
margin: 0;
}
.on-product-tabs-section .woocommerce-tabs ul.tabs li a {
display: block;
padding: 16px 28px;
font-size: var(--text-body-md);
font-weight: 600;
color: var(--color-on-surface-variant);
border-bottom: 3px solid transparent;
margin-bottom: -2px;
transition: color 0.2s, border-color 0.2s;
}
.on-product-tabs-section .woocommerce-tabs ul.tabs li.active a,
.on-product-tabs-section .woocommerce-tabs ul.tabs li a:hover {
color: var(--color-primary);
border-bottom-color: var(--color-primary);
}
.on-product-tabs-section .woocommerce-tabs ul.tabs li::before,
.on-product-tabs-section .woocommerce-tabs ul.tabs li::after { display: none; }
.on-product-tabs-section .woocommerce-Tabs-panel {
font-size: var(--text-body-lg);
color: var(--color-on-surface-variant);
line-height: 1.8;
max-width: 760px;
}
.on-product-tabs-section .woocommerce-Tabs-panel {
padding: 0;
}
.on-product-tabs-section .woocommerce-Tabs-panel h2 { display: none; }
.on-product-tabs-section .woocommerce-Tabs-panel .on-product-reviews-grid {
margin-top: 0;
}
@media (max-width: 1000px) {
.on-product-reviews-grid { grid-template-columns: 1fr; }
} .on-product-tabs-section .related.products,
.on-product-tabs-section .upsells.products {
margin-top: 64px;
}
.on-product-tabs-section .related.products > h2,
.on-product-tabs-section .upsells.products > h2 {
font-family: var(--font-headline);
font-size: var(--text-headline-lg);
font-weight: 600;
color: var(--color-primary);
margin-bottom: 40px;
padding-bottom: 24px;
border-bottom: 1px solid var(--color-outline-variant);
}
.on-product-tabs-section ul.products {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 24px;
list-style: none;
padding: 0;
margin: 0;
}
.on-product-tabs-section ul.products li.product {
background: var(--color-surface-container-lowest);
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
overflow: hidden;
transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.on-product-tabs-section ul.products li.product:hover {
transform: translateY(-4px);
box-shadow: 0 12px 40px rgba(14,59,47,0.09);
}
.on-product-tabs-section ul.products li.product a.woocommerce-loop-product__link img {
aspect-ratio: 1/1;
object-fit: cover;
width: 100%;
}
.on-product-tabs-section ul.products li.product .woocommerce-loop-product__title {
font-family: var(--font-headline);
font-size: var(--text-body-md);
font-weight: 600;
color: var(--color-primary);
padding: 16px 16px 4px;
}
.on-product-tabs-section ul.products li.product .price {
display: block;
padding: 0 16px 16px;
color: var(--color-secondary);
font-weight: 600;
}
.on-product-tabs-section ul.products li.product .button {
display: block;
margin: 0 16px 16px;
padding: 10px 20px;
background: var(--color-primary);
color: var(--color-on-primary);
border-radius: var(--radius-md);
text-align: center;
font-size: var(--text-body-md);
font-weight: 600;
transition: opacity 0.2s;
}
.on-product-tabs-section ul.products li.product .button:hover { opacity: 0.88; } #review_form .comment-form-author,
#review_form .comment-form-email {
display: flex;
flex-direction: column;
gap: 8px;
margin-bottom: 20px;
}
#review_form label {
font-size: var(--text-label-sm);
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.05em;
}
#review_form input[type="text"],
#review_form input[type="email"],
#review_form textarea {
padding: 14px 18px;
border: 1.5px solid var(--color-outline-variant);
border-radius: var(--radius-md);
background: var(--color-surface-container-low);
font-family: var(--font-body);
font-size: var(--text-body-md);
color: var(--color-on-surface);
transition: border-color 0.2s;
outline: none;
width: 100%;
}
#review_form input:focus,
#review_form textarea:focus {
border-color: var(--color-primary);
}
#review_form .comment-form-rating .stars a {
color: var(--color-secondary);
font-size: 18px;
}
#review_form input[type="submit"] {
padding: 14px 36px;
background: var(--color-primary);
color: var(--color-on-primary);
border: 2px solid var(--color-primary);
border-radius: var(--radius-md);
font-family: var(--font-body);
font-weight: 600;
cursor: pointer;
transition: opacity 0.2s;
}
#review_form input[type="submit"]:hover { opacity: 0.88; }
@media (max-width: 1024px) {
.on-product-hero { grid-template-columns: 1fr 1fr; gap: 40px; }
}
@media (max-width: 900px) {
.on-product-hero { grid-template-columns: 1fr; gap: 40px; }
.on-product-gallery .woocommerce-product-gallery { position: static; top: auto; }
.on-product-gallery .woocommerce-product-gallery__wrapper { min-height: 300px; }
.on-product-tabs-section ul.products { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
.on-product-hero { gap: 32px; }
.on-product-gallery .woocommerce-product-gallery__wrapper { min-height: 260px; aspect-ratio: 1/1; }
.on-product-tabs-section ul.products { grid-template-columns: 1fr; }
} .on-cart-page { padding-bottom: 96px; }
.on-cart-layout {
display: grid;
grid-template-columns: 1fr 380px;
gap: 48px;
align-items: start;
} .on-cart-items { display: flex; flex-direction: column; gap: 0; }
.on-cart-item {
display: grid;
grid-template-columns: 100px 1fr;
gap: 24px;
padding: 28px 0;
border-bottom: 1px solid var(--color-outline-variant);
align-items: start;
}
.on-cart-item__thumb {
aspect-ratio: 1/1;
overflow: hidden;
border-radius: var(--radius-lg);
border: 1px solid var(--color-outline-variant);
}
.on-cart-item__thumb img { width: 100%; height: 100%; object-fit: cover; }
.on-cart-item__info { display: flex; flex-direction: column; gap: 12px; }
.on-cart-item__meta { display: flex; flex-direction: column; gap: 6px; }
.on-cart-item__name {
font-family: var(--font-headline);
font-size: var(--text-headline-md);
font-weight: 600;
color: var(--color-primary);
}
.on-cart-item__name:hover { text-decoration: underline; }
.on-cart-item__price { color: var(--color-on-surface-variant); font-size: var(--text-body-md); }
.on-cart-item__actions {
display: flex;
align-items: center;
gap: 24px;
flex-wrap: wrap;
}
.on-cart-item__subtotal {
font-weight: 700;
color: var(--color-primary);
font-size: var(--text-body-lg);
margin-left: auto;
}
.on-cart-item__remove {
display: flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
border-radius: var(--radius-full);
color: var(--color-on-surface-variant);
transition: background 0.2s, color 0.2s;
}
.on-cart-item__remove:hover {
background: var(--color-error-container);
color: var(--color-error);
} .on-qty {
display: flex;
align-items: center;
border: 1.5px solid var(--color-outline-variant);
border-radius: var(--radius-md);
overflow: hidden;
}
.on-qty .qty {
width: 52px;
text-align: center;
border: none;
background: transparent;
font-size: var(--text-body-md);
font-weight: 600;
color: var(--color-on-surface);
padding: 10px 4px;
outline: none;
-moz-appearance: textfield;
appearance: none;
}
.on-qty .qty::-webkit-inner-spin-button { display: none; } .on-cart-actions {
display: flex;
align-items: center;
gap: 16px;
padding-top: 28px;
flex-wrap: wrap;
}
.on-coupon-wrap {
display: flex;
gap: 12px;
flex: 1;
}
.on-coupon-input {
flex: 1;
padding: 12px 18px;
border: 1.5px solid var(--color-outline-variant);
border-radius: var(--radius-md);
background: var(--color-surface-container-low);
font-family: var(--font-body);
font-size: var(--text-body-md);
color: var(--color-on-surface);
outline: none;
transition: border-color 0.2s;
width: 60% !important;
}
.on-coupon-input:focus { border-color: var(--color-primary); }
.on-update-cart { margin-left: auto; } .on-cart-sidebar {
position: sticky;
top: 96px;
}
.cart_totals {
background: var(--color-surface-container-lowest);
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
padding: 40px;
}
.cart_totals h2 {
font-family: var(--font-headline);
font-size: var(--text-headline-md);
font-weight: 600;
color: var(--color-primary);
margin-bottom: 28px;
padding-bottom: 20px;
border-bottom: 1px solid var(--color-outline-variant);
}
.cart_totals table { width: 100%; border-collapse: collapse; margin-bottom: 28px; }
.cart_totals table th,
.cart_totals table td {
padding: 14px 0;
font-size: var(--text-body-md);
border-bottom: 1px solid var(--color-surface-variant);
text-align: left;
}
.cart_totals table th { color: var(--color-on-surface-variant); font-weight: 500; }
.cart_totals table td { text-align: right; font-weight: 600; color: var(--color-on-surface); }
.cart_totals .order-total th,
.cart_totals .order-total td { border-bottom: none; font-weight: 700; font-size: var(--text-body-lg); color: var(--color-primary); }
.cart_totals .wc-proceed-to-checkout { padding: 0; }
.cart_totals .checkout-button,
.cart_totals a.checkout-button {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
width: 100%;
padding: 18px 32px;
background: var(--color-primary);
color: var(--color-on-primary) !important;
border-radius: var(--radius-md);
font-family: var(--font-body);
font-size: var(--text-body-md);
font-weight: 600;
transition: opacity 0.2s, transform 0.2s;
}
.cart_totals .checkout-button:hover { opacity: 0.88; transform: translateY(-1px); }
@media (max-width: 900px) {
.on-cart-layout { grid-template-columns: 1fr; }
.on-cart-sidebar { position: static; }
} .on-checkout-page { padding-bottom: 96px; }
.on-checkout-layout {
display: grid;
grid-template-columns: 1fr 400px;
gap: 48px;
align-items: start;
} .on-checkout-section {
background: var(--color-surface-container-lowest);
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
padding: 40px;
margin-bottom: 32px;
}
.on-checkout-section__title {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 32px;
padding-bottom: 24px;
border-bottom: 1px solid var(--color-outline-variant);
}
.on-checkout-section__title .material-symbols-outlined {
color: var(--color-secondary);
font-size: 22px;
} .on-checkout-section .form-row {
display: flex;
flex-direction: column;
gap: 8px;
margin-bottom: 20px;
}
.on-checkout-section label {
font-size: var(--text-label-sm);
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.05em;
color: var(--color-on-surface);
}
.on-checkout-section label .required { color: var(--color-error); }
.on-checkout-section input[type="text"],
.on-checkout-section input[type="email"],
.on-checkout-section input[type="tel"],
.on-checkout-section input[type="password"],
.on-checkout-section select,
.on-checkout-section textarea {
width: 100%;
padding: 14px 18px;
border: 1.5px solid var(--color-outline-variant);
border-radius: var(--radius-md);
background: var(--color-surface-container-low);
font-family: var(--font-body);
font-size: var(--text-body-md);
color: var(--color-on-surface);
outline: none;
transition: border-color 0.2s, box-shadow 0.2s;
}
.on-checkout-section input:focus,
.on-checkout-section select:focus,
.on-checkout-section textarea:focus {
border-color: var(--color-primary);
box-shadow: 0 0 0 3px rgba(14, 59, 47, 0.08);
}
.on-checkout-section .woocommerce-input-wrapper { display: block; }
.on-checkout-section .form-row-first,
.on-checkout-section .form-row-last {
display: inline-flex;
flex-direction: column;
gap: 8px;
width: calc(50% - 10px);
}
.on-checkout-section .form-row-first { margin-right: 20px; } .on-checkout-payment-section .woocommerce-checkout-payment { margin-top: 0; }
.on-checkout-payment-section .wc_payment_methods {
display: flex;
flex-direction: column;
gap: 12px;
list-style: none;
padding: 0;
margin-bottom: 28px;
}
.on-checkout-payment-section .wc_payment_method {
background: var(--color-surface-container-low);
border: 1.5px solid var(--color-outline-variant);
border-radius: var(--radius-md);
padding: 16px 20px;
transition: border-color 0.2s;
}
.on-checkout-payment-section .wc_payment_method input[type="radio"]:checked + label ~ .payment_box,
.on-checkout-payment-section .wc_payment_method.payment_method_selected {
border-color: var(--color-primary);
}
.on-checkout-payment-section .payment_method_paypal .payment_box,
.on-checkout-payment-section .payment_box {
padding: 16px;
background: var(--color-surface-container);
border-radius: var(--radius-sm);
font-size: var(--text-body-md);
color: var(--color-on-surface-variant);
margin-top: 12px;
}
.on-checkout-payment-section .place-order button#place_order {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
width: 100%;
padding: 20px 40px;
background: var(--color-primary);
color: var(--color-on-primary);
border: 2px solid var(--color-primary);
border-radius: var(--radius-md);
font-family: var(--font-body);
font-size: var(--text-body-md);
font-weight: 700;
cursor: pointer;
transition: opacity 0.2s, transform 0.2s;
}
.on-checkout-payment-section .place-order button#place_order:hover {
opacity: 0.88;
transform: translateY(-1px);
} .on-checkout-login-notice {
display: flex;
align-items: center;
gap: 12px;
padding: 16px 24px;
background: var(--color-primary-fixed);
border-radius: var(--radius-md);
font-size: var(--text-body-md);
color: var(--color-primary);
margin-bottom: 40px;
}
.on-checkout-login-notice .material-symbols-outlined { font-size: 20px; }
.on-checkout-login-notice a { font-weight: 600; text-decoration: underline; color: var(--color-primary); } .on-checkout-sidebar { position: sticky; top: 96px; }
.on-checkout-order-summary {
background: var(--color-surface-container-lowest);
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
padding: 40px;
} .on-checkout-order-summary table.shop_table {
width: 100%;
border-collapse: collapse;
margin-bottom: 16px;
font-size: var(--text-body-md);
}
.on-checkout-order-summary table.shop_table thead th {
font-size: var(--text-label-sm);
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.05em;
padding-bottom: 12px;
border-bottom: 1px solid var(--color-outline-variant);
padding-left: 20px;
}
.on-checkout-order-summary table.shop_table tbody tr,
.on-checkout-order-summary table.shop_table tfoot tr {
border-bottom: 1px solid var(--color-surface-variant);
}
.on-checkout-order-summary table.shop_table tbody tr:last-child,
.on-checkout-order-summary table.shop_table tfoot tr:last-child { border-bottom: none; }
.on-checkout-order-summary table.shop_table td,
.on-checkout-order-summary table.shop_table th { padding: 12px 4px; vertical-align: middle; }
.on-checkout-order-summary table.shop_table td:last-child { text-align: right; font-weight: 600; }
.on-checkout-order-summary table.shop_table tfoot .order-total th,
.on-checkout-order-summary table.shop_table tfoot .order-total td {
font-size: var(--text-body-lg);
font-weight: 700;
color: var(--color-primary);
padding-top: 16px;
border-top: 2px solid var(--color-outline-variant);
} .on-checkout-order-summary .product-thumbnail img {
width: 52px;
height: 52px;
object-fit: cover;
border-radius: var(--radius-md);
border: 1px solid var(--color-outline-variant);
}
.on-checkout-order-summary .product-quantity { color: var(--color-on-surface-variant); }
.on-checkout-totals {
display: flex;
flex-direction: column;
gap: 12px;
margin-bottom: 24px;
}
.on-checkout-total-row {
display: flex;
justify-content: space-between;
align-items: center;
padding-bottom: 12px;
border-bottom: 1px solid var(--color-surface-variant);
}
.on-checkout-total-row:last-child { border-bottom: none; }
.on-checkout-total-row--discount .body-md { color: var(--color-secondary); }
.on-checkout-total-row--grand .headline-md { color: var(--color-primary); } .on-checkout-trust {
display: flex;
justify-content: space-between;
gap: 8px;
padding-top: 24px;
border-top: 1px solid var(--color-outline-variant);
margin-top: 20px;
}
.on-checkout-trust__item {
display: flex;
flex-direction: column;
align-items: center;
gap: 6px;
text-align: center;
flex: 1;
}
.on-checkout-trust__item .material-symbols-outlined {
font-size: 22px;
color: var(--color-primary);
font-variation-settings: 'FILL' 0, 'wght' 300;
}
.on-checkout-trust__item .label-sm { color: var(--color-on-surface-variant); }
.on-checkout-page__rating-banner {
display: flex;
flex-direction: column;
gap: 12px;
padding: 24px 28px;
background: var(--color-surface-container-low);
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
margin-bottom: 32px;
}
.on-checkout-page__rating-strip {
display: flex;
align-items: center;
gap: 14px;
flex-wrap: wrap;
}
.on-checkout-page__stars {
display: flex;
align-items: center;
gap: 4px;
color: var(--color-secondary);
}
.on-checkout-page__rating-copy {
max-width: 720px;
color: var(--color-on-surface-variant);
}
.on-checkout-testimonials {
margin-top: 48px;
padding: 32px 0;
}
.on-checkout-testimonials__intro {
text-align: center;
max-width: 760px;
margin: 0 auto 32px;
}
.on-checkout-testimonials__intro .headline-lg {
margin-bottom: 14px;
}
.on-checkout-testimonials__intro .body-lg {
color: var(--color-on-surface-variant);
}
.on-checkout-testimonials__grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 20px;
}
.on-checkout-testimonial-card {
background: var(--color-surface-container-lowest);
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
padding: 28px;
display: flex;
flex-direction: column;
gap: 20px;
transition: transform 0.2s, border-color 0.2s;
}
.on-checkout-testimonial-card:hover {
border-color: var(--color-primary);
transform: translateY(-2px);
}
.on-checkout-testimonial-card__stars {
display: flex;
gap: 3px;
color: var(--color-secondary);
}
.on-checkout-testimonial-card__copy {
color: var(--color-on-surface-variant);
line-height: 1.8;
}
.on-checkout-testimonial-card__meta {
display: flex;
flex-direction: column;
gap: 4px;
color: var(--color-on-surface);
}
.on-checkout-testimonial-card__meta .label-md {
font-weight: 700;
}
.on-checkout-testimonial-card__meta .label-sm {
color: var(--color-on-surface-variant);
}
@media (max-width: 1000px) {
.on-checkout-testimonials__grid { grid-template-columns: 1fr; }
}
padding-block: 24px 28px !important;
}
} .on-product-eyebrow-row {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 16px;
}
.on-product-eyebrow {
color: var(--color-secondary);
font-weight: 700;
letter-spacing: 0.1em;
}
.on-product-badge {
display: inline-block;
padding: 4px 14px;
background: var(--color-secondary-container);
color: var(--color-secondary);
border-radius: var(--radius-full);
font-size: var(--text-label-sm);
font-weight: 700;
letter-spacing: 0.04em;
margin-left: 10px;  
}
.on-product-trust-list {
display: flex;
flex-direction: column;
gap: 12px;
padding-top: 28px;
padding-bottom: 28px;
border-top: 1px solid var(--color-outline-variant);
list-style: none;
}
.on-product-trust-item {
display: flex;
align-items: center;
gap: 12px;
color: var(--color-on-surface-variant);
}
.on-product-trust-item .material-symbols-outlined {
font-size: 20px;
color: var(--color-primary);
flex-shrink: 0;
font-variation-settings: 'FILL' 0, 'wght' 300;
}
.on-ritual-note {
display: flex;
gap: 24px;
align-items: flex-start;
background: var(--color-primary-fixed);
border-left: 4px solid var(--color-primary);
border-radius: var(--radius-lg);
padding: 28px 32px;
}
.on-ritual-note__icon .material-symbols-outlined {
font-size: 28px;
color: var(--color-primary);
font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 48;
margin-top: 2px;
}
.on-ritual-note__content {
font-size: var(--text-body-lg);
color: var(--color-on-surface);
line-height: 1.7;
}
.on-ritual-note__content p { margin-bottom: 12px; }
.on-ritual-note__content p:last-child { margin-bottom: 0; }  .on-account-page {
padding-block: 64px 96px;
} .on-account-page .on-page-header {
margin-bottom: 48px;
} .woocommerce-account:not(.logged-in) .woocommerce,
.on-account-auth-wrap {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 48px;
align-items: start;
} .woocommerce-account:not(.logged-in) .woocommerce > form:only-child {
grid-column: 1 / -1;
max-width: 520px;
margin-inline: auto;
} .woocommerce-form-login,
.woocommerce-form-register,
.woocommerce-ResetPassword {
background: var(--color-surface-container-lowest);
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
padding: 48px;
}
.woocommerce-form-login h2,
.woocommerce-form-register h2,
.woocommerce-ResetPassword h2 {
font-family: var(--font-headline);
font-size: var(--text-headline-md);
font-weight: 600;
color: var(--color-primary);
margin-bottom: 8px;
} .woocommerce-form-login > p,
.woocommerce-form-register > p,
.woocommerce-ResetPassword > p {
font-size: var(--text-body-md);
color: var(--color-on-surface-variant);
margin-bottom: 32px;
line-height: 1.6;
} .woocommerce-form-login .form-row,
.woocommerce-form-register .form-row,
.woocommerce-ResetPassword .form-row,
.woocommerce-EditAccountForm .form-row,
.woocommerce-address-fields .form-row,
.edit-account .form-row {
display: flex;
flex-direction: column;
gap: 6px;
margin-bottom: 20px;
} .woocommerce-form-login .form-row-first,
.woocommerce-form-register .form-row-first,
.woocommerce-EditAccountForm .form-row-first,
.woocommerce-address-fields .form-row-first,
.edit-account .form-row-first {
float: left;
width: calc(50% - 12px);
clear: left;
}
.woocommerce-form-login .form-row-last,
.woocommerce-form-register .form-row-last,
.woocommerce-EditAccountForm .form-row-last,
.woocommerce-address-fields .form-row-last,
.edit-account .form-row-last {
float: right;
width: calc(50% - 12px);
}
.woocommerce-form-login .form-row-wide,
.woocommerce-form-register .form-row-wide,
.woocommerce-EditAccountForm .form-row-wide,
.woocommerce-address-fields .form-row-wide,
.edit-account .form-row-wide {
clear: both;
width: 100%;
} .woocommerce-form-login::after,
.woocommerce-form-register::after,
.woocommerce-EditAccountForm::after,
.woocommerce-address-fields .woocommerce-billing-fields::after,
.woocommerce-address-fields .woocommerce-shipping-fields::after,
.edit-account::after {
content: '';
display: table;
clear: both;
} .woocommerce-form-login label,
.woocommerce-form-register label,
.woocommerce-ResetPassword label,
.woocommerce-EditAccountForm label,
.woocommerce-address-fields label,
.edit-account label {
font-size: var(--text-label-sm);
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.05em;
color: var(--color-on-surface);
}
.woocommerce-form-login label .required,
.woocommerce-form-register label .required,
.woocommerce-EditAccountForm label .required,
.woocommerce-address-fields label .required {
color: var(--color-error);
margin-left: 2px;
} .woocommerce-form-login input[type="text"],
.woocommerce-form-login input[type="email"],
.woocommerce-form-login input[type="password"],
.woocommerce-form-register input[type="text"],
.woocommerce-form-register input[type="email"],
.woocommerce-form-register input[type="password"],
.woocommerce-ResetPassword input[type="text"],
.woocommerce-ResetPassword input[type="email"],
.woocommerce-EditAccountForm input[type="text"],
.woocommerce-EditAccountForm input[type="email"],
.woocommerce-EditAccountForm input[type="password"],
.woocommerce-EditAccountForm input[type="tel"],
.woocommerce-address-fields input[type="text"],
.woocommerce-address-fields input[type="email"],
.woocommerce-address-fields input[type="tel"],
.woocommerce-address-fields input[type="password"],
.woocommerce-address-fields select,
.woocommerce-address-fields textarea,
.edit-account input[type="text"],
.edit-account input[type="email"],
.edit-account input[type="password"],
.edit-account input[type="tel"],
.edit-account select,
.edit-account textarea {
width: 100%;
padding: 14px 18px;
border: 1.5px solid var(--color-outline-variant);
border-radius: var(--radius-md);
background: var(--color-surface-container-low);
font-family: var(--font-body);
font-size: var(--text-body-md);
color: var(--color-on-surface);
outline: none;
transition: border-color 0.2s, box-shadow 0.2s;
appearance: none;
-webkit-appearance: none;
}
.woocommerce-form-login input:focus,
.woocommerce-form-register input:focus,
.woocommerce-ResetPassword input:focus,
.woocommerce-EditAccountForm input:focus,
.woocommerce-EditAccountForm select:focus,
.woocommerce-address-fields input:focus,
.woocommerce-address-fields select:focus,
.woocommerce-address-fields textarea:focus,
.edit-account input:focus,
.edit-account select:focus,
.edit-account textarea:focus {
border-color: var(--color-primary);
box-shadow: 0 0 0 3px rgba(14, 59, 47, 0.08);
background: var(--color-surface-container-lowest);
} .woocommerce-address-fields select,
.edit-account select,
.woocommerce-EditAccountForm select {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23414845' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 16px center;
padding-right: 44px;
} .woocommerce-password-strength {
display: block;
padding: 8px 14px;
border-radius: var(--radius-sm);
font-size: var(--text-label-sm);
font-weight: 600;
letter-spacing: 0.04em;
margin-top: 6px;
}
.woocommerce-password-strength.strong   { background: #d1fae5; color: #065f46; }
.woocommerce-password-strength.good     { background: #fef9c3; color: #854d0e; }
.woocommerce-password-strength.short,
.woocommerce-password-strength.bad      { background: var(--color-error-container); color: var(--color-error); }
.woocommerce-password-hint {
font-size: var(--text-label-sm);
color: var(--color-on-surface-variant);
margin-top: 4px;
display: block;
} .woocommerce-form-login__rememberme,
.woocommerce-form__label-for-checkbox {
display: flex !important;
align-items: center;
gap: 10px;
font-size: var(--text-body-md) !important;
font-weight: 400 !important;
text-transform: none !important;
letter-spacing: 0 !important;
color: var(--color-on-surface-variant);
cursor: pointer;
}
.woocommerce-form-login__rememberme input[type="checkbox"],
.woocommerce-form__label-for-checkbox input[type="checkbox"] {
width: 18px;
height: 18px;
accent-color: var(--color-primary);
cursor: pointer;
flex-shrink: 0;
} .woocommerce-form-login .woocommerce-button,
.woocommerce-form-login button[type="submit"],
.woocommerce-form-login input[type="submit"],
.woocommerce-form-register .woocommerce-button,
.woocommerce-form-register button[type="submit"],
.woocommerce-form-register input[type="submit"],
.woocommerce-ResetPassword button[type="submit"],
.woocommerce-ResetPassword input[type="submit"],
.woocommerce-EditAccountForm button[type="submit"],
.woocommerce-EditAccountForm input[type="submit"],
.woocommerce-address-fields button[type="submit"],
.woocommerce-address-fields input[type="submit"],
.edit-account button[type="submit"],
.edit-account input[type="submit"],
button.woocommerce-Button,
input.woocommerce-Button {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 16px 36px;
background: var(--color-primary);
color: var(--color-on-primary);
border: 2px solid var(--color-primary);
border-radius: var(--radius-md);
font-family: var(--font-body);
font-size: var(--text-body-md);
font-weight: 600;
cursor: pointer;
transition: opacity 0.2s, transform 0.2s;
text-decoration: none;
}
.woocommerce-form-login .woocommerce-button:hover,
.woocommerce-form-login button[type="submit"]:hover,
.woocommerce-form-register button[type="submit"]:hover,
.woocommerce-ResetPassword button[type="submit"]:hover,
.woocommerce-EditAccountForm button[type="submit"]:hover,
.woocommerce-address-fields button[type="submit"]:hover,
.edit-account button[type="submit"]:hover {
opacity: 0.88;
transform: translateY(-1px);
} .woocommerce-LostPassword,
.woocommerce-form-login .lost_password {
font-size: var(--text-body-md);
color: var(--color-on-surface-variant);
margin-top: 16px;
}
.woocommerce-LostPassword a,
.woocommerce-form-login .lost_password a {
color: var(--color-primary);
text-decoration: underline;
text-underline-offset: 3px;
font-weight: 500;
}
.woocommerce-LostPassword a:hover,
.woocommerce-form-login .lost_password a:hover {
color: var(--color-secondary);
} .woocommerce-error,
.woocommerce-info,
.woocommerce-message {
display: flex;
align-items: flex-start;
gap: 12px;
padding: 16px 20px;
border-radius: var(--radius-md);
font-size: var(--text-body-md);
list-style: none;
margin-bottom: 24px;
}
.woocommerce-error   { background: var(--color-error-container);  color: var(--color-error);   border-left: 4px solid var(--color-error); }
.woocommerce-info    { background: var(--color-primary-fixed);     color: var(--color-primary); border-left: 4px solid var(--color-primary); }
.woocommerce-message { background: #d1fae5;                        color: #065f46;              border-left: 4px solid #10b981; }
.woocommerce-error li,
.woocommerce-info li,
.woocommerce-message li { list-style: none; }
.woocommerce-error a,
.woocommerce-info a,
.woocommerce-message a {
font-weight: 600;
text-decoration: underline;
text-underline-offset: 3px;
color: inherit;
} .woocommerce-account.logged-in .woocommerce {
display: grid;
grid-template-columns: 260px 1fr;
gap: 48px;
align-items: start;
} .woocommerce-MyAccount-navigation {
background: var(--color-surface-container-lowest);
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
overflow: hidden;
position: sticky;
top: 96px;
}
.woocommerce-MyAccount-navigation ul {
list-style: none;
padding: 0;
margin: 0;
}
.woocommerce-MyAccount-navigation ul li {
border-bottom: 1px solid var(--color-outline-variant);
}
.woocommerce-MyAccount-navigation ul li:last-child {
border-bottom: none;
}
.woocommerce-MyAccount-navigation ul li a {
display: flex;
align-items: center;
gap: 12px;
padding: 16px 24px;
font-size: var(--text-body-md);
font-weight: 500;
color: var(--color-on-surface-variant);
transition: background 0.2s, color 0.2s, padding-left 0.2s;
}
.woocommerce-MyAccount-navigation ul li a:hover {
background: var(--color-surface-container);
color: var(--color-primary);
padding-left: 30px;
}
.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li a[class*="active"] {
background: var(--color-primary-fixed);
color: var(--color-primary);
font-weight: 600;
border-left: 3px solid var(--color-primary);
} .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout a {
color: var(--color-error);
}
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout a:hover {
background: var(--color-error-container);
color: var(--color-error);
} .woocommerce-MyAccount-content {
min-width: 0;
} .woocommerce-MyAccount-content > p:first-child {
font-size: var(--text-body-lg);
color: var(--color-on-surface-variant);
margin-bottom: 32px;
padding-bottom: 24px;
border-bottom: 1px solid var(--color-outline-variant);
}
.woocommerce-MyAccount-content > p:first-child strong {
color: var(--color-primary);
font-weight: 600;
}
.woocommerce-MyAccount-content > p:first-child a {
color: var(--color-secondary);
font-weight: 600;
text-decoration: underline;
text-underline-offset: 3px;
} .woocommerce-MyAccount-content h2,
.woocommerce-column__title,
.woocommerce-Address-title h3 {
font-family: var(--font-headline);
font-size: var(--text-headline-md);
font-weight: 600;
color: var(--color-primary);
margin-bottom: 20px;
padding-bottom: 16px;
border-bottom: 1px solid var(--color-outline-variant);
}
.woocommerce-Address-title {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 12px;
}
.woocommerce-Address-title a {
font-size: var(--text-label-sm);
font-weight: 600;
letter-spacing: 0.05em;
text-transform: uppercase;
color: var(--color-primary);
text-decoration: underline;
text-underline-offset: 3px;
}
.woocommerce-Address-title a:hover { color: var(--color-secondary); } .woocommerce-orders-table,
.woocommerce-MyAccount-content table.shop_table {
width: 100%;
border-collapse: collapse;
border-radius: var(--radius-xl);
overflow: hidden;
border: 1px solid var(--color-outline-variant);
font-size: var(--text-body-md);
margin-bottom: 32px;
}
.woocommerce-orders-table thead,
.woocommerce-MyAccount-content table.shop_table thead {
background: var(--color-primary);
}
.woocommerce-orders-table thead th,
.woocommerce-MyAccount-content table.shop_table thead th {
padding: 16px 20px;
font-size: var(--text-label-sm);
font-weight: 600;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--color-on-primary);
text-align: left;
border: none;
}
.woocommerce-orders-table tbody tr,
.woocommerce-MyAccount-content table.shop_table tbody tr {
border-bottom: 1px solid var(--color-surface-variant);
transition: background 0.15s;
}
.woocommerce-orders-table tbody tr:last-child,
.woocommerce-MyAccount-content table.shop_table tbody tr:last-child {
border-bottom: none;
}
.woocommerce-orders-table tbody tr:hover,
.woocommerce-MyAccount-content table.shop_table tbody tr:hover {
background: var(--color-surface-container);
}
.woocommerce-orders-table tbody td,
.woocommerce-MyAccount-content table.shop_table tbody td {
padding: 16px 20px;
vertical-align: middle;
color: var(--color-on-surface);
} .woocommerce-orders-table__cell-order-status mark,
mark.order-status {
display: inline-flex;
align-items: center;
padding: 4px 12px;
border-radius: var(--radius-full);
font-size: var(--text-label-sm);
font-weight: 700;
letter-spacing: 0.04em;
background: transparent;
}
mark.order-status.status-completed,
mark.status-completed  { background: #d1fae5; color: #065f46; }
mark.order-status.status-processing,
mark.status-processing { background: var(--color-primary-fixed); color: var(--color-primary); }
mark.order-status.status-on-hold,
mark.status-on-hold    { background: var(--color-secondary-container); color: var(--color-secondary); }
mark.order-status.status-cancelled,
mark.status-cancelled  { background: var(--color-error-container); color: var(--color-error); }
mark.order-status.status-refunded,
mark.status-refunded   { background: var(--color-surface-container-high); color: var(--color-on-surface-variant); }
mark.order-status.status-pending,
mark.status-pending    { background: var(--color-tertiary-container); color: #fff; }
mark.order-status.status-failed,
mark.status-failed     { background: var(--color-error-container); color: var(--color-error); } .woocommerce-orders-table__cell-order-actions .woocommerce-button,
.woocommerce-orders-table__cell-order-actions a,
.woocommerce-MyAccount-content .button {
display: inline-flex;
align-items: center;
padding: 8px 20px;
background: transparent;
color: var(--color-primary);
border: 1.5px solid var(--color-primary);
border-radius: var(--radius-md);
font-size: var(--text-label-sm);
font-weight: 600;
letter-spacing: 0.04em;
text-transform: uppercase;
transition: background 0.2s, color 0.2s;
text-decoration: none;
gap: 6px;
}
.woocommerce-orders-table__cell-order-actions .woocommerce-button:hover,
.woocommerce-orders-table__cell-order-actions a:hover,
.woocommerce-MyAccount-content .button:hover {
background: var(--color-primary);
color: var(--color-on-primary);
} .woocommerce-MyAccount-content .woocommerce-message {
font-size: var(--text-body-lg);
} .woocommerce-Addresses,
.woocommerce-MyAccount-content .woocommerce-Addresses {
display: block;
gap: 32px;
margin-bottom: 40px;
}
.woocommerce-info::before {
left: 2px !important;
display:none;
}
.woocommerce div.product form.cart .button, .woocommerce #payment #place_order, .woocommerce-page #payment #place_order, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button.alt:hover {
background: var(--color-primary);
color: var(--color-on-primary);
border: 2px solid var(--color-primary);
}
#add_payment_method .wc-proceed-to-checkout a.checkout-button, .woocommerce-cart .wc-proceed-to-checkout a.checkout-button, .woocommerce-checkout .wc-proceed-to-checkout a.checkout-button{
background: var(--color-primary);
color: var(--color-on-primary);
border: 2px solid var(--color-primary);   
}
.woocommerce-MyAccount-navigation-link::before{
display: none !important;
}
.woocommerce-MyAccount-navigation-link{
padding-left: 0px !important;
}
.woocommerce-Address {
background: var(--color-surface-container-lowest);
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
padding: 32px;
transition: border-color 0.2s;
}
.woocommerce-Address:hover {
border-color: var(--color-primary-container);
}
.woocommerce-Address address {
font-style: normal;
font-size: var(--text-body-md);
color: var(--color-on-surface-variant);
line-height: 1.8;
} .woocommerce-address-fields {
background: var(--color-surface-container-lowest);
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
padding: 48px;
}
.woocommerce-address-fields h3 {
font-family: var(--font-headline);
font-size: var(--text-headline-md);
font-weight: 600;
color: var(--color-primary);
margin-bottom: 8px;
}
.woocommerce-address-fields > p {
color: var(--color-on-surface-variant);
margin-bottom: 32px;
}
.woocommerce-address-fields .woocommerce-billing-fields__field-wrapper,
.woocommerce-address-fields .woocommerce-shipping-fields__field-wrapper { }
.woocommerce-address-fields .woocommerce-billing-fields__field-wrapper::after,
.woocommerce-address-fields .woocommerce-shipping-fields__field-wrapper::after {
content: '';
display: table;
clear: both;
} .woocommerce-EditAccountForm,
.edit-account {
background: var(--color-surface-container-lowest);
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
padding: 48px;
}
.woocommerce-EditAccountForm fieldset,
.edit-account fieldset {
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-lg);
padding: 28px 32px;
margin: 32px 0 24px;
}
.woocommerce-EditAccountForm fieldset legend,
.edit-account fieldset legend {
font-family: var(--font-headline);
font-size: var(--text-body-md);
font-weight: 600;
color: var(--color-primary);
padding-inline: 12px;
}
.woocommerce-EditAccountForm .woocommerce-form-row,
.edit-account .woocommerce-form-row {
margin-bottom: 20px;
} .woocommerce-EditAccountForm .woocommerce-form-row span em,
.edit-account .woocommerce-form-row span em {
font-size: var(--text-label-sm);
color: var(--color-on-surface-variant);
font-style: normal;
} .woocommerce-EditAccountForm .woocommerce-Button--primary,
.edit-account .woocommerce-Button--primary,
.woocommerce-EditAccountForm button[name="save_account_details"],
.edit-account button[name="save_account_details"] {
margin-top: 8px;
} .woocommerce-order-details,
.woocommerce-customer-details {
margin-bottom: 40px;
}
.woocommerce-order-details h2,
.woocommerce-customer-details h2 {
font-family: var(--font-headline);
font-size: 20px;
font-weight: 600;
color: var(--color-primary);
margin-bottom: 16px;
padding-bottom: 12px;
border-bottom: 1px solid var(--color-outline-variant);
} .woocommerce-order-details .woocommerce-table--order-details {
width: 100%;
border-collapse: collapse;
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
overflow: hidden;
margin-bottom: 0;
font-size: var(--text-body-md);
}
.woocommerce-order-details .woocommerce-table--order-details thead th {
background: var(--color-primary);
color: var(--color-on-primary);
padding: 14px 20px;
font-size: var(--text-label-sm);
font-weight: 600;
letter-spacing: 0.06em;
text-transform: uppercase;
text-align: left;
}
.woocommerce-order-details .woocommerce-table--order-details tbody td,
.woocommerce-order-details .woocommerce-table--order-details tfoot th,
.woocommerce-order-details .woocommerce-table--order-details tfoot td {
padding: 14px 20px;
border-bottom: 1px solid var(--color-surface-variant);
vertical-align: middle;
}
.woocommerce-order-details .woocommerce-table--order-details tfoot tr:last-child th,
.woocommerce-order-details .woocommerce-table--order-details tfoot tr:last-child td {
font-weight: 700;
color: var(--color-primary);
font-size: var(--text-body-lg);
border-bottom: none;
}
.woocommerce-order-details .woocommerce-table--order-details tbody td:last-child,
.woocommerce-order-details .woocommerce-table--order-details tfoot td {
text-align: right;
font-weight: 600;
} .woocommerce-order-details .woocommerce-table__product-table img {
width: 56px;
height: 56px;
object-fit: cover;
border-radius: var(--radius-md);
border: 1px solid var(--color-outline-variant);
margin-right: 12px;
vertical-align: middle;
} .woocommerce-customer-details .woocommerce-columns {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 24px;
}
.woocommerce-customer-details address {
font-style: normal;
font-size: var(--text-body-md);
color: var(--color-on-surface-variant);
line-height: 1.8;
background: var(--color-surface-container-lowest);
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-lg);
padding: 24px;
} .woocommerce-MyAccount-downloads table {
width: 100%;
border-collapse: collapse;
border: 1px solid var(--color-outline-variant);
border-radius: var(--radius-xl);
overflow: hidden;
font-size: var(--text-body-md);
}
.woocommerce-MyAccount-downloads table thead th {
background: var(--color-primary);
color: var(--color-on-primary);
padding: 14px 20px;
font-size: var(--text-label-sm);
font-weight: 600;
letter-spacing: 0.06em;
text-transform: uppercase;
text-align: left;
}
.woocommerce-MyAccount-downloads table tbody td {
padding: 14px 20px;
border-bottom: 1px solid var(--color-surface-variant);
vertical-align: middle;
} .woocommerce-ResetPassword {
max-width: 520px;
margin-inline: auto;
} .woocommerce-ResetPassword + .woocommerce-LostPassword {
text-align: center;
margin-top: 24px;
font-size: var(--text-body-md);
color: var(--color-on-surface-variant);
} @media (max-width: 900px) {
.woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1 {
float: left;
width: 100% !important;
text-align: left;
}
.woocommerce .col2-set .col-2, .woocommerce-page .col2-set .col-2 {
float: right;
width: 100% !important;
} .woocommerce-account:not(.logged-in) .woocommerce,
.on-account-auth-wrap {
grid-template-columns: 1fr;
}
.woocommerce-account:not(.logged-in) .woocommerce > form:only-child {
max-width: 100%;
} .woocommerce-account.logged-in .woocommerce {
grid-template-columns: 1fr;
}
.woocommerce-MyAccount-navigation {
position: static;
} .woocommerce-MyAccount-navigation ul {
display: flex;
overflow-x: auto;
scrollbar-width: none;
border-bottom: 1px solid var(--color-outline-variant);
}
.woocommerce-MyAccount-navigation ul::-webkit-scrollbar { display: none; }
.woocommerce-MyAccount-navigation ul li {
flex: none;
border-bottom: none;
border-right: 1px solid var(--color-outline-variant);
}
.woocommerce-MyAccount-navigation ul li a { white-space: nowrap; } .woocommerce-Addresses { grid-template-columns: 1fr; } .woocommerce-customer-details .woocommerce-columns { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
.woocommerce-form-login,
.woocommerce-form-register,
.woocommerce-ResetPassword,
.woocommerce-address-fields,
.woocommerce-EditAccountForm,
.edit-account { padding: 28px 20px; } .woocommerce-form-login .form-row-first,
.woocommerce-form-login .form-row-last,
.woocommerce-form-register .form-row-first,
.woocommerce-form-register .form-row-last,
.woocommerce-EditAccountForm .form-row-first,
.woocommerce-EditAccountForm .form-row-last,
.woocommerce-address-fields .form-row-first,
.woocommerce-address-fields .form-row-last,
.edit-account .form-row-first,
.edit-account .form-row-last {
float: none;
width: 100%;
} .woocommerce-orders-table,
.woocommerce-MyAccount-content table.shop_table,
.woocommerce-order-details .woocommerce-table--order-details {
display: block;
overflow-x: auto;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
}
.woocommerce-EditAccountForm fieldset,
.edit-account fieldset { padding: 20px 16px; }
}
.woocommerce-account:not(.logged-in) .woocommerce, .on-account-auth-wrap {
display: block !important;
}
.woocommerce-account.logged-in .woocommerce {
display: block !important;
}  .entry-content {
color: var(--color-on-surface);
font-family: var(--font-body);
font-size: var(--text-body-lg); line-height: 1.8;
max-width: 100%; } .entry-content > * + * {
margin-top: 1.5em;
}  .entry-content h3 {
font-family: var(--font-headline);
font-size: clamp(18px, 2vw, 24px);
font-weight: 600;
line-height: 1.3;
letter-spacing: -0.01em;
color: var(--color-primary);
margin-top: 2em;
margin-bottom: 0.5em;
}
.select2-container .select2-selection--single .select2-selection__rendered{
padding: 0px !important;
}
button#place_order {
width: 100%;
margin: 10px !important;
} .entry-content h4 {
font-family: var(--font-headline);
font-size: 18px;
font-weight: 600;
line-height: 1.4;
color: var(--color-primary);
margin-top: 1.75em;
margin-bottom: 0.4em;
} .entry-content h5 {
font-family: var(--font-body);
font-size: var(--text-label-sm); font-weight: 700;
line-height: 1.4;
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--color-secondary); margin-top: 1.75em;
margin-bottom: 0.4em;
} .entry-content h6 {
font-family: var(--font-body);
font-size: var(--text-label-sm);
font-weight: 600;
line-height: 1.4;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--color-on-surface-variant);
margin-top: 1.75em;
margin-bottom: 0.4em;
} .entry-content > h1:first-child,
.entry-content > h2:first-child,
.entry-content > h3:first-child,
.entry-content > h4:first-child,
.entry-content > h5:first-child,
.entry-content > h6:first-child {
margin-top: 0;
} .entry-content p {
margin-top: 0;
margin-bottom: 0; color: var(--color-on-surface-variant);
hanging-punctuation: first last; } .entry-content > p:first-of-type {
font-size: var(--text-body-lg);
color: var(--color-on-surface);
font-weight: 400;
line-height: 1.75;
} .entry-content a {
color: var(--color-primary);
text-decoration-thickness: 1.5px;
font-weight: 500;
transition: color 0.2s, text-decoration-color 0.2s;
}
.entry-content a:hover {
color: var(--color-secondary);
text-decoration-color: var(--color-secondary-fixed-dim);
} .entry-content strong,
.entry-content b {
font-weight: 700;
color: var(--color-on-surface); } .entry-content em,
.entry-content i {
font-style: italic;
color: inherit;
} .entry-content em.scientific {
font-style: italic;
color: var(--color-on-surface-variant);
font-size: 0.9em;
} .entry-content small {
font-size: var(--text-label-sm);
color: var(--color-on-surface-variant);
line-height: 1.6;
} .entry-content mark {
background: var(--color-secondary-container); color: var(--color-secondary);
border-radius: 2px;
padding: 0 3px;
} .entry-content sup,
.entry-content sub {
font-size: 0.7em;
line-height: 0;
position: relative;
vertical-align: baseline;
}
.entry-content sup { top: -0.5em; }
.entry-content sub { bottom: -0.3em; } .entry-content abbr[title] {
text-decoration: underline dotted var(--color-outline);
text-underline-offset: 3px;
cursor: help;
} .entry-content ul {
list-style: none;
padding-left: 0;
margin-top: 0;
margin-bottom: 0;
display: flex;
flex-direction: column;
gap: 10px;
}
.entry-content ul li {
padding-left: 1.75em;
position: relative;
color: var(--color-on-surface-variant);
line-height: 1.7;
}  .entry-content ul ul {
margin-top: 8px;
padding-left: 1.25em;
gap: 6px;
}
.entry-content ul ul li::before {
width: 6px;
height: 6px;
background: transparent;
border-color: var(--color-on-surface-variant);
} .entry-content ol {
list-style: none;
padding-left: 0;
margin-top: 0;
margin-bottom: 0;
counter-reset: on-list;
display: flex;
flex-direction: column;
gap: 12px;
}
.entry-content ol li {
padding-left: 2.5em;
position: relative;
color: var(--color-on-surface-variant);
line-height: 1.7;
counter-increment: on-list;
}
.entry-content ol li::before {
content: counter(on-list);
position: absolute;
left: 0;
top: 0.05em;
width: 1.75em;
height: 1.75em;
background: var(--color-primary);
color: var(--color-on-primary);
border-radius: 50%;
font-family: var(--font-headline);
font-size: 11px;
font-weight: 700;
display: flex;
align-items: center;
justify-content: center;
line-height: 1;
flex-shrink: 0;
} .entry-content ol ol {
margin-top: 8px;
padding-left: 1em;
gap: 8px;
}
.entry-content ol ol li::before {
background: var(--color-primary-container);
font-size: 10px;
} .entry-content dl {
margin: 0;
}
.entry-content dt {
font-family: var(--font-headline);
font-size: var(--text-body-md);
font-weight: 600;
color: var(--color-primary);
margin-top: 1.25em;
}
.entry-content dt:first-child {
margin-top: 0;
}
.entry-content dd {
margin-left: 0;
padding-left: 1.5em;
border-left: 3px solid var(--color-primary-fixed);
color: var(--color-on-surface-variant);
font-size: var(--text-body-md);
line-height: 1.7;
margin-top: 4px;
} .entry-content blockquote {
margin: 0;
padding: 32px 40px;
background: var(--color-surface-container);
border-left: 4px solid var(--color-primary);
border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
position: relative;
} .entry-content blockquote::before {
content: '\201C'; font-family: var(--font-headline);
font-size: 72px;
font-weight: 700;
line-height: 1;
color: var(--color-primary-fixed-dim);
position: absolute;
top: 12px;
left: 16px;
pointer-events: none;
}
.entry-content blockquote p {
font-family: var(--font-headline);
font-size: clamp(17px, 2vw, 20px);
font-weight: 500;
line-height: 1.65;
color: var(--color-primary);
font-style: italic;
margin-top: 0;
padding-top: 28px; }
.entry-content blockquote cite,
.entry-content blockquote footer {
display: block;
margin-top: 16px;
font-size: var(--text-label-sm);
font-weight: 600;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--color-on-surface-variant);
font-style: normal;
}
.entry-content blockquote cite::before {
content: '— ';
} .entry-content .wp-block-pullquote {
border-top: 4px solid var(--color-primary);
border-bottom: 4px solid var(--color-primary);
padding: 32px 0;
text-align: center;
background: transparent;
}
.entry-content .wp-block-pullquote blockquote {
background: transparent;
border: none;
border-radius: 0;
padding: 0;
}
.entry-content .wp-block-pullquote blockquote::before { display: none; }
.entry-content .wp-block-pullquote blockquote p {
font-size: clamp(20px, 2.5vw, 28px);
font-weight: 700;
font-style: italic;
color: var(--color-primary);
padding-top: 0;
}
.entry-content .wp-block-pullquote cite {
display: block;
margin-top: 12px;
} .entry-content hr {
border: none;
height: 1px;
background: linear-gradient(
to right,
transparent 0%,
var(--color-primary-fixed-dim) 20%,
var(--color-primary-fixed-dim) 80%,
transparent 100%
);
margin-block: 2.5em;
} .entry-content table {
width: 100%;
border-collapse: collapse;
font-size: var(--text-body-md);
line-height: 1.6;
border-radius: var(--radius-xl);
overflow: hidden;
border: 1px solid var(--color-outline-variant);
}
.entry-content thead {
background: var(--color-primary);
}
.entry-content thead th {
padding: 14px 20px;
font-family: var(--font-body);
font-size: var(--text-label-sm);
font-weight: 700;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--color-on-primary);
text-align: left;
border: none;
}
.entry-content tbody tr {
border-bottom: 1px solid var(--color-surface-variant);
transition: background 0.15s;
}
.entry-content tbody tr:last-child {
border-bottom: none;
}
.entry-content tbody tr:nth-child(even) {
background: var(--color-surface-container);
}
.entry-content tbody tr:hover {
background: var(--color-primary-fixed);
}
.entry-content tbody td,
.entry-content tfoot td,
.entry-content tfoot th {
padding: 13px 20px;
vertical-align: middle;
color: var(--color-on-surface-variant);
}
.entry-content tfoot {
border-top: 2px solid var(--color-outline-variant);
}
.entry-content tfoot td,
.entry-content tfoot th {
font-weight: 700;
color: var(--color-on-surface);
} .entry-content .wp-block-table,
.entry-content figure.wp-block-table {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
} .entry-content code {
font-family: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace;
font-size: 0.875em;
background: var(--color-surface-container-high);
color: var(--color-primary);
padding: 2px 7px;
border-radius: var(--radius-sm);
border: 1px solid var(--color-outline-variant);
white-space: nowrap;
} .entry-content pre {
font-family: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace;
font-size: var(--text-label-sm);
background: var(--color-inverse-surface);
color: var(--color-inverse-on-surface);
padding: 28px 32px;
border-radius: var(--radius-lg);
overflow-x: auto;
-webkit-overflow-scrolling: touch;
line-height: 1.7;
tab-size: 4;
}
.entry-content pre code {
background: transparent;
border: none;
padding: 0;
color: inherit;
font-size: inherit;
white-space: pre;
} .entry-content kbd {
font-family: var(--font-body);
font-size: 0.85em;
font-weight: 600;
background: var(--color-surface-container-highest);
color: var(--color-on-surface);
padding: 2px 8px;
border-radius: var(--radius-sm);
border: 1px solid var(--color-outline-variant);
border-bottom-width: 3px;
white-space: nowrap;
} .entry-content figure {
margin: 0;
}
.entry-content figure img {
display: block;
width: 100%;
height: auto;
border-radius: var(--radius-lg);
border: 1px solid var(--color-outline-variant);
}
.entry-content figcaption,
.entry-content .wp-block-image figcaption,
.entry-content .wp-caption-text {
margin-top: 10px;
font-size: var(--text-label-sm);
font-weight: 500;
color: var(--color-on-surface-variant);
text-align: center;
letter-spacing: 0.02em;
line-height: 1.5;
} .entry-content .alignwide {
margin-left:  -48px;
margin-right: -48px;
}
.entry-content .alignfull {
margin-left:  calc(50% - 50vw);
margin-right: calc(50% - 50vw);
max-width: 100vw;
width: 100vw;
border-radius: 0;
}
.entry-content .alignleft {
float: left;
margin-right: 2em;
margin-bottom: 0.5em;
max-width: 50%;
}
.entry-content .alignright {
float: right;
margin-left: 2em;
margin-bottom: 0.5em;
max-width: 50%;
}
.entry-content .aligncenter {
margin-inline: auto;
text-align: center;
} .entry-content .wp-block-separator {
border: none;
height: 1px;
background: linear-gradient(
to right,
transparent,
var(--color-primary-fixed-dim) 20%,
var(--color-primary-fixed-dim) 80%,
transparent
);
margin-block: 2.5em;
}
.entry-content .wp-block-separator.is-style-wide {
height: 2px;
background: var(--color-primary-fixed);
}
.entry-content .wp-block-separator.is-style-dots {
background: none;
height: auto;
text-align: center;
line-height: 1;
color: var(--color-primary-fixed-dim);
}
.entry-content .wp-block-separator.is-style-dots::before {
content: '· · ·';
font-size: 24px;
letter-spacing: 0.5em;
color: var(--color-primary-fixed-dim);
} @media (max-width: 900px) {
.entry-content {
font-size: var(--text-body-md); }
.entry-content .alignwide {
margin-left: -24px;
margin-right: -24px;
}
.entry-content blockquote {
padding: 24px 28px;
}
}
@media (max-width: 600px) {
.entry-content {
font-size: var(--text-body-md);
}
.entry-content .alignleft,
.entry-content .alignright {
float: none;
max-width: 100%;
margin-inline: 0;
}
.entry-content .alignwide {
margin-left: -20px;
margin-right: -20px;
}
.entry-content blockquote {
padding: 20px 20px 20px 24px;
}
.entry-content blockquote::before {
font-size: 48px;
top: 8px;
left: 10px;
}
.entry-content blockquote p {
padding-top: 20px;
}
.entry-content pre {
padding: 20px;
font-size: 13px;
}
}
.post-navigation { display:none; }
.single-product .flex-control-thumbs {
display: flex !important;
flex-wrap: nowrap !important;
gap: 10px;
overflow-x: auto;
}
.single-product .flex-control-thumbs li {
width: 80px !important;
float: none !important;
flex: 0 0 80px;
}  .woocommerce-checkout .form-row {
margin-bottom: 24px;
} .woocommerce-checkout label {
display: block;
margin-bottom: 8px;
font-size: 12px;
font-weight: 700;
letter-spacing: .06em;
text-transform: uppercase;
color: var(--color-primary);
}
div#on-payment {
display: none;
} .woocommerce-checkout input.input-text,
.woocommerce-checkout textarea,
.woocommerce-checkout select,
.woocommerce-checkout .select2-selection {
width: 100%;
min-height: 58px;
padding: 0px 18px; 
border: 1.5px solid var(--color-outline-variant);
border-radius: 14px;
background: var(--color-surface-container-low);
color: var(--color-on-surface);
font-size: 15px;
transition:
border-color .25s ease,
box-shadow .25s ease,
background-color .25s ease,
transform .2s ease;
} .woocommerce-checkout .select2-container--default .select2-selection--single {
height: 58px;
border-radius: 14px;
border: 1.5px solid var(--color-outline-variant);
background: var(--color-surface-container-low);
}
.woocommerce-checkout .select2-selection__rendered {
line-height: 58px !important;
padding-left: 18px !important;
}
.woocommerce-checkout .select2-selection__arrow {
height: 58px !important;
right: 12px !important;
} .woocommerce-checkout input.input-text:focus,
.woocommerce-checkout textarea:focus,
.woocommerce-checkout select:focus,
.woocommerce-checkout .select2-container--focus .select2-selection,
.woocommerce-checkout .select2-container--open .select2-selection {
border-color: var(--color-primary);
background: #fff;
box-shadow: 0 0 0 4px rgba(14, 59, 47, 0.08);
outline: none;
} .woocommerce-checkout input.input-text:hover,
.woocommerce-checkout textarea:hover,
.woocommerce-checkout .select2-selection:hover {
border-color: var(--color-primary-container);
} .woocommerce-checkout input::placeholder,
.woocommerce-checkout textarea::placeholder {
color: #9ca3af;
} .woocommerce-checkout .required {
color: var(--color-secondary);
font-weight: 700;
} .woocommerce-invalid input,
.woocommerce-invalid select,
.woocommerce-invalid .select2-selection {
border-color: var(--color-error);
}
.woocommerce-validated input,
.woocommerce-validated .select2-selection {
border-color: #2e7d32;
} .on-checkout-section {
background: #fff;
border: 1px solid var(--color-outline-variant);
border-radius: 24px;
padding: 32px;
box-shadow: 0 8px 24px rgba(14, 59, 47, 0.04);
margin-bottom: 24px;
} .on-checkout-section__title {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 28px;
padding-bottom: 18px;
border-bottom: 1px solid var(--color-surface-variant);
}
.on-checkout-section__title .material-symbols-outlined {
color: var(--color-primary);
font-size: 24px;
} @media (min-width: 768px) {
.woocommerce-checkout .form-row-first,
.woocommerce-checkout .form-row-last {
width: calc(50% - 10px);
}
} @media (max-width: 768px) {
.on-checkout-section {
padding: 24px;
border-radius: 18px;
}
.on-product-summary .product_title {
font-size: clamp(32px, 6vw, 56px) !important;
font-weight: 700;
line-height: 1.25 !important;
}
.woocommerce-checkout input.input-text,
.woocommerce-checkout textarea,
.woocommerce-checkout .select2-selection {
min-height: 54px;
}
}
.woocommerce-message::before { display: none;}
@media (max-width: 768px) {
.woocommerce-message {
display: flex;
flex-direction: column-reverse;
align-items: flex-start;
text-align: center;
}
.woocommerce-message .button.wc-forward {
width: 100%;
margin-top: 10px;
margin-bottom: 0;
text-align: center;
background: var(--color-primary);
color: var(--color-on-primary);
border: 2px solid var(--color-primary);
}
}
.olive-reviews-list{
display:flex;
flex-direction:column;
gap:40px;
}
.olive-review-card{
padding-bottom:32px;
border-bottom:1px solid #e5e5e5;
}
.olive-review-header{
display:flex;
align-items:center;
gap:15px;
margin-bottom:15px;
}
.olive-review-avatar{
width:50px;
height:50px;
border-radius:50%;
object-fit:cover;
}
.olive-review-name{
margin:0;
font-size:16px;
font-weight:600;
color:#0B2D26;
}
.olive-review-date{
font-size:12px;
color:#6F6F6F;
}
.olive-review-rating{
display:flex;
gap:2px;
color:#D4AF37;
margin-bottom:10px;
width: 141px;
float: left;
}
.woocommerce-notices-wrapper { display: none; 
}
.olive-review-title{
font-size:18px;
font-weight:600;
color:#0B2D26;
margin:0 0 10px;
}
.olive-review-verified{
display:flex;
align-items:center;
gap:5px;
color:#D4AF37;
font-size:13px;
margin-bottom:15px;
}
.olive-review-copy{
color:#555;
line-height:1.7;
margin-bottom:20px;
}
.olive-review-photo{
width:130px;
height:130px;
overflow:hidden;
border-radius:8px;
border:1px solid #ddd;
}
.olive-review-photo img{
width:100%;
height:100%;
object-fit:cover;
}
.bg-surface-container {
--tw-bg-opacity: 1;
background-color: rgb(238 238 236 / var(--tw-bg-opacity, 1));
}
.rounded-full {
border-radius: 0.75rem;
}
.text-forest-deep {
--tw-text-opacity: 1;
color: rgb(11 45 38 / var(--tw-text-opacity, 1));
padding: 5px;
}
.font-bold {
font-weight: 700;
}
.items-center {
align-items: center;
}
.review-header{
display:flex;
align-items:center;
gap:20px;
margin-bottom:15px;
}
.review-stars{
display:flex;
gap:2px;
color:#c9a227;
font-size:22px;
line-height:1;
}
.review-title{
margin:0;
color:#0B2D26;
font-size:20px;
font-weight:700;
line-height:1.3;
}
.review-verified{
display:flex;
align-items:center;
gap:8px;
color:#c9a227;
font-size:16px;
font-weight:500;
margin-top:12px;
}
.review-verified .material-symbols-outlined{
font-size:18px;
font-variation-settings: 'FILL' 0;
}
.woocommerce-tabs ul.tabs{
display:flex;
gap:40px;
border-bottom:1px solid #ddd !important;
padding:0 !important;
}
.woocommerce-tabs ul.tabs li{
margin:0 !important;
border:none !important;
background:none !important;
}
.woocommerce-tabs ul.tabs li::before,
.woocommerce-tabs ul.tabs li::after{
display:none !important;
}
.woocommerce-tabs ul.tabs li a{
padding:0 0 15px !important;
color:#666 !important;
font-size:18px;
font-weight:600;
}
.woocommerce-tabs ul.tabs li.active a{
color:#0B2D26 !important;
border-bottom:3px solid #0B2D26;
}
.filled {
font-variation-settings:
'FILL' 1,
'wght' 400,
'GRAD' 0,
'opsz' 24;
}.variations_form .label,li.product-type-variable .label{width:100%;color:#4e4e4e}.variations_form .label .artbees-was-chosen-attribute,li.product-type-variable .label .artbees-was-chosen-attribute{font-weight:300}.variations_form .label .artbees-was-chosen-attribute .no-selection,li.product-type-variable .label .artbees-was-chosen-attribute .no-selection{color:#aaaaab}.variations_form .artbees-was-swatch .artbees-was-content,li.product-type-variable .artbees-was-swatch .artbees-was-content{color:#4e4e4e}.variations_form tr,li.product-type-variable tr{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.variations_form select[name^=attribute_],li.product-type-variable select[name^=attribute_]{display:none!important}.variations_form select.enabled-fields,li.product-type-variable select.enabled-fields{display:block!important}.variations_form .artbees-was-content-image img,li.product-type-variable .artbees-was-content-image img{-o-object-fit:cover;object-fit:cover;-o-object-position:center center;object-position:center center}li.product-type-variable .artbees-was-swatches{margin:10px auto 10px auto}li.product-type-variable .artbees-was-swatches.artbees-was-setting-vertical .artbees-was-swatches-item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;margin:0 auto 10px auto}li.product-type-variable .artbees-was-swatches::before{display:none}li.product-type-variable .artbees-was-swatches::after{display:none}li.product-type-variable .artbees-was-setting-column,li.product-type-variable .artbees-was-setting-horizontal,li.product-type-variable .artbees-was-setting-vertical{padding:1px}li.product-type-variable .artbees-was-setting-column{width:100%;overflow-x:auto}li.product-type-variable .artbees-was-setting-column .artbees-was-swatches-item{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}li.product-type-variable .artbees-was-setting-column.artbees-was-setting-column{display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-item-align:center;align-self:center}li.product-type-variable .artbees-was-setting-horizontal{grid-gap:10px}li.product-type-variable .artbees-was-setting-horizontal .artbees-was-swatches-item{margin:0!important}li.product-type-variable .artbees-was-setting-horizontal .artbees-was-swatches-item:last-child{margin-right:5px}li.product-type-variable .artbees-was-setting-horizontal .artbees-was-swatches-item .artbees-was-radio{padding:0}li.product-type-variable .artbees-was-setting-horizontal .artbees-was-swatches-item .artbees-was-radio::before{margin:0 5px 0 0}li.product-type-variable .artbees-was-setting-horizontal .artbees-was-swatches-item .artbees-was-radio.selected-attribute::after{left:2px;margin-top:0}.artbees-was-swatches-item{display:-webkit-box;display:-ms-flexbox;display:flex;list-style:none}.artbees-was-content img{width:100%!important;max-width:100%!important;height:100%!important;margin:0!important;padding:0!important;border-radius:unset!important;vertical-align:baseline!important}.artbees-was-content{display:-webkit-box;display:-ms-flexbox;display:flex;padding:5px;-webkit-box-shadow:0 0 0 1px #f1f1f1;box-shadow:0 0 0 1px #f1f1f1}.artbees-was-content.selected-attribute{-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.9);box-shadow:0 0 0 1px rgba(0,0,0,.9)}.artbees-was-content a,.artbees-was-content span{display:-webkit-box;display:-ms-flexbox;display:flex}.artbees-was-setting-circle .artbees-was-content{border-radius:100px!important}.artbees-was-setting-circle .artbees-was-content img,.artbees-was-setting-circle .artbees-was-content span{border-radius:100px!important}.artbees-was-setting-circle .artbees-was-content .artbees-was-text.selected-attribute{background-color:#323747;color:#fff}.artbees-was-setting-circle span.artbees-was-text{border-radius:5px!important}.artbees-was-swatches{display:-webkit-box;display:-ms-flexbox;display:flex;padding:0}.artbees-was-content.artbees-was-radio{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-left:0;-webkit-box-shadow:none;box-shadow:none}.artbees-was-content.artbees-was-radio::before{display:block;width:11px;height:11px;margin:2px 5px 0 5px;border:1px solid #4e4e4e;border-radius:100px;content:''}.artbees-was-content.artbees-was-radio.selected-attribute::after{display:block;position:absolute;left:7px;width:7px;height:7px;margin-top:2px;border-radius:100px;background:#4e4e4e;content:''}.artbees-was-swatches-item.hidden-fields{display:none!important}.artbees-was-swatch{display:-webkit-box;display:-ms-flexbox;display:flex}.artbees-was-swatch.artbees-was-swatch-disable{pointer-events:none}.artbees-was-swatch.artbees-was-swatch-disable .artbees-was-content{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative}.artbees-was-swatch.artbees-was-swatch-disable .artbees-was-content::after{position:absolute;top:50%;right:0;bottom:0;left:0;width:50%;min-width:10px;height:1px;-webkit-transform:translate(50%,-50%) rotate(-45deg);transform:translate(50%,-50%) rotate(-45deg);background:#bca4a0!important;content:" "!important}.artbees-was-swatch.artbees-was-swatch-disable .artbees-was-content::before{position:absolute;top:50%;right:0;bottom:0;left:0;width:50%;min-width:10px;height:1px;-webkit-transform:translate(50%,-50%) rotate(45deg);transform:translate(50%,-50%) rotate(45deg);-webkit-transform-origin:center;transform-origin:center;border:0;background:#bca4a0!important;content:" "!important;z-index:9}.artbees-was-swatch.artbees-was-swatch-disable .artbees-was-radio::after{content:none!important}.artbees-was-swatch.artbees-was-swatch-disable .artbees-was-content .artbees-was-radio::before{width:100%;-webkit-transform:none;transform:none}.artbees-was-setting-vertical{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.artbees-was-setting-vertical .artbees-was-swatches-item{margin-bottom:10px}.artbees-was-setting-vertical .artbees-was-swatches-item:last-child{margin-bottom:0}.artbees-was-setting-horizontal{display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important;-ms-flex-wrap:wrap;flex-wrap:wrap}.artbees-was-setting-horizontal .artbees-was-swatches-item{margin-right:5px;margin-bottom:10px;margin-left:5px}.artbees-was-setting-horizontal .artbees-was-swatches-item:last-child{margin-right:0}.artbees-was-setting-column{display:grid!important;width:-webkit-max-content;width:-moz-max-content;width:max-content;grid-gap:10px}.artbees-was-setting-column .artbees-was-content{display:block!important}.artbees-was-setting-column .artbees-was-swatches-item{display:block!important}.artbees-was-setting-column.artbees-was-setting-2{grid-template-columns:repeat(2,1fr)}.artbees-was-setting-column.artbees-was-setting-3{grid-template-columns:repeat(3,1fr)}.artbees-was-setting-column.artbees-was-setting-4{grid-template-columns:repeat(4,1fr)}.artbees-was-setting-column.artbees-was-setting-5{grid-template-columns:repeat(5,1fr)}.artbees-was-setting-column.artbees-was-setting-6{grid-template-columns:repeat(6,1fr)}.artbees-was-setting-column .artbees-was-radio{display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important}.artbees-was-reset-options{margin-bottom:15px;color:#545ecf}.artbees-was-reset-options span{margin-left:10px}.artbees-was-reset-options .reset_variations{font-size:16px!important}.products .artbees-was-setting-horizontal{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.elementor-sticky__spacer .elementor-widget-raven-product-add-to-cart .artbees-was-reset-options .reset_variations,.elementor-sticky__spacer .elementor-widget-woocommerce-product-add-to-cart .artbees-was-reset-options .reset_variations,.elementor-sticky__spacer.elementor-widget-raven-product-add-to-cart .artbees-was-reset-options .reset_variations,.elementor-sticky__spacer.elementor-widget-woocommerce-product-add-to-cart .artbees-was-reset-options .reset_variations,.raven-sticky__spacer .elementor-widget-raven-product-add-to-cart .artbees-was-reset-options .reset_variations,.raven-sticky__spacer .elementor-widget-woocommerce-product-add-to-cart .artbees-was-reset-options .reset_variations,.raven-sticky__spacer.elementor-widget-raven-product-add-to-cart .artbees-was-reset-options .reset_variations,.raven-sticky__spacer.elementor-widget-woocommerce-product-add-to-cart .artbees-was-reset-options .reset_variations{visibility:hidden!important}.slick-slider {
position: relative;
display: block;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list {
position: relative;
display: block;
overflow: hidden;
margin: 0;
padding: 0;
}
.slick-list:focus {
outline: none;
}
.slick-list.dragging {
cursor: pointer;
cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track {
position: relative;
top: 0;
left: 0;
display: block;
margin-left: auto;
margin-right: auto;
}
.slick-track:before,
.slick-track:after {
display: table;
content: "";
}
.slick-track:after {
clear: both;
}
.slick-loading .slick-track {
visibility: hidden;
}
.wpgs-nav .slick-prev:before,
.wpgs-nav .slick-next:before {
font-size: 18px;
}
.wpgs-nav .slick-next {
}
.wpgs-nav .slick-prev {
margin-left: 4px;
}
.wpgs-nav .slick-slide {
margin-left: 5px;
margin-right: 5px;
margin-top: 10px;
}
.wpgs-nav .slick-active img {
opacity: 0.7;
transition: all ease-in 0.3s;
}
.wpgs-nav .slick-current img {
opacity: 1;
}
.wpgs-for .slick-arrow {
position: absolute;
z-index: 1;
cursor: pointer;
top: 50%;
margin-top: -15px;
}
.wpgs .slick-disabled {
display: none;
}
.flaticon-right-arrow {
right: 0;
}
.slick-slide {
float: left;
height: 100%;
min-height: 1px;
cursor: pointer;
}
[dir="rtl"] .slick-slide {
float: right;
}
.slick-slide img {
display: block;
}
.slick-slide.slick-loading img {
display: none;
}
.slick-slide.dragging img {
pointer-events: none;
}
.slick-initialized .slick-slide {
display: block;
}
.slick-loading .slick-slide {
visibility: hidden;
}
.slick-vertical .slick-slide {
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
.wpgs-for,
.wpgs-nav {
display: none;
}
.wpgs-for.slick-initialized,
.wpgs-nav.slick-initialized {
display: block !important;
}
.wpgs-nav .slick-slide {
border: 1px solid;
}
.wpgs-lightbox-icon{
position: relative;
}
.wpgs-lightbox-icon::before {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
display: inline-block;
font-style: normal;
font-variant: normal;
font-weight: normal;
line-height: 1;
z-index:9;
font-weight: 900;
line-height: inherit;
content: url(https://s.w.org/images/core/emoji/14.0.0/svg/1f50d.svg);
display: block;
line-height: 2;
text-indent: 0;
width: 25px;
height: 35px;
text-align: center;
border-radius: 3px;
top: 10px;
right: 15px;
position: absolute;
}
.pswp {
display: none;
}
@media only screen and (min-width: 991px) {
.wpgs-lightbox-icon::before{
display: none;
}
}
 .slick-loading .slick-list
{
background: #fff url(https://olivenaturals.in/wp-content/plugins/woo-product-gallery-slider/assets/css/ajax-loader.gif) center center no-repeat;
} @font-face
{
font-family: 'slick';
font-weight: normal;
font-style: normal;
src: url(https://olivenaturals.in/wp-content/plugins/woo-product-gallery-slider/assets/css/fonts/slick.eot);
src: url(https://olivenaturals.in/wp-content/plugins/woo-product-gallery-slider/assets/css/fonts/slick.eot?#iefix) format('embedded-opentype'), url(https://olivenaturals.in/wp-content/plugins/woo-product-gallery-slider/assets/css/fonts/slick.woff) format('woff'), url(https://olivenaturals.in/wp-content/plugins/woo-product-gallery-slider/assets/css/fonts/slick.ttf) format('truetype'), url(https://olivenaturals.in/wp-content/plugins/woo-product-gallery-slider/assets/css/fonts/slick.svg#slick) format('svg');
} .slick-prev,
.slick-next
{
font-size: 0;
line-height: 0;
position: absolute;
top: 50%;
display: block;
width: 20px;
height: 20px;
padding: 0;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
cursor: pointer;
color: transparent;
border: none;
outline: none;
background: transparent;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
color: transparent;
outline: none;
background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
opacity: .25;
}
.slick-prev:before,
.slick-next:before
{
font-family: 'slick';
font-size: 30px;
line-height: 1;
opacity: .75;
color: #1e85be;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.slick-prev
{
left: -11px;
z-index: 999;
}
[dir='rtl'] .slick-prev
{
right: -25px;
left: auto;
}
.slick-prev:before
{
content: '←';
}
[dir='rtl'] .slick-prev:before
{
content: '→';
}
.slick-next
{
right: -5px;
}
[dir='rtl'] .slick-next
{
right: auto;
left: -25px;
}
.slick-next:before
{
content: '→';
}
[dir='rtl'] .slick-next:before
{
content: '←';
} .slick-dotted.slick-slider
{
margin-bottom: 30px;
}
.slick-dots
{
position: absolute;
bottom: -35px;
display: block;
width: 100%;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
}
.slick-dots li
{
position: relative;
display: inline-block;
width: 20px;
height: 20px;
margin: 0 5px;
padding: 0;
cursor: pointer;
}
.slick-dots li button
{
font-size: 0;
line-height: 0;
display: block;
width: 20px;
height: 20px;
padding: 5px;
cursor: pointer;
color: transparent;
border: 0;
outline: none;
background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
opacity: 1;
}
.slick-dots li button:before {
font-family: 'slick'; line-height: 20px;
position: absolute;
top: 0;
display: block;
left: 0;
width: 20px;
height: 3px;
background: #000000;
content: ' ';
text-align: center;
opacity: .25;
border-radius: 10px;
color: #000000;
-webkit-font-smoothing: antialiased;
}
.slick-dots li.slick-active button:before
{
opacity: .75;
color: black;
}body.compensate-for-scrollbar{overflow:hidden}.fancybox-active{height:auto}.fancybox-is-hidden{left:-9999px;margin:0;position:absolute!important;top:-9999px;visibility:hidden}.fancybox-container{-webkit-backface-visibility:hidden;height:100%;left:0;outline:none;position:fixed;-webkit-tap-highlight-color:transparent;top:0;-ms-touch-action:manipulation;touch-action:manipulation;transform:translateZ(0);width:100%;z-index:99992}.fancybox-container *{box-sizing:border-box}.fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-stage{bottom:0;left:0;position:absolute;right:0;top:0}.fancybox-outer{-webkit-overflow-scrolling:touch;overflow-y:auto}.fancybox-bg{background:#1e1e1e;opacity:0;transition-duration:inherit;transition-property:opacity;transition-timing-function:cubic-bezier(.47,0,.74,.71)}.fancybox-is-open .fancybox-bg{opacity:.9;transition-timing-function:cubic-bezier(.22,.61,.36,1)}.fancybox-caption,.fancybox-infobar,.fancybox-navigation .fancybox-button,.fancybox-toolbar{direction:ltr;opacity:0;position:absolute;transition:opacity .25s ease,visibility 0s ease .25s;visibility:hidden;z-index:99997}.fancybox-show-caption .fancybox-caption,.fancybox-show-infobar .fancybox-infobar,.fancybox-show-nav .fancybox-navigation .fancybox-button,.fancybox-show-toolbar .fancybox-toolbar{opacity:1;transition:opacity .25s ease 0s,visibility 0s ease 0s;visibility:visible}.fancybox-infobar{color:#ccc;font-size:13px;-webkit-font-smoothing:subpixel-antialiased;height:44px;left:0;line-height:44px;min-width:44px;mix-blend-mode:difference;padding:0 10px;pointer-events:none;top:0;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-toolbar{right:0;top:0}.fancybox-stage{direction:ltr;overflow:visible;transform:translateZ(0);z-index:99994}.fancybox-is-open .fancybox-stage{overflow:hidden}.fancybox-slide{-webkit-backface-visibility:hidden;display:none;height:100%;left:0;outline:none;overflow:auto;-webkit-overflow-scrolling:touch;padding:44px;position:absolute;text-align:center;top:0;transition-property:transform,opacity;white-space:normal;width:100%;z-index:99994}.fancybox-slide:before{content:"";display:inline-block;font-size:0;height:100%;vertical-align:middle;width:0}.fancybox-is-sliding .fancybox-slide,.fancybox-slide--current,.fancybox-slide--next,.fancybox-slide--previous{display:block}.fancybox-slide--image{overflow:hidden;padding:44px 0}.fancybox-slide--image:before{display:none}.fancybox-slide--html{padding:6px}.fancybox-content{background:#fff;display:inline-block;margin:0;max-width:100%;overflow:auto;-webkit-overflow-scrolling:touch;padding:44px;position:relative;text-align:left;vertical-align:middle}.fancybox-slide--image .fancybox-content{animation-timing-function:cubic-bezier(.5,0,.14,1);-webkit-backface-visibility:hidden;background:transparent;background-repeat:no-repeat;background-size:100% 100%;left:0;max-width:none;overflow:visible;padding:0;position:absolute;top:0;transform-origin:top left;transition-property:transform,opacity;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:99995}.fancybox-can-zoomOut .fancybox-content{cursor:zoom-out}.fancybox-can-zoomIn .fancybox-content{cursor:zoom-in}.fancybox-can-pan .fancybox-content,.fancybox-can-swipe .fancybox-content{cursor:grab}.fancybox-is-grabbing .fancybox-content{cursor:grabbing}.fancybox-container [data-selectable=true]{cursor:text}.fancybox-image,.fancybox-spaceball{background:transparent;border:0;height:100%;left:0;margin:0;max-height:none;max-width:none;padding:0;position:absolute;top:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%}.fancybox-spaceball{z-index:1}.fancybox-slide--iframe .fancybox-content,.fancybox-slide--map .fancybox-content,.fancybox-slide--pdf .fancybox-content,.fancybox-slide--video .fancybox-content{height:100%;overflow:visible;padding:0;width:100%}.fancybox-slide--video .fancybox-content{background:#000}.fancybox-slide--map .fancybox-content{background:#e5e3df}.fancybox-slide--iframe .fancybox-content{background:#fff}.fancybox-iframe,.fancybox-video{background:transparent;border:0;display:block;height:100%;margin:0;overflow:hidden;padding:0;width:100%}.fancybox-iframe{left:0;position:absolute;top:0}.fancybox-error{background:#fff;cursor:default;max-width:400px;padding:40px;width:100%}.fancybox-error p{color:#444;font-size:16px;line-height:20px;margin:0;padding:0}.fancybox-button{background:rgba(30,30,30,.6);border:0;border-radius:0;box-shadow:none;cursor:pointer;display:inline-block;height:44px;margin:0;padding:10px;position:relative;transition:color .2s;vertical-align:top;visibility:inherit;width:44px}.fancybox-button,.fancybox-button:link,.fancybox-button:visited{color:#ccc}.fancybox-button:hover{color:#fff}.fancybox-button:focus{outline:none}.fancybox-button.fancybox-focus{outline:1px dotted}.fancybox-button[disabled],.fancybox-button[disabled]:hover{color:#888;cursor:default;outline:none}.fancybox-button div{height:100%}.fancybox-button svg{display:block;height:100%;overflow:visible;position:relative;width:100%}.fancybox-button svg path{fill:currentColor;stroke-width:0}.fancybox-button--fsenter svg:nth-child(2),.fancybox-button--fsexit svg:first-child,.fancybox-button--pause svg:first-child,.fancybox-button--play svg:nth-child(2){display:none}.fancybox-progress{background:#ff5268;height:2px;left:0;position:absolute;right:0;top:0;transform:scaleX(0);transform-origin:0;transition-property:transform;transition-timing-function:linear;z-index:99998}.fancybox-close-small{background:transparent;border:0;border-radius:0;color:#ccc;cursor:pointer;opacity:.8;padding:8px;position:absolute;right:-12px;top:-44px;z-index:401}.fancybox-close-small:hover{color:#fff;opacity:1}.fancybox-slide--html .fancybox-close-small{color:currentColor;padding:10px;right:0;top:0}.fancybox-slide--image.fancybox-is-scaling .fancybox-content{overflow:hidden}.fancybox-is-scaling .fancybox-close-small,.fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small{display:none}.fancybox-navigation .fancybox-button{background-clip:content-box;height:100px;opacity:0;position:absolute;top:calc(50% - 50px);width:70px}.fancybox-navigation .fancybox-button div{padding:7px}.fancybox-navigation .fancybox-button--arrow_left{left:0;left:env(safe-area-inset-left);padding:31px 26px 31px 6px}.fancybox-navigation .fancybox-button--arrow_right{padding:31px 6px 31px 26px;right:0;right:env(safe-area-inset-right)}.fancybox-caption{background:linear-gradient(0deg,rgba(0,0,0,.85) 0,rgba(0,0,0,.3) 50%,rgba(0,0,0,.15) 65%,rgba(0,0,0,.075) 75.5%,rgba(0,0,0,.037) 82.85%,rgba(0,0,0,.019) 88%,transparent);bottom:0;color:#eee;font-size:14px;font-weight:400;left:0;line-height:1.5;padding:75px 44px 25px;pointer-events:none;right:0;text-align:center;z-index:99996}@supports (padding:max(0px)){.fancybox-caption{padding:75px max(44px,env(safe-area-inset-right)) max(25px,env(safe-area-inset-bottom)) max(44px,env(safe-area-inset-left))}}.fancybox-caption--separate{margin-top:-50px}.fancybox-caption__body{max-height:50vh;overflow:auto;pointer-events:all}.fancybox-caption a,.fancybox-caption a:link,.fancybox-caption a:visited{color:#ccc;text-decoration:none}.fancybox-caption a:hover{color:#fff;text-decoration:underline}.fancybox-loading{animation:a 1s linear infinite;background:transparent;border:4px solid #888;border-bottom-color:#fff;border-radius:50%;height:50px;left:50%;margin:-25px 0 0 -25px;opacity:.7;padding:0;position:absolute;top:50%;width:50px;z-index:99999}@keyframes a{to{transform:rotate(1turn)}}.fancybox-animated{transition-timing-function:cubic-bezier(0,0,.25,1)}.fancybox-fx-slide.fancybox-slide--previous{opacity:0;transform:translate3d(-100%,0,0)}.fancybox-fx-slide.fancybox-slide--next{opacity:0;transform:translate3d(100%,0,0)}.fancybox-fx-slide.fancybox-slide--current{opacity:1;transform:translateZ(0)}.fancybox-fx-fade.fancybox-slide--next,.fancybox-fx-fade.fancybox-slide--previous{opacity:0;transition-timing-function:cubic-bezier(.19,1,.22,1)}.fancybox-fx-fade.fancybox-slide--current{opacity:1}.fancybox-fx-zoom-in-out.fancybox-slide--previous{opacity:0;transform:scale3d(1.5,1.5,1.5)}.fancybox-fx-zoom-in-out.fancybox-slide--next{opacity:0;transform:scale3d(.5,.5,.5)}.fancybox-fx-zoom-in-out.fancybox-slide--current{opacity:1;transform:scaleX(1)}.fancybox-fx-rotate.fancybox-slide--previous{opacity:0;transform:rotate(-1turn)}.fancybox-fx-rotate.fancybox-slide--next{opacity:0;transform:rotate(1turn)}.fancybox-fx-rotate.fancybox-slide--current{opacity:1;transform:rotate(0deg)}.fancybox-fx-circular.fancybox-slide--previous{opacity:0;transform:scale3d(0,0,0) translate3d(-100%,0,0)}.fancybox-fx-circular.fancybox-slide--next{opacity:0;transform:scale3d(0,0,0) translate3d(100%,0,0)}.fancybox-fx-circular.fancybox-slide--current{opacity:1;transform:scaleX(1) translateZ(0)}.fancybox-fx-tube.fancybox-slide--previous{transform:translate3d(-100%,0,0) scale(.1) skew(-10deg)}.fancybox-fx-tube.fancybox-slide--next{transform:translate3d(100%,0,0) scale(.1) skew(10deg)}.fancybox-fx-tube.fancybox-slide--current{transform:translateZ(0) scale(1)}@media (max-height:576px){.fancybox-slide{padding-left:6px;padding-right:6px}.fancybox-slide--image{padding:6px 0}.fancybox-close-small{right:-6px}.fancybox-slide--image .fancybox-close-small{background:#4e4e4e;color:#f2f4f6;height:36px;opacity:1;padding:6px;right:0;top:0;width:36px}.fancybox-caption{padding-left:12px;padding-right:12px}@supports (padding:max(0px)){.fancybox-caption{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}}}.fancybox-share{background:#f4f4f4;border-radius:3px;max-width:90%;padding:30px;text-align:center}.fancybox-share h1{color:#222;font-size:35px;font-weight:700;margin:0 0 20px}.fancybox-share p{margin:0;padding:0}.fancybox-share__button{border:0;border-radius:3px;display:inline-block;font-size:14px;font-weight:700;line-height:40px;margin:0 5px 10px;min-width:130px;padding:0 15px;text-decoration:none;transition:all .2s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap}.fancybox-share__button:link,.fancybox-share__button:visited{color:#fff}.fancybox-share__button:hover{text-decoration:none}.fancybox-share__button--fb{background:#3b5998}.fancybox-share__button--fb:hover{background:#344e86}.fancybox-share__button--pt{background:#bd081d}.fancybox-share__button--pt:hover{background:#aa0719}.fancybox-share__button--tw{background:#1da1f2}.fancybox-share__button--tw:hover{background:#0d95e8}.fancybox-share__button svg{height:25px;margin-right:7px;position:relative;top:-1px;vertical-align:middle;width:25px}.fancybox-share__button svg path{fill:#fff}.fancybox-share__input{background:transparent;border:0;border-bottom:1px solid #d7d7d7;border-radius:0;color:#5d5b5b;font-size:14px;margin:10px 0 0;outline:none;padding:10px 15px;width:100%}.fancybox-thumbs{background:#ddd;bottom:0;display:none;margin:0;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;padding:2px 2px 4px;position:absolute;right:0;-webkit-tap-highlight-color:rgba(0,0,0,0);top:0;width:212px;z-index:99995}.fancybox-thumbs-x{overflow-x:auto;overflow-y:hidden}.fancybox-show-thumbs .fancybox-thumbs{display:block}.fancybox-show-thumbs .fancybox-inner{right:212px}.fancybox-thumbs__list{font-size:0;height:100%;list-style:none;margin:0;overflow-x:hidden;overflow-y:auto;padding:0;position:absolute;position:relative;white-space:nowrap;width:100%}.fancybox-thumbs-x .fancybox-thumbs__list{overflow:hidden}.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar{width:7px}.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track{background:#fff;border-radius:10px;box-shadow:inset 0 0 6px rgba(0,0,0,.3)}.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb{background:#2a2a2a;border-radius:10px}.fancybox-thumbs__list a{-webkit-backface-visibility:hidden;backface-visibility:hidden;background-color:rgba(0,0,0,.1);background-position:50%;background-repeat:no-repeat;background-size:cover;cursor:pointer;float:left;height:75px;margin:2px;max-height:calc(100% - 8px);max-width:calc(50% - 4px);outline:none;overflow:hidden;padding:0;position:relative;-webkit-tap-highlight-color:transparent;width:100px}.fancybox-thumbs__list a:before{border:6px solid #ff5268;bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:all .2s cubic-bezier(.25,.46,.45,.94);z-index:99991}.fancybox-thumbs__list a:focus:before{opacity:.5}.fancybox-thumbs__list a.fancybox-thumbs-active:before{opacity:1}@media (max-width:576px){.fancybox-thumbs{width:110px}.fancybox-show-thumbs .fancybox-inner{right:110px}.fancybox-thumbs__list a{max-width:calc(100% - 10px)}}