/* ===============================================================
   Warkor — stylesheet
   1. Fonts en basisresets
   2. Responsive typografische schaal
   3. Animatie-keyframes
   4. Mobiele layout (<= 950px)
   5. Semantische resets
   6. Hover-states
   Alle overige opmaak staat als inline stijl bij het element, zodat
   markup en vormgeving per sectie in één oogopslag te lezen zijn.
   =============================================================== */

@font-face{font-family:'Warkor Sans';src:url('/warkor-assets/fonts/warkor-sans.woff2') format('woff2'),url('/warkor-assets/fonts/warkor-sans.woff') format('woff');font-weight:100 700;font-style:normal;font-display:swap}
@font-face{font-family:'Warkor Display';src:url('/warkor-assets/fonts/warkor-display.woff2') format('woff2'),url('/warkor-assets/fonts/warkor-display.woff') format('woff');font-weight:100 700;font-style:normal;font-display:swap}
@font-face{font-family:'Warkor Serif';src:url('/warkor-assets/fonts/warkor-serif.woff2') format('woff2'),url('/warkor-assets/fonts/warkor-serif.woff') format('woff');font-weight:100 700;font-style:normal;font-display:swap}
@font-face{font-family:'Warkor Serif';src:url('/warkor-assets/fonts/warkor-serif-italic.woff2') format('woff2'),url('/warkor-assets/fonts/warkor-serif-italic.woff') format('woff');font-weight:100 700;font-style:italic;font-display:swap}
@font-face{font-family:'Warkor Serif Text';src:url('/warkor-assets/fonts/warkor-serif-text.woff2') format('woff2'),url('/warkor-assets/fonts/warkor-serif-text.woff') format('woff');font-weight:100 700;font-style:normal;font-display:swap}
*{box-sizing:border-box}
html{font-size:min(1.1458333vw,2.0370370svh);background:#14110D;scrollbar-width:none;overflow-x:clip}
@media (max-width:1024px){html{font-size:min(2.1484375vw,3.8194444svh)}}
@media (max-width:768px){html{font-size:min(2.8645833vw,5.0925926svh)}}
@media (max-width:576px){html{font-size:3.8194444vw}}
html::-webkit-scrollbar,body::-webkit-scrollbar{display:none}
body{margin:0;padding:0;background:#FFFFFF;color:#14110D;font-family:'Warkor Sans','Instrument Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
a{color:inherit;text-decoration:none;display:inline-block;cursor:pointer}
a:hover{color:inherit}
p{margin:0;font-weight:normal}
em{font-family:'Warkor Serif','Instrument Serif',Georgia,serif;font-style:italic;font-weight:400}
::selection{background:#46543F;color:#FFFFFF}
input{font-family:'Warkor Sans','Instrument Sans',system-ui,sans-serif}
input:focus{outline:none}
@keyframes wkcar{to{transform:translateX(-100%)}}
@media (max-width:950px){
  [data-hide-m]{display:none !important}
  [data-tl]{display:none !important}
  [data-track]{display:block !important;width:100% !important}
  [data-track] > *{width:100% !important;height:auto !important;min-height:auto !important}
  [data-panel="hero"] [data-hero-img]{height:52svh !important}
  [data-panel="hero"] [data-hero-band]{flex-direction:column !important;height:auto !important;gap:1.6rem;padding:1.6rem 1.4rem 2.6rem !important;align-items:flex-start !important}
  [data-hero-title1]{font-size:3.1rem !important;white-space:normal !important}
  [data-hero-title2]{font-size:2rem !important;white-space:normal !important}
  [data-hero-p]{width:100% !important}
  [data-menu-item] > span:nth-of-type(2){font-size:3rem !important}
  [data-panel="ontwerp"] > *,[data-panel="bouw"] > *,[data-panel="afwerking"] > *{flex-direction:column !important;height:auto !important;padding:3.4rem 1.4rem !important;gap:2rem !important;align-items:flex-start !important}
  [data-phase-num]{font-size:4.5rem !important}
  [data-phase-word]{font-size:3.4rem !important}
  [data-aperture]{width:100% !important;height:auto !important;aspect-ratio:4/3}
  [data-panel="statement"] > *{width:100% !important;padding:3.6rem 1.4rem !important}
  [data-stmt]{font-size:2.2rem !important;line-height:1.22 !important}
  [data-stmt] [data-simg]{width:1.3em !important;height:.85em !important}
  [data-bouw-img]{width:100% !important;height:auto !important;aspect-ratio:4/3}
  [data-afw-fig1]{width:100% !important;margin:0 !important}
  [data-afw-fig2]{width:72% !important;margin:1.4rem 0 0 auto !important}
  [data-panel="marquee"]{width:100% !important;height:auto !important;overflow:clip !important}
  [data-car]{position:relative !important;height:auto !important;transform:none !important;padding:.4rem 0}
  [data-panel="doorkijk"]{height:auto !important;padding:3.4rem 1.4rem !important}
  [data-dk-a],[data-dk-b],[data-dk-c]{position:relative !important;left:auto !important;top:auto !important;bottom:auto !important;width:100% !important;height:auto !important}
  [data-dk-a]{aspect-ratio:4/3}
  [data-dk-b]{width:72% !important;margin:1.4rem 0 0 auto}
  [data-dk-c]{width:56% !important;margin:1.4rem 0}
  [data-dk-text]{position:relative !important;left:auto !important;top:auto !important;transform:none !important;white-space:normal !important;font-size:2.6rem !important;margin:1.6rem 0}
  [data-dk-cap]{position:relative !important;left:auto !important;bottom:auto !important;width:100% !important}
  [data-panel="waarden"]{flex-direction:column !important;height:auto !important}
  [data-wmedia]{width:100% !important;height:42svh !important}
  [data-panel="waarden"] > *:last-child{padding:2.4rem 1.4rem 2.8rem !important}
  [data-wcontent]{padding:1.3rem 0 1.4rem !important}
  [data-wword]{font-size:2.2rem !important;white-space:normal !important}
  [data-wdesc-m]{display:block !important}
  [data-panel="projecten"]{padding:3.4rem 1.4rem !important;display:flex !important;gap:1rem !important;overflow-x:auto !important;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;align-items:stretch !important}
  [data-panel="projecten"]::-webkit-scrollbar{display:none}
  [data-pintro]{width:76vw !important;height:auto !important;flex-shrink:0;scroll-snap-align:start;justify-content:flex-start !important;gap:1.6rem}
  [data-card]{width:80vw !important;height:auto !important;margin:0 !important;flex-shrink:0;scroll-snap-align:center}
  [data-card] [data-cimgw]{aspect-ratio:4/5;height:auto !important;flex:none !important}
  [data-ctacard]{width:80vw !important;height:auto !important;aspect-ratio:4/5;flex-shrink:0;scroll-snap-align:center}
  [data-panel="slot"]{width:100% !important;height:auto !important;padding:4rem 1.4rem !important}
  [data-slot-c]{width:100% !important;height:auto !important;transform:none !important;display:flex !important;flex-direction:column !important}
  [data-slot-media]{width:100% !important;transform:none !important}
  [data-slot-t1],[data-slot-t2]{position:relative !important;top:auto !important;left:auto !important;right:auto !important;bottom:auto !important;font-size:2.6rem !important;mix-blend-mode:normal !important;color:#EAE7E1 !important}
  [data-slot-t1]{order:-1;margin-bottom:1.2rem}
  [data-slot-t2]{align-self:flex-end;text-align:right;margin-top:1.2rem}
  [data-sec="overons"]{padding:4rem 1.4rem !important}
  [data-oo-title]{font-size:3.4rem !important}
  [data-oo-cols]{flex-direction:column !important;gap:1.6rem !important}
  [data-oo-cols] > *{width:100% !important}
  [data-sec="offerte"]{padding:4rem 1.4rem !important}
  [data-off-title]{font-size:3.4rem !important}
  [data-form]{width:100% !important}
  [data-fbig],[data-fopt],[data-form] input{font-size:1.35rem !important}
  [data-form] input[type="email"]{min-width:100% !important}
  [data-fw-word]{font-size:21vw !important}
}

/* ---------------------------------------------------------------
   Resets voor semantische elementen: h1-h6, blockquote en figure
   erven volledig van hun eigen opmaak, zodat de typografie exact
   gelijk blijft aan het ontwerp.
   --------------------------------------------------------------- */
h1,h2,h3,h4,h5,h6{margin:0;font:inherit;font-weight:inherit;letter-spacing:inherit;text-transform:inherit}
blockquote,figure,figcaption{margin:0}
.skip-link{position:absolute;left:-9999px;top:0;z-index:3000;background:#14110D;color:#EAE7E1;padding:.75rem 1rem;font-size:.85rem}
.skip-link:focus{left:1rem;top:1rem}

/* --- 6. Hover-states --- */
.is-hover-1:hover{background:#EAE7E1 !important;color:#14110D !important}
.is-hover-2:hover{background:#46543F !important;color:#FFFFFF !important}
.is-hover-3:hover{color:#46543F !important}
.is-hover-4:hover{background:#46543F !important;color:#FFFFFF !important;border-color:#46543F !important}
