/*
Theme Name: Dshean Shop
Theme URI: https://www.dshean.com/
Author: Dshean Studio
Author URI: https://www.dshean.com/
Description: Lightweight custom WooCommerce theme for Dshean Shop. No page builder required: header/footer use native menus & widgets, the homepage is built with blocks, and the hero is a manageable "Hero Slides" section in wp-admin.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dshean
*/

/* ==========================================================================
   Design tokens (ported from the original site design)
   ========================================================================== */
:root {
	--ds-beige: #ddd1c1;
	--ds-brown: #6a5950;
	--ds-dark: #26222f;
	--ds-text: #312e39;
	--ds-gray: #f7f7f7;
	--ds-cream: #fdf6f1;
	--ds-section: #efefe7;
	--ds-line: #e7e7e7;
	--ds-white: #ffffff;
	--ds-container: 1240px;
	--ds-narrow-container: 1200px;
	--ds-font-body: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--ds-font-head: 'Fahkwang', 'Montserrat', Georgia, serif;
}

/* ==========================================================================
   Reset & base
   ========================================================================== */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	font-family: var(--ds-font-body);
	font-weight: 400;
	font-size: 16px;
	line-height: 1.65;
	color: var(--ds-text);
	background-color: var(--ds-white);
	-webkit-font-smoothing: antialiased;
}

body.ds-no-scroll {
	overflow: hidden;
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: var(--ds-brown);
	text-decoration: none;
	transition: color 0.2s ease, opacity 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

a:hover,
a:focus {
	color: var(--ds-dark);
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--ds-font-head);
	font-weight: 600;
	line-height: 1.2;
	color: var(--ds-dark);
	margin: 0 0 0.6em;
}

h1 { font-size: 110px; line-height: 1; }
h2 { font-size: 52px; line-height: 1.3; }
h3 { font-size: 32px; line-height: 1.3; }
h4 { font-size: 24px; }
h5 { font-size: 20px; }
h6 { font-size: 14px; line-height: 1.25; }

p {
	margin: 0 0 1em;
}

figure {
	margin: 0;
}

blockquote {
	margin: 1.5em;
	border-left: 4px solid var(--ds-beige);
	padding-left: 1em;
	color: var(--ds-brown);
}

table {
	width: 100%;
	border-collapse: collapse;
}

th, td {
	padding: 0.75em 1em;
	border: 1px solid var(--ds-line);
	text-align: left;
}

input, select, textarea {
	font-family: var(--ds-font-body);
	font-size: 15px;
	color: var(--ds-text);
	border: 1px solid var(--ds-line);
	border-radius: 0;
	padding: 10px 14px;
	background: var(--ds-white);
	width: 100%;
}

input:focus, select:focus, textarea:focus {
	outline: none;
	border-color: var(--ds-brown);
}

textarea {
	min-height: 140px;
	resize: vertical;
}

::selection {
	background: var(--ds-beige);
}

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

/* ==========================================================================
   Layout helpers
   ========================================================================== */
.ds-container {
	width: 100%;
	max-width: var(--ds-container);
	margin-left: auto;
	margin-right: auto;
	padding-left: 20px;
	padding-right: 20px;
}

.ds-container--narrow {
	max-width: var(--ds-narrow-container);
}

.ds-site {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.ds-site-main {
	flex: 1 0 auto;
}

.ds-section {
	padding: 120px 0;
}

.ds-section--tight {
	padding: 70px 0;
}

.ds-section--gray {
	background: var(--ds-section);
}

.ds-section--cream {
	background: var(--ds-cream);
}

.ds-alignwide {
	width: 100%;
	max-width: var(--ds-container);
	margin-left: auto;
	margin-right: auto;
}

.ds-alignfull {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* Section heading style used across the homepage (matches original) */
.ds-section-head {
	text-align: center;
	margin-bottom: 48px;
}

.ds-section-head .ds-section-title {
	font-size: 32px;
	text-transform: uppercase;
	letter-spacing: 3px;
	margin: 0 0 24px;
}

.ds-section-head--left {
	text-align: left;
}

.ds-section-head--left .ds-section-title {
	margin-bottom: 0;
}

/* ==========================================================================
   Buttons (match original outline button design)
   ========================================================================== */
.ds-btn {
	display: inline-block;
	font-family: var(--ds-font-body);
	font-weight: 600;
	font-size: 13px;
	line-height: 1;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--ds-dark);
	background: transparent;
	border: 1px solid var(--ds-dark);
	border-radius: 0;
	padding: 15px 30px;
	cursor: pointer;
	text-align: center;
}

.ds-btn:hover,
.ds-btn:focus {
	color: var(--ds-white);
	background: var(--ds-dark);
	border-color: var(--ds-dark);
}

.ds-btn--white {
	color: var(--ds-dark);
	background: var(--ds-white);
	border-color: var(--ds-white);
}

.ds-btn--white:hover,
.ds-btn--white:focus {
	color: var(--ds-dark);
	background: var(--ds-gray);
	border-color: var(--ds-gray);
}

.ds-btn--solid {
	color: var(--ds-white);
	background: var(--ds-dark);
	border-color: var(--ds-dark);
}

.ds-btn--solid:hover,
.ds-btn--solid:focus {
	color: var(--ds-dark);
	background: transparent;
}

.ds-btn--small {
	padding: 11px 22px;
	font-size: 11px;
}

/* ==========================================================================
   Header
   ========================================================================== */
.ds-header {
	position: relative;
	z-index: 60;
	background: var(--ds-white);
}

/* Top discount bar */
.ds-topbar {
	background: var(--ds-gray);
	min-height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	font-size: 13px;
	color: var(--ds-dark);
	padding: 6px 20px;
}

.ds-topbar p {
	margin: 0;
}

.ds-topbar a {
	color: var(--ds-dark);
	text-decoration: underline;
}

/* Main header bar */
.ds-header-main {
	background: var(--ds-section);
}

.ds-header-main-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	min-height: 104px;
	max-width: 100%;
	padding-left: 35px;
	padding-right: 35px;
}

.ds-header-nav {
	flex: 1 1 0;
	min-width: 0;
}

.ds-header-logo {
	flex: 0 0 auto;
	text-align: center;
}

.ds-header-logo img {
	width: 220px;
	max-width: 220px;
	height: auto;
}

.ds-header-actions {
	flex: 1 1 0;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
}

.ds-header-action {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	color: var(--ds-dark);
	position: relative;
}

.ds-header-action svg {
	width: 20px;
	height: 20px;
	fill: currentColor;
}

.ds-header-action:hover {
	color: var(--ds-brown);
}

