/*
Theme Name: Aksh Clothing
Theme URI: https://astylio.com
Author: Aksh Clothing Dev
Author URI: https://astylio.com
Description: Child theme for Storefront. Custom e-commerce build.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
Template: storefront
Text Domain: aksh-clothing
*/

/* ==========================================================================
   AKSH CLOTHING — DESIGN SYSTEM
   Source of truth: DESIGN-SYSTEM.md / openspec change aksh-clothing-design-system
   Sections (design.md D1):
     1  Tokens           4  Header / nav / mega   7  Homepage
     2  Base / type      5  Buttons               8  Footer
     3  Container        6  Product cards / grid  9  Media queries
   ========================================================================== */


/* --------------------------------------------------------------------------
   2. BASE / TYPOGRAPHY  (DESIGN-SYSTEM.md §2, §3)
   -------------------------------------------------------------------------- */
body {
	background-color: var(--color-bg-page);
	color: var(--color-text-primary);
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-weight: 400;
	line-height: 1.6;
	font-size: var(--astylio-fs-body-md);
	letter-spacing: 0.01em;
}

/* Flat imagery — no default rounding (Storefront rounds img at 3px). */
img {
	border-radius: var(--astylio-radius-sm);
}

h1, h2, h3, h4, h5, h6 {
	color: var(--color-text-primary);
	font-weight: 700;          /* major headings */
	letter-spacing: -0.02em;
	clear: both;
}

h1, .alpha { font-weight: 700; letter-spacing: -0.03em; }
h2, .beta  { font-weight: 700; letter-spacing: -0.025em; }
h3, .gamma { font-weight: 600; }
h4, .delta { font-weight: 600; }

a { color: var(--color-text-primary); text-decoration: none; }
a:hover { color: var(--color-text-primary); opacity: 0.8; }

/* --------------------------------------------------------------------------
   3. CONTAINER  (whitespace-led, edge-to-edge feel)
   -------------------------------------------------------------------------- */
.col-full {
	max-width: var(--astylio-container-xl);
}

::selection {
	background: var(--color-text-primary);
	color: var(--color-text-inverse);
}

/* --------------------------------------------------------------------------
   4. HEADER, NAVIGATION, MEGA MENU  (DESIGN-SYSTEM.md §4, §5)
   -------------------------------------------------------------------------- */

/* Announcement bar — rendered above #masthead via storefront_before_header. */

/* Header row — ≈72px, logo / nav / actions. */
.aksh-header.site-header {
	position: fixed;                /* sticky on all pages */
	top: 44px;                      /* below the fixed promo bar */
	left: 0;
	width: 100%;
	z-index: 1000;
	background-color: var(--color-bg-surface);
	color: var(--color-text-primary);
	border-bottom: 1px solid var(--color-border-default);
	padding-top: 0;
	padding-bottom: 0;
	margin-bottom: 0;
}

.aksh-header-inner {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	min-height: 72px;
	padding: 0.5em 0;
}

.aksh-header-logo { display: flex; align-items: center; }

/* Logo / site title (DESIGN-SYSTEM.md §4 "Logo"). */
.site-header .aksh-header-logo .site-branding {
	width: auto;
	float: none;
	margin: 0;
	display: block;
}

.site-header .aksh-header-logo .site-title {
	font-size: 27px;
	font-weight: 600;
	letter-spacing: -0.04em;
	line-height: 1;
	margin: 0;
}

.site-header .aksh-header-logo .site-title a {
	color: var(--color-text-primary);
	font-weight: 600;
}

.site-header .aksh-header-logo .site-title a:hover { opacity: 0.7; }

.site-header .aksh-header-logo .site-description { display: none; }

/* Remove the brand TEXT; keep a custom logo image (if one is set). */
.site-header .aksh-header-logo .site-title { display: none; }
.site-header .aksh-header-logo .custom-logo { display: block; }

/* Navigation — spacious, small, clean. */
.aksh-header-nav {
	display: flex;
	align-items: center;
	justify-self: center;
}

.aksh-header-nav .main-navigation {
	width: auto;
	float: none;
	clear: none;
	display: flex;
	align-items: center;
}

/* Desktop menu list — 34px breathing room (DESIGN-SYSTEM.md §4). */
.aksh-header-nav .main-navigation .primary-navigation > ul.menu {
	display: flex;
	flex-wrap: wrap;
	gap: 34px;
	margin: 0;
	padding: 0;
}

.aksh-header-nav .main-navigation ul.menu > li {
	margin: 0;
}

.aksh-header-nav .main-navigation ul.menu > li > a {
	padding: 0.5em 0;
	font-size: var(--astylio-fs-body-md);
	font-weight: 400;
	color: var(--color-text-primary);
	line-height: 1.2;
	display: inline-block;
}

.aksh-header-nav .main-navigation ul.menu > li > a:hover {
	color: var(--color-text-primary);
	opacity: 0.6;              /* no thick underlines — just a fade (D5) */
}

/* Active item — 1px bottom border in #171717 (D5). */
.aksh-header-nav .main-navigation ul.menu > li.current-menu-item > a {
	border-bottom: 1px solid var(--color-text-primary);
	padding-bottom: calc(0.5em - 1px);
	opacity: 1;
}

/* Suppress Storefront's caret arrow on top-level items (incl. dropdown roots). */
.aksh-header-nav .main-navigation ul.menu > li.menu-item-has-children::after {
	display: none;
}

/* Dropdown menu — simple, compact, positioned directly below its parent item. */
.aksh-header-nav ul.aksh-nav > li.aksh-dropdown-root {
	position: relative;
}

.aksh-dropdown {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 200px;
	background: var(--color-bg-surface);
	border: 1px solid var(--color-border-default);
	box-shadow: none;
	margin: 0;
	padding: 0.5em 0;
	list-style: none;
	z-index: 998;
}

.aksh-dropdown-item a {
	display: block;
	padding: 0.5em 1.2em;
	font-size: var(--astylio-fs-body-sm);
	font-weight: 400;
	color: var(--color-text-secondary);
	background: var(--color-bg-surface);
	white-space: nowrap;
}

.aksh-dropdown-item a:hover {
	color: var(--color-brand-primary);
	background: var(--color-bg-page);
}

/* Open on hover and keyboard focus (desktop only; mobile uses the drawer). */
@media (min-width: 769px) {
	.aksh-header-nav ul.aksh-nav > li.aksh-dropdown-root:hover > .aksh-dropdown,
	.aksh-header-nav ul.aksh-nav > li.aksh-dropdown-root:focus-within > .aksh-dropdown {
		display: block;
	}
}

/* Header actions — search / account / bag on the right. */
.aksh-header-actions {
	display: flex;
	align-items: center;
	justify-self: end;
	gap: 2px;
}

.aksh-header-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;               /* generous clickable area (visible icon stays ~21px) */
	height: 40px;
	padding: 0;
	background: transparent;
	border: 0;
	color: var(--color-text-primary);
	transition: color 0.2s ease, opacity 0.2s ease;
}

.aksh-header-icon svg {
	width: 21px;
	height: 21px;
}

/* Cart count badge — small, subtle, never dominates the icon. */
.aksh-header-cart { position: relative; }
.aksh-cart-count {
	position: absolute;
	top: 3px;
	right: 2px;
	min-width: 15px;
	height: 15px;
	padding: 0 4px;
	border-radius: 50%;
	background: var(--color-text-primary);
	color: #fff;
	font-size: 10px;
	line-height: 15px;
	text-align: center;
	pointer-events: none;
}

