/* Shared scale measured against vloerenplinten.nl, 27 October 2026.
   Loaded after the historical theme files on every public page.
   Noor owns its own scoped stylesheet and keeps its matching drawer design. */
:root{
 --vp-radius-card:12px;--vp-radius-photo:14px;--vp-radius-control:6px;
 --vp-display:clamp(40px,4.8vw,68px);--vp-title:clamp(36px,4vw,56px);
 --vp-section:clamp(30px,3vw,40px);--vp-card:22px;
 --vp-panel:clamp(20px,2.5vw,32px);--vp-space:clamp(48px,6vw,88px);
}
body main{font:400 16px/1.7 var(--vp-sans)}
body main :is(h1,h2,h3){font-family:var(--vp-serif)!important;font-weight:400!important;letter-spacing:-.025em!important;text-wrap:pretty}
body main h1{font-size:var(--vp-title)!important;line-height:1.12!important}
body main h2{font-size:var(--vp-section)!important;line-height:1.18!important}
body main h3{font-size:var(--vp-card)!important;line-height:1.3!important}
body main :is(.dpe-shell,.models-shell,.service-shell,.colour-shell,.contact-shell,.projects-shell,.sx-shell,.seo-shell),
body .dpe-footer-inner,body .dpe-footer-bottom{
 width:min(1280px,calc(100% - 80px))!important;max-width:1280px!important;margin-inline:auto!important;min-width:0;
}
/* One primary/secondary button scale; content determines width, never a forced height. */
body main :is(.dpe-button,.pc-button,.sx-button,.models-button,.service-button,.colour-button,.contact-submit,.contact-form>button,.contact-final a,.journey-model-routes a),
body .dpe-footer-cta,body .dpe-footer .footer-contact .footer-contact-link{
 box-sizing:border-box!important;display:inline-flex;align-items:center;justify-content:center;
 font:600 14px/1.4 var(--vp-sans)!important;letter-spacing:.015em!important;
 min-height:48px!important;height:auto!important;padding:14px 22px!important;
 border:1px solid var(--vp-ink);border-radius:var(--vp-radius-control)!important;
 gap:12px!important;max-width:100%;white-space:normal!important;text-align:center;
 box-shadow:none!important;text-decoration:none;
}
body main :is(.dpe-button,.pc-button,.sx-button,.models-button,.service-button,.colour-button,.contact-submit) svg{width:18px;height:18px;flex-shrink:0}
body main :is(input,select,textarea):not([type=checkbox]):not([type=radio]):not([type=range]){
 font:400 16px/1.5 var(--vp-sans)!important;border-radius:var(--vp-radius-control)!important;min-height:48px;min-width:0;max-width:100%;
}
body main :is(.model-card,.projects-card,.sx-cards article,.assortment-group,.assortment-product,.contact-form,.contact-card,.pc-form,.vp-review-quotes figure){border-radius:var(--vp-radius-card)!important}
body main :is(.pc-photo-wrap,.pc-photo-wrap img,.home-materials-visual img){border-radius:var(--vp-radius-photo)!important}
/* The same framed hero, headline scale, copy width and button treatment. */
body.dpe-home .dpe-site .dpe-hero.vp-editorial-hero{
 width:min(1280px,calc(100% - 80px))!important;max-width:1280px!important;
 margin:46px auto 0!important;border-radius:16px!important;min-height:610px!important;
}
body.dpe-home .dpe-site .vp-editorial-hero .dpe-hero-grid{width:100%!important;max-width:none!important;margin:0!important;min-height:610px!important}
body.dpe-home .dpe-site .vp-editorial-hero .dpe-hero-copy{
 box-sizing:border-box!important;width:64%!important;max-width:800px!important;
 padding:clamp(36px,4.3vw,68px) 24px clamp(36px,4.3vw,68px) clamp(36px,4.3vw,68px)!important;
}
body.dpe-home .dpe-site .vp-editorial-hero h1{
 font:400 var(--vp-display)/1.08 var(--vp-serif)!important;letter-spacing:-.025em!important;
 max-width:10ch!important;margin:0!important;text-wrap:pretty;
}
body.dpe-home .dpe-site .vp-editorial-hero h1 em{font-style:italic!important}
body.dpe-home .dpe-site .vp-editorial-hero .dpe-kicker{
 font:600 11px/1.6 var(--vp-sans)!important;letter-spacing:.16em!important;margin:0 0 24px!important;
}
body.dpe-home .dpe-site .vp-editorial-hero .dpe-lead{
 font:400 16px/1.75 var(--vp-sans)!important;max-width:65ch!important;margin:24px 0 0!important;
}
body.dpe-home .dpe-site .vp-editorial-hero .dpe-actions{margin:28px 0 0!important;gap:12px!important;align-items:stretch!important}
body.dpe-home .dpe-site .vp-editorial-hero .dpe-button{
 font:600 14px/1.4 var(--vp-sans)!important;padding:14px 22px!important;
 min-height:48px!important;border-radius:6px!important;letter-spacing:.015em!important;gap:12px!important;
}
body.dpe-home .dpe-site .vp-editorial-hero .vp-hero-secondary{border-color:#ddc79e!important}
body.dpe-home .dpe-site .vp-editorial-hero .vp-hero-help{
 font:400 13px/1.65 var(--vp-sans)!important;min-height:0!important;margin-top:20px!important;
 text-decoration:underline;text-underline-offset:4px;
}
body.dpe-home .home-hero-note{max-width:470px;margin-top:30px;padding-top:20px;border-top:1px solid #ddc79e40}
body.dpe-home .vp-assurance-strip{width:min(1280px,calc(100% - 80px))!important;margin-inline:auto!important;padding-block:23px!important;gap:20px!important}
body.dpe-home .vp-projects{padding-block:54px!important}
body.dpe-home .vp-projects h2{font-size:clamp(31px,3.2vw,43px)!important;line-height:1.12!important}
body.dpe-home .home-materials{padding-block:64px!important}
body.dpe-home .home-materials h2{font-size:clamp(35px,3.7vw,49px)!important;line-height:1.1!important}
/* Align the header gutters and search control with the webshop. */
@media(min-width:861px){
 body .site-navigation.has-premium-navigation .site-navigation-inner{width:min(1280px,calc(100% - 80px))!important;max-width:1280px!important;margin-inline:auto!important;grid-template-rows:84px auto!important}
 body .site-navigation.has-premium-navigation .vp-header-search{width:100%!important;max-width:490px!important;min-height:53px!important;border-radius:6px!important}
 body .site-navigation.has-premium-navigation .vp-header-search input{min-height:51px!important}
 body .site-navigation.has-premium-navigation .vp-header-brand .site-brand{width:250px!important}
 body .site-navigation .site-navigation-cta{border-radius:6px!important}
}
@media(min-width:761px) and (max-width:1000px){
 body.dpe-home .dpe-site .vp-editorial-hero .dpe-hero-copy{width:76%!important;padding:36px!important}
 body.dpe-home .dpe-site .vp-editorial-hero .dpe-actions{flex-direction:column!important;max-width:370px!important}
}
@media(max-width:760px){
 :root{--vp-title:36px;--vp-display:42px;--vp-section:30px;--vp-card:20px;--vp-panel:22px;--vp-space:48px}
 body main :is(.dpe-shell,.models-shell,.service-shell,.colour-shell,.contact-shell,.projects-shell,.sx-shell,.seo-shell),body .dpe-footer-inner,body .dpe-footer-bottom{width:calc(100% - 36px)!important}
 body.dpe-home .dpe-site .dpe-hero.vp-editorial-hero{width:100%!important;max-width:none!important;margin:0!important;border-radius:0!important;min-height:0!important}
 body.dpe-home .dpe-site .vp-editorial-hero .vp-editorial-photo{height:190px!important;min-height:190px!important;aspect-ratio:auto!important}
 body.dpe-home .dpe-site .vp-editorial-hero .dpe-hero-grid{min-height:0!important}
 body.dpe-home .dpe-site .vp-editorial-hero .dpe-hero-copy{width:100%!important;max-width:none!important;margin-top:-12px!important;padding:0 20px 32px!important}
 body.dpe-home .dpe-site .vp-editorial-hero h1{font-size:42px!important;max-width:12ch!important;line-height:1.08!important}
 body.dpe-home .dpe-site .vp-editorial-hero .dpe-kicker{margin-bottom:16px!important}
 body.dpe-home .dpe-site .vp-editorial-hero .dpe-lead{font-size:14px!important;line-height:1.7!important;margin-top:18px!important}
 body.dpe-home .dpe-site .vp-editorial-hero .dpe-actions{flex-direction:column!important;max-width:none!important;margin-top:20px!important}
 body.dpe-home .dpe-site .vp-editorial-hero .dpe-button{width:100%!important;justify-content:space-between!important;font-size:13px!important;padding:14px 16px!important}
 body.dpe-home .dpe-site .vp-editorial-hero .vp-hero-help{font-size:12px!important;margin-top:18px!important}
 body.dpe-home .home-hero-note{margin-top:20px;padding-top:16px}
 body.dpe-home .vp-assurance-strip{width:calc(100% - 36px)!important;padding-block:20px!important;gap:15px!important}
 body.dpe-home .vp-projects{padding-block:34px!important}
 body.dpe-home .vp-projects h2{font-size:clamp(29px,8vw,36px)!important;line-height:1.15!important}
 body.dpe-home .home-materials{padding-block:35px!important}
 body.dpe-home .home-materials h2{font-size:38px!important}
}
@media(max-width:360px){
 :root{--vp-title:34px;--vp-display:38px;--vp-card:18px;--vp-panel:18px}
 body main :is(.dpe-shell,.models-shell,.service-shell,.colour-shell,.contact-shell,.projects-shell,.sx-shell,.seo-shell),body .dpe-footer-inner,body .dpe-footer-bottom{width:calc(100% - 28px)!important}
 body.dpe-home .dpe-site .vp-editorial-hero h1{font-size:38px!important}
 body main :is(.dpe-button,.pc-button,.sx-button,.models-button,.service-button,.colour-button){padding-inline:16px!important}
}

@media(min-width:761px){
 body.dpe-home .dpe-site .dpe-hero.vp-editorial-hero{display:block!important;position:relative!important;isolation:isolate}
 body.dpe-home .dpe-site .vp-editorial-hero .vp-editorial-photo{position:absolute!important;inset:0!important;z-index:-2!important;width:100%!important;height:100%!important;min-height:0!important;aspect-ratio:auto!important}
 body.dpe-home .dpe-site .vp-editorial-hero:after{display:block!important}
 body.dpe-home .dpe-site .vp-editorial-hero .dpe-hero-grid{display:block!important}
}

/* Legacy navigation replaces arrow SVGs with text spans; keep their box at18px. */
body main :is(.dpe-button,.pc-button,.sx-button,.models-button,.service-button,.colour-button,.contact-submit) span{font:inherit!important}
body main :is(.dpe-button,.pc-button,.sx-button,.models-button,.service-button,.colour-button,.contact-submit) .mobile-decoration{display:inline-flex!important;align-items:center;justify-content:center;width:18px!important;height:18px!important;min-height:0!important;flex:0 0 18px;font:400 18px/1 var(--vp-sans)!important}
body .dpe-footer :is(.dpe-footer-column h2,.dpe-footer-column h3){font:400 21px/1.3 var(--vp-serif)!important;letter-spacing:-.02em!important;text-transform:none!important}

/* The studio loads a separate stylesheet dynamically; match its stronger selector. */
body main .pc .pc-button{
 font:600 14px/1.4 var(--vp-sans)!important;letter-spacing:.015em!important;
 min-height:48px!important;height:auto!important;padding:14px 22px!important;
 border-radius:6px!important;gap:12px!important;
}
body main .pc .pc-button span{font:inherit!important}
body main .pc .pc-button .mobile-decoration{font:400 18px/1 var(--vp-sans)!important;height:18px!important;width:18px!important}

/* Section headings and headings inside cards have distinct roles, as in the webshop. */
body main .model-card h2{font-size:var(--vp-card)!important;line-height:1.3!important}
body main .projects-card h2{font-size:26px!important;line-height:1.3!important}
body main .contact-company h2{font-size:19px!important;line-height:1.4!important}
body main .contact-form-head h2{font-size:28px!important;line-height:1.2!important}
body main .contact-final h2{font-size:28px!important;line-height:1.3!important}
body main .models-intro h1,body main .models-hero h1{max-width:24ch!important}
body main .models-intro>p,body main .models-hero>p:not(.models-eyebrow){max-width:65ch!important;font-size:16px!important;line-height:1.75!important}
@media(max-width:760px){
 body main .contact-form-head h2{font-size:26px!important}
 body main .contact-final h2{font-size:25px!important}
 body main .projects-card h2{font-size:24px!important}
}

/* Match component-scoped legacy rules on inner service pages and final CTAs too. */
body :is(.dpe-site,.models-page,.contact-page,.projects-page,.service-page,.colour-page,.sx-main,.seo-page,.pc) :is(.dpe-button,.pc-button,.sx-button,.models-button,.service-button,.colour-button,.contact-submit){
 font:600 14px/1.4 var(--vp-sans)!important;letter-spacing:.015em!important;
 min-height:48px!important;height:auto!important;padding:14px 22px!important;
 border-radius:6px!important;gap:12px!important;
}
@media(max-width:760px){
 body.dpe-home .dpe-site .vp-editorial-hero .dpe-button{font-size:13px!important;padding:14px 16px!important}
}

/* Editorial project pages previously had unclassed, very small action links. */
body main :is(.button,.brand-button){
 box-sizing:border-box;display:inline-flex!important;align-items:center!important;justify-content:center!important;
 font:600 14px/1.4 var(--vp-sans)!important;letter-spacing:.015em!important;text-transform:none!important;
 min-height:48px!important;height:auto!important;padding:14px 22px!important;border-radius:6px!important;
 gap:12px!important;max-width:100%;white-space:normal!important;text-align:center;text-decoration:none;
}
body main .brand-button svg{width:18px;height:18px;flex-shrink:0}
body main .brand-button span{font:inherit!important}
body main .brand-button .mobile-decoration{font:400 18px/1 var(--vp-sans)!important;width:18px;height:18px}
body .projects-page .projects-hero{
 box-sizing:border-box;width:min(1280px,calc(100% - 80px));max-width:1280px;margin-inline:auto;
 padding:64px 0;gap:64px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
}
body .projects-page .projects-hero h1{max-width:18ch}
body .projects-page .projects-hero>div>span{font:400 16px/1.75 var(--vp-sans);max-width:65ch}
body .projects-page :is(.projects-hero>div>p,.projects-section-head>div>p,.projects-latest article>p:first-child){font:600 11px/1.6 var(--vp-sans);letter-spacing:.14em}
body .projects-page :is(.projects-grid article p,.projects-latest article>p,.projects-details article p,.projects-follow p){font:400 15px/1.75 var(--vp-sans)}
body .projects-page :is(.projects-grid article small,.projects-hero-photo figcaption){font:400 12px/1.65 var(--vp-sans)}
body main .model-card-copy p{font:400 14px/1.55 var(--vp-sans)!important}
body main .model-card-copy small{font:400 13px/1.6 var(--vp-sans)!important}
body main .model-card-copy>span{font:600 11px/1.6 var(--vp-sans)!important}
@media(max-width:760px){
 body .projects-page .projects-hero{width:calc(100% - 36px);padding:32px 0;grid-template-columns:minmax(0,1fr);gap:28px}
 body .projects-page .projects-hero h1{max-width:none}
 body main .model-card-copy p{font-size:13px!important}
 body .projects-page .projects-hero>div>div{flex-wrap:wrap;gap:12px}
}

/* Retain the webshop's left-aligned eyebrow and visible action arrows on phones. */
body.dpe-home .dpe-site .vp-editorial-hero .dpe-kicker{justify-content:flex-start!important;text-align:left!important}
body.dpe-home .dpe-site .vp-editorial-hero .dpe-button>span{display:inline-flex!important;align-items:center!important;justify-content:center!important;flex:0 0 auto!important}
