/* ═══ DENK STORE — Design System ═══════════════════════════════════════════ */
@import url(‘https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,600&family=DM+Sans:wght@300;400;500;600&display=swap’);
:root {
–dk-anchor: #1A1A1A;
–dk-cognac: #C4722A;
–dk-stone: #FAF9F7;
–dk-warm-border: #E5E0D8;
–dk-muted: #6B6560;
–dk-white: #FFFFFF;
}
/* ── Global ─────────────────────────────────────────────────────────────── */
html, body {
background-color: var(–dk-stone) !important;
color: var(–dk-anchor) !important;
font-family: ‘DM Sans’, system-ui, -apple-system, sans-serif !important;
-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6,
.woocommerce-loop-product__title,
.product_title,
.woocommerce-checkout h3,
.woocommerce-cart h2 {
font-family: ‘Playfair Display’, Georgia, serif !important;
color: var(–dk-anchor) !important;
font-weight: 500;
letter-spacing: -0.01em;
}
a { color: var(–dk-anchor); text-decoration: none; }
a:hover { color: var(–dk-cognac); }
/* ── Header / Nav ───────────────────────────────────────────────────────── */
.site-header,
header.site-header,
.wc-block-cart__main header {
background-color: var(–dk-stone) !important;
border-bottom: 1px solid var(–dk-warm-border) !important;
box-shadow: none !important;
}
.site-header .site-title,
.site-header .custom-logo-link {
font-family: ‘Playfair Display’, Georgia, serif !important;
font-size: 1.25rem;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(–dk-anchor) !important;
}
.main-navigation a, .site-header nav a {
font-family: ‘DM Sans’, sans-serif !important;
font-size: 0.8125rem;
letter-spacing: 0.06em;
text-transform: none;
color: var(–dk-anchor) !important;
}
.main-navigation a:hover { color: var(–dk-cognac) !important; }
/* Announcement bar — si présent */
.woocommerce-store-notice, .wc-block-banner {
background-color: var(–dk-anchor) !important;
color: var(–dk-white) !important;
font-size: 0.75rem;
letter-spacing: 0.1em;
text-align: center;
padding: 0.5rem 1rem;
}
/* ── Shop Grid ──────────────────────────────────────────────────────────── */
.woocommerce ul.products {
display: grid !important;
grid-template-columns: repeat(2, 1fr) !important;
gap: 1.5rem 1.25rem !important;
}
@media (min-width: 768px) {
.woocommerce ul.products {
grid-template-columns: repeat(3, 1fr) !important;
gap: 2rem 1.5rem !important;
}
}
@media (min-width: 1024px) {
.woocommerce ul.products {
grid-template-columns: repeat(4, 1fr) !important;
}
}
.woocommerce ul.products li.product {
background: transparent !important;
border: none !important;
box-shadow: none !important;
padding: 0 !important;
margin: 0 !important;
float: none !important;
width: auto !important;
clear: none !important;
}
/* Product image container */
.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product .woocommerce-loop-product__link img {
width: 100%;
aspect-ratio: 3/4;
object-fit: cover;
border-radius: 0 !important;
transition: transform 0.55s cubic-bezier(0.25, 0.46, 0.45, 0.94);
display: block;
margin-bottom: 0.75rem !important;
}
.woocommerce ul.products li.product:hover img {
transform: scale(1.04);
}
.woocommerce ul.products li.product a {
overflow: hidden;
display: block;
}
/* Product title */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
font-size: 0.875rem !important;
font-weight: 500 !important;
line-height: 1.35 !important;
color: var(–dk-anchor) !important;
margin: 0.5rem 0 0.3rem !important;
padding: 0 !important;
}
/* Price */
.woocommerce ul.products li.product .price,
.woocommerce div.product .price {
color: var(–dk-anchor) !important;
font-size: 0.875rem !important;
font-family: ‘DM Sans’, sans-serif !important;
font-weight: 600 !important;
}
.woocommerce ul.products li.product .price del,
.woocommerce div.product .price del {
color: var(–dk-muted) !important;
font-weight: 400 !important;
margin-right: 0.35rem;
}
.woocommerce ul.products li.product .price ins {
color: var(–dk-cognac) !important;
text-decoration: none !important;
font-weight: 600 !important;
}
/* Sale badge */
.woocommerce ul.products li.product .onsale,
.woocommerce span.onsale {
background-color: var(–dk-cognac) !important;
color: white !important;
font-size: 0.6rem !important;
font-family: ‘DM Sans’, sans-serif !important;
font-weight: 600 !important;
letter-spacing: 0.12em;
text-transform: uppercase;
border-radius: 0 !important;
min-height: auto !important;
min-width: auto !important;
padding: 0.25rem 0.5rem !important;
line-height: 1 !important;
top: 0.75rem !important;
left: 0.75rem !important;
}
/* Add to cart buttons on shop page */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product a.button {
background-color: var(–dk-anchor) !important;
color: white !important;
border: none !important;
border-radius: 0 !important;
font-family: ‘DM Sans’, sans-serif !important;
font-size: 0.6875rem !important;
font-weight: 600 !important;
letter-spacing: 0.12em;
text-transform: uppercase;
padding: 0.65rem 1rem !important;
transition: background-color 0.2s ease;
width: 100%;
text-align: center;
margin-top: 0.5rem !important;
display: block;
}
.woocommerce ul.products li.product .button:hover,
.woocommerce ul.products li.product a.button:hover {
background-color: var(–dk-cognac) !important;
color: white !important;
}
/* ── Product Single ──────────────────────────────────────────────────────── */
.woocommerce div.product {
padding-top: 2rem;
}
.woocommerce div.product .product_title {
font-size: 2rem !important;
font-weight: 500 !important;
line-height: 1.2 !important;
margin-bottom: 1rem !important;
}
.woocommerce div.product p.price {
font-size: 1.375rem !important;
margin-bottom: 1.25rem !important;
}
/* Variations */
.woocommerce div.product .variations select {
border: 1px solid var(–dk-warm-border) !important;
border-radius: 0 !important;
padding: 0.5rem 0.75rem !important;
background-color: white !important;
color: var(–dk-anchor) !important;
font-family: ‘DM Sans’, sans-serif !important;
}
/* Single add to cart button */
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce div.product form.cart .button {
background-color: var(–dk-anchor) !important;
color: white !important;
border-radius: 0 !important;
border: none !important;
font-family: ‘DM Sans’, sans-serif !important;
font-size: 0.75rem !important;
font-weight: 600 !important;
letter-spacing: 0.12em;
text-transform: uppercase;
padding: 0.9rem 2rem !important;
transition: background-color 0.2s ease;
cursor: pointer;
}
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce div.product form.cart .button:hover {
background-color: var(–dk-cognac) !important;
color: white !important;
}
/* Quantity */
.woocommerce .quantity input.qty {
border: 1px solid var(–dk-warm-border) !important;
border-radius: 0 !important;
text-align: center;
font-family: ‘DM Sans’, sans-serif !important;
font-weight: 600;
}
/* Product tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs li {
border-radius: 0 !important;
background: transparent !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
font-family: ‘DM Sans’, sans-serif !important;
font-size: 0.8125rem;
font-weight: 600;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(–dk-muted) !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
color: var(–dk-anchor) !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
border-bottom-color: var(–dk-stone) !important;
}
/* ── Breadcrumb ──────────────────────────────────────────────────────────── */
.woocommerce .woocommerce-breadcrumb {
font-size: 0.75rem !important;
color: var(–dk-muted) !important;
margin-bottom: 1.5rem !important;
}
.woocommerce .woocommerce-breadcrumb a {
color: var(–dk-muted) !important;
}
.woocommerce .woocommerce-breadcrumb a:hover {
color: var(–dk-anchor) !important;
}
/* ── Shop Page Header ────────────────────────────────────────────────────── */
.woocommerce-products-header__title,
.woocommerce h1.page-title {
font-family: ‘Playfair Display’, Georgia, serif !important;
font-size: 2.25rem !important;
font-weight: 500 !important;
color: var(–dk-anchor) !important;
letter-spacing: -0.01em;
}
.woocommerce-result-count {
font-size: 0.8125rem !important;
color: var(–dk-muted) !important;
}
.woocommerce-ordering select {
border: 1px solid var(–dk-warm-border) !important;
border-radius: 0 !important;
font-family: ‘DM Sans’, sans-serif !important;
font-size: 0.8125rem !important;
background-color: var(–dk-stone) !important;
padding: 0.4rem 0.75rem !important;
}
/* ── Cart ───────────────────────────────────────────────────────────────── */
.woocommerce-cart table.cart {
border: none !important;
}
.woocommerce-cart table.cart th,
.woocommerce-cart table.shop_table th {
font-family: ‘DM Sans’, sans-serif !important;
font-size: 0.6875rem !important;
font-weight: 600 !important;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(–dk-muted) !important;
border-top: none !important;
border-bottom: 1px solid var(–dk-warm-border) !important;
padding-bottom: 0.75rem !important;
}
.woocommerce-cart table.cart td,
.woocommerce-cart table.shop_table td {
border-top: 1px solid var(–dk-warm-border) !important;
vertical-align: middle !important;
}
.woocommerce-cart .cart-collaterals .cart_totals {
background-color: var(–dk-white) !important;
border: 1px solid var(–dk-warm-border) !important;
padding: 1.5rem !important;
}
.woocommerce-cart .cart_totals h2 {
font-size: 1.125rem !important;
margin-bottom: 1rem !important;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
background-color: var(–dk-anchor) !important;
border-radius: 0 !important;
font-family: ‘DM Sans’, sans-serif !important;
font-size: 0.75rem !important;
font-weight: 600 !important;
letter-spacing: 0.12em;
text-transform: uppercase;
padding: 1rem !important;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
background-color: var(–dk-cognac) !important;
}
/* ── Checkout ────────────────────────────────────────────────────────────── */
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout h3#order_review_heading {
font-family: ‘Playfair Display’, Georgia, serif !important;
font-size: 1.25rem !important;
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row select,
.woocommerce form .form-row textarea {
border: 1px solid var(–dk-warm-border) !important;
border-radius: 0 !important;
background-color: var(–dk-white) !important;
font-family: ‘DM Sans’, sans-serif !important;
font-size: 0.875rem !important;
padding: 0.75rem 1rem !important;
color: var(–dk-anchor) !important;
transition: border-color 0.2s ease;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row select:focus,
.woocommerce form .form-row textarea:focus {
border-color: var(–dk-cognac) !important;
outline: none !important;
box-shadow: none !important;
}
.woocommerce form .form-row label {
font-family: ‘DM Sans’, sans-serif !important;
font-size: 0.75rem !important;
font-weight: 600 !important;
letter-spacing: 0.04em;
color: var(–dk-anchor) !important;
margin-bottom: 0.35rem;
}
#payment {
background-color: var(–dk-white) !important;
border: 1px solid var(–dk-warm-border) !important;
border-radius: 0 !important;
}
#payment div.payment_box {
background-color: #f5f3f0 !important;
}
#place_order {
background-color: var(–dk-anchor) !important;
border-radius: 0 !important;
font-family: ‘DM Sans’, sans-serif !important;
font-size: 0.75rem !important;
font-weight: 600 !important;
letter-spacing: 0.12em;
text-transform: uppercase;
padding: 1rem 2rem !important;
width: 100%;
}
#place_order:hover {
background-color: var(–dk-cognac) !important;
}
/* ── Account ─────────────────────────────────────────────────────────────── */
.woocommerce-account .woocommerce-MyAccount-navigation {
border-right: 1px solid var(–dk-warm-border);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul {
list-style: none;
padding: 0;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
display: block;
padding: 0.6rem 0;
font-size: 0.875rem;
color: var(–dk-anchor) !important;
border-bottom: 1px solid var(–dk-warm-border);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
color: var(–dk-cognac) !important;
font-weight: 600;
}
/* ── Reviews ─────────────────────────────────────────────────────────────── */
.woocommerce #reviews #comments ol.commentlist li .comment-text {
border-radius: 0 !important;
border: 1px solid var(–dk-warm-border) !important;
}
/* Stars */
.woocommerce .star-rating span::before,
.woocommerce p.stars a:hover::before,
.woocommerce p.stars.selected a.active::before,
.woocommerce p.stars.selected a:not(.active)::before {
color: var(–dk-cognac) !important;
}
/* ── Notices ─────────────────────────────────────────────────────────────── */
.woocommerce-message,
.woocommerce-info {
border-top-color: var(–dk-cognac) !important;
background-color: var(–dk-white) !important;
}
.woocommerce-message a.button,
.woocommerce-info a.button {
background-color: var(–dk-anchor) !important;
border-radius: 0 !important;
}
.woocommerce-error {
background-color: #fff5f5 !important;
}
/* ── Widgets / Sidebar ───────────────────────────────────────────────────── */
.widget_layered_nav ul li a,
.widget_product_categories ul li a,
.widget_price_filter .price_slider_amount .button {
font-family: ‘DM Sans’, sans-serif !important;
font-size: 0.875rem;
color: var(–dk-anchor) !important;
}
.widget_price_filter .ui-slider .ui-slider-handle {
background-color: var(–dk-cognac) !important;
border-color: var(–dk-cognac) !important;
}
.widget_price_filter .ui-slider .ui-slider-range {
background-color: var(–dk-cognac) !important;
}
/* ── Footer ──────────────────────────────────────────────────────────────── */
.site-footer {
background-color: var(–dk-anchor) !important;
color: rgba(255,255,255,0.7) !important;
border-top: none !important;
}
.site-footer a {
color: rgba(255,255,255,0.7) !important;
}
.site-footer a:hover {
color: white !important;
}
.site-footer .widget-title,
.site-footer h2, .site-footer h3, .site-footer h4 {
color: white !important;
font-family: ‘DM Sans’, sans-serif !important;
font-size: 0.6875rem !important;
font-weight: 600 !important;
letter-spacing: 0.12em;
text-transform: uppercase;
margin-bottom: 1rem;
}
.site-footer .site-info {
border-top: 1px solid rgba(255,255,255,0.1) !important;
color: rgba(255,255,255,0.35) !important;
font-size: 0.75rem !important;
padding: 1rem 0;
}
/* ── Pages contenu ───────────────────────────────────────────────────────── */
.entry-content h2, .page-content h2 {
font-size: 1.75rem;
margin-top: 2rem;
margin-bottom: 0.75rem;
}
.entry-content p, .page-content p {
font-size: 0.9375rem;
line-height: 1.7;
color: #444;
}
/* ── Details/Summary (FAQ accordion) ────────────────────────────────────── */
details.dk-faq {
border-bottom: 1px solid var(–dk-warm-border);
padding: 1rem 0;
}
details.dk-faq summary {
cursor: pointer;
font-family: ‘DM Sans’, sans-serif;
font-size: 0.9375rem;
font-weight: 600;
color: var(–dk-anchor);
list-style: none;
display: flex;
align-items: center;
justify-content: space-between;
user-select: none;
}
details.dk-faq summary::-webkit-details-marker { display: none; }
details.dk-faq summary::after {
content: ‘+’;
font-size: 1.25rem;
font-weight: 300;
color: var(–dk-cognac);
transition: transform 0.2s ease;
flex-shrink: 0;
margin-left: 1rem;
}
details.dk-faq[open] summary::after {
content: ‘–’;
}
details.dk-faq .dk-faq-body {
padding: 0.75rem 0 0.25rem;
font-size: 0.875rem;
color: var(–dk-muted);
line-height: 1.7;
}
/* ── Table tailles ───────────────────────────────────────────────────────── */
table.dk-table {
width: 100%;
border-collapse: collapse;
font-size: 0.875rem;
margin: 1rem 0 2rem;
}
table.dk-table th {
background-color: var(–dk-anchor);
color: white;
font-family: ‘DM Sans’, sans-serif;
font-weight: 600;
font-size: 0.6875rem;
letter-spacing: 0.1em;
text-transform: uppercase;
padding: 0.6rem 1rem;
text-align: center;
}
table.dk-table td {
border-bottom: 1px solid var(–dk-warm-border);
padding: 0.6rem 1rem;
text-align: center;
color: var(–dk-anchor);
}
table.dk-table tr:nth-child(even) td {
background-color: rgba(229,224,216,0.2);
}
table.dk-table td:first-child {
font-weight: 600;
text-align: left;
}
/* ── Contact form ───────────────────────────────────────────────────────── */
.dk-contact-form input,
.dk-contact-form select,
.dk-contact-form textarea {
width: 100%;
border: 1px solid var(–dk-warm-border);
border-radius: 0;
background: white;
padding: 0.75rem 1rem;
font-family: ‘DM Sans’, sans-serif;
font-size: 0.875rem;
color: var(–dk-anchor);
margin-bottom: 1rem;
transition: border-color 0.2s ease;
outline: none;
box-sizing: border-box;
}
.dk-contact-form input:focus,
.dk-contact-form textarea:focus {
border-color: var(–dk-cognac);
}
.dk-contact-form button, .dk-btn {
background-color: var(–dk-anchor);
color: white;
border: none;
padding: 0.875rem 2.5rem;
font-family: ‘DM Sans’, sans-serif;
font-size: 0.6875rem;
font-weight: 600;
letter-spacing: 0.12em;
text-transform: uppercase;
cursor: pointer;
transition: background-color 0.2s ease;
border-radius: 0;
}
.dk-contact-form button:hover, .dk-btn:hover {
background-color: var(–dk-cognac);
}
/* ── Helpers ─────────────────────────────────────────────────────────────── */
.dk-label {
font-family: ‘DM Sans’, sans-serif;
font-size: 0.6875rem;
font-weight: 600;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(–dk-cognac);
display: block;
margin-bottom: 0.5rem;
}
.dk-divider {
border: none;
border-top: 1px solid var(–dk-warm-border);
margin: 2rem 0;
}
.dk-highlight {
background-color: var(–dk-white);
border: 1px solid var(–dk-warm-border);
padding: 1.5rem;
}
/* ── Elementor overrides ─────────────────────────────────────────────────── */
.elementor-widget-heading .elementor-heading-title {
font-family: ‘Playfair Display’, Georgia, serif !important;
}
.elementor-widget-text-editor {
font-family: ‘DM Sans’, sans-serif !important;
}
.elementor-button {
border-radius: 0 !important;
font-family: ‘DM Sans’, sans-serif !important;
letter-spacing: 0.08em;
}
/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width: 640px) {
.woocommerce ul.products {
grid-template-columns: repeat(2, 1fr) !important;
gap: 1rem 0.75rem !important;
}
.woocommerce div.product .product_title {
font-size: 1.5rem !important;
}
}