/* ── Inline expanding search ────────────────────────────────────────── */
.aksh-inline-search {
	display: flex;
	align-items: center;
	gap: 0;
}
.aksh-inline-search__form {
	display: flex;
	align-items: center;
	overflow: hidden;
	max-width: 0;
	opacity: 0;
	transition: max-width 0.35s cubic-bezier(0.22, 1, 0.36, 1),
	            opacity 0.25s ease;
}
.aksh-inline-search.is-open .aksh-inline-search__form {
	max-width: 220px;
	opacity: 1;
}
.aksh-inline-search__input {
	width: 180px;
	height: 40px;
	padding: 0 0.75em;
	margin-right: 0;
	border: 1px solid var(--color-border-default);
	border-radius: var(--astylio-radius-md, 6px);
	background: var(--color-bg-page);
	color: var(--color-text-primary);
	font-family: var(--astylio-font-ui, 'Poppins', sans-serif);
	font-size: 14px;
	line-height: 1;
	outline: none;
	transition: border-color 0.2s ease;
}
.aksh-inline-search__input:focus {
	border-color: var(--color-border-focus);
}
.aksh-inline-search__input::placeholder {
	color: var(--color-text-muted, #A89B91);
}

/* ── Desktop alignment: normalize header action height + SVG display ── */
.aksh-header-actions {
	display: flex;
	align-items: center;
	gap: 0;
}
.aksh-header-actions .aksh-header-icon svg,
.aksh-header-actions .aksh-inline-search .aksh-header-icon svg {
	display: block;
}

/* Hide the old full-width search panel (replaced by inline search). */
.aksh-search-panel {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	background: var(--color-bg-page);
	border-top: 1px solid var(--color-border-default);
	padding: 1.25em 1.5em 1.5em;
	z-index: 998;
	box-shadow: none;
}
.aksh-search-panel.is-open { display: block; }
.aksh-search-panel .widget { margin: 0; }
.aksh-search-panel .woocommerce-product-search {
	display: flex;
	gap: 0.5em;
	max-width: 1200px;
	margin: 0 auto;
}
.aksh-search-panel .search-field {
	width: 100%;
	padding: 0.65em 1em;
	border: 1px solid var(--color-border-default);
	border-radius: var(--astylio-radius-md);
	background: var(--color-bg-page);
	color: var(--color-text-primary);
	font-size: 15px;
	box-shadow: none;
}
.aksh-search-panel input[type="submit"],
.aksh-search-panel button[type="submit"] {
	background: var(--color-brand-primary);
	color: var(--color-text-inverse);
	border: 1px solid var(--color-brand-primary);
	border-radius: var(--astylio-radius-md);
	padding: 0 22px;
	font-weight: 500;
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease;
}
.aksh-search-panel button[type="submit"]:hover,
.aksh-search-panel input[type="submit"]:hover {
	background: var(--color-text-inverse);
	color: var(--color-brand-primary);
}
/* Mobile toggle — keep it compact and on-palette. */
button.menu-toggle {
	background: none;
	border: 0;
	color: var(--color-text-primary);
	min-height: auto;
	padding: 0.6em 0.625em 0.6em 2.4em;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

button.menu-toggle:hover { background: none; color: var(--color-text-primary); opacity: 0.6; }

/* Handheld (mobile drawer) menu colors. */
.handheld-navigation {
	background: var(--color-bg-page);
	color: var(--color-text-primary);
}

.handheld-navigation ul.menu li a {
	color: var(--color-text-primary);
	font-size: 15px;
	font-weight: 400;
	padding: 0.85em 0;
}

.handheld-navigation ul.menu li.current-menu-item > a {
	border-bottom: 1px solid var(--color-text-primary);
}

.handheld-navigation ul.menu li .sub-menu a {
	color: var(--color-text-secondary);
}

/* Storefront handheld bottom bar — on-palette. */
.storefront-handheld-footer-bar {
	background: var(--color-bg-page);
	border-top: 1px solid var(--color-border-default);
}

.storefront-handheld-footer-bar ul li > a {
	color: var(--color-text-primary);
}

.storefront-handheld-footer-bar ul li.search.active .site-search,
.storefront-handheld-footer-bar ul li > a:hover {
	background: var(--color-bg-surface);
}

/* --------------------------------------------------------------------------
   5. BUTTONS  (DESIGN-SYSTEM.md §7 — square, black, minimal)
   -------------------------------------------------------------------------- */
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.button,
a.button,
a.button.alt,
.button.alt,
button.alt,
input[type="submit"].alt,
.added_to_cart,
.wp-block-button__link,
.wc-block-components-button:not(.is-link),
.wc-block-grid__products .wc-block-grid__product .wp-block-button__link,
.aksh-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 0 28px;
	background-color: var(--color-brand-primary);
	color: var(--color-text-inverse);
	border: 1px solid var(--color-brand-primary);
	border-radius: var(--astylio-radius-md);   /* square — no pills */
	font-size: 14px;
	font-weight: 500;
	line-height: 1.2;
	text-decoration: none;
	text-shadow: none;
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
	-webkit-appearance: none;
}

button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
.button:hover,
a.button:hover,
a.button.alt:hover,
.button.alt:hover,
button.alt:hover,
.added_to_cart:hover,
.wp-block-button__link:hover,
.wc-block-components-button:not(.is-link):hover,
.wc-block-grid__products .wc-block-grid__product .wp-block-button__link:hover,
.aksh-button:hover {
	background-color: var(--color-text-inverse);
	color: var(--color-brand-primary);
	border-color: var(--color-brand-primary);
	opacity: 1;              /* invert, not fade */
}

button:focus,
.button:focus,
a.button:focus,
.aksh-button:focus,
input:focus,
textarea:focus,
select:focus {
	outline: 2px solid var(--color-text-primary);
	outline-offset: 2px;
}

/* Keep the search submit hidden (Storefront clips it via screen-reader rules). */

/* Quantity stepper inputs — flat, no insets. */
.woocommerce .quantity .qty,
.woocommerce-page .quantity .qty {
	border: 1px solid var(--color-border-default);
	border-radius: 0;
	background: var(--color-bg-page);
	box-shadow: none;
	color: var(--color-text-primary);
}

/* --------------------------------------------------------------------------
   6. PRODUCT CARDS & GRID  (DESIGN-SYSTEM.md §6)
   -------------------------------------------------------------------------- */

/* Flat product grid — 4 desktop / 3 tablet / 2 mobile, tiny gaps. */
.woocommerce ul.products,
.woocommerce-page ul.products,
ul.products,
.wc-block-grid__products {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--astylio-space-5);
	margin: 0 0 1em;
	padding: 0;
	list-style: none;
}

/* Neutralise Storefront's float/width layout for every context it ships in. */
ul.products li.product,
ul.products .wc-block-grid__product,
.wc-block-grid__products li.product,
.wc-block-grid__products .wc-block-grid__product,
.page-template-template-fullwidth-php .site-main ul.products li.product,
.page-template-template-homepage-php .site-main ul.products li.product,
.storefront-full-width-content .site-main ul.products li.product,
.storefront-full-width-content .header-widget-region ul.products li.product,
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	width: auto;
	float: none;
	margin: 0;
	clear: none;
	padding: 0;
	text-align: left;
	position: relative;
	list-style: none;
	border-radius: var(--astylio-radius-sm);
	box-shadow: none;             /* flat cards — no shadows (D11) */
}

/* Flat product card content (child woocommerce/content-product.php). */
a.aksh-card-link {
	display: block;
	text-decoration: none;
	position: relative;
}

a.aksh-card-link:hover { opacity: 1; }

.aksh-card-media {
	position: relative;
	display: block;
	overflow: hidden;
	background: var(--color-bg-surface);
}

/* High-specificity margin reset beats Storefront's loop-image margin. */
ul.products li.product a.aksh-card-link .aksh-card-media img {
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
	border-radius: var(--astylio-radius-sm);
}

/* Secondary image — hidden, cross-fades in ≤0.3s on card hover (§6). */
.aksh-card-media .aksh-card-img-secondary {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	margin: 0;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.aksh-card-link:hover .aksh-card-img-secondary {
	opacity: 1;
}

/* Card meta: title + price only, 14px/500 (§6). */
.aksh-card-meta {
	display: block;
	margin-top: 0.9em;
}

.aksh-card-title {
	display: block;
	font-size: 14px;
	font-weight: 500;
	color: var(--color-text-primary);
	line-height: 1.4;
	margin: 0 0 0.15em;
}

.aksh-card-price {
	display: block;
	font-size: 14px;
	font-weight: 500;
	color: var(--color-text-primary);
	margin: 0;
}

.aksh-card-price .amount { color: var(--color-text-primary); }

.aksh-card-price del {
	opacity: 0.6;
	margin-right: 0.4em;
}

.aksh-card-price ins {
	background: transparent;
	text-decoration: none;
}

/* No rating row and no in-card add-to-cart (spec Product cards). */
ul.products li.product .star-rating,
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product .price,
ul.products li.product .button,
ul.products li.product .add_to_cart_button,
ul.products li.product .added_to_cart {
	display: none;
}

/* Sale flash — flat black tag, positioned within the media block. */
.woocommerce ul.products li.product .onsale,
.woocommerce-page ul.products li.product .onsale,
ul.products li.product .onsale,
.wc-block-grid__product .onsale,
.single-product .product .onsale {
	position: absolute;
	top: 0.75em;
	left: 0.75em;
	z-index: 2;
	background: var(--color-brand-primary);
	color: var(--color-text-inverse);
	border-radius: var(--astylio-radius-md);
	min-height: auto;
	min-width: auto;
	padding: 0.3em 0.7em;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	line-height: 1.4;
	box-shadow: none;
	margin: 0;
}

/* ── Desktop two-column layout (≥1024px) ──────────────────────── */
@media (min-width: 1024px) {
	/* Scope to the MAIN product container (DIV.product) only.
	   .related .product are <li> descendants, so using div.product
	   prevents the two-column grid from collapsing related cards. */
	.single-product div.product {
		display: grid;
		grid-template-columns: minmax(0, 1.15fr) minmax(340px, 1fr);
		gap: 48px;
		align-items: start;
	}

	.single-product div.product .aksh-product-gallery {
		grid-column: 1;
	}

	.single-product div.product .summary.entry-summary {
		grid-column: 2;
	}

	.single-product div.product .related.products,
	.single-product div.product .storefront-product-pagination {
		grid-column: 1 / -1;
	}

	/* Move thumbnails to LEFT of main image */
	.single-product div.product .aksh-gallery-thumbs {
		order: -1;
	}
}

/* Pagination — flush with palette. */
.woocommerce-pagination,
.pagination {
	border-color: var(--color-border-default);
	box-shadow: none;
}

.woocommerce-pagination .page-numbers li .page-numbers {
	background: var(--color-bg-page);
	color: var(--color-text-secondary);
	border: 1px solid var(--color-border-default);
	border-radius: 0;
	margin: 0 0.15em;
	padding: 0.45em 0.9em;
}

.woocommerce-pagination .page-numbers li .page-numbers.current {
	background: var(--color-text-primary);
	border-color: var(--color-text-primary);
	color: var(--color-text-inverse);
}

/* --------------------------------------------------------------------------
   7. HOMEPAGE SECTIONS  (DESIGN-SYSTEM.md §9)
   -------------------------------------------------------------------------- */
.aksh-homepage .type-page {
	padding: 0;                     /* container paddings handled by sections */
}

.aksh-section {
	padding: 5em 0;
}

.aksh-section--full {
	padding: 0;
}

.aksh-section-head {
	margin-bottom: 1.75em;
}

.aksh-section-title {
	font-size: 24px;
	font-weight: 600;              /* section/category titles are 600 */
	letter-spacing: -0.02em;
	margin: 0;
	text-transform: none;
}

/* Hero — large editorial image, edge-to-edge (full-bleed beyond .col-full). */
.aksh-hero {
	position: relative;
	display: flex;
	align-items: center;
	background-color: var(--color-bg-surface);
	background-size: cover;
	background-position: center;
	min-height: 72vh;
	overflow: hidden;
	color: var(--color-text-primary);
}

/* Text-contrast scrim only when a background image is present. */
.aksh-hero[style*="background-image"]::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(23, 23, 23, 0.28) 0%, rgba(23, 23, 23, 0.08) 60%, rgba(23, 23, 23, 0.22) 100%);
}