.ds-cart-count {
	position: absolute;
	top: 2px;
	right: 0;
	min-width: 16px;
	height: 16px;
	padding: 0 4px;
	border-radius: 8px;
	background: var(--ds-dark);
	color: var(--ds-white);
	font-size: 10px;
	font-weight: 600;
	line-height: 16px;
	text-align: center;
}

/* Primary navigation */
.ds-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 4px;
}

.ds-nav li {
	position: relative;
}

.ds-nav a {
	display: flex;
	align-items: center;
	height: 104px;
	padding: 0 14px;
	font-size: 14px;
	color: var(--ds-text);
	white-space: nowrap;
}

.ds-nav a:hover,
.ds-nav li.current-menu-item > a,
.ds-nav li.current_page_item > a,
.ds-nav li.current-menu-ancestor > a {
	color: var(--ds-dark);
}

.ds-nav .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 220px;
	background: var(--ds-section);
	border: 1px solid var(--ds-line);
	display: block;
	visibility: hidden;
	opacity: 0;
	transform: translateY(6px);
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
	z-index: 70;
}

.ds-nav li:hover > .sub-menu,
.ds-nav li:focus-within > .sub-menu {
	visibility: visible;
	opacity: 1;
	transform: translateY(0);
}

.ds-nav .sub-menu a {
	height: auto;
	padding: 10px 16px;
	font-size: 13px;
}

.ds-nav .menu-item-has-children > a::after {
	content: "";
	width: 6px;
	height: 6px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg);
	margin-left: 8px;
}

/* Mobile navigation */
.ds-nav-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
	color: var(--ds-dark);
}

.ds-nav-toggle span {
	position: relative;
	display: block;
	width: 22px;
	height: 2px;
	background: currentColor;
}

.ds-nav-toggle span::before,
.ds-nav-toggle span::after {
	content: "";
	position: absolute;
	left: 0;
	width: 22px;
	height: 2px;
	background: currentColor;
	transition: transform 0.25s ease, top 0.25s ease;
}

.ds-nav-toggle span::before { top: -7px; }
.ds-nav-toggle span::after { top: 7px; }

.ds-nav-open .ds-nav-toggle span {
	background: transparent;
}

.ds-nav-open .ds-nav-toggle span::before {
	top: 0;
	transform: rotate(45deg);
}

.ds-nav-open .ds-nav-toggle span::after {
	top: 0;
	transform: rotate(-45deg);
}

.ds-mobile-nav {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: var(--ds-white);
	z-index: 90;
	padding: 90px 24px 40px;
	overflow-y: auto;
}

.ds-nav-open .ds-mobile-nav {
	display: block;
}

.ds-mobile-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ds-mobile-nav li a {
	display: block;
	padding: 14px 0;
	font-size: 18px;
	color: var(--ds-text);
	border-bottom: 1px solid var(--ds-line);
}

.ds-mobile-nav .sub-menu {
	display: none;
	padding-left: 16px;
}

.ds-mobile-nav li.ds-open > .sub-menu {
	display: block;
}

.ds-mobile-close {
	position: absolute;
	top: 24px;
	right: 24px;
	width: 40px;
	height: 40px;
	background: none;
	border: 0;
	font-size: 28px;
	line-height: 1;
	cursor: pointer;
	color: var(--ds-dark);
}

/* Header search */
.ds-header-search {
	display: none;
	border-top: 1px solid var(--ds-line);
	background: var(--ds-white);
	padding: 24px 20px;
}

.ds-search-open .ds-header-search {
	display: block;
}

.ds-header-search form {
	display: flex;
	max-width: 640px;
	margin: 0 auto;
	gap: 10px;
}

.ds-header-search input {
	border: 0;
	border-bottom: 1px solid var(--ds-dark);
	padding: 10px 4px;
	font-size: 18px;
}

.ds-header-search input:focus {
	outline: none;
}

/* ==========================================================================
   Hero slider
   ========================================================================== */
.ds-hero {
	position: relative;
	background: var(--ds-beige);
	overflow: hidden;
}

.ds-slide {
	display: none;
	position: relative;
	min-height: 82vh;
	background-color: var(--ds-beige);
	background-position: center right;
	background-repeat: no-repeat;
	background-size: contain;
	align-items: center;
}

.ds-slide.ds-active {
	display: flex;
}

.ds-slide-inner {
	width: 100%;
	padding: 48px 0;
}

.ds-slide-content {
	max-width: 52%;
}

.ds-slide-title {
	font-size: 110px;
	line-height: 1;
	color: var(--ds-white);
	margin: 0 0 18px;
}

.ds-slide-subtitle {
	font-size: 22px;
	font-weight: 600;
	color: var(--ds-white);
	line-height: 1.5;
	margin: 0 0 32px;
	max-width: 480px;
}

/* Slider controls */
.ds-slider-nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 48px;
	height: 48px;
	background: rgba(255, 255, 255, 0.85);
	border: 0;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 5;
	color: var(--ds-dark);
}

.ds-slider-nav:hover {
	background: var(--ds-white);
}

.ds-slider-nav svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

.ds-slider-prev { left: 20px; }
.ds-slider-next { right: 20px; }

.ds-slider-dots {
	position: absolute;
	bottom: 28px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: 10px;
	z-index: 5;
}

.ds-slider-dots button {
	width: 10px;
	height: 10px;
	padding: 0;
	border-radius: 50%;
	border: 1px solid var(--ds-white);
	background: transparent;
	cursor: pointer;
}

.ds-slider-dots button.ds-active {
	background: var(--ds-white);
}

/* ==========================================================================
   Homepage: latest collection
   ========================================================================== */
.ds-collections {
	background: var(--ds-section);
	padding: 120px 0 96px;
}

.ds-collections-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: 24px;
}

.ds-collections-head .ds-section-title {
	font-size: 32px;
	text-transform: uppercase;
	letter-spacing: 3px;
	margin: 0;
}

/* ==========================================================================
   Product grid & cards (WooCommerce)
   Mirrors the original site: frameless cards, 3:4 images, title + price
   underneath, and a small cart icon that appears on the image on hover.
   ========================================================================== */
.woocommerce ul.products,
.ds-products {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	column-gap: 20px;
	row-gap: 40px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.woocommerce ul.products.columns-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.woocommerce ul.products.columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.woocommerce ul.products.columns-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.woocommerce ul.products.columns-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }

/* WooCommerce's clearfix pseudo-elements become grid items and would
   occupy the first cell of the grid — disable them. */
.woocommerce ul.products::before,
.woocommerce ul.products::after {
	content: none !important;
	display: none !important;
}

/* Product card — no outer frame, left-aligned text. */
.ds-product-card {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	margin: 0;
	padding: 0;
	text-align: left;
	background: transparent;
	border: 0;
}

