/* Single Shoe Luxe V2 */
:root{
	--ink:#171714;
	--muted:#6f6d66;
	--line:#e8e5df;
	--soft:#f6f3ee;
	--paper:#fff;
	--accent:#b28a5a;
	--dark:#191915;
	--radius:18px;
	--shadow:0 18px 60px rgba(30,27,21,.09);
	--container:min(1240px,calc(100% - 40px));
}

*{box-sizing:border-box}

html{scroll-behavior:smooth}

body{
	margin:0;
	background:var(--paper);
	color:var(--ink);
	font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
	line-height:1.6;
	-webkit-font-smoothing:antialiased;
}

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

a{
	color:inherit;
	text-decoration:none;
}

.container{
	width:var(--container);
	margin-inline:auto;
}

.section{
	padding:88px 0;
}

.section--soft{
	background:var(--soft);
}

.section--dark{
	background:var(--dark);
	color:#fff;
}

.screen-reader-text{
	position:absolute;
	width:1px;
	height:1px;
	padding:0;
	margin:-1px;
	overflow:hidden;
	clip:rect(0,0,0,0);
	white-space:nowrap;
	border:0;
}

.skip-link{
	position:fixed;
	top:8px;
	left:8px;
	z-index:9999;
	padding:10px 14px;
	background:#fff;
	transform:translateY(-150%);
}

.skip-link:focus{
	transform:none;
}

/* =========================================================
   HEADER
   ========================================================= */

.announcement-bar{
	padding:9px 20px;
	text-align:center;
	background:var(--dark);
	color:#fff;
	font-size:12px;
	letter-spacing:.08em;
	text-transform:uppercase;
}

.site-header{
	position:sticky;
	top:0;
	z-index:100;
	background:rgba(255,255,255,.96);
	border-bottom:1px solid var(--line);
	backdrop-filter:blur(16px);
}

.site-header__inner{
	min-height:82px;
	display:grid;
	grid-template-columns:auto 1fr auto;
	align-items:center;
	gap:35px;
}

.site-branding{
	min-width:220px;
}

.custom-logo{
	display:block;
	max-height:54px;
	width:auto;
}

.text-logo{
	display:inline-flex;
	flex-direction:column;
	line-height:1;
}

.text-logo span{
	font-family:Georgia,serif;
	font-size:27px;
	letter-spacing:.02em;
}

.text-logo small{
	margin-top:7px;
	color:var(--muted);
	font-size:9px;
	letter-spacing:.16em;
	text-transform:uppercase;
}

.primary-navigation{
	justify-self:center;
}

.menu{
	display:flex;
	align-items:center;
	gap:32px;
	list-style:none;
	margin:0;
	padding:0;
}

.menu a{
	font-size:14px;
	font-weight:650;
}

.menu a:hover{
	color:var(--accent);
}

.header-actions{
	display:flex;
	gap:4px;
	align-items:center;
}

.icon-button{
	position:relative;
	display:grid;
	place-items:center;
	width:42px;
	height:42px;
	border:0;
	background:transparent;
	cursor:pointer;
}

.icon-button svg{
	width:21px;
	fill:none;
	stroke:currentColor;
	stroke-width:1.6;
}

.header-cart__count{
	position:absolute;
	top:3px;
	right:2px;
	display:grid;
	place-items:center;
	min-width:17px;
	height:17px;
	padding:0 4px;
	border-radius:20px;
	background:var(--accent);
	color:#fff;
	font-size:10px;
	font-weight:700;
}

.menu-toggle{
	display:none;
	background:none;
	border:0;
	width:42px;
	padding:9px;
}

.menu-toggle>span:not(.screen-reader-text){
	display:block;
	height:1px;
	background:currentColor;
	margin:5px 0;
}

/* =========================================================
   HERO – COMPLETE ACHTERGRONDAFBEELDING
   ========================================================= */

.hero{
	position:relative;
	min-height:720px;
	overflow:hidden;
	background:#f1e9df;
}

.hero__background{
	position:absolute;
	inset:0;
	background-image:url("../images/hero-background-4k.webp");
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
}

.hero__background::after{
	content:"";
	position:absolute;
	inset:0;
	background:linear-gradient(
		90deg,
		rgba(255,255,255,.42) 0%,
		rgba(255,255,255,.18) 22%,
		rgba(255,255,255,.05) 38%,
		rgba(255,255,255,0) 50%
	);
}