/* New Arrivals / Featured product rows. */
.aksh-new-arrivals,
.aksh-featured {
	background: var(--color-bg-page);
}

/* Override the global grid layout for New Arrivals and Featured product grids.
   The global ul.products rule uses display: grid, but these homepage
   sections need flex layout for proper 4-column alignment. */
.aksh-new-arrivals .products,
.aksh-featured .products {
	display: flex !important;
	flex-wrap: wrap;
	gap: 0 20px !important;
	grid-template-columns: none !important;
	width: 100%;
	padding: 0 !important;
	margin: 0 !important;
	list-style: none;
}

.aksh-new-arrivals .products::before,
.aksh-new-arrivals .products::after,
.aksh-featured .products::before,
.aksh-featured .products::after {
	content: none !important;
	display: none !important;
}

.aksh-new-arrivals .products li.product,
.aksh-featured .products li.product {
	width: calc(25% - 15px) !important;
	max-width: calc(25% - 15px) !important;
	float: none !important;
	clear: none !important;
	margin: 0 !important;
	padding: 0 !important;
	box-sizing: border-box;
}

/* Shop Women / Shop Men tiles — large imagery. */
.aksh-tiles-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--astylio-space-5);
}

a.aksh-tile {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 60vh;
	background-color: var(--color-bg-surface);
	background-size: cover;
	background-position: center;
	text-decoration: none;
	overflow: hidden;
	border-radius: var(--astylio-radius-sm);
}

a.aksh-tile::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(23, 23, 23, 0) 45%, rgba(23, 23, 23, 0.55) 100%);
	transition: opacity 0.3s ease;
	opacity: 0.85;
}

a.aksh-tile:hover::before { opacity: 1; }

a.aksh-tile:hover { opacity: 1; }

.aksh-tile-label {
	position: relative;
	z-index: 1;
	display: inline-block;
	margin: 1.25em;
	font-size: 22px;
	font-weight: 600;
	letter-spacing: -0.01em;
	color: var(--color-text-inverse);
	border-bottom: 1px solid var(--color-text-inverse);
	padding-bottom: 0.15em;
}

@media (max-width: 768px) {
	.aksh-tiles-grid {
		grid-template-columns: 1fr;
	}
	a.aksh-tile {
		min-height: 46vh;
	}
}

/* Social strip. */
.aksh-social {
	background: var(--color-bg-surface);
	text-align: center;
}

.aksh-social-strip {
	display: inline-flex;
	align-items: center;
	gap: 1em;
	padding: 0.5em 1.5em;
	border: 1px solid var(--color-border-default);
	border-radius: var(--astylio-radius-sm);
}

.aksh-social-handle {
	font-size: 14px;
	font-weight: 500;
	color: var(--color-text-primary);
}

.aksh-social-link {
	display: inline-flex;
	color: var(--color-text-primary);
}

.aksh-social-link:hover { opacity: 0.6; }

.aksh-empty-note {
	color: var(--color-text-muted);
	font-size: 14px;
}

/* --------------------------------------------------------------------------
   9. MEDIA QUERIES  (grid 4 → 3 → 2, compact header)
   -------------------------------------------------------------------------- */

/* Tablet — 3 columns, keep 20px grid gap. */
@media (max-width: 1024px) {
	.woocommerce ul.products,
	.woocommerce-page ul.products,
	ul.products,
	.wc-block-grid__products {
		grid-template-columns: repeat(3, 1fr);
		gap: var(--astylio-space-5);
	}

	.aksh-header-actions {
		grid-column: 3;
		justify-self: end;
		gap: 0.75rem;
	}
}

/* Mobile — 2 columns with 12px gap; header condenses to toggle/logo/bag. */
@media (max-width: 768px) {
	.woocommerce ul.products,
	.woocommerce-page ul.products,
	ul.products,
	.wc-block-grid__products {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--astylio-space-3);
	}

	.aksh-header-inner {
		grid-template-columns: 1fr auto 1fr;
		gap: 0;
		padding: 0 16px;
		min-height: calc(72px - 6px);
	}

	/* Hamburger: left column. */
	.aksh-menu-toggle {
		grid-column: 1;
		justify-self: start;
		display: inline-flex;
		width: 40px;
		height: 40px;
	}

	/* Logo: true center. */
	.aksh-header-logo { grid-column: 2; justify-self: center; }
	.aksh-header-nav { display: none; }

	/* Actions: right column, compact spacing. */
	.aksh-header-actions {
		grid-column: 3;
		justify-self: end;
		gap: 4px;
	}

	/* Icon controls: 40px touch targets. */
	.aksh-header-icon { width: 40px; height: 40px; }
	.aksh-header-icon svg { width: 20px; height: 20px; }
	.aksh-cart-count { top: 2px; right: 1px; }

	/* Hide account icon on mobile. */
	.aksh-header-account { display: none !important; }

	.aksh-section {
		padding: 3em 0;
	}

	.aksh-hero {
		min-height: 56vh;
	}
}

/* Small phones — single-line header, tighter still. */
@media (max-width: 480px) {
	.site-header .aksh-header-logo .site-title {
		font-size: 22px;
	}
}

/* =====================================================================
   HERO CAROUSEL — aksh-clothing-hero-carousel (ADDED)
   Full-bleed 100vw/100vh automatic carousel. Scoped to .aksh-hero-carousel
   so the rest of the homepage is unaffected. Design-system tokens only.
   ===================================================================== */

/* Full-bleed breakout beyond Storefront's .col-full container. */
.aksh-hero-carousel {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	min-height: 100vh;               /* dynamic, full viewport on desktop */
}

/* Slide stack fills the hero; only the active slide is visible. */
.aksh-hero-carousel .aksh-hero-track {
	position: absolute;
	inset: 0;
}

.aksh-hero-carousel .aksh-hero-slide {
	position: absolute;
	inset: 0;
	background-color: var(--color-bg-surface);
	background-size: cover;
	background-position: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--astylio-duration-hero, 1200ms) var(--astylio-ease-standard, ease),
	            visibility 0s linear var(--astylio-duration-hero, 1200ms);
}

.aksh-hero-carousel .aksh-hero-slide.is-active {
	opacity: 1;
	visibility: visible;
}

/* Legibility scrim behind slide text (design-system: subtle, no shadows). */
.aksh-hero-carousel .aksh-hero-slide::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(23, 23, 23, 0.34) 0%, rgba(23, 23, 23, 0.08) 55%, rgba(23, 23, 23, 0.30) 100%);
}

/* Branding overlay — logo in the top-left corner of the hero. */

/* Bottom dot indicators — small, clean circular pagination (Levi's-style).
   Uniform 8px circles; active = solid dark, inactive = light. !important
   guards against inherited Storefront button/pill/oval styles. */
