@font-face{font-family:"Freightsans Pro";src:url(/assets/fonts/freight-sans-pro-book-regular.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Freightsans Pro";src:url(/assets/fonts/freight-sans-pro-bold-regular.woff) format("woff");font-weight:700;font-style:normal;font-display:swap}
:root{--green:#3B8C58;--accent:#ED694B;--black:#000;--white:#fff;--font:"Freightsans Pro",system-ui,-apple-system,"Segoe UI",sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--black);color:var(--black);font-family:var(--font);font-size:18px;line-height:1.5}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.vh{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* knop */
.btn{display:inline-flex;align-items:center;gap:12px;background:var(--accent);color:var(--white);text-decoration:none;font-family:var(--font);font-size:16px;letter-spacing:.02em;padding:12px 26px;border:4px solid var(--green);border-radius:6px;transition:background .2s,transform .2s}
.btn:hover,.btn:focus-visible{background:#d9573a;transform:translateY(-1px)}
.btn:focus-visible{outline:3px solid var(--white);outline-offset:2px}
.btn .ico{width:16px;height:18px;flex:none}
.btn-float{position:fixed;right:25px;bottom:25px;z-index:50;font-size:22px;padding:12px 22px}
.btn-float .ico{width:20px;height:22px}

/* hero */
.hero{position:relative;min-height:80vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:40px;padding:60px 20px 140px;background:#1f3a24 url(/wp-content/uploads/2025/03/Hotsepot-10-copy.webp) center/cover no-repeat}
.hero::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.2)}
.hero>*{position:relative}
.hero h1{margin:0}
.hero h1 img{width:300px}
@media (max-width:960px){.hero{background-image:url(/wp-content/uploads/2025/03/Hotsepot-10-copy-960.webp)}}

/* menukaart */
.menu-wrap{position:relative;z-index:1;max-width:1440px;margin:-100px auto -100px;padding:0 20px}
.menu{background:var(--green);border-radius:20px;padding:40px;display:grid;grid-template-columns:1fr 1fr;gap:20px}
.card{background:var(--white);border-radius:20px;padding:20px 20px 24px 30px}
.card-wide{grid-column:1/-1}
.card h1,.card h2{font-size:30px;line-height:1.2;font-weight:700;margin:6px 0 24px}
.card-wide h2{border-top:4px solid var(--black);border-bottom:4px solid var(--black);padding:10px 10px 6px;margin:0 0 20px -10px}
.card ul{list-style:none;margin:0;padding:0 0 0 30px}
.card li+li{margin-top:10px}
.row{display:flex;align-items:flex-end}
.name,.price{font-weight:700;font-size:20px;line-height:1.3}
.price{white-space:nowrap}
.dots{flex:1 1 20px;min-width:20px;border-bottom:1px dotted var(--black);margin:0 10px 6px}
.desc{display:block;color:var(--accent);font-size:15px;margin-top:2px}

/* fotoband */
.band{min-height:80vh;background:#1f2e1f url(/wp-content/uploads/2025/03/Hotsepot-14-copy.webp) center/cover no-repeat}
@media (max-width:960px){.band{background-image:url(/wp-content/uploads/2025/03/Hotsepot-14-copy-960.webp)}}

/* footer */
.foot{border-top:5px solid var(--accent);background:var(--black);color:var(--white);text-align:center;padding:20px 20px 30px}
.foot-title{font-size:30px;font-weight:700;margin:0 0 20px;letter-spacing:.01em}
.foot address{font-style:normal;font-size:16px;line-height:1.5}
.foot address a{color:var(--accent);text-decoration:none}
.credit{font-size:13px;margin:50px 0 0}
.credit a{text-decoration:none}
.foot a:hover{text-decoration:underline}

/* linkspagina */
.sub .topbar{display:flex;justify-content:center;padding:30px 20px 130px;background:var(--green)}
.sub .menu-wrap{margin-bottom:60px}
.sub .menu{display:block}
.linklist{columns:3 220px;column-gap:30px;padding-left:10px!important}
.linklist li{break-inside:avoid;margin:0 0 6px!important;font-size:16px}
.linklist a{text-decoration:none}
.linklist a:hover{color:var(--accent);text-decoration:underline}

@media (max-width:1024px){
  .menu{padding:20px;gap:15px}
}
@media (max-width:767px){
  .menu{grid-template-columns:1fr;padding:15px}
  .menu-wrap{padding:0 10px}
  .card{padding:16px 16px 20px}
  .card ul{padding-left:6px}
  .card h1,.card h2{font-size:26px}
  .name,.price{font-size:18px}
  .hero{gap:50px}
  .btn-float{right:15px;bottom:15px;font-size:18px;padding:10px 16px}
  .band{min-height:50vh}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn{transition:none}}
body.sub{background:var(--green)}
@media (max-width:767px){.btn-float{font-size:15px;padding:8px 12px;gap:8px;border-width:3px}.btn-float .ico{width:14px;height:16px}}