.ds-product-card .ds-product-thumb {
	position: relative;
	overflow: hidden;
	background: var(--ds-gray);
}

.ds-product-card .ds-product-thumb img {
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	display: block;
	margin: 0;
	transition: transform 0.4s ease;
}

.ds-product-card:hover .ds-product-thumb img {
	transform: scale(1.04);
}

/* Sale badge — white pill at the top-left of the image. */
.ds-sale-flash {
	position: absolute;
	top: 1.5em;
	left: 1.5em;
	z-index: 3;
	background: var(--ds-white);
	color: var(--ds-text);
	font-size: 14px;
	font-weight: 500;
	line-height: normal;
	padding: 0.4em 0.8em;
	border-radius: 20px;
}

/* Hover cart button — icon at the top-right of the image. */
.ds-product-cart {
	position: absolute;
	top: 1em;
	right: 1em;
	z-index: 5;
	display: inline-flex;
	align-items: center;
	opacity: 0;
	visibility: hidden;
	transition: all 0.2s;
	cursor: pointer;
}

.ds-product-thumb:hover .ds-product-cart,
.ds-product-cart:focus {
	opacity: 1;
	visibility: visible;
}

.ds-cart-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 2em;
	height: 2em;
	border-radius: 50%;
	background: var(--ds-white);
	color: var(--ds-dark);
	opacity: 0.7;
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.15);
	transition: opacity 0.2s;
}

.ds-product-cart:hover .ds-cart-icon,
.ds-product-cart:focus .ds-cart-icon {
	opacity: 1;
}

.ds-cart-icon svg {
	fill: currentColor;
	display: block;
}

.ds-cart-tooltip {
	position: relative;
	background: var(--ds-dark);
	color: var(--ds-white);
	font-size: 13px;
	line-height: 1;
	white-space: nowrap;
	padding: 0.7em 0.9em;
	margin-right: 10px;
	border-radius: 3px;
	pointer-events: none;
}

.ds-cart-tooltip::after {
	content: "";
	position: absolute;
	top: 50%;
	margin-top: -5px;
	right: -10px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 5px;
	border-color: transparent transparent transparent var(--ds-dark);
}

/* Title & price. */
.ds-product-card .ds-product-title {
	font-family: var(--ds-font-head);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.3;
	margin: 18px 0 8px;
	padding: 0;
}

.ds-product-card .ds-product-title a {
	color: var(--ds-dark);
}

.ds-product-card .ds-product-title a:hover {
	color: var(--ds-brown);
}

.ds-product-card .ds-product-price,
.ds-product-card .price {
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ds-text);
	margin: 0 0 8px;
}

.ds-product-card .ds-product-price del,
.ds-product-card .price del {
	color: #999;
	font-weight: 400;
	margin-right: 6px;
}

.ds-product-card .ds-product-price ins,
.ds-product-card .price ins {
	text-decoration: none;
}

/* Loading state for the AJAX add-to-cart icon. */
.ds-product-cart.loading .ds-cart-icon {
	opacity: 1;
}

.ds-product-cart.loading .ds-cart-icon svg {
	display: none;
}

.ds-product-cart.loading .ds-cart-icon::after {
	content: "";
	width: 1em;
	height: 1em;
	border: 2px solid currentColor;
	border-top-color: transparent;
	border-radius: 50%;
	animation: ds-cart-spin 0.6s linear infinite;
}

@keyframes ds-cart-spin {
	to { transform: rotate(360deg); }
}

/* ==========================================================================
   Homepage: offer banner
   ========================================================================== */
.ds-offer {
	position: relative;
	min-height: 480px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	color: var(--ds-white);
	padding: 80px 20px;
}

.ds-offer::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--ds-dark);
	opacity: 0.55;
}

.ds-offer-inner {
	position: relative;
	z-index: 2;
	max-width: 720px;
}

.ds-offer-kicker {
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--ds-white);
	margin: 0 0 16px;
}

.ds-offer-title {
	font-size: 52px;
	line-height: 1.2;
	color: var(--ds-white);
	margin: 0 0 32px;
}

/* ==========================================================================
   Homepage: blog
   ========================================================================== */
.ds-posts {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
}

.ds-post-card {
	background: var(--ds-white);
}

.ds-post-card .ds-post-thumb {
	overflow: hidden;
}

.ds-post-card .ds-post-thumb img {
	width: 100%;
	transition: transform 0.4s ease;
}

.ds-post-card:hover .ds-post-thumb img {
	transform: scale(1.04);
}

.ds-post-card .ds-post-title {
	font-size: 22px;
	margin: 20px 0 10px;
}

.ds-post-card .ds-post-title a {
	color: var(--ds-dark);
}

.ds-post-card .ds-post-title a:hover {
	color: var(--ds-brown);
}

.ds-post-card .ds-post-excerpt {
	font-size: 15px;
	color: var(--ds-text);
	margin: 0;
}

.ds-post-meta {
	font-size: 13px;
	color: var(--ds-brown);
	margin-bottom: 6px;
}

/* ==========================================================================
   Homepage: service icons
   ========================================================================== */
.ds-services {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 30px;
}

.ds-service {
	display: flex;
	align-items: flex-start;
	gap: 18px;
	text-align: left;
}

.ds-service-icon {
	flex: 0 0 auto;
	width: 54px;
	height: 54px;
	border: 1px solid var(--ds-dark);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ds-dark);
}

.ds-service-icon svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

.ds-service-title {
	font-size: 22px;
	margin: 0 0 6px;
}

.ds-service-text {
	font-size: 15px;
	margin: 0;
}

/* ==========================================================================
   Homepage: newsletter
   ========================================================================== */
.ds-newsletter {
	background: var(--ds-cream);
	text-align: center;
	padding: 120px 0;
}

.ds-newsletter .ds-newsletter-inner {
	max-width: 640px;
	margin: 0 auto;
	padding: 0 20px;
}

.ds-collections-head .wp-block-group__inner-container {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	width: 100%;
}

.ds-collections-head .wp-block-group__inner-container > * {
	margin: 0;
}

.ds-newsletter-title {
	font-size: 32px;
	text-transform: uppercase;
	letter-spacing: 3px;
	margin: 0 0 12px;
}

.ds-newsletter-text {
	max-width: 560px;
	margin: 0 auto 28px;
}

.ds-newsletter-form {
	display: flex;
	max-width: 520px;
	margin: 0 auto;
	gap: 0;
}

.ds-newsletter-form input[type="email"] {
	flex: 1 1 auto;
	border: 1px solid var(--ds-dark);
	background: var(--ds-white);
	padding: 14px 16px;
	font-size: 14px;
}