.aksh-hero-carousel .aksh-hero-dots {
	position: absolute;
	left: 50%;
	bottom: 20px;
	transform: translateX(-50%);
	z-index: 20;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

.aksh-hero-carousel .aksh-hero-dot {
	width: 8px !important;
	height: 8px !important;
	min-width: 8px !important;
	min-height: 8px !important;
	max-width: 8px !important;
	max-height: 8px !important;
	padding: 0 !important;
	margin: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: rgba(255, 255, 255, 0.65);
	-webkit-appearance: none;
	appearance: none;
	display: block;
	line-height: 8px;
	cursor: pointer;
	transition: background 0.2s ease;
}

.aksh-hero-carousel .aksh-hero-dot::before,
.aksh-hero-carousel .aksh-hero-dot::after {
	content: none;
}

.aksh-hero-carousel .aksh-hero-dot.is-active {
	background: #111111;
	transform: none !important;
}

/* Responsive heights — keep the first screen usable on smaller viewports. */
@media (max-width: 992px) {
	.aksh-hero-carousel {
		min-height: 78vh;
	}
}

@media (max-width: 768px) {
	.aksh-hero-carousel {
		min-height: 72vh;
	}

	.aksh-hero-carousel .aksh-hero-dot {
		width: 8px !important;
		height: 8px !important;
	}

	.aksh-hero-carousel .aksh-hero-dot.is-active {
		width: 8px !important;
		height: 8px !important;
	}
}

@media (max-width: 480px) {
	.aksh-hero-carousel {
		min-height: 56vh;
	}


}

/* Reduced motion: swap slides without transition; function preserved. */
@media (prefers-reduced-motion: reduce) {
	.aksh-hero-carousel .aksh-hero-slide {
		transition: none;
	}
	.aksh-hero-carousel .aksh-hero-dot {
		transition: none;
	}
}
/* =====================================================================
   LAYERED HOMEPAGE TOP — aksh-clothing-header-hero-overlay
   Scrolling promo bar + overlay header (transparent → solid on scroll)
   + fixed-height hero + zero-gap overlay dropdown. Scoped to .home
   so interior pages keep a normal solid header. All aksh-* namespaced.
   ===================================================================== */

/* --------- Promo marquee (ADDED: Scrolling promotional marquee) --------- */
.aksh-promo-bar {
	overflow: hidden;                /* no scrollbar / clipped edges */
	width: 100%;
	height: 44px;                    /* ~44px desktop */
	background: #000;
	color: #fff;
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 0.02em;
	white-space: nowrap;
	display: flex;
	align-items: center;
	position: fixed;                 /* sticky on all pages */
	top: 0;
	left: 0;
	z-index: 1100;
}
.aksh-promo-track {
	display: inline-flex;
	width: max-content;
	align-items: center;
	animation: akshPromo 25s linear infinite;
	will-change: transform;
}
@keyframes akshPromo {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); } /* half = one duplicated copy */
}
.aksh-promo-item {
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
}
.aksh-promo-cta {
	color: #fff;
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 2px;
}
.aksh-promo-cta:hover { color: #fff; opacity: 0.8; }

/* Promo bar is now fixed on all pages (base rule above). */

/* --------- Overlay header on the homepage (MODIFIED: Header) --------- */
.home .aksh-header.site-header {
	background: transparent;         /* transparent over the hero */
	color: var(--color-text-inverse);     /* light text at top */
	border-bottom: none;
	box-shadow: none;
	transition: background-color 0.3s ease, box-shadow 0.3s ease, color 0.3s ease;
}
/* Light (white) logo, nav, icons at the very top. */
.home .aksh-header.site-header .site-title a,
.home .aksh-header.site-header .aksh-nav > li > a,
.home .aksh-header.site-header .aksh-header-actions .aksh-header-icon,
.home .aksh-header.site-header .aksh-menu-toggle {
	color: var(--color-text-inverse);
}

/* Scrolled state — solidify with dark text/icons and a subtle shadow. */
.home .aksh-header.site-header.is-scrolled {
	background: rgba(255,255,255,0.97);
	color: var(--color-text-primary);
	box-shadow: 0 1px 8px rgba(0,0,0,0.08);
	border-bottom: 1px solid var(--color-border-default);
}
.home .aksh-header.site-header.is-scrolled .site-title a,
.home .aksh-header.site-header.is-scrolled .aksh-nav a,
.home .aksh-header.site-header.is-scrolled .aksh-header-actions .aksh-header-icon,
.home .aksh-header.site-header.is-scrolled .aksh-menu-toggle {
	color: var(--color-text-primary);
}
/* Non-home pages: scrolled state adds a subtle shadow (surface already solid). */
.aksh-header.site-header.is-scrolled {
	box-shadow: 0 1px 8px rgba(0,0,0,0.08);
}

/* --------- Hero: fixed height + absolute content + low stacking --------- */
.home .aksh-hero-carousel {
	height: 720px;
	min-height: 720px;
	z-index: 1;                      /* below header/promo layers */
}

/* Remove top padding so the hero starts flush under the promo bar (AC2). */
.home .site-content,
.home .col-full,
.home #primary {
	padding-top: 0;
}

/* Non-home pages: offset content below the fixed promo bar + header. */
.site-content {
	padding-top: calc(44px + 72px);
}


/* --------- Dropdown overlay conformance under the fixed header --------- */
.aksh-header.site-header .aksh-dropdown {
	z-index: 1001;
	box-shadow: none;
}

/* Hamburger — hidden on desktop, shown on tablet/mobile. */
.aksh-menu-toggle {
	display: none;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 44px;
	height: 44px;
	padding: 0 10px;
	background: transparent;
	border: 0;
	cursor: pointer;
	box-shadow: none;
}
.aksh-menu-toggle:hover { background: transparent; }
/* Hamburger bars use currentColor: pin charcoal on solid headers. The base
   button color is near-white, which is invisible on ivory — without this,
   the icon vanishes on every non-homepage (home-top stays white via its
   own more-specific rule; home-scrolled already sets charcoal). */
.aksh-header.site-header .aksh-menu-toggle { color: var(--color-text-primary); }
/* Hamburger: no outline on tap/click or programmatic focus (closeMenu()
   parks focus here); keyboard users keep the :focus-visible ring. */
.aksh-menu-toggle:focus:not(:focus-visible) {
	outline: none;
	box-shadow: none;
}
.aksh-menu-toggle-bar {
	display: block;
	height: 2px;
	width: 22px;
	background: currentColor;
}

/* Mobile stacked menu — full-viewport overlay, scrollable, hidden by default. */
.aksh-mobile-menu {
	display: none;
}
.aksh-mobile-menu.is-open {
	display: block;
	position: fixed;
	top: 44px;
	left: 0;
	width: 100%;
	max-height: calc(100vh - 70px);
	overflow-y: auto;
	background: var(--color-bg-page);
	z-index: 1050;
	padding: 1.25em 1.5em 2.5em;
	color: var(--color-text-primary);
}
.aksh-mobile-menu-head {
	display: flex;
	justify-content: flex-end;
	margin-bottom: 0.75em;
}
.aksh-mobile-close {
	background: transparent;
	border: 0;
	font-size: 28px;
	line-height: 1;
	cursor: pointer;
	color: var(--color-text-primary);
	box-shadow: none;
}
.aksh-mobile-list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.aksh-mobile-list > li {
	margin: 0;
	border-bottom: 1px solid var(--color-border-default);
}
.aksh-mobile-list a {
	display: block;
	padding: 0.7em 0;
	font-size: var(--astylio-fs-body-md);
	font-weight: 500;
	color: var(--color-text-primary);
}
.aksh-mobile-list ul.sub-menu {
	list-style: none;
	margin: 0 0 0.5em 1em;
	padding: 0;
}
.aksh-mobile-list ul.sub-menu a {
	font-weight: 400;
	padding: 0.45em 0;
	color: var(--color-text-secondary);
	font-size: 14px;
}

/* --------- Responsive (breakpoints ~1024 / 768) --------- */
@media (max-width: 1024px) {
	/* Tablet: hide full desktop nav, show hamburger. */
	.aksh-header-nav { display: none; }
	.aksh-menu-toggle { display: inline-flex; }
	.home .aksh-hero-carousel { height: 640px; min-height: 640px; }
}

@media (max-width: 768px) {
	.aksh-promo-bar { height: 38px; }        /* ~38px mobile */
	.aksh-header.site-header { top: 38px; }
	.site-content { padding-top: calc(38px + 66px); }
	.home .aksh-mobile-menu.is-open { top: 38px; max-height: calc(100vh - 60px); }
	.home .aksh-hero-carousel { height: 58vh; min-height: 480px; }

	/* Inline search: narrower input on small screens. */
	.aksh-inline-search__input { width: 140px; height: 36px; font-size: 13px; }
	.aksh-inline-search.is-open .aksh-inline-search__form { max-width: 170px; }

	/* ── Mobile search-active state ─────────────────────────────────── */
	/* When search is open on mobile: hide everything except search. */
	#masthead.search-active .aksh-header-logo,
	#masthead.search-active .aksh-header-wishlist,
	#masthead.search-active .aksh-header-cart,
	#masthead.search-active .aksh-menu-toggle {
		display: none !important;
	}

	/* Header inner: match normal icon vertical center (16px from top).
	   Normal icons: padding 8px, height 34px, min-height 66px → top = 16px.
	   Search row:   padding-top 14px, height 40px, min-height 66px → top = 16px. */
	#masthead.search-active .aksh-header-inner {
		grid-template-columns: 1fr;
		padding: 14px 0 8px;
	}

	/* Actions row: full width, 15px side padding. */
	#masthead.search-active .aksh-header-actions {
		grid-column: 1;
		justify-self: stretch;
		width: 100%;
		padding: 0 15px;
		box-sizing: border-box;
	}

	/* Inline search wrapper: 15px gap between form and icon. */
	#masthead.search-active .aksh-inline-search {
		width: 100%;
		gap: 15px;
	}

	/* Form: reset browser defaults, match button height exactly. */
	#masthead.search-active .aksh-inline-search__form {
		max-width: none;
		opacity: 1;
		flex: 1 1 auto;
		min-width: 0;
		margin: 0;
		height: 40px;
	}

	/* Input fills its parent form. */
	#masthead.search-active .aksh-inline-search__input {
		width: 100%;
		height: 40px;
	}

	/* Search icon button: match input height for vertical alignment. */
	#masthead.search-active .aksh-inline-search .aksh-search-toggle {
		width: 40px;
		height: 40px;
		flex: 0 0 auto;
	}
}

