/*
Theme Name: Blocksy Child
Template: blocksy
Description: Child theme for Blocksy (Pres Auto Parts)
Version: 1.0.1
*/

/* Zorg dat Blocksy header rows dropdowns niet afknijpen */
.ct-header [data-row]{
  overflow: visible !important;
}

/* Verberg de standaard submenu onder "Diensten" */
@media (min-width: 981px){
  .ps-has-mega > .sub-menu,
  .ps-has-mega > .ct-menu-dropdown,
  .ps-has-mega > .ct-dropdown{
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    height: 0 !important;
    overflow: hidden !important;
  }
}

@media (max-width: 980px){
  .ps-has-mega > .sub-menu,
  .ps-has-mega > .ct-menu-dropdown,
  .ps-has-mega > .ct-dropdown{
    display: initial !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    height: auto !important;
    overflow: visible !important;
  }
}

.ps-has-mega{ position: static; }

.ps-has-mega:focus-within > a,
.ps-has-mega:hover > a{
  outline: none;
}

:root{
	--ps-bg:#0a0a0a;
	--ps-text:#f3f3f3;
	--ps-muted:rgba(255,255,255,.72);
	--ps-muted2:rgba(255,255,255,.55);
	--ps-line:rgba(255,255,255,.12);
	--ps-green:#c62828;
	--ps-green2:#e53935;
	--ps-heading:#ffcdd2;
	--ps-shadow:0 14px 34px rgba(0,0,0,.42);
	--ps-max:1240px;
}

.ps-wrap{max-width:var(--ps-max);margin:0 auto;padding:0 18px}

.ps-services a,
.ps-footer a{color:var(--ps-text);text-decoration:none}
.ps-services a:hover,
.ps-footer a:hover{text-decoration:underline}

.ps-services{
	position:relative;
	background:
		radial-gradient(1200px 420px at 70% 45%, rgba(255,255,255,.06), transparent 60%),
		linear-gradient(90deg, rgba(198,40,40,.98) 0%, rgba(198,40,40,.90) 60%, rgba(198,40,40,.80) 100%);
	border-bottom:1px solid rgba(0,0,0,.55);
	box-shadow:var(--ps-shadow);
	overflow:hidden;
}

.ps-services:before{display:none}

.ps-services:after{
	content:"";
	position:absolute;
	left:50%;
	top:0;
	transform:translateX(-50%);
	width:0;height:0;
	border-left:46px solid transparent;
	border-right:46px solid transparent;
	border-top:22px solid transparent;
	filter:drop-shadow(0 10px 10px rgba(0,0,0,.22));
}

.ps-services__inner{position:relative;padding:20px 0 18px}
.ps-services h3{
	margin:0 0 12px;
	font-size:26px;
	font-weight:1000;
	color:var(--ps-heading);
	text-shadow:0 10px 25px rgba(0,0,0,.22);
}

.ps-svc-grid{
	display:grid;
	grid-template-columns:repeat(6, minmax(0, 1fr));
	gap:14px;
	align-items:start;
}

.ps-svc h4{
	margin:0 0 14px;
	font-size:16px;
	font-weight:1000;
	color:#fff;
}

.ps-svc ul{margin:0;padding-left:16px}
.ps-svc li{margin:6px 0;color:rgba(255,255,255,.94)}
.ps-svc li::marker{color:rgba(255,255,255,.9)}
.ps-svc a{font-weight:700}
.ps-svc ul a{font-weight:700 !important}
.ps-svc h4 a{font-weight:1000}

