/*
Theme Name: Woutec
Template: twentytwentyfive
Version: 2.0.4
Description: Child theme voor Woutec Horeca Service.
Text Domain: woutec
*/
@font-face{font-family:Rubik;font-weight:400;font-display:swap;src:url(assets/fonts/rubik-latin-400.woff2) format("woff2")}
@font-face{font-family:Rubik;font-weight:500;font-display:swap;src:url(assets/fonts/rubik-latin-500.woff2) format("woff2")}
@font-face{font-family:Rubik;font-weight:700;font-display:swap;src:url(assets/fonts/rubik-latin-700.woff2) format("woff2")}

:root{--w-red:#e31939;--w-red-dark:#b71234;--w-navy:#1c2536;--w-sand:#efe8e0;--w-grey:#5b6266;--w-line:#e6eaf0;--w-wrap:1240px;--w-gutter:clamp(16px,4vw,40px)}
body{font-family:Rubik,sans-serif}

/* Top bar + header */
.wp-site-blocks>header{position:sticky;top:-38px;z-index:100}
body.admin-bar .wp-site-blocks>header{top:calc(var(--wp-admin--admin-bar--height,32px) - 38px)}
.woutec-topbar{align-items:center;background:var(--w-navy);color:#fff;font-size:13px;height:38px;margin:0;padding:0 var(--w-gutter)}
.woutec-topbar p{margin:0}
.woutec-topbar a{color:inherit;margin-left:24px;text-decoration:none}
.woutec-topbar a:hover{text-decoration:underline}
.woutec-header{align-items:center;background:#fff;box-shadow:0 1px 0 var(--w-line);gap:24px;margin:0;padding:12px var(--w-gutter)}
.woutec-logo{display:block;line-height:0}
.woutec-logo img{height:64px;width:auto}
.woutec-logo .is-light{display:none}
.woutec-header .wp-block-navigation{color:var(--w-navy);font-size:16px;font-weight:500;gap:2em;margin-inline:auto}
.woutec-header .wp-block-navigation-item__content:hover,.woutec-header .current-menu-item>.wp-block-navigation-item__content{color:var(--w-red)}
.woutec-header .wp-block-navigation__responsive-container.is-menu-open{background:#fff;color:var(--w-navy)}
.woutec-header-cta{margin:0;white-space:nowrap}
.woutec-header-cta a{background:var(--w-red);border-radius:5px;color:#fff;display:block;font-size:15px;font-weight:500;line-height:45px;padding:0 20px;text-decoration:none;transition:background-color .2s}
.woutec-header-cta a:hover{background:var(--w-red-dark)}

/* Buttons */
.wp-block-post-content .wp-block-button__link{background:var(--w-red);border:2px solid var(--w-red);border-radius:5px;color:#fff;font-family:Rubik,sans-serif;font-size:16px;font-weight:500;line-height:45px;padding:0 24px;text-decoration:none;transition:background-color .2s,border-color .2s}
.wp-block-post-content .wp-block-button__link:hover{background:var(--w-red-dark);border-color:var(--w-red-dark)}
.wp-block-post-content .is-style-outline .wp-block-button__link{background:transparent;border-color:currentColor;color:var(--w-red)}
.wp-block-post-content .woutec-banner .is-style-outline .wp-block-button__link{color:#fff}
.wp-block-post-content .is-style-outline .wp-block-button__link:hover{background:var(--w-navy);border-color:var(--w-navy);color:#fff}

/* Homepage */
body.home .wp-site-blocks>main{margin-top:0}
body.home .wp-block-post-content{color:var(--w-grey);font-size:17px;line-height:1.65}
body.home .wp-block-post-content>*{margin-block:0}
.woutec-section{padding:clamp(48px,6vw,80px) var(--w-gutter)}
.woutec-section>*{margin-inline:auto;max-width:var(--w-wrap)}
.woutec-section h2,.woutec-banner h1{color:var(--w-navy);font-family:Rubik,sans-serif;font-weight:500;letter-spacing:-.01em;line-height:1.2}
.woutec-section h2{font-size:clamp(1.75rem,3vw,2.5rem);margin-block:0 clamp(24px,3vw,40px)}
.woutec-section h3{color:var(--w-navy);font-family:Rubik,sans-serif;font-size:1.375rem;font-weight:500;line-height:1.3;margin:0 0 .5rem}

/* Banner */
.woutec-banner{min-height:min(72vh,680px);padding:0}
.woutec-banner .wp-block-cover__inner-container{margin-inline:auto;max-width:var(--w-wrap);padding:0 var(--w-gutter) clamp(32px,5vw,64px);width:100%}
.woutec-banner h1{color:#fff;font-size:clamp(2.25rem,5vw,4rem);margin:0 0 1.5rem}
.woutec-banner .wp-block-cover__inner-container>*{margin-inline:0;max-width:none}
.woutec-banner .wp-block-buttons{gap:12px;justify-content:flex-start}
.woutec-banner .wp-block-cover__background{background:linear-gradient(to top,rgba(28,37,54,.9),rgba(28,37,54,.55) 55%,rgba(28,37,54,.15))!important;opacity:1!important}

/* Welcome */
.woutec-welcome{padding-bottom:0;text-align:center}
.woutec-welcome>*{max-width:760px}
.woutec-welcome h2{margin-bottom:1rem}

/* Featured cards */
.woutec-cards{display:grid;gap:24px;grid-template-columns:repeat(2,1fr)}
.woutec-cards>*,.woutec-tiles>*{margin:0}
.woutec-card{background:#fff;border-radius:5px;box-shadow:0 2px 12px rgba(28,37,54,.1);overflow:hidden;position:relative;transition:box-shadow .2s}
.woutec-card:hover{box-shadow:0 8px 28px rgba(28,37,54,.16)}
.woutec-card .wp-block-image{aspect-ratio:16/9;margin:0}
.woutec-card .wp-block-image img{height:100%;object-fit:cover;width:100%}
.woutec-card .wp-block-image img[src*=onderdelen]{object-fit:contain;padding:12px}
.woutec-card-body{padding:24px 28px 28px}
.woutec-card h3 a{color:inherit;text-decoration:none}
.woutec-card h3 a::after{content:"";inset:0;position:absolute}
.woutec-card p{margin:0}
.woutec-card .woutec-more{color:var(--w-red);font-weight:500;margin-top:.75rem}
.woutec-card .woutec-more::after{content:" \2192"}

/* Image tiles */
.woutec-tiles-section{background:#f7f7f8}
.woutec-tiles{display:grid;gap:16px;grid-template-columns:repeat(3,1fr)}
.woutec-tile{aspect-ratio:4/3;border-radius:5px;margin:0;min-height:0;overflow:hidden;padding:24px;position:relative}
.woutec-tile .wp-block-cover__image-background{transition:transform .4s}
.woutec-tile:hover .wp-block-cover__image-background{transform:scale(1.05)}
.woutec-tile .wp-block-cover__inner-container>*{margin-inline:0;max-width:none}
.woutec-section .woutec-tile .wp-block-cover__inner-container{margin:0!important;max-width:none;padding-inline:0!important;text-align:left;width:100%!important}
.woutec-section .woutec-tile h3{color:#fff;margin:0!important;max-width:none;text-align:left!important;width:100%}
.woutec-tile .wp-block-cover__background{background:linear-gradient(to top,rgba(28,37,54,.8),rgba(28,37,54,0) 60%)!important;opacity:1!important}
.woutec-tile h3 a{color:inherit;text-decoration:none}
.woutec-tile h3 a::after{content:"";inset:0;position:absolute}
.woutec-tiles-section .wp-block-buttons{justify-content:center;margin-top:32px}

/* Contact panel */
.woutec-visit{background:var(--w-sand)}
.woutec-section .wp-block-columns{align-items:center;gap:clamp(32px,6vw,80px)}
.woutec-visit h2{margin-bottom:1rem}
.woutec-rows{background:#fff;border-radius:5px;list-style:none;margin:0;padding:8px 24px}
.woutec-rows li{display:flex;flex-wrap:wrap;gap:4px 16px;justify-content:space-between;padding:14px 0}
.woutec-rows li+li{border-top:1px solid var(--w-line)}
.woutec-rows strong{color:var(--w-navy);font-weight:500}
.woutec-rows a{color:var(--w-red)}

/* Brands */
.woutec-brands-section h2{text-align:center}
.woutec-brands{align-items:center;display:flex;flex-wrap:wrap;gap:16px;justify-content:center}
.woutec-brands .wp-block-image{flex:0 0 calc((100% - 80px)/6);margin:0;min-width:110px}
.woutec-brands img{height:auto;width:100%}

/* About */
.woutec-about{background:#f7f7f8}
.woutec-about .wp-block-columns{align-items:flex-start}

/* Footer */
.wp-site-blocks>footer{margin-top:0}
.woutec-footer{background:var(--w-navy);color:#d5dae2;font-family:Rubik,sans-serif;font-size:15px;margin-top:0;padding:56px var(--w-gutter)}
.woutec-footer .wp-block-columns{margin-inline:auto;max-width:var(--w-wrap)}
.woutec-footer h3{color:#fff;font-family:Rubik,sans-serif;font-size:16px;font-weight:500;margin:0 0 .75rem}
.woutec-footer a{color:inherit}
.woutec-footer .woutec-logo .is-dark{display:none}
.woutec-footer .woutec-logo .is-light{display:block}

@media (max-width:900px){
	.woutec-cards,.woutec-tiles{grid-template-columns:1fr}
	.woutec-tile{aspect-ratio:16/9}
	.woutec-brands .wp-block-image{flex-basis:calc((100% - 32px)/3);min-width:0}
}
@media (max-width:600px){
	.woutec-usp{display:none}
	.woutec-topbar{justify-content:flex-end}
	.woutec-topbar a{margin-left:16px}
	.woutec-logo img{height:48px}
	.woutec-header{gap:12px}
	.woutec-header .wp-block-navigation{margin-inline:0;order:3}
	.woutec-header-cta{margin-left:auto}
}