@media (max-width: 480px) {
	.home .aksh-hero-carousel { height: 52vh; min-height: 400px; }
}

/* =====================================================================
   LAYOUT FIXES (small, scoped — no visual redesign)
   Fix 1: kill the white gap between the promo bar and the header/hero.
          Storefront's `.site-main { padding:2.617924em 0 }` (and a
          padding-top:4.23em variant) was not reset by the overlay change,
          pushing the hero down so the fixed transparent header showed a
          white band. Zero out top spacing on every in-flow wrapper and the
          hero itself on the homepage.
   Fix 2: desktop nav renders vertically because the horizontal-flex rules
          were keyed to `.main-navigation .primary-navigation > ul.menu`,
          but wp_nav_menu outputs `<ul class="aksh-nav">` under
          `<nav class="aksh-header-nav">` — no rule matched. Add correct
          selectors so the items lay out in one row.
   ===================================================================== */

/* Fix 1 — remove top whitespace above the hero (structural, not the image). */
.home #content.site-content,
.home .content-area,
.home #primary,
.home .site-main,
.home .aksh-homepage {
	margin-top: 0;
	padding-top: 0;
}
/* Root cause: Storefront's
   `.page-template-template-homepage:not(.has-post-thumbnail) .site-main { padding-top:4.2358em }`
   has specificity 0,3,0 — beating the 0,2,0 reset above — so it put ~64px of white
   space above the hero. Override with a 0,3,0 rule that loads later in the cascade. */
.home .site-main.aksh-homepage {
	padding-top: 0;
}
.home .aksh-hero-carousel {
	margin-top: 0;
}
.aksh-promo-bar {
	margin-bottom: 0;
}
.aksh-header.site-header {
	margin-top: 0;
}

/* Fix 3 — kill double scrollbar on homepage.
   Storefront's `.site{overflow-x:hidden}` forces overflow-y to auto per CSS
   spec, creating a second vertical scrollbar on #page. body already has
   overflow-x:hidden so #page doesn't need it. */
#page.site {
	overflow-x: visible;
}

/* Fix 2 — desktop navigation in ONE horizontal row (matches real DOM). */
.aksh-header-nav ul.aksh-nav {
	display: flex;
	flex-direction: row;
	align-items: center;
	flex-wrap: nowrap;
	gap: 34px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.aksh-header-nav ul.aksh-nav > li {
	display: block;
	width: auto;
	margin: 0;
	padding: 0;
}
.aksh-header-nav ul.aksh-nav > li > a.aksh-nav-link {
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
	padding: 0.5em 0;
	font-size: var(--astylio-fs-body-md);
	font-weight: 400;
	color: var(--color-text-primary);
	line-height: 1.2;
}
.aksh-header-nav ul.aksh-nav > li > a.aksh-nav-link:hover {
	color: var(--color-text-primary);
	opacity: 0.6;
}
.aksh-header-nav ul.aksh-nav > li.current-menu-item > a.aksh-nav-link {
	border-bottom: 1px solid var(--color-text-primary);
	padding-bottom: calc(0.5em - 1px);
}
/* Remove focus outline on nav links (mouse click shows a rectangular border). */
.aksh-header-nav ul.aksh-nav > li > a.aksh-nav-link:focus,
.aksh-header-nav ul.aksh-nav > li > a.aksh-nav-link:focus-visible {
	outline: none;
	box-shadow: none;
}

/* =====================================================================
   DROPDOWN HOVER DEAD-ZONE FIX (desktop only)
   The li's hover box previously ended above the dropdown top, leaving a
   dead band where :hover was lost on slow downward mouse movement. Stretch
   the nav items to the full header height so the hover region runs
   continuously from the nav item down to the dropdown's top edge. The
   dropdown is anchored to its li (relative) so it opens directly below the
   item. No visual layout change: link text stays vertically centered.
   ===================================================================== */
@media (min-width: 769px) {
	.aksh-header-nav {
		align-self: stretch;
	}
	.aksh-header-nav ul.aksh-nav {
		height: 100%;
		align-items: stretch;
	}
	.aksh-header-nav ul.aksh-nav > li {
		display: flex;
		align-items: center;
	}
}

/* =====================================================================
   OUR STORY PAGE — premium editorial brand narrative (redesign)
   ===================================================================== */

/* --- Hero --- */
.aksh-story-hero {
	padding: var(--astylio-space-8) var(--astylio-space-6) var(--astylio-space-10);
	background: var(--color-bg-page);
}

.aksh-story-hero__container {
	position: relative;
	max-width: 1440px;
	margin: 0 auto;
	overflow: hidden;
	border-radius: var(--astylio-radius-lg);
}

.aksh-story-hero__img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 680px;
	object-fit: cover;
	object-position: center;
}

.aksh-story-hero__overlay {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(180deg, rgba(37, 37, 37, 0.12) 0%, rgba(37, 37, 37, 0.30) 100%);
}

.aksh-story-hero__title {
	font-family: var(--astylio-font-display);
	font-size: var(--astylio-fs-display-xl);
	font-weight: 500;
	line-height: var(--astylio-lh-display);
	color: var(--color-text-inverse);
	margin: 0;
	letter-spacing: -0.01em;
	text-shadow: 0 2px 24px rgba(37, 37, 37, 0.20);
}

/* --- Brand story introduction --- */
.aksh-story-intro {
	background: var(--color-bg-surface);
	padding: var(--astylio-space-14) var(--astylio-space-6);
}

.aksh-story-intro__inner {
	max-width: 800px;
	margin: 0 auto;
	text-align: center;
}

.aksh-story-intro__heading {
	font-family: var(--astylio-font-display);
	font-size: var(--astylio-fs-heading-xl);
	font-weight: 500;
	line-height: 1.25;
	color: var(--color-text-primary);
	margin: 0 0 var(--astylio-space-7);
}

.aksh-story-intro__accent {
	display: block;
	width: 48px;
	height: 2px;
	background: var(--color-brand-primary);
	margin: 0 auto var(--astylio-space-9);
	border-radius: 1px;
}

.aksh-story-intro__body {
	max-width: 640px;
	margin: 0 auto;
}

.aksh-story-intro__lead {
	font-family: var(--astylio-font-display);
	font-size: var(--astylio-fs-heading-sm);
	font-weight: 500;
	line-height: 1.5;
	color: var(--color-text-primary);
	margin-bottom: var(--astylio-space-7);
	font-style: italic;
}

.aksh-story-intro__body p {
	font-family: var(--astylio-font-ui);
	font-size: var(--astylio-fs-body-lg);
	line-height: 1.8;
	color: var(--color-text-secondary);
	margin-bottom: var(--astylio-space-6);
}

.aksh-story-intro__body p:last-child {
	margin-bottom: 0;
}

/* --- Brand values --- */
.aksh-story-values {
	background: var(--color-bg-page);
	padding: var(--astylio-space-14) var(--astylio-space-6);
}

.aksh-story-values__grid {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--astylio-space-8);
}

.aksh-story-value {
	text-align: center;
	padding: 0 var(--astylio-space-4);
	position: relative;
}

/* Vertical separators between columns on desktop */
.aksh-story-value:not(:last-child)::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 1px;
	background: var(--color-border-default);
}

.aksh-story-value__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	margin-bottom: var(--astylio-space-5);
	color: var(--color-brand-primary);
}

.aksh-story-value__icon .astylio-icon {
	width: 28px;
	height: 28px;
}

.aksh-story-value__heading {
	font-family: var(--astylio-font-display);
	font-size: var(--astylio-fs-heading-sm);
	font-weight: 500;
	line-height: 1.35;
	color: var(--color-text-primary);
	margin: 0 0 var(--astylio-space-4);
}

.aksh-story-value__text {
	font-family: var(--astylio-font-ui);
	font-size: var(--astylio-fs-body-md);
	line-height: 1.7;
	color: var(--color-text-secondary);
	margin: 0;
}

/* --- Supporting brand statement --- */
.aksh-story-statement {
	background: var(--color-bg-surface);
	padding: var(--astylio-space-12) var(--astylio-space-6);
}

