/* Product detail pages */
body.product-page{
  --bg:#f7f2ea;
  --panel:#fffdf9;
  --sand:#e7d9c0;
  --text:#1f1d1a;
  --muted:#5e564d;
  --terracotta:#8a3f24;
  --olive:#6f7a58;
  --line:rgba(31,29,26,.08);
  --shadow:0 18px 40px rgba(58,42,27,.08);
}
body.product-page, body.product-page *{box-sizing:border-box}
body.product-page{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  background:linear-gradient(180deg,#f5efe7,#faf7f2);
  color:var(--text);
}
body.product-page a{text-decoration:none;color:inherit}
body.product-page .wrap{max-width:1200px;margin:0 auto;padding:0 24px}
body.product-page header{
  background:rgba(255,253,249,.8);
  backdrop-filter:blur(6px);
  position:sticky;top:0;z-index:20;
  border-bottom:1px solid var(--line);
}
body.product-page .nav{
  display:flex;justify-content:space-between;align-items:center;
  min-height:82px;
}
body.product-page .brand{font-weight:700;letter-spacing:.04em}
body.product-page nav{display:flex;gap:22px;color:var(--muted);font-size:.96rem}
body.product-page .btn{
  display:inline-block;
  padding:15px 24px;
  border-radius:999px;
  font-weight:700;
  border:1px solid transparent;
  transition:.2s ease
}
body.product-page .btn-primary{background:var(--text);color:#fff}
body.product-page .btn-primary:hover{background:#2e2a27}
body.product-page .btn-light{
  background:#f3ece2;
  color:var(--text);
  border-color:var(--line);
}
body.product-page .hero{padding:56px 0 26px}
body.product-page .hero-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:34px;
}
body.product-page .eyebrow{
  display:inline-flex;
  padding:7px 12px;
  background:#f2e7db;
  border-radius:999px;
  color:var(--terracotta);
  font-weight:700;
  font-size:.74rem;
  letter-spacing:.10em;
  text-transform:uppercase;
}
body.product-page h1{
  font-size:clamp(2.8rem,5vw,4.9rem);
  line-height:1.02;
  letter-spacing:-.06em;
  margin:20px 0 18px;
}
body.product-page .lead{
  max-width:600px;
  color:var(--muted);
  font-size:1.08rem;
  line-height:1.7;
}
body.product-page .cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
body.product-page .panel{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:30px;
  overflow:hidden;
  box-shadow:var(--shadow);
}
body.product-page .hero-visual{
  background:linear-gradient(180deg,#f2e6d7,#f8f3ee);
  min-height:420px;
}
body.product-page .hero-visual img, body.product-page .hero-visual video{
  width:100%;
  height:100%;
  min-height:420px;
  object-fit:cover;
  display:block;
}
body.product-page .hero-visual picture{display:block;height:100%}
body.product-page .video-frame{
  width:min(100%,960px,calc((100vh - 260px) * 16 / 9));
  aspect-ratio:16 / 9;
  min-height:0;
  margin:0 auto;
}
body.product-page .video-frame video{
  min-height:0;
  object-fit:contain;
}
body.product-page .section{padding:40px 0 62px}
body.product-page .heading-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:18px;
  margin-bottom:22px;
}
body.product-page h2{
  margin:0;
  font-size:clamp(2rem,3vw,2.8rem);
  letter-spacing:-.04em;
}
body.product-page h3{margin:0 0 12px}
body.product-page .muted{color:var(--muted)}
body.product-page .content-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px;
}
body.product-page .content-card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:24px;
  padding:26px;
  box-shadow:var(--shadow);
}
body.product-page .content-card p, body.product-page .content-card li{
  color:var(--muted);
  line-height:1.7;
}
body.product-page .content-card p:last-child{margin-bottom:0}
body.product-page .content-card ul{padding-left:22px;margin:12px 0 0}
body.product-page .cta{
  background:linear-gradient(135deg,#f5eadf,#fdf9f4);
  border:1px solid var(--line);
  border-radius:26px;
  padding:28px 30px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
}
body.product-page .cta h3{font-size:clamp(1.5rem,2vw,2.4rem)}
body.product-page .cta p{margin:0;color:var(--muted)}
body.product-page footer{
  padding:36px 0 54px;
  text-align:center;
  color:var(--muted);
  font-size:.92rem;
}
@media (max-width:900px){body.product-page nav{display:none}
body.product-page .hero-grid, body.product-page .content-grid{grid-template-columns:1fr}
body.product-page .cta{display:block}
body.product-page .cta .btn{margin-top:18px}
}


/* Home */
body.home-page{
  --bg:#f7f2ea;
  --panel:#fffdf9;
  --sand:#e7d9c0;
  --text:#1f1d1a;
  --muted:#5e564d;
  --terracotta:#8a3f24;
  --olive:#6f7a58;
  --line:rgba(31,29,26,.08);
  --shadow:0 18px 40px rgba(58,42,27,.08);
}
body.home-page, body.home-page *{box-sizing:border-box}
body.home-page{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  background:linear-gradient(180deg,#f5efe7,#faf7f2);
  color:var(--text);
}
body.home-page a{text-decoration:none;color:inherit}
body.home-page .wrap{max-width:1200px;margin:0 auto;padding:0 24px}
body.home-page header{
  background:rgba(255,253,249,.8);
  backdrop-filter:blur(6px);
  position:sticky;top:0;z-index:20;
  border-bottom:1px solid var(--line);
}
body.home-page .nav{
  display:flex;justify-content:space-between;align-items:center;
  min-height:82px;
}
body.home-page .brand{
  display:flex;align-items:center;gap:12px;
  font-weight:700;letter-spacing:.04em;
}
body.home-page .brand img{
  width:72px;height:72px;border-radius:18px;object-fit:cover
}
body.home-page nav{
  display:flex;gap:22px;color:var(--muted);font-size:.96rem
}
body.home-page .btn{
  display:inline-block;
  padding:15px 24px;
  border-radius:999px;
  font-weight:700;
  border:1px solid transparent;
  transition:.2s ease
}
body.home-page .btn-primary{
  background:var(--text);
  color:#fff;
}
body.home-page .btn-primary:hover{
  background:#2e2a27;
}
body.home-page .btn-light{
  background:#f3ece2;
  color:var(--text);
  border-color:var(--line);
}
body.home-page .hero{
  padding:56px 0 26px;
}
body.home-page .hero-grid{
  display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:34px;
}
body.home-page .eyebrow{
  display:inline-flex;
  padding:7px 12px;
  background:#f2e7db;
  border-radius:999px;
  color:var(--terracotta);
  font-weight:700;
  font-size:.74rem;
  letter-spacing:.10em;
  text-transform:uppercase;
}
body.home-page h1{
  font-size:clamp(2.8rem,5vw,4.9rem);
  line-height:1.02;
  letter-spacing:-.06em;
  margin:20px 0 18px;
}
body.home-page .lead{
  max-width:600px;
  color:var(--muted);
  font-size:1.08rem;
  line-height:1.7;
}
body.home-page .cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
body.home-page .panel{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:30px;
  overflow:hidden;
  box-shadow:var(--shadow);
}
body.home-page .hero-visual{
  background:linear-gradient(180deg,#f2e6d7,#f8f3ee);
  min-height:520px;
}
body.home-page .hero-visual img{
  width:100%;height:100%;object-fit:cover;display:block
}
body.home-page .hero-visual picture{display:block;height:100%}
body.home-page .stats{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px;
}
body.home-page .stat{
  background:#fffdf9;
  border:1px solid var(--line);
  border-radius:18px;
  padding:18px;
}
body.home-page .stat strong{display:block;font-size:1.8rem;color:var(--terracotta)}
body.home-page .section{padding:62px 0}
body.home-page .heading-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:18px;
  margin-bottom:22px;
}
body.home-page h2{
  margin:0;
  font-size:clamp(2rem,3vw,2.8rem);
  letter-spacing:-.04em;
}
body.home-page .muted{color:var(--muted)}
body.home-page .products{
  display:grid;grid-template-columns:repeat(3,1fr);gap:26px;
}
body.home-page .product-card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:24px;
  overflow:hidden;
  box-shadow:var(--shadow);
}
body.home-page .product-card img{
  width:100%;height:250px;object-fit:cover;display:block
}
body.home-page .product-card picture{display:block}
body.home-page .product-body{
  padding:22px
}
body.home-page .product-body h3{margin:0 0 10px}
body.home-page .product-body p{
  margin:0 0 18px;
  color:var(--muted);
  line-height:1.6;
}
body.home-page .features{
  display:grid;grid-template-columns:repeat(4,1fr);gap:22px;
}
body.home-page .feature{
  background:#fffdf9;
  border:1px solid var(--line);
  border-radius:22px;
  padding:24px 20px;
}
body.home-page .feature strong{display:block;margin:10px 0 8px;font-size:1.05rem}
body.home-page .feature span{color:var(--muted);line-height:1.6}
body.home-page .cta{
  background:linear-gradient(135deg,#f5eadf,#fdf9f4);
  border:1px solid var(--line);
  border-radius:26px;
  padding:28px 30px;
  display:flex;justify-content:space-between;align-items:center;gap:20px;
}
body.home-page .cta h3{margin:0 0 8px;font-size:clamp(1.5rem,2vw,2.4rem)}
body.home-page .cta p{margin:0;color:var(--muted)}
body.home-page footer{
  padding:36px 0 54px;
  text-align:center;
  color:var(--muted);
  font-size:.92rem
}
@media (max-width:900px){body.home-page nav{display:none}
body.home-page .hero-grid, body.home-page .products, body.home-page .features{grid-template-columns:1fr}
body.home-page .cta{display:block}
}
  

/* Contact */
body.contact-page{
  --bg:#f7f2ea;
  --panel:#fffdf9;
  --sand:#e7d9c0;
  --text:#1f1d1a;
  --muted:#5e564d;
  --terracotta:#b56a46;
  --olive:#6f7a58;
  --line:rgba(31,29,26,.08);
  --shadow:0 18px 40px rgba(58,42,27,.08);
}
body.contact-page, body.contact-page *{box-sizing:border-box}
body.contact-page{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  background:linear-gradient(180deg,#f5efe7,#faf7f2);
  color:var(--text);
}
body.contact-page a{text-decoration:none;color:inherit}
body.contact-page .wrap{max-width:1200px;margin:0 auto;padding:0 24px}
body.contact-page header{
  background:rgba(255,253,249,.8);
  backdrop-filter:blur(6px);
  position:sticky;top:0;z-index:20;
  border-bottom:1px solid var(--line);
}
body.contact-page .nav{
  display:flex;justify-content:space-between;align-items:center;
  min-height:82px;
}
body.contact-page .brand{
  display:flex;align-items:center;gap:12px;
  font-weight:700;letter-spacing:.04em;
}
body.contact-page nav{
  display:flex;gap:22px;color:var(--muted);font-size:.96rem
}
body.contact-page .btn{
  display:inline-block;
  padding:15px 24px;
  border-radius:999px;
  font-weight:700;
  border:1px solid transparent;
  transition:.2s ease;
  cursor:pointer;
  font:inherit;
}
body.contact-page .btn-primary{
  background:var(--text);
  color:#fff;
}
body.contact-page .btn-primary:hover{
  background:#2e2a27;
}
body.contact-page .btn-primary:disabled{
  cursor:wait;
  opacity:.7;
}
body.contact-page .btn-light{
  background:#f3ece2;
  color:var(--text);
  border-color:var(--line);
}
body.contact-page .hero{padding:56px 0 26px}
body.contact-page .eyebrow{
  display:inline-flex;
  padding:7px 12px;
  background:#f2e7db;
  border-radius:999px;
  color:var(--terracotta);
  font-weight:700;
  font-size:.74rem;
  letter-spacing:.10em;
  text-transform:uppercase;
}
body.contact-page h1{
  font-size:clamp(2.8rem,5vw,4.9rem);
  line-height:1.02;
  letter-spacing:-.06em;
  margin:20px 0 18px;
}
body.contact-page .lead{
  max-width:700px;
  color:var(--muted);
  font-size:1.08rem;
  line-height:1.7;
}
body.contact-page .section{padding:22px 0 62px}
body.contact-page .contact-grid{
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(280px,.8fr);
  gap:26px;
  align-items:start;
}
body.contact-page .panel{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:30px;
  overflow:hidden;
  box-shadow:var(--shadow);
}
body.contact-page .form-panel{padding:30px}
body.contact-page .contact-panel{
  padding:30px;
  background:linear-gradient(135deg,#f5eadf,#fdf9f4);
}
body.contact-page h2{
  margin:0 0 10px;
  font-size:clamp(1.7rem,3vw,2.2rem);
  letter-spacing:-.04em;
}
body.contact-page h2.contact-subheading{margin-top:16px}
body.contact-page .muted{color:var(--muted)}
body.contact-page .form-intro{margin:0 0 24px;line-height:1.6}
body.contact-page .form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
body.contact-page .field{display:flex;flex-direction:column;gap:8px}
body.contact-page .field-full{grid-column:1/-1}
body.contact-page label{font-weight:700;font-size:.95rem}
body.contact-page input, body.contact-page select, body.contact-page textarea{
  width:100%;
  padding:14px 15px;
  border:1px solid rgba(31,29,26,.16);
  border-radius:12px;
  background:#fff;
  color:var(--text);
  font:inherit;
}
body.contact-page input:focus, body.contact-page select:focus, body.contact-page textarea:focus{
  outline:3px solid rgba(181,106,70,.2);
  border-color:var(--terracotta);
}
body.contact-page textarea{min-height:160px;resize:vertical}
body.contact-page .form-actions{
  display:flex;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  margin-top:20px;
}
body.contact-page .form-status{margin:0;line-height:1.5}
body.contact-page .form-status[data-state="error"]{color:#a33125}
body.contact-page .form-status[data-state="success"]{color:#42633a}
body.contact-page .contact-details{
  display:grid;
  gap:20px;
  margin-top:24px;
}
body.contact-page .contact-details div{display:grid;gap:5px}
body.contact-page .contact-details strong{font-size:1rem}
body.contact-page .contact-details a{color:var(--terracotta);font-weight:700}
body.contact-page .contact-note{
  margin:24px 0 0;
  padding-top:20px;
  border-top:1px solid var(--line);
  color:var(--muted);
  line-height:1.6;
}
body.contact-page footer{
  padding:36px 0 54px;
  text-align:center;
  color:var(--muted);
  font-size:.92rem;
}
@media (max-width:900px){body.contact-page nav{display:none}
body.contact-page .contact-grid{grid-template-columns:1fr}
}
@media (max-width:600px){body.contact-page .form-panel, body.contact-page .contact-panel{padding:22px}
body.contact-page .form-grid{grid-template-columns:1fr}
body.contact-page .field-full{grid-column:auto}
}
  

/* OnzeProducten */
body.products-page{
  --bg:#f7f2ea;
  --panel:#fffdf9;
  --sand:#e7d9c0;
  --text:#1f1d1a;
  --muted:#5e564d;
  --terracotta:#b56a46;
  --olive:#6f7a58;
  --line:rgba(31,29,26,.08);
  --shadow:0 18px 40px rgba(58,42,27,.08);
}
body.products-page, body.products-page *{box-sizing:border-box}
body.products-page{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  background:linear-gradient(180deg,#f5efe7,#faf7f2);
  color:var(--text);
}
body.products-page a{text-decoration:none;color:inherit}
body.products-page .wrap{max-width:1200px;margin:0 auto;padding:0 24px}
body.products-page header{
  background:rgba(255,253,249,.8);
  backdrop-filter:blur(6px);
  position:sticky;top:0;z-index:20;
  border-bottom:1px solid var(--line);
}
body.products-page .nav{
  display:flex;justify-content:space-between;align-items:center;
  min-height:82px;
}
body.products-page .brand{
  display:flex;align-items:center;gap:12px;
  font-weight:700;letter-spacing:.04em;
}
body.products-page nav{
  display:flex;gap:22px;color:var(--muted);font-size:.96rem
}
body.products-page .btn{
  display:inline-block;
  padding:15px 24px;
  border-radius:999px;
  font-weight:700;
  border:1px solid transparent;
  transition:.2s ease
}
body.products-page .btn-primary{
  background:var(--text);
  color:#fff;
}
body.products-page .btn-primary:hover{
  background:#2e2a27;
}
body.products-page .btn-light{
  background:#f3ece2;
  color:var(--text);
  border-color:var(--line);
}
body.products-page .hero{
  padding:56px 0 26px;
}
body.products-page .eyebrow{
  display:inline-flex;
  padding:7px 12px;
  background:#f2e7db;
  border-radius:999px;
  color:var(--terracotta);
  font-weight:700;
  font-size:.74rem;
  letter-spacing:.10em;
  text-transform:uppercase;
}
body.products-page h1{
  font-size:clamp(2.8rem,5vw,4.9rem);
  line-height:1.02;
  letter-spacing:-.06em;
  margin:20px 0 18px;
}
body.products-page .lead{
  max-width:760px;
  color:var(--muted);
  font-size:1.08rem;
  line-height:1.7;
}
body.products-page .section{padding:34px 0 62px}
body.products-page .heading-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:18px;
  margin-bottom:22px;
}
body.products-page h2{
  margin:0;
  font-size:clamp(2rem,3vw,2.8rem);
  letter-spacing:-.04em;
}
body.products-page .muted{color:var(--muted)}
body.products-page .products{
  display:grid;grid-template-columns:repeat(3,1fr);gap:26px;
}
body.products-page .product-card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:24px;
  overflow:hidden;
  box-shadow:var(--shadow);
  display:flex;
  flex-direction:column;
}
body.products-page .product-card img{
  width:100%;height:250px;object-fit:cover;display:block
}
body.products-page .product-card picture{display:block}
body.products-page .product-body{
  padding:22px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  flex:1;
}
body.products-page .product-body h3{margin:0 0 10px}
body.products-page .product-body p{
  margin:0 0 18px;
  color:var(--muted);
  line-height:1.6;
  flex:1;
}
body.products-page footer{
  padding:36px 0 54px;
  text-align:center;
  color:var(--muted);
  font-size:.92rem
}
@media (max-width:900px){body.products-page nav{display:none}
body.products-page .products{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:600px){body.products-page .products{grid-template-columns:1fr}
body.products-page .heading-row{align-items:flex-start;flex-direction:column}
}
  

/* 404.html */
body.not-found-page{ background: #ECEFF1; color: rgba(0,0,0,0.87); font-family: Roboto, Helvetica, Arial, sans-serif; margin: 0; padding: 0; }
body.not-found-page #message{ background: white; max-width: 360px; margin: 100px auto 16px; padding: 32px 24px 16px; border-radius: 3px; }
body.not-found-page #message h3{ color: #888; font-weight: normal; font-size: 16px; margin: 16px 0 12px; }
body.not-found-page #message h2{ color: #ffa100; font-weight: bold; font-size: 16px; margin: 0 0 8px; }
body.not-found-page #message h1{ font-size: 22px; font-weight: 300; color: rgba(0,0,0,0.6); margin: 0 0 16px;}
body.not-found-page #message p{ line-height: 140%; margin: 16px 0 24px; font-size: 14px; }
body.not-found-page #message a{ display: block; text-align: center; background: #039be5; text-transform: uppercase; text-decoration: none; color: white; padding: 16px; border-radius: 4px; }
body.not-found-page #message, body.not-found-page #message a{ box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); }
body.not-found-page #load{ color: rgba(0,0,0,0.4); text-align: center; font-size: 13px; }
      @media (max-width: 600px) {body.not-found-page, body.not-found-page #message{ margin-top: 0; background: white; box-shadow: none; }
body.not-found-page{ border-top: 16px solid #ffa100; }
      }
    

/* Account aanmaken */

             @media only screen and (min-width: 768px) {body.account-create-page [class*"col-"]{
                    float: left;
                    padding: 15px;
                }
body.account-create-page .col-1{width: 8.33;}
body.account-create-page .col-2{width: 16.66%;}
body.account-create-page .col-3{width:25%;}
body.account-create-page .col-4{width: 33.33%;}
body.account-create-page .col-5{width: 41.66%;}
body.account-create-page .col-6{width: 50%;}
body.account-create-page .col-7{width: 58.33%;}
body.account-create-page .col-8{width: 66.66;}
body.account-create-page .col-9{width: 75%;}
body.account-create-page .col-10{width: 83.33%;}
body.account-create-page .col-11{width: 91.66%;}
body.account-create-page .col-12{width: 100%;}
            }
body.account-create-page header{
                text-align: center;
                width: 100%;
                height: 150px;
            }
body.account-create-page footer{
                width: 100%;
                height: 125px;
            }
body.account-create-page li{
                display: inline-block;
                height: 50px;
                width: 140px;
                text-align: center;
            }
body.account-create-page h1{
                margin-left: 200px;
            }
body.account-create-page #een{
                min-height: 300px;
                background-color: beige;
            }
            @media only screen and (min-width: 1200px){body.account-create-page header{
                    background-color: white;
                }
body.account-create-page footer{
                    background-color: white;
                }
            }
            

/* Mijn account */
body.account-page header{
                background-color: blue;
                width: 100%;
                height: 150px;
            }
body.account-page footer{
                background-color: blue;
                width: 100%;
                height: 150px;
            }
body.account-page ul a{
                color: white;
                text-decoration: none;
            }
body.account-page li{
                display: inline-block;
                height: 50px;
                width: 200px;
                padding: 12px;
                text-align: center;
                color: white;
                border-left: 2px solid yellow;
                border-right: 1px solid yellow;
                background-color: orange;
            }
body.account-page li:hover{
                background-color: white;
                border-style: none;
            }
body.account-page h1{
                margin-left: 200px;
            }