.ps-footer{
	position:relative;
	background:
		radial-gradient(900px 420px at 10% 25%, rgba(198,40,40,.12), transparent 55%),
		radial-gradient(900px 520px at 92% 65%, rgba(255,255,255,.05), transparent 60%),
		linear-gradient(180deg, #101010, #0b0b0b 66%, #090909);
	border-top:1px solid rgba(255,255,255,.10);
	padding:12px 0 10px;
	color:var(--ps-text);
	box-shadow:0 -18px 32px rgba(0,0,0,.45);
}

.ps-footer h3{margin:0 0 10px;font-size:16px;font-weight:1000;color:var(--ps-heading)}
.ps-footer__grid{
	display:grid;
	grid-template-columns:1.08fr 0.78fr 0.78fr 1.45fr .91fr;
	gap:18px;
	align-items:start;
	padding:6px 0 6px;
}

.ps-logoimg{width:150px;max-width:100%;height:auto;display:block;margin-bottom:14px}

.ps-logo-fallback{
	min-height:64px;
	display:flex;align-items:center;justify-content:center;
	padding:14px 18px;
	border-radius:14px;
	border:1px solid rgba(255,255,255,.12);
	background:rgba(255,255,255,.05);
	font-weight:1000;
	color:var(--ps-text);
	text-align:center;
}
.ps-links ul{list-style:none;margin:0;padding:0}
.ps-links li{margin:8px 0}
.ps-links a{color:rgba(255,255,255,.86);font-weight:600}
.ps-links a:hover{color:#fff}

.ps-brands{
	grid-column:1 / -1;
	margin-top:6px;
	padding-top:10px;
	border-top:1px solid rgba(255,255,255,.08);
	display:grid;
	grid-template-columns:1fr 4fr;
	gap:18px;
	align-items:start;
}

.ps-footlogo{display:flex;align-items:center;justify-content:center;padding:6px 0;}
.ps-logoimg--small{width:210px;max-width:100%;margin:0}
.ps-materials h3{margin:0 0 10px;font-size:16px;font-weight:1000;color:var(--ps-heading)}
.ps-brandgrid{
	display:grid;
	grid-template-columns:repeat(6, minmax(0,1fr));
	gap:10px;
	margin-top:10px;
}

.ps-brandtile{
	height:32px;border-radius:10px;
	border:1px solid rgba(255,255,255,.14);
	background:rgba(255,255,255,.06);
	display:flex;align-items:center;justify-content:center;
	font-weight:1000;color:rgba(255,255,255,.92);
	letter-spacing:.04em;text-transform:uppercase;font-size:12px;
	white-space:nowrap;
}

.ps-socials .social-grid{
	display:grid;
	grid-template-columns:repeat(4, 40px);
	gap:10px;
	margin-top:10px;
}

.ps-social{
	width:40px;height:40px;border-radius:12px;
	border:1px solid rgba(255,255,255,.14);
	background:rgba(0,0,0,.22);
	display:grid;place-items:center;
	color:#fff;
}

.ps-social:hover{border-color:rgba(198,40,40,.35);text-decoration:none}
.ps-social svg{width:18px;height:18px;opacity:.95}

.ps-autobrands{
	margin-top:4px;
	padding-top:6px;
	border-top:1px solid rgba(255,255,255,.08);
}

.ps-brandscroller{position:relative;padding-right:56px}
.ps-brandrow{
	display:flex;gap:12px;align-items:center;
	overflow-x:auto;scroll-behavior:smooth;
	padding:4px 6px 6px;
	-webkit-overflow-scrolling:touch;
}

.ps-brandrow::-webkit-scrollbar{height:8px}
.ps-brandrow::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:999px}

.ps-carbrand{
	flex:0 0 auto;
	height:28px;min-width:64px;
	border-radius:999px;border:1px solid rgba(255,255,255,.12);
	background:rgba(0,0,0,.18);
	display:flex;align-items:center;justify-content:center;
	padding:0 12px;
	font-weight:1000;color:rgba(255,255,255,.80);
	font-size:12px;letter-spacing:.04em;text-transform:uppercase;
	white-space:nowrap;
}

.ps-brandfade{
	position:absolute;top:0;right:48px;bottom:0;width:64px;
	background:linear-gradient(90deg, rgba(0,0,0,0), rgba(11,11,11,.92));
	pointer-events:none;
}

.ps-brandnext{
	position:absolute;right:8px;top:50%;transform:translateY(-50%);
	width:40px;height:40px;border-radius:14px;
	border:1px solid rgba(255,255,255,.14);
	background:rgba(0,0,0,.30);
	display:grid;place-items:center;
	cursor:pointer;color:#fff;
}

.ps-brandnext:hover{border-color:rgba(198,40,40,.35)}
.ps-brandnext svg{width:18px;height:18px}

.ps-footer__bottom{
	display:flex;flex-wrap:wrap;gap:14px;
	justify-content:space-between;align-items:center;
	padding:10px 0 2px;
	border-top:1px solid rgba(255,255,255,.08);
	margin-top:4px;
	color:rgba(255,255,255,.62);
	font-size:13px;
}

.ps-bottom-links{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.ps-bottom-links a{color:rgba(229,57,53,.98);font-weight:1000}
.ps-bottom-links a:hover{color:#fff}

@media (max-width:1200px){
	.ps-svc-grid{grid-template-columns:repeat(3, minmax(0,1fr))}
}

@media (max-width:1100px){
	.ps-footer__grid{grid-template-columns:1fr 1fr;gap:16px}
	.ps-brands{grid-column:1 / -1; grid-template-columns:1fr;}
	.ps-brandgrid{grid-template-columns:repeat(3, minmax(0,1fr))}
	.ps-socials .social-grid{grid-template-columns:repeat(6, 40px)}
}

@media (max-width:900px){
	.ps-services__inner{padding:16px 0 16px}
	.ps-services .ps-wrap{padding-left:22px;padding-right:22px}
	.ps-services h3{font-size:22px; margin-bottom:10px}
	.ps-svc-grid{grid-template-columns:repeat(2, minmax(0,1fr)); gap:14px}
	.ps-svc h4{font-size:15px; margin-bottom:10px}
	.ps-svc ul{padding-left:14px}
	.ps-svc li{margin:6px 0; line-height:1.35}

	.ps-footer__grid{grid-template-columns:1fr; gap:12px}
	.ps-depts{grid-column:1 / -1}
	.ps-socialcol{grid-column:1 / -1; text-align:center; margin-top:14px; padding-top:10px; border-top:1px solid rgba(255,255,255,.08);}
	.ps-socialcol .social-grid{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}

	.ps-footer__grid .ps-links ul{display:none}
	.ps-footer__grid .ps-links.ps-acc-open ul{display:block}
	.ps-footer__grid .ps-links h3{cursor:pointer; position:relative; padding-right:22px}
	.ps-footer__grid .ps-links h3:after{
		content:"+";
		position:absolute; right:0; top:0;
		width:18px; height:18px;
		display:grid; place-items:center;
		border:1px solid rgba(255,255,255,.16);
		border-radius:6px;
		background:rgba(0,0,0,.18);
		font-weight:1000;
	}
	.ps-footer__grid .ps-links.ps-acc-open h3:after{content:"–"}

	.ps-footer__grid .ps-col-work ul{display:none}
	.ps-footer__grid .ps-col-work.ps-acc-open ul{display:block}
	.ps-footer__grid .ps-col-work .ps-work-title{cursor:pointer; position:relative; padding-right:22px; margin-bottom:10px}
	.ps-footer__grid .ps-col-work .ps-work-title:after{
		content:"+";
		position:absolute; right:0; top:0;
		width:18px; height:18px;
		display:grid; place-items:center;
		border:1px solid rgba(255,255,255,.16);
		border-radius:6px;
		background:rgba(0,0,0,.18);
		font-weight:1000;
	}
	.ps-footer__grid .ps-col-work.ps-acc-open .ps-work-title:after{content:"–"}
}

@media (max-width:640px){
	.ps-svc-grid{grid-template-columns:repeat(2, minmax(0,1fr))}
	.ps-services h3{font-size:20px}
	.ps-footer__grid{grid-template-columns:1fr}
	.ps-brands{grid-template-columns:1fr;}
	.ps-brandgrid{grid-template-columns:repeat(2, minmax(0,1fr))}
}

@media (max-width:520px){
	.ps-svc h4{font-size:14px; white-space:normal}
	.ps-svc li{font-size:13px}
	.ps-footer h3{font-size:15px}
	.ps-links li{margin:7px 0}
}

@media (max-width:380px){
	.ps-svc-grid{gap:12px}
	.ps-footer__grid{gap:10px}
}