.aksh-story-statement__inner {
	max-width: 720px;
	margin: 0 auto;
	text-align: center;
	padding: var(--astylio-space-9) var(--astylio-space-8);
	border: 1px solid var(--color-border-default);
	border-radius: var(--astylio-radius-md);
}

.aksh-story-statement__text {
	font-family: var(--astylio-font-display);
	font-size: var(--astylio-fs-heading-md);
	font-weight: 500;
	line-height: 1.35;
	color: var(--color-text-primary);
	margin: 0;
	font-style: italic;
}

/* --- Closing CTA --- */
.aksh-story-cta {
	background: var(--color-bg-page);
	padding: var(--astylio-space-14) var(--astylio-space-6) var(--astylio-space-12);
	text-align: center;
}

.aksh-story-cta__inner {
	max-width: 600px;
	margin: 0 auto;
}

.aksh-story-cta__heading {
	font-family: var(--astylio-font-display);
	font-size: var(--astylio-fs-heading-lg);
	font-weight: 500;
	line-height: 1.3;
	color: var(--color-text-primary);
	margin: 0 0 var(--astylio-space-7);
}

.aksh-story-cta__btn {
	margin-top: var(--astylio-space-2);
}

/* --- Responsive: tablet --- */
@media (max-width: 1024px) {
	.aksh-story-values__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--astylio-space-8) var(--astylio-space-6);
	}

	/* Remove vertical separators, add horizontal ones */
	.aksh-story-value:not(:last-child)::after {
		display: none;
	}

	.aksh-story-value {
		padding: var(--astylio-space-6) 0;
		border-bottom: 1px solid var(--color-border-default);
	}

	.aksh-story-value:nth-child(1),
	.aksh-story-value:nth-child(2) {
		padding-top: 0;
	}

	.aksh-story-value:nth-last-child(-n+2) {
		border-bottom: none;
		padding-bottom: 0;
	}
}

/* --- Responsive: mobile --- */
@media (max-width: 768px) {
	.aksh-story-hero {
		padding: var(--astylio-space-5) var(--astylio-space-4) var(--astylio-space-8);
	}

	.aksh-story-hero__container {
		border-radius: var(--astylio-radius-md);
	}

	.aksh-story-hero__title {
		font-size: var(--astylio-fs-display-md);
	}

	.aksh-story-intro {
		padding: var(--astylio-space-12) var(--astylio-space-5);
	}

	.aksh-story-intro__heading {
		font-size: var(--astylio-fs-heading-lg);
	}

	.aksh-story-intro__lead {
		font-size: var(--astylio-fs-body-lg);
	}

	.aksh-story-intro__body p {
		font-size: var(--astylio-fs-body-md);
	}

	.aksh-story-values {
		padding: var(--astylio-space-12) var(--astylio-space-5);
	}

	.aksh-story-values__grid {
		grid-template-columns: 1fr;
		gap: 0;
	}

	/* Horizontal separators between stacked values */
	.aksh-story-value:not(:last-child)::after {
		display: none;
	}

	.aksh-story-value {
		padding: var(--astylio-space-7) 0;
		border-bottom: 1px solid var(--color-border-default);
	}

	.aksh-story-value:first-child {
		padding-top: 0;
	}

	.aksh-story-value:last-child {
		border-bottom: none;
		padding-bottom: 0;
	}

	.aksh-story-statement {
		padding: var(--astylio-space-10) var(--astylio-space-5);
	}

	.aksh-story-statement__inner {
		padding: var(--astylio-space-7) var(--astylio-space-5);
	}

	.aksh-story-statement__text {
		font-size: var(--astylio-fs-heading-sm);
	}

	.aksh-story-cta {
		padding: var(--astylio-space-12) var(--astylio-space-5) var(--astylio-space-10);
	}

	.aksh-story-cta__heading {
		font-size: var(--astylio-fs-heading-md);
	}
}

/* =====================================================================
   SHIPPING & POLICIES PAGE — clean editorial layout (page-scoped)
   ===================================================================== */

/* --- Escape Storefront's .col-full container for this page only --- */
.page-template-template-policies .col-full {
	max-width: none;
	width: 100%;
	padding: 0;
	margin: 0 auto;
}
.page-template-template-policies .content-area,
.page-template-template-policies .site-main {
	width: 100%;
	max-width: none;
	float: none;
	margin: 0;
	padding: 0;
}
.page-template-template-policies .widget-area {
	display: none;
}

/* --- Root wrapper + content container --- */
.astylio-policy-page {
	background: var(--color-bg-page);
}

.astylio-policy-container {
	max-width: 1280px;
	margin: 0 auto;
	padding-left: var(--astylio-space-6);
	padding-right: var(--astylio-space-6);
}

/* --- Breadcrumb --- */
.astylio-policy-breadcrumb {
	padding-top: var(--astylio-space-7);
}

.astylio-policy-breadcrumb__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--astylio-space-2);
	list-style: none;
	margin: 0;
	padding: 0;
	font-family: var(--astylio-font-ui);
	font-size: var(--astylio-fs-body-sm);
	color: var(--color-text-muted);
}

.astylio-policy-breadcrumb__item:not(:last-child)::after {
	content: '/';
	margin-left: var(--astylio-space-2);
	color: var(--color-text-muted);
}

.astylio-policy-breadcrumb__link {
	text-decoration: none;
	color: var(--color-text-secondary);
	transition: color var(--astylio-duration-fast) var(--astylio-ease-standard);
}
.astylio-policy-breadcrumb__link:hover {
	color: var(--color-text-primary);
}

.astylio-policy-breadcrumb__current {
	color: var(--color-text-primary);
	font-weight: 500;
}

/* --- Hero --- */
.astylio-policy-hero {
	padding-top: var(--astylio-space-11);
	padding-bottom: var(--astylio-space-12);
	text-align: center;
}

.astylio-policy-hero__title {
	font-family: var(--astylio-font-display);
	font-size: var(--astylio-fs-display-lg);
	font-weight: 500;
	line-height: var(--astylio-lh-display);
	color: var(--color-text-primary);
	margin: 0 0 var(--astylio-space-6);
	letter-spacing: -0.01em;
}

.astylio-policy-hero__subtitle {
	font-family: var(--astylio-font-ui);
	font-size: var(--astylio-fs-body-md);
	line-height: 1.65;
	color: var(--color-text-secondary);
	margin: 0 auto;
	max-width: 540px;
}

/* --- Quick navigation --- */
.astylio-policy-nav {
	padding-bottom: var(--astylio-space-12);
}

.astylio-policy-nav__grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: var(--astylio-space-4);
}

.astylio-policy-nav__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--astylio-space-3);
	padding: var(--astylio-space-6) var(--astylio-space-4);
	text-decoration: none;
	text-align: center;
	background: var(--color-bg-surface);
	border: 1px solid var(--color-border-default);
	border-radius: var(--astylio-radius-md);
	transition: border-color var(--astylio-duration-fast) var(--astylio-ease-standard),
	            transform var(--astylio-duration-fast) var(--astylio-ease-standard);
}

.astylio-policy-nav__item:hover {
	border-color: var(--color-brand-primary);
	transform: translateY(-2px);
}

.astylio-policy-nav__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	color: var(--color-brand-primary);
}
.astylio-policy-nav__icon .astylio-icon {
	width: 22px;
	height: 22px;
}

.astylio-policy-nav__label {
	font-family: var(--astylio-font-ui);
	font-size: var(--astylio-fs-body-sm);
	font-weight: 500;
	color: var(--color-text-primary);
	letter-spacing: 0.02em;
}

/* --- Sections --- */
.astylio-policy-section {
	padding-top: var(--astylio-space-13);
	padding-bottom: var(--astylio-space-13);
}

.astylio-policy-section--alt {
	background: var(--color-bg-surface);
}

/* --- Section head (icon + title) --- */
.astylio-policy-section-head {
	display: flex;
	align-items: center;
	gap: var(--astylio-space-4);
	margin-bottom: var(--astylio-space-9);
}

.astylio-policy-section-head__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	color: var(--color-brand-primary);
	flex-shrink: 0;
}
.astylio-policy-section-head__icon .astylio-icon {
	width: 22px;
	height: 22px;
}

.astylio-policy-section-head__title {
	font-family: var(--astylio-font-display);
	font-size: var(--astylio-fs-heading-lg);
	font-weight: 500;
	line-height: var(--astylio-lh-heading);
	color: var(--color-text-primary);
	margin: 0;
}

/* --- Editorial 25/75 split --- */
.astylio-policy-split {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 2.6fr);
	gap: var(--astylio-space-11);
}

.astylio-policy-split__sidebar {
	min-width: 0;
}

.astylio-policy-split__intro {
	font-family: var(--astylio-font-ui);
	font-size: var(--astylio-fs-body-md);
	line-height: 1.7;
	color: var(--color-text-secondary);
	margin: 0;
}

.astylio-policy-split__content {
	min-width: 0;
}

/* --- Content blocks --- */
.astylio-policy-block {
	margin-bottom: var(--astylio-space-10);
}
.astylio-policy-block:last-child {
	margin-bottom: 0;
}