.ds-newsletter-form button {
	flex: 0 0 auto;
	border: 1px solid var(--ds-dark);
	background: var(--ds-dark);
	color: var(--ds-white);
	font-weight: 600;
	font-size: 12px;
	letter-spacing: 1px;
	text-transform: uppercase;
	padding: 14px 26px;
	cursor: pointer;
}

.ds-newsletter-form button:hover {
	background: var(--ds-brown);
	border-color: var(--ds-brown);
}

.ds-form-note {
	font-size: 13px;
	margin-top: 14px;
}

.ds-form-note.ds-success {
	color: #2f7d4f;
}

.ds-form-note.ds-error {
	color: #b23b3b;
}

/* ==========================================================================
   Page & post content
   ========================================================================== */
.ds-page-header {
	background: #eeeeee;
	padding: 24px 0;
	text-align: center;
}

.ds-page-header .ds-page-title {
	font-size: 40px;
	font-weight: 600;
	line-height: 1.2;
	margin: 0;
	color: var(--ds-dark);
}

.ds-page-content {
	padding: 70px 0 120px;
}

.ds-entry-content > * {
	margin-bottom: 1.2em;
}

.ds-entry-content ul,
.ds-entry-content ol {
	padding-left: 1.4em;
}

.ds-entry-content li {
	margin-bottom: 0.4em;
}

.ds-article {
	margin-bottom: 60px;
}

.ds-article .ds-entry-title {
	font-size: 32px;
	margin: 0 0 10px;
}

.ds-article .ds-entry-title a {
	color: var(--ds-dark);
}

.ds-pagination {
	display: flex;
	gap: 8px;
	justify-content: center;
	margin-top: 50px;
}

.ds-pagination a,
.ds-pagination span {
	min-width: 42px;
	height: 42px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--ds-line);
	font-size: 14px;
	color: var(--ds-text);
	padding: 0 10px;
}

.ds-pagination a:hover,
.ds-pagination .current {
	background: var(--ds-dark);
	border-color: var(--ds-dark);
	color: var(--ds-white);
}

/* ==========================================================================
   WooCommerce: shop & archives
   ========================================================================== */
.woocommerce .woocommerce-notices-wrapper {
	padding: 0 20px;
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	border: 1px solid var(--ds-line);
	border-left: 4px solid var(--ds-dark);
	background: var(--ds-gray);
	padding: 14px 18px;
	margin: 20px 0;
	list-style: none;
	font-size: 14px;
}

.woocommerce-error {
	border-left-color: #b23b3b;
}

/* Shop / product archive layout: sidebar on the left (like the original). */
.ds-shop-layout {
	display: flex;
	gap: 50px;
	align-items: flex-start;
}

.ds-shop-content {
	flex: 1 1 auto;
	min-width: 0;
}

.ds-shop-sidebar {
	order: -1; /* visually first (left) while staying after the content in DOM order */
	flex: 0 0 24%;
	max-width: 300px;
	font-size: 14px;
	line-height: 2;
}

.ds-shop-sidebar .ds-widget {
	margin-bottom: 40px;
}

.ds-shop-sidebar .ds-widget:last-child {
	margin-bottom: 0;
}

.ds-shop-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 40px;
}

.woocommerce-result-count {
	font-size: 13px;
	color: var(--ds-text);
	margin: 0;
}

.woocommerce-ordering select {
	width: auto;
	min-width: 200px;
	padding: 9px 12px;
	font-size: 13px;
}

.ds-breadcrumbs {
	font-size: 13px;
	color: var(--ds-brown);
	margin-bottom: 20px;
}

.ds-breadcrumbs a {
	color: var(--ds-brown);
}

.ds-breadcrumbs a:hover {
	color: var(--ds-dark);
}

/* Sidebar widgets */
.ds-widget {
	margin-bottom: 40px;
}

.ds-widget .widget-title,
.ds-widget .widgettitle {
	font-family: var(--ds-font-head);
	font-size: 20px;
	font-weight: 600;
	margin: 0 0 18px;
	color: var(--ds-dark);
}

.ds-widget ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ds-widget ul li {
	margin-bottom: 8px;
	font-size: 14px;
}

.ds-widget ul li a {
	color: var(--ds-text);
}

.ds-widget ul li a:hover {
	color: var(--ds-brown);
}

.ds-widget .product_list_widget li {
	display: flex;
	gap: 12px;
	align-items: center;
	margin-bottom: 16px;
}

.ds-widget .product_list_widget img {
	width: 56px;
	flex: 0 0 56px;
}

/* Shop sidebar: product categories list (with counts). */
.ds-shop-sidebar .product-categories {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ds-shop-sidebar .product-categories li {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 4px;
}

.ds-shop-sidebar .product-categories .count {
	color: #999;
	font-size: 13px;
	white-space: nowrap;
}

.ds-shop-sidebar .product-categories .current-cat > a {
	color: var(--ds-brown);
	font-weight: 600;
}

/* Shop sidebar: WooCommerce price filter widget (legacy widget markup). */
.ds-shop-sidebar .widget_price_filter .widget-title {
	font-size: 32px;
}

.ds-shop-sidebar .price_slider_wrapper {
	margin-top: 10px;
}

.ds-shop-sidebar .price_slider {
	position: relative;
	height: 2px;
	background: #d8d8d8;
	margin: 22px 6px;
	border-radius: 0;
}

.ds-shop-sidebar .price_slider .ui-slider-range {
	position: absolute;
	top: 0;
	height: 2px;
	background: var(--ds-dark);
}

.ds-shop-sidebar .price_slider .ui-slider-handle {
	position: absolute;
	top: 50%;
	width: 14px;
	height: 14px;
	margin-top: -7px;
	margin-left: -7px;
	background: var(--ds-dark);
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	outline: none;
}

.ds-shop-sidebar .price_slider_amount .price_label {
	display: flex;
	justify-content: space-between;
	font-size: 13px;
	color: var(--ds-text);
	margin: 0 0 18px;
}

.ds-shop-sidebar .price_slider_amount .button {
	display: inline-block;
	font-family: var(--ds-font-body);
	font-weight: 600;
	font-size: 13px;
	line-height: 1;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--ds-dark);
	background: transparent;
	border: 1px solid var(--ds-dark);
	border-radius: 0;
	padding: 12px 28px;
	cursor: pointer;
}

.ds-shop-sidebar .price_slider_amount .button:hover,
.ds-shop-sidebar .price_slider_amount .button:focus {
	color: var(--ds-white);
	background: var(--ds-dark);
}

/* Shop sidebar: on-sale products block (Hottest Deals). */
.ds-shop-sidebar .wc-block-grid .wc-block-grid__product {
	text-align: left;
	margin-bottom: 24px;
}