.hero__inner{
	position:relative;
	z-index:2;
	min-height:720px;
	display:grid;
	grid-template-columns:minmax(0,660px) 1fr;
	align-items:center;
}

.hero__content{
	padding:78px 0 70px;
}

.eyebrow{
	margin:0 0 18px;
	color:var(--accent);
	font-size:11px;
	font-weight:800;
	letter-spacing:.22em;
	text-transform:uppercase;
}

.hero h1,
.section-heading h2,
.request-cta h2,
.page-header h1{
	font-family:Georgia,"Times New Roman",serif;
	font-weight:400;
	line-height:1.04;
	letter-spacing:-.035em;
}

.hero h1{
	max-width:660px;
	margin:0;
	font-size:clamp(56px,5.8vw,88px);
}

.hero__lead{
	max-width:610px;
	margin:25px 0 31px;
	color:#56534d;
	font-size:18px;
}

.hero__buttons{
	display:flex;
	flex-wrap:wrap;
	gap:12px;
}

.button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.wp-element-button{
	display:inline-flex!important;
	align-items:center;
	justify-content:center;
	min-height:52px;
	padding:0 24px!important;
	border:1px solid transparent!important;
	border-radius:8px!important;
	font-size:13px!important;
	font-weight:750!important;
	letter-spacing:.02em!important;
	transition:.2s ease!important;
}

.button--dark,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt{
	background:var(--dark)!important;
	color:#fff!important;
}

.button--dark:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover{
	background:#33332d!important;
}

.button--light{
	background:rgba(255,255,255,.78);
	border-color:#d7d0c5!important;
}

.button--gold{
	background:var(--accent);
	color:#fff;
}

.hero__proof{
	display:flex;
	gap:20px;
	flex-wrap:wrap;
	margin-top:28px;
	color:#6b665e;
	font-size:12px;
}

/* =========================================================
   CONTENT
   ========================================================= */

.section-heading{
	margin-bottom:42px;
}

.section-heading h2{
	margin:0;
	font-size:clamp(38px,5vw,60px);
}

.section-heading--split{
	display:flex;
	align-items:end;
	justify-content:space-between;
}

.text-link{
	display:inline-block;
	border-bottom:1px solid currentColor;
	font-size:13px;
	font-weight:700;
	padding-bottom:3px;
}

.choice-grid{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:20px;
}

.choice-card{
	display:grid;
	grid-template-columns:auto 1fr auto;
	align-items:center;
	gap:26px;
	min-height:205px;
	padding:36px;
	border:1px solid var(--line);
	border-radius:var(--radius);
	transition:.25s ease;
}

.choice-card:hover{
	transform:translateY(-4px);
	box-shadow:var(--shadow);
}

.choice-card--dark{
	background:var(--dark);
	color:#fff;
	border-color:var(--dark);
}

.choice-card__letter{
	display:grid;
	place-items:center;
	width:92px;
	height:120px;
	border-radius:46px;
	background:var(--soft);
	font:52px Georgia,serif;
	color:var(--ink);
}

.choice-card--dark .choice-card__letter{
	background:#303029;
	color:#fff;
}

.choice-card h3{
	margin:0 0 10px;
	font:36px Georgia,serif;
}

.choice-card p{
	margin:0;
	color:var(--muted);
}

.choice-card--dark p{
	color:#bbb8af;
}

.choice-card__arrow{
	font-size:28px;
}

.request-cta__inner{
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:50px;
}

.request-cta h2{
	max-width:760px;
	margin:0 0 16px;
	font-size:clamp(40px,5vw,66px);
}

.request-cta p:not(.eyebrow){
	max-width:740px;
	color:#c5c2ba;
}

/* =========================================================
   FOOTER
   ========================================================= */

.site-footer{
	padding:70px 0 0;
	background:#f0eae1;
	color:#191915;
}

.footer-grid{
	display:grid;
	grid-template-columns:1.5fr 1fr 1fr 1fr;
	gap:50px;
}

.text-logo--footer small{
	color:var(--accent);
}

.footer-brand p{
	max-width:330px;
	color:#615d56;
}

.footer-widget__title{
	font-size:13px;
	text-transform:uppercase;
	letter-spacing:.12em;
}

.site-footer ul{
	list-style:none;
	padding:0;
}

.site-footer li{
	margin:9px 0;
}

.site-footer a:hover{
	color:var(--accent);
}

.footer-bottom{
	position:relative;
	display:flex;
	justify-content:space-between;
	gap:30px;
	margin-top:55px;
	padding:26px 0;
	color:#f7f1e8;
	font-size:11px;
}