.astylio-policy-block__title {
	font-family: var(--astylio-font-display);
	font-size: var(--astylio-fs-heading-sm);
	font-weight: 500;
	line-height: 1.35;
	color: var(--color-text-primary);
	margin: 0 0 var(--astylio-space-4);
}

.astylio-policy-block__body {
	font-family: var(--astylio-font-ui);
	font-size: var(--astylio-fs-body-md);
	line-height: 1.75;
	color: var(--color-text-secondary);
}
.astylio-policy-block__body p {
	margin: 0 0 var(--astylio-space-4);
}
.astylio-policy-block__body p:last-child {
	margin-bottom: 0;
}
.astylio-policy-block__body ul {
	margin: var(--astylio-space-3) 0 var(--astylio-space-4);
	padding-left: var(--astylio-space-6);
}
.astylio-policy-block__body li {
	margin-bottom: var(--astylio-space-2);
}
.astylio-policy-block__body li:last-child {
	margin-bottom: 0;
}

/* --- Two-column grid (exchange) --- */
.astylio-policy-grid {
	display: grid;
	gap: var(--astylio-space-8) var(--astylio-space-10);
}
.astylio-policy-grid--2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin-bottom: var(--astylio-space-12);
}

/* --- Checklist (check icon via data URI) --- */
.astylio-policy-checklist {
	list-style: none;
	padding-left: 0 !important;
}
.astylio-policy-checklist li {
	position: relative;
	padding-left: var(--astylio-space-7) !important;
}
.astylio-policy-checklist li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0.35em;
	width: 16px;
	height: 16px;
	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='%235A1F2B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: contain;
}

/* --- Special condition cards --- */
.astylio-policy-cards {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--astylio-space-6);
	margin-bottom: var(--astylio-space-8);
}

.astylio-policy-card {
	background: var(--color-bg-surface);
	border: 1px solid var(--color-border-default);
	border-radius: var(--astylio-radius-md);
	padding: var(--astylio-space-7);
	display: flex;
	flex-direction: column;
}

.astylio-policy-card__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	margin-bottom: var(--astylio-space-4);
	color: var(--color-brand-primary);
}
.astylio-policy-card__icon .astylio-icon {
	width: 20px;
	height: 20px;
}

.astylio-policy-card__title {
	font-family: var(--astylio-font-display);
	font-size: var(--astylio-fs-heading-sm);
	font-weight: 500;
	line-height: 1.35;
	color: var(--color-text-primary);
	margin: 0 0 var(--astylio-space-3);
}

.astylio-policy-card__body {
	font-family: var(--astylio-font-ui);
	font-size: var(--astylio-fs-body-md);
	line-height: 1.7;
	color: var(--color-text-secondary);
}
.astylio-policy-card__body p {
	margin: 0;
}

/* --- Not-eligible panel --- */
.astylio-policy-panel {
	background: var(--color-bg-surface);
	border: 1px solid var(--color-border-default);
	border-radius: var(--astylio-radius-md);
	padding: var(--astylio-space-7) var(--astylio-space-8);
}

.astylio-policy-panel__title {
	font-family: var(--astylio-font-display);
	font-size: var(--astylio-fs-heading-sm);
	font-weight: 500;
	color: var(--color-text-primary);
	margin: 0 0 var(--astylio-space-4);
}

.astylio-policy-panel__body {
	font-family: var(--astylio-font-ui);
	font-size: var(--astylio-fs-body-md);
	line-height: 1.7;
	color: var(--color-text-secondary);
}
.astylio-policy-panel__body ul {
	margin: 0;
	padding-left: var(--astylio-space-6);
}
.astylio-policy-panel__body li {
	margin-bottom: var(--astylio-space-2);
}
.astylio-policy-panel__body li:last-child {
	margin-bottom: 0;
}

/* --- FAQ (minimalist full-width rows, explicit plus/minus) --- */
.astylio-policy-faq {
	border-top: 1px solid var(--color-border-default);
}

.astylio-policy-faq__item {
	border-bottom: 1px solid var(--color-border-default);
}

.astylio-policy-faq__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--astylio-space-4);
	width: 100%;
	padding: var(--astylio-space-5) 0;
	background: none;
	border: none;
	cursor: pointer;
	text-align: left;
	font-family: var(--astylio-font-ui);
	font-size: var(--astylio-fs-body-md);
	font-weight: 400;
	color: var(--color-text-primary);
	line-height: 1.5;
}
.astylio-policy-faq__header:hover {
	color: var(--color-text-primary);
	background: transparent;
}
.astylio-policy-faq__header:focus-visible {
	outline: 2px solid var(--color-brand-primary);
	outline-offset: 2px;
	border-radius: var(--astylio-radius-sm);
}

.astylio-policy-faq__question {
	flex: 1;
}

.astylio-policy-faq__toggle {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	color: var(--color-text-muted);
}

.astylio-policy-faq__icon {
	display: inline-flex;
}
.astylio-policy-faq__icon .astylio-icon {
	width: 20px;
	height: 20px;
}

.astylio-policy-faq__icon--minus {
	display: none;
}
.astylio-policy-faq__header[aria-expanded="true"] .astylio-policy-faq__icon--plus {
	display: none;
}
.astylio-policy-faq__header[aria-expanded="true"] .astylio-policy-faq__icon--minus {
	display: inline-flex;
}

.astylio-policy-faq__content {
	overflow: hidden;
	max-height: 0;
	transition: max-height var(--astylio-duration-normal) var(--astylio-ease-standard);
}
.astylio-policy-faq__content[hidden] {
	display: block !important;
	max-height: 0;
	overflow: hidden;
}
.astylio-policy-faq__content.is-open {
	max-height: none;
}

.astylio-policy-faq__answer {
	padding: 0 0 var(--astylio-space-6) 0;
	font-family: var(--astylio-font-ui);
	font-size: var(--astylio-fs-body-md);
	line-height: 1.75;
	color: var(--color-text-secondary);
}
.astylio-policy-faq__answer p {
	margin: 0;
}

/* --- Need help CTA --- */
.astylio-policy-cta {
	padding-top: var(--astylio-space-13);
	padding-bottom: var(--astylio-space-13);
	text-align: center;
}

.astylio-policy-cta__inner {
	max-width: 560px;
	margin: 0 auto;
}

.astylio-policy-cta__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	margin-bottom: var(--astylio-space-5);
	color: var(--color-brand-primary);
}
.astylio-policy-cta__icon .astylio-icon {
	width: 28px;
	height: 28px;
}

.astylio-policy-cta__heading {
	font-family: var(--astylio-font-display);
	font-size: var(--astylio-fs-heading-lg);
	font-weight: 500;
	line-height: var(--astylio-lh-heading);
	color: var(--color-text-primary);
	margin: 0 0 var(--astylio-space-4);
}

.astylio-policy-cta__text {
	font-family: var(--astylio-font-ui);
	font-size: var(--astylio-fs-body-md);
	line-height: 1.65;
	color: var(--color-text-secondary);
	margin: 0 0 var(--astylio-space-7);
}

/* --- Responsive: tablet --- */
@media (max-width: 1024px) {
	.astylio-policy-nav__grid {
		grid-template-columns: repeat(3, 1fr);
	}
	.astylio-policy-split {
		grid-template-columns: 1fr;
		gap: var(--astylio-space-6);
	}
	.astylio-policy-grid--2 {
		grid-template-columns: 1fr;
		gap: var(--astylio-space-8);
	}
	.astylio-policy-cards {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* --- Responsive: mobile --- */
@media (max-width: 768px) {
	.astylio-policy-container {
		padding-left: var(--astylio-space-5);
		padding-right: var(--astylio-space-5);
	}

	.astylio-policy-breadcrumb {
		padding-top: var(--astylio-space-5);
	}

	.astylio-policy-hero {
		padding-top: var(--astylio-space-8);
		padding-bottom: var(--astylio-space-10);
	}
	.astylio-policy-hero__title {
		font-size: var(--astylio-fs-heading-xl);
	}
	.astylio-policy-hero__subtitle {
		font-size: var(--astylio-fs-body-sm);
	}

	.astylio-policy-nav {
		padding-bottom: var(--astylio-space-10);
	}
	.astylio-policy-nav__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--astylio-space-3);
	}
	.astylio-policy-nav__item {
		padding: var(--astylio-space-5) var(--astylio-space-3);
	}

	.astylio-policy-section {
		padding-top: var(--astylio-space-12);
		padding-bottom: var(--astylio-space-12);
	}
	.astylio-policy-section-head {
		margin-bottom: var(--astylio-space-7);
	}
	.astylio-policy-section-head__title {
		font-size: var(--astylio-fs-heading-md);
	}

	.astylio-policy-cards {
		grid-template-columns: 1fr;
	}
	.astylio-policy-panel {
		padding: var(--astylio-space-6);
	}

	.astylio-policy-faq__header {
		padding: var(--astylio-space-4) 0;
	}

	.astylio-policy-cta {
		padding-top: var(--astylio-space-12);
		padding-bottom: var(--astylio-space-12);
	}
}