.ds-shop-sidebar .wc-block-grid__product-image img {
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	background: var(--ds-gray);
}

.ds-shop-sidebar .wc-block-grid__product-title {
	font-family: var(--ds-font-head);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--ds-dark);
	margin: 12px 0 4px;
	padding: 0;
}

.ds-shop-sidebar .wc-block-grid__product-price {
	font-size: 14px;
	font-weight: 700;
	color: var(--ds-text);
}

.ds-shop-sidebar .wc-block-grid__product-price del {
	color: #999;
	font-weight: 400;
	margin-right: 6px;
}

.ds-shop-sidebar .wc-block-grid__product-onsale {
	top: 0.8em;
	left: auto;
	right: 0.8em;
	background: var(--ds-white);
	color: var(--ds-text);
	border-color: var(--ds-white);
	font-size: 12px;
}

/* ==========================================================================
   WooCommerce: single product
   ========================================================================== */
.ds-breadcrumb {
	font-size: 13px;
	color: var(--ds-brown);
	margin: 0 0 28px;
	letter-spacing: 0.02em;
}

.ds-breadcrumb a {
	color: var(--ds-text);
}

.ds-breadcrumb a:hover {
	color: var(--ds-brown);
}

.ds-single-product {
	display: flex;
	gap: 60px;
	align-items: flex-start;
}

.ds-product-gallery {
	flex: 0 0 55%;
}

.ds-product-gallery .woocommerce-product-gallery__image img {
	width: 100%;
	border: 1px solid var(--ds-line);
}

/* Thumbnail strip below the main image */
/* Neutralise WooCommerce's built-in "div.images / div.summary { width:48%; float }"
   so the gallery fills the 55% column and the main image stays large.
   IMPORTANT: only the gallery root may be forced to 100%. The inner
   .flex-viewport / .woocommerce-product-gallery__wrapper are controlled by
   FlexSlider (inline width: N00% + translate3d); clamping them breaks the
   slide mechanism so clicking a thumbnail shows an empty area. */
.ds-single-product .ds-product-gallery > .woocommerce-product-gallery {
	float: none !important;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
}

.ds-single-product .ds-product-summary {
	float: none !important;
	width: auto !important;
}

.ds-single-product .ds-product-gallery .woocommerce-product-gallery__image img {
	width: 100%;
	max-width: none;
}

.ds-single-product .ds-product-gallery ol.flex-control-thumbs {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr);
	gap: 12px;
	width: 100%;
	margin: 20px 0 0 !important;
	padding: 0 !important;
	list-style: none;
	overflow: visible;
}

.ds-single-product .ds-product-gallery ol.flex-control-thumbs li {
	float: none !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none;
}

.ds-single-product .ds-product-gallery ol.flex-control-thumbs img {
	display: block;
	width: 100% !important;
	height: auto;
	border: 1px solid var(--ds-line);
	opacity: 0.65;
	cursor: pointer;
	transition: opacity 0.2s ease, border-color 0.2s ease;
}

.ds-single-product .ds-product-gallery ol.flex-control-thumbs img:hover,
.ds-single-product .ds-product-gallery ol.flex-control-thumbs img.flex-active {
	opacity: 1;
	border-color: var(--ds-dark);
}

.ds-product-summary {
	flex: 1 1 auto;
}

.ds-product-summary .product_title {
	font-size: 40px;
	margin: 0 0 14px;
}

.ds-product-summary .price {
	font-size: 24px;
	color: var(--ds-dark);
	margin: 0 0 20px;
}

.ds-product-summary .price del {
	color: #999;
	font-size: 18px;
	margin-right: 8px;
}

.woocommerce-product-details__short-description {
	font-size: 15px;
	margin-bottom: 26px;
}

.woocommerce .ds-product-summary .quantity input {
	width: 70px;
	text-align: center;
	padding: 12px 8px;
}

.woocommerce .ds-product-summary button.button,
.woocommerce .ds-product-summary .single_add_to_cart_button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--ds-white);
	background: var(--ds-dark);
	border: 1px solid var(--ds-dark);
	border-radius: 0;
	padding: 15px 34px;
	cursor: pointer;
	margin-left: 10px;
}

.woocommerce .ds-product-summary button.button:hover,
.woocommerce .ds-product-summary .single_add_to_cart_button:hover {
	background: var(--ds-brown);
	border-color: var(--ds-brown);
	color: var(--ds-white);
}

.product_meta {
	font-size: 13px;
	color: var(--ds-brown);
	margin-top: 26px;
	border-top: 1px solid var(--ds-line);
	padding-top: 18px;
}

.product_meta > span {
	display: block;
	margin-bottom: 6px;
}

.woocommerce-tabs {
	margin-top: 70px;
}

.woocommerce-tabs ul.tabs {
	list-style: none;
	display: flex;
	gap: 26px;
	margin: 0 0 26px;
	padding: 0;
	border-bottom: 1px solid var(--ds-line);
}

.woocommerce-tabs ul.tabs li a {
	display: block;
	padding: 12px 0;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--ds-text);
	border-bottom: 2px solid transparent;
}

.woocommerce-tabs ul.tabs li.active a {
	color: var(--ds-dark);
	border-bottom-color: var(--ds-dark);
}

.woocommerce-Tabs-panel {
	font-size: 15px;
}

.woocommerce-Tabs-panel--description p {
	margin-bottom: 1em;
}

.woocommerce-Reviews .commentlist {
	list-style: none;
	margin: 0 0 30px;
	padding: 0;
}

.woocommerce-Reviews .commentlist li {
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--ds-line);
}

.woocommerce-Reviews .comment-form input,
.woocommerce-Reviews .comment-form textarea {
	margin-bottom: 12px;
}

.woocommerce-Reviews .comment-form .form-submit .submit {
	display: inline-block;
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--ds-white);
	background: var(--ds-dark);
	border: 1px solid var(--ds-dark);
	border-radius: 0;
	padding: 13px 28px;
	cursor: pointer;
	width: auto;
}

.woocommerce-Reviews .comment-form .form-submit .submit:hover {
	background: var(--ds-brown);
	border-color: var(--ds-brown);
}

.woocommerce-Reviews .stars a {
	color: var(--ds-brown);
}

.ds-related {
	margin-top: 80px;
}

.ds-related .ds-related-title {
	font-size: 32px;
	text-transform: uppercase;
	letter-spacing: 3px;
	text-align: center;
	margin: 0 0 40px;
}

/* ==========================================================================
   WooCommerce: classic product loop (shop, shortcodes, homepage grid)
   ========================================================================== */