.footer-bottom::before{
	content:"";
	position:absolute;
	inset:0 50%;
	z-index:-1;
	width:100vw;
	transform:translateX(-50%);
	background:#191915;
}

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

/* =========================================================
   PAGINA'S
   ========================================================= */

.page-shell{
	max-width:850px;
}

.page-header{
	margin-bottom:45px;
}

.page-header h1{
	margin:0;
	font-size:clamp(44px,6vw,76px);
}

.prose{
	font-size:17px;
}

.prose h2,
.prose h3{
	font-family:Georgia,serif;
	line-height:1.15;
}

.prose h2{
	font-size:40px;
}

.prose a{
	text-decoration:underline;
}

.post-grid{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:28px;
}

.post-card{
	border:1px solid var(--line);
	border-radius:var(--radius);
	overflow:hidden;
}

.post-card__image{
	display:block;
	aspect-ratio:4/3;
	background:var(--soft);
}

.post-card__image img{
	width:100%;
	height:100%;
	object-fit:cover;
}

.post-card__content{
	padding:25px;
}

.post-card h2{
	font:30px/1.15 Georgia,serif;
}

.post-card p{
	color:var(--muted);
}

.empty-state{
	text-align:center;
	max-width:700px;
	margin:auto;
}

.empty-state__code{
	margin:0;
	color:var(--accent);
	font:180px/1 Georgia,serif;
}

.empty-state h1{
	font:48px/1.1 Georgia,serif;
}

/* =========================================================
   WOOCOMMERCE
   ========================================================= */

.woocommerce-main{
	min-height:600px;
}

.woocommerce .woocommerce-breadcrumb{
	margin-bottom:28px;
	color:var(--muted);
	font-size:12px;
}

.woocommerce-products-header__title,
.woocommerce div.product .product_title,
.woocommerce-cart h1,
.woocommerce-checkout h1,
.woocommerce-account h1{
	font:clamp(42px,5vw,70px)/1.04 Georgia,serif;
}

.woocommerce ul.products{
	display:grid!important;
	grid-template-columns:repeat(4,1fr);
	gap:26px;
	margin-top:35px!important;
}

.woocommerce ul.products:before,
.woocommerce ul.products:after{
	display:none!important;
}

.woocommerce ul.products li.product{
	float:none!important;
	width:auto!important;
	margin:0!important;
}

.woocommerce ul.products li.product a img{
	margin:0 0 16px!important;
	border-radius:14px;
	background:var(--soft);
	aspect-ratio:1/1;
	object-fit:cover;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title{
	padding:0!important;
	font-size:15px!important;
}

.woocommerce ul.products li.product .price{
	color:var(--ink)!important;
	font-size:15px!important;
	font-weight:750!important;
}

.woocommerce ul.products li.product .button{
	min-height:42px;
	margin-top:12px!important;
	background:var(--dark)!important;
	color:#fff!important;
}

.product-side-badge{
	display:inline-block;
	margin-bottom:11px;
	padding:6px 10px;
	border-radius:20px;
	background:#fff;
	border:1px solid var(--line);
	color:var(--ink);
	font-size:10px;
	font-weight:800;
	letter-spacing:.12em;
	text-transform:uppercase;
}

.woocommerce ul.products .product-side-badge{
	position:absolute;
	z-index:2;
	top:12px;
	left:12px;
}

.woocommerce span.onsale{
	min-height:0;
	min-width:0;
	padding:7px 11px;
	line-height:1;
	border-radius:20px;
	background:var(--accent);
	font-size:10px;
}

.woocommerce div.product div.images img{
	border-radius:var(--radius);
	background:var(--soft);
}

.woocommerce table.shop_table{
	border-color:var(--line);
	border-radius:12px;
}

/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:980px){
	.site-header__inner{
		grid-template-columns:auto 1fr auto;
	}

	.menu-toggle{
		display:block;
	}

	.primary-navigation{
		display:none;
		position:absolute;
		left:0;
		right:0;
		top:82px;
		padding:20px;
		background:#fff;
		border-bottom:1px solid var(--line);
	}

	.primary-navigation.is-open{
		display:block;
	}

	.menu{
		display:block;
	}

	.menu li{
		margin:14px;
	}

	.site-branding{
		justify-self:center;
		min-width:0;
	}

	.hero{
		min-height:900px;
	}

	.hero__inner{
		min-height:900px;
		display:block;
	}

	.hero__content{
		padding-top:70px;
	}

	.hero__background{
		background-position:center;
	}

	.hero__background::after{
		background:linear-gradient(
			180deg,
			rgba(255,255,255,.60) 0%,
			rgba(255,255,255,.34) 44%,
			rgba(255,255,255,.10) 68%,
			rgba(255,255,255,0) 100%
		);
	}

	.choice-grid{
		grid-template-columns:1fr;
	}

	.footer-grid{
		grid-template-columns:1fr 1fr;
	}

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

	.request-cta__inner{
		align-items:flex-start;
		flex-direction:column;
	}
}