@media (max-width: 480px) {
	.astylio-policy-nav__grid {
		grid-template-columns: 1fr;
	}
	.astylio-policy-nav__item {
		flex-direction: row;
		justify-content: flex-start;
		text-align: left;
		gap: var(--astylio-space-4);
	}
}

/* =====================================================================
   CONTACT PAGE — minimal editorial layout (page-scoped)
   ===================================================================== */

/* --- Hero: centered page heading --- */
.aksh-contact-hero {
	padding: var(--astylio-space-12) var(--astylio-space-6) var(--astylio-space-9);
	background: var(--color-bg-page);
	text-align: center;
}

.aksh-contact-hero__inner {
	max-width: var(--astylio-container-md);
	margin: 0 auto;
}

.aksh-contact-hero__heading {
	font-family: var(--astylio-font-display);
	font-size: var(--astylio-fs-display-xl);
	font-weight: 500;
	line-height: var(--astylio-lh-display);
	letter-spacing: -0.01em;
	color: var(--color-text-primary);
	margin: 0;
}

/* --- Body: left-aligned readable content column --- */
.aksh-contact-body {
	padding: 0 var(--astylio-space-6) var(--astylio-space-14);
	background: var(--color-bg-page);
}

.aksh-contact-body__inner {
	max-width: 640px;
	margin: 0 auto;
	text-align: left;
}

.aksh-contact-body__subheading {
	font-family: var(--astylio-font-ui);
	font-size: var(--astylio-fs-heading-sm);
	font-weight: 500;
	line-height: 1.4;
	color: var(--color-text-primary);
	margin: 0 0 var(--astylio-space-6);
}

.aksh-contact-body__text {
	font-family: var(--astylio-font-ui);
	font-size: var(--astylio-fs-body-lg);
	line-height: 1.8;
	color: var(--color-text-secondary);
	margin: 0 0 var(--astylio-space-9);
}

.aksh-contact-body__details {
	display: flex;
	flex-direction: column;
	gap: var(--astylio-space-4);
}

.aksh-contact-detail {
	font-family: var(--astylio-font-ui);
	font-size: var(--astylio-fs-body-md);
	line-height: 1.6;
	color: var(--color-text-primary);
	margin: 0;
}

.aksh-contact-detail__link {
	color: var(--color-text-primary);
	text-decoration: none;
	border-bottom: 1px solid var(--color-border-default);
	transition: color var(--astylio-duration-fast) var(--astylio-ease-standard),
	            border-color var(--astylio-duration-fast) var(--astylio-ease-standard);
}

.aksh-contact-detail__link:hover {
	color: var(--color-brand-primary);
	border-color: var(--color-brand-primary);
	opacity: 1;
}

.aksh-contact-detail--hours {
	color: var(--color-text-secondary);
}

/* --- Responsive: tablet --- */
@media (max-width: 1024px) {
	.aksh-contact-hero {
		padding: var(--astylio-space-10) var(--astylio-space-5) var(--astylio-space-8);
	}

	.aksh-contact-body {
		padding: 0 var(--astylio-space-5) var(--astylio-space-12);
	}
}

/* --- Responsive: mobile --- */
@media (max-width: 768px) {
	.aksh-contact-hero {
		padding: var(--astylio-space-9) var(--astylio-space-4) var(--astylio-space-7);
	}

	.aksh-contact-hero__heading {
		font-size: var(--astylio-fs-heading-lg);
	}

	.aksh-contact-body {
		padding: 0 var(--astylio-space-4) var(--astylio-space-10);
	}

	.aksh-contact-body__subheading {
		font-size: var(--astylio-fs-body-lg);
	}

	.aksh-contact-body__text {
		font-size: var(--astylio-fs-body-md);
	}

	.aksh-contact-detail {
		font-size: var(--astylio-fs-body-sm);
		word-break: break-word;
	}
}

/* =====================================================================
   PRIVACY POLICY PAGE
   Scoped styles for the ASTYLIO Privacy Policy page.
   Uses .astylio-privacy-policy wrapper to avoid global CSS conflicts.
   ===================================================================== */

.astylio-privacy-policy {
	background: var(--color-bg-page, #F7F3EE);
	padding: 0 0 4em;
}

/* Header */
.astylio-privacy-header {
	padding: 0.5em 0 1.5em;
	text-align: center;
	border-bottom: 1px solid var(--color-border-default, #DED6CE);
	margin-bottom: 2.5em;
}

.astylio-privacy-header__title {
	font-family: var(--astylio-font-heading, 'Playfair Display', serif);
	font-size: clamp(28px, 5vw, 42px);
	font-weight: 600;
	color: var(--color-text-primary, #252525);
	margin: 0 0 0.5em;
	letter-spacing: -0.02em;
	line-height: 1.15;
}

.astylio-privacy-header__meta {
	font-family: var(--astylio-font-ui, 'Poppins', sans-serif);
	font-size: var(--astylio-fs-body-sm, 14px);
	color: var(--color-text-secondary, #6B625D);
	margin: 0;
	line-height: 1.6;
}

/* Intro */
.astylio-privacy-intro {
	margin-bottom: 2.5em;
}

.astylio-privacy-intro p {
	font-family: var(--astylio-font-ui, 'Poppins', sans-serif);
	font-size: var(--astylio-fs-body-md, 15px);
	color: var(--color-text-primary, #252525);
	line-height: 1.75;
	margin: 0 0 1em;
}

/* Sections */
.astylio-privacy-section {
	margin-bottom: 2.5em;
}

.astylio-privacy-section__title {
	font-family: var(--astylio-font-heading, 'Playfair Display', serif);
	font-size: clamp(18px, 3vw, 22px);
	font-weight: 600;
	color: var(--color-text-primary, #252525);
	margin: 0 0 0.75em;
	letter-spacing: -0.01em;
	line-height: 1.3;
	padding-bottom: 0.5em;
	border-bottom: 1px solid var(--color-border-default, #DED6CE);
}

.astylio-privacy-section__body p {
	font-family: var(--astylio-font-ui, 'Poppins', sans-serif);
	font-size: var(--astylio-fs-body-md, 15px);
	color: var(--color-text-primary, #252525);
	line-height: 1.75;
	margin: 0 0 1em;
}

.astylio-privacy-section__body p:last-child {
	margin-bottom: 0;
}

.astylio-privacy-section__body strong {
	font-weight: 600;
	color: var(--color-text-primary, #252525);
}

.astylio-privacy-section__body a {
	color: var(--color-brand-primary, #5A1F2B);
	text-decoration: underline;
	text-underline-offset: 2px;
	transition: color 0.2s ease;
}

.astylio-privacy-section__body a:hover {
	color: var(--color-brand-primary-hover, #42151F);
}

/* Lists */
.astylio-privacy-section__body ul {
	margin: 0 0 1em;
	padding-left: 1.5em;
	list-style: disc;
}

.astylio-privacy-section__body li {
	font-family: var(--astylio-font-ui, 'Poppins', sans-serif);
	font-size: var(--astylio-fs-body-md, 15px);
	color: var(--color-text-primary, #252525);
	line-height: 1.75;
	margin-bottom: 0.35em;
}

.astylio-privacy-section__body li:last-child {
	margin-bottom: 0;
}

/* Subsections */
.astylio-privacy-subsection {
	margin-top: 1.5em;
	margin-bottom: 1.5em;
}

.astylio-privacy-subsection__title {
	font-family: var(--astylio-font-ui, 'Poppins', sans-serif);
	font-size: var(--astylio-fs-body-lg, 16px);
	font-weight: 600;
	color: var(--color-text-primary, #252525);
	margin: 0 0 0.5em;
	line-height: 1.4;
}

.astylio-privacy-subsection__body p {
	font-family: var(--astylio-font-ui, 'Poppins', sans-serif);
	font-size: var(--astylio-fs-body-md, 15px);
	color: var(--color-text-primary, #252525);
	line-height: 1.75;
	margin: 0 0 1em;
}

.astylio-privacy-subsection__body p:last-child {
	margin-bottom: 0;
}

.astylio-privacy-subsection__body ul {
	margin: 0 0 1em;
	padding-left: 1.5em;
	list-style: disc;
}

.astylio-privacy-subsection__body li {
	font-family: var(--astylio-font-ui, 'Poppins', sans-serif);
	font-size: var(--astylio-fs-body-md, 15px);
	color: var(--color-text-primary, #252525);
	line-height: 1.75;
	margin-bottom: 0.35em;
}

.astylio-privacy-subsection__body li:last-child {
	margin-bottom: 0;
}

.astylio-privacy-subsection__body a {
	color: var(--color-brand-primary, #5A1F2B);
	text-decoration: underline;
	text-underline-offset: 2px;
	transition: color 0.2s ease;
}

.astylio-privacy-subsection__body a:hover {
	color: var(--color-brand-primary-hover, #42151F);
}

/* Responsive */
@media (max-width: 768px) {
	.astylio-privacy-header {
		padding: 0.25em 0 1em;
		margin-bottom: 1.5em;
	}

	.astylio-privacy-section {
		margin-bottom: 2em;
	}

	.astylio-privacy-section__body ul,
	.astylio-privacy-subsection__body ul {
		padding-left: 1.25em;
	}
}