.woocommerce ul.products {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr);
	gap: 30px;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* WooCommerce's clearfix pseudo-elements become grid items and would
   occupy the first/last cells of the grid — disable them. */
.woocommerce ul.products::before,
.woocommerce ul.products::after {
	content: none !important;
	display: none !important;
}

.woocommerce ul.products.columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.woocommerce ul.products.columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.woocommerce ul.products li.product {
	position: relative;
	text-align: center;
	background: var(--ds-white);
	margin: 0 !important;
	width: auto !important;
	float: none !important;
	clear: none !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .wc-block-grid__product-title {
	font-family: var(--ds-font-head);
	font-size: 20px;
	font-weight: 600;
	line-height: 1.3;
	margin: 18px 0 8px;
	color: var(--ds-dark);
	padding: 0;
}

.woocommerce ul.products li.product img {
	width: 100%;
	margin: 0;
	transition: transform 0.4s ease;
}

.woocommerce ul.products li.product:hover img {
	transform: scale(1.04);
}

.woocommerce ul.products li.product .price {
	font-size: 15px;
	color: var(--ds-text);
	margin: 0 0 14px;
}

.woocommerce ul.products li.product .price del {
	color: #999;
	margin-right: 6px;
}

.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart {
	display: inline-block;
	font-weight: 600;
	font-size: 12px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--ds-dark);
	background: transparent;
	border: 1px solid var(--ds-dark);
	border-radius: 0;
	padding: 10px 20px;
	cursor: pointer;
	margin-top: 4px;
}

.woocommerce ul.products li.product .button:hover,
.woocommerce ul.products li.product .added_to_cart:hover {
	color: var(--ds-white);
	background: var(--ds-dark);
}

.woocommerce ul.products li.product .onsale,
.woocommerce span.onsale {
	position: absolute;
	top: 12px;
	left: 12px;
	background: var(--ds-dark);
	color: var(--ds-white);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	padding: 5px 10px;
	z-index: 2;
	border-radius: 0;
	min-height: 0;
	line-height: 1.4;
	right: auto;
}

/* ==========================================================================
   Blocks: latest posts (blog section)
   ========================================================================== */
.ds-blog-section {
	padding: 120px 0;
}

.ds-blog-section .ds-section-head {
	margin-bottom: 48px;
}

.wp-block-latest-posts.ds-post-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.wp-block-latest-posts.ds-post-grid li {
	margin: 0;
	text-align: left;
}

.wp-block-latest-posts.ds-post-grid .wp-block-latest-posts__featured-image {
	margin-bottom: 24px;
	overflow: hidden;
	aspect-ratio: 388 / 300;
	background: var(--ds-section);
}

.wp-block-latest-posts.ds-post-grid .wp-block-latest-posts__featured-image a {
	display: block;
	height: 100%;
}

.wp-block-latest-posts.ds-post-grid .wp-block-latest-posts__featured-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	max-width: none;
	max-height: none;
	transition: transform 0.5s ease;
}

.wp-block-latest-posts.ds-post-grid li:hover .wp-block-latest-posts__featured-image img {
	transform: scale(1.05);
}

.wp-block-latest-posts.ds-post-grid .wp-block-latest-posts__post-title {
	font-family: var(--ds-font-head);
	font-size: 24px;
	font-weight: 600;
	line-height: 1.3;
	margin: 0 0 10px;
}

.wp-block-latest-posts.ds-post-grid .wp-block-latest-posts__post-title a {
	color: var(--ds-dark);
	text-decoration: none;
}

.wp-block-latest-posts.ds-post-grid .wp-block-latest-posts__post-title a:hover {
	color: var(--ds-brown);
}

.wp-block-latest-posts.ds-post-grid .wp-block-latest-posts__post-date {
	font-size: 12px;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--ds-brown);
	display: block;
	margin-bottom: 10px;
}

.wp-block-latest-posts.ds-post-grid .wp-block-latest-posts__post-excerpt {
	font-size: 15px;
	line-height: 1.7;
	color: var(--ds-text);
	margin: 0;
}

/* Service icons section */
.ds-services-section {
	padding: 0 0 120px;
}

.ds-services-section .ds-container {
	padding-top: 0;
}
.woocommerce table.shop_table {
	border: 1px solid var(--ds-line);
	border-radius: 0;
	font-size: 14px;
}

.woocommerce table.shop_table th {
	background: var(--ds-section);
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.woocommerce table.shop_table td {
	vertical-align: middle;
}

.woocommerce .product-thumbnail img {
	width: 72px;
}

.woocommerce a.remove {
	color: #b23b3b;
	font-size: 18px;
}

.woocommerce a.remove:hover {
	background: #b23b3b;
	color: var(--ds-white);
}

.woocommerce .quantity input {
	width: 64px;
	text-align: center;
	padding: 9px 6px;
}

.woocommerce .cart .button,
.woocommerce .cart input.button,
.woocommerce .checkout-button,
.woocommerce .button.wc-backward,
.woocommerce .woocommerce-form-login .button,
.woocommerce .woocommerce-form-register .button,
.woocommerce .woocommerce-MyAccount-content .button,
.woocommerce .woocommerce-button {
	display: inline-block;
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--ds-white);
	background: var(--ds-dark);
	border: 1px solid var(--ds-dark);
	border-radius: 0;
	padding: 14px 30px;
	cursor: pointer;
	width: auto;
}

.woocommerce .cart .button:hover,
.woocommerce .checkout-button:hover,
.woocommerce .button.wc-backward:hover,
.woocommerce .woocommerce-form-login .button:hover,
.woocommerce .woocommerce-MyAccount-content .button:hover {
	background: var(--ds-brown);
	border-color: var(--ds-brown);
	color: var(--ds-white);
}

.woocommerce .cart-collaterals {
	margin-top: 40px;
}

.woocommerce .cart-collaterals .cart_totals {
	background: var(--ds-section);
	padding: 30px;
}

.woocommerce .cart-collaterals .cart_totals h2 {
	font-size: 24px;
	margin: 0 0 18px;
}

.woocommerce .cart-collaterals .cart_totals .shop_table {
	border: 0;
}

.woocommerce .cart-collaterals .cart_totals .shop_table th,
.woocommerce .cart-collaterals .cart_totals .shop_table td {
	border: 0;
	border-bottom: 1px solid var(--ds-line);
	background: transparent;
	padding: 10px 0;
}

.woocommerce .cross-sells {
	margin-top: 40px;
}

.woocommerce-form-coupon-toggle,
.woocommerce-form-login-toggle {
	font-size: 14px;
}

.woocommerce-checkout .form-row {
	margin-bottom: 16px;
}

.woocommerce-checkout label {
	font-size: 13px;
	font-weight: 600;
	display: block;
	margin-bottom: 6px;
}