/* =========================================================
   MOBIEL
   ========================================================= */

@media(max-width:680px){

	:root{
		--container:min(100% - 32px,1240px);
	}

	.section{
		padding:64px 0;
	}

	.announcement-bar{
		padding:9px 10px;
		font-size:9px;
		letter-spacing:.06em;
	}

	.site-header{
		background:#20201f;
		border-bottom:1px solid rgba(255,255,255,.10);
	}

	.site-header__inner{
		min-height:82px;
		gap:8px;
	}

	.primary-navigation{
		top:82px;
		background:#20201f;
		border-bottom-color:rgba(255,255,255,.10);
	}

	.primary-navigation a{
		color:#fff;
	}

	.text-logo span{
		color:#fff;
		font-size:25px;
	}

	.text-logo small{
		display:none;
	}

	.icon-button,
	.menu-toggle{
		color:#fff;
	}

	.icon-button{
		width:38px;
	}

	/*
	 * Mobiele hero:
	 * 1. Eerst de volledige schoenenfoto.
	 * 2. Daaronder de donkere tekstsectie.
	 */
	.hero{
		display:flex;
		flex-direction:column;
		min-height:0;
		background:#21140b;
		overflow:hidden;
	}

	/*
	 * Afbeelding bovenaan.
	 * 100% toont het rechterdeel van de brede desktopafbeelding,
	 * zodat de slipper volledig in beeld komt.
	 */
	.hero__background{
		position:relative;
		inset:auto;
		order:1;
		width:100%;
		height:570px;
		background-size:auto 85%;
		background-position:90% bottom;
		background-repeat:no-repeat;
	}

	/*
	 * Heel subtiele overgang van afbeelding naar de donkere tekstzone.
	 */
	.hero__background::after{
		content:"";
		position:absolute;
		inset:0;
		background:linear-gradient(
			180deg,
			rgba(33,20,11,0) 0%,
			rgba(33,20,11,0) 82%,
			rgba(33,20,11,.20) 92%,
			rgba(33,20,11,.72) 100%
		);
	}

	.hero__inner{
		position:relative;
		order:2;
		min-height:0;
		display:block;
		background:
			radial-gradient(circle at 78% 52%,rgba(166,111,66,.20),transparent 34%),
			linear-gradient(135deg,#2b1a0e 0%,#1f130b 100%);
	}

	.hero__content{
		position:relative;
		z-index:3;
		padding:58px 0 64px;
	}

	.hero .eyebrow{
		margin-bottom:24px;
		color:#c49a67;
		font-size:11px;
		letter-spacing:.22em;
	}

	.hero h1{
		max-width:100%;
		margin:0;
		color:#fff;
		font-size:48px;
		line-height:1.03;
		letter-spacing:-.035em;
	}

	.hero__lead{
		max-width:100%;
		margin:30px 0 34px;
		color:rgba(255,255,255,.80);
		font-size:16px;
		line-height:1.75;
	}

	.hero__buttons{
		display:grid;
		grid-template-columns:1fr;
		gap:12px;
	}

	.hero__buttons .button{
		width:100%;
		min-height:62px;
	}

	.hero__buttons .button--dark{
		background:#050803!important;
		color:#fff!important;
	}

	.hero__buttons .button--light{
		background:rgba(32,32,31,.72);
		color:#fff;
		border-color:rgba(255,255,255,.28)!important;
	}

	.hero__proof{
		display:grid;
		gap:8px;
		margin-top:28px;
		color:rgba(255,255,255,.72);
		font-size:12px;
	}

	.section-heading--split{
		align-items:flex-start;
		flex-direction:column;
		gap:15px;
	}

	.footer-benefits{
		padding:50px 0;
	}

	.footer-benefits__grid{
		grid-template-columns:1fr;
		gap:35px;
	}

	.footer-benefits__item strong{
		margin-bottom:10px;
	}

	.footer-benefits__item p{
		max-width:none;
	}

	.footer-links-grid{
		grid-template-columns:1fr;
		gap:32px;
		padding-bottom:45px;
	}

	.copyright-bar__inner{
		min-height:0;
		padding:18px 0;
		flex-direction:column;
		align-items:flex-start;
		gap:10px;
	}

	.footer-menu{
		flex-wrap:wrap;
	}

	.post-grid{
		grid-template-columns:1fr;
	}

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

/* =========================================================
   DEFINITIEVE FOOTER-INDELING
   Plaats dit helemaal onderaan theme.css
   ========================================================= */

/* Bovenste beige voordelenblok */
.footer-benefits{
	width:100%;
	padding:70px 0 65px;
	background:#f0eae1;
	border-top:1px solid #ded7cd;
}

.footer-benefits__grid{
	display:grid !important;
	grid-template-columns:1.45fr 1fr 1fr 1fr !important;
	align-items:start;
	gap:70px;
}

.footer-benefits__brand{
	min-width:0;
}

.footer-benefits__brand .text-logo{
	display:inline-flex;
	flex-direction:column;
}

.footer-benefits__brand .text-logo span{
	color:#191915;
	font-family:Georgia,"Times New Roman",serif;
	font-size:31px;
	font-weight:400;
	line-height:1;
}

.footer-benefits__brand .text-logo small{
	display:block;
	margin-top:8px;
	color:#b28a5a;
	font-size:9px;
	font-weight:700;
	letter-spacing:.18em;
	text-transform:uppercase;
}

.footer-benefits__brand p{
	max-width:320px;
	margin:24px 0 0;
	color:#282622;
	font-size:16px;
	line-height:1.75;
}

.footer-benefits__item{
	min-width:0;
}

.footer-benefits__item strong{
	display:block;
	margin:8px 0 24px;
	color:#191915;
	font-size:14px;
	font-weight:800;
	letter-spacing:.11em;
	text-transform:uppercase;
}

.footer-benefits__item p{
	max-width:270px;
	margin:0;
	color:#282622;
	font-size:16px;
	line-height:1.75;
}

/* Footer met linkkolommen */
.site-footer{
	width:100%;
	padding:55px 0 0 !important;
	background:#e9e1d6 !important;
	color:#191915;
}

.footer-links-grid{
	display:grid !important;
	grid-template-columns:repeat(3,minmax(0,1fr)) !important;
	gap:70px;
	width:100%;
	max-width:900px;
	margin:0 auto;
	padding:0 0 55px;
}

.footer-column{
	min-width:0;
}

.footer-widget__title{
	margin:0 0 22px;
	color:#191915;
	font-size:13px;
	font-weight:800;
	letter-spacing:.12em;
	text-transform:uppercase;
}

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

.footer-widget li{
	margin:11px 0;
}

.footer-widget a{
	color:#292621;
	font-size:15px;
}

.footer-widget a:hover{
	color:var(--accent);
}

/* Zwarte copyrightbalk over volledige breedte */
.copyright-bar{
	display:block;
	width:100%;
	margin:0;
	background:#191915;
	color:#f7f1e8;
}

.copyright-bar__inner{
	min-height:58px;
	display:flex !important;
	align-items:center;
	justify-content:space-between;
	gap:30px;
}

.copyright-bar p{
	margin:0;
	color:#f7f1e8;
	font-size:12px;
}

.copyright-bar a{
	color:#f7f1e8;
	font-size:12px;
}

.footer-menu{
	display:flex;
	flex-wrap:wrap;
	gap:20px;
	margin:0;
	padding:0;
	list-style:none;
}

/* Tablet */
@media(max-width:980px){
	.footer-benefits__grid{
		grid-template-columns:1fr 1fr !important;
		gap:45px;
	}

	.footer-links-grid{
		grid-template-columns:repeat(3,minmax(0,1fr)) !important;
		gap:35px;
		padding-inline:20px;
	}
}

/* Mobiel */
@media(max-width:680px){
	.footer-benefits{
		padding:50px 0;
	}

	.footer-benefits__grid{
		grid-template-columns:1fr !important;
		gap:35px;
	}

	.footer-benefits__item strong{
		margin-bottom:10px;
	}

	.footer-benefits__item p{
		max-width:none;
	}

	.footer-links-grid{
		grid-template-columns:1fr !important;
		gap:32px;
		padding:0 0 45px;
	}

	.copyright-bar__inner{
		min-height:0;
		padding:18px 0;
		flex-direction:column;
		align-items:flex-start;
		gap:10px;
	}
}