.woocommerce-checkout .select2-container--default .select2-selection--single {
	border: 1px solid var(--ds-line);
	border-radius: 0;
	height: 44px;
	padding: 7px 12px;
}

.woocommerce-checkout #order_review_heading,
.woocommerce-checkout h3 {
	font-size: 24px;
	margin: 30px 0 16px;
}

.woocommerce #payment {
	background: var(--ds-section);
	padding: 24px;
}

.woocommerce #payment ul.payment_methods {
	list-style: none;
	margin: 0 0 16px;
	padding: 0;
}

.woocommerce #payment ul.payment_methods li {
	margin-bottom: 10px;
	font-size: 14px;
}

.woocommerce #payment div.payment_box {
	font-size: 13px;
	color: var(--ds-brown);
	margin: 6px 0;
}

.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0 0 30px;
	padding: 0;
	border: 1px solid var(--ds-line);
}

.woocommerce-MyAccount-navigation ul li a {
	display: block;
	padding: 13px 18px;
	font-size: 14px;
	color: var(--ds-text);
	border-bottom: 1px solid var(--ds-line);
}

.woocommerce-MyAccount-navigation ul li:last-child a {
	border-bottom: 0;
}

.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li a:hover {
	background: var(--ds-section);
	color: var(--ds-dark);
}

.woocommerce-MyAccount-content {
	font-size: 15px;
}

.woocommerce .woocommerce-customer-details address {
	font-size: 14px;
	line-height: 1.8;
	border: 1px solid var(--ds-line);
	padding: 18px;
}

/* ==========================================================================
   Contact page
   ========================================================================== */
.ds-contact-layout {
	display: flex;
	gap: 60px;
	align-items: flex-start;
}

.ds-contact-info {
	flex: 0 0 320px;
}

.ds-contact-info h3 {
	font-size: 24px;
	margin: 0 0 16px;
}

.ds-contact-info p {
	font-size: 15px;
}

.ds-contact-form {
	flex: 1 1 auto;
}

.ds-contact-form .ds-field {
	margin-bottom: 16px;
}

.ds-contact-form label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	margin-bottom: 6px;
}

/* ==========================================================================
   Footer
   ========================================================================== */
.ds-footer {
	background: var(--ds-dark);
	color: var(--ds-white);
	font-size: 14px;
}

.ds-footer a {
	color: var(--ds-white);
}

.ds-footer a:hover {
	color: var(--ds-gray);
}

.ds-footer-top {
	padding: 45px 0;
}

.ds-footer-columns {
	max-width: var(--ds-narrow-container);
	margin: 0 auto;
	padding: 0 20px;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 40px;
	align-items: flex-start;
}

.ds-footer-column .widget,
.ds-footer-column .ds-widget {
	margin-bottom: 30px;
}

.ds-footer-column .widget-title,
.ds-footer-column .widgettitle {
	font-family: var(--ds-font-head);
	font-size: 20px;
	font-weight: 600;
	color: var(--ds-white);
	margin: 0 0 18px;
}

.ds-footer-column ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ds-footer-column ul li {
	margin-bottom: 10px;
}

.ds-footer-brand img {
	width: 58px;
	height: auto;
	margin-bottom: 14px;
}

.ds-footer-brand p {
	font-size: 14px;
	line-height: 1.7;
	color: var(--ds-white);
}

.ds-social {
	display: flex;
	gap: 12px;
	margin-top: 10px;
}

.ds-social a {
	display: inline-flex;
	width: 20px;
	height: 20px;
	color: var(--ds-gray);
}

.ds-social a:hover {
	color: var(--ds-white);
}

.ds-social svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

.ds-footer-bottom {
	border-top: 1px solid #4c4555;
	background: var(--ds-dark);
}

.ds-footer-bottom-inner {
	max-width: var(--ds-narrow-container);
	margin: 0 auto;
	padding: 20px;
	min-height: 80px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
}

.ds-footer-copyright {
	font-size: 13px;
	color: var(--ds-white);
}

.ds-footer-menu ul {
	list-style: none;
	display: flex;
	gap: 22px;
	margin: 0;
	padding: 0;
}

.ds-footer-menu ul li a {
	font-size: 13px;
	color: var(--ds-white);
}

.ds-footer-menu ul li a:hover {
	color: var(--ds-beige);
}

/* Footer contrast fix: widget link rules (.ds-widget ul li a) are more
   specific than .ds-footer a and would paint dark text on the dark footer. */
.ds-footer .ds-widget ul li a,
.ds-footer-column ul li a,
.ds-footer .textwidget,
.ds-footer .textwidget p,
.ds-footer .ds-widget p,
.ds-footer .ds-widget,
.ds-footer .ds-widget .textwidget {
	color: var(--ds-white);
}

.ds-footer .ds-widget ul li a:hover,
.ds-footer-column ul li a:hover {
	color: var(--ds-beige);
}

.ds-footer .ds-widget ul li a:hover,
.ds-footer-column ul li a:hover {
	opacity: 1;
}

/* ==========================================================================
   Blocks (core block editor output)
   ========================================================================== */
.wp-block-button__link,
.wp-block-file__button {
	display: inline-block;
	font-weight: 600;
	font-size: 13px;
	line-height: 1;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--ds-dark);
	background: transparent;
	border: 1px solid var(--ds-dark);
	border-radius: 0;
	padding: 15px 30px;
}

.wp-block-button__link:hover,
.wp-block-button__link:focus {
	color: var(--ds-white);
	background: var(--ds-dark);
	border-color: var(--ds-dark);
}

.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--ds-dark);
	border: 1px solid var(--ds-dark);
}

/* Theme button classes used on block-editor buttons.
   The link-specificity rules must win over the generic .wp-block-button__link
   rule above (equal specificity, but these come later). */
.wp-block-button__link.ds-btn--white {
	color: var(--ds-dark);
	background: var(--ds-white);
	border-color: var(--ds-white);
}

.wp-block-button__link.ds-btn--white:hover,
.wp-block-button__link.ds-btn--white:focus {
	color: var(--ds-dark);
	background: var(--ds-gray);
	border-color: var(--ds-gray);
}

.wp-block-button__link.ds-btn--solid {
	color: var(--ds-white);
	background: var(--ds-dark);
	border-color: var(--ds-dark);
}

.wp-block-button__link.ds-btn--solid:hover,
.wp-block-button__link.ds-btn--solid:focus {
	color: var(--ds-dark);
	background: transparent;
}

.wp-block-button__link.ds-btn--small {
	padding: 11px 22px;
	font-size: 11px;
}

/* Safety net: if a ds-btn class ever lands on the button wrapper div again,
   neutralise it so the button does not render a double frame. */
.wp-block-button.ds-btn,
.wp-block-button.ds-btn--white,
.wp-block-button.ds-btn--solid,
.wp-block-button.ds-btn--small {
	border: 0;
	padding: 0;
	background: transparent;
}

.wp-block-columns {
	gap: 30px;
}

.wp-block-image img {
	display: block;
}

.alignleft {
	float: left;
	margin: 0 1.5em 1em 0;
}

.alignright {
	float: right;
	margin: 0 0 1em 1.5em;
}

.aligncenter {
	margin-left: auto;
	margin-right: auto;
}

/* ==========================================================================
   Collections / About page helpers
   ========================================================================== */
.ds-collection-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}

.ds-collection-item {
	position: relative;
	display: block;
	overflow: hidden;
}

.ds-collection-item img {
	width: 100%;
	transition: transform 0.4s ease;
}

.ds-collection-item:hover img {
	transform: scale(1.05);
}

.ds-collection-caption {
	position: absolute;
	inset: auto 0 0 0;
	padding: 40px 20px 18px;
	background: linear-gradient(to top, rgba(38, 34, 47, 0.65), rgba(38, 34, 47, 0));
	color: var(--ds-white);
	font-family: var(--ds-font-head);
	font-size: 20px;
	font-weight: 600;
	text-align: center;
}

.ds-about-layout {
	display: flex;
	gap: 60px;
	align-items: flex-start;
}

.ds-about-layout .ds-about-media {
	flex: 0 0 40%;
}

.ds-about-layout .ds-about-media img {
	width: 100%;
}

.ds-about-body {
	flex: 1 1 auto;
}

.ds-about-signature img {
	max-width: 200px;
	margin-top: 10px;
}

.ds-testimonials {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 30px;
	margin-top: 60px;
}

.ds-testimonial {
	text-align: center;
}

.ds-testimonial img {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	object-fit: cover;
	margin: 0 auto 14px;
}

.ds-testimonial .ds-testimonial-name {
	font-size: 18px;
	margin: 0 0 6px;
}

.ds-testimonial .ds-testimonial-text {
	font-size: 14px;
	font-style: italic;
}

.ds-brand-row {
	display: flex;
	flex-wrap: wrap;
	gap: 40px;
	align-items: center;
	justify-content: center;
	margin-top: 60px;
	opacity: 0.75;
}

.ds-brand-row img {
	max-height: 40px;
	width: auto;
}

/* ==========================================================================
   404
   ========================================================================== */
.ds-404 {
	text-align: center;
	padding: 120px 20px;
}

.ds-404 .ds-404-title {
	font-size: 110px;
	margin: 0 0 10px;
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1200px) {
	.ds-slide-title { font-size: 72px; }
	.woocommerce ul.products,
	.ds-products { column-gap: 16px; row-gap: 30px; }
}

@media (max-width: 921px) {
	body { font-size: 15px; }
	h1 { font-size: 48px; }
	h2 { font-size: 40px; }
	h3 { font-size: 26px; }
	h4 { font-size: 22px; }
	h5 { font-size: 18px; }
	h6 { font-size: 14px; }

	.ds-header-nav { display: none; }
	.ds-nav-toggle { display: inline-flex; }

	.ds-header-main-inner {
		min-height: 72px;
		padding-left: 20px;
		padding-right: 20px;
	}

	.ds-header-logo { flex: 1 1 auto; }
	.ds-header-logo img { width: 150px; max-width: 150px; }
	.ds-header-actions { flex: 0 0 auto; }

	.ds-slide {
		min-height: 59vh;
		background-position: 50vw 0;
		background-size: cover;
	}

	.ds-slide-title { font-size: 40px; }
	.ds-slide-subtitle { font-size: 18px; }
	.ds-slide-content { max-width: 60%; }

	.ds-section { padding: 70px 0; }
	.ds-collections { padding: 64px 0; }
	.ds-offer { min-height: 320px; padding: 60px 20px; }
	.ds-offer-title { font-size: 40px; }

	.woocommerce ul.products,
	.ds-products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ds-posts { grid-template-columns: 1fr; }
	.wp-block-latest-posts.ds-post-grid { grid-template-columns: repeat(2, 1fr); gap: 30px; }
	.ds-services { grid-template-columns: 1fr; }
	.ds-collection-grid { grid-template-columns: repeat(2, 1fr); }
	.ds-testimonials { grid-template-columns: repeat(2, 1fr); }

	/* Sidebar drops below the shop content on tablet & mobile. */
	.ds-shop-layout { flex-direction: column; gap: 40px; }
	.ds-shop-sidebar { order: 0; flex: 1 1 auto; width: 100%; max-width: none; }

	.ds-single-product { flex-direction: column; }
	.ds-product-gallery { flex: 1 1 auto; width: 100%; }

	.ds-contact-layout { flex-direction: column; }
	.ds-contact-info { flex: 1 1 auto; width: 100%; }

	.ds-about-layout { flex-direction: column; }
	.ds-about-layout .ds-about-media { flex: 1 1 auto; width: 100%; max-width: 480px; }

	.ds-footer-columns { grid-template-columns: repeat(2, 1fr); }
	.ds-footer-bottom-inner { flex-direction: column; text-align: center; }
}

@media (max-width: 544px) {
	body { font-size: 14px; }
	h1 { font-size: 36px; }
	h2 { font-size: 32px; }
	h3 { font-size: 24px; }
	h4 { font-size: 20px; }
	h5 { font-size: 16px; }
	h6 { font-size: 13px; }

	.ds-slide-title { font-size: 32px; }
	.ds-slide-subtitle { font-size: 15px; }
	.ds-slide-content { max-width: 100%; }
	.ds-slider-nav { width: 38px; height: 38px; }
	.ds-slider-prev { left: 8px; }
	.ds-slider-next { right: 8px; }

	.ds-collections-head { flex-direction: column; align-items: flex-start; gap: 14px; }
	.woocommerce ul.products,
	.ds-products { grid-template-columns: 1fr; }
	.wp-block-latest-posts.ds-post-grid { grid-template-columns: 1fr; gap: 34px; }
	.ds-collection-grid { grid-template-columns: 1fr; }
	.ds-testimonials { grid-template-columns: 1fr; }
	.ds-footer-columns { grid-template-columns: 1fr; }
	.ds-newsletter-form { flex-direction: column; gap: 10px; }
	.ds-shop-toolbar { flex-direction: column; align-items: flex-start; }
	.ds-page-header { padding: 20px 0; }
	.ds-page-header .ds-page-title { font-size: 32px; }
	.ds-404 .ds-404-title { font-size: 64px; }
}
